@charset "utf-8";

*{
	margin: 0;
	padding: 0;
	border: 0;
	outline: none;	
}

html, body {
	font-size: 1em tahoma, verdana, arial, sans-serif;	
}

img {
	max-width: 100%;
}

/* navigation font */
@font-face {
    font-family: 'M1mlight';
    src: url('fonts/navigation/mplus-1m-light-webfont.eot');
    src: url('fonts/navigation/mplus-1m-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/navigation/mplus-1m-light-webfont.woff') format('woff'),
         url('fonts/navigation/mplus-1m-light-webfont.ttf') format('truetype'),
         url('fonts/navigation/mplus-1m-light-webfont.svg#M1mlight') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* <h2> font */
@font-face {
    font-family: 'modern_no._20regular';
    src: url('fonts/h2/mod20-webfont.eot');
    src: url('fonts/h2/mod20-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/h2/mod20-webfont.woff') format('woff'),
         url('fonts/h2/mod20-webfont.ttf') format('truetype'),
         url('fonts/h2/mod20-webfont.svg#modern_no._20regular') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* main content <p> font */
@font-face {
    font-family: 'GarogierRegular';
    src: url('fonts/p/Garogier_unhinted-webfont.eot');
    src: url('fonts/p/Garogier_unhinted-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/p/Garogier_unhinted-webfont.woff') format('woff'),
         url('fonts/p/Garogier_unhinted-webfont.ttf') format('truetype'),
         url('fonts/p/Garogier_unhinted-webfont.svg#GarogierRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

h2 {
	font-family: 'modern_no._20regular', "Times New Roman", Times, serif;
	font-size: 3em;
	color: #030;
	margin-bottom: 1em;
	}
	
h3, p {
	font-family: 'GarogierRegular', "Times New Roman", Times, serif;
	font-size: 1.25em;	
}

h3 {
	text-transform: uppercase;
	text-decoration: underline;	
}

a {
	color: #060;	
}

a:hover {
	color: #090;
	text-decoration: none;	
}

#container {
	max-width: 62.5em; /* 1000px / 16px */
	height: auto;
	margin: 0 auto;
}

#header {
	width: 100%;
	padding-bottom: 3.75em;
	background: url(images/headerBackground.png) no-repeat;	
	background-size: cover;
	-moz-background-size: cover;
	-webkit-background-size: cover;
	background-position: center;
	
}

#logo {
	width: 29.40%;
	height: 19em;
	margin: 0 auto;
	background: url(images/logo.png) no-repeat;	
	background-size: contain;
	-moz-background-size: contain;
	-webkit-background-size: contain;
	text-indent: -625em;
}

#nav {
	width: 100%;
	height: 4.25em;
	margin-top: 3.4375em;
	background: url(images/navStrip.png) no-repeat;	
	background-size: cover;
	-moz-background-size: cover;
	-webkit-background-size: cover;
	background-position: center;
	}

	ol#nav-list {
		font-family: 'M1mlight', tahoma, verdana, sans-serif;
		font-size: 2.25em;
		font-weight: normal;
		padding-top: 0.40625em;
		margin-left: 7%;
	}

	ol#nav-list li {
		display: inline; 
		list-style-type: none;
		margin-left: 7.5%;
		color: #030;	
	}

	a.nav-links {
		color: #fff;
		text-decoration: none;	
	}

	a.nav-links:hover {
		color: #9c9;	
	}
	
#content, #about-content {
	width: 90%;
	padding-top: 3.125em;
	margin: 0 auto;	
	margin-bottom: 43.75em;
}

/* OFFERS */
ul.offers-list {
	margin: 1.5em 0 3em 3.111%;
}

h3#offers-h3 {
	text-decoration: none;	
}

/* See PRODUCTS for ul.offers-list li and .offers-pic definition */

h3.offers-line {
	margin-top: 1em;	
}

.offers-description {
	width: 100%;
	text-align: center;
	color: #fff;
	font-size: 1.5em;
	background-color: #060;
	margin-top: -1.1em;
	padding: 0 0 0.2em 0;
	position: relative;
	z-index: 2;
}

.no-offers {
	color: #030;	
}

.offer-exp {
	font-size: 0.6em;
	margin-top: -5px;	
}

p#terms {
	font-size: 0.875em;	
	margin-top: 2em;
}

/* PRODUCTS */

ul.products-list, #top-image {
	margin-top: 3em;
	margin-left: 3.111%;		
}

ul.products-list li, ul.offers-list li {
	list-style-type: none;
	display: inline-block;	
	margin-right: 7.778%;
}

.product-pic, .offers-pic {
	width: 25%;
	height: 14.0625em;
}

.depth {
	z-index: 1;
	position: relative;
}

.product-description, .product-specifics, .no-products {
	width: 100%;
	text-align: center;
	color: #fff;
	font-size: 1.875em;
	background-color: #060;
	margin-top: -0.87em;
	padding: 0.2em 0 0.2em 0;
	position: relative;
	z-index: 2;
}

.product-specifics {
	font-size: 1.2em;
}

.no-products {
	font-size: 1.2em;
	color: #030;	
}

a.product-link {
	color: #fff;
	text-decoration: none;	
}

a.product-link:hover {
	color: #030;	
}

#back-top, #back-bottom {
	float: right;
	font-size: 1em;
}

#back-bottom {
	margin-top: 4em;	
}

a.back-link {
	color: #000;
	text-decoration: none;
	border-bottom: 1px dashed #000;		
}

a.back-link:hover {
	border-bottom: 1px solid #000;	
}


/* ABOUT */
#about-content {
	margin-bottom: 10em;	
}

#about-text-wrapper {	
	padding: 0 2.777% 0 2.777%;	
}

.about-text {
	margin-bottom: 1.25em;	
}

#street-float {
	float: right;
	padding: 0.5em 0 0.5em 2.222%;
}

/* CONTACT */

#details {
	float: left;
	margin-left: 8.333%; /* 75px/900px */	
}

#img-float {
	float: left;
	margin-left: 16.667%;	
}

.contact {
	margin-bottom: 1.875em;	
}

#at-symbol, .pound-symbol {
	font-family: "Times New Roman", Times, serif;
	font-size: 0.875em;
}

#footer {
	width: 100%;
	height: 2.5625em;
	padding-top: 1.8125em;
	background-color: #363;	
	clear: both;
}

	p#legal-info {
		font-family: tahoma, verdana, sans-serif;
		font-size: 0.75em;
		color: #030;
		text-align: center;	
	}

	a#credits {
		color: #030;
		text-decoration: none;
		border-bottom: 1px dashed #030;	
	}

	a#credits:hover {
		color: #000;
		border-bottom: 1px solid #000;	
	}
	
@media screen and (max-width:320px) {
	
h2 {
	font-size: 1.5em;	
}

h3, p {
	font-size: 1em;	
}

#header {
	background: none;
	padding-bottom: 0;
	
}

#logo {
	width: 90%;
	
}

#nav {
	width: 100%;
	height: auto;
	margin-top: 1em;
	background: none;	
}

ol#nav-list {
		width: 90%;
		background-color: #363;
		margin: 0 auto;
		font-size: 1em;
		margin-left: 5%;
		margin-top: 0;
		padding-bottom: 0.40625em;
		text-align: center;
	}

	ol#nav-list li {
		margin: 0 auto;		
		list-style-type: none;			
	}
	
#content {
	padding-top: 1em;
	margin-bottom: 4.6875em;	
}

/* OFFERS */
ul.offers-list {
	margin: 1em 0 0 20%;
}

/* See PRODUCTS below for ul.offers-list li definition*/

.offers-description {
	font-size: 1.2em;
}

h3#offers-h3 {
	margin-top: 2em;	
}

h3.offers-line {
	margin-top: 1em;	
}

/* PRODUCTS */

#top-image {
	display: none;
}

ul.products-list {
	margin-top: 1em;
	margin-left: 20%;
}

ul.products-list li, ul.offers-list li {
	display: block;	
	margin-right: 0;
	margin-bottom: 1em;
}

.product-pic, .offers-pic {
	width: 75%;
	height: auto;
}

.depth {
	z-index: 1;
	position: relative;
}

.product-description {
	font-size: 1.4em;
	margin-top: -0.9em;
}

.product-specifics, .no-products {
	font-size: 0.8em;
}

#back-top {
	float: none;
	margin-bottom: 0.5em;
}

#back-bottom {
	margin-top: 1em;	
}


/* ABOUT */
#about-content {
	padding-top: 1em;
	margin-bottom: 4.6875em;
}

#about-text-wrapper {	
	padding: 0;	
}

.about-text {
	margin-bottom: 1.25em;	
}

#street-float {
	float: none;
	padding: 0 0 1.25em 0;	
}

/* CONTACT */

#details {
	float: none;
	margin-left: 0; /* 75px/900px */	
}

#img-float {
	float: none;
	margin-left: 0;
	margin-top: 1.25em;	
}

.contact {
	margin-bottom: 1.25em;	
}


#footer {
	width: 85%;
	height: 25px; /*41*/
	margin: 0 auto;
	padding: 2.5%; /* 29*/
	background-color: #363;	
}

	p#legal-info {
		font-size: 0.5625em;
}

}


@media screen and (min-width:400px) and (max-width:768px) {
	
h2 {
	font-size: 2em;
	}
	
#logo {
	width: 60%;
	height: 20em;
	margin: 0 auto;
	background: url(images/logo.png) no-repeat;	
	background-size: contain;
	-moz-background-size: contain;
	-webkit-background-size: contain;
	background-position: 50% 0;
	text-indent: -625em;
}

ol#nav-list {
		font-family: 'M1mlight', tahoma, verdana, sans-serif;
		font-size: 1.5em;
		font-weight: normal;
		text-align: center;
		padding-top: 0.85em;
		margin-left: 0;
	}
	
	ol#nav-list li {
		display: inline; 
		list-style-type: none;
		margin-left: 2%;	
	}
	
	p#legal-info {
		font-size: 0.625em;
		padding-left: 1.041%;
		padding-right: 1.041%;
	}
	
#content {
	margin-bottom: 4.6875em;	
}

/* OFFERS */
ul.offers-list {
	margin: 2em 0 0 10%;
}

ul.offers-list li {
	margin-right: 5%;
}

.offers-pic {
	width: 27%;
	height: auto;
}

h3#offers-h3 {
	margin-top: 2em;
}

/* See PRODUCTS for ul.offers-list li and .offers-pic definition */

h3.offers-line {
	margin-top: 1em;	
}

.offers-description {
	font-size: 0.75em;
	margin-top: -1.9em;
	padding: 0.5em 0 0.5em 0;
}

.offer-exp {
	font-size: 0.9em;
	margin-top: -2px;	
}

/* PRODUCTS */

#top-image {
	margin-top: 1.5em;
}


ul.products-list {
	margin-top: 3em;
	margin-left: 10%;		
}

ul.products-list li {
	list-style-type: none;
	display: inline-block;	
	margin-right: 5%;
}

.product-pic {
	width: 25%;
	height: auto;
}

.product-description {
	font-size: 1.2em;
	margin-top: -0.87em;
}

.product-specifics, .no-products {
	font-size: 0.9em;
}

#back-top {
	float: none;
	margin-bottom: 0.5em;
}



/* ABOUT */
#about-content {
	margin-bottom: 10em;	
}

#about-text-wrapper {	
	padding: 0;	
}

.about-text {
	margin-bottom: 1.25em;	
}

#street-float {
	float: none;
	padding: 0 0 1.25em 0;	
}
	
/* CONTACT */

#details {
	float: none;
	margin-left: 0; /* 75px/900px */
}

#img-float {
	float: none;
	margin-left: 0;
	margin-top: 1.25em;		
}

#img-center {
	text-align: center;
}

.contact {
	margin-bottom: 1.875em;	
}


}

@media screen and (min-width:770px) and (max-width:1000px) {
	
	/* Navigation */
	ol#nav-list {
		font-size: 2em;
		padding-top: 0.6em;
		margin-left: 9%;
	}

	ol#nav-list li {
		margin-left: 5%;
	}
	
	#logo {
	width: 40%;
	}
	
	/* OFFERS*/	
	.offers-description {
	width: 100%;
	text-align: center;
	color: #fff;
	font-size: 1em;
	background-color: #060;
	margin-top: -1.5em;
	padding: 0 0 0.2em 0;
	position: relative;
	z-index: 2;
}

/* CONTACT */

	#details {
	margin-left: 5%; /* 75px/900px */	
}

	#img-float {
	margin-left: 5%;	
}
	
}


