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

}

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

}



html{ -webkit-text-size-adjust: none; background:#FFF; height:100%}

.bg{background:#e5e6e7; }


body{margin:0; padding:0; width:100%; height:100%; font-family: 'futuramedium';  letter-spacing: 0.1em; color:#4d4d4f; font-size: 12px;}


.green{color: #b9d046}
#contactdetail{ font-size: 16px; line-height: 28px; padding:20px}

a{text-decoration: none; color:inherit;}
a:hover{color:#c25390;}
img{outline:none; border:none;}

h1,h2,h3{text-transform: uppercase !important; font-weight: normal !important; font-style: normal !important}
h1,h4,h3,th{font-family: 'bodoni_mtitalic' !important;  font-size: 28px; }
h4,th{font-size: 16px; text-transform: uppercase; font-weight: normal}
form{padding:0; margin:0}

.row{width:100%; display:inline-block; position:relative}
.grey{background-color:#4d4d4f;}

#basket{color:#c25390; text-transform: uppercase; padding:12px; font-size: 11px; height:20px; line-height: 25px; width:200px; position:absolute; top:5px; right:0; text-align: right; display:block; cursor:pointer}
#basket img{float:right}
#header{background: #FFF; position: relative}
#product-window{height:70%; min-height: 460px; position: relative !important}
#shop-window{height:210px; position: relative}
.menu a{text-transform: uppercase; padding-top:8px; color: #CCC}


#shop-window, #product-window{ overflow: hidden; display:block; background: #FFF no-repeat center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover}
	
.product-title{width:78%; padding-left: 272px; text-align: center; position: absolute; top:35%; left:0; font-family: 'bodoni_mtitalic'; font-size: 28px; color:#FFF; text-shadow: 0 0 4px #000;}

.product-title h1{font-size: 44px; font-family: 'futuramedium' !important; margin:0; font-style: normal; color:inherit !important; }	
	
.menu{height:100%; min-height: inherit; display:block; position: relative; top:0; left:0; width:140px; opacity:0.84; padding:0 0 0 20px; color: #999}
.menu h2{margin:0 0 15px 0; font-family: 'bodoni_mtitalic';  font-size: 28px; }
.menu, .menu span{font-family: 'futuramedium'; font-size: 10px; font-style: normal}
.menu a{width:252px; display:block}
.menu a:hover{color: #FFF;}
.menu span{width:252px; height:10px; display: block}


#slide-nav{position:absolute; bottom:20px; left:20px; width:252px; height:20px; display:block; font-size: 13px; }
#slide-nav ul{ list-style: none; margin: 0; padding:0}
#slide-nav li{ display: inline-block; width:20px; height:14px; text-align: center; line-height: 13px; float:left; cursor: pointer}
.hi{color: #FFF}

#footer ul{list-style: none; margin:0; padding:0; width:400px}
#footer img{float:right}
#footer li{float:left; padding:18px 20px 18px 20px; height:11px; font-size: 11px; color:#babcbe; text-transform: uppercase}
#footer li a{color: inherit}
#footer li a:hover{color:#919396}
#copy{margin-bottom: 20px}
#copy span{padding:10px 0 0 20px; color:#babcbe; font-size: 10px;}
#copy, #footer{}


#basket-box{width:295px; position:absolute; top:38px; right:0; display:block; color:#FFF; text-transform: uppercase; font-size: 10px; z-index: 5; overflow: hidden; height:0; padding-top: 10px; background: transparent url('../images/box-arrow.png') no-repeat 200px 0; opacity: 0;}
#basket-box #arr{position:relative; top:-10px; left:220px; width:21px; height:10px}

#basket-box ul{width:265px; list-style: none; margin: 0; padding:0 15px 0 15px; }
#basket-box li{border-bottom:#838486 1px dotted; width:100%; margin:0; padding:15px 0 15px 0;}
#basket-box li:last-child{border:none}
#page img{margin:20px}
#page .imgright{float:right}

.social{list-style: none; width:200px; height:40px; margin:0; padding:0; position:absolute; z-index: 3; right:15px; top:60px; display: block}
.social li{float:right; margin-left:15px; opacity: 0.6}
.social li:hover{opacity:1}


#header {
  -webkit-transition: margin-left 0.1s linear;
  -moz-transition: margin-left 0.1s linear;
  -o-transition: margin-left 0.1s linear;
  transition: margin-left 0.1s linear;
}

#header.open{margin-left:290px}
input[type=submit] {
    -webkit-appearance: none !important;
    border-radius: 0 !important;
}
@media (max-width: 767px) { 
  /* CSS for browsers less than 768px*/
  .product-title{padding:0; width:100%}
  #logo{width:180px; height:auto;}
  #header{position:fixed; top:0; left:0; z-index: 30}
  .colltabs .rangeitem{display: block; width:100% !important; margin:5px 0 5px 0 !important}
  .colbody{ padding-top: 68px}
  .rangetxt{left:0 !important; width:auto !important; display:block !important; margin:20px !important}
  .activeRange {min-height: none !important}
  .activeRange .rangetxt{margin-top: 70px !important; margin-left: 20px !important}
  .activeRange h1{position: absolute; top:10px; left:0}
  .activeRange .rangenav{left:17px !important; bottom: 50px !important}
  .activeRange .rangeshop {display: block}
  #pthumbs{top:auto !important; bottom:30px !important; left:20px !important;  width:100% !important}
  .productwindow{min-height: auto !important; height: auto !important; padding-bottom: 120px !important}
  #cartlarge{margin-left: 0 !important}
  .table{margin:0 10px 20px 10px}
  #footer img{width:100px; height:auto}
 
}