/*--------------------------------------------------------------------
	
	The Elite Lifestyles
	Responsive CSS
	
--------------------------------------------------------------------*/



/*------------------------------------------------------------------*/
/*------------------------------------------------------------------*/

/*	Height Layouts

/*------------------------------------------------------------------*/

@media screen and (max-height: 680px) {

/*--- Landing Options ---*/
.wrap { top: 25%; }
.overlay { padding: 160px 0; }

}

@media screen and (max-height: 620px) {

/*--- Landing Options ---*/
.landingoptions { position: relative; top: auto; right: auto; bottom: auto; left: auto; }
.landingoptions .leftcol { position: relative; min-height: 540px; }
.landingoptions .rightcol { min-height: 540px; }

.landingoptions .leftcol:hover .wrap,
.landingoptions .rightcol:hover .wrap { top: 5%; }
.overlay { padding: 120px 0; }

/* Footer */
.footer { position: relative; left: auto; right: auto; bottom: auto; }

/* Contacts Draw */
.contactsdraw { display: none; position: relative; left: auto; right: auto; bottom: auto; }
.contactsdraw.visible { display: block; bottom: 0; }

/* Privacy Draw */
.privacydraw { display: none; position: relative; left: auto; right: auto; bottom: auto; }
.privacydraw.visible { display: block; bottom: 0; }
 
}




/*------------------------------------------------------------------*/
/*------------------------------------------------------------------*/

/*	All Mobile : 0-860

/*------------------------------------------------------------------*/

@media screen and (min-width: 0px) and (max-width: 860px) {

/*------------------------------------------------------------------*/
/*	3.	Universal Elements
/*------------------------------------------------------------------*/

/*--- Landing Options ---*/
.landingoptions { position: relative; top: auto; right: auto; bottom: auto; left: auto; width: 100%; height: inherit; }
.landingoptions .leftcol { position: relative; top: auto; right: auto; bottom: auto; left: auto; width: 100%; height: inherit; min-height: 560px; }
.landingoptions .rightcol { position: relative; top: auto; right: auto; bottom: auto; left: auto; width: 100%; height: inherit; min-height: 560px; }
.wrap { top: 15%; }
.overlay { padding: 120px 0; }

.landingoptions .leftcol:hover .wrap,
.landingoptions .rightcol:hover .wrap { top: 5%; }

/* Footer */
.footer { position: relative; left: auto; right: auto; bottom: auto; }
.footer .left { width: 100%; text-align: center; margin: 0 0 20px 0; }
.footer .right { width: 100%; text-align: center; }
.footer ul { line-height: 1.3em; }

/* Contacts Draw */
.contactsdraw { display: none; position: relative; left: auto; right: auto; bottom: auto; }
.contactsdraw.visible { display: block; bottom: 0; }

/* Privacy Draw */
.privacydraw { display: none; position: relative; left: auto; right: auto; bottom: auto; }
.privacydraw.visible { display: block; bottom: 0; }

}

@media screen and (min-width: 0px) and (max-width: 480px) {

.overlay p,
.overlay ul { max-width: 280px; }

/* Footer */
.footer { text-align: center; }
.footer .logo { width: 100%; margin: 0 auto 10px auto; }
.footer .footerdetails { width: 100%; }

/*--- Contacts Draw ---*/
.contactsdraw .container { text-align: left; }

/* Team Members */
.teammembers .teammember { width: 100%; text-align: left; margin: 0 0 20px 0; }
.teammembers .teammember .photo { float: left; width: 30%; }
.teammembers .teammember .details { float: right; width: 66%; }

}