/* General */
*, *:after, *:before {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
body{
	background-color: #fff;
	font-family: 'Roboto Condensed','Arial', sans-serif;
}
a, a:hover{
	color: #333;
	font-weight: 700;
	text-decoration: none;
}
.flexbox{
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-flow: row wrap;
	justify-content: space-around;
}
.flexbox-dkt{
	display: block;
}
.flex-start{
	justify-content: flex-start;
}

/* Wrapper */
.wrapper{
	width: 100%;
	max-width: 23.12rem;
    height: 38.87rem;
	margin: 0.62rem auto 0;
	padding: 1.56rem;
	background-color: #e9e7e8;
}

/* Header */
header{
	display: block;
}

/* Main */
main{
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-flow: row wrap;
    margin-top: 0.62rem;
}

/* Figure */
main .figure-wrapper{
    flex: 1 40%;
    height: 9.37rem;
    margin: 0.62rem 0.31rem;
}
main figure{
	width: 100%;
	background-color: #5dbfa5;
	text-align: center;
}
main figure .logo{
	height: 6.87rem;
	padding-top: 1.06rem;
}
main figure figcaption{
	display: block;
	height: 2.5rem;
	line-height: 2.5rem;
	background-color: #fff;
	text-transform: uppercase;
}

main h1{
	display: inline-block;
	margin: 1.25rem 0;
	padding: 0.62rem 0.93rem;
	background-color: #fff;
	font-size: 1.12rem;
	text-transform: uppercase;
}

/* BONDIS search */
main .search{
	position: relative;
	flex: 2;
	height: 9.93rem;
	margin: 0 0.62rem 1.25rem 0;
	padding: 1.43rem 0.93rem 0.62rem;
	background-color: #a7d3c7;
}
main .search label{
	font-size: 0.81rem;
}
main .search input{
	width: 90%;
	margin: 0.18rem 0 0.93rem;
	padding: 0.56rem 0.5rem;
	background-color: #fff;
	border: 0;
	border-radius: 0;
	font-size: 0.75rem;
}
main .search .change-route{
	position: absolute;
	top: 3.87rem;
	right: 0.62rem;
}
/* BONDIS result */
main .result{
	flex: 1;
	height: 9.93rem;
	padding: 0.62rem 0.93rem 0.31rem;
	background-color: #c3dbd5;
}
main .result a{
	display: block;
	margin-bottom: 0.31rem;
	font-weight: 400;
}
/* BONDIS, SUBE, TRANSITO, GRAFICAS map */
main section.map{
	overflow: hidden;
	width: 100%;
	height: 12.5rem;
	background-color: #fff;
}
main section.map img{
	width: 100%;
}

/* SUBE points */
main .points{
	flex: 1;
	margin-top: 1.25rem;
}
main .points .box{
	flex: 1;
    margin: 0 0.2rem;
}
main .points .point-top{
	position: relative;
	width: 100%;
    height: 1.9rem;
	line-height: 1.9rem;
	margin-bottom: 0.6rem;
	color: #fff;
	background-color: #5dbfa5;
	font-size: 0.75rem;
}
main .points .point-top .icon{
	float: left;
    width: 2.18rem;
    height: 1.9rem;
	margin-right: 0.3rem;
	background-color: #2b323b;
}
main .points .point-top .checkbox{
	position: absolute;
	top: 0;
	right: 0;
}
main .points .point-top .checkbox input{
    margin-top: 0.56rem;
}

main .points .point-bottom{
	width: 100%;
	height: 6.25rem;
	background-color: #5dbfa5;
	text-align: center;
}
main .points .point-bottom a{
	display: block;
	width: 100%;
	height: 6.25rem;
	padding-top: 1.25rem;
	color: #fff;
	font-size: 1.56rem;
}

/* TRANSITO ref */
main .ref{
	width: 100%;
	margin-bottom: 0.93rem;
}
main .ref .box{
	flex: 1;
	text-align: center;
}
main .ref .box .title{
	height: 1.87rem;
	line-height: 1.87rem;
	color: #fff;
	background-color: #dd4757;
	font-size: 0.81rem;
	font-weight: 700;
	text-transform: uppercase;
}
main .ref .box .desc{
	padding: 0.31rem;
}
main .ref .box .desc img{
	width: 1.87rem;
}

/* GRAFICAS res-graficas */
main .res-graficas{
	margin-top: 0.93rem;
	padding: 0.5rem 0.62rem;
	background-color: #c2dbd5;
}
main .grafica{
	flex: 1 33%;
    padding: 0 0.2rem;
	font-size: 0.75rem;
}