/*
Original design: Expressions (v1.0 - Dec 1st, 2012)
For more information, see http://andreasviklund.com/premium-templates/expressions/
*/

*{margin:0; padding:0;}

/* General styles */
body {background:#393939 url('images/bg.jpg') bottom center fixed no-repeat; -webkit-background-size: 2560px 1024px;color:#222; font:100% "Josefin Sans",Tahoma,sans-serif; line-height:1.4em;}
a {color:#000; text-decoration:none; font-weight:400;}
a:hover {color:#555; text-decoration:none;}
p,ul,ol,dl {font-size:1.1em; margin:0 0 15px 0; line-height:1.2em;}
h1 {color:#222; font-size:3.6em; letter-spacing:-2px; line-height:1em; margin-bottom:20px; font-weight:700; text-transform:uppercase;}
h1 a:hover {text-decoration:none; color:#555;}
h2 {font-size:1.6em; font-weight:400; color:#222; margin:0 0 20px;}
h3 {font-size:1.4em; margin:20px 0 10px 0;}

/* Main layout container */
#layout {margin:60px auto 60px; width:1200px; padding:30px 30px 0; background-color:#fff;}

/* Navigation menu */
nav {margin-bottom:60px;}
nav a {font-size:1.3em; font-weight:400;margin:0 30px 20px 0; color:#000;}
nav a.current, nav a:hover {color:#888 !important;}

/* Footer */
footer {color:#222; line-height:1.3em; font-size:0.9em; font-weight:400; margin-bottom:4px;}
footer a {color:#222; font-weight:400;}

/* Main image styles - 580 x 580 pixels */
#output {background-color:#000; height:580px; width:580px; padding:0; margin:0}
#output img {border:0;margin:3px;padding:0;}

/* Thumbnail gallery */
#thumbs {height:560px; width:580px; overflow:hidden;}

/* Grid classes */
.col {float:left; margin:0 10px; overflow:hidden; float:left; display:inline;}
.col img {max-width:100%;}
.row {width:1200px; margin:20px auto 0; overflow:hidden;}
.c1 {width:80px;}
.c2 {width:180px;}
.c3 {width:280px;}
.c4 {width:380px;}
.c5 {width:480px;}
.c6 {width:580px;}
.c7 {width:680px;}
.c8 {width:780px;}
.c9 {width:880px;}
.c10 {width:980px;}
.c11 {width:1080px;}
.c12 {width:1180px;}


/* Additional classes */
.thumbnails {display:none;}
.gallerynav {padding:10px 0; text-align:right;}
.highlighted a {font-size:1.4em; color:#777;}
.alignleft {text-align:left;}
.alignright {text-align:right;}
.aligncenter {text-align:center;}
.alignjustify {text-align:justify;}
.clear {clear:both;}
.hide {display:none;}

/* Form styles */
.contactform {padding-top:40px;}
.contactform label {clear:left; color:#777; display:block; float:left; width:160px; margin:0 30px 20px 0;}
.contactform input, .contactform textarea {padding:3px 5px; width:350px; border:1px solid #aaa; color:#222; line-height:1.2em; background-color:#f4f4f4; font:90% "Josefin Sans",Tahoma,sans-serif;}
.send {padding:6px 14px 10px; border:0; color:#222; background-color:#eee; font:130% "Josefin Sans",Tahoma,sans-serif;}

/* Gallery page styles */
.gallerypage .thumbs {display:block; width:580px; margin:0; padding:0;}
.gallerypage ul.thumbnails {display:block; margin:0; padding:0;}
.gallerypage ul.thumbnails li {display:block; margin:0 0 30px 30px; padding:0; float:left;}
.gallerypage ul.thumbnails li img {border:3px solid #000;}

#scrollbar1 { width: 600px; margin: 20px 0 10px; }
#scrollbar1 .viewport { width: 580px; height: 580px; overflow: hidden; position: relative; }
#scrollbar1 .overview { list-style: none; position: absolute; left: 0; top: 0; padding: 0; margin: 0; }
#scrollbar1 .scrollbar { background: transparent url(js/images/bg-scrollbar-track-y.png) repeat-y 0 0; position: relative; background-position: 0 0; float: right; width: 15px; display:none;}
#scrollbar1 .track { background: transparent url(js/images/bg-scrollbar-trackend-y.png) no-repeat 0 100%; height: 100%; width:13px; position: relative; padding: 0 1px; }
#scrollbar1 .thumb { background: transparent url(js/images/bg-scrollbar-thumb-y.png) no-repeat 50% 100%; height: 20px; width: 25px; cursor: pointer; overflow: hidden; position: absolute; top: 0; left: -5px; }
#scrollbar1 .thumb .end { background: transparent url(js/images/bg-scrollbar-thumb-y.png) no-repeat 50% 0; overflow: hidden; height: 5px; width: 25px; }
#scrollbar1 .disable { display: none; }
.noSelect { user-select: none; -o-user-select: none; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; }	
.c13 {width:600px;}
.c14 {width:560px;}

/* Single-column layout for mobile devices */
@media only screen and (max-width : 1259px){
p,h2 {font-size:140%;}
#layout{width:600px; margin:0 auto; padding:20px 20px 0 20px;}
.row {width:100%;}
.col {margin:0 0 30px 0;}
.c1, .c2, .c3, .c4, .c5, .c6, .c7, .c8, .c9, .c10, .c11, .c12, .c13, .c14 {width:100%;}
h1 {font-size:5em; margin:0 auto 30px; text-align:center;}
nav {text-align:center; margin-bottom:30px;}
nav a {font-size:1.4em; display:inline-block; line-height:1.8em; padding:5px 15px 8px; margin:0 10px 10px 10px; background-color:#fff; border:1px solid #222;}
nav a.current {border-color:#aaa;}
.gallerynav {text-align:center;}
.contactform {margin-bottom:50px;}
.contactform label {margin-bottom:10px; font-size:1.4em;}
.contactform input, .contactform textarea {width:588px;}
#output {background-color:#000; height:auto; max-width:580px; padding:0; margin:0 auto;}
#output img {border:0;margin:3px;padding:0;width:auto; height:auto;}
#scrollbar1 {width:580px; margin:0 auto;}
#scrollbar1 .thumbnails li {margin:0 15px 30px 15px;}
}