/*
Theme Name: CaminhosDeSantiago
Theme URI: 
Author: 
Author URI: 
Description: Custom theme, May.2019
Version: 1.0
License: Proprietary
License URI: 
Tags: 
Text Domain: estreia
*/

/* -- global -- */

html {
	height: 100%;
	margin: 0;
	padding: 0;
}

body {
	height: 100%;
	background-color: #ffffff;
	font-family: arial, sans-serif;
	color: #045F70;
	margin: 0;
	padding: 0;
}







/* -- Estilos Estreia -- */

#googleMap {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
}








/* The side navigation menu */
.sidenav {
	height: 100%;
	width: 0;
	position: fixed;
	z-index: 10000;
	top: 0;
	left: 0;
	background-color:#a2d9e7;
	overflow-x: hidden;
	transition: 0.5s;
}

.sidenav div {
	padding: 30px 30px 75px 30px;
	width: 200px;
}

/* The navigation menu links */
.sidenav a {
	padding: 8px 8px 8px 0px;
	text-decoration: none;
	font-size: 25px;
	color: #818181;
	display: block;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}

/* When you mouse over the navigation links, change their color */
.sidenav a:hover {
	color: #f1f1f1;
}

/* Position and style the close button (top right corner) */
.sidenav .closebtn {
	position: absolute;
	top: 0;
	right: 25px;
	font-size: 36px;
	margin-left: 50px;
	color:#045f70;
}

/* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */
@media screen and (max-height: 450px) {
	.sidenav {padding-top: 15px;}
	.sidenav a {font-size: 18px;}
}

/*botão das estapas*/
.bt_etapas {
	background-color: #045F70;
	padding: 25px;
	color: #ffffff;
	cursor: pointer;
	font: 15px arial, sans-serif;
	left: 20px;
	position: absolute;
	top: 30%;
	text-align: center;
	border: 2px solid #a2d9e7;
	border-radius: 70px;
	z-index: 200; /* acima do mapa #googleMap z-index: 100 */
}

.title_panel {
	display: block;
	color: #ffffff;
	font: 16px arial, sans-serif;
	margin-bottom: 20px;
}

/*  Estilo para Checkbox */
/* The container */
.container {
	display: block;
	position: relative;
	padding-left: 35px;
	margin-bottom: 12px;
	cursor: pointer;
	font-size: 13px;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	color:#045F70;
	font: 13px arial, sans-serif;
}

/* Esconde browser's default checkbox */
.container input {
	position: absolute;
	opacity: 0;
	cursor: pointer;
	height: 0;
	width: 0;
}

/*checkbox Costumizada */
.checkmark {
	position: absolute;
	top: 0;
	left: 0;
	height: 22px;
	width: 22px;
	background-color: #eee;
}

/* On mouse-over do check */
.container:hover input ~ .checkmark {
	background-color: #ccc;
}

/*  blue background do check quanto selecionado */
.container input:checked ~ .checkmark {
	background-color: #045F70;
}

/* Cria o Check  */
.checkmark:after {
	content: "";
	position: absolute;
	display: none;
}

/* Mostra  checkmark quando está em modo check */
.container input:checked ~ .checkmark:after {
	display: block;
}

/* Estilo  checkmark */
.container .checkmark:after {
	left: 7px;
	top: 2px;
	width: 5px;
	height: 10px;
	border: solid white;
	border-width: 0 3px 3px 0;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}

/*  Botão Refresh*/
.bt_refreshmap {
	position:fixed;
	width:212px;
	padding: 24px;
	bottom: 0px;
	background-color: #045F70;
	overflow: hidden;
	z-index: 20000;
	font: 13px arial, sans-serif;
	color: white;
	text-align: center;
	left: -260px;
	-webkit-transition: all 0.9s;
	-moz-transition: all 0.9s;
	-ms-transition: all 0.9s;
	-o-transition: all 0.9s;
	transition: all 0.9s;
	/*border-radius: 0px 20px 20px 0px;*/
}

.bt_refreshmap:hover {
	background-color: #999;
	cursor: pointer;
}