@font-face {font-family:
    'Suhmo OT';
    src:
    url('../fonts/SuhmoWeb-Light.eot');
    src:
    local('Suhmo OT'), local('SuhmoOT'), url('../fonts/SuhmoWeb-Light.woff') format('woff'), url('../fonts/SuhmoOT-Light.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}

html, body {
    padding: 0;
    margin: 0;
    background-color: #454545;
    background-image: url('../images/background.jpg');
    background-attachment: fixed;
    background-position: top center;
    background-repeat: no-repeat;
}

body {
    background-color: #454545;
    background-image: url('../images/background.jpg');
    background-attachment: fixed;
    background-position: top center;
    background-repeat: no-repeat;
    color: #d8d8d8;
    font-family: 'Suhmo OT', 'Courier New', Courier, serif;
    font-size: 0.925em;
    text-align: center;
    line-height: 1.6em
}

#container {
    width: 960px;
    margin: 0 auto 0 auto;
}

#header {
    position: relative;
    height: 128px
}

#logo {
    position: absolute;
    left: 0px;
    top: 32px
}

#strap_line {
    font-style: italic;
    color: #BFAF9B;
    font-size: 1.4em;
    position: absolute;
    right: 64px;
    top: 40px;
    letter-spacing: -0.05em
}

#horizontal_menu {
    position: absolute;
    left: 312px;
    top: 56px;
    width: 663px;
}

#horizontal_menu a {
    display: block;
    float: left;
    color: #d8d8d8;
    margin: 0 26px 0 0;
    font-size: 1.5em;
    letter-spacing: -0.075em;
    font-weight: normal;
}

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

#horizontal_menu span {
    display: none;
    visibility: hidden;
}

#page_content {
    text-align: justify;
    height: 1%;
    font-size: 1.1em
}

#footer {
    font-size: 1em;
    padding: 32px 0 12px 0;
    clear: both;
    width: 100%;
    color: #888
}

#footer a {
    color: #888
}

a:link {
    color: #99d7ff;
    text-decoration: none;
    font-weight: bold
}

a:visited {
    color: #A6A3C5;
    text-decoration: none;
    font-weight: bold
}

a:hover, a:active {
    color: #EEE;
    text-decoration: underline;
    font-weight: bold
}

.spacer {
    clear: both;
    width: 100%;
    height: 1px
}

.print_spacer {
    display: none;
    visibility: hidden;
}

p {
    margin: 0 0 16px 0
}

img {
    border: 0px
}

h1 {
    margin: 32px 0 24px 0;
    color: #d8d8d8;
    font-size: 2.4em;
    letter-spacing: -0.05em;
    font-weight: normal
}

label {
    display: block;
    font-weight: bold;
    font-size: 1em;
    margin: 16px 0 0 0;
    color: #CCC;
}

input, textarea {
    width: 240px;
    color: #6a6a6a;
    font-family: 'Suhmo OT', 'Courier New', Courier, serif;
}

textarea {
    height: 114px;
    font-size: 1em
}

#contact1, #contact2 {
    width: 384px;
    float: left;
}

#contact1 {
    margin: 0 64px 0 64px
}

#contact2 {
    margin: 0 64px 0 0
}

#contact1 input, #contact2 input, #contact1 textarea, #contact2 textarea {
    width: 98%
}

.buttonbar {
    clear: both;
    background: #6A6A6A;
    padding: 8px;
    margin: 0 auto 64px auto;
    position: relative;
    top: 32px;
    width: 816px
}

button {
    color: #454545;
    font-family: 'Suhmo OT', 'Courier New', Courier, serif;
    font-weight: bold;
    cursor: pointer;
    font-weight: bold;
    font-size: 1em
}

button:hover {
    color: #777
}

.success {
    background: #BFFF8F;
    font-weight: bold;
    padding: 8px;
    color: #2F3F23
}

.problem {
    background: #FF6A5F;
    font-weight: bold;
    padding: 8px;
    color: #3F2D2B
}

img.float_left {
    float: left;
    margin: 8px 28px 8px 0px
}

img.float_right {
    float: right;
    margin: 8px 0px 8px 28px
}

#fader, .fader {
    width: 960px;
    height: 600px;
}

#fader {
    background: #000
}

#viewer {
    width: 960px;
    height: 532px;
    background-color: #545454;
    text-align: center;
    overflow: hidden;
    background-image: url('../images/loader.gif');
    background-position: center center;
    background-repeat: no-repeat;
    position: relative
}

#thumbs {
    width: 100%;
    margin: 28px 12px 8px 0;
    text-align: center;
}

#thumbs a {
    display: block;
    background-image: url('../images/loader.gif');
    background-position: center center;
    background-repeat: no-repeat;
    width: 184px;
    height: 100px;
    float: left;
    margin: 8px;
    padding: 0px;
    border: 0px;
    overflow: hidden
}

#thumbs a img {
    width: 200px
}

#thumbs a:hover {
    padding: 0px;
    border: 0px solid #AAA
}

#regular_content {
    margin: 0 0 0 0;
    clear: both
}

span#loading {
    color: #888;
    font-weight: bold;
    font-size: 2.8em;
    position: relative;
    top: -18px;
    left: 16px
}

.pager_bar {
    clear: both;
    text-align: right;
    height: 40px;
    margin: 8px auto 0 auto;
    width: 960px;
    background: #454545;
}

.pager_bar span {
    display: none
}

#thumbs .pager_bar a {
    width: 16px;
    height: 24px;
    background: #454545;
    display: block;
    text-align: center;
    color: #FFF
}

#thumbs .pager_bar a.selected {
    background: #5E5E5E;
    text-decoration: underline
}

#thumbs .pager_bar strong {
    float: left;
    margin: 6px 8px 0 12px;
    color: #888
}

.preload, #print_logo {
    display: none;
    visibility: hidden;
}

ul#contact_footer {
    clear: both;
    list-style-type: none;
    padding: 0 0 0 0px;
    margin: 0 auto 0 auto;
    font-size: 1.7em;
    letter-spacing: -0.05em;
    position: relative;
    left: 22px;
	width: 760px
}

ul#contact_footer li {
    float: left;
    margin: 0 32px 0 0;
    padding: 0px
}

ul#contact_footer li img {
    margin: 0 8px 0 0;
    position: relative;
    top: 5px
}

ul#contact_footer li a, ul#contact_footer li a:hover, ul#contact_page li a, ul#contact_page li a:hover {
    color: #D8D8D8;
    text-decoration: none
}

ul#contact_footer li a:hover, ul#contact_page li a:hover {
    color: #FFF
}

ul#contact_page {
    list-style-type: none;
    padding: 0 0 0 32px;
    margin: 16px auto 16px auto;
    font-weight: bold;
    font-size: 1.5em;
    letter-spacing: -0.05em;
}

ul#contact_page li {
    margin: 0 0 19px 0;
    padding: 0px
}

ul#contact_page li img {
    margin: 0 8px 0 0;
    position: relative;
    top: 5px
}

.viewer_arrow span {
    display: none;
    visibility: hidden
}

a.viewer_arrow {
    display: block;
    width: 42px;
    height: 129px;
    background-image: url('../images/viewer_arrows.png');
    background-repeat: no-repeat;
    background-position: top left;
}

a.viewer_arrow:hover {
    background-image: url('../images/viewer_arrows_hover.png');
    background-repeat: no-repeat;
    background-position: top left;
}

a.prev {
    position: absolute;
    top: 200px;
    left: 34px
}

a.next {
    position: absolute;
    top: 200px;
    right: 34px;
    background-position: top right;
}

a.next:hover {
    background-position: top right;
}

table {
    background-color: #717171
}

th, td {
    border-bottom: 1px solid #5F5F5F;
    padding: 8px;
    text-align: left
}

th {
    background-color: #5F5F5F;
    border-bottom: 1px solid #545454;
    color: #FFF;
    font-weight: bold
}

p.quote {
    background-image: url('../images/quotes.gif');
    background-position: 0px 6px;
    background-repeat: no-repeat;
    padding: 0 0 24px 72px;
    font-size: 1.25em;
    margin: 32px 16px 32px 16px;
    line-height: 1.7em;
    color: #e9e9e9;
    letter-spacing: -0.01em;
    clear: both;
    border-bottom: 1px dotted #6f6f6f;
}

p.quote span {
    font-style: normal;
    color: #FFF;
    display: block;
    font-size: 0.8em;
    margin: 8px 0 0 16px
}

h2 {
    font-weight: normal;
    font-size: 1.6em;
    margin: 32px 0 24px 0
}

.viewer_loader {
    margin-top: 220px
}

#viewer a {
    color: #545454;
    font-size: 1.2em
}

#footer div {
    width: 33%;
    float: left
}

#footer_1 {
    text-align: left;
}

#footer_3 {
    text-align: right;
}

#extra_footer {
    margin: 32px 0 32px 0;
    color: #888
}

.form-allowed-tags {
    display: none
}
#gallery div.g_img, #client_photos div.g_img{
      display:block;
	float:left;
    margin:0 10px 0 0;	
position:relative;
	height:257px;
	width:309px
}
.client_photo, .enter_gallery, .img_box, .client_area, .img_box_sm{
	display:block;
	width:309px;
	height:205px;
	text-align:center;
	background-color: #545454
}

#gallery a, #client_photos a{
        display:block;
	overflow:hidden;
        height:200px;
        width:309px;
	color:#d8d8d8
}
#gallery a{
	text-decoration:none
}

#gallery a span, #client_photos .g_img span{
	display:block;
	width:22px;
	height:26px;
    background:url(../images/lock.gif) bottom left no-repeat;
	position:absolute;
	bottom:60px;
	left:10px;
	z-index:10
}
#client_photos h1, #checkout h1{
	font-size:1.3em
}
#client_photos h2, #checkout h2{
	font-size:2.2em;
	margin-top:-5px
}
#client_photos .g_img span{
	background:none;
	bottom:15px;
	left:40px;
	width:200px;
	text-align:left;
	font-size:1em;
	padding-left:50px;
	padding-top:2px;
	background:url(../images/basket_plus.gif) top left no-repeat

}
#gallery p{
  	padding-top:15px
}
.gallerymore_box, .photosmore_box{
	display:block;
	height:30px;
	width:320px;
	position:relative;
	top:30px;
	margin:0 auto 65px auto;
	clear:both;
	font-size:1.4em;
	padding:15px 0 10px 0;
	background-color:#504f4f;
	opacity:0.7;
	-moz-box-shadow: 5px 5px 5px #333;
  	-webkit-box-shadow: 5px 5px 5px #333;
 	box-shadow: 5px 5px 5px #333

}
.gallerymore_box:hover, .photosmore_box:hover{
    margin:0 auto 65px auto;
	top:32px;
	left:2px;
	-moz-box-shadow:none;
  	-webkit-box-shadow: none;
 	box-shadow: none;
}
.photosmore_box img, .gallerymore_box img{
	display:block;
	margin:0 auto 0 auto;
}
#client_photos .photosmore_box a, #gallery .gallerymore_box a{
	height:30px;
	text-align:center;
	width:240px;
	text-decoration:none;
	margin:0 auto 0 auto
}

#client_photos .photosmore_box:hover, #gallery .gallerymore_box:hover{
opacity:1

}
#overlay{
	display:none;
	/*width:770px;*/
	width:100%;
	height:100%;
	margin:0 auto 0 auto;
	position:fixed;
}
#pass_form{
	padding:0 30px 60px 30px;
	display:none;
	width:662px;
	background-color:#6e6e6e;
	position:fixed;
	z-index:110;
    top:224px;
     margin-left:120px;
	opacity:1;
	-moz-box-shadow: 5px 5px 5px #333;
  	-webkit-box-shadow: 5px 5px 5px #333;
 	box-shadow: 5px 5px 5px #333;

}
#client_gallery #pass_form{
	top:160px;
	width:850px;
	margin-left:2px
}
#pass_form .img_box{
float:left;
margin-right:25px
}
#pass_form form{
	float:left;
	width:262px;
	text-align:left
}
#pass_form h1{
	text-align:left;
	padding:7px 0 3px 40px;
	background:url(../images/lock_lrg.gif) 0 0 no-repeat;
	font-size:2.3em
}
#pass_form h1.print{
	margin-left:170px;
	padding:3px 0 3px 55px;
	background:url(../images/basket_plus.gif) 0 0 no-repeat;
	font-size:2.2em
}
#pass_form h2{
	font-size:2em;
	margin:0;
	line-height:1em
}
#pass_form form input{
	width:208px;
	float:left
}
#pass_form label{
	font-size:1.1em
}
#pass_form #pass_submit{
	width:40px;
	height:30px;
	margin:-2px 0 0 8px;
	float:right
}
#pass_form #loader{
	margin:120px 0 0 290px
}
#login_error, #prints_error{
	line-height:1.3em;
	display:block;
	margin-top:20px
}
#pass_form #print_options_frm {
	width:280px;
	float:right
}
#pass_form #print_options_frm small {
	float:left;
	display:block;
	margin:0 0 0 7px;
	opacity:0.7
}
#pass_form #print_options_frm input{
	float:right;
	width:20px;
	height:20px;
	margin:0 4px 10px 5px;
	text-align:center
}

#pass_form #print_options_frm label{
	float:left;
	margin-top:0;
	height:36px
}
#pass_form #print_options_frm #add_to_basket{
	float:right;
	margin:-1px 0 0 10px;
	height:29px;
	width:40px
}
#client_photos .g_img small{
	font-size:0.8em
}	
#pass_form #pass{
	width:200px;
}

#basket{
	position:fixed;
	bottom:50px;
	z-index:100;
	height:55px;
	background-color:#6e6e6e;
	margin-left:20px;
	-moz-box-shadow: 5px 5px 5px #333;
  	-webkit-box-shadow: 5px 5px 5px #333;
 	box-shadow: 5px 5px 5px #333;
}
#page_basket{
display:none;
clear:both;
height:55px;
width:555px;
background-color:#6e6e6e;
-moz-box-shadow: 5px 5px 5px #333;
  	-webkit-box-shadow: 5px 5px 5px #333;
 	box-shadow: 5px 5px 5px #333;
margin-left:20px;
}
#basket h2, #page_basket h2{
    float:left;
	display:block;
	width:224px;
	height:40px;
	padding:30px 0 0 120px;
	background:url(../images/basket.gif) 45px 20px no-repeat
}

#basket input, #page_basket input{
	width:113px;
	height:25px;
	float:left;
	margin:45px 0 0 20px;
}

#basket input + span, #page_basket input + span{
	display:block;
	float:right;
	font-size:1.1em;
	margin:50px 20px 0 0;
}
#basket input + span small, #page_basket input + span small{
	font-size:0.9em;
	opacity:0.4
}
#basket a, #page_basket a{
display:block;
height:20px;
float:right;
margin:43px 5px 0 0;
text-decoration:none;
}

#checkout .item{
	height:115px;
	margin-bottom:30px
}

#checkout .item .img_box, #checkout .item span, #checkout .item p, #checkout .item div{
	float:left;
	margin-right:30px;
	padding-top:5px;
	font-size:1.8em
}
#checkout .item .img_box{
width:173px;
height:115px;
padding:0;
opacity:1
}
#checkout .item span{
	opacity:0.5
}
#checkout .item img{
	padding:0;
}
#checkout .item div{
	float:right;
	margin-right:0;
	opacity:0.7
}
#basket_qty{
width:40px
}
#sub_total{
	background-color:#5b5b5b;
	padding:19px 10px 0 0;
	height:37px;
	text-align:right;
	font-size:1.8em;
	margin-bottom:20px;
position:relative;

}
#sub_total span{
font-size:0.5em;
float:left;
margin-left:20px;

}
#sub_total small{
	opacity:0.5;
	font-size:0.8em;
}
#sub_total input{
	width:148px;
	position:absolute;
    top:17px;
	right:210px;
}
#paypal{
	margin:10px 0 20px 0;
}

.basket_contents{
    overflow:hidden;
	height:175px;
	width:390px;

}
.basket_item{
    background-color:#616161;
	height:80px;
	width:370px;
	padding:5px 0 5px 20px;    
	position:relative
}
.basket_item .img_box_sm, .basket_item span, .basket_item div{
	display:block;
	float:left
}
.basket_item .img_box_sm{
width:98px;
height:65px;
}
.basket_item span{
	display:block;
	max-width:120px;
	margin-left:15px;
	opacity: 0.5;
	font-size:1.2em;
text-align:left;
line-height:1.1em;

}
.basket_item a{
max-width:13px;
}
.basket_item span small{
	opacity: 1;
	font-size:0.9em
}
.basket_item div{
	float:right;
	margin-right:30px;
	opacity:0.5;
    position:absolute;
    bottom:20px;
	right:0;
	font-size:1.5em
}
#basket #basket_up, #basket #basket_down{
	background:url(../images/up.gif) top center no-repeat;
	width:20px;
margin:0;   
 height:20px;
	display:block;
	position:absolute;
	top:60px;
	left:185px;
}
#basket #basket_down{
	background:url(../images/down.gif) top center no-repeat;
    top:270px;
	left:185px;
}	

#basket .close, #pass_form .close{
	display:block;
	float:right;
	margin:15px -15px 0 0;
	font-weight:bold;
	cursor:pointer;
font-size:2em
}

.small_basket{
	width:555px;
	height:50px;
	padding-top:15px;
}
#basket .small_basket h2, #page_basket .small_basket h2{
    padding:10px 0 0 90px;
	background:url(../images/basket.gif) 20px 0 no-repeat
}

#basket .small_basket input, #page_basket .small_basket input{
    margin:5px 0 0 0;
}

#basket .small_basket input + span, #page_basket .small_basket input + span {
  margin:5px 20px 0 0;
}
#basket .small_basket p, #page_basket .small_basket p{
	margin-left:20px;
}

.nextprev{
	display:block;
	width:30px;
	height:35px;
	float:left;
	position:absolute;
	top:170px;
	left:3px;
	cursor:pointer;
	background:url(../images/left.gif) 0 0 no-repeat;
	z-index:2000;
}
.nextphoto{
	left:889px;
	background:url(../images/right.gif) 0 0 no-repeat;
}

.nextprev:hover{
	opacity:0.7
}

/*MEDIA QUERIES*/
@media screen and (max-device-width: 970px) and (max-width: 970px){
	#basket{
		display:none;
	}
	#page_basket{
		display:block;
	}
	#pass_form, #client_gallery #pass_form{
		width:80%;
		top:10%;
		left:5%;
		max-height: 600px;
	}
	#client_area #pass_form{
		max-width:450px;
	}
	#client_area #pass_form #login_form, #client_area #pass_form .img_box{
		display:block;
		width:309px;
		float:none;
		margin:20px auto 0 auto
	}
	#pass_form img{
		max-height:600px;
	}
	#pass_form .img_box{
		float:none
	}
	#client_area #pass_form h1{
		max-width:350px;
		line-height:1.1em;
		background:url(../images/lock_lrg.gif) 0 10px no-repeat;
	}
	
	#pass_form #print_options_frm {
		float:none;
		margin:20px auto 0 auto
	}

	#login_form #pass{
		width:200px
	}
	.nextphoto{
		left:97%;
		background:url(../images/right.gif) 0 0 no-repeat;
	}

}
@media screen and (max-device-height: 768px), screen and (max-height: 768px){
	#pass_form img{
		max-height:300px;
	}

}
/*MEDIA QUERIES*/