@charset "utf-8";

/* CSS Document */



body, html, #content	{
		position: relative;
		margin: 0 auto;
		height: 100%;
		font-family: 'Cabin Condensed', sans-serif;
		background: #fff;
		font-size: 1em;
		color: #666;
		}

#header	{

	position: relative;

	margin: auto;

	max-width: 100%;

	min-width: 240px;

	padding: 0 10%;

	background: #e8e8e8;

		}

#header a:active, #header a	{
	color: #222;
}

#header a:hover	{color: #9454a2;}

#header .logo	{margin: 11px 0}

.social	{

		float: right;

		margin: 2em 5px; 

		}
#social a, #social a:active, #social a:visited	{
			color: #141414;
			}
#head	{

	position: relative;

	width: 100%;

	background: #141414;

	height: auto;

	background-color: #fff;

		}

#content ul li	{list-style: url(images/li.png);}

/*Site Navigation Begins Here*/

#nav		{

		position: relative;

		width: 100%;

		height: 71px;

		margin: 10px auto 20px auto;

		font-size: 15px;

		}



#content	{

	max-width: 1024px;

	min-width: 300px;

	padding: 30px;

	height: auto;

	margin: 0 auto;

	text-align: justify;

	border-radius: 5px;

	line-height: 1.7em;

		}

.page-content	{

		background: #f7f4e8;

		max-width: 600px;

		min-width: 240px;

		padding: 20px;

		border-radius: 5px;

			}

#slide	{

	position: relative;

	margin: auto;

	/*background: #000;*/

	width: 100%;

		}

.contact-details, .policy	{	

		background: #111;

		max-width: 320px;

		height: auto;

		padding: 20px;

		color: #888;

		float: right;

		border-radius: 4px;

		}

.policy		{

		min-width: 303px;

		margin: 5px;	

		text-align: center;	

			}

.contact-details h3, .policy h3, .towns h3	{

			padding: 10px;

			background: #b9981f;

			color: #111;

			font-weight: 900;

			border-radius: 2px;

			text-align: center;

			}

#index	{

	position: relative;

	max-width: 1024px;

	min-width: 200px;

	padding: 5px;

	margin: auto;

	line-height: 1.6em;

		}

#index-contact	{

		position: relative;

		max-width: 1024px;

		background-color:#9454a2;

		line-height: 2em;

		}

	

.products{

		border-right: #000 solid 3px;

		border-bottom: #000 solid 3px;

		float: left;

		margin: 0 15px 15px 15px;

		}



.head-office, .zimbabwe, .towns, .plumtree, .polokwane	{

			position: relative;

			padding: 15px;

			background: #eee;

			float: left;

			box-shadow: #999 +1px +1px +1px +1px;

			line-height: 1.7em;

			}

.plumtree	{margin-right: 0;}

.international {
			height: auto;
			margin-right: 20px;
			float: right;
			}



.towns	{

			max-width: 400px;

			float: right;

			height: auto;

			margin: 5px; 

			background: #fff;

			}

.joburg h3, .kelvin h3, .plumtree h3	{

			margin: 0;

			}

iframe	{border: #999 1px solid;}

.iframe-rwd  {

		position: relative;

		padding-bottom: 65.25%;

		padding-top: 30px;

		height: 0;

		overflow: hidden;

	}

.iframe-rwd iframe {

		position: absolute;

		top: 0;

		left: 0;

		width: 100%;

		height: 100%;

		}

/*Feedback Form styles start here*/



#feedback-form 	{

		width: 100%;

		padding: 10px;

		}

#feedback .reset, #feedback .submit	{

		width: auto;

		}

legend	{margin: 20px;}



input, textarea, .passport	{

		max-width: 90%;

		background: #f0f0f0;

		border: #c69a0b 1px solid;

		border-radius: 4px;

		height: 3em;

		padding: 5px;

		color: #666;

		font-size: 16px;

		}

textarea	{height:auto;}

.checkbox	{width: 30px;}

.asteric	{

		color:#f00; 

		font-size:18px; 

		font-weight: bold;}

/*#feedback	{

		float: right;

		}*/

#feedback input, #feedback textarea	{

		width: 100%;

		height: auto;

		}



.reset, .submit {

		border: #ccc 1px solid;

		background: #c69a0b;

		font-size: 1.2em;

		color: #000;

		height: 40px;

		width: auto;

		padding: 10px 20px;

		cursor: pointer;

		display: block;

		display: inline;

		margin: 5px;

		}

fieldset	{margin: 30px auto;}

legend	{

		font-size: 2em;

		font-variant: small-caps;

		font-weight: bold;

		color: #c69a0b;

		}

/*Feedback Form Styles end here*/

#footer	{

		width: 100%;

		text-align: center;

		margin: 40px auto 0 auto;

		height: 5em;

		padding: 20px 0;

		font-size: 12px;

		color: #999;

		background: #000;

		border-top: 3px double #9454a2;

		}

.foot	{

		position: relative;

		max-width: 1024px;

		min-width: 240px;

		margin: auto;

		}

.foot a:active, .foot a, .foot a:visited {color: #999;}

.foot a:hover {color: #9454a2;}

.google-maps {

        position: relative;

        padding-bottom: 50%; /* This is the aspect ratio*/

        height: 0;

        overflow: hidden;

		margin: .2em 0;

    }

    .google-maps iframe {

        position: absolute;

        top: 0;

        left: 0;

        width: 100% !important;

        height: 100% !important;

		border: #222 5px solid;

    }

h1		{

		color: #9454a2;

		size: 24px;

		line-height:1.5em;

		margin-top: 0;

		font-weight: bold;

		}

h3		{

		font-size: 18px;

		font-weight: bold;

		}
h4		{color: #9454a2;}
h2		{

	padding: 10px 20px;

	background: #222;

	color: #9454a2;

	border-radius: 3px;

	margin: 20px 0;

	font-weight: bold;

		}

#header h1 a {

		text-decoration: none; 

		float:right; 

		border-bottom: none; 

		font-weight: bold;

		}

#header h1 a:hover {color: #111;}

a, a:active, a:visited	{

	color: #9454a2;

	text-decoration: none;

		}

a:hover	{

	color: #999;

}

a img	{border: 0;}