@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,300;0,400;0,500;1,700&display=swap');

body{	
	background-color: #fff;
	font-family: 'Roboto', sans-serif;
}

header{
	background-color: #fff;
}
.header-inner{
	background-color: #fff;
	color: #222;
}

.header-inner .sep{
	color: #f5821f;
}

.mobile-toolbar .header-inner .mls-num {
    color: #222;
}

.content-column {
    min-height: 635px;
}

.column1{
	color: #222;
	background-color: #fff;
	background-repeat:no-repeat;
	background-position: right bottom 0px;
	background-image: url('/XposurePublicIncludes/branding/exp-mexico-light/col1.png');
}

.column2{
	background-color: #fff;
	background-repeat:repeat-y;
	background-image: url('/XposurePublicIncludes/branding/exp-mexico-light/col2.png');
}

.column3{
	background-color: #fff;
}
.column1 .agent-photo-container{
	position: relative;
    right: 0;
    left: 0;
    top: 124px;
    margin: 0 auto 15px auto;
    padding: 0;
    width: 86%;
    border: 1px solid #f5821f;
}
.column1 img.agent-photo{
	display: block;
    width: 100%;
    right: 0;
    left: 0;
    position: relative;
    border: 3px solid #fff;
    box-sizing: border-box;
}
.column1 .info{
	margin: 0;
	padding: 10px 0 0 10px;
	position: relative;
	font-size: 14px;
	line-height: 22px;
	color: #222;
}

.column1 .info.name{
	margin-bottom: 5px;
	top: 124px;
}

.column1 .info.name span{
	font-size: 30px;
	color: #222;
	font-weight: 500;
}

.column1 .info .contact-label{
	color: #222;
}
.column1 .info.name img{
	display: none;
}
.column1 .realtor-on-duty {
	top: 148px;
	display: none;
}

.column1 .info.contact{
	position: relative;
	margin: auto;
	top: 124px;
}

.column1 .phone {
    display: block;
}

.column1 .custom-brand-toll-free{
		display: none;
	}
	
.column1 .info.contact .website{
	text-decoration: none;
	color: #222;
	font-weight: bold;
}

.column1 .info.contact .custom-brand-email{
	display: block;
}
.column1 .info.address{
	display: none;
}

.column1 .info.address span.company-name{
	display: none;
}
.column1 .info.address span.company-country{
	display: none;
}
/* Incase you want the company address to display all in one line */
.column1 .info.address span.company-citystate br{
	display: none;
}

.office-logo-wrapper{
	background-repeat: no-repeat;
    background-position: left 15px bottom;
    background-image: url(/XposurePublicIncludes/branding/exp-mexico/company-logo.png);
    position: absolute;
    top: 5px;
    right: 0;
    left: 0;
    height: 95px;
    background-size: 152px;
}

.column1 img.office-logo{
	max-height: 55px;
    right: 0px;
    left: 0px;
    bottom: 16px;
    display: none !important;
}

.column1.large-office-image img.office-logo {
    max-height: 55px;
    right: 0px;
    left: 0px;
    bottom: 16px;
}
.column1 .info .mobile-phone-btn{
    display: none;
}
.column1 .info a{
    text-decoration: none;
    color: #222;
}

.column1 .info.agent-description{
    font-size: 110%;
}

.column1 .info.agent-description:after{
    content: "";
    display: block;
    width: 50px;
    height: 0px;
    border-bottom: 1px solid;
    margin-top: 10px;
}
footer{
	background-color: #fff;
}
.footer-inner{
	color: #666;
	margin-bottom: 5px;
}
.footer-inner a{
	color: #999;
	padding-right: 20px;
}
.footer-inner span.float-left{
	padding: 0 20px;
}
#google_translate_element{
	background-color: #fff;
	padding-top: 5px;	
}
.button{
	background: #ffffff;
	color: #fff;
	border-radius: 3px;
}
.main-nav li{
	border-bottom-style: none;
}
.main-nav li a{
	color: #fff;
}

.column2 form{
	bottom: 7px;
}

.column2 form label{
	color: #f5821f;
	font-size: 15px;
    font-weight: bold;
    padding: 4px 0;
}

.column2 form fieldset input, .column2 form fieldset textarea{
	border-radius: 3px;
	background: rgba(255 255 255 / 84%);
	color: #666666;
}

.column2 form fieldset input[type='button']{

	background: #1b1e2a;
    color: #f5821f;
    border-radius: 3px;
    border: 1px solid #f5821f;
}

.column2 form fieldset .visible-fields{

	background: transparent;
}
#details{
	background: #fff;
}

#details table td{
	color: #333;
	border-bottom: 1px solid #ededed;
}

#details table .first td{
	border-top:none;
}

#details table .last td{
	border-bottom:none;
}

#details p{
	color: #333;
	text-shadow: none;
}

#about {
	background: #fff;
}

#about p{
	color:#333;
}

#multimedia{
	background: #fff;
}

#multimedia ul a{
	color: #333;
	background-color: #fff;
}

#multimedia ul a:hover{
	background-color: #f1f3f6;	
}

#video {
	background-color: #1e1e24;	
}

#plans{
	background-color: transparent;
}

.map-tabs a{
	background: #7c7f86;
	border-radius: 0 0 4px 4px;
	color: #eee;
	box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.15);
	text-shadow: none;
	border: none;
	border-bottom: 1px solid #4D4F52;
}

.map-tabs a.active{
	background: #fff;
	color: #222;
	border-bottom: 1px solid #141415;
}
#gallery,
#gallery .rsOverflow,
#gallery .rsSlide,
#gallery .rsVideoFrameHolder{
	background-color: #ffffff;
}

#gallery .rsThumbs {
	background-color: #eee;
}
.column1 .info .mobile-phone-btn{
	background-color: #907669;	
}

#gallery .rsThumb.rsNavSelected span.thumbIco {
	border: 3px solid #f5821f;
}

@media only screen and (min-width: 410px){
.column1 .agent-photo-container {
    height: 258px;
}
}

@media only screen and (min-width: 420px){

	.column1 .info {
    	padding: 10px 0 0 20px;
    }
}

@media only screen and (min-width: 830px){
	.main-nav li.active a{
		color: #f5821f;
	}
}

@media only screen and (min-height: 750px) and (min-width: 960px){
	
	.column1 .info{
		font-size: 16px;
		line-height: 28px;
	}		
	.column1 .info.agent-description:after{
    	margin-top: 15px;
    	margin-bottom: 15px;
	}
}