#menumobile{display: none;}
#boutonmenu{display: none;}
.clear{clear: both;}
a{text-decoration: none;}
body{font-family: Apercu, Helvetica, Arial, sans-serif;color: #fff;}

/* ---------------------Loader---------------------- */

#page{height: 100%;  position: relative;   z-index: 10;}

/* Loader */

#loader, #loader #container, #loader #container #logo, #loader #container #status #bar { position: absolute;}
#loader {background: #202224 url(../images/bg_up.jpg) repeat 0% 0%;  width: 100%;  height: 100%;  display: none;  z-index: 300;}
#loader #container, #loader #container #status, #loader #container #status #bar { width: 120px; }
#loader #container, #loader #container #status { height: 100px; }
#loader #container {padding: 0px; margin: -60px; top: 50%; left: 50%;}
#loader #container #logo, #loader #container #status #bar { left: 0; }
#loader #container #logo {background: transparent url(../images/logo.png) no-repeat 0 0; width: 120px; height: 120px;  top: 0;  z-index: 20; position:absolute;}
.svg #loader #container #logo { background-image: url(../images/logo.svg); }
#loader #container #status {
    background: #101112;
    position: relative;
    z-index: 10;
}
#loader #container #status #bar {
    background: #14cccc;
    height: 0;
    bottom: 0;
}


/*Head*/
#menu{position: fixed;	top: 0;	overflow: hidden;	z-index: 200;	width: 100%;}
header{height:117px; background:#000000 url(../images/bg_up.jpg) repeat 0% 0%; -moz-transition: all 0.2s linear;  -webkit-transition: all 0.2s linear;  -o-transition: all 0.2s linear; transition: all 0.2s linear;}
.logo{float:left; -moz-transition: all 0.2s linear;  -webkit-transition: all 0.2s linear;  -o-transition: all 0.2s linear; transition: all 0.2s linear;}

/*Menu fonts*/
nav{text-transform: lowcase;color: #fff;}
nav{display: inline-block; margin-left: 30px;}
nav ul {list-style-type: none;}
nav li {display: inline-block; margin-right:38px; margin-top:5%;}
nav li:last-child {margin-right:0px;}
nav a{color:#fff;font-size: 1.3em; -moz-transition: all 0.2s linear;  -webkit-transition: all 0.2s linear;  -o-transition: all 0.2s linear; transition: all 0.2s linear;}
nav a:hover{color:#00a7b9;}
nav .active{color:#00a7b9; font-weight:bold}

nav .tcbart A{display: inline-block; position: relative; background:url('../images/menu_icons.png') -432px -89px no-repeat; padding-top:36px;}
nav .tcbart A span {position: absolute; top: 0; left: 0; bottom: 0; right: 0; background:url('../images/menu_icons.png') -432px 0px no-repeat; opacity: 0; -webkit-transition:opacity 0.5s; -moz-transition:opacity 0.5s; -o-transition:opacity 0.5s;}
nav .tcbart A span:hover {opacity: 1;}
nav .tcbart .active span{opacity: 1;}

nav .web A{display: inline-block; position: relative; background:url('../images/menu_icons.png') -45px -89px no-repeat; padding-top:36px;}
nav .web A span {position: absolute; top: 0; left: 0; bottom: 0; right: 0; background:url('../images/menu_icons.png') -45px 0px no-repeat; opacity: 0; -webkit-transition:opacity 0.5s; -moz-transition:opacity 0.5s; -o-transition:opacity 0.5s;}
nav .web A span:hover {opacity: 1;}
nav .web .active span{opacity: 1;}

nav .mobile A{display: inline-block; position: relative; background:url('../images/menu_icons.png') -96px -89px no-repeat; padding-top:36px;}
nav .mobile A span {position: absolute; top: 0; left: 0; bottom: 0; right: 0; background:url('../images/menu_icons.png') -96px 1px no-repeat; opacity: 0; -webkit-transition:opacity 0.5s; -moz-transition:opacity 0.5s; -o-transition:opacity 0.5s;}
nav .mobile A span:hover {opacity: 1;}
nav .mobile .active span{opacity: 1;}

nav .print A{display: inline-block; position: relative; background:url('../images/menu_icons.png') -148px -89px no-repeat; padding-top:36px;}
nav .print A span {position: absolute; top: 0; left: 0; bottom: 0; right: 0; background:url('../images/menu_icons.png') -148px 0px no-repeat; opacity: 0; -webkit-transition:opacity 0.5s; -moz-transition:opacity 0.5s; -o-transition:opacity 0.5s;}
nav .print A span:hover {opacity: 1;}
nav .print .active span{opacity: 1;}

nav .packaging A{display: inline-block; position: relative; background:url('../images/menu_icons.png') -216px -89px no-repeat; padding-top:36px;}
nav .packaging A span {position: absolute; top: 0; left: 0; bottom: 0; right: 0; background:url('../images/menu_icons.png') -216px 0px no-repeat; opacity: 0; -webkit-transition:opacity 0.5s; -moz-transition:opacity 0.5s; -o-transition:opacity 0.5s;}
nav .packaging A span:hover {opacity: 1;}
nav .packaging .active span{opacity: 1;}

nav .misc A{display: inline-block; position: relative; background:url('../images/menu_icons.png') -309px -89px no-repeat; padding-top:36px;}
nav .misc A span {position: absolute; top: 0; left: 0; bottom: 0; right: 0; background:url('../images/menu_icons.png') -309px 0px no-repeat; opacity: 0; -webkit-transition:opacity 0.5s; -moz-transition:opacity 0.5s; -o-transition:opacity 0.5s;}
nav .misc A span:hover {opacity: 1;}
nav .misc .active span{opacity: 1;}

nav .contact A{display: inline-block; position: relative; background:url('../images/menu_icons.png') -357px -89px no-repeat; padding-top:36px;}
nav .contact A span {position: absolute; top: 0; left: 0; bottom: 0; right: 0; background:url('../images/menu_icons.png') -357px 0px no-repeat; opacity: 0; -webkit-transition:opacity 0.5s; -moz-transition:opacity 0.5s; -o-transition:opacity 0.5s;}
nav .contact A span:hover {opacity: 1;}
nav .contact .active span{opacity: 1;}



/*------------------------------Main----------------------------*/
#main{min-height:100%; height: auto !important; height:100%; margin:0 auto -100px; /*background: #000000 url(../images/bgautumn.jpg) 50% 0% no-repeat;*/ padding-left:70px;  padding-right:70px; overflow: hidden;}

#main .textIndex{margin-top:10%}
#main .textContact{margin-top:5%}
#main h1{font-weight: bold; font-size: 90px; padding-top: 80px; line-height:80px; margin-bottom: 20px;}
#main h1 span{color:#06c5da;}
#main h2{font-weight: bold; font-size: 30px;}
#main p{font-weight: normal; font-size: 20px; width:50%; padding-top: 0px; line-height: 24px; margin-bottom: 40px;}
#main a{padding:14px; background:#14cccc; color:#000; display:inline-block;	font-size: 16px;-moz-transition: all 0.2s linear;  -webkit-transition: all 0.2s linear;  -o-transition: all 0.2s linear; transition: all 0.2s linear;}
#main a:hover{background:#88f8f8;}

#main2{min-height:100%; height: auto !important; height:100%; margin:36px auto -100px; background: #000000 url(../images/bgautumn.jpg) 50% 0% no-repeat; padding-left:0px; overflow: hidden;}

#main .textContact a{padding:0px; background:none; color:#000; display:inline-block; font-size:16px; -moz-transition: all 0.2s linear;  -webkit-transition: all 0.2s linear;  -o-transition: all 0.2s linear; transition: all 0.2s linear;}
#main .textContact a:hover{background:#88f8f8;}

#main .hr{height:3px; width:auto; background:#19bebe; margin-top:30px;}

.cell{padding-top:20px;}
.cellbg{background:url('../images/bg_col4.png') 0px 0px repeat; display:inline-block}
.col4 {width:33.33333333%; float:left;}
.col4 h2 {font-weight: bold; font-size:24px;  padding:50px 40px 0px 40px; line-height:30px; margin-bottom: 10px;}
.col4 .fa{padding-right:14px;color:#14cccc}
.col4 p{color: #fff; font-size:16px!important; width:90%!important; line-height: 25px; padding:0px 40px 0px 40px;}
.col4 p .text-link{color:#14cccc!important; padding:0px!important; background:none!important; font-size:16px;-moz-transition: all 0.2s linear;  -webkit-transition: all 0.2s linear;  -o-transition: all 0.2s linear; transition: all 0.2s linear;}
.col4 p .text-link:hover{ text-decoration:underline}



/*-----------------------------Contact-----------------------------*/
#main .textContact a{}
#main .textContact a:hover{text-decoration:underline; background:none}

ol.phpfmg_form{list-style-type:none;  padding:0px;  margin:0px;}
ol.phpfmg_form input, ol.phpfmg_form textarea, ol.phpfmg_form select{border: 0px solid #fff; height:30px; padding:8px;}
ol.phpfmg_form li{margin-bottom:12px; clear:both; display:block; overflow:hidden; width: 100%}

.form_field, .form_required{font-weight: normal; font-size:16px; width:50%; padding-top: 0px; line-height: 24px;}
.form_required{color:red; margin-right:8px;}
.field_block_over{}

.text_box, .text_area, .text_select {width:300px;}
.text_area{height:80px;}

.form_error_title{font-weight: bold;  color: red;}

.form_error{background-color: #636262; border: 1px dashed #ff0000;  padding: 20px; margin-bottom: 10px;}
.form_error_highlight{background-color: #636262; border-bottom: 1px dashed #ff0000;}

div.instruction_error{color: red; font-weight:bold;}

hr.sectionbreak{height:1px; color: #ccc;}

#one_entry_msg{background-color: #F4F6E5; border: 1px dashed #ff0000; padding: 10px; margin-bottom: 10px;}

#frmFormMailContainer input[type="submit"]{padding: 14px; height:60px; background:#14cccc; color:#000; display:inline-block; -moz-transition: all 0.2s linear;  -webkit-transition: all 0.2s linear;  -o-transition: all 0.2s linear; transition: all 0.2s linear;}
#frmFormMailContainer input[type="submit"]:hover{background:#88f8f8;}

.form_button{ font-size:20px; padding-bottom:10px}
#thank_you_msg{font-size: 30px;}
#thank_you_msg b{font-size: 30px; font-weight:600; color:#88f8f8;}

select, option{font-size:13px;}



/*-----------------------------Footer----------------------------*/
#footer{height:100px; background:tranparent;clear: both; position:relative}
#footer p{color: #646869; font-size: 11px;	margin-left: 80px; display:inline-block; position:absolute; bottom:20px;}
.push{height:100px; clear: both;}