/* ----------------------------------
#. Global
---------------------------------- */

/* Blue: 65bee7 :: Pink: ec87c3 */

@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,600,700);

* {
	-webkit-font-smoothing: antialiased;
}

img {
	border: none;
	max-width: 100%;
}

/* ----------------------------------
#. Body
---------------------------------- */

html,
body {
	margin: 0;
	padding: 0;
}

body {
	color: #808080;
	font: 14px "Open Sans", Helvetica, Arial, sans-serif;
}

/* ----------------------------------
#. General
---------------------------------- */

.clear {
	clear: both;
}

.container {
	width: 75%;
	margin: 0 auto;
	max-width: 1300px;
}

hr {
	margin: 30px 0;
	height: 3px;
	border: none;

	border-top: 1px dotted #ddd;
	border-bottom: 1px dotted #ddd;
}

/* ----------------------------------
#. Images
---------------------------------- */

img.image {
	margin-bottom: 20px;
	margin-top: 20px;
	border: 5px solid #fff;
	box-shadow: 0 1px 3px #ebebeb;
}

img.alignright {
	float: right;
	margin-left: 20px;
}

img.alignleft {
	float: left;
	margin-right: 20px;
}

/* ----------------------------------
#. Messages
---------------------------------- */

.error,
.success {
	color: #fff;
	padding: 15px 25px;
	margin-bottom: 30px;
}

.success {
	font-weight: 600;
	border: 1px solid #87aa49;
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;

	text-shadow: 0 1px 1px #87aa49;

	box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.2), 0 1px 3px rgba(0, 0, 0, 0.2);

	background-color: #cee78c;
	background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(206, 231, 140)), to(rgb(173, 216, 96)));
	background-image: -webkit-linear-gradient(top, rgb(206, 231, 140), rgb(173, 216, 96));
	background-image: -moz-linear-gradient(top, rgb(206, 231, 140), rgb(173, 216, 96));
	background-image: -o-linear-gradient(top, rgb(206, 231, 140), rgb(173, 216, 96));
	background-image: -ms-linear-gradient(top, rgb(206, 231, 140), rgb(173, 216, 96));
	background-image: linear-gradient(top, rgb(206, 231, 140), rgb(173, 216, 96));
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#cee78c', EndColorStr='#add860');
}

.error {
	border: 1px solid #b02828;
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;

	box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.2), 0 1px 3px rgba(0, 0, 0, 0.2);

	background-color: #e85149;
	background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(232, 81, 73)), to(rgb(230, 58, 58)));
	background-image: -webkit-linear-gradient(top, rgb(232, 81, 73), rgb(230, 58, 58));
	background-image: -moz-linear-gradient(top, rgb(232, 81, 73), rgb(230, 58, 58));
	background-image: -o-linear-gradient(top, rgb(232, 81, 73), rgb(230, 58, 58));
	background-image: -ms-linear-gradient(top, rgb(232, 81, 73), rgb(230, 58, 58));
	background-image: linear-gradient(top, rgb(232, 81, 73), rgb(230, 58, 58));
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#e85149', EndColorStr='#e63a3a');
}

.error ul {
	margin: 0;
	padding: 0;
}

.error ul li {
	list-style: none;
	padding: 3px 0;
}

/* ----------------------------------
#. Form
---------------------------------- */

form label {
	display: block;
	margin-bottom: 10px;margin-top: 12px;
}

form input[type="text"], form input[type="email"],
form textarea {
	padding: 10px;
	margin-bottom: 5px;
	border: 1px solid #ccc;
	box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.05);
}

form input[type="text"], form input[type="email"] {
	width: 400px;
}

form textarea {
	width: 400px;
	height: 100px;
	min-height: 100px;
	resize: vertical;
}
.error {
    padding: 0;
    background: none;
    border: 0;
    box-shadow: none;
    color: #f00;
    margin: 0;
    font-size: 12px;
}
form input[type="submit"] {
	padding: 10px;
	display: block;

	cursor: pointer;

	background-color: #8dc7e4;
	background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(141, 199, 228)), to(rgb(101, 190, 231)));
	background-image: -webkit-linear-gradient(top, rgb(141, 199, 228), rgb(101, 190, 231));
	background-image: -moz-linear-gradient(top, rgb(141, 199, 228), rgb(101, 190, 231));
	background-image: -o-linear-gradient(top, rgb(141, 199, 228), rgb(101, 190, 231));
	background-image: -ms-linear-gradient(top, rgb(141, 199, 228), rgb(101, 190, 231));
	background-image: linear-gradient(top, rgb(141, 199, 228), rgb(101, 190, 231));
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#8dc7e4', EndColorStr='#65bee7');

	color: #fff;
	font-weight: 600;
	text-transform:uppercase;
    margin-top: 15px;
	border: 1px solid #3f7c97;
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;

	box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.3), 0 1px 3px rgba(0, 0, 0, 0.2);
}

/* ----------------------------------
#. List
---------------------------------- */

.list {
	padding: 0;
	margin: 30px 0;
}

.list li {
	list-style: none;
	padding: 3px 0 3px 15px;
	background: url("http://mcgcleaning.co.uk/assets/img/li.png") left center no-repeat;
}

/* ----------------------------------
#. Typography
---------------------------------- */

a {
	color: #205dde;

	text-decoration: none;
	transition: color 0.3s ease;
	-moz-transition: color 0.3s ease;
	-webkit-transition: color 0.3s ease;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-weight: 600;
	color: #333333;
}

h2,
h3,
h4,
h5,
h6 {
	margin-top: 30px;
}

/* ----------------------------------
#. Header
---------------------------------- */

.header {
	position: relative;
	padding: 30px 0 0;
	background: #09235a;

	box-shadow: inset 0 -1px 20px rgba(0, 0, 0, 0.05);
}

.header .address {
	float: left;

	color: #fff;
	font-size: 18px;
	font-weight: bold;
	line-height: 25px;
	margin-top: 20px;
}

.header .logo {
	position: absolute;
	left: 0;
	right: 0;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

.header .strap {
	display: block;
	margin: 0 auto;
	padding-top: 60px;
	text-align: center;
}

.header .contact {
	color: #fff;
	float: right;
	font-size: 18px;
	text-align: right;
	font-weight: bold;
	line-height: 25px;
	margin-top: 20px;
}

.header .contact a {
	color: #fff;
	text-decoration: underline;
}

/* ----------------------------------
#. Navigation
---------------------------------- */

.navigation {
	margin-top: 30px;
	background: #143c92;
	font-size: 13px;
}

.navigation ul {
	margin: 0;
	padding: 0;
}

.navigation ul li {
	list-style: none;
	float: left;
	border-right: 1px solid #204ca7;
}

.navigation ul li.has_children {
	position: relative;
}

.navigation ul li.has_children:hover ul {
	display: block;
}

.navigation ul li.has_children > a {
	padding-right: 35px;
	background: url("http://mcgcleaning.co.uk/assets/img/has_children.png") right center no-repeat;
}

.navigation ul li.has_children ul {
	position: absolute;
	display: none;
	top: 48px;
	left: 0;
	z-index: 9999;

	border-bottom: 3px solid #143780;
}

.navigation ul li.has_children ul li {
	float: none;
	border-right: none;
}

.navigation ul li.has_children ul li a {
	background: #2d65d7;
	color: #fff;
	width: 160px;
	padding: 10px 10px;

	transition: color 0.3s ease;
	-moz-transition: color 0.3s ease;
	-webkit-transition: color 0.3s ease;
}

.navigation ul li a {
	display: block;
	padding: 15px 20px;

	color: #fff;
	text-transform: uppercase;
	font-weight: 600;

	transition: background-color 0.3s ease;
	-moz-transition: background-color 0.3s ease;
	-webkit-transition: background-color 0.3s ease;
}

.navigation ul li a:hover,
.navigation ul li.hovered a {
	background-color: #2d65d7;
}

/* ----------------------------------
#. Slider
---------------------------------- */

.slider .caption {
	color: #fff;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 900px;
	padding: 10px 20px;
	background: rgba(0, 0, 0, 0.6);
}

/* ----------------------------------
#. Content
---------------------------------- */

#content {
	padding: 50px 0;
}

#content.home {
	padding-top: 0;
}

#content h1,
#content h2 {
	font-size: 22px;
}

#content p {
	line-height: 22px;
}

/* ----------------------------------
#. Sidebar
---------------------------------- */

.sidebar {
	float: right;
	width: 300px;
	margin-left: 40px;
}

.sidebar h2:first-child {
	margin-top: 0;
}

.sidebar input[type="text"] {
	width: 278px;
}

.sidebar textarea {
	width: 278px;
}

.sidebar .service {
	width: 300px;
	height: 200px;
	margin-bottom: 20px;
	position: relative;
	overflow: hidden;

	background-repeat: no-repeat;
	background-position: center center;
}

.sidebar .service a {
	display: block;
	height: 200px;
	width: 300px;
}

.sidebar .service .caption {
	position: absolute;
	bottom: 0;
	left: 0;

	padding: 10px 15px;
	width: 270px;
	background: rgba(9, 35, 90, 1);
}

.sidebar .service .caption p {
	margin: 0;
	color: #fff;
	text-shadow: 0 1px 1px #000;
}

/* ----------------------------------
#. Content
---------------------------------- */

.content {
	float: left;
	width: 600px;
}

.content h1 {
	margin-top: 0;
}

/* ----------------------------------
#. Full Width
---------------------------------- */

.full-width .content {
	float: none;
	width: 100%;
}

.full-width .sidebar {
	display: none;
}

/* ----------------------------------
#. Services
---------------------------------- */

.services-wrapper {
	background: #f5f5f5;
	padding: 30px 0 40px;
}

.services-wrapper li {
	background: #fff;
	padding-bottom: 15px;
}

.services-wrapper li .slide-content {
	padding: 15px;
	text-align: center;
	position: relative;
}

.services-wrapper li .slide-content .slide-caption {
	position: absolute;
	bottom: 15px;
	left: 15px;
	width: 246px;
	font-size: 13px;
	color: #fff;
	padding: 10px;
	font-weight: 600;
	background: rgba(0, 0, 0, 0.6);
}

.bx-wrapper {
	margin-bottom: 0 !important;
}

.bx-viewport {
	background: none !important;
	left: 0 !important;
	border: none !important;
	box-shadow: none !important;
	-moz-box-shadow: none !important;
	-webkit-box-shadow: none !important;
}

.bx-controls-direction .bx-next {
	right: -50px !important;
}

.bx-controls-direction .bx-prev {
	left: -50px !important;
}

/* ----------------------------------
#. Gallery
---------------------------------- */

.gallery {
	margin: 0;
	padding: 0;
}

.gallery li {
	list-style: none;
	width: 220px;
	height: 160px;
	float: left;
	overflow: hidden;

	margin-right: 20px;
	margin-bottom: 20px;
}

.gallery li.last {
	margin-right: 0;
}

.gallery li img {
	max-width: 100%;
	min-height: 100%;
}

/* ----------------------------------
#. Footer
---------------------------------- */

.footer {
	background: #2555b8;
}

.footer a {
	color: rgba(255, 255, 255, 0.5);
}

.footer a:hover {
	color: #fff;
}

.footer .upper {
	color: #fff;
	padding: 25px 0;

	font-size: 18px;
	font-weight: 600;
}

.footer .upper p {
	margin: 0;
}

.footer .upper p#type {
	float: left;
}

.footer .upper p#links {
	float: right;
}

.footer .upper p#links a {
	color: rgba(255, 255, 255, 0.3);
	display: inline-block;
	margin-right: 7px;
}

.footer .upper p#links a:hover {
	color: #fff;
}

.footer .upper p#links a:last-child {
	margin-right: 0;
}

.footer .upper p#links i {
	font-size: 22px;
}

.footer .lower {
	color: #fff;
	padding: 25px 0;
	background: url("http://mcgcleaning.co.uk/assets/img/opacity-10.png");
}

.footer .lower .col {
	float: left;
	width: 180px;
	margin-right: 20px;
}

.footer .lower .col.last {
	width: 540px;
	margin-right: 0;
}

.footer .lower .col h3 {
	font-size: 13px;
	color: #fff;
	text-transform: uppercase;
}

.footer .lower .col .links {
	margin: 0;
	padding: 0;
}

.footer .lower .col .links li {
	list-style: none;
	padding: 2px 0;
}

.footer .lower .col .links li.has_children ul {
	display: none;
}

.footer .lower .col .links li a#toggle {
	cursor: pointer;
}

.footer .copyright {
	font-size: 13px;
	padding-top: 30px;
	margin-top: 30px;
	border-top: 1px dotted rgba(255, 255, 255, 0.5);
}

.footer .copyright p {
	margin: 0;
}

.footer .extra {
	display: none;
	padding-top: 30px;
	margin-top: 30px;
	text-align: center;
	border-top: 1px dotted rgba(255, 255, 255, 0.5);
}

.footer .extra ul {
	margin: 0;
	padding: 0;
}

.footer .extra ul li {
	list-style: none;
	display: inline-block;
	padding: 5px 7px;
}
.mac {
	float: right;
	padding: 9px !important;
	padding-top: 0px !important;
	margin-top: -3px !important;
}
.top {
	margin-top: 70px !important;
}

/* ----------------------------------
#. Media Queries
---------------------------------- */

#recaptcha_widget_div {
	overflow: hidden;
}

@media only screen and (max-width: 1275px) {
	.sidebar .service {
		width: 100%;
		background-size: cover;
	}

	.sidebar {
		width: 80%;
		float: left;
		margin-top: 35px;
		margin-left: 0;
	}

	.footer .lower .col.last {
		width: 100% !important;
	}
}

@media only screen and (max-width: 1255px) {
	#contactImg {
		float: none !important;
		margin-left: 0 !important;
		padding-bottom: 25px !important;
	}
}

@media only screen and (max-width: 1010px) {
	.header .address,
	.header .contact {
		float: none;
		width: 100%;
		text-align: center;
	}
	.header .address {
		margin-bottom: 50px;
	}
	.header .contact {
		margin-top: 50px;
	}
	.header .logo {
		position: inherit;
	}
}

@media only screen and (max-width: 900px) {
	.container {
		width: 100%;
	}

	.content {
		width: 80% !important;
		margin-left: 10%;
	}

	.sidebar {
		margin-left: 10%;
	}

	.footer .upper {
		width: 80%;
		margin-left: 10%;
	}

	.footer .lower .col {
		width: 80%;
		margin-left: 10%;
	}

	.footer .lower .col.last {
		width: 80% !important;
		margin-left: 10%;
	}

	.footer .copyright {
		width: 80%;
		margin-left: 10%;
	}

	.logo img,
	.strap {
		max-width: 260px;
		padding: 10px 0px;
	}
}

@media only screen and (max-width: 700px) {
	.flexslider {
		width: 100% !important;
	}
}

@media only screen and (max-width: 530px) {
	form textarea {
		width: 183px;
	}

	.header .strap {
		margin-top: 0;
	}

	.header .strap img {
		max-width: 90% !important;
	}

	/*.header .logo {
		top: 3.5%;
		bottom: 3.5%;
		width: 100%;
	}*/

	.header .logo img {
		max-width: 240px;
		margin-left: 16px;
		margin-top: 15px;
	}
}

/* Mobile Menu */
.burger {
	display: none !important;
	color: white;
	font-size: 30px;
	float: right;
	padding-right: 20px;
	padding-bottom: 20px;
}

@media only screen and (max-width: 882px) {
	.navigation {
		display: none;
	}
	.burger {
		display: block !important;
	}

	.navigation ul li.has_children ul {
		position: relative;
	}
	.navigation ul li.has_children ul li a {
		width: 100%;
	}
}

.mobileMenu {
	display: block;
}
.mobileMenu ul li {
	float: none;
}
.mobileMenu ul {
	text-align: center;
}
@media only screen and (min-width: 882px) {
	.navigation {
		display: block;
	}
	.mobileMenu ul li {
		float: left;
	}
}
