@e-color-background: #fff;
@e-color-font: #333;
@e-color-link: #616161;
@e-color-link-hover: #333;
@e-color-link-open: #333;
@e-color-menu_bg: #fff;
@e-color-menu_bg-hover: #f9f9f9;
@e-color-menu_font: #4c4642;

@e-padding: 10px;

/* -------------------- BODY -------------------- */
@media (max-width: 767px){
  body {
    font-size: 11px;
    font-size: 2.3vw;
  } 
  .logoContainer{
		font-size: 1.4em!important;
  }
  .portfolioTitle {
    bottom: 0em;
    font-size: 1em;
  }
  .imgMax {
    max-width: 2.5em!important;
    max-height: 2.5em!important;
  }
  .item {
  height: 20em;
  height: 66vw;  
  }
  .portfolioTitleStatic {
    font-size: 1em!important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .item {
  height: 480px;
  }
}
@media (min-width: 992px) {
  .item {
  height: 627px;
  }

}
@media (min-width: 768px){
  body {
    font-size: 14px;
  } 
  .portfolioTitle {
    bottom: -4em;
    font-size: 0.8em;
    opacity: 0.8;
    transition: bottom  0.5s ease-out 0s, opacity 0.5s ease-out 0s;
    -webkit-transition: bottom 0.5s ease-out 0s, opacity 0.5s ease-out 0s;
    -moz-transition: bottom 0.5s ease-out 0s, opacity 0.5s ease-out 0s; 
    -o-transition: bottom 0.5s ease-out 0s, opacity 0.5s ease-out 0s; 
  }
  #portfolioItemId:hover #portfolioTitleId{
    bottom: 0px;
    transition: bottom 0.5s ease-out 0s, opacity 0.5s ease-out 0s;
    -webkit-transition: bottom 0.5s ease-out 0s, opacity 0.5s ease-out 0s;
    -moz-transition: bottom 0.5s ease-out 0s, opacity 0.5s ease-out 0s; 
    -o-transition: bottom 0.5s ease-out 0s, opacity 0.5s ease-out 0s;  
  }
}

body {
	font-family: Arial Narrow,Calibri,Helvetica,Arial;  
	line-height: 1.2;
	color: @e-color-font;
	background-color: @e-color-background;
	padding: 0;
  margin: 0;
}
a {
  color: @e-color-link;
  text-decoration:none;
}
a:hover {
  color: @e-color-link-hover;
  text-decoration:none;
}
 a:active {
  color: @e-color-link;
  text-decoration:none;
}
a:visited {
  color: @e-color-link;
  text-decoration:none;
}
hr {
	margin: 0;
	padding: 0;
	border-color: @e-color-link;
}

/* -------------------- OPERATORS -------------------- */
.inLine{
	display: inline;  
}
.noPadding{
	padding: 0!important;  
}
.gallPadding{
	padding: 5px!important;  
}
.w100 {
  width: 100%;
}
.h100 {
  height: 100%;
}
.mbppGrey{
 	color: #ADADAD; 
}
/* -------------------- HEADER -------------------- */
.headerContainer {
  padding-bottom: 1em;
  display: block;
}
  .logoContainer {
  	height: 3em;
    margin: 0.5em 0;
    font-size: 1.65em;
    font-weight: bold;
    vertical-align: bottom;
  }
  .textLogo {
    height: 3em;
		text-align: right;
    vertical-align: bottom;
    line-height: 0.5em;
  }
  .logoContainer > div {
      vertical-align: bottom;       
      display:inline-block;    
   	}
  .imgMax {
    max-width: 3em;
    max-height: 3em;
    position: absolute;
    left: 0;
    bottom: -0.2em;
  }
  a.mbppLink {
    position: absolute;
    right: 0;
    bottom: 0;
    color: @e-color-link-hover;
  }
  .menuContainer {
    display: block;
    height: auto;
  	text-align: center;
  }
  	.menuContainer > div {
      display: block;
      font-size: 1.2em;
      line-height: 3em;
      padding: 0;
  		font-weight: bold;
      text-transform: uppercase;      
    }
/* -------------------- FOOTER -------------------- */
.footerContainer {
  display: block;
  font-size: 0.7em;
  text-align: center;
  padding: 1.2em 0;
}
	.footerContainer > hr {
    padding-top: 1.2em;  
  }
/* -------------------- CONTENT -------------------- */
.content {
	min-height: 200px;
}
	/* ---------- PORTFOLIO ---------- */
  .portfolioItem {
    overflow: hidden;
  }
  .portfolioTitle {
    width: 100%;
    max-height: 4em;
    position: absolute;
    padding: 0.5em;
    margin: 0;
    text-align: center;  
    background-color: white;
  }
  .portfolioTitleStatic {
    font-size: 0.9em;
    
    width: 100%;
    float: left;
    height: 2.4em;
    padding: 0.2em;
    margin: 0;
    text-align: center;  
    background-color: white;
  }
  .negative {
 		margin: 0 -5px;
  }
	#portfolioItemId :hover ~ #portfolioTitleId > a{
    color: @e-color-link-hover;
	}
	.image-holder {
  	width: 100%; 
  }

  .portfolioImg {
    width: 100%;
    height: auto;
    /*--filter: sepia(60%);
    transition: filter 0.5s;
    -webkit-filter: sepia(60%);
    -webkit-transition: -webkit-filter 0.5s;
    -moz-transition: filter 0.5s;
    -o-transition: -webkit-filter 0.5s;*/
  }
  /*.portfolioImg:hover {
    filter: sepia(0%);
    transition: filter 0.5s;
    -webkit-filter: sepia(0%);  
    -webkit-transition: -webkit-filter 0.5s;
    -moz-transition: filter 0.5s;
    -o-transition: -webkit-filter 0.5s;
  }*/
  /* ---------- PROJECT ---------- */
  .projectImgDim{
    width: auto;
    height: auto;
    max-width:100%;
		max-height:100%;
    margin: 0 auto;
    display: block;
  }
	.sliderImgDim{
    width: 100%;
    height: auto;    
  }
  .sliderInd{
    text-align: center; 
    width: 100%;
    position: static;
    padding-bottom: 1em;
    float: right;
    overflow: hidden;  
  }
	.sliderIndDiv{
  	height: 3em;
  }
  .sliderInd li{
    float: none;
    width: 1em!important;
    height: 1em!important;
    margin: 1em!important;
    border-color: #616161;
    border-radius: 0;
    color: white;
    text-indent: 5000px;
  }
  li.active {
    background: #616161!important;
  }
	.carousel img {
   	width: auto;
		height: auto;
		vertical-align: middle;
  }
	.infoHeader{
  	font-weight: bold;
  }
  .show-more::after{
		
  }
  .show-less{
		display: none;
  }
/* ---------- OVERRIDING BOOTSTRAP ---------- */
@media (min-width:970px) and (max-width: 6500px) {
    .container {
     width:970px;
    }   
}