.cowemo { margin:0; padding:0; font-family:Arial, Helvetica, sans-serif; font-size:14px; overflow:hidden; background-color: #666;}
.contact.cowemo { background-color: #FFF;}
.wrap { margin:0; padding:0 }
a:link { color: #FFF; text-decoration: none; }
a:visited { text-decoration: none; color: #FFF; }
a:hover { text-decoration: underline; color: #FFF; }
a:active { text-decoration: none; color: #FFF; }
.clear { clear:both; }

#Page { position:absolute; width:100%; height:100%; margin:0; padding:0; left:0; bottom:0; top:0; z-index:1; overflow:hidden;  }
#Bottom { position:absolute; left:0; bottom:0; height:25%; min-height:130px; width:100%; text-align:center; background:#000 url(../img/bottom_bg.png) 0 0 repeat-x scroll; z-index:3; }
#Top { position:absolute; width:100%; height:75%; background: transparent url(../img/page_bg.png) 50% 100% no-repeat; overflow:auto; padding:0; margin:0; }

#Bottom h1 { margin:0; padding:0; }
#Bottom a#Logo { display:block; margin:30px auto 0 auto; width:200px; }
#Navigation { position:relative; top:0; height:40px; width:100%; background:#000 url(../img/navigation_bg.png) 0 0 repeat-x; overflow:hidden; text-align:center; }
#Navigation ul { list-style:none outside none; display:block; height:39px; margin:0 auto; max-width:480px; padding:0; border-right:1px solid #000; border-left:1px solid #222; }
#Navigation ul li { float:left; width:25%; margin:0; padding:0; text-align:center; }
#Navigation ul li a { text-transform:uppercase; font-size:13px; font-family: "Century Gothic", "Trebuchet MS", Helvetica, arial; padding-top:10px; display:block; height:29px; border-right:1px solid #222; border-left:1px solid #000; -moz-text-shadow: 0 -2px 0 #000000; -ms-text-shadow: 0 -2px 0 #000000; -webkit-text-shadow: 0 -2px 0 #000000; text-shadow: 0 -2px 0 #000000; }
#Navigation ul li a.active,
#Navigation ul li a:hover { text-decoration:none; background:#222 url(../img/navigation_over_bg.png) 0 0 repeat-x; }

#Tools { position:absolute; min-width:32px; height:32px; top:10px; left:-106px; z-index:3; background:transparent url(../img/tools_bg.png) 0 50% repeat-x; -webkit-border-top-right-radius: 10px; -webkit-border-bottom-right-radius: 10px; -moz-border-radius-topright: 10px; -moz-border-radius-bottomright: 10px; border-top-right-radius: 10px; border-bottom-right-radius: 10px; }
#Tools .wrap { height:32px; padding-left:30px; background:transparent url(../img/pictos32.png) 0 -192px no-repeat; }
#Tools a { display:inline-block; width:32px; height:32px; text-align:center; background:transparent url(../img/pictos32.png) 50% -192px no-repeat; margin-right:5px; }
#Tools a:hover { }
#Tools a span { display:none; }
#Tools a#FR { background-position:50% -224px; }
#Tools a#FR:hover,
#Tools a#FR.active { background-position:50% -288px; }
#Tools a#EN { background-position:50% -256px; }
#Tools a#EN:hover,
#Tools a#EN.active { background-position:50% -320px; }

#Contact .group {text-align:center;}
#Contact a.picto { display:inline-block; border:1px solid #000; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; width:38px; height:38px; background:#000 url(../img/navigation_bg.png) 0 50% repeat-x; margin:5px; padding:0;}
#Contact a.picto:hover { background:#222 url(../img/navigation_over_bg.png) 0 50% repeat-x; cursor:pointer;}
#Contact a.picto span {display:block; width:100%; height:100%; margin:0; padding:0; background:transparent url(../img/pictos32.png) 4px 2px no-repeat;}
#Contact a.picto span span {display:none;}

#Contact a#Email span {background-position:4px 2px;}
#Contact a#Phone span {background-position:3px -350px;}
#Contact a#ViewForm span {background-position:4px -30px;}
#Contact a#ViewMap span {background-position:4px -62px;}
#Contact a#Email:hover span {background-position:4px -94px;}
#Contact a#Phone:hover span {background-position:3px -382px;}
#Contact a#ViewForm:hover span {background-position:4px -126px;}
#Contact a#ViewMap:hover span {background-position:4px -158px;}

#Top .layer { width:100%; max-width:960px; margin:0 auto; position:relative;  /*padding-top:10%;*/ padding:20px 10px 1000px 10px; }
#Top .layer h2 { text-align:center; text-transform:uppercase; color:#FFF; font-size:26px; font-family: "Century Gothic", "Trebuchet MS", Helvetica, arial; font-weight:normal; margin-bottom:20px; line-height:32px; }
#Top .layer p { text-align:center; color:#FFF; font-size:18px; margin:0 0 10px 0;}
#Top .layer div { text-align:center; }
#Top .layer h2,
#Top .layer p { -moz-text-shadow: 1px 1px 2px #000000; -ms-text-shadow: 1px 1px 2px #000000; -webkit-text-shadow: 1px 1px 2px #000000; text-shadow: 1px 1px 2px #000000; }
#Top .layer a { text-decoration:underline; font-weight:bold; }
#Top .layer a:hover { /*text-decoration:overline;*/ color:#000; -moz-text-shadow: none; -ms-text-shadow: none; -webkit-text-shadow: none; text-shadow: none;}

#Top #Home { top:30%; }
#Top #Presentation { top:10%; }
#Top #Services { top:15%; }
#Top #Solutions { top:5%; }
#Top #Contact { top:15%; }
#Page .fancy { display:none; }

#RefCar { max-width:580px; margin:0 auto 20px auto; text-align:center; }
#RefCar ul { margin:0; padding:0; }
#RefCar li { list-style:none; display:inline; margin:0; padding:0; }
#RefCar li img { margin:0 12px 12px 0; }
.carousel { height:54px; overflow:hidden; position:relative;}
.carousel .mask-left { position:absolute; z-index:4; left:0; top:0; height:54px; width:100px; background: transparent url(../img/page_bg_mask_left_orange.png) right 0 no-repeat;}
.carousel .mask-right { position:absolute; z-index:4; right:0; top:0; height:54px; width:100px; background: transparent url(../img/page_bg_mask_right_orange.png) left 0 no-repeat;}
.carousel .scroller { width:100%; height:71px; overflow:hidden; overflow-x:scroll; white-space:nowrap; position:relative;}
#RefCar.carousel ul { display:inline-block;  }
#RefCar.carousel ul li { display:inline-block; }

/* ========================================================================== */
/* Form design */
/* ========================================================================== */

dl.form { margin:0; padding:0; position:relative; z-index:2; color:#333; font-family:Arial, Helvetica, sans-serif; }
dl.form form { margin:0; padding:0; position:relative; }
dl.form fieldset { margin:3px 0 12px 0; padding:0 0 10px 0; border:1px dashed #CCC; background:#F3F3F3 url(../img/form_bg.jpg) 0 0 repeat-x; }
dl.form legend { margin:0 0 0 5px; text-transform:uppercase; font-weight:bold; padding:0 4px; background-color:#FFF; color:#F60; }
dl.form input { font-size:11px; font-family:Arial, Helvetica, sans-serif; height:15px; border:1px solid #BBB; width:164px; margin:0; padding: 0 2px; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px; -ms-border-radius:4px; outline: 0 !important; }
dl.form input:hover { border-color:#999; }
dl.form input:focus { border-color:#999; background-color:#FED; }
dl.form input.disabled:hover,
dl.form input.disabled:focus,
dl.form input.disabled { background-color:#EEE; color:#999; border:1px solid #BBB; }
dl.form input.date { width:60px; }
dl.form input.datetime { width:90px; }
dl.form input.time { width:30px; }
dl.form input.short { width:50px; }
dl.form input.radio,
dl.form input.checkbox { width:auto; margin:1px 2px 1px 0; vertical-align:text-top; background-color:transparent; border:none; outline: 0 !important; }
dl.form select { font-size:11px; width:171px; }
dl.form select.multiple { height:87px; }
dl.form select.auto { width:auto; }
dl.form textarea { font-size:11px; font-family:Arial, Helvetica, sans-serif; height:120px; border:1px solid #BBB; width:94%; margin:0; }
dl.form button { margin:0; text-transform:uppercase; font-size:10px; line-height:10px; /padding-top:3px;
cursor:pointer; outline: 0 !important; }
dl.form dt { text-align:right; width:40%; float:left; clear:left; padding:1px 0 0 0; margin:7px 0 0 0; }
dl.form dt.full { width:auto; float:none; clear:both; text-align:left; margin-left:10px; display:none; }
dl.form dt.fixed { width:auto; float:none; clear:both; text-align:left; margin-left:10px; display:none; }
dl.form dt button { margin:-1px 6px 0 0; }
dl.form label { padding-right:3px; font-size:11px; }
dl.form a { font-size:11px; text-decoration:underline; }
dl.form a:hover { color:#000; }
dl.form dd.fixed a { display:block; text-align:center; }
dl.form dd { width:60%; float:left; padding:0; margin:7px 0 0 0; }
dl.form dd.full { width:auto; float:none; clear:both; padding:0 10px; }
dl.form dd.fixed { width:440px; float:none; clear:both; margin:10px auto 0 auto; padding:0; }
dl.form dd.full textarea { width:99.5%; height:127px;}
dl.form .col0 dd,
dl.form .col0 dt { width:50%; }
ul.errors { background:#FEE url(../img/warning.png) 10px 10px no-repeat; border: 1px solid #F00; padding:10px 50px; margin:10px 0; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px; -ms-border-radius:4px; position:relative; font-size:12px; }
ul.errors li { list-style-type:disc; margin:0; color:red; list-style-image:none; float:left; width:50%; padding:0; }
ul.errors li.clear { clear:both; float:none; list-style:none; }
ul.errors li a { color:red; text-decoration:none; }
ul.errors li a:hover { text-decoration:underline; }
dl.form .message { display:block; font-size:11px; }
dl.form .error.message { color:#F00; }
dl.form input.error,
dl.form textarea.error,
dl.form select.error { border:1px solid #F00; background:#FEE url(../img/error.png) 97% 3px no-repeat; color:#F00; }
dl.form input.ok,
dl.form textarea.ok,
dl.form select.ok { border:1px solid #090; background:#EFE url(../img/form_ok.png) 97% 3px no-repeat; }
dl.form label.required { padding-left:9px; background:url(../img/required.png) 0 5px no-repeat; }
#Captcha { display:block; width:440px; margin:0 auto !important; font-size:11px; }
#CaptchaContainer { margin-top:5px; }
#FormContact { padding:10px 20px 20px 20px; color:#333;}
#FormContact p {text-align:center; margin-top:20px;}

dl.form fieldset.col2 { width:308px; float:left; }
dl.form fieldset.col2.first { margin-right:20px }
dl.form fieldset.col0 { float:none; border:none 0px; clear:both; background:none transparent; }
dl.form fieldset.col1 { float:none; clear:both; }
#CaptchaContainer table { background-color:#FFF; }

@media screen and (max-width:580px)  {
	.cowemo {overflow:auto; min-height:100%;}
	#Page { position:relative; overflow:auto; height:inherit; height:auto; font-size:80%;}
	#Bottom { position:static; top:0; bottom:inherit; height:auto; min-height:inherit;  padding-bottom:10px;}
	#Bottom a#Logo { margin:10px auto 0 auto; }
	#Top {position:static; height:inherit; overflow:visible; padding-bottom:20px; background-image:none;}
	#Tools {top:49px; background:#000 none;}
	#Navigation ul li a {font-size:12px;}
	#Top .layer { position:static; padding:0; margin:0; width:auto;}
	#Top .layer h2 { font-size:18px; line-height:24px; padding:0 20px; }
	#Top .layer p { font-size:14px; padding:0 10px;}
	#Top .layer br { display:none; }
	/*#Contact a#ViewMap,*/
	#Contact a#ViewForm {display:none;}
	.carousel .mask-left,
	.carousel .mask-right { display:none; }
}

