/*
Theme Name: Shades Of Geelong
Theme URI: http//shadesofgeelong.com.au
Description: Shades of Geelong, by Dobble Pty Ltd
Author: Dobble
Author URI: http://dobble.com.au
Version:1.0
*/

* {
   box-sizing:border-box;
   -moz-box-sizing:border-box;
   -webkit-box-sizing:border-box;
}
.clearfix:after {
   content: " "; /* Older browser do not support empty content */
   visibility: hidden;
   display: block;
   height: 0;
   clear: both;
}
html, body {
	padding:0;
	margin:0;
}
body {
	font-family:"Ubuntu", sans-serif;
	font-weight: 300;
	color:#1a1b1c;
	font-size:13px;
}
header {
	width:100%;
	padding:0;
	margin:0 auto;	
}
#container {
	width:100%;
	max-width:960px;
	margin:0 auto;
	padding:15px;
	
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
}
header .header-icon-logo {
	width: 238px;
	height: 173px;
	background-image:url(images/header-icon-logo.png);
	background-size: 80%;
	background-repeat:no-repeat;
	background-position:center center;
	
	float:left;
}
header .header-icon-logo a {
	width:100%;
	height:100%;
	display:block;
}
header .logo-text-wrapper {
	float:left;
}
h1 {
	font-size:36px;
	letter-spacing:3px;
	text-transform:uppercase;
	
	margin:55px 0 0;
}
h1 a{
	color:#3d3d3d;
	text-decoration:none;
}
h2 {
	color:#979797;
	text-transform:uppercase;
	font-size:22px;
	font-weight:300;
	letter-spacing:1px;
	
	margin:4px 0 0;
}
header #header-contact-links {
	width:133px;
	height:60px;
	float:right;
	margin:62px 0 0;
}
header #header-contact-links .icon {
	width:57px;
	height:45px;
	display: inline-block;
	margin:8px 0 0 8px;
}
header #header-contact-links .icon a{
	width:100%;
	height:100%;
	display:block;
	cursor:pointer;
}
.phone {
	background-image:url(images/header-phone.png);
	background-repeat:no-repeat;
	background-size:60%;
	background-position: center center;
}
.mail {
	background-image:url(images/header-mail.png);
	background-repeat:no-repeat;
	background-size:77%;
	background-position: center center;
}
#header-nav {
	width:100%;
	background-color:#272727;
	padding:20px;
	
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
}
#header-nav nav {	
	width:100%;
	max-width:960px;
	margin: 0 auto;
	text-align:center;
}
#header-nav nav ul{
	margin:0;
	padding:0;
	list-style-type:none;
}
#header-nav nav ul li{
	display:inline;
	font-size:13px;
}
#header-nav nav ul li a{
	width:100%;
	height:100%;
	text-decoration: none;
	text-transform:uppercase;
	color:#fff;
	letter-spacing:2px;
	padding:15px;
	border-radius:1px;
	-moz-border-radius:1px;
	-webkit-border-radius:1px;
	
	transition: background-color .5s ease;	
	-moz-transition: background-color .5s ease;
	-webkit-transition: background-color .5s ease;
	
}
#header-nav nav ul li a:hover{
	background-color:#dd1b1c;
}
header #responsive-nav {
	width:100%;
	display:none;
}
header #responsive-nav select{
	width:100%;
	padding:15px;
	max-width:960px;
	margin:0 auto;
	
	font-family:"Ubuntu", sans-serif;
	font-size:13px;
	text-transform:uppercase;
	letter-spacing:2px;
	font-weight:300;
	
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;	
}
#top-footer{
	background-color:#272727;
}
#top-footer h4{
	font-family:"Ubuntu", sans-serif;
	font-size:14px;
	text-transform:uppercase;
	color: #fff;
	letter-spacing:2px;
	word-spacing:1px;
	font-weight:300;
}
#top-footer .map-info-wrapper {
	width:100%;
	max-width:960px;
	margin:0 auto;
	max-width:550px;
	float:left;
}
#top-footer .googlemaps {
	width:240px;
	height:160px;
	background-color:#FFF;
	float:left;
	margin-right: 15px;
	

}
#top-footer .business-info {
	color:#fff;
	float:left;
	display:inline;
}
#top-footer .business-info a {
	color:#fff;
	text-decoration:none;
}
#top-footer .business-info p {
	line-height:175%;
	margin-top:0;
}
#top-footer .quick-contact {
	width:350px;
	float:right;
}
#top-footer .quick-contact input[type="text"],
#top-footer .quick-contact input[type="email"],
#top-footer .quick-contact textarea {
	width:100%;
	border:none;
	background-color:#fff;
	padding:10px;

	margin:2px 0;
	
	font-family:"Ubuntu", sans-serif;
	font-size:13px;
	text-transform:uppercase;
	letter-spacing:2px;
	color:#1A1B1C;
	word-spacing:1px;
	line-height:150%;
	
	border-radius:0px;
	-moz-border-radius:0px;
	-webkit-border-radius:0px;
	
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
}
#top-footer .quick-contact textarea {
	resize:none;
	height:80px;
}
#top-footer .quick-contact input[type="submit"],
#top-footer .quick-contact button {
	-webkit-appearance:none;
	-moz-appearance:none;
	
	width:100%;
	border:none;
	padding:10px;
	background-color:rgba(0,0,0,.1);
	color:#fff;
	text-transform:uppercase;
	font-family:"Ubuntu", sans-serif;
	font-size:13px;
	letter-spacing:2px;
	word-spacing:1px;
	line-height:150%;
	
	cursor:pointer;
	
	border-radius:1px;
	-moz-border-radius:1px;
	-webkit-border-radius:1px;
	
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	
	transition: background-color .5s ease;
	-moz-transition: background-color .5s ease;
	-moz-transition: background-color .5s ease;	
}
#top-footer .quick-contact input[type="submit"]:hover,
#top-footer .quick-contact button:hover {
	background-color:#dd1b1c;
}

#baseline-footer #container .footer-social-media {
	padding:10px;
}
#baseline-footer #container .footer-social-media .icon{
	width:60px;
	height:60px;
	background-color:rgba(0,0,0,.1);
	border:none;
	border-radius:2px;
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
	display:inline-block;
	margin: 2px;
	
	transition: background-color .5s ease;
	-moz-transition: background-color .5s ease;
	-webkit-transition: background-color .5s ease;	
}
#baseline-footer #container .footer-social-media .icon a{
	width:100%;
	height:100%;
	display:block;
}
#baseline-footer #container .footer-social-media .icon:hover{
	background-color:#dd1b1c;
}
.facebook{
	background-image: url(images/footer-social-media-facebook.png);
	background-size:30%;
	background-position:center center;
	background-repeat:no-repeat;
}
.googleplus{
	background-image: url(images/footer-social-media-googleplus.png);
	background-size:60%;
	background-position:center center;
	background-repeat:no-repeat;
}
#baseline-footer {
	background-color:#1a1b1c;
}
#baseline-footer #container{
	color:#fff;
	text-align:center;
}
#baseline-footer #container p {
	letter-spacing:1px;
	text-transform: uppercase;
	font-size: 13px;
	line-height:175%;
	margin:0;
	padding:0 0 10px 0;
}
#baseline-footer #container p a{
	text-decoration:none;
	color:#fff;
	transition: color .5s ease;
	-moz-transition: color .5s ease;
	-webkit-transition: color .5s ease;
}
#baseline-footer #container p a:hover{
	color:#6abc9f;
}
#content-area h3{
	text-transform:uppercase;
	font-family:"Ubuntu", sans-serif;
	font-weight:300;
	font-size:24px;
	letter-spacing:2px;
	word-spacing:1px;
	color:#dd1b1c;
	text-align:center;
	margin:0 auto;
	padding: 30px 0 15px 0;
	clear: left;
}
#content-area p {
	line-height:175%;
	text-align:justify;
	font-size:15px;
}
#content-area input[type=text],
#content-area input[type=email],
#content-area select,
#content-area textarea,
#content-area input[type=submit],
#content-area button {
	width:100%;
	padding:15px;
	margin:5px 0;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	border:1px solid #ccc;
	font-family: "Ubuntu", sans-serif;
	font-weight: 300;
	letter-spacing: 2px;
	word-spacing:1px;
	color:#1a1b1c;
	-moz-appearance:none;
	-webkit-appearance:none;
	resize:none;	
}
#content-area input[type=text]:hover,
#content-area input[type=email]:hover,
#content-area select:hover,
#content-area textarea:hover {
	border:1px solid #dd1b1c;
}
#content-area input[type=text]:focus,
#content-area input[type=email]:focus,
#content-area select:focus,
#content-area textarea:focus {
	border:1px solid #dd1b1c;
	outline: 1px solid #dd1b1c;
}
#content-area input[type=submit], #content-area button {
	background-color:#ccc;
	color:#fff;
	border:none;
	border-radius: 2px;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	text-transform:uppercase;
	cursor:pointer;
	
	transition: background-color .5s ease;
	-moz-transition: background-color .5s ease;
	-webkit-transition: background-color .5s ease;
}
#content-area input[type=submit]:hover, #content-area button:hover {
	background-color:#dd1b1c;
}

#content-area .banner-overlay {
	width:100%;
	padding:30px 60px;
	background-color:rgba(0,0,0,.4);
	
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	
	margin-top:-280px;
	z-index:1000;
	position:relative;	
}
#content-area .banner-overlay h5 {
	color:#fff;
	font-size:44px;
	padding:0;
	margin: 0 0 12px;
	text-shadow:2px 2px 2px #111;
}
#content-area .banner-overlay p {
	width:60%;
	color:#fff;
	font-size:18px;
	text-align:justify;
	line-height:175%;
	text-shadow:2px 2px 2px #333;
	font-weight:400;
}

#contact-info-container {
	line-height:120%;
}
#contact-info-container h4 {
	text-transform:uppercase;
	letter-spacing:2px;
	word-spacing:1px;
	font-size:12pt;
	margin-top:0;
	padding-top:0;
}
#contact-info-container p {
	font-size:10pt;
	line-height:120%;
}
#tbl-openinghours {
	font-size:10pt;
	width:248px;
}
#tbl-openinghours label {
	color:Green;
	padding-left:15px;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	max-width:247px;
}
#contact-business-info, #contact-business-hours, #contact-social-media {
	float:left;
	font-size:10pt;
	
	width:32%;
	height:258px;
	padding:30px 0;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
}
#contact-business-info a {
	text-decoration:none;
	color:#1a1b1c;
}
#contact-business-info a .theme-color {
	color:#dd1b1c;
}
.social-button {
	-moz-appearance:none;
	-webkit-appearance:none;
	width:100%;	
	margin:2px auto;
	text-align:center;
	background-color:#1a1b1c;
	border-radius:2px;
	-moz-border-radius:2px;
	-webkit-border-radius:2px;		
}
.social-button a {
	width:100%;
	height:100%;
	display:block;
	text-decoration:none;
	color:#fff;
	
	padding: 30px;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;	
}
.contact-facebook, .contact-googleplus {
	transition: background-color .4s ease;
	-moz-transition: background-color .4s ease;
	-webkit-transition: background-color .4s ease;
}
.contact-facebook:hover {
	background-color:#3b5998;
}
.contact-googleplus:hover {
	background-color:#d34836;
}





/****************** ADDITIONAL CSS *******************/
/************* PRODUCTS ***********************/
#product {
	width:100%;
	height:620px;
	max-width:30%;
	min-width:300px;
	margin:0 auto;
	float:left;
	padding:30px;
	margin: 5px;
	text-align:center;
	
}
#product .product-icon {
	width:100%;
	height:160px;
	margin:0 auto;
	padding:15px;
}
#product h4 {
	font-size:15px !important;
}
#product .product-desc {
	line-height:175%;
	text-align:justify;
	font-size: 14px !important;
}
.day-and-night-blinds,
.blinds,
.external-awnings,
.venetians,
.plantation-shutters,
.panel-blinds,
.roman-blinds,
.folding-arm-awnings,
.vertical-blinds,
.cafe-blinds-and-awnings {	
	background-repeat:no-repeat;
	background-position: center center;
	background-size: 220px;
}
.day-and-night-blinds { background-image:url(images/day-and-night-blinds.png); }
.blinds { background-image:url(images/blinds.png); }
.external-awnings { background-image:url(images/external-awnings.png); }
.venetians { background-image:url(images/venetians.png); }
.plantation-shutters { background-image:url(images/plantation-shutters.png); }
.panel-blinds { background-image:url(images/panel-blinds.png); }
.roman-blinds { background-image:url(images/roman-blinds.png); }
.folding-arm-awnings { background-image:url(images/folding-arm-awnings.png); }
.vertical-blinds { background-image:url(images/vertical-blinds.png); }
.cafe-blinds-and-awnings { background-image:url(images/cafe-blinds-and-awnings.png); }


@media all and (max-width:639px)
{
	#product{
		max-width:none;
		height:auto;
	}
}


/************* SUPPLIERS **********************/
#supplier {
	width:100%;
	max-width:232.5px;
	padding:15px;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	
	float:left;	
}
#supplier a {
	text-decoration:none;
	color:#272727;
}
#supplier a:hover .supplier-icon {
	background-color:rgba(221,27,28,1);
}
#supplier h4 {
	text-align:center;
	text-transform:uppercase;
	letter-spacing:2px;
	word-spacing:2px;
	font-size:14px;
	font-weight:300;
}
#supplier .supplier-icon {
	width:150px;
	height:150px;
	margin:0 auto;
	border-radius:100%;
	-moz-border-radius:100%;
	-webkit-border-radius:100%;
	
	transition: background-color .2s linear;
	-moz-transition: background-color .2s linear;
	-webkit-transition: background-color .2s linear;
	-o-transition: background-color .2s linear;
}
.hunter-douglas, .acmeda, .bricos, .shaw-of-australia, .somfy {
	background-repeat:no-repeat;
	background-size:100%;
	background-position:center center;
}
.hunter-douglas {
	background-image:url('images/hunter-douglas.png');
	background-color:#000;
}
.acmeda {
	background-image:url('images/acmeda.png');
	background-color:#1ab9ce;
}
.bricos {	
	background-image:url('images/bricos.png');
	background-color:#064972;
}
.shaw-of-australia {
	background-image:url('images/shaw-of-australia.png');
	background-color:#b3ab7d;
}
.somfy {
	background-image:url('images/somfy.png');
	background-color:#fab711;
}

/*********************** ONLINE QUOTE ***************************/
.bfQuickMode .bfLabelLeft label{
    width: 20% !important;
}
.bfQuickMode .bfLabelLeft input, .bfQuickMode .bfLabelLeft select, .bfQuickMode .bfLabelLeft textarea {
    width: 100% !important;
    text-align:left !important;
}
.bfQuickMode .bfLabelLeft input[type=checkbox] {
    width: auto !important;
}
.bfQuickMode .bfLabelLeft button {
    width: 100% !important;
    text-align:left !important;
}

@media all and (max-width:480px)
{
	#supplier {
		min-width:none;
		max-width:none;
		float:none;
		margin:0 auto 25px;		
	}
}


@media screen and (max-width:960px) {
	#top-footer .business-info {
		margin-top:30px;
	}
	#top-footer .quick-contact {
		width:100%;
		float:left;
		margin-top:20px;
	}
	#top-footer .map-info-wrapper {
		max-width:none;
		float:left;
	}
	#top-footer .googlemaps {
		width:100%;
		height:160px;
		margin-right: 0;
	}
	.banner-overlay {
		display:none;
	}
	header #header-nav {
		display:none;
	}
	header #responsive-nav {
		display:block;
	}
	header .header-icon-logo {
		width:100%;
		background-size:contain;
	}
	header .logo-text-wrapper {
		width:100%;
		text-align:center;			
	}
	header .logo-text-wrapper h1 {
		margin:20px 0 5px;
	}
	header #header-contact-links {
		width:100%;
		height:60px;
		text-align:center;
		margin:0;
	}
	header #header-contact-links .icon {
		width:40px;
		height:40px;
		margin:10px 2px;
	}
	#contact-business-info, #contact-business-hours, #contact-social-media {
		width:100%;
		height:auto;
		padding:30px;
		margin: 3px 0;
		background-color: #fafafa;
	}
}
@media screen and (max-width:480px) {
	header .logo-text-wrapper h1 {
		font-size:22px;
	}
	header .logo-text-wrapper h2{
		font-size:14px;
	}
}

.banner-button {
	width:auto;
	display:inline-block;
	background-color:#dd1b1c;
	font-weight:600;
	color:#fff;
	border-radius:2px;
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
	font-size:18px;
}
.banner-button a{
	width:100%;
	height:100%;
	display:block;
	text-decoration:none;
	color:inherit;
	padding:20px 30px;
}
