/*@media (max-width: 480px) {
    body{font-size: 10px;}
}

@media (max-width: 768px) {
    body{font-size: 14px;}
}*/

body{
	background-color: lightgrey;	
}

/**Navbar**/


.navbar-nav{
	font-family: 'Open Sans', sans-serif;
	/*font: 15px Montserrat, sans-serif;*/ /**TODO : choose which font**/
    text-align: center;
	background-color:#d5d5f6;
	font-weight: bold;
}

.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
    color: black;
    background-color: lightgrey; /*COLOR OF BACKGROUND NAV ELEMENTS ON CLICK**/
}

.navbar-nav li{
	float: none;
    display: inline-block;
	background: transparent;
}

@media (min-width: 768px) {
    .navbar .navbar-nav {
        display: inline-block;
        float: none;
        vertical-align: top;
    }

    .navbar .navbar-collapse {
        text-align: center;
    }
}


.navbar-brand{ /**Navbar La Ferme text**/
	font: 15px Montserrat, sans-serif;
    line-height: 1.8;
	font-size: 1.2em;
	padding-top: 5px !important;
}

@media (max-width: 768px) {
	.navbar-brand{
		font-size: 18px;
                padding-top: 10px !important;
	}
}

.navbar-collapse{
	text-align: center;	
}


#logo{
	max-width: 100%;
	height: auto;
	max-height:50px;
}

#navbar:hover{ /*On hover the navbar turns another color*/
	background-color: #d5d5f6;
}

#navbar{
 	margin-bottom: 0px;
	position:relative;
    top:0;
    z-index:10;
	background-color: #d5d5f6;
    width:100%;
	border-bottom: 1px solid transparent;
	border-top: 1px solid transparent;
	font-weight: bold;
	font-size: 1.2em;
}

nav.underline ul li a{
  text-decoration: none;
  color: rgba(0,0,0,.4);
  z-index: 1;
}

nav.underline ul li  a:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 3px;
  bottom: 0;
  left: 0;
  background: black; /*colour of underline*/
  visibility: hidden;
  border-radius: 5px;
  transform: scaleX(0);
  transition: .25s linear;
}
nav.underline ul li  a:hover:before,
nav.underline ul li  a:focus:before {
  visibility: visible;
  transform: scaleX(1);
}

@keyframes hover-v {
  0% {
      transform: scaleX(0);
      height: 5px;
     }
  45% {   
      transform: scaleX(1.05);
      height: 5px;
     }
  55% {height: 5px;}
  100% {
      transform: scaleX(1.05);
      height: 3.8rem;
     }
}
@keyframes no-hover-v {
  0% {
      transform: scaleX(1.05);
      height: 3.8rem;
     }
  45% {height: 5px;}
  55% {   
      transform: scaleX(1.05);
      height: 5px;
      opacity: 1;
     }
  
  100% {
      transform: scaleX(0);
      height: 5px;
      opacity: .02;
     }
}

.panel-footer{
	background-color:grey;
	
}

/**Contact**/ 


.google-maps iframe {
        position: relative;
        left:0;
				max-width:85%;
        height: 400px !important;
}


#informationBox{
	margin-top:15px;
	text-align: center;
	font-family: 'Open Sans', sans-serif;
	font-size:1em;
  background-color: #ffffff;
  opacity: 0.8;
  filter: alpha(opacity=80); /* For IE8 and earlier */

}

#individualInfo{
	list-style-type: none;
}

.first{
	margin-top: 50px; 
	text-align: center;
}

#map-container{
	max-width:90%;
	width: 90%;
	margin: auto;
}

#contact-title{
	text-align: center;
	font-family: 'Open Sans', sans-serif;
	font-size: 50px;
	font-weight: bold;
}

@media (max-width: 991px) {
   #contact-title{
		font-size: 25px;
	   
	}
	h4{
		font-size: 15px;
	}
}

@media  (max-width: 768px) {
    #contact-title{
		font-size: 25px;
	}
	h4{
		font-size: 15px;
	}
}

@media  (max-width: 480px) {
	#contact-title{
		font-size: 25px;
	}  
	h4{
		font-size: 15px;
	}
}

#myCarousel{
  position:relative; 
  margin:0 auto;
  margin-bottom:10px;
}

#title-carousel{
	padding-top: 500px;
	padding-bottom:0px;
}

#myCarousel{
	bottom:30px;
}

#textCarouselInner{
	top: 70px; 
	width:100%;
  	min-height: 100px !important;
}
#textCarouselIndicators{
	top: 50px;  
}

h4{
	color:black;
	margin:0;	
}


.refOnline{
	color:black;
}

.refOnline:hover{
	text-decoration: underline;
	color:black;
}

#contactinfo{
	color:black;
}

/***************************Bureaux******************/

#title-bureaux{
	margin-top:20px;
	text-align: center;
	font-family: 'Open Sans', sans-serif;
	font-size: 50px;
	
}

#intro-bureaux{
	margin-top:20px;
	text-align: center;
	font-family: 'Open Sans', sans-serif;
}

/**Salles de réunion**/

.sallesfirst{
	background-color:grey;
	
}

/************************************Promotions****************************/

.promotion{
	background-color:red;
	/*font-family: 'Abril Fatface';font-size: 22px;*/
	font-family: 'Open Sans', sans-serif;font-size: 22px;
}

@media  (max-width: 480px) {
	.promotion{
	  font-size: 15px;
	}
}