

/*----- MOBILE VERSION OF WEBSITE -----*/
/*------------------------------------------------------------*/




/*----- header -----*/
/*------------------------------------------------------------*/


header nav.mobile-navigation-mobile {


	margin-top:10px !important;
}



header nav.mobile-navigation {
	display: none;
	background-color: #1f1f1f;
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	text-align: left;
	margin: 0 -20px;
	margin-top:70px;
}

header nav.mobile-navigation ul{
	display: block;
	margin: 0;
}

header nav.mobile-navigation li{
	display: block;
	border-left: none;
	border-top: 1px solid #000;
	padding: 0;
}

header nav.mobile-navigation li:first-of-type{
	border: none;
}

header nav.mobile-navigation a, header nav.mobile-navigation a:hover{
	color: #fff;
	text-decoration: none !important;
	display: block;
	line-height: 45px;
	font-size: 20px;
	padding: 0 20px 0px 40px;
	font-family: 'brandon_grotesque_light', sans-serif;
}

/*----- resize screen -----*/
/*------------------------------------------------------------*/

@media (min-width: 1025px) {
	.mobile{
		display: none;
	}

	.desktop{
		display: block;
	}
}



/*----- xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx-----*/
/*----- xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx-----*/
/*----- xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx-----*/
                           
						   
						   /*----- 1024px -----*/
						   
						   
						   
/*----- xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx-----*/
/*----- xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx-----*/
/*----- xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx-----*/
 



@media (max-width: 1024px) {
	.mobile{
		display: block;		
	}

	.desktop{
		display: none;
	}


	.blocktext-mobile {
	    margin-left: auto;
	    margin-right: auto;
	    
	}

	.center-image {
	    display: block;
	    margin-left: auto;
	    margin-right: auto }
		
		
		
		a.twocolors span.grey {
		    color: #3f3f4b;
		    text-decoration: none;
		    }
		a.twocolors:hover span.grey {
		     color: #3f3f4b;
		    text-decoration: none;
		    }
		a.twocolors span.orange {
		    color: #ed7d11;
		    text-decoration: none;
		    }
		a.twocolors:hover span.orange {
		    color: #ed7d11;
		    text-decoration: none;
		    }
		
			.twocolors{
				font-family: "open-sans",sans-serif;
				font-style: normal;
				font-size: 40px !important; 
				font-weight: 700; 
			
				
				
			}

		
		

/*----- h1,h2,h3,h4,h5 -----*/
/*------------------------------------------------------------*/	



	

		p.white-text {
			height: 100%;
			width: 100%;
			font-size: 23px;
			color: #fff;
			font-family: "nimbus-sans",sans-serif;
			font-style: normal;
			font-weight: 300;
		}
		

		p.key-areas {
			font-size: 32px;
			font-family: "open-sans",sans-serif;
			font-style: normal;
			font-weight: 400;
			line-height:33px;
			letter-spacing: -1px;
			color: #60d900;
			margin-bottom:-10px;
	
	
		}
		
		
		
		p.text-large {
			font-size: 33px;
			font-family: "open-sans",sans-serif;
			font-style: normal;
			font-weight: 300;
			line-height:35px;
			letter-spacing: -1px;
	
	
		}
		
		
		p.text-bold{
			font-size: 23px;
			line-height:30px;
			font-family: "open-sans",sans-serif;
			font-style: normal;
			font-weight: 700;

		}


		h2.subheading-smaller{
			font-size: 40px;
			font-family: "open-sans",sans-serif;
			font-style: normal;
			line-height:35px;
			font-weight: 300;
			letter-spacing: -2px;
	
		}
		
		
	
	.text-small {
	    font-family: "open-sans",sans-serif;
	    font-size: 14px;
	    font-style: normal;
	    font-weight: 700;
	}
	
	.text-large{
		font-size: 45px;
		alignment:center;	
		
	}

	
	
	
	h3.header-call-today{
		font-size: 25px;
		font-family: "open-sans",sans-serif;
		font-style: normal;
		font-weight: 700;
		letter-spacing: -1px;
		margin-top:-20px;
		margin-left:0px;
	}
	

	.call-today-padding{
		padding-top:20px;
	padding-bottom:20px;
	}
	

	.indent-link{
		margin: 0 0 0 0px;
	}


	.side-menu{
		width:100%;
		margin-left:0px;
	}



	.margin-top-follow-thomas{
		margin-top:0px !important;
		padding-bottom:50px;
		
	}



	.margin-top-follow-thomas-practice{	
		margin-top:0px !important;
		padding-bottom:50px;
	}


	.margin-top-banner {
	    margin-top: 100px;
	}



	.blog-date-article{
		display: none;
		width: 0px;
		text-align: left;
		vertical-align: none;
		padding:0;
		margin:0;
	}

	.blog-content{
		display: table-cell;
		vertical-align: top;
		padding-top: 20px;
	}

	


	/*----- header -----*/
	/*------------------------------------------------------------*/

		
	.section-transparent{
		display: table;
		text-align: left;	
		color: #fff;
		font-size: 42px;
		text-shadow: 3px 3px 8px #000;
		top:-12px;
	}
	

	header{
		top: 0;
		padding: 20px;
		text-align: center;
		  opacity: 1 !important;
	}

	header h3{
		text-indent: 0;
		display: inline-block;
	}

	.brand{
		width: auto;
	}
	
	.btn-mobile{
		background-image: url(../img/icon-menu.png);
		background-size:  50px 52px;
		width: 50px;
		height: 52px;
		float: right;
		cursor: pointer;
	}
	
	.brand-logo{
		float: left;
		background-size:  103px 49px;
		width: 103px;
		height: 49px;
	}
	
	
	.no-form-display{
		display: none;			
	}

	

	/*----- content -----*/
	/*------------------------------------------------------------*/


    .offset-block{
	    margin: 0;
    }

    .blog{
	    width: 100%;
    }


	.box-blog{	
		width: 250px !important;
	
		
		margin-left:100px ;
		
		

	}

    .wrap-blog{
	    padding: 0 20px;
    }

	.content{
		width: 100%;
	}

	.side-menu{
		width: 100%;
		margin-top: 30px;
	}

	.side-menu ul{
		font-size: 24px;
	}

	/*----- footer -----*/
	/*------------------------------------------------------------*/


	footer .form-sign-up{
	  margin-top: 40px !important;
	    margin-bottom: 40px !important;
		float: left;
		width: 100%;
		
	
	}
	

	footer .follow-thomas{
		margin: 0 0 10px;
		width: 100%;
		
	}

	.index .info-thomas, .info-thomas{
		width: 100%;
	}

	.info-thomas p {
		margin: 10px 0 30px;
	}

    .info-thomas ul {
	    margin-top: 30px;
    }

    .info-thomas ul li {
	    padding: 15px 0;
    }

	.mini-photo{
		width: auto;
	}

    footer .social{
	    margin: 10px 0;
    }

    .btn-visit{
	    width: 100%;
	    margin-top: 30px;
    }

	input[type="text"], input[type="password"]{
		line-height: 40px;
		font-size: 24px;
		margin-bottom: 20px;
	}

	input[type="submit"]{
		line-height: 120px;
		font-size: 40px;
	}




/*----- social -----*/
/*------------------------------------------------------------*/

.follow-thomas.absolute{
	position: relative;
	padding-bottom: 10px;	
	top: 0;
}




/*----- form -----*/
/*------------------------------------------------------------*/

#mc_embed_signup .mc-field-group {
    clear: left;
    min-height: 50px;
    padding-bottom: 0;
    position: relative;
    width: 96%;
}


#mc_embed_signup .button {
    width: 100%;
}




	
}






/*----- ///////////////////////////////////////////////////////////-----*/
/*----- ///////////////////////////////////////////////////////////-----*/
/*----- ///////////////////////////////////////////////////////////-----*/
                           /*----- 768px -----*/
/*----- ///////////////////////////////////////////////////////////-----*/
/*----- ///////////////////////////////////////////////////////////-----*/
/*----- ///////////////////////////////////////////////////////////-----*/
 
 
 
 
 
 
 
 
@media (max-width: 768px) {

	html, body {
		min-width:100%;
		width:790px;
	}



	section#home{
	
				background-image: url(../img/mb-bg-home-790w.jpg);  
				background-attachment:initial;
				background position:left top;
				background-repeat: no-repeat;
				background-size:  790px 790px;
				width: 790px;
				height: 790px;
				
			
				}



	section#map{
	
				background-image: url(../img/mb-bg-map-790w.jpg);  
				background-attachment:initial;
				background position:left top;
				background-repeat: no-repeat;
				background-size:  790px 335px;
				width: 790px;
				height: 335px;
		padding: 120px 0;
			
				}



	section#contact{
	
				background-image: url(../img/mb-bg-contact-790w.jpg);  
				background-attachment:initial;
				background position:left top;
				background-repeat: no-repeat;
				background-size:  790px 428px;
				width: 790px;
				height: 428px;
					padding:120px 0;
			background-color:#3f3f4b;
				}



	section#blog-change{
	
				background-image: url(../img/mb-bg-home-790w.jpg);  
				background-attachment:initial;
				background position:left top;
				background-repeat: no-repeat;
				background-size:  790px 335px;
				width: 790px;
				height: 335px;
				padding:120px 0;
			
				}

			
				.margin-bottom-heading{
	
					margin-bottom:30px;
		
				}


/*----- h1,h2,h3,h4,h5 -----*/
/*------------------------------------------------------------*/	


	h1{ 	
		font-size:43px;
		line-height:43px;
	}



	h2{
		font-size: 30px;
		font-family: "open-sans",sans-serif;
		font-style: normal;
		font-weight: 300;
		letter-spacing: 0;
	}
	
	

	h2.heading-sections{
		font-size: 40px;
		line-height:30px;
		font-family: "futura-pt-condensed",sans-serif;
		font-style: normal;
		font-weight: 700;
		letter-spacing: 0;
		text-transform: uppercase;
		text-align: center;

	}




	h2.header-blog {
		font-size: 40px;
		font-family: "futura-pt-condensed",sans-serif;
		font-style: normal;
		font-weight: 500;
		letter-spacing: 0;
		text-transform: uppercase;
		padding:18px;
		line-height:18px;
		background-color: #60d900;
		width:268px;
		margin-top:20px;
		margin-bottom:20px;
		margin-left:80px;
		text-shadow:none;
	

	}
	
	

	h3.blog-middle{
		font-family: 'van_condensed_bold', sans-serif;
		margin-top:10px;
		font-size:40px;
		letter-spacing: -2px;
	}


	.twocolors{
		font-family: "open-sans",sans-serif;
		font-style: normal;
		font-size: 30px !important; 
		font-weight: 700; 
	
		
		
	}
	
	
	h3.header-call-today-bottom{
		font-size: 30px;
		line-height:30px;
		font-family: "open-sans",sans-serif;
		font-style: normal;
		font-weight: 700;
		letter-spacing: -1px;
		margin-bottom:10px;
		
	
	}


/*----- grid -----*/
/*------------------------------------------------------------*/
	
	.grid {
	    float: none;
	    margin-bottom: none;
	    padding-top:none;
	}


	.grid-right {
	    float: none;
	    margin-bottom: none;
	    padding-top:none;
	}
	
	
	.col-300{
		width: 100%;

	}
	
	.col-300-top-form {
		width: 100%;
	}

	.col-380-key-areas {
		width: 60%;
	}
	
	
	
	.col-540-call-today {
		width: 100%;
	
	}

	.col-300-2grid {
		width: 100%;
	}
	
	
	.col-540{
		width: 100%;

	}

	.col-540-banner-top {
		width: 100%;
	height:250px;
	}


	.col-940-entire {
		width: 100%;
		height:100%;
	}


	.col-940-entire-testimonials {
		width: 100%;
		height:100%;
	}


	
/*----- wrapfix -----*/
/*------------------------------------------------------------*/	
	
	

	.wrapfix{
		max-width:  none;
		margin: 0 auto;
	}


	.wrapfix-header{
		max-width:  none;
		margin: 0 auto;
	}


	.wrapfix-medium{
		max-width:  none;
		margin: 0 auto;
	}


	.wrapfix-small {
		max-width: none;
		margin: 0 auto;
	
	}
	
	
	.wrapfix-small {
		max-width: none;
		margin: 0 auto;
		float:center;
		text-align:left;
	}

    .wrap-blog{
	    padding: 0 0px;
    }
	
	

/*----- menu -----*/
/*------------------------------------------------------------*/

	
	
	.brand-logo{
		float: left;
		background-size:  103px 49px;
		width: 103px;
		height: 49px;


	}


	.btn-mobile{
		background-image: url(../img/icon-menu.png);
		background-size:  50px 52px;
		width: 50px;
		height: 52px;
		float: right;
		cursor: pointer;
	}







/*----- margin -----*/
/*------------------------------------------------------------*/	

	.margin-top-social-map{	
		margin-top:-80px;
	}

	.margin-top-social{	
		margin-top:40px;
	}

	.margin-left-small{
		margin-left:0px;
		}


	.margin-left-smaller{
		margin-left:0px;
		}


	.margin-top-banner {		
		margin-top: 50px;
		}


	.margin-top-image{
		margin-top:0px;	
		}




/*----- other -----*/
/*------------------------------------------------------------*/	



	.text-center{		
		text-align: center;		
		}


	.height-text{
		height:110px;
		}



}




/*----- ///////////////////////////////////////////////////////////-----*/
/*----- ///////////////////////////////////////////////////////////-----*/
/*----- ///////////////////////////////////////////////////////////-----*/
                           /*----- 480px -----*/
/*----- ///////////////////////////////////////////////////////////-----*/
/*----- ///////////////////////////////////////////////////////////-----*/
/*----- ///////////////////////////////////////////////////////////-----*/
 
 


/*----- Galaxy S4 -----*/
@media (max-width: 480px) { 


	html, body {	
	min-width:100%;
	width:500px;
	}




}





/*----- ///////////////////////////////////////////////////////////-----*/
/*----- ///////////////////////////////////////////////////////////-----*/
/*----- ///////////////////////////////////////////////////////////-----*/
                           /*----- 414px +  776px -----*/
/*----- ///////////////////////////////////////////////////////////-----*/
/*----- ///////////////////////////////////////////////////////////-----*/
/*----- ///////////////////////////////////////////////////////////-----*/
 






@media screen and (max-device-width: 414px) and (max-device-height: 776px) { 


html, body {	
	min-width:100%;
	width:414px;
}



.brand-logo{
	float: left;
	background-size:  103px 49px;
	width: 103px;
	height: 49px;

}


.btn-mobile{
	background-image: url(../img/icon-menu.png);
	background-size:  50px 52px;
	width: 50px;
	height: 52px;
	float: right;
	cursor: pointer;
}



 }






/*----- ///////////////////////////////////////////////////////////-----*/
/*----- ///////////////////////////////////////////////////////////-----*/
/*----- ///////////////////////////////////////////////////////////-----*/
                           /*----- 414px -----*/
/*----- ///////////////////////////////////////////////////////////-----*/
/*----- ///////////////////////////////////////////////////////////-----*/
/*----- ///////////////////////////////////////////////////////////-----*/
 
 
 
 
@media screen and (max-device-width: 414px) { 


	html, body {		
	font-size:25px;
	min-width:100%;
	width:435px;
	}




	section#home{
	
				background-image: url(../img/mb-bg-home-435w.jpg);  
				background-attachment:scroll;
				background position:left top;
				background-repeat: no-repeat;
				background-size:  435px 560px;
				width: 435px;
				height: 560px;
				padding:;
				background-color:#1188c9;
				}


				.section-grey{
				width: 435px;
				}
				
				.section-gray{
				width: 435px;
				}
				
				.section-white{
					width: 435px;
				}		
				
				
				.section-blue{
				
					width: 435px;
					
				}
				
				.section-transparent-bottom{
				width: 435px;
				}
				
				footer{
				width: 435px;
				}
				
				
						

	section#map{
	
				background-image: url(../img/mb-bg-map-435w.jpg);  
				background-attachment:scroll;
				background position:left top;
				background-repeat: no-repeat;
				background-size:  435px 259px;
				width: 435px;
				height: 259px;
				padding:;
	
			
				}



	section#contact{
	
				background-image: url(../img/mb-bg-contact-435w.jpg);  
				background-attachment:scroll;
				background position:left top;
				background-repeat: no-repeat;
				background-size:  435px 356px;
				width: 435px;
				height: 356px;
			
			background-color:#3f3f4b;
				}



	section#blog-change{
	
				background-image: url(../img/mb-bg-home-435w.jpg);  
				background-attachment:scroll;
				background position:left top;
				background-repeat: no-repeat;
				background-size:  435px 560px;
				width: 435px;
				height: 560px;
				padding:;
				background-color:#1188c9;
				margin-top:-35px;
				}





			



	.brand-logo{
	float: left;
	background-size:124px 59px;
	width: 124px;
	height: 59px;


	}


	.btn-mobile{
	background-image: url(../img/icon-menu.png);
	background-size:  60px 62px;
	width: 60px;
	height: 62px;
	float: right;
	cursor: pointer;
	}



	


}





/*----- ///////////////////////////////////////////////////////////-----*/
/*----- ///////////////////////////////////////////////////////////-----*/
/*----- ///////////////////////////////////////////////////////////-----*/
                           /*----- 320px -----*/
/*----- ///////////////////////////////////////////////////////////-----*/
/*----- ///////////////////////////////////////////////////////////-----*/
/*----- ///////////////////////////////////////////////////////////-----*/
 
 



@media (max-width: 320px) {

	html, body {
	font-size:20px;
	min-width:100%;
	width:345px;
	}


	.banner{
	background-image: url(../img/ipone_6_bg-banner.jpg);
	background-repeat: no-repeat;
	background-position:center;
	background-size:  345px 321px;
	width: 345px;
	height: 321px; 
	padding:150px 0;		
	background-color: #000;
	-webkit-box-shadow: inset 2px -1px 45px 23px rgba(0,0,0,1);
	-moz-box-shadow: inset 2px -1px 45px 23px rgba(0,0,0,1);
	box-shadow: inset 2px -1px 45px 23px rgba(0,0,0,1);

	}

		
/*----- h1,h2,h3,h4,h5 -----*/
/*------------------------------------------------------------*/	


	p.iphone4-font{

	margin-top:-80px;	
	font-size:40px !important;	

	}


	p.text-big-special{
	font-size: 19px !important;
	line-height: 19px;
	}
	



	header nav.mobile-navigation {
	margin:0 -20px;
	margin-top:60px;
	}

	header nav.mobile-navigation a, header nav.mobile-navigation a:hover{	
	line-height: 60px;
		
	}

	header nav.mobile-navigation-mobile {
	margin-top:8px !important;
	
	}

	header{
	top: 0;
	padding: 18px;
	text-align: center;
	}


	.btn-mobile{
	background-image: url(../img/icon-menu.png);
	background-size:  50px 52px;
	width: 50px;
	height: 52px;
	float: right;
	cursor: pointer;
	}

	
	.brand-logo{
	float: left;
	background-size:103px 49px;
	width: 103px;
	height: 49px;

	}


}









