﻿/*   

Theme Name: Sandcastles

Theme URI: http://snapfrozen.com.au

Description: A custom Wordpress theme.

Author: Snapfrozen

Author URI: http://snapfrozen.com.au

Version: 2

*/



/* Table of Content

==================================================

	#Site Styles

	#Page Styles

	#Media Queries

	#Font-Face */



/* #Site Styles

================================================== */



/* Resets */

	

html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;vertical-align: baseline; }



body{
background:url(images/pattern-bg.jpg);
background:url(images/background2.png), url(images/background1.jpg) center top no-repeat, url(images/background0.jpg); 

font-family: 'Titillium Web', sans-serif; 

font-size: 16px; 

-webkit-text-stroke-width: .2px; -webkit-font-smoothing:antialiased;



font-weight: 400; overflow-x: hidden;

}



a { text-decoration: none; }

a:hover { opacity: 0.8; }

	

.clearfix:after {

			content: ".";

			display: block;

			height: 0;

			clear: both;

			visibility: hidden;

}



/* Columns */

	

.column-one-half, .column-one-third, .column-one-fourth, .column-two-thirds, .column-three-fourths{float:left;margin-right:2%;overflow:hidden; position:relative;margin-bottom:30px;}

	

/* Widths */	



.column-one-half{width:49%;}

.column-one-third{width:31.6666%;}

.column-one-fourth{width:23%;}

.column-two-thirds{width:66.3334%;}

.column-two-thirds img, a.fg-image { height: auto !important; }

a.fg-image { border-bottom: 1px solid #ccc !important; max-width: 98% !important; }

span.fg-title, img.fg-shadow { top: 0px !important; }

span.fg-title { border-top: 1px solid #ccc !important; max-width: 98% !important; }

li.fg-listItem { max-height: 410px !important; } 

.column-three-fourths{width:75%;}

.last{margin-right:0; clear:right;}



.container {

	max-width: 885px;

	padding: 25px 70px;

	position: relative;

	margin: 0 auto;

}



.container img {

	border-radius: 10px;

	margin: 5px 0px;

}



.button { background: url(images/button.png) center top no-repeat; width: 116px; height: 34px; color: #fff; padding: 5px 10px; padding-top: 3px; text-align: center; display: block; margin-left: -10px; font-size: 16px; }



img { max-width: 100%; }

li { list-style: inside; padding: 0px 5px; }

.left { float: left; }

.right { float: right; }



/* #Page Styles

================================================== */





/* Header + Top Area */



.hotline { position: relative; z-index: 3; max-width: 1030px; margin: 0 auto; margin-top: 0px; margin-bottom: 0px; }



.hotline img { right: 0px; position: absolute; border-top-left-radius: 10px; border-top-right-radius: 10px; top: 5px; }



.top-bg {

	height: 1200px;

	position: absolute;

	top: 0px;

	width: 100%;

	background:url(images/top-bg.jpg) top center no-repeat;	

}



.logo { left: -20px; top: -15px; position: absolute; }

.visible-ie7 { display: none; }



header {

	max-width: 1280px;

	padding-top: 46px;

	background: url(images/top-most-bg.png) center top no-repeat;

	position: relative;

	margin: 0 auto;

}



.fade-strip {

	background: url(images/fade-strip.png) repeat-x;	

	height: 222px;

	width: 100%;

	margin-top: 40px;

	position: absolute;

	z-index: 3;

}





.top-nav {

	margin-top: 60px;

/* Gethin added 

/*position: absolute;*/

/*right: 10px;*/

}

.menu li { padding: 0px; }

.top-nav img{

	float: right;

	margin-bottom: 30px;	

}



select {

	-webkit-appearance: none;

	appearance: none;

	border-radius:0;

}

		

#main-nav select {

	background: #f7f7f7;

	width:85%;

	font-size: 18px;

	height: 48px;

	margin:0 auto;

	color: #333 !important;

	border:none;

	padding:9px 10px 10px 10px;

	font-family:'Open Sans',sans-serif;

	float:left;

	display:none;

}



#main-nav a, .footer-strip-menu a { text-transform: lowercase; }

		

/* First Content Strip */



.sand-strip-top {

	background: #f4efdd;

	border-bottom: 3px dotted #fbaf5d;

	color: #c85000;

	padding-top: 40px;

}



.sand-strip-top h3 {

	font-size: 25px;

	font-weight: 700;

-webkit-text-stroke-width: .7px;-webkit-text-stroke-color: #c85000;-webkit-font-smoothing:antialiased;

}



.sand-strip-top p{ color: #ba3000; line-height: 22px !important; letter-spacing: -0.6px !important; -webkit-text-stroke-width: .2px;-webkit-text-stroke-color: #ba3000;-webkit-font-smoothing:antialiased;}



.excerpt { height: 280px; }



.sand-strip-top .button { margin: 0 auto; margin-top: 20px; }



/* Second Strip */



.white-strip-content {

	background: #fff;

	color: #c85000;

}



.alt-page { padding-top: 50px; }



.alt-page img { border-radius: 0px; float: left; margin-right: 20px; margin-bottom: 20px; }



.white-strip-content h3 { color: #a60000; font-size: 30px; letter-spacing: -0.6px; font-weight: 700;  -webkit-text-stroke-color: #a60000;  }



.white-strip-content p {

	color: #464646;

	font-size: 18px;

	line-height: 23px;

-webkit-text-stroke-color: #464646;

	

}



.tour { float: left; margin-top: 25px; }



.tour img { float: left; margin-right: 10px; margin-bottom: 10px; }



.promotion img{

	border-radius: 5px !important;

	border: 2px solid #ece3d5 !important;

}



.promotion-container {

	margin-top: -80px;

	z-index: 4;

	position: relative;

}



.specials {

	background: #f26522;

	padding: 20px;

	border-radius: 10px;

	min-height: 100px;	

}

.gcforsale {

	background: #6367B3 !important;

	

}

.specials img { margin: 0 auto; display: block; }



.specials strong, .specials p, .specials a { color: #fff; }

.specials strong { margin-top: 20px; font-size: 25px; margin-bottom: -10px; font-weight: 700; display: block; }

.specials p { margin-bottom: 15px; }



/* Footer + Menu */



.footer-strip-menu {

	background: #b3a896;

}



.footer-strip-menu nav, .fade-strip nav { float: right; margin-top: -15px; color: #fff; font-size: 18px; letter-spacing: -1px; font-weight: 400; }

.fade-strip nav { color: #b2b2b2; }

.footer-strip-menu li, .fade-strip li { display: inline-block; }

.footer-strip-menu a { color: #fff; }

.fade-strip a { color: #b2b2b2; }

.footer-strip-menu li:not(:last-child):after, .fade-strip li:not(:last-child):after {

	padding: 0px 5px;
	content: '·';
}

.trip-advisor { font-size: 20px; }



.footer-lining {

	background: #fff;

	margin-top: 0px;	

	padding-top: 0px;

}



.footer-tear {

	background: #fff url(images/tear.png) bottom repeat-x;

	color: #555;	

	border-top: 1px solid #eee;

	margin-top: -20px;

	padding-top: 40px;

	padding-bottom: 80px;

}



.footer-tear a { color: #6a6a6a; }



.footer-tear .last { padding-top: 5px; font-weight: 500; }



.social {

	text-align: center;

	float: left;

	margin-top: -6px;

}

	

.social li {

	display: inline;



}

	

.social img {

	background: #717171;

	width: 35px;

	height: 35px;

	border-radius: 0px;

}



/* Browser Resets */

.flex-container a:active,

.flexslider a:active,

.flex-container a:focus,

.flexslider a:focus  {outline: none;}

.slides,

.flex-control-nav,

.flex-direction-nav {margin: 0; padding: 0; list-style: none;} 

.flex-control-nav { display: none; }

/* FlexSlider Necessary Styles

*********************************/ 

.slider {

	padding-top: 160px;

	background: #2ba1be;

	border: 2px solid #fff;

}

.flexslider {margin: 0; padding: 0;}

.flexslider .slides > li {display: none; list-style: none; padding: 0px; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */

.flexslider li { list-style: none; padding: 0px; }

.flexslider .slides img {width: 100%; display: block;}

.flex-pauseplay span {text-transform: capitalize;}



/* Clearfix for the .slides element */

.slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} 

html[xmlns] .slides {display: block;} 

* html .slides {height: 1%;}



/* No JavaScript Fallback */

/* If you are not using another script, such as Modernizr, make sure you

 * include js that eliminates this class on page load */

.no-js .slides > li:first-child {display: block;}





/* FlexSlider Default Theme

*********************************/



.flexslider {margin: 0 0 0px; background: #fff; border: 2px solid #fff; position: relative; box-shadow: 0 34px 32px -32px rgba(0,0,0,.85); zoom: 1; z-index: 1; }

.flex-viewport {max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease;}

.loading .flex-viewport {max-height: 300px;}

.flexslider .slides {zoom: 1;}



.carousel li {margin-right: 5px}





/* Direction Nav */

.flex-direction-nav {*height: 0;}

.flex-direction-nav a {width: 30px; height: 30px; margin: -20px 0 0; display: block; background: url(images/bg_direction_nav.png) no-repeat 0 0; position: absolute; top: 50%; z-index: 10; cursor: pointer; text-indent: -9999px; opacity: 0; -webkit-transition: all .3s ease;}

.flex-direction-nav .flex-next {background-position: 100% 0; right: -36px; }

.flex-direction-nav .flex-prev {left: -36px;}

.flexslider:hover .flex-next {opacity: 0.8; right: 5px;}

.flexslider:hover .flex-prev {opacity: 0.8; left: 5px;}

.flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover {opacity: 1;}

.flex-direction-nav .flex-disabled {opacity: .3!important; filter:alpha(opacity=30); cursor: default;}



/* Control Nav */

.flex-control-nav {width: 100%; position: absolute; bottom: -40px; text-align: center;}

.flex-control-nav li {margin: 0 6px; display: inline-block; zoom: 1; *display: inline;}

.flex-control-paging li a {width: 11px; height: 11px; display: block; background: #666; background: rgba(0,0,0,0.5); cursor: pointer; text-indent: -9999px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; box-shadow: inset 0 0 3px rgba(0,0,0,0.3);}

.flex-control-paging li a:hover { background: #333; background: rgba(0,0,0,0.7); }

.flex-control-paging li a.flex-active { background: #000; background: rgba(0,0,0,0.9); cursor: default; }



.flex-control-thumbs {margin: 5px 0 0; position: static; overflow: hidden;}

.flex-control-thumbs li {width: 25%; float: left; margin: 0;}

.flex-control-thumbs img {width: 100%; display: block; opacity: .7; cursor: pointer;}

.flex-control-thumbs img:hover {opacity: 1;}

.flex-control-thumbs .flex-active {opacity: 1; cursor: default;}



@media screen and (max-width: 860px) {

  .flex-direction-nav .flex-prev {opacity: 1; left: 0;}

  .flex-direction-nav .flex-next {opacity: 1; right: 0;}

}





/* #Media Queries

================================================== */



	/* Smaller than standard 960 (devices and browsers) */

	@media only screen and (max-width: 1200px) {

		.logo { left: 0px; }

	}



	/* Tablet Portrait size to standard 960 (devices and browsers) */

	@media only screen and (min-width: 768px) and (max-width: 959px) {

		.logo { width: 50%; }

		.top-nav { margin-top: 30px; }

		.excerpt { height: 270px; }

	}



	/* All Mobile Sizes (devices and browser) */

	@media only screen and (max-width: 767px) {

		.column-one-third, .column-two-thirds, .tour { width: 100%; }	

		.design-by { float: left; }

		.footer-strip-menu { height: 30px; }	

		

		.logo { width: 50%; }		

		#main-nav ul { display: none; }

		#main-nav select{

		width:100%;

		display: block;

		font-size:16px;

		}	

		a.fg-image { border-bottom: 1px solid #ccc !important; max-width: 95% !important; }

		span.fg-title { border-top: 1px solid #ccc !important; max-width: 95% !important; }

	}



	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */

	@media only screen and (min-width: 480px) and (max-width: 767px) {

		.top-nav img { display: none; }

		.top-nav nav { margin-top: 20px; }

		.logo { width: 400px; }

		.promotion-container {

		margin-top: 0px;	

		}

	}



	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */

	@media only screen and (max-width: 479px) {

		.hotline img { width: 300px !important; top: 15px; }

		.top-nav { width: 100% !important; }

		.top-nav img, .footer-strip-menu {

			display: none;

		}

		.logo { width: 320px; }

		.top-nav nav { margin-top: 30px; }

		.promotion-container {

		margin-top: 0px;	

		}

		.alt-page img { width: 100%; }

		.excerpt { height: 270px; }

	}





/* #Font-Face

================================================== */

/* 	This is the proper syntax for an @font-face file

		Just create a "fonts" folder at the root,

		copy your FontName into code below and remove

		comment brackets */



/*	@font-face {

	    font-family: 'FontName';

	    src: url('fonts/FontName.eot');

	    src: url('fonts/FontName.eot?iefix') format('eot'),

	         url('fonts/FontName.woff') format('woff'),

	         url('fonts/FontName.ttf') format('truetype'),

	         url('fonts/FontName.svg#webfontZam02nTh') format('svg');

	    font-weight: normal;

	    font-style: normal; }

*/



/* Gethin ========================== */



H4 { color: #88cc56; font-size: 24px; letter-spacing: -0.6px; font-weight: 700; }

H2 { color: #375690; font-size: 30px; letter-spacing: -0.6px; font-weight: 700; }



.alignnone {

float:none !important;

clear:both !important;

text-align:left;

}



.pp_social{

float:none !important;

}

div.facebook {

width:80px !important;

}



em {font-family: 'Alegreya', serif;

font-style:italic;}