/* 

	Michael Aragon
	
	By
	
	JAS Design
	
	03-03-2019


	
Colors:			
			
					Blue		#016CAA;	#1C2841;		
	

	
*/

/*
	RESET
********************************************/


*											{ margin: 0; 
											  padding: 0; }
											  
html body									{ height: 100%;
											  width: 100%;  }

html										{ overflow-y: scroll; }

body										{ width: 100%;
											  height: 100%;
											  /*font-size: 62.5%;*******************REMOVE WHEN USING BOOTSTRAP***************************/
											  font-family: 'Josefin Slab', serif;
											  color: #000000;
											  line-height: 1.6; }

a											{ outline: none;
											  text-decoration: none; }
											  
img											{ border: none;
											  outline: none; }
											  
li											{ list-style: none; }
											  
.clear										{ clear: both; }



/*
	STRUCTURE
********************************************/											  

#main-content								{ width: 960px;
											  margin: 0 auto; }
											  
.area-background							{ width: 100%;
											  height: auto;
											  background: #8A8A8A; 
											  padding-bottom: 20px;}
											  
#img										{ display: block;
											  margin-left: auto;
											  margin-right: auto;
											  margin-top: 10px;
											  width: 450px; }
											  
#nav-logo									{ height: 50px; }

.nav-link									{ font-size: 2.2em;
											  color: #000000; 
											  font-family: 'Josefin Slab', serif; }
											  
.nav-link:hover								{ color: #1C2841; }
											  
.jumbotron-img								{ width: 100%; }
											  											  
.index-input								{ height: 40px;
											  width: 99.5%;
											  font-size: 1.8em; }
											  											  
.form-label									{ font-size: 1.6em;
											  color: #353535;
											  margin: 20px 0 0 0; }
											  
.form-dropdown								{ width: 100%; 
											  border: none;
											  padding: 10px;
											  font-size: 1.4em; }
											  
.send-button								{ height: 40px;
											  width: 100%;
											  background: #1C2841;
											  color: #FFFFFF;
											  border: none;
											  margin: 20px 0 10px 0;
											  font-size: 1.8em; }
											  
.send-button:hover							{ cursor: hand;
											  background: #8A8A8A; }
											  
.form-area-header							{ width: 100%;
											  height: 35px;
											  background: #8A8A8A;
											  padding: 2px 0 0 10px; }

.form-section-head							{ font-size: 2.0em;
											  color: #FFFFFF; }
											  
body#listings ul.nav li#listings a,
body#buy ul.nav li#buy a,
body#sell ul.nav li#sell a,
body#michael ul.nav li#michael a,
body#resources ul.nav li#resources a,
body#contact ul.nav li#contact a			{ background: #EEEEEE;
											  color: #1C2841;
											  cursor: default; }
											  
											  
											  
											  
											  											  

/*
	COMMON STUFF
********************************************/

.text										{ font-size: 2.2em; }

.make-small									{ font-size: 1.2em; }

.make-large									{ font-size: 2.2em; }

.head1										{ font-family: 'Cinzel', serif; 
											  font-size: 5.6em; }
											  
.head2										{ font-family: 'Raleway', sans-serif; }

.make-closer								{ margin-top: -15px; }
											  
.make-blue									{ color: #1C2841; }

.make-bluish								{ color: #016CAA; }

.make-white									{ color: #FFFFFF; }

.make-black									{ color: #000000; }

.make-red									{ color: #A81111; }

.make-bg-blue								{ background: #1C2841; }

.shadow										{ text-shadow: 2px 2px 3px #161616; }

.button-area								{ margin-top: 30px;
											  margin-bottom: 10px;
											  text-align: center; }	

.small-button								{ background: #1C2841;
										      width: 275px;
										      font-size: 1.8em;
										      color: #FFFFFF;
										      border: none;
										      padding: 5px 10px 5px 10px; }
										      
.small-button:hover 						{ background: #8A8A8A;
	    									 	  color: #FFFFFF;
											  cursor: pointer; }
	    									  
.hr-small-blk								{ width: 300px;
											  height: 1px;
											  background: #000000;
											  margin: auto;
											  margin-top: 20px;
											  margin-bottom: 20px; }	
											  
.hr-small-whi								{ width: 300px;
											  height: 1px;
											  background: #FFFFFF;
											  margin: auto;
											  margin-top: 20px;
											  margin-bottom: 20px; }										  


/*
	INDEX
********************************************/

#hero										{ background: url('../images/bg.jpg') center;
	 										  background-size: cover;
											  position: relative;
											  height: 90vh; }

.text-float-area							{ position: absolute;
											  top: 65%;
											  text-align: center;
											  width: 100%;
											  -ms-transform: translate(0,-50%); /* IE 9 */
											  -webkit-transform: translate(0,-50%); /* Safari */
											  transform: translate(0,-50%); }
											  
.text-float									{ font-size: 600%; 
											  color: #FFFFFF; }

.feat-list									{ margin: auto;
											  margin-bottom: 15px; }
											  
.search-bar-float							{ position: absolute;
											  top: 50%;
											  text-align: center;
											  width: 100%;
											  -ms-transform: translate(0,-50%); /* IE 9 */
											  -webkit-transform: translate(0,-50%); /* Safari */
											  transform: translate(0,-50%); }
											  
.adv-search									{ background: #8A8A8A; }

/*
	TOOLS
********************************************/

.logo-tools									{ margin: 20px 0 20px 0;
											  width: 100%; }
											  
.icon										{ margin-right: 40px; }

											  

/*
	FOOTER
********************************************/

#usaa										{ width: 75%; }

.footer										{ background: #1C2841; }

#footer-left, footer-mid, footer-right		{ margin-bottom: 20px; }

#copyright									{ text-align: center;
											  font-size: 1em;
											  width: 100%; 
											  color: #CCCCCC;
											  background: #000000; }
											  
.footer-badge								{ margin-left: 10px; }

#logo-footer								{ width: 150px;
											  margin: auto;
											  display: block; }
											  
.fb-feed									{ margin: auto;
											  display: block; 
											  width: 100%; }
											  
#realestate-logos							{ width: 190px; }

#cbl-logo-footer							{ width: 250px;
											  margin-top: 10px;
											  margin-bottom: 20px; }
											  
.jas										{ color: #FFFFFF; }

.jas:hover									{ color: #7FB141; }

											  

											  
/*
	SOCIAL NAV
********************************************/

.social										{ float: right;
											  height: 75px; }

.social-nav 								{ position: relative; 
											  width: 100px; }
											  
.social-nav li								{ margin: 0;
										      padding: 0;
										      list-style: none;
										      position: absolute;
										      top: 0; }
										      
.social-nav li, .social-nav a				{ height: 50px;
    										  display: block; }
											  

.fb 										{ width: 50px;
											  background: url('../images/badge-social.png') 0 0; }

.mail 										{ width: 50px;
										  	  left: 75px;
											  background: url('../images/badge-social.png') -150px 0; }
											  
.fb a:hover									{ background: url('../images/badge-social.png') 0 -50px; }

.mail a:hover								{ background: url('../images/badge-social.png') 50px -150px; }

		






/*
	MOBILE
********************************************/



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

.michael-bio-pic							{ margin: auto; }

#footer-address								{ text-align: center; }

#realestate-logos							{ margin-left: auto;
											  margin-right: auto;
											  margin-bottom: 40px;
											  display: block; }
											  
#logo-footer								{ margin-bottom: 50px; }

.social										{ float: none;
											  margin-left: -20px; }

#badges										{ margin: auto; 
											  display: block; }

.search-bar-float							{ position: absolute;
											  top: 35%;
											  text-align: center;
											  width: 100%;
											  -ms-transform: translate(0,-50%); /* IE 9 */
											  -webkit-transform: translate(0,-50%); /* Safari */
											  transform: translate(0,-50%); }
											  
.text-float-area							{ position: absolute;
											  top: 80%;
											  text-align: center;
											  width: 100%;
											  -ms-transform: translate(0,-50%); /* IE 9 */
											  -webkit-transform: translate(0,-50%); /* Safari */
											  transform: translate(0,-50%); }

									  



}



/*
	IPHONE 6 PLUS
********************************************/

@media only screen 
and (min-device-width : 414px) 
and (max-device-width : 736px) 
and (orientation : portrait) { 
	

.michael-bio-pic							{ margin: auto; }

.text-float-area							{ position: absolute;
											  top: 65%;
											  text-align: center;
											  width: 100%;
											  -ms-transform: translate(0,-50%); /* IE 9 */
											  -webkit-transform: translate(0,-50%); /* Safari */
											  transform: translate(0,-50%); }
											  
#realestate-logos							{ margin-left: auto;
											  margin-right: auto;
											  margin-bottom: 40px;
											  display: block; }
											  
	
	
}