/************************************************************************************************************

	CSS Page:		HOME
	CSS Name:     	home.css
	

	CSS STRUCTURE
	
	1. BANNER (slideshow)
		1.1 THUMBNAIL
	2. HOME FLEET
	
	
************************************************************************************************************/
a[href^="tel:"] {

	background:#000 !important;
	color:#FFF !important;
	font-size:1em !important;
	border-left:none !important;
}

/* 1. BANNER (slideshow)
------------------------------------------------------------------------------------------------------------
==========================================================================================================*/
#homeBanner {
	width:100%;
	display:block;	
}

article.smallContent {
	position:absolute;
	margin: 0 auto;
	left: 0%;
	right: 0;
	top:32%;
	width:70%;
	max-width: 1200px;
	height: 60px;
	text-align:center;
	color:#FFF;
}

article.smallContent h2{
	font-weight:900;
	font-size:3.5em;
	text-transform:uppercase;
	margin:0;
	line-height:1em;
}

article.smallContent p{
	font-weight:100;
	font-size:2em;
	margin:0;
	padding-bottom:1em;
}

article.smallContent a {
	color:#FFF;
	padding:.5em;
	background:#74cdd6;
	text-transform:uppercase;
}

article.smallContent a:hover {
	color:#000;
	background:#FFF;
	padding:.5em;
}



/* 2. HOME FLEET
------------------------------------------------------------------------------------------------------------
==========================================================================================================*/

section#homeFleet {
	background:url(../img/fleet.jpg) no-repeat center center fixed;
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	     -o-background-size: cover;
			background-size: cover;
	padding:2em 0em 0em 0em;
}

article#fleetWrapper 		{ text-align:center; }
article#fleetWrapper ul		{ margin-bottom:5em;}
article#fleetWrapper ul li	{}

article#fleetWrapper ul li h2 {
	font-size:2.5em;
	text-transform:uppercase;
	font-weight:900;
	margin:0;
}

article#fleetWrapper ul li p {
	font-size:1.5em;
	font-weight:100;
	margin:0;
}

article#fleetWrapper ul li a {
	padding:.7em;
	color:#FFF;
	background:#74cdd6;
	position:relative;
	top:2em;
	font-size:.9em;
	text-transform:uppercase;
}

article#fleetWrapper ul li a:hover { color:#FFF; background:#000;}

/* 3. HOME NEWS
------------------------------------------------------------------------------------------------------------
==========================================================================================================*/

#newsPanel {
	background:#000;
	width:100%;
	padding-bottom:5em;	
}

article.smallNews {
	color:#FFF;
	text-align:left;	
	width:33.3%;
	padding:5em 2em 1em 2em;
	float:left;
}

article.smallNews ul 	{ text-align:center;}
article.smallNews ul li {}
article.smallNews ul li h4 	{ font-weight:900; margin:0; padding-top:1em;}

article.smallNews ul li p { 
	font-size:1em; 
	font-weight:100;
	text-align:center;
}

article.smallNews ul li a { 
	color:#000; 
	background:#FFF; 
	padding:.5em; 
	font-size:.8em;
	position:relative;
	top:1em;
}

article.smallNews ul li a:hover {
	background:#74cdd6;
	color:#FFF;	
}




/* 3. RESPONSIVE
------------------------------------------------------------------------------------------------------------
==========================================================================================================*/
	
	@media only screen and (max-width: 480px) {
		/* BANNER */
		article.smallContent { width:90%;}
		article.smallContent h2{ font-size:2em;}
		article.smallContent p{ font-size:1.3em;}
		/* FLEET */
		article#fleetWrapper ul li h2 { font-size:2em; line-height:.8em;}
		/* NEWS */
		article.smallNews { padding:1em 2em 1em 2em; width:100%;}
		#new-royalslider-11 { height:500px !important;}
	}
	
	@media (min-width: 481px) and (max-width: 768px) {
		/* BANNER */
		article.smallContent { top:22%;}
		article.smallContent h2{ font-size:2.5em;}
		article.smallContent p { font-size:1.5em; }
		.bannerStage { max-height:auto;}
		.bannerStage .caption h2 { font-size:2em;}
		.bannerStage .caption p { font-size:1.5em;}
		.bannerStage .caption a {font-size:.8em;}
		/* FLEET */
		article#fleetWrapper ul li h2 { font-size:2em; line-height:.8em;}
		/* NEWS */
		article.smallNews { padding:1em 2em 1em 2em; width:100%;}
		#newsPanel { padding-bottom:1em;	}
	}