/*

Theme Name: Melbourne Cars Removal

Author: Joshua Esmero 

Author URI: clixpert.com.au

Version: 1.0

*/



@import url(css/reset.css);



/* GENERAL */

/* Fonts */

@font-face {

    font-family: 'Open Sans';

    src: url( 'fonts/OpenSans-Light.ttf' ) format( 'truetype' );

	font-weight: 300;

	font-style: normal;

}

@font-face {

    font-family: 'Open Sans';

    src: url( 'fonts/OpenSans-Regular.ttf' ) format( 'truetype' );

	font-weight: 400;

	font-style: normal;

}

@font-face {

    font-family: 'Open Sans';

    src: url( 'fonts/OpenSans-Semibold.ttf' ) format( 'truetype' );

	font-weight: 600;

	font-style: normal;

}

@font-face {

    font-family: 'Open Sans';

    src: url( 'fonts/OpenSans-Bold.ttf' ) format( 'truetype' );

	font-weight: 700;

	font-style: normal;

}

@font-face {

    font-family: 'Open Sans';

    src: url( 'fonts/OpenSans-ExtraBold.ttf' ) format( 'truetype' );

	font-weight: 800;

	font-style: normal;

}

body {

	font-family: 'Open Sans', sans-serif;

}

/* Display */

.hide {

	display:none !important;

}

.show {

	display:block !important;

}

/* Layout */

.centre-wrap {

	max-width:1280px;

	margin:0 auto;

	padding:0 8px;

}



.clear-after:after {

	display:block;

	clear:both;

	content:"";

}

/* Links */

a {

	text-decoration:none;

	color:#000;

}

a:hover {

	color:#000;

}



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



/* BODY ELEMENTS */

/* Headings */

.body-element h2 {

	padding: 16px 0 8px;

	font-size: 2rem;

	color: #4C4D52;

}

.body-element h3 {

	padding: 8px 0;

	font-size: 1.5rem;

	color: #4C4D52;

}

/* Paragraph */

.body-element p {

	margin: 0 0 16px;

	line-height:1.5rem;

}

.body-element p:last-child {

	margin: 0;

}

.body-element .break-word {

	word-break: break-all;

}

/* Links */

.body-element a {

	color: #66AACC;

}

.body-element a:hover {

	color: #FF964B;

}

/* Lists */

.body-element ul,

.body-element ol {

	margin: 0 0 16px;

}

.body-element ul:last-child,

.body-element ol:last-child {

	margin: 0;

}

.body-element ul > li > ul,

.body-element ol > li > ol {

	margin: 8px 0 !important;

}

.body-element ul > li,

.body-element ol > li {

	line-height: 1.25rem;

	margin: 0 0 8px 24px;

}

.body-element .two-column {

	-webkit-column-count: 2; /* Chrome, Safari, Opera */

    -moz-column-count: 2; /* Firefox */

    column-count: 2;

}

/* Table */

.body-element table {

	margin: 0 0 16px;

}

.body-element table th,

.body-element table td {

	padding: 0 16px;

	line-height: 1.5rem;

}

.body-element .table-header-left th:first-child {

	text-align: right;

}

/* Images */

.img-fullwidth {

	display: block;

	width: 100%;

}



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

	

	/* Lists */

	.body-element .two-column {

		-webkit-column-count: 1; /* Chrome, Safari, Opera */

		-moz-column-count: 1; /* Firefox */

		column-count: 1;

	}

	

}



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



/* INNER BODY FORM */

#inner-body-main > .form-layout-1 {

	margin: 48px 0;

	max-width: 480px;

}

/* Wrap */

#inner-body-main > .form-layout-1 > div {

	border-bottom-left-radius: 0;

	border-bottom-right-radius: 0;

	padding: 0 !important;

	background-color: transparent;

}

#inner-body-main > .form-layout-1 .form-element > span > input {

	border-style: solid;

	border-width:1px;

	border-color: #000;

	width: calc( 96% - 2px );

}

#inner-body-main > .form-layout-1 .form-element > span > textarea {

	border-style: solid;

	border-width:1px;

	border-color: #000;

	width: calc( 96% - 2px );

}

/* Captcha */

#inner-body-main > .form-layout-1 .form-captcha > span > input {

	border-style: solid;

	border-width:1px;

	border-color: #000;

	width: calc( 96% - 2px );

}



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



/* FORM LAYOUT 1 */

.form-layout-1 {

	width: 100%;

	max-width: 300px;

}

/* Heading */

.form-layout-1 > header {

	border-top-left-radius: 8px;

	border-top-right-radius: 8px;

	background-color: #FF964B;

}

.form-layout-1 > header > div {

	padding: 8px 16px;

	font-size: 1.5rem;

	color: #FFF;

}

/* Wrap */

.form-layout-1 > div {

	border-bottom-left-radius: 8px;

	border-bottom-right-radius: 8px;

	padding:16px 8px !important;

	background-color: #4C4D52;

}

/* Fields */

.form-layout-1 span,

.form-layout-1 input {

	display: block;

	font-size: 1rem;

}

.form-layout-1 .form-element {

	margin:0 0 8px;

}

.form-layout-1 .form-element > span > input {

	margin: 0;

	padding: 3px 2%;

	border: none;

	border-radius: 4px;

	width: 96%;

}

.form-layout-1 .form-element > span > textarea {

	display: block;

	margin: 0;

	border: none;

	border-radius: 4px;

	padding: 3px 2%;

	max-width: 96%;

	height: 3rem;

	font-family: 'Open Sans', sans-serif;

	font-size: 1rem;

}

/* Error Message */

.form-layout-1  .form-element > span > span {

	padding:4px 0 8px;

}

/* Captcha */

.form-layout-1 .form-captcha {

	margin:0 0 8px;

}

.form-layout-1 .form-captcha > img {

	display:block;

	float:left;

	height:24px;

	width:80px;

}

.form-layout-1 .form-captcha > span {

	float:right;

	width:80px;

	width:calc(100% - 96px);

}

.form-layout-1 .form-captcha > span > input {

	margin:0;

	border:none;

	border-radius: 4px;

	padding:3px 2%;

	width:96%;

}

.form-layout-1 .form-captcha > span > span {

	padding:4px 0 8px;

}

/* Submit */

.form-layout-1 .form-submit {

	margin:0;

}

.form-layout-1 .form-submit > input {

	display: block;

	margin: 0;

	border: none;

	border-radius: 8px;

	padding: 8px 16px;

	background-color:#66AACC;

	text-transform:uppercase;

	font-size:1.5rem;

	color:#fff;

	cursor:pointer;

}

.form-layout-1 .form-submit > img {

	display:none;

}



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



/* HEADER */

#header-wrap {

	padding: 8px 0;

	background-color: #4C4D52;

}

/* Title */

#header-title {

	float: left;

}

#header-title > a {

	display: block;

	padding: 0 0 0 108px;

	background: url( 'images/melbourne-cars-removal-logo.png' ) no-repeat;

}

#header-title > a > span:first-child {

	display: block;

	letter-spacing: 2px;

	color: #FFA666;

}

#header-title > a > span:last-child {

	display: block;

	font-size: 1.5rem;

	color: #FFF;

}

/* Nav */

#header-nav {

	float: left;

	width: calc( 100% - 513px );

}

/* Phone */

#header-phone {

	float: left;

}

#header-phone > a {

	display: block;

	padding: 4px 0 4px 52px;

	background: url( 'images/interface/icon-phone.png' ) no-repeat;

	font-size: 2rem;

	color: #FFF;

}



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

	

	/* Title */

	#header-title {

		padding: 4px 0;

	}

	/* Nav */

	#header-nav {

		float: right;

		margin: 0 0 0 16px;

		width: auto;

	}

	/* Phone */

	#header-phone {

		float: right;

		padding: 4px 0;

	}

	

}



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

	

	/* Title */

	#header-title {

		float: none;

		margin: 0 0 16px;

		text-align: center;

	}

	#header-title > a {

		display: inline-block;

		text-align: left;

	}

	/* Phone */

	#header-phone > a {

		line-height: 2rem;

		font-size: 1.5rem;

	}

	

}



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



/* HEADER NAV */

/* Level 1 */

#header-menu {

	position: relative;

	text-align: center;

	font-size: 0;

}

#header-menu > li {

	display: inline-block;

	margin:0 4px;

	text-align: left;

	font-size: 1rem;

}

#header-menu > li > a {

	display: block;

	border-radius: 8px;

	padding: 12px 16px;

	color: #FFF3E7;

}

#header-menu > li:hover > a {

	background-color: #B9B0A7;

}

#header-menu > .current-menu-item > a {

	background-color: #FF964B;

}

/* Level 2 */

#header-menu > .menu-item-has-children > ul {

	position: absolute;

	z-index: 520;

	display: none;

	border-radius: 8px;

	padding: 8px;

	background-color: #4C4D52;

}

#header-menu > .menu-item-has-children:hover > ul {

	display: block;

}

#header-menu .sub-menu > li > a {

	display: block;

	padding: 12px 16px;

	color: #FFF3E7;

	border-radius: 8px;

}

#header-menu .sub-menu > li:hover > a {

	background-color: #B9B0A7;

}

#header-menu .sub-menu > .current-menu-item > a {

	background-color: #FF964B;

}



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

	

	#header-wrap .centre-wrap {

		position: relative;

	}

	/* Button */

	#header-menu-button {

		display: block;

		width: 48px;

		height: 48px;

		background: url( 'images/interface/icon-menu-button.png' ) no-repeat;

		cursor: pointer;

	}

	/* Level 1 */

	#header-menu {

		display: none;

		position: absolute;

		z-index: 500;

		right: 0;

		padding: 8px 0 0;

		width: 75%;

	}

	#header-menu > li {

		display: block;

		margin:0;

		border-top-style:solid;

		border-top-width:1px;

		border-top-color:#616266;

	}

	#header-menu > li > a {

		padding:16px;

		border-radius: 0;

		background-color: #4C4D52;

	}

	/* Level 2 */

	#header-menu > .menu-item-has-children > ul {

		border-left-style:solid;

		border-left-width:1px;

		border-left-color:#616266;

		border-radius: 0;

		padding: 0;

	}

	#header-menu > .menu-item-has-children {

		position:relative;

	}

	#header-menu > .menu-item-has-children > .sub-menu-button {

		position:absolute;

		z-index:510;

		right:0;

		width:48px;

		height:48px;

		background: url( 'images/interface/icon-menu-arrow.png' ) no-repeat;

	}

	#header-menu > .menu-item-has-children > ul {

		position:absolute;

		width:75%;

		right:0;

	}

	#header-menu > .menu-item-has-children:hover > ul {

		display:none;

	}

	#header-menu .sub-menu > li > a {

		padding:16px;

		border-top-style:solid;

		border-top-width:1px;

		border-top-color:#616266;

		border-radius: 0;

	}

	

}



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



/* BANNER */

#banner-wrap {

	background: url( 'images/melbourne-cars-removal-banner.png' ) no-repeat center top;

}

#banner-wrap > .centre-wrap {

	min-height: 400px;

}

/* Form */

#banner-form {

	float: right;

	padding: 32px 0 0;

}

#banner-form > .form-layout-1 {

	max-width: 320px;

}

/* Points */

#banner-points {

	float: left;

	padding: 32px 0 0;

	width: 50%;

}

#banner-points > header {

	margin: 0 0 16px;

	font-size: 2.5rem;

	font-weight: 700;

	color: #FF964B;

	text-shadow: 

		0 1px 0 rgba( 0, 0, 0, 0.5 ),

		1px 0 0 rgba( 0, 0, 0, 0.5 ),

		0 -1px 0 rgba( 0, 0, 0, 0.5 ),

		-1px 0 0 rgba( 0, 0, 0, 0.5 );

}

#banner-points > ul > li {

	font-size: 1.5rem;

	padding: 8px 0 8px 56px;

	background: url( 'images/interface/icon-tick.png' ) no-repeat 16px 4px;

	list-style-type: none;

	color: #FFF;

	text-shadow: 

		0 1px 0 rgba( 0, 0, 0, 0.5 ),

		1px 0 0 rgba( 0, 0, 0, 0.5 ),

		0 -1px 0 rgba( 0, 0, 0, 0.5 ),

		-1px 0 0 rgba( 0, 0, 0, 0.5 );

}



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

	

	#banner-wrap > .centre-wrap {

		background-color: rgba( 51, 102, 128, 0.5 );

	}

	/* Form */

	#banner-form {

		float: none;

		padding: 16px 0 0;

	}

	#banner-form > .form-layout-1 {

		position: relative;

		margin: 0 auto;

	}

	#banner-form > .form-layout-1 > header {

		border-radius: 8px;

	}

	#banner-form > .form-layout-1 > header > div {

		text-align: center;

	}

	#banner-form > .form-layout-1 > div {

		display: none;

		position: absolute;

		margin: 8px 0 0;

		border-radius: 8px;

		width: calc( 100% - 16px );

		

	}

	/* Points */

	#banner-points {

		float: none;

		width: 100%;

	}

	

}



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

	

	#banner-points > header {

		font-size: 2rem;

	}

	#banner-points > ul > li {

		line-height: 1.5rem;

		font-size: 1rem;

	}

	

}



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



/* HOME BODY */

#home-body-wrap {

	margin-top: 48px;

	margin-bottom: 48px;

	

}

#home-body-wrap > h1 {

	margin: 0 0 32px;

	font-size: 2.5em;

	color: #FF964B;

}



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



/* INNER BODY */

#inner-body-wrap {

	margin: 48px 0;

}

/* Form */

#inner-body-form {

	float: right;

	width: 100%;

	max-width: 300px;

}

#inner-body-form > b {

	display: block;

	border-radius: 8px;

	padding: 8px 16px;

	background-color: #6A9DD2;

	text-align: center;

	font-size: 2rem;

	color: #FFF;

	cursor: pointer;

}

/* Main */

#inner-body-main {

	float: left;

	margin: 0 48px 0 0;

	width: calc( 100% - 348px );

}

#inner-body-main > header {

	margin: 0 0 32px;

}

#inner-body-main > header > h1 {

	font-size: 2.5em;

	color: #FF964B;

}

#inner-body-main > header > span {

	display:block;

	margin: 8px 0 0;

	color:#999;

}

/* Posts */

#inner-body-posts {

	float: left;

	margin: 0 48px 0 0;

	width: calc( 100% - 348px );

}

#inner-body-posts > h1 {

	margin: 0 0 32px;

	font-size: 2.5em;

	color: #FFA666;

}

.body-element .post-wrap {

	margin: 0 0 16px;

	padding:16px;

	border-radius: 8px;

	background-color: #FFF3E7;

}

.body-element .post-wrap > header {

	margin:0 0 16px;

}

.body-element .post-wrap > header > h2 {

	margin:0 0 8px;

	padding: 0;

}

.body-element .post-wrap > header > span {

	display:block;

	font-size:0.75rem;

	color:#999;

}

.body-element .post-wrap > a {

	display: inline-block;

	background-color: #66AACC;

	padding: 8px 16px;

	margin: 16px 0 0;

	border-radius: 4px;

	text-transform: uppercase;

	color: #FFF;

}

.body-element .post-wrap > a:hover {

	background-color: #5a85b3;

}

/* Side */

#inner-body-side {

	float: right;

	clear: right;

	margin: 32px 0 0;

	width: 100%;

	max-width: 300px;

}

.widget-wrap {

	margin: 0 0 16px;

	border-radius: 8px;

	padding: 16px;

	background-color: #FFF3E7;

}

.widget-wrap header {

	margin: 0 0 16px;

	font-size: 1.5rem;

	color: #4C4D52;

}



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

	

	/* Form */

	#inner-body-form {

		max-width: 250px;

	}

	#inner-body-form > b {

		font-size: 1.5rem;

	}

	/* Main */

	#inner-body-main {

		width: calc( 100% - 330px );

	}

	/* Posts */

	#inner-body-posts {

		width: calc( 100% - 298px );

	}

	/* Side */

	#inner-body-side {

		max-width: 250px;

	}

	

}

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

	

	/* Form */

	#inner-body-form {

		float: none;

		margin: 0 auto 32px;

	}

	#inner-body-form > .form-layout-1 {

		position: relative;

	}

	#inner-body-form > .form-layout-1 > header {

		border-radius: 8px;

	}

	#inner-body-form > .form-layout-1 > header > div {

		text-align: center;

	}

	#inner-body-form > .form-layout-1 > div {

		display: none;

		position: absolute;

		margin: 8px 0 0;

		border-radius: 8px;

		width: calc( 100% - 16px );

		

	}

	/* Main */

	#inner-body-main {

		float: none;

		margin: 0;

		width: 100%;

	}

	/* Posts */

	#inner-body-posts {

		float: none;

		margin: 0;

		width: 100%;

	}

	/* Side */

	#inner-body-side {

		float: none;

		clear: none;

		  margin: 64px 0 0;

		width: 100%;

		max-width: none;

	}

	

}



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



/* FOOTER NAV */

#footer-nav-wrap {

	background-color: #4C4D52;

	padding: 8px 0;

}

/* Menu */

#footer-menu {

	float:left;

}

#footer-menu > li {

	display: block;

	float: left;

	margin: 0 4px;

}

#footer-menu > li > a {

	display: block;

	border-radius: 8px;

	padding: 12px 16px;

	color: #FFF3E7;

}

#footer-menu > li:hover > a {

	background-color: #B9B0A7;

}

#footer-menu > .current-menu-item > a {

	background-color: #FF964B;

}

/* Social */

#footer-social {

	float:right;

	padding:4px 0;

}

#footer-social > a {

	display:block;

	float:left;

	margin:0 0 0 16px;

	width:32px;

	height:32px;

	background-size: 32px;

}

.icon-facebook {

	background:url( 'images/interface/icon-social-facebook.png' ) no-repeat;

}

.icon-twitter {

	background:url( 'images/interface/icon-social-twitter.png' ) no-repeat;

}

.icon-google-plus {

	background:url( 'images/interface/icon-social-googleplus.png' ) no-repeat;

}



@media only screen and (max-width:767px) {
	.infoDv{display:none !important;}
}
@media only screen and (max-width:480px) {



	/* Menu */

	#footer-menu {

		float:none;

	}

	#footer-menu > li {

		float: none;

		margin:0;

		border-bottom-style:solid;

		border-bottom-width:1px;

		border-bottom-color: #616266;

	}

	#footer-menu > li > a {

		padding: 16px;

		border-radius: 0;

	}

	/* Social */

	#footer-social > a {

		width:48px;

		height:48px;

		background-size: 48px;

	}

	

}



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



/* FOOTER END */

#footer-end {

	padding-bottom:8px;

	background-color: #393A40;

}

/* Copyright */

#footer-end p {

	padding-top:8px;

	float:left;

	color: #CCC;

}

/* Clixpert Link */

#footer-end a {

	display:block;

	float:right;

	padding-top:8px;

	color: #CCC;

}



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

	

	/* Copyright */

	#footer-end p {

		text-align:center;

		float:none;

	}

	/* Clixpert Link */

	#footer-end a {

		text-align:center;

		float:none;

	}

}



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


.infoDv{display:inline-block;position:relative;width:44px;margin-left: 9%;}
.infoDv a{color:#CCC;float: none !important; margin-left: 10px;text-transform: uppercase;}
/* MICRODATA */

.infoDv #micro-data {display:none;position:absolute;bottom:15px;left:10px;width:300px;background:#393A40;border:1px #ccc solid;text-align:center;color:#ccc;z-index:9999;list-style:none;padding:15px;font-size: 15px;line-height: 18px;box-sizing: border-box;}
.infoDv #micro-data li{list-style:none;}
.infoDv a.infLnk:hover #micro-data, .infoDv:hover #micro-data{display:block !important;}
.infoDv #micro-data a{color:#ccc !important;}
.infoDv #micro-data a:hover{color:#fff !important;}
.hmLnk{border:1px #ccc solid;line-height:15px;padding:3px  !important;margine:10px 0 0 !important;line-height: 20px !important}
.hmLnk:hover{background:#FF964B !important; border:1px #FF964B solid;line-height:15px;padding:5px 30px;margine:10px 0 0 !important;color:#fff !important}
.infoDv #micro-data a.hmLnk:hover{color:#fff !important}