/*---- Général ----*/
body {font-family:Arial, sans-serif; font-size:13px; margin:0; padding:0; color:#2d2d2d; left:0; min-height:100%; position:absolute; top:0; vertical-align:top; width:100%;}

img {border:0;}
a {color:#ee6557;}
a:hover {}

header, footer, section, hgroup, aside, nav, article, figure, figcaption, time, dialog {display:block;}

div.taille {width:960px; margin:0 auto;}
div.erreur {text-align:center; color:red; margin:20px 0 0;}
div.messageValidation {color:#FFFFFF; font-size:15px; padding-top:10px; text-align:center;}
.orange2 {color:#ee6557 !important;}
.violet2 {color:#a769bc !important;}
.bleu2 {color:#16a6b6 !important;}

/******** Header ********/
header {box-shadow:0 3px 5px #D7D7D7; position:relative; z-index:999999;}
header div.taille {margin:0 auto; width:960px; height:80px;}
header div.taille a.logo {display:block; margin:0 0 0 130px; height:133px; width:129px;}

header div.taille nav {margin-top:-120px; padding-bottom:10px;}
header div.taille nav ul {overflow:hidden; margin:0; padding:0; list-style:none;}
header div.taille nav ul li {float:left; padding:20px 28px;}
header div.taille nav ul li.item {padding-left:180px;}
header div.taille nav ul li a {font-size:16px; color:#2d2d2d; text-transform:uppercase; text-decoration:none;}
header div.taille nav ul li a:hover {color:#ee6557;}
header div.taille nav ul li a.current {color:#ee6557;}

header div.menu-button {display:none;}


/******** Content ********/
div.contenu {margin-bottom:80px;}

/* Default */
div.contenu div.bandeau {background:#eeeeee;}
div.contenu div.bandeau div.taille {margin:0 auto; width:960px; overflow:hidden; padding:0 0 15px 0;}
div.contenu div.bandeau div.taille h1 {margin:0; padding: 55px 0 15px; font-weight:normal; text-align:center; font-size:22px;}
div.contenu div.bandeau div.taille h1 span {color:#ee6557;}
div.contenu div.bandeau div.taille div.video {float:left; width:60%; padding-top:10px;}
div.contenu div.bandeau div.taille div.video div.video-container {padding-top:25px; position:relative; padding-bottom:56.25%; padding-top:30px; height:0; overflow:hidden;}
div.contenu div.bandeau div.taille div.video div.video-container iframe,
div.contenu div.bandeau div.taille div.video div.video-container object,
div.contenu div.bandeau div.taille div.video div.video-container embed {position:absolute; top:0; left:0; width:100%; height:100%;} 
div.contenu div.bandeau div.taille article {margin:5px 0 5px 600px;}
div.contenu div.bandeau div.taille article table td.infos {padding-left:10px;}
div.contenu div.bandeau div.taille article table td img {display:block; width:112px;}
div.contenu div.bandeau div.taille article table td h2 {margin:0 0 5px 0; font-size:16px;}
div.contenu div.bandeau div.taille article table td h2 a {color:#2d2d2d; text-decoration:none;}
div.contenu div.bandeau div.taille article table td p {margin:0;}
div.contenu div.bandeau div.taille article table td p a {color:#2d2d2d; text-decoration:none;}

div.contenu div.form {background:#ee6557; margin:20px auto; width:930px; overflow:hidden; color:#fff; padding:15px;}
div.contenu div.form h3 {margin:0 0 10px 0; text-align:center; font-weight:normal; font-size:16px;}
table.formulaire {color:#fff; width:100%; background:#ee6557;}
table.formulaire td.lib {max-width:75px; padding:0 8px; text-align:right;}
table.formulaire td.textbox {padding:0 10px 0 0;}
table.formulaire td.textbox input {border:none; border-radius:3px; height:28px; width:100%;}
table.formulaire td.action {text-align:center;}
table.formulaire td.action input.button {background:#fff; border:none; height:50px; width:300px; border-radius:3px; text-transform:uppercase; color:#ee6557; font-size:16px; cursor:pointer;}
table.formulaire td.mentions {font-size:12px; font-style:italic; padding-top:5px; text-align:center;}



/* Pages */
div.contenu div.taille.page img.croquis {width:90%; margin:20px auto 30px; display:block;}

div.contenu div.taille.page article.bloc {float:left; width:25%; margin:25px 2% 0; padding:2%; border:1px solid #cccccc;}
div.contenu div.taille.page article.bloc img {display:block; position:absolute; margin: -44px 0 0 -44px;}
div.contenu div.taille.page article.bloc h3 {margin:0 0 20px 50px; font-size:18px; text-transform:uppercase; font-weight:normal;}
div.contenu div.taille.page article.bloc p {margin:0 0 5px 0;}
div.contenu div.taille.page article.bloc.orange p span {color:#ee6557; font-weight:bold;}
div.contenu div.taille.page article.bloc.violet p span {color:#a769bc; font-weight:bold;}
div.contenu div.taille.page article.bloc.bleu p span {color:#16a6b6; font-weight:bold;}
div.contenu div.taille.page article.bloc ul {margin:0; overflow:hidden;}
div.contenu div.taille.page article.bloc.orange ul {list-style-image:url("Images/checkOrange.png");}
div.contenu div.taille.page article.bloc.bleu ul {list-style-image:url("Images/checkBleu.png");}
div.contenu div.taille.page article.bloc.violet ul {list-style-image:url("Images/checkViolet.png");}
div.contenu div.taille.page article.bloc ul li {margin:0; padding:2px 0 3px 0;}


div.contenu div.taille.page h3 {margin:30px 10px 10px 10px; padding:0; font-size:16px; font-weight:normal;}
div.contenu div.taille.page div.cadre {padding:20px 20px 15px 20px; border:1px solid #cccccc;}
div.contenu div.taille.page div.cadre ul {margin:0; overflow:hidden; list-style-image:url("Images/checkNeutre.png");}
div.contenu div.taille.page div.cadre ul li {margin:0; padding:2px 0 3px 0;}
div.contenu div.taille.page h2 {margin:20px 0 0 0; font-size:18px; text-align:center; font-weight:normal;}
div.contenu div.taille.page h2 img {padding-right:10px; vertical-align:-16px;}

div.contenu div.taille.page div.form {margin-top:10px;}
table.formulaire.page td.textbox input {width:100%;}
table.formulaire.page td.action {padding:0;}
table.formulaire.page td.action input.button {height:30px; width:100px;}

table.formulaire.contact {color:#2d2d2d; margin:20px auto 0; width:350px; background:#ee6557;}
table.formulaire.contact td {padding:5px 0;}
table.formulaire.contact td.lib {width:118px;}
table.formulaire.contact td.textbox input {width:220px; border:1px solid #d2d2d2;}
table.formulaire.contact td.action input.button {background:#ee6557; border:none; height:40px; width:150px; border-radius:3px; text-transform:uppercase; color:#fff; font-size:16px; cursor:pointer;}

div.mentions h1 {padding:30px 0 10px 0 !important;}
div.mentions h2 {margin:20px 0 0 0; font-size:18px; color:#ee6557;}
div.mentions p {margin:5px 0 20px 0;}


/******** Footer ********/
footer {padding:5px 0; background:#2d2d2d; margin-top:15px; clear:both; bottom:0; left:0; position:absolute; width:100%;}
footer div.taille {margin:0 auto; width:960px; padding:5px;}
footer td.lien p span.mobile {display:none;}
footer p {color:#fff; padding:0 10px;}
footer p a {text-decoration:underline; color:#fff;}
footer a.GKel {margin-left:10px;}
footer a.Gmc {margin-right:10px;}












/*---- Tablette ----*/
@media all and (max-width:980px) and (min-width:480px) {
    div.taille {width:auto; padding:0 8px;}
    
    header div.taille {width:auto; padding:0 8px; height:80px;}
    header div.taille a.logo {margin:0 0 0 90px;}
    header div.taille nav ul li {padding:20px 11px;}
    header div.taille nav ul li.item {padding-left:132px;}

    div.contenu div.bandeau div.taille {width:auto;}
    div.contenu div.bandeau div.taille h1 {font-size:22px;}
    div.contenu div.bandeau div.taille div.video {margin-left:10px; width:50%; padding-top:30px;}
    div.contenu div.bandeau div.taille article {margin:0 0 0 55%;}

    div.contenu div.form {margin:20px 10px; width:auto;}

    footer div.taille {width:auto; font-size:12px;}

    #IframeContact {height:70px;}
    #IframeContactAccueil {height:140px;}
}
@media all and (max-width:799px) and (min-width:480px) {
    header div.menu-button {display:block;}
    
    header div.taille {padding:0; height:60px;}
    header div.taille a.logo {margin:0 0 0 50px; position:relative; z-index:999;}
    header div.taille a.logo img {height:110px; width:113px;}
    header div.taille nav {width:100%; max-height:0;}
    header div.taille nav.flexnav-show {margin-top:-80px; position:absolute; z-index:9;}
    header div.taille nav ul li {cursor:pointer; float:none; line-height:40px; padding:0 0 0 10px; background:#ee6557; border-bottom:1px solid #fff; text-align:center;}
    header div.taille nav ul li.item {padding-left:10px;}
    header div.taille nav ul li:hover {background:#f49c93;}
    header div.taille nav ul li a {display:block; cursor:pointer; float:none; overflow:visible; padding:0; color:#fff; text-decoration:none;}
    header div.taille nav ul li a:hover {color:#fff;}
    header div.taille nav ul li a.current {color:#fff;}

    div.contenu {margin-bottom:80px;}
    div.contenu div.bandeau div.taille h1 {padding:75px 20px 15px; font-size:20px;}
    div.contenu div.bandeau div.taille div.video {width:90%; margin:0 5%; float:none; text-align:center; padding-top:0;}
    div.contenu div.bandeau div.taille article {margin:10px 0 0 10px; float:left; width:30%;}
    div.contenu div.bandeau div.taille article table td {display:inline;}
    div.contenu div.bandeau div.taille article img {display:block; width:112px; float:none; margin:0 auto;}
    div.contenu div.bandeau div.taille article h2 {margin:0 0 5px 0px; font-size:16px; padding:8px 0 0 0; text-align:center;}
    div.contenu div.bandeau div.taille article p {margin:0 10px 40px 0px; text-align:center;}
}
@media all and (max-width:620px) and (min-width:480px) {
    header div.taille a.logo img {height:110px; width:113px;}
    div.contenu div.bandeau div.taille article {margin:10px 5%; float:none; width:90%;}
    div.contenu div.bandeau div.taille article table td {display:table-cell;}
    div.contenu div.bandeau div.taille article h2 {text-align:left;}
    div.contenu div.bandeau div.taille article p {text-align:left;}
    div.contenu div.form {display:none;}
    table.formulaire.contact {background:none;}

    div.contenu div.taille.page article.bloc {float:none; width:88%; margin:50px 2% 0 30px; padding:2%; border:1px solid #cccccc;}
    div.contenu div.taille.page table.tableau tr td {display:block; width:95%;}

    div.contenu {margin-bottom:125px;}
    div.messageValidation {color:#2d2d2d;}

    footer div.taille {margin-bottom:50px;}
    div.footerbtn {position:fixed; z-index:99999; bottom:0; height:50px; width:100%; background-color:rgba(255, 255, 255, 0.6); text-align:center;}
    div.footerbtn.important {display:block !important;}
    div.footerbtn a {background:#ee6557; color:#fff; display:block; font-size:16px; margin:6px auto 0; padding:8px 12px; text-align:center; width:150px; text-decoration:none;}
}



/*---- Mobile ----*/
@media all and (max-width:480px) {
    div.taille {width:auto; padding:0 8px;}
    
    header div.menu-button {display:block;}
    
    header div.taille {width:auto; padding:0; height:60px;}
    header div.taille a.logo {margin: 0 0 0 40px; position:relative; z-index:999;}
    header div.taille a.logo img {height:102px; width:105px;}
    header div.taille nav {width:100%; max-height:0;}
    header div.taille nav.flexnav-show {margin-top:-80px; position:absolute; z-index:9;}
    header div.taille nav ul li {cursor:pointer; float:none; line-height:40px; padding:0 15px 0 0; background:#ee6557; border-bottom:1px solid #fff; text-align:right;}
    header div.taille nav ul li.item {padding-left:10px;}
    header div.taille nav ul li:hover {background:#f49c93;}
    header div.taille nav ul li a {display:block; cursor:pointer; float:none; overflow:visible; padding:0; color:#fff; text-decoration:none;}
    header div.taille nav ul li a:hover {color:#fff;}
    header div.taille nav ul li a.current {color:#fff;}
    
    div.contenu div.bandeau div.taille {width:auto;}
    div.contenu div.bandeau div.taille h1 {padding:55px 20px 15px; font-size:16px;}
    div.contenu div.bandeau div.taille div.video {width:90%; margin:0 5%; float:none; text-align:center; padding-bottom:15px;}
    div.contenu div.bandeau div.taille article {margin:0 5%; float:none; width:90%;}

    div.contenu div.form {display:none;}
    table.formulaire.contact {background:none;}

    table.formulaire.contact {color:#2d2d2d; margin:20px auto 0; width:100%;}
    table.formulaire.contact td {padding:5px 0;}
    table.formulaire.contact td.lib {width:100px; text-align:left;}
    table.formulaire.contact td.textbox input {width:90%; border:1px solid #d2d2d2;}
    table.formulaire.contact td.action input.button {background:#ee6557; border:none; height:40px; width:150px; border-radius:3px; text-transform:uppercase; color:#fff; font-size:16px; cursor:pointer;}
    
    div.contenu div.taille.page img.croquis {width:100%;}
    div.contenu div.taille.page article.bloc {float:none; width:84%; margin:50px 2% 0 30px; padding:2%; border:1px solid #cccccc;}
    div.contenu div.taille.page article.bloc.acces3 {margin-bottom:135px;}
    div.contenu div.taille.page table.tableau tr td {display:block; width:95%;}
    div.contenu div.taille.page h4 {font-size:15px;}
    div.messageValidation {color:#2d2d2d;}
 
    div.mentions h1 {padding:50px 0 10px 0 !important;}
    
    div.contenu {margin-bottom:135px;}

    footer div.taille {width:auto; font-size:12px; margin-bottom:50px;}
    footer table tr td {display:inline;}
    footer td.lien p {margin:0;}
    footer td.lien p span.mobile {display:inline;}
    footer a.GKel img {display:none;}
    footer a.Gmc img {display:none;}

    div.footerbtn {position:fixed; z-index:99999; bottom:0; height:50px; width:100%; background-color:rgba(255, 255, 255, 0.6); text-align:center;}
    div.footerbtn.important {display:block !important;}
    div.footerbtn a {background:#ee6557; color:#fff; display:block; font-size:16px; margin:6px auto 0; padding:8px 12px; text-align:center; width:150px; text-decoration:none;}
}