/*!
 * Start Bootstrap - Modern Business HTML Template (http://startbootstrap.com)
 * Code licensed under the Apache License v2.0.
 * For details, see http://www.apache.org/licenses/LICENSE-2.0.
 */

/* Global Styles */

html, body {
    height: 100%;
    background-color:#dfdfdf;    
}

.raleway, .raleway10, .raleway12, .raleway14, .raleway16, .raleway18, .raleway20, .raleway30, .raleway40 {
    font-family: 'Raleway', sans-serif;
   }

.raleway10{
    font-size: 10px;
    }

.raleway12{
    font-size: 12px;
   }

.raleway14{
   font-size: 14px;
}

.raleway16{
    font-size: 16px;
    }

.raleway18{
    font-size: 18px;
    }

.raleway20{
    font-size: 20px;
    }

.raleway30{
    font-size: 30px;
    }      

.raleway40{
    font-size: 40px;
    }        

.righteous, .righteous10, .righteous12, .righteous14, .righteous16, .righteous18, .righteous20, .righteous30, .righteous40, .righteous50 {
    font-family: 'Righteous', cursive;
    }    


.righteous10{
    font-size: 10px;
    }

.righteous12{
    font-size: 12px;
   }

.righteous14{
   font-size: 14px;
}

.righteous16{
    font-size: 16px;
    }

.righteous18{
    font-size: 18px;
    }

.righteous20{
    font-size: 20px;
    }

.righteous30{
    font-size: 30px;
    }      

.righteous40{
    font-size: 40px;
    }        

.righteous50{
    font-size: 50px;
    }      

.color-font-black{
    color:#000000;    
}    

.color-font-white{
    color:#ffffff;    
}    


.container {    
  padding:0;
  width: 1200px;
}


#menuContainer {    
    height:auto;
    width:1200px;
    background-image: url('../img/bandeauhead.jpg');
    background-repeat: no-repeat;
    z-index: 10;
}


.div-main-contact {
    margin-left:700px;
    margin-top:80px;
    z-index: 20;
    }


#mainMenu {
    margin-left:700px;
    margin-top:60px;
    z-index: 30;
}




.button-main-contact {
    background-color: #949494;
    color:#ffffff;
    margin-left:20px;  

}

.navbar-nav {
    margin: 0 0;
    z-index:100;
}

.nav > li>a {
    padding: 10px 10px;
    line-height:40px;
}


.nav > li>a:focus, .nav>li>a:hover {
    background-color: #ffffff;
    color:#949494;
}


.navbar-nav > li>a {
    color:#000000;
    background-color: #f1e726;
    /*font-weight:bold;*/
    z-index:100;
   
}



#carrouselLeft {    
    /*float: left; 
    height:500px;
    width:600px;*/
    height:500px;
    background-color:#ffffff;
    color:#000000; 
    padding-top: 40px;
    padding-left: 30px;
}


#carrouselRight {    
    /* float: right; 
    height:500px;
    width:500px; */  
    padding-left:0;
    padding-right:0;

    height:500px;
}



::selection{
  /*background-color: #c5d02a;*/
  background-color: rgba(197, 208, 42, 0.75);
  color: white;
}

/* Firefox */
::-moz-selection {
  background-color: #c5d02a;
  color: white;
}

.navbarStyle {
    text-transform: uppercase;
    color:#bbc2cb;
    font-weight:bold;
    }

.containerMenu {
    /* border-top:1px solid #4f4e53; */
    border-bottom:1px solid #4f4e53;
     }



.bandeau-competences { 
position:relative;    
height:113px;
width:1200px;
background-image: url('../img/bandeau_competences.jpg');
background-repeat: no-repeat;
padding-top:20px;
text-align:center;
color:#000000;
}

.button-main-competence {
    font-family: 'raleway', sans-serif;
    font-size:16px;
    background-color: #949494;
    color:#ffffff;  
    margin-bottom: 10px;
  
}

.button-main-competence:hover {
    
    background-color: #f1e726;
    color:#000000;   
  
}

.bandeau-main-choix {
    font-family: 'righteous', cursive;
    font-size:24px;
    background: linear-gradient(#ffffff, #f1e726);
    color:#000000;
  
    
}

.bandeau-entreprise {    
    height:113px;
    width:1200px;
    background-image: url('../img/bandeau_entreprise.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center; 


    text-align:center;
    color:#000000;
    padding-top:20px;
    }

.bg-body-entreprise {  
    height:auto;
    background-image: url('../img/bg_body_entreprise.png');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center; 
    
    color:#000000;
    padding:20px;
}


.bg-paire-competences {  
    height:auto;
    background-image: url('../img/bg_paire_competences.png');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center; 
    
    color:#000000;
   
}

.bg-impaire-competences {  
    height:auto;
    background-image: url('../img/bg_impaire_competences.png');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center; 
    
    color:#000000;
   
}



.btn-outline {
    color:#fff; background-color:#000000; border-color:#FFF; border:solid 1px;
}

.img-portfolio {
    margin-bottom: 30px;
}

.img-hover:hover {
    opacity: 0.8;
}

.lowercase {
  text-transform: lowercase;
  }
  
.uppercase {
  text-transform: uppercase;
  }

    
.aligncenter
{
text-align:center;
}
    
.alignleft
{
text-align:left;
    }
    
.alignright
{
text-align:right;
    }
    


/* Home Page Carousel */

 .carousel {
    height: 100%; min-height:500px;
    /***
    margin-top:20px;
    **/
}


 .carousel .item,
 .carousel .item.active,
 .carousel .carousel-inner {   
    width: 100%;    
}

.carousel .fill>img {
display: block;
height: auto;
max-width: 100%;
line-height: 1;
width: 100%; 
height: 100%;
}


.slidetitle
{
    font-family: 'raleway', sans-serif;
    background-color:rgba(229, 228, 226, 0.75);
    color: #000000;
    padding: 10px;
    display: inline;
    text-transform: uppercase;
    line-height: 1.4;   

}

.carousel-promo {
    z-index: 10;
    position: absolute;
    top: 10px;
    width: 500px;
    text-align:center;
}


.carousel-promo a {
color: #ffffff;
}    

/* competences */

.indexCompetence {
min-height:450px;
background-color:#ffffff;    
}

.indexTextCompetence {
min-height:215px;
background-color:#ffffff;
color:#262752
}


/* engagement*/

.indexEngagement {
    min-height:450px;
    margin-bottom:30px;
    border-right: 1px dashed #dfdfdf;
    }


.indexTextEngagement {
    min-height:300px;
    }



/* contact */
#divSendMail{
padding:0;
}

#btSendMail{
    display: inline-block;
    margin-top:20px;
    margin-bottom: 20px;
    padding: 6px 18px;
    border: 0 solid transparent;
    border-radius: 30px;
    text-align: center;
    font-family: 'ubuntu', sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 2.0;
    white-space: nowrap;
    vertical-align: middle;
    background-color: #949494;
    color:#ffffff;
    cursor: pointer;
}

.msgSendMail{
    background-color: #c5d02a;
    color:#ffffff;
    text-align: center;
    font-family: 'ubuntu', sans-serif;
    font-size: 24px;
}




/* Gallerie */
.vignetteBox {
margin-top:10px;
}

.info {
padding-top:30px;
}

/* 404 Page Styles */

.error-404 {
    font-size: 100px;
}




/* Footer Styles */

footer {
    /* margin: 50px -15px 0px -15px; */
    padding-top: 30px;
    padding-right: 30px;
    padding-left: 30px;
    padding-bottom: 30px;
    background-color: #efefef;
    color:#515151;
    }


.divFooter{
    min-height:180px;
    border-right: 1px dashed #000000;
    color:#515151;
}



footer a {
    color:#515151;
}

footer a:hover

footer li {
    padding-top:8px;
}

.tel{
    color:#e53d1b;
    font-size:24px;
    font-weight:bold;
    letter-spacing:1px;
}


/* Responsive Styles */


@media only screen and (max-width: 1024px) {


.container {    
    padding:0;
    width: auto;
    }

#menuContainer {
    height: auto;
    width: auto;
    }


 #mainMenu {
  
    margin-left:0;
   
   
    }
    

}




@media only screen and (max-width: 700px) {

    body {
       /* font-size:80%; */
    }
    
    .raleway10{
        font-size: 80%;
        }
    
    .raleway12{
        font-size: 80%;
       }
    
    .raleway14{
       font-size: 80%;
    }
    
    .raleway16{
        font-size: 80%;
        }
    
    .raleway18{
        font-size: 80%;
        }
    
    .raleway20{
        font-size: 80%;
        }
    
    .raleway30{
        font-size: 90%;
        }      
    
    .raleway40{
        font-size: 90%;
        }        


    .righteous10{
        font-size:  80%;
        }
    
    .righteous12{
        font-size:  80%;
        }
    
    .righteous14{
        font-size:  80%;
    }
    
    .righteous16{
        font-size:  80%;
        }
    
    .righteous18{
        font-size:  80%;
        }
    
    .righteous20{
        font-size:  80%;
        }
    
    .righteous30{
        font-size:  80%;
        }      
    
    .righteous40{
        font-size:  90%;
        }        
    
    .righteous50{
        font-size:  90%;
        }      
        



    h1,h2,h3,h4 {
        font-size:80%;
    }
 

    img {
       /* width:55%;*/
    }

    .container {    
        padding:0;
        width: 100%;
      }
      
      
    #menuContainer {            
          width:100%;   
      }

    .div-main-contact {
        display:none;
    }



    .img-portfolio {
        margin-bottom: 15px;
    }

 header.carousel .carousel {
        height: 70%;
    }

 #myCarousel {
 /* display: none; */
 }



 #carrouselLeft {    
    height:300px; 
}



 #carrouselRight {   
    height:300px; 
    position:relative;
}



.carousel .fill>img {
    height: auto;
    margin-left:auto; 
    margin-right:auto;
    }

.img-promo {
    width: 400px;
    margin-left:0; 
    margin-right:0;
    
}


.carousel-promo {
    z-index: 10;
    position: absolute;
    top: 10px;
    width: 100%;
    text-align:center;
}


 #mainMenu {
 position:relative;
 margin-left:0;
 margin-top:200px;
 color:#000000;
  border-bottom: 1px solid #b4b9c0;
 width:100%;
 height:auto;
 line-height:4.0em;
 vertical-align:middle;
 text-align:center;
 text-transform:uppercase;
 }

 .text-sm-center {
   text-align: center;  
 }

 .bandeau-competences { 
    margin-top:80px;
    height:30px;
    width:auto;
    background-image: none;
    background-color: #f1e726;
    padding-top:10px
  
    }

.bandeau-entreprise {    
    height:30px;
    width: auto;
    background-image: none;
    background-color: #ffffff;
    padding-top:10px
    }





 .indexCompetence {
    min-height:250px;
     
    } 

.indexTextCompetence {
    min-height:100px;
    }

.indexEngagement {
    min-height:300px;
    margin-bottom:20px;
    }

.indexTextEngagement {
    min-height:150px;
    }

.logoMobile{
    width:30%;
}
.divFooter{
        min-height:150px;
        border-right: 0px dashed #dfdfdf
    }
    


}

/* Contact */
#map { height: 500px; width:100%; }