/* @import url(http://fonts.googleapis.com/css?family=Overlock:400,700,400italic,700italic); */

/******************* NORMALIZE ******************************/
audio[controls],canvas,video {display: inline-block;*display: inline;*zoom: 1;}
html {overflow-y: scroll; /* 1 */-webkit-tap-highlight-color: rgba(0,0,0,0); /* 2 */-webkit-text-size-adjust: 100%; /* 3 */-ms-text-size-adjust: 100%;}
body {font-size: 100%; /* 1 */line-height: normal; /* 2 */margin: 0; /* 3 */}
body,input,button, textarea,select {font-family: sans-serif;}
img {border: 0; /* 1 */-ms-interpolation-mode: bicubic; /* 2 */}
a:focus {outline: thin dotted;}
a:hover,a:active {outline: 0;}
abbr[title] {border-bottom: 1px dotted;}
b, strong { font-weight: bold; }
blockquote {margin: 1em 40px;}
dfn {font-style: italic;}
mark {background: #ff0;color: #000;}
pre,code,kbd,samp {font-family: monospace, monospace; /* 1 */_font-family: 'courier new', monospace; /* 2 */font-size: 1em;}
pre {white-space: pre;white-space: pre-wrap;word-wrap: break-word;}
q {quotes: none;}
q:before,q:after {content: '';content: none;}
small {font-size: 75%;}
sub,sup {font-size: 75%;line-height: 0;position: relative;vertical-align: baseline;}
sup {top: -0.5em;}
sub {bottom: -0.25em;}
ul,ol {margin: 1em 0; padding: 0 0 0 40px;}
dd { margin: 0 0 0 40px;}
nav ul,nav ol {    list-style: none;}
figure {    margin: 0;}
form {margin: 0;}
fieldset {margin: 0 2px;padding: 0.35em 0.625em 0.75em;}
legend {margin-left: -7px;}
button,input,select,textarea {font-size: 100%; margin: 0; vertical-align: baseline;  vertical-align: middle;}
button,input {    line-height: normal; overflow: visible;}
button,input[type="button"], input[type="reset"], input[type="submit"] {cursor: pointer; /* 1 */-webkit-appearance: button; /* 2 */}
input[type="checkbox"],input[type="radio"] {box-sizing: border-box;}
input[type="search"] {-webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box;}
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none;}
button::-moz-focus-inner,input::-moz-focus-inner {border: 0; padding: 0;}
textarea {overflow: auto; /* 1 */vertical-align: top; /* 2 */}
table {border-collapse: collapse;border-spacing: 0;}
th,td {padding: 0;text-align: left; vertical-align: middle;}
.clear{clear:both;}
.center { text-align: center; }

/******************* GLOBAL ******************************/
html, body, #wrapper { min-height: 100%; height: 100%; }
body { background: #F3F3F3; }

body, input, select, textarea, div, section { font-family: 'PT Sans', sans-serif; font-size:26px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
#wrapper { margin:auto; position: relative; height: 100%; padding: 0px; }

header, #wrapper { width:100%; max-width: 800px; background: #FFF; }
header, section { position: relative; margin:auto; width:100%; }
#wrapper.wrapper_home { max-width: 100%; }

header { text-align: center; position: fixed; top:0; z-index: 10; }
header .brand { text-align: center; padding:20px 0px; width:100%; max-width:370px; }

#header_inner { height: 150px; }

#header_line { background: #e6e6e6; height: 70px; }
#header_line .header_col { float:left; height: 100%; }
#header_line .header_col.header_col_logo { width:10%;  }
#header_line .header_col.header_col_logo a { width:100%; height:100%; display: block; background-color: gray; line-height: 63px; }
#header_line .header_col.header_col_logo img { vertical-align: middle; width: 30px; }
#header_line .header_col.header_col_user { width:80%; line-height: 70px; }
#header_line .header_col.header_col_logout { width:10%; }
#header_line .header_col.header_col_logout a { width:100%; height:100%; display: block; background: #E8001E; line-height: 63px; }
#header_line .header_col.header_col_logout img { vertical-align: middle; }

#synchroLogs {
 	position: absolute;
	right: 10%;
	top: 0;
	background: #F0F0F0;
	height: 70px;
	width: 10%;
	text-align: center;
	line-height: 63px;
	text-decoration: none;
 }
#synchroLogs img { vertical-align: middle; }
#synchroLogs span { 
	position: absolute;
	bottom: -10px;
	background: #C01D1D;
	color: #FFF;
	display: block;
	width: 30px;
	height: 30px;
	line-height: 30px;
	border-radius: 30px;
	font-size: 20px;
	right: 5px;
}
#synchroLogs span.empty { background: #57E444; }

header h1 { background-color:#f45d2f; color:#FFF; padding: 10px 5%; margin: 0; font-size: 34px; text-align: left; line-height: 64px;  }
header h1#title_team { background-image: url(../img/front/icon_team.png); background-repeat: no-repeat; background-position: 20px 50%; padding-left: 100px; }
header h1#title_poubelles, header h1#title_results { background-image: url(../img/front/poubelles_mini.png); background-repeat: no-repeat; background-position: 20px 50%; padding-left: 100px; }
header h1#title_finish { background-image: url(../img/front/check_mini.png); background-repeat: no-repeat; background-position: 20px 50%; padding-left: 100px;  }

section { padding-top: 254px; background: #FFF; }
#section_inner { margin:auto;}

/******************* WELCOME ******************************/

section#home { text-align: center; overflow: hidden; margin-top: 0; padding-top: 0px; }
section#home img.brand { width:100%; max-width: 550px; padding: 50px 0px; }

/******************* CONNEXION ******************************/

#loginForm { width:80%; margin: auto; margin-bottom: 30px; }
#loginForm .text { font-size: 50px; background:#cdcdcd; color:white; padding: 20px; border: none; padding: 20px 10px; width: 100%; border: none; margin: 20px 0px; text-align: center; text-decoration: none; }
#loginForm .submit { font-size: 50px; background: #00AFE9 url(../img/front/icon_lock.png) no-repeat 10% 50%; color: #FFF; border: none; padding: 50px; padding-left: 20%; width: 100%; }

/******************* EQUIPES ******************************/

#teams_list { padding:0; width: 80%; margin: 40px auto; }
#teams_list li { list-style: none; margin: 10px 0px; position: relative; }
#teams_list a { display:block; background:#818181; color:white; text-decoration: none; font-size: 20px; padding: 20px; height: 110px; line-height: 110px; font-weight: 400; }
#teams_list a:after { content: "";display: block;width: 150px;height: 150px;background-color: #000;position: absolute;top: 0;right: 0; }
#teams_list a.link_poubelle:after { background: #000 url(../img/front/icon_poubelle2.png) no-repeat 50% 50%; }
#teams_list a.link_bulle-a-verre:after { background: #000 url(../img/front/icon_bulleverre2.png) no-repeat 50% 50%; }
#teams_list a.link_container:after { background: #000 url(../img/front/icon_truck2.png) no-repeat 50% 50%; }

/******************* POUBELLES ******************************/

#poubelles_stats { color:#8b8a8a; text-align: center; font-size: 30px; margin: 80px 0px; }

#link_search_poubelles { background: #0056A0 url(../img/front/icon_search.png) no-repeat 20px 50%;color: #FFF;text-decoration: none;display: block;height: 140px;padding-left: 180px;font-size: 50px;line-height: 130px; width: 280px; margin: auto; width: 80%; padding: 0; text-indent: 180px; }

.btn_tournee { display: block;background: #848484;color: #FFF;text-decoration: none;font-size: 50px;line-height: 130px; width: 70%; padding: 0px 5%; margin: auto; }

/******************* SEARCH / GEOLOCALISATION EN COURS ******************************/

#geolocalisation_running { color:#f45d2f; text-align: center; }
#geolocalisation_running a { color:#f45d2f; text-decoration: none; }
#geolocalisation_running .loading_fake { margin:30px 0px;}

/******************* RESULTATS ******************************/

.num_results { float:right; display:block; }

#results_list { padding:0;}
#results_list li { list-style: none; margin: 10px 0px; position: relative; }
#results_list li a { color:black;  display: block; text-decoration: none; }
#results_list li:nth-child(even) { background:#e7e3e6; background:url(../img/front/bg_gray.png) repeat;}
#results_list .product_picture { float:left; width:35%; padding-top: 17px; text-align: center;position: relative; }
#results_list .product_picture img { width:80%; }
#results_list .product_picture.checked img { opacity: 0.2; }
#results_list .product_picture .check { position:absolute; bottom:0; right:0; ;background: url(../img/front/check_orange.png) no-repeat 50% 50%; width:90px; height:75px; display:none; }
#results_list .product_picture.checked .check { display: block;}
#results_list .product_infos { float:left; width:65%; }
#results_list h2 { color:#f45d2f; margin: 5px 0px; }
#results_list h2 .distance { float: right;color: #767676;font-size: 20px;line-height: 66px;padding-right: 20px;}
#results_list p { margin: 7px 0px;  }

#searchForm { position: relative; margin: 10px 0px; }
#searchForm .text { background:#cdcdcd; color:white; padding:10px 30px; border: none; }
#searchForm .text:focus { outline:2px solid gray; }
#searchForm .submit { text-indent: -9900px; position: relative;background: #8b8a8a url(../img/front/icon_search3.png) no-repeat 50% 50%; width:53px; height:53px; border: none; }

/******************* ETAPES ******************************/

#product_current { margin-top: 5px; }
#product_current p { margin:0; color:#767676; }

#container_choice { text-align: center; position: relative; margin-top: 20px; }
#container_choice .container_level { width:320px; display: none; }
#container_choice .container_level.container_level_current { display:inline;}

#container_choice a.full_choice { position: absolute; color:white; text-decoration: none; left: 50%; width: 300px; margin-left: -150px; padding: 20px 0px; color: #8B8B8B;  }
#container_choice a.full_choice.full_choice_visible { color: #FFF;  }
#container_choice a#full_1 { bottom: 42px; padding: 18px 0px; }
#container_choice a#full_2 { bottom: 112px; padding: 22px 0px;; }
#container_choice a#full_3 { bottom: 188px; padding: 29px 0px; }
#container_choice a#full_4 { bottom: 280px; padding: 16px 0px; }

#stepValidation { text-align: center; margin: 10px 0px; }
.validation { font-size: 50px; margin: 10px auto; background: #89C657 url(../img/front/check50.png) no-repeat 10% 50%;color: #FFF;border: none;padding: 15px 10px;padding-left: 60px;width: 360px; display: block; text-decoration: none; text-align: center; }

.step_button { font-size: 50px; margin: 10px auto; color: #FFF;border: none;padding: 15px 10px;padding-left: 60px;width: 240px; text-decoration: none; display: block; padding-left: 100px; }
.step_button.step_button_ok {  background: #89C657 url(../img/front/check50.png) no-repeat 20px 50%; }
.step_button.step_button_close {  background: #f2142b url(../img/front/check_no.png) no-repeat 20px 50%; }

table#preview { margin:auto; width: 360px; }
table#preview td { vertical-align: top; padding: 0px 0px 40px; }
table#preview td.label { color:#8b8a8a; }

#problemsList { padding:0; width:360px; margin:auto;}
#problemsList li { list-style: none; margin: 10px 0px; position: relative; clear: both; line-height: 75px; }
#problemsList li .checkboximg { width: 90px;  height: 75px;  padding: 0 5px 0 0;  background: url(../img/front/checkbox_off.png) no-repeat 0px 0px;  display: block;  clear: left;  float: left; }
#problemsList li .checkboximg.clicked { background: url(../img/front/checkbox_on.png) no-repeat 0px 0px; }

#reloadPoubelles { vertical-align: middle; margin-right: 20px; } 

@media screen and (max-width: 640px) {	
  section#home img.brand { width: 80%; }
  #loginForm .text { font-size: 30px; }
  #loginForm .submit { font-size: 30px; padding: 20px 50px; background: #00AFE9; }
  header h1 { font-size: 24px; }
}