body{background: #b4d0ec url(../img/bg.png) repeat-x; font-family: arial;} .clearfix:before, .clearfix:after {content: "\0020"; display: block; height: 0; overflow: hidden;} .clearfix:after{clear: both;} #container { width: 948px; margin: 0 auto; z-index: 2;} #header { position: relative; background: transparent; width: 948px; height: 121px;} #logo{ /* position: absolute; top: 10px; left: 10px; */float: left; text-indent: -999999px;} #logo a { background: url(../img/abc_extermination.png) no-repeat; width: 205px; height: 95px; display: block;} #slogan { position: absolute; top: 64px; left: 287px; background: url(../img/resultats_gestion_parasitaire.png) no-repeat; width: 322px; height: 42px; text-indent: -999999px;} #slideshow { position: relative; width: 948px; height: 225px; z-index: 3;} #slide { position: absolute; top: 0; left: 0; width: 732px; height: 224px; margin: 0; padding: 0;} #protecteur { position: absolute; right: 13px; top: 0; background: url(../img/environnement.png) no-repeat; width: 205px; height: 157px; text-indent: -999999px;} #soumission_bt {z-index:999; display: block; position: absolute; top: 150px; right: 44px; background: url(../img/soumission_bt.png) no-repeat left top; width: 140px; height: 43px;} #soumission_bt:hover { background: url(../img/soumission_bt.png) no-repeat left bottom;} /* --------------------NAVIGATION-------------------- */ #nav { background: transparent; width: 948px; height: 33px; z-index: 999;} #nav { margin: 0 auto;} #nav li { position: relative; float: left; padding: 0 20px;} #nav li .diviseur { position: absolute; right: -7px; top: 0; background: url(../img/nav_line.png) no-repeat; width: 14px; height: 31px; display: block;} #nav li a { color: #fff; font-size: 14px; font-weight: bold; text-decoration: none; line-height: 31px;} #nav li a:hover { color: #b4d0ec;} #nav li.entreprise:hover ul, #nav li.joindre:hover ul { display: block;} #nav li ul { display: none; position: absolute; left: -7px; width: 120px; border: 2px solid #5d9206; border-top: none; z-index: 100;} #nav li ul li { float: none; background: #082143; border-top: 1px solid #294975;} #nav li ul li a { display: block; color: #fff; font-size: 14px; font-weight: bold; text-decoration: none; line-height: 31px; text-align: center;} #nav li ul li a:hover { color: #b4d0ec;} /* --CONTENT-- */ /*#content { position: relative;width:auto;background: #fff;padding: 0 0 50px 50px; z-index: 5; margin-bottom: 81px;}*/ #content { display:block !important; position: relative;background: #fff; width: 898px; padding: 0 0 50px 50px; z-index: 5; margin:0px auto;} /* --LEFT-- */ #left { position: relative; float: left; width: 632px; padding: 20px 50px 0 0;} #left p { font-size: 15px; color: #0b2f61; line-height: 18px;} #left p span { color: #4d7d04; font-weight: bold;} /*Ancien*/ #section { position: relative; background: #f1f6fc; background: -moz-linear-gradient(left, #f1f6fc, #fff); background: -webkit-gradient(linear, left top, right top, from(#f1f6fc), to(#fff)); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f1f6fc', endColorstr='#ffffff'); left: -50px; height: 32px; width: 682px; line-height: 32px; font-size: 20px; color: #4d7d04; padding-left: 50px; margin-bottom: 20px;} #section-contact { position: relative; background: #f1f6fc; background: -moz-linear-gradient(left, #f1f6fc, #fff); background: -webkit-gradient(linear, left top, right top, from(#f1f6fc), to(#fff)); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f1f6fc', endColorstr='#ffffff'); left: -50px; height: 32px; width: 682px; line-height: 32px; font-size: 20px; color: #4d7d04; padding-left: 50px; margin-bottom: 20px;margin-top: 20px;} #left div.table { position: relative; background: url(../img/table_bg.png) repeat-y; width: 592px; margin: 30px 0; padding: 10px 20px;} #left div.table .top { position: absolute; top: -10px; left: 0; display: block; background: url(../img/table.png) no-repeat top; width: 632px; height: 10px;} #left div.table .bottom { position: absolute; bottom: -10px; left: 0; display: block; background: url(../img/table.png) no-repeat bottom; width: 632px; height: 10px;} #left div.table h2 { font-size: 17px; color: #4d7d04; width: 632px; text-align: center;} #left div.table p.st { font-size: 17px; color: #4d7d04; width: 632px; text-align: center;} #left div.table p { line-height: 24px;} #googlemap { border: 1px solid #fff; width: 590px; height: 298px; display: block;} #choix { width: 632px; height: 300px; border-top: 1px solid #dbdada; border-bottom: 1px solid #dbdada; margin-top: 20px;} #choix p { font-size: 14px;} #choix h2 { font-size: 17px; color: #4d7d04; margin: 10px 0;} #choix h4 { font-size: 17px; color: #4d7d04; margin: 10px 0;} #choix div.left { float: left; padding: 20px 30px; background: #e3ecfc; width: 255px; height: 260px; border-right: 1px solid #dbdada; background: -moz-linear-gradient(right, #e3ecfc, #fff); background: -webkit-gradient(linear, right top, left top, from(#e3ecfc), to(#fff)); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e3ecfc', endColorstr='#ffffff');} #choix div.right { float: right; padding: 20px 30px; background: #e3ecfc; width: 256px; height: 260px; background: -moz-linear-gradient(left, #e3ecfc, #fff); background: -webkit-gradient(linear, left top, right top, from(#e3ecfc), to(#fff)); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e3ecfc', endColorstr='#ffffff');} #soumission ul { float: left; margin-bottom: 20px;} #soumission ul li { font-size: 15px; color: #0b2f61; line-height: 18px; height: 20px; } #soumission ul.label { width: 150px;} #soumission ul.label li { line-height: 22px; margin-bottom: 12px;} #soumission ul.input { width: 482px;} #soumission ul.input li { margin-bottom: 12px;} #soumission ul li { margin-bottom: 10px;} #soumission p { display: block; font-size: 15px; color: #0b2f61; line-height: 18px;} #soumission input { background: #dbe7fb; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#dbe7fb'); background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#dbe7fb)); background: -moz-linear-gradient(top, #fff, #dbe7fb); border: 1px solid #a5cefd; height: 20px; font-size: 12px; color: #0b2f61; width: 482px;} #soumission textarea { background: #dbe7fb; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#dbe7fb'); background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#dbe7fb)); background: -moz-linear-gradient(top, #fff, #dbe7fb); border: 1px solid #a5cefd; font-size: 12px; color: #0b2f61; width: 632px; margin-top: 8px;} #soumission input.send { float: right; background: url(../img/send_bt.png) no-repeat top; width: 163px; height: 38px; border: none; margin-top: 10px; cursor: pointer;} #soumission input.send:hover { background: url(../img/send_bt.png) no-repeat bottom;} #list { float: left; width: 325px; margin: 30px 0 0 14px; clear:} #list li { font-size: 15px; color: #0b2f61; line-height: 18px; list-style: disc outside; text-indent: 0px;} #left img.list { float: right;} .left{ position: relative; float: left; width: 632px; padding: 20px 50px 0 0;} .left h2 { position: relative; background: #f1f6fc; background: -moz-linear-gradient(left, #f1f6fc, #fff); background: -webkit-gradient(linear, left top, right top, from(#f1f6fc), to(#fff)); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f1f6fc', endColorstr='#ffffff'); left: -50px; height: 32px; width: 682px; line-height: 32px; font-size: 27px; font-weight:bold;color: #4d7d04; padding-left: 50px; margin-bottom: 20px;text-transform: uppercase;}/*ancien*/ .left h3 { position: relative; /*background: #f1f6fc; background: -moz-linear-gradient(left, #f1f6fc, #fff); background: -webkit-gradient(linear, left top, right top, from(#f1f6fc), to(#fff)); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f1f6fc', endColorstr='#ffffff');*/ left: -50px; height: 32px; width: 682px; line-height: 32px; font-size: 17px; font-weight:bold;color: #4d7d04; padding-left: 50px; margin-bottom: 20px;text-transform: uppercase;} img{max-width:100%;} /* -- RIGHT -- */ #right { float: right; position: relative; width: 216px; height: 560px; background: #dbe7fb; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#dbe7fb'); background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#dbe7fb)); background: -moz-linear-gradient(top, #fff, #dbe7fb); z-index: 6;} #identify { position: absolute; top: -28px; left: 0; background: url(../img/identifiez.png) no-repeat; width: 203px; height: 200px; text-decoration: none;} #identify span { display: block; color: #fff; font-size: 14px; font-weight: bold; width: 203px; text-align: center; line-height: 22px; text-decoration: none;} #identify span span, #identify span b { color: #4d7d04; text-decoration: none;} #identify span.text { position: absolute; bottom: 15px; right: 15px; width: 130px; color: #0b2f61; font-weight: normal; font-size: 13px; text-decoration: underline;} #secteur { position: absolute; top: 185px; left: 0; background: url(../img/list_secteur.png) no-repeat; width: 201px; height: 187px;} #secteur ul { margin: 35px 0 0 20px;} #secteur ul li { margin-bottom: 21px;} #secteur a { display: block; color: #fff; font-size: 14px; font-weight: bold; text-decoration: none;} #secteur a:hover { color: #a9dd09;} #coordonnees { position: absolute; top: 384px; left: 0;background: url(../img/coordonnees.png) no-repeat left top; width: 201px; height: 200px; padding: 50px 0 0 20px;font-size: 15px;} #coordonnees p { color: #0b2f61; font-size: 13px; font-weight: normal;} #coordonnees p span { color: #af061d; font-weight: bold;} #coordonnees p a { color: #0b2f61; font-size: 13px; font-weight: normal; text-decoration: underline; } #coordonnees a.carte { background: url(../img/loupe.png) no-repeat right top; padding-right: 20px;} #coordonnees p a:hover { color: #000;} /* -- FOOTER -- */ #footer { clear: both; width: 948px; height: 31px; background: #4d7d04; background: -moz-linear-gradient(left, #314a02, #4d7d04); background: -webkit-gradient(linear, left top, right top, from(#314a02), to(#4d7d04)); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#314a02', endColorstr='#4d7d04'); margin:0px auto; margin-bottom: 50px;} #footer p { color: #86b938; font-size: 11px; line-height: 31px; width: 948px; text-align: center;} #footer a { color: #86b938; text-decoration: underline;} #footer a:hover /* -- Accueil -- */ { color: #fff;} .home-right { float: right; position: relative; width: 216px; height: 560px; background: #dbe7fb; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#dbe7fb'); background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#dbe7fb)); background: -moz-linear-gradient(top, #fff, #dbe7fb); z-index: 6;} /* --------------------GUIDE D'IDENTIFICATION-------------------- */ #guide div.first { /*background: url(../img/first2.jpg)*/ no-repeat; width: 475px; height: 1084px; position: absolute; top: 0; left: 0;} #guide { height: 1003px; position: relative; background: #fff; width: 630px; margin: 30px 0; border-left: 1px solid #5b9000; border-right: 1px solid #5b9000;} #guide .top { position: absolute; top: -10px; left: -1px; display: block; background: url(../img/guide_rounded.png) no-repeat top; width: 632px; height: 10px;} #guide .bottom { position: absolute; bottom: -10px; left: -1px; display: block; background: url(../img/guide_rounded.png) no-repeat bottom; width: 632px; height: 10px;} #guide ul.nom { position: absolute; left: 0; top: 0; width: 155px; height: 1003px; background: #6a9c00; background: -moz-linear-gradient(top, #6a9c00, #468100); background: -webkit-gradient(linear, left top, left bottom, from(#6a9c00), to(#468100)); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6a9c00', endColorstr='#468100');} #guide ul.nom li { } #guide ul.nom li a { display: block; font-size: 12px; color: #fff; padding: 4px 0 4px 10px; text-decoration: none; cursor: pointer;} #guide ul.nom li a:hover { text-decoration: underline; background: #6da805; background: -moz-linear-gradient(left, #6da805, #457b02); background: -webkit-gradient(linear, left top, right top, from(#6da805), to(#457b02)); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6da805', endColorstr='#457b02');} #guide ul.nom li a.active { background: #6da805; background: -moz-linear-gradient(left, #6da805, #457b02); background: -webkit-gradient(linear, left top, right top, from(#6da805), to(#457b02)); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6da805', endColorstr='#457b02');} #photo_loader { background: #fff; position: absolute; top: 0; left: 155px; width: 475px; height: 218px;} #photo_loader img { margin: 40px 0 0 103px;} #photo_loader ul { background: #fff; width: 474px; height: 284px; margin-left: 1px;} #photo_loader ul li { position: relative; margin-left: 1px; float: left; width: 117px; height: 109px; background: #fff;} #photo_loader ul li img { position: absolute; top: 15px; left: 25px; margin: 0;} #photo_loader ul li a { display: block; width: 117px; height: 109px; cursor: pointer;} #photo_loader ul li a span { position: absolute; bottom: 10px; width: 117px; text-align: center; font-size: 11px; color: #333;} #photo_loader ul li a:hover span { text-decoration: underline;} /*Ancien*/ #text_loader { clear: both;} #text_loader h2 { color: #4a7f03; font-size: 15px; font-weight: bold; text-transform: uppercase;} #text_loader h3 { color: #0b2f61; font-size: 12px; font-weight: bold;} #text_loader p { color: #414141; font-size: 12px;} #text_loader ul li { margin-left: 50px; color: #414141; font-size: 12px; list-style: square inside; line-height: 18px;} #text_loader ul li ul li { margin-left: 50px;} /*nouveaux*/ .text-parasite{ clear: both;} .text-parasite img{text-align:center;margin-bottom:45px;} .text-parasite h3{ color: #4a7f03; font-size: 23px; font-weight: bold; text-transform: uppercase;text-align:center;} .text-parasite h4{ color: #0b2f61; font-size: 16px;margin-bottom:8px;margin-top:8px;font-weight: bold;} .text-parasite h5{ color: #0b2f61; font-size: 16px;margin-bottom:8px;margin-top:8px;font-weight: bold;} .text-parasite p{ color: #414141; font-size: 13px;margin-bottom:30px;} .text-parasite ul { margin-top:-13px;margin-bottom:35px;} .text-parasite ul li { margin-top:4px;margin-left: 50px; color: #414141; font-size: 12px; list-style: square inside; line-height: 18px;} .text-parasite ul li ul li { margin-left: 50px;} #title-include{ color: #0b2f61; font-size: 15px;margin-bottom:8px;margin-top:8px;text-transform: none;font-weight: bold;text-align:left;} #title-one{ color: #4a7f03; font-size: 23px; font-weight: bold; text-transform: uppercase;text-align:center;} .favorite-link{ position:absolute; display:inline-block; z-index:99; margin-left:748px; margin-top:5px; width:200px; text-align:right; } .favorite-link a{ color:#b31a1f; font-size:12px; font-family:Arial, Helvetica, sans-serif; } /*CONTACT*/ .title-city{ font-weight:bold; text-transform:uppercase; text-align:center; margin-top:260px; font-size:20px; } .top_header{width:475px;float: right;padding-top:15px;padding-bottom:10px; border-bottom:1px solid #dadada;} .top_header a{font-size:10px; color:#03315a;font-family: 'Montserrat', sans-serif;font-weight:300;text-decoration: none;float: left;line-height:18px;} .top_header a img{float: right;margin-left:6px;} .top_header a.email img{margin-top:4px;} .top_header a.phone img{margin:1px 7px 0;} .top_header .fb{font-size:10px; color:#03315a;font-family: 'Montserrat', sans-serif;font-weight:300;text-decoration: none;float: left;margin:0 20px;text-align:left;line-height:18px;position:relative;padding-right:15px;padding-left:15px;} .top_header a b{float: right;font-size:22px;color:#03315b;font-family: 'Montserrat', sans-serif;font-weight:400;} .top_header .fb a{float: right;margin-left:3px;} .top_header .fb a.googleplus{position:absolute;top:-2px;right:0;color:#519d00;font-size:26px;} #header a.soumissionb{float: right;border:2px solid #519d00;font-size:13px;color:#033059;text-transform: uppercase;font-family: 'Montserrat', sans-serif;font-weight:300;height:37px;line-height:37px;padding-left:15px;padding-right:32px;border-radius:4px;margin-top:-30px;text-decoration: none;} #header a.soumissionb .check{margin-top:8px;margin-right:20px;float:left;background:url('../img/icon1.png') no-repeat left top;width:22px;height:22px;} #header a.soumissionb:hover{border-color:#063f71;} #header a.soumissionb:hover .check{background:url('../img/icon1_hover.png') no-repeat left top;} .slicknav_menu {display:none;} .mobile_nav{display:none;} .owl-carousel .owl-item img{width:auto !important;} #protecteur{z-index:9999999;} @media screen and (max-width: 947px) { #menu{display:none;} .slicknav_menu {display:block;} .mobile_nav{display:block;width:100%;margin:20px auto 0;} .ditsp_nav{display:none;} #container{width:96%;} #header{width:100%;margin:0px auto;height:auto;} body{background-image:none;background-color:#b4d0ec;} #logo{float:left;} #logo a{margin:0px auto;} #slogan{display:none;} .top_header{width:190px;border:0px;} .top_header a{font-size:0px;} .top_header .fb{font-size:0px;margin:0px;} .top_header a.phone{margin-top:2px;} /*.top_header a.email{margin-left:32px;}*/ #header a.soumissionb{float:none;margin-top:0px;display:inline-block;width:83%;display:none;} #protecteur{display:none;} .conta{width:100% !important} #slideshow{width:100%;} .owl-carousel .owl-item img{width:100% !important;} #content{width:96%;padding-left:0px;} #left{width:100%;height:auto;padding-right:0px;} #right{height:auto;padding-left:0px;margin:30px auto 0;float: left;margin-left:33%;} #right a.identify{text-decoration: none;} #secteur, #coordonnees{position: static;} #identify{position:static;display:block;top:30px;margin-bottom:20px;} #identify span.text{position:relative;top:130px;left:40px;text-decoration: none;} #section{width:100%;left:0px;height:auto;padding:8px 0;right:0px;margin:0px auto 20px;text-align: center;} .left h2{width:100%;left:0px;padding-left:0px;} .left h3{width:100%;left:0px;padding-left:0px;} #left p{padding-left:15px;padding-right:15px;} #left div.table .top, #left div.table .bottom{display:none;} #left div.table{width:90%;padding-left:0px;padding-right:0px;margin:20px auto;border-radius:4px;} #left div.table h2{width:96%;} #left div.table p.st{width:96%;} #choix{width:100%;} #choix div.left, #choix div.right{width:100%;height:auto;padding:20px 0px;text-align:center;} #secteur ul{float:left;} #coordonnees{margin-top:20px;} #footer{width:100%;height:auto;text-align:center;} #footer p{width:100%;} #guide{height:auto !important;width:96%;margin:0px auto;left:0px;right:0px;border:1px solid #5b9000;} #guide ul.nom{height:auto !important;width:100%;position:static;left:0px;} #photo_loader{height:auto !important;width:100%;position:relative;left:0px;height:250px!important;} #guide .top{display:none;} #guide .bottom{display:none;} #guide ul.nom li{display:inline-block;} .left{width:96%;float: none;margin:0px auto;padding-right:0px;} #soumission{width:98%;margin:0px auto;} #soumission input{width:100%;} #soumission ul.input{width:80%;float:left;} #soumission ul.label{width:82px;} #soumission textarea{width:97%;} #soumission p{padding-left:0px;} #slideshow{height:auto;} #left p.dtails_c{width:98%!important;padding-left:0px;padding-right:0px;margin:0px auto!important;float:none!important;} #left .map_c{width:98%!important;padding-left:0px;padding-right:0px;margin:20px auto!important;float:none!important;} #left .map_c iframe{width:100%!important;} #section-contact{width:100%;padding-left:0px;text-align:center;left:0px;height:auto;padding:8px 0;} .title-city{margin-top:5%;} #list{width:84%;float:none;margin:0px auto;} #left img.list{float:none;display:block;margin:15px auto 5px;} #soumission input.send{float:left;} .left h2{height:auto;} #photo_loader ul{height:auto;width:100%;} #guide div.first{width:100%;} } @media screen and (max-width: 568px) { .top_header{float:none;margin:0px auto;} #logo{float:none;} img.logo{display:block;float:none;margin:0 auto;} } @media screen and (max-width: 480px) { #footer p{width:80%;margin:0px auto;} #photo_loader img{margin-left:10px;} #soumission ul.input{width:70%;float:left;} .text-parasite img{width:100%;} #right{margin-left:28%;} } @media screen and (max-width: 414px) { #right{margin-left:22%;} } @media screen and (max-width: 375px) { #right{margin-left:19%;} } @media screen and (max-width: 320px) { #right{margin-left:17%;} }