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

::-webkit-scrollbar {
    width: 12px;
}
 
::-webkit-scrollbar-thumb {
    -webkit-border-radius: 0;
    border-radius: 0;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
		background: rgba(255,0,0,0.4); 
}

::-webkit-scrollbar-thumb:window-inactive {
	background: rgba(255,0,0,0.4); 
}

::-webkit-scrollbar-button {
    background: red;
    height: 20px;
}

::-webkit-scrollbar-button:vertical:increment {
    background-image: url(http://www.directorsdeal.com/images/graphics/arrow-end.jpg);
}

::-webkit-scrollbar-button:vertical:decrement {
    background-image: url(http://www.directorsdeal.com/images/graphics/arrow-top.jpg);
}

/* CSS Document */

html, body, #wrap {
  height: 100%;
}

body > #wrap {
  height: auto;
  min-height: 100%;
}

#main {
  padding-bottom: 40px;
}

.button {
	background: linear-gradient(to bottom, #cab15c 0%, #988222 100%);
	border-radius: 20px;
	color: #ffffff !important;
	display: inline-block;
	font: 600 16px/45px "Open Sans", sans-serif;
	margin: 0 1%;
	padding: 0 3%;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
}

body {
	background: url(/images/graphics/small-bg.jpg) bottom left fixed;
	margin: 0;
	padding: 0;
}

.cards {
	position: absolute;
	right: 1.5%;
	top: 10%;
	width: 13%;
}

.cards div {
	font-size: 0;
	margin: 0 0 11%;
}

.cards .h_image {
	display: none;
}

.cards div:hover .h_image {
	display: block;
}

.cards div:hover .image {
	display: none;
}

.cards img {
	width: 100%;
}

.black {
	color: #000000 !important;
}

@-webkit-keyframes FadeInOut {
    0% {
        opacity:100;
    }
    50% {
        opacity: 0;
    }
    100% {
        opacity:100;
    }
}

.stealth {
	position: relative;
  -webkit-animation: FadeInOut 10s infinite;
	-moz-animation: FadeInOut 10s infinite;
  -animation: FadeInOut 10s infinite;
}

@-webkit-keyframes FadeInOutR {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 100;
    }
    100% {
        opacity: 0;
    }
}

.stealthWord a {
	-webkit-animation: FadeInOutR 10s infinite;
	-moz-animation: FadeInOutR 10s infinite;
	animation: FadeInOutR 10s infinite;
	bottom: 15%;
	color: #ffffff;
	font: 700 italic 20px/100% "Open Sans", sans-serif;
	position: absolute;
	text-align: center;
	text-decoration: none;
	width: 100%;
}

.container {
	font-size: 0;
	margin: 0 0 0 1%;
	width: 85%;
}

.header {
	background: #000000;
	height: 40px;
	margin: 0 0 70px;
}

.header ul {
	font-size: 0;
	margin: 0;
	padding: 0;
	text-align: left;
	width: 100%;
}

.header li {
	display: inline-block;
	margin: 0 20px 0 0;
	padding: 0;
}

.header a {
	color: #ffffff;
	font: 300 13px/40px "Open Sans", sans-serif;
	text-decoration: none;
}

.left {
	display: inline-block;
	font-size: 0;
	margin: 50px 0 0;
	position: relative;
	width: 24%;
	z-index: 100;
}

.left .logo {
	margin: 0 auto 20px;
}

.adverts {
	margin: 0 auto;
	overflow: hidden;
	width: 100%;
}

.left .logo img {
	position: relative;
	width: 100%;
	z-index: 100;
}

.slide {
	padding: 0 0 20px;
}

.slide a {
	display: block;
	margin: 0 auto 5%;
}

.slide img {
	border: 3px solid #988222;
	border-radius: 10px;
	display: block;
	margin: 0 auto;
	width: 59%;
}

.slide a:hover img {
	border-color: #ffffff;
	 -webkit-box-shadow: 0 0 20px rgba(255, 255, 255, 1);
	-moz-box-shadow: 0 0 20px rgba(255, 255, 255, 1);
	box-shadow: 0 0 20px rgba(255, 255, 255, 1);
}

.mobile {
	display: none;
}

.largeD {
	width: 100%;
}

.navigation {
	position: absolute;
	font-size: 0;
	margin: 12% 0 0;
	right: -8.5%;
	top: 0;
	vertical-align: top;
	width: 23%;
}

.navigation .nav-cards {
	left: -50px;
	position: absolute;
	top: -20px;
	width: 250px;
}

.navigation ul {
	height: 100%;
	margin: 0;
	padding: 0;
	position: relative;
}

.navigation li {
	margin: 0;
	padding: 0;
	position: relative;
	text-align: center;
	width: 53%;
}

.navigation li:nth-child(1) {
	margin: 50% 0 0;
	z-index: 10;
}

.navigation li:nth-child(2) {
	margin: -11% 0 0 5%;
	z-index: 20;
}

.navigation li:nth-child(3) {
	margin: -12% 0 0;
	z-index: 30;
}

.navigation li:nth-child(4) {
	margin: -202% 0 0 21%;
	z-index: 40;
}

.navigation li:nth-child(5) {
	margin: -24% 0 0 40%;
	z-index: 50;
}

.navigation li:nth-child(6) {
	margin: -24% 0 0 54%;
	z-index: 60;
}

.navigation li:nth-child(7) {
	margin: -20% 0 0 60%;
	z-index: 70;
}

.navigation li:nth-child(8) {
	margin: -13% 0 0 60%;
	z-index: 80;
}

.navigation li:nth-child(9) {
	margin: -19% 0 0 54%;
	z-index: 90;
}

.navigation li:nth-child(10) {
	margin: -24% 0 0 40%;
	z-index: 100;
}

.navigation li:nth-child(11) {
	margin: -24% 0 0 21%;
	z-index: 110;
}

.navigation li img {
	width: 100%;
}

.navigation .h_image {
	display: none;
}

.navigation li:hover .h_image {
	display: block;
}

.navigation li:hover .image {
	display: none;
}

@-webkit-keyframes FadeIn {
    0% {
        opacity: 0;
    }
	70% {
        opacity: 0;
    }
    100% {
        opacity:100;
    }
}

.popup {
	background: #ffffff;
	/* border-radius: 20px; */
	/* left: 15%; */
	font: 400 12px/24px "Open Sans", sans-serif;
	position: absolute;
	/* -webkit-animation: FadeIn 2s;
	-moz-animation: FadeIn 2s;
	animation: FadeIn 2s;
	margin: 20px auto; */
	padding: 0 5% 2%;
	width: 90%;
	z-index: 998;
}

.popup .logo {
	display: inline-block;
	width: 20%;
	-webkit-margin-before: 0.67em;
	-webkit-margin-after: 0.67em;
	-webkit-margin-start: 0px;
	-webkit-margin-end: 0px;
}

.popup .logo img {
	width: 100%;
}

.popup-content {
	text-align: center;
}

.popup-content .image {
	display: inline-block;
	margin: 2%;
	max-width: 300px;
	vertical-align: top;
	width: 30%;
}

.popup-content .image img {
	width: 100%;
}

.popup-content .mobile {
	display: none;
	width: 100%;
}

.popup-content .non-mobile {
	width: 80%;
}

.popup-right {
	display: inline-block;
	font: 400 14px/24px "Open Sans", sans-serif;
	margin: 1% 0 0;
	width: 60%;
}

.popup-headings {
	display: inline-block;
	margin: 1% 0 0;
	vertical-align: top;
	width: 70%;
}

.popup h1 {
	font-size: 3em;
	font-weight: bold;
	line-height: 1.2em;
	vertical-align: top;
}

@media (max-width: 1480px) {
	
	.popup h1 {
		font-size: 26px;
	}
	
}

@media (max-width: 960px) {

	.popup .logo {
		text-align: center;
		margin: 0 auto;
		display: block;
		width: 60%;
	}

	.popup-headings {
		width: 100%;
	}

}

.popup h2 {
	font-size: 2em;
}

.popup .title {
	font-size: 25px;
	font-weight: bold;
}

.popup label {
	font-size: 20px;
	text-align: right;
}

.popup ul {
	display: flex;
	font-size: 0;
	list-style: none;
	margin: 0;
	padding: 0;
}

.popup li {
	background: linear-gradient(to bottom, #cab15c 0%, #988222 100%);
	border-radius: 20px;
	cursor: pointer;
	font: 700 20px/24px "Open Sans", sans-serif;
	display: inline-block;
	margin: 0 0.5% 15px;
	padding: 0.5% 0 30px;
	position: relative;
	text-transform: uppercase;
	vertical-align: top;
	width: 19%;
}

.popup li .hover-text {
	font: 700 12px/19px "Open Sans", sans-serif;
	margin: 2px 0 5px;
	padding: 0 7%;
	text-transform: none;
}

.popup li a {
	color: #fff;
	display: block;
	font-size: 16px;
	/* text-decoration: none; */
	/* align-content: center; */
	/* flex: 1; */
	position: absolute;
	bottom: 10px;
	width: 100%;
}

.popup li:hover .hover-text {
	display: block;
}

.popup label.button {
	background: linear-gradient(to bottom, #cab15c 0%, #988222 100%);
	border-radius: 20px;
	color: #ffffff;
	display: block;
	/* float: right; */
	font: 600 20px/20px "Open Sans", sans-serif;
	margin: 10px 10px auto 40px;
	padding: 1%;
	position: absolute;
	right: 0.5%;
	text-align: center;
	text-transform: uppercase;
	/* width: 80%; */
}

.popup label.button:hover {
	background: linear-gradient(to top, #cab15c 0%, #988222 100%);
	cursor: pointer;
}

.popup .adverts {
	display: none;
}

.popup .slide {
	padding: 0;
}

.content {
	display: inline-block;
	margin: 0 0 0 -9%;
	position: relative;
	width: 75%;
	vertical-align: top;
}

.scroll {
	direction: rtl;
	font: 400 13px/1.65 "Open Sans", sans-serif;
	height: 75%;
	left: 23%;
	overflow: auto;
	padding: 0 0 0 2%;
	position: absolute;
	top: 14%;
	width: 45%;
}

.scroll ul {
	margin: 0 0 0 20px;
	padding: 0;
}

.centre {
	text-align: center;
}

.scroll-wrap {
	direction: ltr;
	font-size: 80%;
}

.scroll h1,
.scroll h2,
.scroll h3 {
	line-height: 120%;
}

.scroll h1:nth-of-type(1),
.scroll h2:nth-of-type(1) {
	margin-top: 0;
}

.scroll h2 {
	color: #ec2127;
}

.scroll a {
	color: #988222;
}

.wideImage {
	width: 100% !important;
}

.aboutLeft {
	margin: 0 20px 10px 0;
	float: left;
	width: 150px;
}

.aboutLeft img {
	width: 100%;
}

.aboutLeft em {
	display: block;
}

.footer .container {
	width: 100%;
}

.red-button {
	background: #ec2127;
	border-radius: 5px;
	color: #ffffff !important;
	display: block;
	font-size: 14px;
	font-weight: bold;
	line-height: 20px;
	padding: 2% 5%;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
}

@media (min-width:1200px) {
	.red-button {
		padding: 2% 1% !important;
	}
}

/* ============================== Special Page Styles ====================== */

/* Forms */

form {
	font-size: 0;
}

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"],
textarea,
select {
	box-sizing: border-box;
	font: 400 13px/27px "Open Sans", sans-serif;
	height: 27px;
	margin: 0 1% 10px 0;
	padding: 2px;
	vertical-align: top;
	width: 32%;
}

textarea {
	font: 400 13px/18px "Open Sans", sans-serif;
	height: 100px;
	margin: 0 1% 10px 0;
	width: 65.1%;
}

.fieldWide {
	width: 48.4% !important;
}

.wideArea {
	width: 98% !important;
}

input[type="submit"] {
	background: linear-gradient(to bottom, #988222 0%, #cab15c 100%);
	border: 0;
	box-sizing: border-box;
	color: #ffffff;
	font: 700 16px/31px "Open Sans", sans-serif;
	height: 32px;
	margin: 0;
	padding: 0 20px;
	text-transform: uppercase;
	vertical-align: baseline;
}

input[type="submit"]:hover {
	background: linear-gradient(to bottom, #cab15c 0%, #988222 100%);
	cursor: pointer;
}

form p {
	font: 400 13px/1.65 "Open Sans", sans-serif;
}

form h2 {
	font: 700 18px/1.65 "Open Sans", sans-serif;
}

.subject {
	display: none;
}

/* Categories */

.categories {
	font-size: 0;
	margin: 0 !important;
	padding: 0;
}

.categories li {
	display: inline-block;
	font: 400 13px/23px "Open Sans", sans-serif;
	width: 50%;
}

.categories li.true a {
	color: red;
	font-weight: bold;
	text-transform: uppercase;
}

/* Business Page */

.business-listing {
	background: #ffffff;
	border-radius: 20px;
	margin: 0 auto 20px;
	padding: 1% 5% 3%;
	width: 80%;
}

.business-listing h1 {
	font: 700 30px/30px "Open Sans", sans-serif;
}

.business {
	font-size: 0;
	text-align: center;
}

.benefits {
	text-align: left;
}

.dealmakers {
	text-align: center;
}

.business .picLeft,
.business .picRight {
	border: 1px solid #cccccc;
	display: inline-block;
	margin: 0 0 20px;
	position: relative;
	vertical-align: top;
	width: 34%;
}

.business .picLeft img,
.business .picRight img {
	width: 100%;
	display: block;
}

.business .picLeft h2 {
	background: #000000;
	display: block;
	position: absolute;
	z-index: 100;
	color: #ffffff;
	bottom: 0;
	width: 100%;
	text-align: center;
	padding: 0;
	margin: 0;
	font: 700 18px/40px "Open Sans", sans-serif;
}

.business .picRight {
	margin-right: 0;
}

.business .contactDetails {
	display: inline-block;
	font: 400 18px/23px "Open Sans", sans-serif;
	text-align: center;
	padding: 0 3%;
	vertical-align: top;
	width: 24%;
}

.business .contactDetails p {
	margin-top: 0;
}

.business .contactDetailsLeft,
.business .contactDetailsRight {
	/* display: inline-block; */
	vertical-align: top;
	width: 100%;
}

.business .special {
	font: 700 24px/34px "Open Sans", sans-serif;
	margin: -5% 0 0;
	text-align: center;
}

.business-listing h2 {
	font: 700 28px/38px "Open Sans", sans-serif;
	color: #988222;
}

.listing-buttons {
	display: block;
	text-align: center;
}

.business-listing-button {
	background: linear-gradient(to bottom, #cab15c 0%, #988222 100%);
	border-radius: 20px;
	color: #ffffff !important;
	display: inline-block;
	font: 600 20px/45px "Open Sans", sans-serif;
	margin: 0 1%;
	padding: 0 3%;
	text-align: center;
	text-transform: uppercase;
	text-decoration: none;
}

/* Special page */

.special-text {
	font-size: 0;
}

.special-text .text {
	font: 400 14px/24px "Open Sans", sans-serif;
}

.special-text .image {
	margin: 0 auto;
	max-width: 300px;
	width: 100%;
}

.special-text .image img {
	width: 100%;
}

/* Contact Page */

.person {
	font-size: 0;
	margin: 0 0% 10px 0;
}

.person:nth-of-type(2n) {
	margin: 0 0 10px;
}

.person:nth-of-type(4) {
	margin-bottom: 20px;
}

.person img {
	display: inline-block;
	height: auto;
	margin: 0 0 5px;
	width: 30%;
}

.person .text {
	display: inline-block;
	font: 400 13px/23px "Open Sans", sans-serif;
	vertical-align: top;
	width: 100%;
}

/* Dealmakers */

.dealmakers .person {
	margin: 0 0 30px;
}
.dealmakers .person img {
	width: 70% !important;
}

@media (min-width: 450px) {
	.dealmakers .person {
	display: inline-block;
	margin: 0 1.1% 30px;
	width: 46%;
}
}

@media (min-width: 770px) {
	.dealmakers .person {
	width: 29%;
}
}

@media (min-width: 1060px) {
	.dealmakers .person {
	width: 21%;
}
}

@media (min-width: 1360px) {
	.dealmakers .person {
	width: 15%;
	}

	.dealmakers .person img {
	width: 100%;
}
}

@media (min-width: 1500px) {
	.dealmakers .person {
	width: 12%;
	}

}

/* Classifieds */

.classifieds h1 {
	font: 900 3em/100% "ff-more-web-pro-condensed", sans-serif;
	color: #444444;
	text-align: center;
}

.classifieds h2 {
	font: 900 2em/100% "ff-more-web-pro-condensed", sans-serif;
}

.classifieds .leftColumn {
	border-right: 1px solid #cccccc;
	display: inline-block;
	margin: 0 4% 0 0;
	padding: 0 5% 0 0;
	vertical-align: top;
	width: 45%;
}

.classifieds .rightColumn {
	display: inline-block;
	vertical-align: top;
	width: 44%;
}

.classifed {
	border-bottom: 1px solid #333333;
	text-align: justify;
	margin: 0 0 15px;
	padding: 0 0 5%;
	width: 100%;
}

.done-deal {
	background: url(/images/done-deal.png) no-repeat right bottom;
}

.mobile-classifieds {
	display: none;
}

/* benefits */

.small-right {
	float: right;
	margin: 0 0 10px 5%;
	width: 40%;
}

.benefits img {
	margin: 0 auto;
	display: block;
	float: none;
	width: 100%;
}

.benefits .column {
	display: inline-block;
	font: 400 13px/23px "Open Sans", sans-serif;
	vertical-align: top;
	width: 25%;
}

@media (max-width: 1300px) {

.benefits .column {
	width: 50%;
}

.benefits img {
	display: block;
	float: none;
	margin: 0 auto;
}

}

@media (max-width: 1600px) {

.benefits .column {
	width: 50%;
}

.benefits img {
	display: block;
	float: none;
	margin: 0 auto;
	width: 50%;
}

.img_profile {
	width: 100% !important;
}

}

@media (max-width: 690px) {

.benefits .column {
	width: 100%;
}

.benefits img {
	display: block;
	float: none;
	margin: 0 auto;
}

}

.benefits .column img {
	/* display: block; */
	/* float: none; */
	/* margin: 0 auto; */
	/* width: 50%; */
}

.benefits h2 {
	font-size: 16px;
	text-align: center;
}

/* manage edit business page */

.manage .picLeft,
.manage .picRight {
	background: #cccccc;
}

.manage .warning {
	display: none;
	font: 400 11px/21px "Open Sans", sans-serif;
}

.manage .picLeft img:hover,
.manage .picRight img:hover {
	cursor: pointer;
}

#picLeftChange:checked ~ img,
#picRightChange:checked ~ img {
	display: none;
}

#picLeftChange:checked ~ input,
#picRightChange:checked ~ input,
#picLeftChange:checked ~ .warning,
#picRightChange:checked ~ .warning {
	display: block;
}

.manage .picLeft img,
.manage .picRight img {
	width: 100%;
}

.manage .picLeft input,
.manage .picRight input {
	display: none;
}

/* Special pages */

.guarantee {
	margin: 0 auto;
	max-width: 700px;
	text-align: center;
	width: 90%;
}

.guarantee img {
	width: 70%;
}

.special-text .testimonial {
	font: 400 14px/24px "Open Sans", sans-serif;
	display: inline-block;
	margin: 0 0 40px;
	width: 100%;
}

.special-text .testimonial .image {
	margin:  0 auto;
	max-width: 360px;
	width: 100%;
}

.special-text .testimonial .image img {
	max-width: none;
	width: 100%;
}

.special-text .testimonial h2 {
	margin-bottom: 0;
}

@media (min-width: 360px) {

	.special-text .testimonial .image {
		display: inline-block;
		margin: 0 2% 0 0;
		text-align: center;
		width: 30%;
	}

	.special-text .testimonial .quote {
		display: inline-block;
		vertical-align: top;
		width: 66%;
	}

}


@media (min-width: 800px) {

	.special-text .testimonial {
		display: inline-block;
		width: 50%
	}

}



/* ============================== END - Special Page Styles ====================== */

.footer {
	clear: both;
	color: #ffffff;
	height: 40px;
	margin: -40px 0 0;
	overflow: hidden;
	position: relative;
	text-align: center;
}

.footer .container {
	margin: 0 auto;
}

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

.footer li {
	display: inline-block;
	font: 300 13px/40px "Open Sans", sans-serif;
	margin: 0 8px;
	padding: 0;
}

.footer a {
	color: #ffffff;
	text-decoration: none;
}

/* ================================================ MEDIA QUERIES ======================================== */

@media (min-width: 900px) {

	.scroll-wrap {
		font-size: 100%;
	}
	
}

@media (min-width: 1401px) and (max-width: 1800px){

	.popup li {
		font: 700 16px/24px "Open Sans", sans-serif;
	}

}

@media (min-width: 1101px) and (max-width: 1400px){

	.popup li {
		font: 700 13px/24px "Open Sans", sans-serif;
	}

}

@media (min-width: 1200px) {

	.business-listing {
		min-height: 445px;
	}

	.special-text .text {
		display: inline-block;
		vertical-align: top;
		width: 65%;
	}

	.special-text .image {
		display: inline-block;
		margin: 0 0 0 5%;
		width: 30%;
	}

}

@media (min-width: 1600px) {

	.scroll-wrap {
		font-size: 95%;
	}

	.business-listing {
		min-height:650px;
	}

}

@media (min-width: 1800px) {

	.scroll-wrap {
		font-size: 100%;
	}

}

@media (max-width: 1800px) {
	
	.business .special {
		margin-top: 0;
	}
}

@media (min-width: 1000px) and (max-width: 1100px){

	.popup li {
		font: 700 12px/24px "Open Sans", sans-serif;
	}

}

@media (max-width: 1000px) {

	.popup {
		/* left: 5%; */
		width: 90%;
	}

	.popup h1 {
		font-size: 2em;
	}

	.popup h2 {
		font-size: 1.5em;
	}

	.popup ul {
		display: inline;
	}

	.popup li {
		font: 700 14px/24px "Open Sans", sans-serif;
		margin: 10px 0.5% 0;
		width: 100%;
		display: inline-block;
	}


}

@media (max-width: 1300px) {

	.business .contactDetails {
		font-size: 14px;
	}

	.business .special {
		font: 700 14px/24px "Open Sans";
		margin-top: 0;
	}

}

@media (min-width: 1000px) {
	
	.business-listing-button {
		/* display: none; */
	}
	
}

@media (max-width: 1000px) {

	.business .contactDetails {
		font-size: 13px;
	}

	.business .special {
		font: 700 13px/23px "Open Sans";
		margin-top: 0;
	}

}


@media (min-width: 860px) {

	.business-listing {
		width: 80%;
	}

}

@media (max-width: 1500px) {

	.business .contactDetails {
		font: 400 15px/23px "Open Sans", sans-serif;
	}

}

@media (max-width: 860px) {

	html, body, #wrap {
	  height: auto;
	  overflow: auto; 
	}

	.container {
		margin: 0 auto;
		width: 100%;
	}

	.logo {
		display: block;
		width: 30%;
	}

	.hide-mobile {
		display: none;
	}

	.left,
	.content,
	.navigation,
	.cards,
	.scroll {
		position: relative;
		width: 100%;
	}

	.left {
		margin: 20px 0 0;
		text-align: center;
	}

	.largeD,
	.cards,
	.adverts {
		display: none;
	}
	
	.mobile {
		display: block;
		margin: 0 auto;
		position: relative;
		z-index: 100;
		text-align: center;
	}
	
	img.mobile {
		display: none;
		top: auto;
	}

	.mobile label {
		color: #ffffff;
		display: inline-block;
		right: 5%;
	}

	.mobile span,
	.mobile-home {
		background: linear-gradient(to bottom, #cab15c 0%, #988222 100%);
		border-radius: 10px;
		color: #ffffff !important;
		cursor: pointer;
		display: block;
		font: 600 16px/40px '"Open Sans"', sans-serif;
		text-align: center;
		text-decoration: none;
		text-transform: uppercase;
		margin: 0 10px 20px;
		padding: 0 10px;
	}
	
	.mobile-home {
		display: inline-block;
		/* position: absolute; */
	}

	#mobile-menu {
		display: none;
	}

	#mobile-menu:checked ~ .navigation ul {
		display: block !important;
		margin: -20px 0 20px;
	}

	.navigation {
		display: none;
		margin: 0 auto;
		padding: 0;
		position: static;
		width: 90%;
	}
	
	.mobile .navigation {
		display: block;
	}

	.navigation img {
		display: none;
	}

	.navigation ul {
		background: linear-gradient(to bottom, #cab15c 0%, #988222 100%);
		border-radius: 10px;
		display: none;
	}

	.navigation li {
		border-bottom: 1px solid #ffffff;
		display: block;
		height: 40px;
		margin: 0 !important;
		position: relative;
		width: 100%;
	}

	.navigation li:last-child {

		border: 0 none;
	}

	.navigation a {color: #ffffff;display: block;font: 600 14px/40px '"Open Sans"', sans-serif;text-decoration: none;}

	.navigation li:hover a {
		background: linear-gradient(to top, #cab15c 0%, #988222 100%);
	}

	.navigation li:hover a img {
		display: none !important;
	}

	.content {
		background: #ffffff;
		border-radius: 20px;
		display: block;
		margin: 0 auto;
		padding: 5%;
		width: 80%;
	}

	.scroll {
		font-size: 16px;
		left: auto;

		margin: 0;
		padding: 0;
		top: auto;
	}

	.scroll img {
		width: 100%;
	}

	.footer {
		height: auto;
	}

	.popup li {
		/* width: 48%; */
	}

	.business .contactDetails {
		font: 400 13px/23px "Open Sans", sans-serif;
		padding: 0 1%;
	}

	.mobile .adverts {
		display: block;
		margin: 20px auto;
		overflow: initial !important;
		width: 250px !important;
	}
	
	.mobile .adverts img {
		width: 250px;
	}

}

@media (max-width: 600px) {

	.popup {
		height: auto;
		/* left: 5%; */
		width: 90%;
	}

	.popup-right {
		display: block;
		margin: 0 auto;
		width: 90%;
	}

	.popup .image {
		width: 50%;
	}

	img.mobile {
		display: block !important;
		width: 100% !important;
	}

	.non-mobile {
		display: none;
	}

	.logo {
		width: 150px;
	}

	input,
	textarea,
	select,
	.fieldWide {
		width: 100% !important;
	}
	
	.mobile-classifieds {
		display: block;
		text-align: center;
	}
	
	.mobile-classifieds a {
		background: linear-gradient(to bottom, #cab15c 0%, #988222 100%);
		border-radius: 10px 10px 0 0;
		color: #ffffff !important;
		cursor: pointer;

		display: inline-block;
		font: 600 10px/30px '"Open Sans"', sans-serif;
		text-align: center;
		margin: 0 2px;
		padding: 0 10px;
		text-decoration: none;
		text-transform: uppercase;
		width: auto;
	}

	.classifieds .leftColumn,
	.classifieds .rightColumn,
	.person .text {
		width: 100%;
	}
	
	.categories li {
		width: 100%;
	}

	.popup li {
		width: 98%;
	}
	
	.guarantee img {
		width: 100%;
	}

	.business-listing-button {
		font: 600 18px/30px "Open Sans", sans-serif;
		padding: 10px 20px
	}

}

@media (min-height: 600px) and (max-height: 640px) {

	.popup {
		margin: 0;
		padding: 0.5% 1% 1%;
		width: 98%;
	}

	.popup label.button {
		margin-top: 0;
	}

	.popup .non-mobile {
		width: 68%;
	}

	.popup h1 {
		width: 98%;
		font-size: 20px;
		margin-top: 0;
	}

	.popup h2 {
		font-size: 18px
	}

	.popup li {
		margin-top: 10px;
	}

	.popup .logo {
		width: 15%;
		position: absolute;
		top: 15%;
	}

	.popup-headings {
		width: 100%;
	}

	.popup .hover-text {
		font: 400 12px/16px "Open Sans", sans-serif !important;
		padding: 0 3% !important;
	}

	.business-listing {
		margin: 15px auto;
		padding: 0.5% 2% 1%;
	}

	.business .special {
		font: 700 14px/24px "Open Sans", sans-serif;
	}

	.business .special h2 {
		margin-top: 0;
	}

}

@media (min-width: 300px) and (max-width: 599px) {

	.content img {

		width: 50%;
	}

	.aboutLeft {
		margin: 0 2% 10px;
	}

	.aboutLeft img {
		width: 90%
	}

	.business .picLeft,
	.business .picRight,
	.business .contactDetails {
		width: 100%;
	}

	.business .special {
		font: 700 13px/23px "Open Sans";
		margin-top: 0;
	}

}

@media (min-width: 600px) and (max-width: 860px) {

	.content img {
		width: 20%;
	}

	.aboutLeft img {
		width: 100%;
	}

}