@import url("myriad.css");
@import url('https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700');

body, input, select, textarea, button, p, div, h1, h2, h3  {
    font-family: 'Myriad Pro';
    
	/*letter-spacing: 0.03em;*/
    
	/*line-height: 1.75em;*/
	font-size: 14pt;
	
	color: rgb(74, 78, 97);
	
}

a {
	color: rgb(74, 78, 97);
}

a, a:focus, a:hover {
	text-decoration: none;
}


/*
Poppins - font-weight:
light 300
regular 400
medium 500
semi-bold 600
bold 700
*/
h1, h2, h3 , h4, h5, h6{
	font-family: 'Poppins';
	font-weight:400;
    font-size: 14pt;
}

h1{
	font-weight:700;
    font-size: 34pt;	
}

h2{
	font-weight:400;
    font-size: 14pt;
	line-height: 22pt;		
}

h3{
	font-weight:700;
    font-size: 33pt;	
	line-height: 40pt;
}

h4{
	font-weight:500;
    font-size: 18pt;
	line-height: 25pt;
}

h5{
	font-weight:200;
    font-size: 20pt;	
}

h6{
	font-family: 'Myriad Pro';
	font-size: 14pt;
    font-weight: normal;
}



::-moz-placeholder, .form-control::-moz-placeholder {
	/* color: #999;*/
	color: #aaa;
	opacity: 1;
}
:-ms-input-placeholder, .form-control:-ms-input-placeholder {
	color: #aaa;
}
::-webkit-input-placeholder, .form-control::-webkit-input-placeholder {
	color: #aaa;
}


#combo-lang button, #combo-lang .dropdown-menu
{
	background-color: transparent;
	color: white;
	font-size: 14pt;
	font-weight: bold;
	border:0px;
}

#combo-lang .dropdown-menu
{
	background-color: rgb(255,67,56);
}

#combo-lang .dropdown-menu a:hover
{
	background-color: rgb(255,67,56);
	color: #f1f1f1;
}


#ys_application_menu #combo-lang button,
#ys_application_menu .dropdown-menu
{
	background-color: rgb(37, 34, 81);
	color: white;
	font-size: 14pt;
	font-weight: bold;
}

#combo-lang a {
	color: white;
	font-size: 14pt;
	padding-left: 20px;
	padding-right: 20px;
	font-weight: normal;
	padding-top: 0px;
}

.ys-msg, .ys-msg p{
	color: red;
	text-align: left;
}

.row{
	text-align: center;
	padding-top: 80px;
	padding-bottom: 60px;
}

.row h3{
	/* force center*/
	width:100%;
}

.ys-navbar{
	background-color: rgb(255,67,56);
	position: fixed;
	width:100%;
	z-index:10000;
	top:0px;
}

.ys-navbar .row{
	padding-top: 0px;
	padding-bottom: 0px;
	text-align: left;
}

.ys-home-banner .row{
	/*
	padding-top: 95px;
	padding-bottom: 0px;
	*/
}

.ys-margin-top .row{
	padding-top: 140px;
	
}


.ys-color{
	color: rgb(255,67,56);
}

.ys-navbar-logo{
	padding-top:10px;
	padding-bottom:10px;
}

.ys-navbar-menu{
	text-align: right;
	padding-top:20px;
}

@media screen and (max-width:  991px) {
	.ys-navbar-logo img{
		height: 40px;
	}
	.ys-navbar-logo{
		padding-top:10px;
		padding-bottom:10px;
	}
	
}



.ys-navbar-menu a{
	color: white;
    font-size: 14pt;
    padding-left: 20px;
	padding-right: 20px;
	font-weight: normal;
}

.ys-navbar-menu a:hover {
    color: white;
    text-decoration: none;
}

a.ys-login {
	font-weight: bold;
	padding-left: 20px;
    padding-right: 0px;
}

/* menu mobile */
.ys-navbar-hamburger {
	display: none !important;
	text-align: right;
	padding-top: 15px;

	/* bootsrap V4 */
	/*
	position: absolute;
	right: 40px;
	*/
}

.ys-navbar-hamburger button {
	background-color: transparent;
	border-style: none;
	padding: 0px;
}


@media screen and (max-width: 1199px) {
}

@media screen and (max-width: 1200px) {
	.ys-navbar-hamburger {
		display: flex !important;
	}
	.ys-navbar-menu {
		display: none !important;
	}
}
@media screen and (max-width: 767px) {
	.ys-navbar-hamburger {
		display: flex !important;
	}
	.ys-navbar-menu {
		display: none !important;
	}
}

@media screen and (max-width: 600px) {
	 .ys-navbar-hamburger{
		
	}
}

@media screen and (max-width: 767px) {
    #ys_right_fixed_navigation_button {
        display: none;
    }
}

/* div menu mobile opened  */
#ys_application_menu {
	display: none;
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 100%;
	background-color: rgb(37, 34, 81);
    position: fixed;
    height: 100%;
    overflow: auto;
    z-index: 10001;
	top:0px;
}

/* button close menu mobile */
#ys_application_menu button {
	padding: 0px;
	font-size: 30pt;
	color: white;
	border-style: none;
	background-color: transparent;
	line-height: 90px;
}

#ys_application_menu button:hover {
	-moz-transition: all 0.15s ease-in-out;
    -webkit-transition: all 0.15s ease-in-out;
    -ms-transition: all 0.15s ease-in-out;
    transition: all 0.15s ease-in-out;
	color: rgb(247,56,49);
}

#ys_application_menu .row {
	padding-bottom: 0px;
    padding-top: 0px;
}

/*Button menu mobile */
.ys-navbar button, .ys-navbar button:hover{
	color: rgb(231,231,239);
}
/* Lista do meu mobile */
#ys_application_menu ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
	text-align:center;
}

#ys_application_menu li a {
    display: block;
    color: white;
    padding-top: 24px;
    text-decoration: none;
    font-weight: bold;
}

#ys_application_menu li a:hover {
	-moz-transition: all 0.15s ease-in-out;
    -webkit-transition: all 0.15s ease-in-out;
    -ms-transition: all 0.15s ease-in-out;
    transition: all 0.15s ease-in-out;
    color: rgb(247,56,49);
}


/* conteudos */
.ys-home-banner{
	background-color: rgb(37,34,81);
	min-height: 300px;
	text-align:center;	
}


/* transporter */
.ys-transporter-banner{

	background-color: rgb(0,139,165);
	min-height: 300px;
	text-align:center;
}

.ys-transporter-banner .ys-home-banner-slogan {
    margin-top: 30px;
}

/* centrar */
.ys-home-banner .row, .ys-home-banner .row div{
	/*float: none;
    margin: 0 auto;
	*/
}

.ys-home-banner-box{
	background-image: url("../images/box_red_t2.png");
    background-position: left center;
    background-repeat: no-repeat;
}

.ys-home-banner-truck{
	background-image: url("../images/truck_red_t2.png");
    background-position: right center;
    background-repeat: no-repeat;
}


.ys-home-banner-buttons{
	padding-top: 0px;
	padding-bottom: 0px;
}

.ys-home-banner-buttons a {
	
}


.ys-home-banner-buttons button{
    background-color: white;
    border: 2px solid  rgb(94,194,210);
    color: rgb(255,67,56);
	
    padding: 15px 20px;
    width: 270px;
	
	font-weight:400;
    font-size: 12pt;	
	
	border-radius: 30px;
	
	font-family: 'Poppins';
	text-transform: uppercase;
	
	margin: 10px;
	margin-left: 20px;
	margin-right: 20px;
}

.ys-transporter-banner-buttons button {
	background-color: rgb(214,215,221);
}
/*
Poppins - font-weight:
light 300
regular 400
medium 500
semi-bold 600
bold 700
*/

.ys-home-banner-body{
	margin-top: 50px;
}

@media screen and (max-width:  991px) {
	.ys-home-banner-body {
		margin-top: 20px;
	}
}

.ys-home-banner-slogan{
	overflow: hidden;
}

.ys-home-banner-slogan{
	/*colunas com mm altura*/
	display: inline-flex;
    width: 100%;
}

.ys-home-banner-slogan-img{
	display:flex;
	align-items:center;
}


.ys-home-banner-desc{
	margin-top: 0px;
	 overflow: hidden;
}

.ys-home-banner h1{
	color: rgb(94,194,210);
	padding-left: 20px;
	padding-right: 20px;
}

.ys-home-banner h2{
	color: rgb(124,128,147);
}

.ys-transporter-banner h1{
	color: rgb(148,210,225);
	padding-left: 20px;
	padding-right: 20px;
}

.ys-transporter-banner h2{
	color: white;
}

.ys-transporter-banner .ys-color{
	color: white;
	font-weight:bold;
}

.ys-home-banner-iconconnect {
	display: none;
}

@media (max-width: 700px) { 
	.ys-home-banner-iconconnect {
		display: block;
	}
	.ys-home-banner-slogan-img{
		display: none;
	}
	.ys-home-banner-slogan-text{
		width:100%;
	}
	
	.ys-home-banner h1, .ys-transporter-banner h1{
		font-size: 30pt
	}
	
}


/*....*/

.ys-row-arrow{
	height: 0;
    margin-left: auto;
    margin-right: auto;
    padding-left: 29px;
    padding-right: 29px;
    position: relative;
    text-align: center;
    top: -29px;
}

.ys-row-arrow a{
	background-color: transparent;
    background-image: url("../images/arrowdown.png");
    background-position: center center;
    background-repeat: no-repeat;
    border-style: none;
    display: block;
    height: 63px;
    margin: 0 auto;
    padding: 0;
    width: 60px;
	
}

.ys-row-gray {
	background-color: rgb(225,225,231);
}

.ys-row-gray-red {
	background-color: rgb(231,231,239);
}


.ys-row-blue {
	background-color: rgb(0,141,167);
	background-position: center bottom;
    background-repeat: no-repeat;
    background-size: cover;
}

.ys-row-purple {
	background-color: rgb(37,34,81);
	background-position: center bottom;
    background-repeat: no-repeat;
    background-size: cover;
}


.ys-row-red {
	background-color: rgb(255,67,56);
	background-position: center bottom;
    background-repeat: no-repeat;
    background-size: cover;
}
.ys-row-red .ys-row-track-text{
	color: white;
}

.ys-row-track {
	background-color: #ffffff;
	padding-top: 10px;
	padding-bottom: 10px;
	text-align: left;
	margin-bottom: 30px;
}

.ys-row-track img{
	margin-bottom: 0px !important;
}

.ys-row-track .row {
	padding: 0px;
}

.ys-row-track .card-title {
	font-size: 13pt;
	color: rgb(179, 179, 179);
}

.ys-row-track-id .card-title {
	font-size: 14pt;
	color: rgb(124, 128, 147);
}

.ys-row-track .card-subtitle {
	font-size: 14pt;
	color: rgb(77, 77, 77);
}

.ys-row-track .card-text {
	color: rgb(179, 179, 179);
	font-size: 12pt;
}

.ys-row-map-track{
	background-color: #f9f9f9;
	text-align: center;
}

.ys-row-map-track img{
	width: 60%;
	border-radius: 6px;
}

.track-poi{
	width: 25px;
	margin: auto;
}

.track-line{
	width: 4px;
	height: 30px;
	margin-top: 4px;
}

.ys-track-status-name{
	font-size: 10px;
	position:relative;
	margin: 0;
	margin-top: 4px;
}

.ys-track-status-name div{
	margin: auto;
	line-height: 100%;
}

.ys-track-div-svg{

}

.ys-track-svg{
	height: 40px;
}

hr.ys-track-hline{
	border-top: 1px solid #CCCCCC;
}

/* Small devices (tablets, 768px and up) */
/* Medium devices (desktops, 992px and up) */
@media (max-width: 768px) {
	.ys-track-svg{
		height: 20px;
	}
	.ys-row-map-track img{
		width: 80%;
	}
}

/*gray*/
.ys-row-gray h3{
	color: rgb(37,34,81);
}

.ys-row-gray h4{
	color: rgb(37,34,81);
}

.ys-row-gray h5{
	color: rgb(37,34,81);
}

.ys-row-gray h6{
	color: rgb(124, 128, 147);
}

.ys-row-gray img{
	margin-bottom: 10px;
}

/* gray red  */


.ys-row-gray-red  h3{
	color: rgb(37,34,81);
}

.ys-row-gray-red  h4{
	color: rgb(37,34,81);
}

.ys-row-gray-red  h5{
	color: rgb(255,67,56);
	margin-bottom:0px;
	/*margin-left: 40px;*/
}

.ys-row-gray-red  h6{
	color: rgb(255,67,56);
	margin-bottom:0px;
	/*margin-left: 40px;*/
}

.ys-row-gray-red  img{
	margin-bottom: 10px;
}

/* blue */

.ys-row-blue h3{
	color: white;
}

.ys-row-blue h3{
	color: white;
}

.ys-row-blue h4{
	color: white;
}

.ys-row-blue h5{
	color: white;
	margin-bottom:0px;
	margin-left: 40px;
}

.ys-row-blue h6{
	color: white;
	margin-top:0px;
	margin-left: 40px;
}

/* purple */

.ys-row-purple h3{
	color: white;
}

.ys-row-purple h3{
	color: white;
}

.ys-row-purple h4{
	color: white;
}

.ys-row-purple h5{
	color: white;
	margin-bottom:0px;
	margin-left: 40px;
}

.ys-row-purple h6{
	color: white;
	margin-top:0px;
	margin-left: 40px;
}

/* red */

.ys-row-red h3{
	color: white;
}

.ys-row-red h3{
	color: white;
}

.ys-row-red h4{
	color: white;
}

.ys-row-red h5{
	color: white;
	margin-bottom:0px;
	margin-left: 40px;
}

.ys-row-red h6{
	color: white;
	margin-top:0px;
	margin-left: 40px;
}


/* */
.ys-item-row{
	margin-top:60px;
}

.ys-steps{
	text-align: left;
	/*padding-left: 20px;*/
}

.ys-steps b{
	font-size: 40pt;
}

.ys-features{
	text-align: left;
}

.ys-features h5{

	border-bottom: 1px solid #BCBEBE;
	padding-bottom: 8px;
	margin-top: 40px;
}

.ys-features h6{
	padding-top: 10px;
	font-weight: bold;
}

.ys-screens{
	text-align: center;
	padding-top: 32px;
}

.ys-balloon{
	border-radius: 90px;
	height: 170px;
	background-color: rgb(231,231,239);
	color: rgb(124 128 147);
}

.ys-balloon-circule{
	background-color: rgb(37,34,81);
	border-radius: 90px;
	width: 170px;
	height:170px;
	color:white;
	float:left;
	margin-right: 25px;
	
	font-size: 16pt;
	font-weight:700;
    font-size: 18pt;
	
	line-height: 170px;
}

.ys-balloon-text{
	text-align: left;
	font-family: 'Myriad Pro';
	font-size: 12pt;
	color: rgb(124, 128, 147);
	padding: 25px;
}

.ys-balloon{
	/* align vertical */
	/*	
	display: table-cell;
    vertical-align: middle;
	*/
}

.ys-transporter-how-register .ys-balloon
{
	background-color: rgb(74,78,97);
	color: white;
	height: 170px;
}

.ys-transporter-how-register .ys-balloon-circule
{
	background-color: rgb(124,128,147);
	color: rgb(243,146,0);
	font-size: 55pt;
	font-weight: 900; 
}

.ys-transporter-how-register .ys-balloon-text
{
	padding: 20px;
	color: white;
}

.ys-button{
	border-radius: 100px;
	background-color: rgb(255,67,56);
	color: white;
	padding: 10px;
	padding-left: 15px;
	padding-right: 15px;
}


.ys-min-balloon a{
	color: rgb(255,67,56);
}

.ys-row-track-watch{
	margin-top: 50px;
	max-height: 250px;	
}
.ys-row-track-mobile{
	max-height: 350px;	
}

.ys-row-track-text{
	line-height: 24pt;
    
	margin-top: 80px;

}

.ys-row-track textarea  {
	width: 300px;
	height: 80px;
	background: #f2f2f2;
	border-color: #f2f2f2;
	border-radius: 0px;
	padding: 12px;
}

@media screen and (max-width: 600px) {

	.ys-row-blue h5{
		margin-left: 20px;
	}

	.ys-row-blue h6{
		margin-left: 20px;
	}
	
	.ys-row-purple h5 {
		margin-left: 20px;
	}
	
	.ys-row-purple h6 {
		margin-left: 20px;
	}

	.ys-balloon h4 {
		margin-top: 0px;
		margin-bottom: 3px;
		
	}
	
	.ys-balloon-circule{
		display:none;
	}
	.ys-balloon-text {
		padding-left: 50px;
	}
	.ys-row-track-watch{
		margin-top: 0px;
		margin-bottom: 0px;
	}
	.ys-row-track-text {
		margin-top: 40px;
	}
	
	.ys-transporter-how-register .ys-balloon-text
	{
		margin-left: 10px;
	}
	.ys-min-balloon {
		margin-left: 0px;
		margin-right: 0px;
	}
	
	.features-banner{
		max-width: 90%;
	}
}

@media screen and (max-width: 900px) {
	.ys-row-track-watch{
		margin-top: 0px;
		margin-bottom: 0px;
	}
	.ys-row-track-text {
		margin-top: 40px;
	}
}

/*default*/

.ys-row-title-default{
	background-color: rgb(231, 231, 239);
}
.ys-row-title-default .row{
	margin-top: 30px;
	margin-bottom: 0px;
}

.ys-row-default{
	min-height: 300px;
}
.ys-row-default p{
	text-align: left;
}

.ys-row-default h4{
	text-align: left;
	padding-top: 8px;
}


/*carousel*/
.carousel-inner > .item > img {
    margin: 0 auto;
}
.carousel-indicators {
    bottom: -62px;
}

.carousel-indicators .active {
    background-color: #fff;
    margin: 3px;
	height: 16px;
    width: 16px;
}

.carousel-indicators li {
    background-color: rgb(124, 128, 147);
    border: 0px solid #7C8093;
    border-radius: 15px;
    cursor: pointer;
    display: inline-block;
    height: 15px;
    margin: 4px;
    text-indent: -999px;
    width: 15px;
}

.form-group{
	text-align: left;
}

ul{
	text-align: left;
}

/* background images */
.ys-home-banner-bg{
	background: url("../images/bg/left_white.png") no-repeat scroll 160px bottom, 
		url("../images/bg/left_blue.png") no-repeat scroll left bottom, 
		url("../images/bg/right_gray.png") no-repeat scroll right bottom, 
		#252251 url("../images/bg/right_orange.png")no-repeat scroll right bottom;
}

.ys-row-blue-bg{
	background: 
		url("../images/bg/right_orange.png") no-repeat scroll -100px top, 
		#008DA7 url("../images/bg/right_white_2.png")no-repeat scroll right top;
	
}

.ys-row-gray-bg{
	background: 
		url("../images/bg/right_blue.png") no-repeat scroll right top, 
		#E1E1E7 url("../images/bg/right_orange_2.png")no-repeat scroll right bottom;
	
}

.ys-transporter-banner-bg{

	background:  
		url("../images/bg/route_orange.png" )no-repeat scroll left top,
		url("../images/bg/route_blue.png" )no-repeat scroll right 100px,
		
		url("../images/bg/banner-phone.png") no-repeat scroll 50px 120px,
		url("../images/bg/banner-poi-package.png" )no-repeat scroll right 94%,
		#008DA7 url("../images/bg/banner-arrow.png" )no-repeat scroll right bottom;

}

.ys-row-purple-bg{
	background: 
		url("../images/bg/route_blue_3.png") no-repeat scroll right top, 
		#252251 url("../images/bg/route_orange_3.png")no-repeat scroll right bottom;
}

@media screen and (max-width: 950px) {
	.ys-home-banner-bg{
		background: 
		url("../images/bg/left_blue.png") no-repeat scroll -50px bottom, 
		#252251 url("../images/bg/right_orange_small.png")no-repeat scroll right bottom;
	}
	
	.ys-row-gray-bg{
		background: 
			url("../images/bg/right_blue.png") no-repeat scroll right -100px, 
			#E1E1E7 url("../images/bg/right_orange_2.png")no-repeat scroll right bottom;
		
	}
	
	.ys-transporter-banner-bg{
		background:  
			url("../images/bg/route_orange_2.png" )no-repeat scroll left bottom,
			#008DA7 url("../images/bg/banner-arrow.png" )no-repeat scroll right bottom;
	}
	
	.ys-row-purple-bg{
		background: 
			url("../images/bg/route_blue_3.png") no-repeat scroll right -100px, 
			#252251 url("../images/bg/route_orange_3.png")no-repeat scroll right bottom;
	}

	
}

@media screen and (max-width: 800px) {
	
	.ys-row-blue-bg{
		background: 
			url("../images/bg/right_orange.png") no-repeat scroll -200px top, 
		#008DA7 url("../images/bg/right_white_2.png")no-repeat scroll 400px top;
		
	}
	

}

/* END background images */

/* footer */

.ys-footer{
	background-color: rgb(37,34,81);
}
.ys-footer .row{
	padding-top: 0px;
}

.ys-footer .ys-item-row{
	text-align: left;
}

/* Small devices (tablets, 768px and up) */
/* Medium devices (desktops, 992px and up) */
@media (max-width: 992px) { 
	 .ys-footer .ys-item-row{
		text-align: center;	
	 }
}

.ys-footer h3{
	color: rgb(255,67,56);
	font-weight:500;
    font-size: 13pt;
	text-transform: uppercase;
	line-height: 15pt;
}

.ys-footer a{
	color: rgb(124,128,147);
	display: block;
	
    margin-top: 4px;
	
	padding-top: 5px;
	padding-bottom: 5px;
}


.ys-footer-appstore img{
	display: inline-block;
    margin-left: auto;
    margin-right: auto;
    width: 190px;
	padding-top: 8px;
	padding-bottom: 5px;
}

.ys-footer-bottom .row {
    padding-bottom: 65px;
    padding-top: 0px;
    text-align: left;
}

.ys-footer-bottom .row  div{
    padding-top: 20px;
}

.ys-footer-company{
	color: rgb(255,67,56);
	font-size: 13pt;
	text-align: left;
}

.ys-footer-social{
	text-align: left;
}

.ys-footer-company a{
	color: rgb(255,67,56);
}
.ys-footer-social a{
	margin-right: 20px;
}

@media (max-width: 992px) { 
	 .ys-footer-bottom div{
		text-align: center;	
	 }
}

#div-cookies {
    display: none;
    position: fixed;
    width: auto;
    left: 10px;
    right: 10px;
    bottom: 10px;
	padding: 6px;
    background-color: #ECECEC;
    color: #333333;
    z-index: 1000;
    text-align: left;
	font-size: 14px;
}
