/*
Theme Name: Aldinga
Author: klik
Author URI: http://www.weareklik.net.au
Description: Custom theme for Aldinga Seaside
*/

/* ================================================================================================================================ */
/* ================================================================================================================================ */
/* ================================================================================================================================ */

@media screen {

	/* ---------------- overall style ---------------- */
	
	body {
		font-family:museo-sans,sans-serif;
		font-size:16px;
		line-height:140%;
		background-color:#fff;
		color:#444;
	}
	
	h1,h2,h3,h4,h5,h6 {
		line-height:110%;
		color:#444;
		margin:16px 0;
	}
	
	h1 {
		margin:32px 0;
	}
	
	h2 {
		margin:24px 0;
	}
	
	h1:first-child,h2:first-child,h3:first-child,h4:first-child,h5:first-child,h6:first-child {
		margin-top:0;
	}
	
	p {
		margin:16px 0;
	}
	
	p:first-child {
		margin-top:0;
	}
	
	p:last-child {
		margin-bottom:0;
	}
	
	p a {
		color:#12A0DC;
	}
	
	
	
	#main {
		position:relative;
		z-index:6000;
	}

	.product .images {
	display:none;
	}
	
	#main .main_top {
		position:absolute;
		top:0;
		right:0;
		left:0;
		display:table;
		width:100%;
	}
	
	#main .main_top .left {
		display:table-cell;
		text-align:left;
		vertical-align:top;
		padding:32px;
	}
	
	#main .main_top .left a img {
		width:120px;
		height:auto;
	}
	
	#main .main_top .right {
		display:table-cell;
		text-align:right;
		vertical-align:top;
		padding:32px;
	}
	
	#nav_button {
		color:#666;
		font-size:16px;
		text-transform:uppercase;
	}
	
	.button {
		display:inline-block;
		line-height:100%;
		padding:12px;
		background-color:#fff;
		border:2px solid #888;
		color:#888;
		font-weight:500;
		text-transform:uppercase;
		text-decoration:none;
		transition:transform 0.1s, border-color 0.1s, color 0.2s;
	}
	
	.button:hover {
		color:#444;
		border-color:#444;
	}
	
	.button:active {
		transform:scale(0.95);
		transition:transform 0s;
	}
	
	/* ---------------- header ---------------- */
		
	header {
		position:absolute;
		position:fixed;
		top:0;
		left:0;
		width:100%;
		bottom:0;
		line-height:100vh;
		background-color:#444;
		-webkit-transform:translateX(-100%);
		-moz-transform:translateX(-100%);
		-ms-transform:translateX(-100%);
		transform:translateX(-100%);
		-webkit-transition:transform 0.5s, width 0.5s;
		-moz-transition:transform 0.5s, width 0.5s;
		-ms-transition:transform 0.5s, width 0.5s;
		transition:transform 0.5s, width 0.5s;
		z-index:7000;
		background-image:url('images/bg_home.jpg');
		background-size:cover;
		background-position:center center;
	}
	
	header.show {
		-webkit-transform:translateX(0);
		-moz-transform:translateX(0);
		-ms-transform:translateX(0);
		transform:translateX(0);
	}
	
	header nav {
		display:inline-block;
		padding:32px;
		line-height:120%;
		vertical-align:middle;
	}
	
	header nav #nav_close {
		position:absolute;
		top:32px;
		right:32px;
		color:#fff;
		text-decoration:none;
		font-size:24px;
		font-weight:900;
	}
	
	header nav ul {
		padding:0;
		margin:0;
	}
	
	header nav ul > li {
		list-style:none;
	}
	
	header nav ul > li > a {
		display:block;
		color:rgba(255,255,255,0.7);
		font-size:30px;
		font-weight:500;
		text-transform:uppercase;
		text-decoration:none;
		line-height:120%;
		transition:color 0.2s;
	}
	
	header nav ul > li.current > a {
		color:rgba(255,255,255,1);
	}
	
	header nav ul > li > a:hover {
		color:rgba(255,255,255,1);
	}
	
	/* ---------------- footer ---------------- */

	/* ---------------- home ---------------- */
	
	#home_feature {
		line-height:100vh;
	}
	
	#home_feature > .inner {
		display:inline-block;
		line-height:140%;
		vertical-align:middle;
		padding:96px 32px 32px 32px;
	}
	
	#home_feature h1 {
		font-size:30px;
		letter-spacing:2px;
		text-transform:uppercase;
		margin:0 0 16px 0;
		color:#444;
	}
	
	#home_feature h2 {
		font-size:30px;
		letter-spacing:2px;
		text-transform:uppercase;
		font-weight:300;
		margin:0 0 32px 0;
		color:#12A0DC;
	}
	
	/* ---------------- back pages ---------------- */
	
	#page_wrapper .page_content {
		padding:128px 32px 32px 32px;
		line-height:150%;
		font-weight:300;
	}
	
	#page_wrapper .page_content h1 {
		text-transform:uppercase;
		color:#12A0DC;
	}
	
	#page_wrapper .page_content hr {
		margin:32px 0;
		border:none;
		height:0px;
		border-top:1px solid #ccc;
	}
	
	#page_wrapper .page_content .table_div > .left {
		display:table-footer-group;
	}
	
	#gallery {
		display:table-header-group;
		line-height:100%;
		margin-top:64px;
	}
	
	#gallery ul {
		padding:0;
		margin:0;
		margin-bottom:64px;
	}
	
	#gallery ul li {
		display:inline-block;
		list-style:none;
		margin-bottom:2px;
	}
	
	#gallery ul li a {
		display:block;
	}
	
	#gallery ul li a img {
		width:120px;
		height:120px;
		display:block;
	}
	
	.fancybox-skin {
		border-radius:0;
	}
	
	/* ---------------- woocommerce style ---------------- */
	
	.wc-bookings-booking-form-button {
		margin-top:32px;
		border-color:#12A0DB;
		color:#12A0DB;
		transition:color 1s,border-color 1s;
	}
	
	.wc-bookings-booking-form-button.disabled {
		border-color:#CCC;
		color:#CCC;
	}
	
	.wc-bookings-booking-form-button.disabled.very-disabled {
		border-color:#eee;
		color:#eee;
	}
	
	.product-type-booking .price {
		display:none;
	}
	
	#product_description {
		margin-top:64px;
	}
	
	.woocommerce form {
		font-size:14px;
	}
	
	.woocommerce-checkout input[type='text'],
	.woocommerce-checkout input[type='email'],
	.woocommerce-checkout input[type='tel'] {
		border-width:1px;
		border-style:solid;
		line-height:32px;
		height:32px;
		padding:0 8px;
	}
	
	.woocommerce form .form-row.woocommerce-validated .select2-container, 
	.woocommerce form .form-row.woocommerce-validated input.input-text, 
	.woocommerce form .form-row.woocommerce-validated select {
		border-color:#12A0DB;
	}
	
	.woocommerce form .form-row.woocommerce-invalid .select2-container, 
	.woocommerce form .form-row.woocommerce-invalid input.input-text, 
	.woocommerce form .form-row.woocommerce-invalid select {
		border-color:#F26324;
	}
	
	.woocommerce .select2-container .select2-choice {
		border-radius:0;
		height:32px;
		line-height:32px;
		background-image:none;
		background-color:#fff;
		border-color:#ccc;
	}
	
	.woocommerce .select2-container.select2-container-active .select2-choice {
		border-color:#12A0DC;
		box-shadow:none;
	}
	
	.woocommerce .select2-container .select2-choice .select2-arrow {
		border-radius:0;
		border-left:1px solid #ccc;
		background-image:none;
		background-color:#fff;
	}
	
	.woocommerce form .form-row .input-text, 
	.woocommerce-page form .form-row .input-text {
		padding:8px;
		border:1px solid #ccc;
	}
	
	.woocommerce form .form-row .input-text:focus, 
	.woocommerce-page form .form-row .input-text:focus {
		border-color:#444;
	}
	
	.woocommerce #customer_details > .col-1 {
		width:100%;
	}
	
	.woocommerce #customer_details > .col-2 {
		width:100%;
		margin-top:32px;
		margin-bottom:32px;
	}
	
	#calendar_key {
		border:1px solid #ccc;
		padding:8px;
		margin:32px 0 0 0;
	}
	
	#calendar_key h4 {
		margin:0 0 8px 0;
	}
	
	#calendar_key .item {
		display:inline-block;
		margin-right:16px;
		margin-bottom:8px;
	}
	
	#calendar_key .item .image {
		display:inline-block;
		width:24px;
		height:24px;
		margin:0 8px 0 0;
		background-image:url(images/legend.png);
		background-size:auto 100%;
		background-position:0 0;
		vertical-align:middle;
	}
	
	#calendar_key .item[data-type='available'] .image { background-position:25% 0; }
	#calendar_key .item[data-type='part'] .image { background-position:50% 0; }
	#calendar_key .item[data-type='booked'] .image { background-position:75% 0; }
	#calendar_key .item[data-type='current'] .image { background-position:100% 0; }
	
	#calendar_key .item .text {
		display:inline-block;
		font-size:12px;
		line-height:24px;
		vertical-align:middle;
	}
	
	.airbnb_links .link {
		margin-bottom:16px;
	}
	
	.airbnb_links .link a {
		display:block;
		background-color:#666;
		color:#fff;
		text-decoration:none;
		font-weight:700;
		vertical-align:middle;
		padding:16px;
		width:100%;
		max-width:256px;
	}
	
	.airbnb_links .link.blue a {
		background-color:#12A0DB;
	}
	
	.airbnb_links .link.blue a:hover {
		background-color:#3FB3E4;
	}
	
	.airbnb_links .link.orange a {
		background-color:#F16124;
	}
	
	.airbnb_links .link.orange a:hover {
		background-color:#FE7E47;
	}
	
	.airbnb_links .link a img {
		width:72px;
		height:auto;
		display:block;
		margin:0 0 8px 0;
		vertical-align:middle;
	}
	
}

/* ================================================================================================================================ */
/* ================================================================================================================================ */
/* ================================================================================================================================ */

@media only screen and (min-width: 768px) {

	/* ---------------- overall style ---------------- */
	
	#main .main_top .left a img {
		width:250px;
	}
	
	/* ---------------- header ---------------- */
		
	/* ---------------- footer ---------------- */

	/* ---------------- home ---------------- */

	/* ---------------- back pages ---------------- */

	#page_wrapper .page_content {
		padding:192px 64px 64px 64px;
	}
	
	#gallery ul li a img {
		width:150px;
		height:150px;
	}

}

/* ================================================================================================================================ */
/* ================================================================================================================================ */
/* ================================================================================================================================ */

@media only screen and (min-width: 1024px) {

	/* ---------------- overall style ---------------- */

	#main {
		width:70%;
		margin-left:30%;
	}
	
	#main .main_top .left {
		padding:64px;
	}

	/* ---------------- header ---------------- */
	
	header {
		width:30%;
		-webkit-transform:none;
		-moz-transform:none;
		-ms-transform:none;
		transform:none;
		text-align:right;
	}
	
	header.show {
		-webkit-transform:none;
		-moz-transform:none;
		-ms-transform:none;
		transform:none;
	}
	
	header nav {
		padding:64px;
	}
	
	header nav #nav_close {
		display:none;
	}
	
	#main .main_top {
		display:block;
		text-align:right;
	}
	
	#main .main_top .left {
		display:inline-block;
	}
	
	#main .main_top .right {
		display:none;
	}
	
	/* ---------------- footer ---------------- */

	/* ---------------- home ---------------- */
	
	#home_feature {
		
	}
	
	#home_feature > .inner {
		padding:64px;
	}
	
	/* ---------------- back pages ---------------- */

	#page_wrapper .page_content {
		padding:224px 64px 64px 64px;
	}
	
}

/* ================================================================================================================================ */
/* ================================================================================================================================ */
/* ================================================================================================================================ */

@media only screen and (min-width: 1366px) {

	/* ---------------- overall style ---------------- */

	/* ---------------- header ---------------- */
	
	header nav ul > li > a {
		font-size:35px;
	}
	
	/* ---------------- footer ---------------- */

	/* ---------------- home ---------------- */

	/* ---------------- back pages ---------------- */
	
	#page_wrapper .page_content {
		padding:224px 96px 96px 96px;
	}
	
	#gallery ul li a img {
		transition:opacity 0.5s;
	}
	
	#gallery ul li a:hover img {
		opacity:0.75;
		transition:opacity 0s;
	}
	
}

/* ================================================================================================================================ */
/* ================================================================================================================================ */
/* ================================================================================================================================ */

@media only screen and (min-width: 1600px) {
	
	/* ---------------- overall style ---------------- */

	/* ---------------- header ---------------- */
	
	/* ---------------- footer ---------------- */

	/* ---------------- home ---------------- */

	/* ---------------- back pages ---------------- */
	
	#page_wrapper .page_content .table_div {
		display:table;
		width:100%;
	}
	
	#page_wrapper .page_content .table_div .left {
		display:table-cell;
		width:50%;
		vertical-align:top;
		padding-right:48px;
	}
	
	#page_wrapper .page_content .table_div .right {
		display:table-cell;
		width:50%;
		vertical-align:top;
		padding-left:48px;
	}
	
	#gallery ul li a img {
		width:130px;
		height:130px;
	}
	
}

/* ================================================================================================================================ */
/* ================================================================================================================================ */
/* ================================================================================================================================ */

@media only screen and (min-width: 1920px) {

	/* ---------------- overall style ---------------- */

	/* ---------------- header ---------------- */
	
	/* ---------------- footer ---------------- */

	/* ---------------- home ---------------- */

	/* ---------------- back pages ---------------- */
	
	#page_wrapper .page_content {
		padding:288px 128px 128px 128px;
	}
	
}

/* ================================================================================================================================ */
/* ================================================================================================================================ */
/* ================================================================================================================================ */

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

	/* ---------------- overall style ---------------- */

	/* ---------------- header ---------------- */

	/* ---------------- footer ---------------- */

	/* ---------------- home ---------------- */

	/* ---------------- back pages ---------------- */

}

