/* ==========================================================================
   Shared styles
   ========================================================================== */

/* Width */
.width-100pc		{	width: 100%;		}
.width-70pc			{	width: 70%;
						max-width: 900px;	}
.width-900px 		{	width: 900px;		}
@media screen and (max-width: 900px) {
	.width-70pc		{	width: 100%;
						max-width: 100%;	}
	.width-900px	{	width: 90%;			}
}

/* Height */
.hgh-360px			{	height: 360px;		}
.hgh-min360px		{	min-height: 360px;	}
@media screen and (max-width: 900px) {
	.hgh-min360px	{	min-height: auto;	}
}

/* Alignment */
.align-center  {
	margin-left: auto;
	margin-right: auto;
}
img.align-center {
	display: block;
}
p.align-center {
	text-align: center;
}

/* Padding */
.pad-big	{	padding: 5em;		}
.pad-big-t	{	padding-top: 5em;	}
.pad-big-d	{	padding-bottom: 5m;	}
.pad-big-l	{	padding-left: 5em;	}
.pad-big-r	{	padding-right: 5em;	}
.pad-mid	{	padding: 3em;		}
.pad-mid-t	{	padding-top: 3em;	}
.pad-mid-d	{	padding-bottom: 3em;}
.pad-mid-l	{	padding-left: 3em;	}
.pad-mid-r	{	padding-right: 3em;	}
.pad-sm		{	padding: 1em;		}
.pad-sm-t	{	padding-top: 1em;	}
.pad-sm-d	{	padding-bottom: 1em;}
.pad-sm-l	{	padding-left: 1em;	}
.pad-sm-r	{	padding-right: 1em;	}
@media screen and (max-width: 600px) {
	.pad-big, .pad-mid, .pad-sm			{	padding: 1em;		}
	.pad-big-t, .pad-mid-t, .pad-sm-t	{	padding-top: 1em;	}
	.pad-big-d, .pad-mid-d, .pad-sm-d	{	padding-bottom: 1em;}
	.pad-big-l, .pad-mid-l, .pad-sm-l	{	padding-left: 1em;	}
	.pad-big-r, .pad-mid-r, .pad-sm-r	{	padding-right: 1em;	}
}

/* Headings */
h1, h2 {
	text-align: center;
	font-weight: 300;
}
h1 { font-size: 3.3em;	}
h2 { font-size: 2.2em;	}
h3 { font-size: 1.1em;	}

/* ==========================================================================
   Main styles
   ========================================================================== */

body#body {
	background-color: #252525;
	color: #3d3d3d;
}

	#header {
		background-color: #fefefe;
	}
		
		/* Logo */
		#header-logo {
			background-color: cyan;
			float: left;
		}
		
		#header-menu {
			float: right;
		}
		
		@media screen and (max-width: 500px) {
			#header-logo {
				float: none;
				margin-bottom: 1em;
				text-align: center;
			}
			
			#header-menu {
				float: none;
				clear: both;
			}
		}
	
	#main {
		background-color: #ffffff;
		/* Hmm, not needed after all
		clear: both; */
	}
	
		#main-slider {
			position: relative;
			width: 100%;
			overflow: auto;
			
			font-size: 1em;
			line-height: 1em;
			text-align: center;
			
			color: rgba(255, 255, 255, .6);
			text-shadow: 0 0 1px rgba(0, 0, 0, .05), 0 1px 2px rgba(0, 0, 0, .3);
			
			/*background: #5b4d3d;
			box-shadow: 0 1px 2px rgba(0, 0, 0, .25);*/
		}
		@media screen and (max-width: 600px) {
			#main-slider {
				visibility: hidden;
				display: none;
			}
		}
		
			#main-slider ul {
				list-style: none;
				width: 300%;
				padding: 0 !important;
			}
			
				#main-slider ul li {
					display: block;
					float: left;
					width: 33%;
					padding: 1em 0;
					min-height: 18em;
					
			/*		-webkit-background-size: 100% 100%;*/
					-moz-background-size: 100% 100%;
					-o-background-size: 100% 100%;
					-ms-background-size: 100% 100%;
			/*		background-size: 100% 100%;*/
					
					box-shadow: inset 0 -3px 6px rgba(0, 0, 0, .1);
				}
	
					#main-slider h1, #main-slider h2 {
						font-size: 2.2em;
						line-height: 2.2em;
						
						color: #fff;
					}
	
					#main-slider .btn {
						display: inline-block;
						margin: 0;
						padding: 0.3em 1.2em 0.5em;
						clear: both;
						
						color: #fff;
						font-size: 0.7em;
						font-weight: bold;
						text-transform: uppercase;
						text-decoration: none;
						
						border: 2px solid rgba(255, 255, 255, .4);
						border-radius: 5px;
					}
					#main-slider .btn:hover {
						background: rgba(255, 255, 255, .8);
					}
					#main-slider .btn:active {
						-webkit-filter: drop-shadow(0 -1px 2px rgba(0, 0, 0, .5));
						-moz-filter: drop-shadow(0 -1px 2px rgba(0, 0, 0, .5));
						-ms-filter: drop-shadow(0 -1px 2px rgba(0, 0, 0, .5));
						-o-filter: drop-shadow(0 -1px 2px rgba(0, 0, 0, .5));
						filter: drop-shadow(0 -1px 2px rgba(0, 0, 0, .5));
					}
		
					#main-slider .btn, #main-slider .dot {
						-webkit-filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .3));
						-moz-filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .3));
						-ms-filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .3));
						-o-filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .3));
						filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .3));
					}
	
					#main-slider .dots {
						position: absolute;
						left: 0;
						right: 0;
						bottom: 0.5em;
						padding: 0 !important;
					}
						#main-slider .dots li {
							display: inline-block;
							width: 0.5em;
							height: 0.5em;
							margin: 0 0.3em;
							
							text-indent: -999em;
							
							border: 2px solid #fff;
							border-radius: 1em;
							
							cursor: pointer;
							opacity: .4;
							
							-webkit-transition: background .5s, opacity .5s;
							-moz-transition: background .5s, opacity .5s;
							transition: background .5s, opacity .5s;
						}
						#main-slider .dots li.active {
							background: #fff;
							opacity: 1;
						}
		
		#main-section {
			clear: both;
		}
	
	#footer1 {
		background-color: #333333;
		color: #cccccc;
		font-size: 0.9em;
	}
	#footer1 a:link		{	color: #929595;	}
	#footer1 a:hover,
	#footer1 a:active,
	#footer1 a:visited	{	color: #30beda;	}
	
	#footer2 {
		background-color: #252525;
		color: #666666;
		font-size: 0.8em;
	}