/*
Responsive 996px grid system ~ Style CSS.
Copyright 2013, Josh Copepadding-top:56px;
*/

/* =============================================================================
   Site Styles
   ========================================================================== */
   
	body {
		font-family: 'CalibriLight', CalibriLight;
		background:#000000;
		position: relative;
	}
	
	.headline {
  		 padding-left:20px;
  		 padding-bottom:10px;
  		 font-style: italic;
  		 font-family: 'CalibriLight', CalibriLight;
		 font-size:0.7em;
		 color:#ffffff;
	}
	
	.watchspacer {
  		 padding-bottom:20px;
	}
	
	.spacer {
  		 padding-bottom:2px;
	}
	
	.presents {
		 font-family: eyechart;
  		 padding-left:20px;
  		 padding-bottom:20px;
  		 font-style: italic;
		 font-size:1.4em;
		 color:#CCCCCC;
	}
	
	.presentsalt {
		 font-family: calibri-light;
  		 padding-left:20px;
  		 padding-bottom:20px;
  		 font-style: italic;
		 font-size:1.1em;
		 color:#000000;
	}
	
	.presentsx {
		 font-family: eyechart;
  		 padding-left:20px;
  		 padding-bottom:20px;
		 font-size:1.4em;
		 color:#CCCCCC;
	}
	.presentsxx {
		 font-family: eyechart;
  		 padding-left:20px;
  		 padding-bottom:20px;
		 font-size:1.2em;
		 color:#CCCCCC;
	}
	.presents-red {
		 font-family: eyechart;
  		 padding-left:20px;
  		 padding-bottom:20px;
		 font-size:1.2em;
		 color:#d10a11;
	}
	.presents-green {
		 font-family: eyechart;
  		 padding-left:20px;
  		 padding-bottom:20px;
		 font-size:1.2em;
		 color:#adc394;
	}
	.presents-gold {
		 font-family: eyechart;
  		 padding-left:20px;
  		 padding-bottom:20px;
		 font-size:1.2em;
		 color:#ffcc66;
	}
	.presents-goldLG {
		 font-family: eyechart;
  		 padding-left:20px;
  		 padding-bottom:20px;
		 font-size:1.6em;
		 color:#ffcc66;
	}
	#cssTable td { 
    	text-align:center; 
    	vertical-align:middle;
	}

	.top-colour {
		background-color:#000000;
	
	}
		.top-colouralt {
		background-color:#ffffff;
	
	}
	.intro {
		font-family: eyechart;
		color:white;
		font-size:1.2em;
		text-align:center;
        font-weight: bold;
    }
	
	.dcontent {
		width: 90%;	
		background:#000000;
	}
	
	#rcorners1 {
    	border-radius: 2px;
    	background: #d10a11;
    	padding: 8px; 
    	width: 150px;
	}
	
	.rcorners2 {
    	border-radius: 2px;
    	background: #d10a11;
    	padding: 5px; 
    	width: 100px;
    	margin-top: 4px;
    	margin-bottom: 4px;
	}
	
	#rcorners3 {
    	border-radius: 2px;
    	background: #adc394;
    	padding: 8px; 
    	width: 150px;
	}
	#rcorners4 {
    	border-radius: 2px;
    	background: #ffcc66;
    	padding: 8px; 
		margin-left: 0px;
    	width: 150px;
	}
	#rcorners4a {
    	border-radius: 2px;
    	background: #ffcc66;
    	padding: 8px; 
		margin-left: 0px;
    	width: 150px;
	}
	.rcorners2-grey {
    	border-radius: 5px;
    	background: #656456;
    	font-weight: bold;
    	padding: 3px; 
    	width: 100px;
    	margin-top: 10px;
    	margin-bottom: 30px;
    	font-size:1.0em;
	}
	
	a.buttonaf:link {
		font-family: eyechart;
		font-weight: bold;
		color:#000000;
		font-size: 0.9em;
	}
	a.buttonaf:visited {
		color:#000000;
		font-size: 0.9em;
	}
	a.buttonaf:hover {
		color:#000000;
		font-size: 0.9em;
	}

	.content {
		padding-top: 75px; 
	    margin:0 auto;
	}
	
	.contentb {
		padding-top: 75px; 
	    margin:0 auto;
	}
	
	.gcontent {
		padding-top: 44px; 
		width: 100%;	
	}
	
	
	.foot {
  		 padding:6px;
  		 font-size: 0.9em;
  		 font-family: 'CalibriLight', CalibriLight;
		 text-align:left;
		 color:#cccccc;
	}
	
	.footmenu {
  		 font-family: eyechart;
		 font-size:0.8em;
		 text-align:center;
	}
	

	.logo {
  		 padding:8px;
	}
	
	.logo-desktop {
  		 padding:8px;
	}
	
	#bespoke {
   		z-index: 1;
	    position:fixed;
	    top: 54px;
	    left: 10px;
	    background-color: #000;
	    padding: 0;
	    font-family: eyechart;
	 	font-style: bold;
	 	color: white;
	 	font-size:0.7em;
	 	padding-top: 3px;
	 	padding-left: 20px;
   }
	
	#floatingRectangle {
    z-index: 1;
    position:fixed;
    left: 0;
    right: 0;
    top: 0px;
    height: 50px;
	width: 100px;
    
    color: white;
    padding: 0;
}
	hr {
    	display: block;
    	text-align:center; 
    	margin: 0 auto;
    	margin-top: 25px;
    	margin-bottom: 25px;
    	height: 1px;
    	width: 90%;
    	border: 0;
    	border-top: 1px solid #404140;
}
	
	a:link {
		color: #d10a11;
    	text-decoration: none;
	}

	a:visited {
		color: #d10a11;
    	text-decoration: none;
	}

	a:hover {
		color: #D0B674;
    	text-decoration: underline;
	}

	a:active {
	color: #adc394;
	text-decoration: underline;
	font-family: eyechart;
	}

	.quote {
		font-family: eyechart;
		color:white;
		font-size:1em;
		text-align:center;
		font-style:italic;font-weight:bold
	}
	
	 h1 {
	padding-top:10px;
	font-family: eyechart;
	color:#cccccc;
	font-size:1.2em;
	text-align:center;
	}
		 .greentitle {
	padding-top:10px;
	font-family: eyechart;
	color:#adc394;
	font-size:1.2em;
	text-align: center;
	}
		 .greentitlesm {
	padding-top:10px;
	font-family: eyechart;
	font-weight: bold;
	color:#adc394;
	font-size:0.8em;
	text-align: center;
	}
	 .goldtitlesm {
	padding-top:10px;
	font-family: eyechart;
	font-weight: bold;
	color:#ffcc66;
	font-size:0.8em;
	text-align: center;
	}
	 .greentitleleft {
	padding-top:10px;
	font-family: eyechart;
	color:#adc394;
	font-size:1.2em;
	text-align: left;
	}
		 .goldtitle {
	padding-top:10px;
	font-family: eyechart;
	color:#ffcc66;
	font-size:1.2em;
	text-align: center;
	}
	 .goldtitleleft {
	padding-top:10px;
	font-family: eyechart;
	color:#ffcc66;
	font-size:1.2em;
	text-align: left;
	}
		 .redtitle {
	padding-top:10px;
	font-family: eyechart;
	color: #d10a11;
	font-size:1.2em;
	text-align:center;
	}
		 .redtitlesm {
	font-family: 'CalibriLight', CalibriLight;
	color: #d10a11;
	font-size:1.0em;
	}
	.gallerytitle {
	 	padding-top:4px;
		font-family: eyechart;
		color: #d10a11;
		font-size:1.2em;
		text-align:center;
	}
.gallerytitlegold {
	 	padding-top:4px;
		font-family: eyechart;
		color: #ffcc66;
		font-size:1.2em;
		text-align:center;
	}
	
	h2 {
	 	padding-top:10px;
	 	padding-left:15px;
		font-family: eyechart;
		color: #d10a11;
		font-size:1.1em;
		text-align:left;
	}
	
	.indent {
	 	padding-top:0px;
	 	padding-left:23px;
		text-align:left;
	}

	#menuxx ul li {
	 	font-family: eyechart;
		color:white;	
	 }

	p {
	font-size:1.1em;
	margin-left:10px;
	margin-right:10px;
	margin-top:5px;
	margin-bottom:1px;
	line-height: 20px;
	color:#CCC;
	font-family: CalibriLight, CalibriLight;
	}
	

	.align-right {
		text-align:right;
	}
	
	.align-center {
		text-align:right;
	}
	
	.bold {
		font-weight:700;
	}
	
	.relative {
		position:relative;
	}
	
	#nav {
		position:fixed;
		width:50%;
		border-top:0px solid #ffffff;
		text-transform:uppercase;
		font-weight:600;
		font-size:1.125em;
		padding:1em 0;
		background:#fff;
		z-index:999;
	}
	
	#nav ul {
		font-family: eyechart;
		padding:10;
		margin:0;
	}
	
	#nav li {
		font-family: eyechart;
		display:inline-block;
		padding:0.5em 0.5em;
	}
	
	
	#nav a {
		color:#333333;
		text-decoration:none;
	}
	
	#nav a:hover {
		border-bottom:4px solid #ea0b25;
	}
	
	
	.banner span {
		display:block;
		color:#fff;
		font-size:2.500em;
		font-weight:400;
		margin:0.75em 0;
	}
	
	.banner {
		text-align:center;
		background:#ea0b25;
	}
	
	#mobileMenu {
		display:none;
	}
	
	#orderx li {
		padding:0.25em;
		color:#CCCCCC;
		font-family: 'CalibriLight', CalibriLight;
	}
	
	#orderx ul {
		padding:0.25em;
		color:#CCCCCC;
		font-family: 'CalibriLight', CalibriLight;
	}
	.orderx ul {
		padding:0.25em;
		color:#CCCCCC;
		font-family: 'CalibriLight', CalibriLight;
	}
	
	.orderx li {
		padding:0.25em;
		color:#CCCCCC;
		font-family: 'CalibriLight', CalibriLight;
	}

/* =============================================================================
   Media Queries
   ========================================================================== */

/* Tablet Portrait size to Base 996px */
@media only screen and (min-width: 768px) and (max-width: 995px) {
	#nav {
		font-size:0.938em;
	}
}

/* All Mobile Sizes */
@media only screen and (max-width: 767px) {
	.js #nav .grid_9 {
		display:none;
	}
	
	.js #mobileMenu {
		display:block;
		position:fixed;
		width:100%;
		z-index:1000;
	}
	
	.js #nav{
		text-align:center;
	}

	#nav {
		position:relative;
		padding-top:3.375em;
	}
    
    .no-js #nav {
        padding-top:1em;
    }
	
	#nav img {
		display:block;
		margin:0 auto;
	}
	
	#main {
		padding:0;
	}
	
	.banner span {
		line-height:1em;
		font-size:1em;
	}
	
	#awesomeness {
		text-align:center;
		font-size:1.4em;
	}
	
	#awesomeness .btn {
		margin-top:1em;
	}
	
	#nav ul {
		font-family: eyechart;
		text-align: center;
		font-size:0.6em;
		line-height: 1.5em;
	}
	
	#nav ul li {
		font-family: eyechart;
		padding:0.25em;
	}
}

/* Mobile Landscape Size to Tablet Portrait */
@media only screen and (min-width: 480px) and (max-width: 767px) {}

/* Mobile Portrait Size to Mobile Landscape Size */
@media only screen and (max-width: 479px) {
	
	
}
	
@media only screen and (min-width:1025px) {
	.content {
		padding-top: 75px; 
	    width:800px;
	    margin:0 auto;
	}
	
	.foot {
  		 padding:6px;
  		 font-size:0.6em;
  		 font-family: 'CalibriLight', CalibriLight;
		 text-align:center;
		 color:#CCCCCC;
		 width:800px;
	     margin:0 auto;
	}
	.foot2 {
  		 padding:6px;
  		 font-size:0.6em;
  		 font-family: 'CalibriLight', CalibriLight;
		 text-align:center;
		 color:#ffffff;
		 width:800px;
	     margin:0 auto;
	}
}


/* =============================================================================
   Font-Face
   ========================================================================== */
/* This is the proper syntax for an @font-face file

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