/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : May 10, 2016, 11:14:17 AM
    Author     : Innovate
*/

/*------------------------------------------------------------*
**  Global
**------------------------------------------------------------*/

@font-face {
		font-family: SangBleu;
		src: url('../fonts/SangBleuBP-Light.otf'); 
		}
@font-face {
		font-family: SangSans;
		src: url('../fonts/SangBleuBPSans-Light.otf'); 
		}
@font-face {
		font-family: SangSansIt;
		src: url('../fonts/SangBleuBPSans-LightItalic.otf'); 
		}

/*------------------------------------------------------------*
**  Global
**------------------------------------------------------------*/
body {
   display: block;
   margin: 8px;
}

div, article {
   display: block;
   /*for dev*/
/*   border: 1px solid #000; */
   /*for dev*/
}

p {
    display: block;
    -webkit-margin-before: 1em;
    -webkit-margin-after: 1em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
}

h1 { 
   display: block;
   font-size: 2em;
   -webkit-margin-before: 0.67em;
   -webkit-margin-after: 0.67em;
   -webkit-margin-start: 0px;
   -webkit-margin-end: 0px;
   font-weight: bold;
}

h2 {
    display: block;
    font-size: 1.5em;
    -webkit-margin-before: 0.83em;
    -webkit-margin-after: 0.83em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    font-weight: bold;
}

h3 {
    display: block;
    font-size: 1.17em;
    -webkit-margin-before: 1em;
    -webkit-margin-after: 1em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    font-weight: bold;
}

h4 {
    display: block;
    -webkit-margin-before: 1.33em;
    -webkit-margin-after: 1.33em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    font-weight: bold;
}

ol {
    display: block;
    list-style-type: decimal;
    -webkit-margin-before: 1em;
    -webkit-margin-after: 1em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    -webkit-padding-start: 40px;
}

li {
    display: list-item;
    text-align: -webkit-match-parent;
    list-style: decimal; /* Remove to remove list */
}

table {
    display: table;
    border-collapse: separate;
    border-spacing: 2px;
    border-color: grey;
}

.nav {
   text-align: center;
}

.nav ul li {
   list-style-type: none;
   display: inline;
   margin: 0 10px 2px 10px;
}

a:link, a:visited, a:active {
   cursor: pointer;
   text-decoration: none;
   color: #000;
}

ul {
   margin: 0;
   padding: 0;
   list-style: none;
}

#footnav.nav ul {
   
}      

#secret {
   color: #ffffff;
}

/*------------------------------------------------------------*
**  PAGE CONTAINER
**------------------------------------------------------------*/

.container {
   margin: 0 auto;
   width: 850px; /*maybe make this scalable?*/
   padding: 0 5px;
   
}

/*------------------------------------------------------------*
**  HEADER
**------------------------------------------------------------*/

.header, .classes, .classinfo {
   margin: 2px auto 10px auto;
/*   border-bottom: .5px solid #000;*/
   padding-bottom: 0px;
   width: 850px;
   font-family: SangBleu, arial;
   text-align: center;
}

tr.classes {
   font-weight: bold;
}

tr.classes td {
   width: 283px;
}

tr.classes td div {
   margin: auto;
   border-bottom: 2px solid #000;
   width: 50%;
   height: 25%;
}

tr.classes td div h4 {
   margin: 1.33em 0 .33em 0;
}

.classinfo td {
   width: 283px;
}

.logo {
   font-family: SangBleu, arial;
   color: #000;
   text-transform: uppercase;
   letter-spacing: .2em;
   text-align: center;
   position: relative;
   top: 30px;
   margin: auto auto 40px auto;
   margin-left: auto;
   margin-right: auto;
}

.logo a:link, .logo a:visited, .logo a:hover, .logo a:active {
   cursor: pointer;
   color: #000;
}

#mainnav.nav ul {
   margin: 20px;
   border-bottom: 1px solid #000;
   padding: 10px;
}

#mainnav ul li {
   padding: 0 10px 2px 10px;
}

#mainnav li a {
/*   text-transform:lowercase;*/
   text-decoration: none;
   color: #000;
}

select, input[type="color"][list] {
    background-color: rgb(248, 248, 248);
    border-image-source: initial;
    border-image-slice: initial;
    border-image-width: initial;
    border-image-outset: initial;
    border-image-repeat: initial;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(166, 166, 166);
}

select:not(:-internal-list-box) {
    overflow: visible !important;
}

select {
    -webkit-appearance: menulist;
    box-sizing: border-box;
    align-items: center;
    border-image-source: initial;
    border-image-slice: initial;
    border-image-width: initial;
    border-image-outset: initial;
    border-image-repeat: initial;
    white-space: pre;
    -webkit-rtl-ordering: logical;
    color: black;
    background-color: white;
    cursor: default;
    border-width: 1px;
    border-style: solid;
    border-color: initial;
}

keygen, select {
    border-radius: 5px;
}

input, textarea, keygen, select, button {
    text-rendering: auto;
    color: initial;
    letter-spacing: normal;
    word-spacing: normal;
    text-transform: none;
    text-indent: 0px;
    text-shadow: none;
    display: inline-block;
    text-align: start;
    margin: 0em 0em 0em 0em;
    font: 11px BlinkMacSystemFont;
}

input, textarea, keygen, select, button, meter, progress {
    -webkit-writing-mode: horizontal-tb;
}

/*------------------------------------------------------------*
**  CONTENT
**------------------------------------------------------------*/
#content {
   margin: 10px auto 50px auto;
/*   font-family: SangBleu, arial;*/
   font-family: Veranda;
   text-align: center;
}

ol p {
   margin: auto auto auto -13px;
}

/*------------------------------------------------------------*
**  SIDEBAR
**------------------------------------------------------------*/
#sidebar {
   margin-top: 1.45em; /*hack fix*/
}

div#sidebar {
   padding: 10px;
   float: left;
   width: 200px;
}

#sidebar div img, article img {
   border: 1px solid #000000;
   border-radius: 10px;
   box-shadow: 0 3px 3px 0;
}


div#maincontent {
   padding: 10px;
   text-align: justify;
/*   width: auto;*/
   overflow-x: hidden;
   min-height: 633px;
   min-width: 604px;
}

article {
   min-height: 348.56px;
}

/*------------------------------------------------------------*
**  FOOTER
**------------------------------------------------------------*/

#footer {
   text-align: center;
   font-family: SangBleu, arial;
}

/*------------------------------------------------------------*
**  Different browser widths
**------------------------------------------------------------*/

@media only screen and (max-width: 5000px) {

   .nav select { display: none; }
}


@media only screen and (max-width: 625px) {
   .nav select { display: inline-block; } /*make this prettier*/
   .nav ul { display: none;}
}






/*------------------------------------------------------------*
**  GALLERY PAGE
**------------------------------------------------------------*/

#wrapper {
    width: 850px;
    overflow: hidden;
    margin: 64px auto 0;
    background: #FFFFFF;
}

#right {
   display: table;
   margin: 0 auto;
   width: 850px;
/*   height: (make appropriate;)*/
}

#right ul.thumbnails {
   overflow: hidden;
   padding: 10px 32px;
/*   margin: auto 50px;*/
}

#right ul.thumbnails li {
   
   list-style: none;
   display: inline;
/*   margin: auto;*/
}

ul.thumbnails li a img {
/*   margin: 9px 10.5px; trying 2/3*/
   margin: 6px 7px; 
   border: 4px double;
}

/*BLINDLY ADDED*/
/*BLINDLY ADDED*/

#right .navigation {
	margin: -10px auto 0;
	overflow: hidden;
	width: 50px;
}
#right .navigation a {
	background:url("../images/sprite.png") no-repeat scroll 0 0 transparent;
	display:block;
	float:left;
	height:21px;
	text-indent:-999999px;
	width:21px;
}
#right .navigation .prev {
	background-position: -159px -75px;
	margin: 0 8px 0 0;
}
#right .navigation .next {
	background-position: -186px -75px;
}
/* Slideshow Gallery Content*/
#gallery-holder {
	position: relative;
	width: 719px;
	margin:20px auto 0;
	height: 442px;
}
#gallery-holder .slideshow-frame {
	background:url("../images/slideshow-frame.png") no-repeat scroll 0 0 transparent;
	height:442px;
	position:absolute;
	top:0;
	left: 0;
	width:719px;
	z-index: 10;
}
#gallery-holder .slideshow li {
	height:442px;
	position:absolute;
	top:0;
	width:719px
}
#gallery-holder .navigation a {
	height:92px;
	left:0;
	margin-top:-44px;
	position:absolute;
	top:50%;
	width:47px;
	z-index:15;
}
#gallery-holder .navigation a.prev {
	background-position:-6px -103px;
	margin-top:-44px;
}
#gallery-holder .navigation a.next {
	background-position:-65px -103px;
	left:auto;
	right:0;
}
#modules-holder {
	overflow: hidden;
	margin-top: 24px;
	margin-left: 20px;
}
#modules-holder .module {
	float: left;
	width: 204px;
	margin-right: 40px;
}
#modules-holder .module h2 {
	font-family:'Museo700';
	font-size:18px;
	font-weight:normal;
	margin-bottom:5px;
	padding-left:25px;
}
#modules-holder .module h2.module-one {
	background:url("../images/sprite.png") no-repeat scroll -128px -170px transparent;
}
#modules-holder .module h2.module-two {
	background:url("../images/sprite.png") no-repeat scroll -128px -140px transparent;
}
#modules-holder .module h2.module-three {
	background:url("../images/sprite.png") no-repeat scroll -128px -110px transparent;
}
#modules-holder .module p {
	color: #6a6a6a;
	line-height: 15px;
}

#wrapper-bottom {
/*    background: url("../images/content-bottom2.jpg") no-repeat scroll center top #FFFFFF;*/
/*    height: 61px;
   width: 994px;*/
   max-width: 850px;
/*    min-height: 52px; original min height*/
   min-height: 13px; 
   clear: both;
}

/*------------------------------------------------------------*
**  CONTENT AKA WRAPPER
**------------------------------------------------------------*/


/*------------------------------------------------------------*
**  PHILOSOPHY
**------------------------------------------------------------*/