/*
	Theme Name: Carro por Assinatura
	Theme URI: http://html5blank.com
	Description: HTML5 Blank WordPress Theme
	Version: 1.0
	Author: Daniel Spiess
	Author URI: https://ds-webdevelopment.com
*/

/*------------------------------------*\
    MAIN
\*------------------------------------*/

/* global box-sizing */
*, *:after, *:before {-moz-box-sizing:border-box; box-sizing:border-box; -webkit-font-smoothing:antialiased; font-smoothing:antialiased; text-rendering:optimizeLegibility;}
/* html element 62.5% font-size for REM use */
html {font-size:62.5%; margin: 0 !important;}
body {
	font-family: 'Open Sans', sans-serif;
	font-size: 14px;
	margin: 0;
	color: #444;
}
/* clear */
.clear:before, .clear:after {content:' '; display:table;}
.clear:after {clear:both;}
.clear {*zoom:1;}
img {max-width:100%; vertical-align:bottom; height: auto;}
a {color:#444; text-decoration:none;}
a:hover {color:#444;}
a:focus {outline:0;}
a:hover, a:active {outline:0;}
input:focus {outline:0; border:1px solid #04A4CC;}

/*------------------------------------*\
    STRUCTURE
\*------------------------------------*/

/* wrapper */
.wrapper {
	max-width:1280px;
	width:90%;
	margin:0 auto;
	position:relative;
}
.small_wrapper {
	max-width:800px;
	width:90%;
	margin:0 auto;
	position:relative;
}

.row {
	width: 100%;
	float: left;
}
.half {
    width: 100%;
    float: left;
}
.margin_top {margin-top: 30px;}

h1 {
    font-family: 'Exo', sans-serif;
    width: 100%;
    text-align: center;
	font-size: 22px;
	color: #009fe3;
}
h2 {
    font-family: 'Exo', sans-serif;
    width: 100%;
    text-align: center;
	font-size: 22px;
	color: #009fe3;
}
h3 {font-family: 'Exo', sans-serif; color: #009fe3; text-align: center;}
h4 {font-family: 'Exo', sans-serif; color: #009fe3;}

.flexbox{display: block;}

/*------------------------------------*\
    IMAGES
\*------------------------------------*/

.car, .certificate, .econimia, .facebook, .logo, .new_car, .parcelas, .passo, .practico, .seta, .todo_ano, .toggle, .woman, .worries 
{display:inline-block; overflow:hidden; background-repeat: no-repeat;
background-image:url(images/front-page.png);}

.car {width: 246px; height: 131px; background-position: 3.21337% 36.6181%; background-size: 416.260%; }
.certificate {float: left; width: 169px; height: 36px; background-position: 44.6784% 48.8866%; background-size: 605.917%; margin-top: -29px; position: relative; z-index: 999;}
.econimia {width: 120px; background-position: 48.1195% 36.1726%; background-size: 853.333%; }
.facebook {display: none; width: 42px; height: 42px; background-position: 32.0774% 49.1853%; background-size: 2438.10%; }
.logo {width: 140px; height: 50px; margin-top: 15px; background-position: 78.6561% 24.1090%; background-size: 386.415%; }
.new_car {width: 120px; background-position: 64.1593% 36.1726%; background-size: 853.333%; }
.parcelas {width: 120px; background-position: 80.1991% 36.1726%; background-size: 853.333%; }
.passo {width: 270px; height: 140px; background-position: 90.3177% 2.96209%; background-size: 282.094%; }
.practico {width: 120px;; background-position: 96.2389% 36.1726%; background-size: 853.333%; }
.seta {display: none; width: 90px; height: 100px; background-position: 32.5275% 36.4955%; background-size: 898.246%; }
.todo_ano {width: 120px; background-position: 2.76549% 53.4292%; background-size: 853.333%; }
.toggle {width: 54px; height: 60px; background-position: 91.4433% 23.8589%; background-size: 1896.30%; }
.woman {width: 547px; height: 277px; background-position: 5.24109% 3.34672%; background-size: 187.203%; }
.worries {width: 120px; background-position: 18.8053% 53.4292%; background-size: 853.333%; }

/*------------------------------------*\
    HEADER
\*------------------------------------*/
header {
	width: 100%;
	height: 80px;
	float: left;
	background: #009fe3;
}

.logo_box {
    display:inline-block;
    width: auto;
    height: 90px;
    background: #fc8715;
    padding: 0 15px;
    border-radius: 0 0 10px 10px;
    
}
.logo-wrap {width: 50%;
float: left;
text-align: center;}

.facebook_icon {
    width: auto;
    height: 42px;
    float: right;
    margin-top: 29px;
}

.mobile_toggle {
    height: 60px;
    width: auto;
    margin: 10px 0;
}
.header_menu {
    width: auto;
	float: right;
	font-family: 'Exo', sans-serif;
	font-size: 20px;
	font-weight: 800;
}
#menu_top_level {
	display: none;
}
.header_menu ul {
    list-style: none;
    background: rgba(0, 159, 227, 0.8);
    position: absolute;
    top: 60px;
	right: 0;
	padding: 10px;
	z-index: 999;
}
.header_menu li {
	margin: 0 0 10px 0;
}
.header_menu a {
    color: #fff;
	cursor: pointer;
	padding: 5px;
}

/*------------------------------------*\
    FRONT-PAGE
\*------------------------------------*/
/* Banner */
.certificate_wrapper {width: 169px; margin: 0 auto;}
.left_form {
    width: 100%;
    height: auto;
    float: left;
}
.right_form {display: none;}
.form_holder {
    width: 100%;
    max-width: 350px;
    margin: 0 auto;
}
.banner_lead {
	width: 100%;
    color: #009fe3;
    font-family: 'Exo', sans-serif;
	font-size: 20px;
	font-weight: 800;
    text-align: center;
}
.banner_call {
	width: 100%;
    color: #009fe3;
    font-family: 'Exo', sans-serif;
	font-size: 18px;
    text-align: center;
}
.cep {
    font-family: 'Exo', sans-serif;
    font-size: 16px;
    font-weight: 800;
    width: 200px;
    margin: 0 auto;
	display: flex;
	padding: 5px;
}
.simular_button {
    background: #fc8715;
    border: none;
    border-radius: 10px;
    color: #fff;
    font-family: 'Exo', sans-serif;
    font-size: 20px;
    font-weight: 600;
    padding: 8px 12px;
    margin: 20px auto;
    display: flex;
}
.banner {
    width: 100%;
    height: 245px;
    float: left;
}

/* FRONT */
.blue_bar {
	width: 100%;
	height: 25px;
	background: #009fe3;
	float: left;
	border-bottom: 10px solid #fff;
}
.blue_row {
	width: 100%;
	height: auto;
	background: #009fe3;
	float: left;
	padding: 20px 0;
}
.minus_margin {margin-top: -5px;}
.assinatura h1 {
	color: #fff;
	margin-top: 0;
}
.assinatura p {
    width: 100%;
    float: left;
    color: #fff;
}
.assinatura span {
    width: 100%;
    float: left;
}
.assinatura span img {
	width: 80%;
	max-width: 200px;
    margin: 0 10%;
}
.assinatura span p {
    font-weight: 800;
	width: 80%;
	max-width: 200px;
    margin: 0 10%;
    text-align: center;
}
.featured {
    width: 100%;
    height: auto;
    border: 1px solid #009fe3;
    border-radius: 10px;
    overflow: hidden;
	float: left;
	margin-bottom: 20px;
}
.featured_thumbnail {
    width: 100%;
    height: 200px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.featured h3 {
	width: auto;
    margin: 10px 10px;
}
.featured p {
	width: auto;
    margin: 10px 10px;
}
.featured .view-article {
    color: #009fe3;
    float: left;
    width: 100%;
}

.item {
    width: 100%;
    float: left;
    margin: 0 0 5px;
}
.item img {
    width: 25%;
    float: left;
}
.item span {
    width: 70%;
    margin-left: 5%;
    float: left;
}
.item h4 {
    color: #5a5a5a;
    margin: 0 0 2px;
    font-size: 16px;
}

.passo_a_passo {color: #fff;}
.passo_a_passo h2 {color: #fff; margin-top: 0;}
.passo_a_passo span {
    width: 100%;
    float: left;
}
.passo_a_passo span p {
    font-weight: 800;
    width: 80%;
    max-width: 200px;
    margin: 0 10%;
    text-align: center;
}
.passo_a_passo ol {
    width: 100%;
    float: left;
    padding: 0 0 0 20px;
}
.passo_a_passo li {margin-bottom: 15px;}
.passo_a_passo h4 {
    width: 100%;
    float: left;
    color: #fff;
    font-size: 20px;
    text-align: center;
}
.passo_a_passo .simular_button {
    font-size: 20px;
    font-weight: 700;
    text-transform: uppercase;
    cursor: pointer;
}
.recent_post {
    width: 100%;
    height: auto;
    float: left;
}
.recent_post h3 {
    width: 100%;
    color: #5a5a5a;
    margin: 10px 0 5px;
}
.small_holder {
    max-width: 460px;
    margin: 0 auto;
}

/*------------------------------------*\
	Pages
\*------------------------------------*/
.main {
    width: 100%;
    float: left;
}
.sidebar {display: none;}
.pagination {width: 200px; margin: 0 auto;}
article {font-size:16px;}
/*------------------------------------*\
	Footer
\*------------------------------------*/
footer {
    width: 100%;
    float: left;
    padding: 15px 0;
    background: #009fe3;
    margin-top: 30px;
}
footer p{color: #fff;}


/*------------------------------------*\
    !!!!!!!  MIN-WITH 480PX  !!!!!!!
\*------------------------------------*/
@media only screen and (min-width:480px) {
/* Images */
.seta {
    display: block;
    margin-top: 105px;
    margin-bottom: -215px;
    margin-left: -28px;
}
.passo {
    width: 190px;
    height: 106px;
    float: right;
}

/* Front Page */

.banner_lead {
	font-size: 26px;
}
.banner_call {
    font-size: 22px;
}
.banner {
    height: 280px;
}
.assinatura p {
	width: 48%;
	margin: 10px 1%;
}
.assinatura span {
	width: 48%;
	margin: 10px 1%;
}
.featured {
    width: 48%;
    margin: 0 1% 20px;
    height: 450px;
}
.passo_a_passo span {
    width: 45%;
    margin-right: 5%;
}
.passo_a_passo ol {
    width: 50%;
}
.passo_a_passo span p {
    float: right;
}

}
/* END MEDIA QUERY*/

/*------------------------------------*\
    !!!!!!!  MIN-WITH 768PX  !!!!!!!
\*------------------------------------*/
@media only screen and (min-width:768px) {
h1 {font-size: 25px;}
h2 {font-size: 25px;}
.half {
    width: 48%;
    margin: 0 1%;
}

/* Images */
.facebook {display: block;}
.logo {width: 265px; height: 70px; margin-top: 15px;}
.woman {
    width: 345px;
    height: 177px;
    margin-top: 105px;
}
.passo {
    width: 280px;
    height: 160px;
}

/* Header */
header {height: 100px;}
.mobile_toggle {display: none;}
.header_menu ul {
	display: block !important;
	margin: 0;
	line-height: 100px;
	background: none;
    position: relative;
    top: 0;
    right: 0;
    padding: 0;
}
.header_menu li {
    display: inline;
    margin-right: 20px;
}
.logo_box {height: 110px;}

/* Front Page */

.left_form {width: 50%;}
.right_form {
	display: block;
	width: 50%;
	height: 100%;
	float: left;
}
.featured {
    width: 23%;
    height: auto;
   	padding-bottom: 10px;
}
.flexbox{display: flex;}
.left_items .item img {
    float: right;
}
.left_items .item span {
    margin-left: 0;
    margin-right: 5%;
    text-align: right;
    float: left;
}
.recent_post {
    width: 44%;
    height: 180px;
    margin: 0 3%;
}
.assinatura span img {
    margin-left: 100px;
}
.assinatura span p {
    margin-left: 100px;
}

/* Pages */
.main {
    width: 75%;
    margin-right: 3%;
}
.sidebar {
    display: block;
    width: 22%;
    float: left;
}
.category_blog .featured {height: 500px;}


}
/* END MEDIA QUERY*/

/*------------------------------------*\
    !!!!!!!  MIN-WITH 900PX  !!!!!!!
\*------------------------------------*/
@media only screen and (min-width:900px) {

.woman {
    width: 398px;
    height: 203px;
    margin-top: 78px;
}

}
/* END MEDIA QUERY*/

/*------------------------------------*\
    !!!!!!!  MIN-WITH 1024PX  !!!!!!!
\*------------------------------------*/
@media only screen and (min-width:900px) {

h1 {font-size: 30px;}
h2 {font-size: 30px;}
.category_blog .featured {height: 460px;}

}
/* END MEDIA QUERY*/
/*------------------------------------*\
    !!!!!!!  MIN-WITH 1024PX  !!!!!!!
\*------------------------------------*/
@media only screen and (min-width:1024px) {
/* Images */
.woman {
    width: 450px;
    height: 228px;
    margin-top: 52px;
}
.seta {
    width: 114px;
    height: 128px;
    margin-top: 90px;
    margin-bottom: -224px;
    margin-left: -52px;
}
.passo {
    width: 340px;
    height: 190px;
}
.recent_post {
    height: 150px;
}

/* Pages */
.category_blog .featured {height: 430px;}

}
/* END MEDIA QUERY*/

/*------------------------------------*\
    !!!!!!!  MIN-WITH 1140PX  !!!!!!!
\*------------------------------------*/
@media only screen and (min-width:1140px) {

}
/* END MEDIA QUERY*/

/*------------------------------------*\
    !!!!!!!  MIN-WITH 1280PX  !!!!!!!
\*------------------------------------*/
@media only screen and (min-width:1280px) {

.category_blog .featured {height: 400px;}
.woman {
    width: 500px;
    height: 252px;
    margin-top: 28px;
}

}
/* END MEDIA QUERY*/

/*------------------------------------*\
    MISC
\*------------------------------------*/
::selection {background:#04A4CC; color:#FFF; text-shadow:none;}
::-webkit-selection {background:#04A4CC; color:#FFF; text-shadow:none;}
::-moz-selection {background:#04A4CC; color:#FFF; text-shadow:none;}

/*------------------------------------*\
    WORDPRESS CORE
\*------------------------------------*/
.alignnone {margin:5px 20px 20px 0;}
.aligncenter, div.aligncenter {display:block;margin:5px auto 5px auto;}
.alignright {float:right; margin:5px 0 20px 20px;}
.alignleft {float:left; margin:5px 20px 20px 0;}
a img.alignright {float:right; margin:5px 0 20px 20px;}
a img.alignnone {margin:5px 20px 20px 0;}
a img.alignleft {float:left; margin:5px 20px 20px 0;}
a img.aligncenter {display:block; margin-left:auto; margin-right:auto;}
.wp-caption {background:#FFF; border:1px solid #F0F0F0; max-width:96%; padding:5px 3px 10px; text-align:center;}
.wp-caption.alignnone {margin:5px 20px 20px 0;}
.wp-caption.alignleft {margin:5px 20px 20px 0;}
.wp-caption.alignright {margin:5px 0 20px 20px;}
.wp-caption img {border:0 none; height:auto; margin:0; max-width:98.5%; padding:0; width:auto;}
.wp-caption .wp-caption-text, .gallery-caption {font-size:11px; line-height:17px; margin:0; padding:0 4px 5px;}

/*------------------------------------*\
    PRINT
\*------------------------------------*/
@media print {
	* {background:transparent !important; color:#000 !important; box-shadow:none !important; text-shadow:none !important;}
	a, a:visited {text-decoration:underline;}
	a[href]:after {content:" (" attr(href) ")";}
	abbr[title]:after {content:" (" attr(title) ")";}
	.ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after {content:"";}
	pre,blockquote {border:1px solid #999; page-break-inside:avoid;}
	thead {display:table-header-group;}
	tr,img {page-break-inside:avoid;}
	img {max-width:100% !important;}
	@page {margin:0.5cm;}
	p, h2, h3 {orphans:3; widows:3;}
	h2,h3 {page-break-after:avoid;}
}