@charset "utf-8";
/* CSS Document */

/* Reset et setting de base */
html, body {height:100%;margin:0;}
ul, li {margin:0;padding:0;} /* Reset les listes */
* {outline: none;}/*  Enlever le bug bleu de safari */
img { border: none; display: block;} /* Pour ne pas qu'il y aie un espace sous les images*/
a {text-decoration: none;outline-style:none; color:red;} /* enleve le pointillé rouge dans firefox */
a:hover {text-decoration: underline;}
h1, h2, h3, h4, h5{font-size: 1em;margin: 0;}
h2{font: 18px Verdana, Arial, Helvetica, sans-serif; font-weight:bold; margin-top:25px; margin-bottom:15px;}
h3{font: 14px Verdana, Arial, Helvetica, sans-serif; font-weight:bold; margin-top:15px; }
/* Structure */
body {color: #333; background: #fff; font: 14px Verdana, Arial, Helvetica, sans-serif;}

.wrapper {margin: auto; width: 955px; border: 1px #333 solid; position: relative;} 

#header {}
#top    {position:relative; z-index:200;}
#top a#homelink  {height:100px; left:20px; position:absolute; text-indent:-9999px; top:15px; width:150px; z-index:220;}
#coord{ width:470px; height:120px; margin-top:20px; }
#adresse{  float:right; padding:0;}
#adresse p{padding:0; margin:0;}


#contenu { padding-bottom:40px;}
#contenu ul li{margin-left:40px;}
	#colonnegauche {width: 645px; float: left; padding-top:20px; padding-left:70px;}
	#colonnedroite {width: 305px; float: right;}

#footer {text-align: center;color: #fff; font: 11px Verdana, Arial, Helvetica, sans-serif; background: url(../../images/footer.jpg) no-repeat; height:63px;margin:0; padding:0;}
#footer p{ margin:0; padding:0;padding-top:40px;}

/*DEFAULT*/
#colonnegauche #listeProduits a:link{ color:White;}
#colonnegauche #listeProduits a:visited{ color:White;}
#colonnegauche #listeProduits a:active{ color:White;}
#colonnegauche #listeProduits a:hover{ color:White; text-decoration:none;}
#concours{position:absolute; top:400px; right:40px;}

#colonnegauche #listeProduits ul, #colonnegauche #listeProduits ul li,  #colonnegauche #listeProduits ul li a  {list-style-type:none; margin:0; padding:0;}
#colonnegauche #listeProduits ul li:hover { margin:0; padding:0;  background: url(../../images/oversm.png) no-repeat;  }
#colonnegauche #listeProduits ul li a { padding-left:20px; height:28px; width:205px; display:block;}

.pdf{display:inline; margin:0; padding:0; width:22px; height:31px; vertical-align:text-bottom; margin-right:10px;}

.form { margin:20px 0; padding-bottom:25px;}
.form label {font-size:12px; font-family:Verdana; width:163px; line-height:20px; float:left; display:block; margin:0; padding:0; font-weight:600; padding:0 0 0 5px;}
.form label span {font-size:10px;}
.form label img {float:left; display:block; position:relative; padding:0 5px 0 0; margin:-5px 0 0;}
.form label.myCheckbox {width:50px; margin:8px 0 0;}
.form label.myCheckbox input {width:100%;}
.form input  {width:420px; margin:0; padding-left:6px;}
.form textarea {width:420px; margin:5px 0; height:120px; padding:2px 0;}
.form .commentaire {width:100%; margin: 0; float:left; overflow:hidden;}
.form .commentaire label {width:100%; padding:0;}
.form input.envoye {width:100px; float:right; margin:20px 0 0 0;}
.form p {font-size:12px; font-family:Verdana; width:auto; float:left; display:block; margin:0; padding:0; font-weight:600;}
.form .form-div {overflow:hidden; margin:2px 0; width:740px; float:left;}
    .form-div span {width:100%;}

.form .radio input  {width:auto;}
.form .radio label  {width:auto; display:inline-block; float:none;}

.form label.btn-selection {background:#000; color:#fff; font-size:10px; padding:7px 7px;}

#form-top {width:740px; margin:10px 0; padding:0; overflow:hidden;}
#form-top .form-div h3 {margin:0; font-size:14px; font-family:Verdana; font-weight:600; color:#000;}
#form-top label {font-size:12px; font-family:Verdana; width:235px; float:left; display:block; margin:0; font-weight:600;}
#form-top input  {width:490px; margin:5px 0;}
#form-top select {width:480px; margin:5px 0;}


#form-section01 {width:740px; background:#B4B5B4;overflow:hidden;}
#form-section01 .form-div {min-height:30px; overflow: initial; width:680px;}
.titre-form {background:url(/images/titre-form.jpg)no-repeat center center;}
.titre-form h2 {color:#fff; font-size:14px; padding:5px 5px 5px 25px; margin:0 0 25px;}

#form-section02 {width:740px;background:#B4B5B4;overflow:hidden;}

#form-section03 {width:740px;background:#B4B5B4;overflow:hidden;}
#form-section03 textarea {width:610px; margin:5px 0; height:86px; padding:2px 0;}

.form-div span.form-number {
    display: block;
    float: left;
    width: 20px;
    line-height: 20px;
    border: 1px solid black;
    border-radius: 50%;
    color: #b80000;
    text-align: center;
    font-size: 14px;
}

.form-div select{
    width: 480px;
    padding: 1px 2px;
}

.inputfile {
	width: 0.1px;
	padding:3px 0 0;
    border:1px solid rgb(169, 169, 169);
    background:#fff;
	overflow: hidden;
	//position: absolute;
    
}
.inputfile + label {
    font-weight: 500;
    font-size:12px;
    color:#fff;
    background-color: black;
    display: inline-block;
    text-align:center;
    padding:5px;
    position:relative;
    z-index:2;
}

.inputfile:focus + label,
.inputfile + label:hover {
    background-color:#E82027;
}
.inputfile + label {
	cursor: pointer; /* "hand" cursor */
}
.inputfile:focus + label {
	outline: 1px dotted #000;
	outline: -webkit-focus-ring-color auto 5px;
}
input#file {margin:0 0 0 55px; width:550px;}


.inside-form {width:660px; margin:0 0 0 50px; float:left;}

#fichier {color:#fff; background:#000; font-size:12px; width:210px; padding:5px;}
#fichier input[type="button" i] {background:#000; padding:10px; color:#fff;}

.ValidationSummary{
    padding: 10px 5px;
    border: 1px solid red;
    margin-bottom: 10px;
    background-color: #ff5252;
    color: #FFF;
}

/* PLAN DU SITE */
#plandusite ul {}
#plandusite ul li {
	background: url(../../images/puces/4.gif) 0px 6px no-repeat; 
	list-style-type: none;
	padding-left:20px;
	margin-top:10px;
}
#plandusite ul ul li{ margin-top:5px; background: url(../../images/puces/4b.gif) 0px 6px no-repeat;  }
#plandusite a { color:#333333; border-bottom:1px dotted #999999;}
#plandusite a:hover { border-bottom:none;}


/* Bon à savoir */
a.info:hover{z-index:25; background-color:#ff0}
a.info span{display: none}

/* rollover */
.rollOver {display: block;background-repeat: no-repeat;background-position: 0 0;float: left;}
.rollOver:hover {background-position: bottom right;}
.rollOver span {display: none;}
.icone {width: 354px;height: 34px;}

/* lien de la même couleur que le texte du contenant */
a.invisible {color:inherit;text-decoration:none;cursor:pointer;}
a.invisible:hover {text-decoration:underline;}
* html a.invisible, *+html a.invisible {color:expression(this.parentNode.currentStyle.color);} 

/* CLEAR FIX  */
.clearfix:after {content: ".";display: block;clear: both;visibility: hidden;line-height: 0;height: 0;}
.clearfix {display: inline-block;}
html[xmlns] .clearfix {display: block;}
* html .clearfix {height: 1%;}

#innerMenu {position:relative;}
#innerMenu ul a {text-indent:-9999px;}
#innerMenu ul a.current {background-position: bottom right;}
#innerMenu li.accueil a{width:129px; background-image:url(../../images/accueil.jpg);}
#innerMenu li.entreprise a{width:131px; background-image:url(../../images/entreprise.jpg);}
#innerMenu li.services a {width:219px; background-image:url(../../images/services.jpg);}
#innerMenu li.realisations a {width:150px; background-image:url(../../images/realisations.jpg);}
#innerMenu li.emplois a {width:100px; background-image:url(../../images/emplois.jpg);}
#innerMenu li.soumission a {width:138px; background-image:url(../../images/soumission.jpg);}
#innerMenu li.nousjoindre a {width:188px; background-image:url(../../images/nous-joindre02.jpg);}
#innerMenu .hmenu li {height:57px;}
#innerMenu .hmenu a {height:57px;}    
/* base pour les menu horizontal et vertical */
.hmenu {position:absolute;}
.hmenu li {display:block;position:relative;float:left; }
.hmenu a {display:block; }


#topContent{background:url(../../images/top-content.jpg) no-repeat; height:37px;}
#bottomContent{ background:url(../../images/bottom-content.jpg) no-repeat; height:30px;}
#contenu{ background:url(../../images/slice-content.jpg) repeat-y;}
#zonePhoto{margin-top:57px;}

.marginoff{margin:0; padding:0;}
/*SOUS-MENU Réalisations*/
#sousMenu{ background:url(../../images/sous_menu-slice.jpg) repeat-x; height:48px; width:814px; margin:0; padding:0;}
 #sousMenu ul.hmenu li {height:53px; margin:0; padding:0; margin-left:9px;}
 #sousMenu ul.hmenu li a { height:53px; cursor:pointer;}



#sousMenu ul.hmenu li a span{ display:none;}
#sousMenu ul.hmenu li#realFermeToit a{width:124px; background:url(../../images/menu-services/ferme-toit.jpg) no-repeat;}
#sousMenu ul.hmenu li#realFermeToit a:hover, #sousMenu ul.hmenu li#realFermeToit a.current {background:url(../../images/menu-services/ferme-toit.jpg) 0px -55px no-repeat; }

#sousMenu ul.hmenu li#realMur a{width:60px; background:url(../../images/menu-services/murs.jpg) no-repeat;}
#sousMenu ul.hmenu li#realMur a:hover, #sousMenu ul.hmenu li#realMur a.current {background:url(../../images/menu-services/murs.jpg) 0px -55px no-repeat; }

/*#sousMenu ul.hmenu li#realMurets a{width:73px; background:url(../../images/menu-services/murets.jpg) no-repeat;}
#sousMenu ul.hmenu li#realMurets a:hover, #sousMenu ul.hmenu li#realMurets a.current {background:url(../../images/menu-services/murets.jpg) 0px -55px no-repeat; }*/

#sousMenu ul.hmenu li#realPoutrellePlancher a{width:163px; background:url(../../images/menu-services/poutrelles-plancher.jpg) no-repeat;}
#sousMenu ul.hmenu li#realPoutrellePlancher a:hover, #sousMenu ul.hmenu li#realPoutrellePlancher a.current {background:url(../../images/menu-services/poutrelles-plancher.jpg) 0px -55px no-repeat; }

#sousMenu ul.hmenu li#realPoutreLVL a{width:103px; background:url(../../images/menu-services/poutres-lvl.jpg) no-repeat;}
#sousMenu ul.hmenu li#realPoutreLVL a:hover, #sousMenu ul.hmenu li#realPoutreLVL a.current {background:url(../../images/menu-services/poutres-lvl.jpg) 0px -55px no-repeat; }

/*#sousMenu ul.hmenu li#realBorduresRive a{width:130px; background:url(../../images/menu-services/bordures-rive.jpg) no-repeat;}
#sousMenu ul.hmenu li#realBorduresRive a:hover, #sousMenu ul.hmenu li#realBorduresRive a.current {background:url(../../images/menu-services/bordures-rive.jpg) 0px -55px no-repeat; }*/

#sousMenu ul.hmenu li#realColonneAcier a{width:130px; background:url(../../images/menu-services/colonne-dacier-ajustable.jpg) no-repeat;}
#sousMenu ul.hmenu li#realColonneAcier a:hover, #sousMenu ul.hmenu li#realColonneAcier a.current {background:url(../../images/menu-services/colonne-dacier-ajustable.jpg) 0px -55px no-repeat; }

#sousMenu ul.hmenu li#realLivraison a{width:89px; background:url(../../images/menu-services/livraison.jpg) no-repeat;}
#sousMenu ul.hmenu li#realLivraison a:hover, #sousMenu ul.hmenu li#realLivraison a.current {background:url(../../images/menu-services/livraison.jpg) 0px -55px no-repeat; }

#sousMenu ul.hmenu li#realCarriere a{width:89px; background:url(../../images/menu-services/carriere.jpg) no-repeat;}
#sousMenu ul.hmenu li#realCarriere a:hover, #sousMenu ul.hmenu li#realCarriere a.current {background:url(../../images/menu-services/carriere.jpg) 0px -55px no-repeat; }

#partenaires{position:absolute; bottom:48px; height:130px; overflow:hidden;} 
 .logosPart{display:inline-block; float:left; margin-top:15px; margin-right:20px;}
.btn-cvContent{width:305px;}
.btn-cv{width:173px; height:31px; display:block; margin-left:220px;} 

#contenu ul#listReal li{ list-style:none outside none;display:block;position:relative;float:left;margin-left:0; margin-left:10px; margin-bottom:30px; background-color:#efeeee; padding-bottom:15px;}
.realA a{background-color:#fff;
        border:1px solid #c6c6c6;
        display:block;
        height:105px;
        padding:13px;
        width:160px;}
.realA a:hover{text-decoration:none; background-color:#333;}

.liensicon{ position:relative; float:right; top:-60px;}

.red{color:Red;}
.black{color:Black;}

.listJobs{ margin:0; display:block; padding:15px; width:400px; height:24px; background-color:#c0c0c0; margin-top:5px; margin-bottom:5px; position:relative;}
.listJobs h2    {font-size:110%; font-weight:normal; margin:2px 0 0; width:55%;}
    .listJobs h2.twolines {
        margin-top: -7px;
    }
.listJobs a {
    background: url(../../images/btn_cv.gif) 80% top no-repeat;
    display: block;
    height: 31px;
    position: absolute;
    right: 10px;
    top: 12px;
    width: 172px;
}
.listJobs a:hover   {background-position:80% bottom;}
    .listJobs a.pop-up {
        background: url(../../images/pop-up.png) 100% no-repeat;
        display: block;
        height: 31px;
        position: absolute;
        right: 188px;
        top: 12px;
        width: 31px;
    }
        .listJobs a:hover {
            opacity:0.8;
        }
#contenuLivraison{width:400px; float:left;}
.liensutiles {background:url(../../images/liensutiles.jpg); height:80px; width:150px;}

.topMenu { position:absolute; top:5px; color: #ddd; z-index:201; text-transform: uppercase; font-family:Verdana, Arial, Sans-Serif; }
#lienplandusite { font-size:9px; right:20px; }
#emploistop {
    padding: 7px;
    background-color: #E41B23;
    font-size: 12px;
    right: 100px;
    background: -webkit-linear-gradient(#E41B23, #AC0B10); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#E41B23, #AC0B10); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#E41B23, #AC0B10); /* For Firefox 3.6 to 15 */
    background: linear-gradient( #E41B23, #AC0B10); /* Standard syntax */
} 
#emploistop:hover { text-decoration: none; opacity:0.8; } 

#btn-estimation {
    width:210px; height:55px; 
    margin:15px -170px 0 0; float:right;
    background:url(/images/demande_estimation.jpg)no-repeat center top;
}
#btn-estimation:hover {background-position:center bottom;}
#btn-estimation.btn02 {margin:15px -415px 0 0;}
#btn-estimation a {display:block; height:59px;}

#btn-estimation-home {
    width:232px; height:61px; 
    margin:190px 0 0 -5px; float:left;
    background:url(/images/demande_estimation02.jpg)no-repeat center top;
}
#btn-estimation-home:hover {background-position:center bottom;}
#btn-estimation-home a {display:block; height:59px;}

.modal {
    display:none;
    position:fixed;
    padding:5% 0;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background:rgba(0,0,0,0.4);
    z-index:1000;
}

    .modal .close {
        position:absolute;
        right:0;
        top:0;
        color:#999999;
        border:none;
        outline:none;
        background:none;
        font-size:25px;
    }

.modal-content {
    margin: auto;
    width: 800px;
    height: 100%;
    background: #fff;
    padding: 25px;
    position: relative;
    font-size: 14px;
    font-weight:400;
    overflow:scroll;
}

.modal-content img {
    width:100%;
}

    .modal-content span {
        display: block;
        color: #D03436;
        font-weight: 400;
    }

    .modal-content h3 {
        font-weight: 700;
        text-transform: uppercase;
        color: #D03436;
    }

.modal-content ul {
    list-style: none; /* Remove default bullets */
}
    .modal-content ul li {
        margin-top: 5px;
        margin-left: 13px !important;
    }
.modal-content ul li::before {
    content: "\25A0"; /* Add content: \2022 is the CSS Code/unicode for a bullet */
    color: #D03436; /* Change the color */
    font-weight: bold; /* If you want it to be bold */
    display: inline-block; /* Needed to add space between the bullet and the text */
    width: 1em; /* Also needed for space (tweak if needed) */
    margin-left: -1em; /* Also needed for space (tweak if needed) */
    transform: rotate(45deg);
}

    .modal-body .modal-main {
        display: inline-block;
        padding-top: 25PX;
        color:#999999;
        font-weight:bold;
        width: 60%;
    }
        .modal-body .modal-main p, .modal-body .modal-main li {
            color: #000;
            font-weight: 400;
        }

.modal-body .modal-main a {
    margin-top:15px;
    position:relative;
    right: 0;
    top: 0;
}
.modal-body .modal-sec {
    margin-top: 25PX;
    display: inline-block;
    padding: 25PX;
    width: 30%;
    float: right;
    background: #E4E4E4;
}