* { margin: 0; padding: 0; }

body { background-color: #000; color:#ccc; font: .8em "ABeeZee", Tahoma, helvetica, sans-serif; line-height: 1.4em; }

a {color:#ededed; text-decoration:none; font-weight:400;}
a:hover {text-decoration:underline;}
p,ul,ol,dl {margin:0 0 15px 0; line-height:1.6em;}
h1 { color: #888; font-size: 3em; text-shadow: 1px 0 0 #eee; }
h1 a { text-transform: none; font-weight: 400; }
h1 a:hover {text-decoration:none; color:#eee;}
h2 {font-size:2.2em; color:#333; margin:0 0 10px;}
h3 {font-size:1.6em; margin:0 0 10px 0;}
h4 { font-size: 1.2em; margin: 0 0 8px 0; }
h1,h2,h3,h4 {font-family: 'ABeeZee', sans-serif; color: #ececec; font-weight:400; line-height:1.4em;}

#layout { margin: 10px auto 0; width: 960px; }
body.wider #layout { margin: 10px auto 0; width: 1200px; }

/* Grid classes, fixed width, 960px with 12 columns */
.col {float:left; margin:0 10px; overflow:hidden; float:left; display:inline;}
.col img {max-width:100%;}
.row {width:960px; margin:20px auto 0; overflow:hidden;}
.row .row {margin:0 -10px; width:auto;	display:inline-block;}
.c1 {width:60px;}
.c2 {width:140px;}
.c3 {width:220px;}
.c4 {width:300px;}
.c5 {width:380px;}
.c6 {width:460px;}
.c7 {width:540px;}
.c8 {width:620px;}
.c9 {width:700px;}
.c10 {width:780px;}
.c11 {width:860px;}
.c12 {width:940px;}

body.wider .row {width:1200px;}
body.wider .c1 {width:80px;}
body.wider .c2 {width:180px;}
body.wider .c3 {width:280px;}
body.wider .c4 {width:380px;}
body.wider .c5 {width:480px;}
body.wider .c6 {width:580px;}
body.wider .c7 {width:680px;}
body.wider .c8 {width:780px;}
body.wider .c9 {width:880px;}
body.wider .c10 {width:980px;}
body.wider .c11 {width:1080px;}
body.wider .c12 {width:1180px;}

ul.menu {list-style:none; margin:0; padding:10px 0; border-top:1px solid #333;}
ul.menu li {list-style:none; text-align:center; font-size:1.2em; margin:0 0 10px; padding:0 0 8px 0; color:#888; border-bottom:1px solid #333;}
ul.menu li a {font-size:1.2em; font-weight:400;}
ul.menu li a:hover {color:#eee; text-decoration:none;}

.slogan {color:#bbb; font-size:1.2em;}
.alignleft {text-align:left;}
.alignright {text-align:right;}
.aligncenter {text-align:center;}
.alignjustify {text-align:justify;}
.nomargin {margin:0; padding:0;}
.separator {height:100px; margin:0; padding:0; background: #0a0a0a url(images/insidebg2.jpg) bottom center no-repeat; border-bottom:1px dotted #1a1a1a;}
.larger {font-size:1.2em;}
.smaller {font-size:0.9em;}
.spacer {margin:0 20px;}
.clear {clear:both;}
.hide {display:none;}
.border {border:1px solid red;}
body .navmenu a { font-size: 1.4em; }

/* Light styles, apply by using class="light" on the body HTML element */
body.light {background:#fff color:#777;}
body.light a {color: #ededed;}
body.light a:hover {color:#555;}
body.light h1 {color:#888; font-size:4.6em; margin-bottom:0;}
body.light h1 a:hover {color:#303030;}
body.light h2 {color:#555;}
body.light h1, body.light h2, body.light h3 {color:#ececec;}
body.light ul.menu {border-top:1px solid #ddd;}
body.light ul.menu li {border-bottom:1px solid #ddd;}
body.light ul.menu li a:hover {color:#333;}
body.light .separator {background: #f5f5f5 url(images/insidebg2-light.jpg) bottom center no-repeat; border-bottom:1px dotted #ccc;}
body.light .slogan {color:#888;}
body.light #footer {background:#f5f5f5 url(images/insidebg-light.jpg) top center no-repeat;}
body.light #footer .col {color:#555; border-top:1px dotted #ccc;}
body.light #footer a {color:#555; border-bottom:1px dotted #ddd;}
body.light #footer a:hover {color:#444; border-bottom:1px dotted #eee;}
body.light .navmenu a {font-size:1.4em;}

/* Alternate colors, apply by adding class="blue" (or any of the other available colors) to the body HTML element */
body.blue a {color:#3288a8;}
body.blue h1, body.blue h2, body.blue h3 {color:#3288a8;}
body.grey a {color:#666;}
body.grey h1, body.grey h2, body.grey h3 {color:#666;}

.navmenu a { font-size: 1.2em; margin: 0 15px; }

img { border-radius: 6px; }
div.thumbnails img { width: 160px; margin: 0 10px 10px 0; }
div.thumbnails img.last { margin-right: 0; }
img.highslide-image { border: 0 !important; opacity: 1; }

.highslide.highslide-active-anchor img { visibility: visible; opacity: .3; }

@media only screen and (max-width : 960px){
  #layout, body.wider #layout {width:auto; margin:0; padding:20px;}
  .row {width:100%;}
  .col {margin:0 0 20px 0;}
  .c1, .c2, .c3, .c4, .c5, .c6, .c7, .c8, .c9, .c10, .c11, .c12 {width:100%;}
  h1 {margin:0 auto 5px; line-height:1.4em;}
  body .navmenu {margin:0px 0 -15px;}
  body .navmenu a {font-size:1.4em; display:inline-block; line-height:2.0em;padding:7px 12px; margin:0 10px 8px 0; background-color:#111; border:1px solid #222; border-radius: 10px;}
  body.light .navmenu a {font-size:1.4em; display:inline-block; line-height:2.0em;padding:7px 12px; margin:0 10px 8px 0; background-color:#fff; border:1px solid #eee; border-radius:10px;}
  body .navmenu a.current {border-color:#444;}
  body.light .navmenu a.current {border-color:#ddd;}
  .headerimage img {width:100%; height:auto;}
  div.thumbnails img {width:24%; margin:0;}
  div.thumbnails img.last {margin-right:0;}
}

.panel { position: absolute; width: 150px; min-height: 100%; max-height: none; right: 0; top: 0; z-index: 10; background-color: #000; background-origin: padding-box; background-clip: border-box; }
.panel-inner { padding: 10em 1em 1em 1em; }
.tiny { font-size: .8em; }

@media ( max-width: 600px ) {
  .panel { display: none; }
  h1 { font-size: 2em; }
}
