@charset "utf-8";
/* CSS Document */

/*- Copyright 2010 Kakeli Designs -*/

/***********************
************************
- CSS RESET - 
************************
***********************/


html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
}
body {
	line-height: 1;
}

ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/*********************** 
************************
- SITE STYLE - 
************************
***********************/


* {
margin: 0;}

html, body {
height: 100%;
background-image:url(images/site-bg.jpg);
margin-bottom: 1px;
position:relative;
}

.wrapper {
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -0em;
background-image:url(../images/sitebg.png);
background-repeat:repeat-y;
background-position:center;}

.header{
height:2px;
width:100%;
background-color:#8d0d1a;}

#navigation{
height: 35px;
width: 960px;
margin: 0 auto;
background-color:#000;}

.footer{
height:2px;
width:100%;
background-color:#8d0d1a;
position:relative;
bottom:0;}

.push {
height: 0em;
clear:both;}

.intro-home{
height:250px;
width:960px;
float:left;}

.latest{
width:410px;
height:250px;
float:left;
margin-left:20px;
z-index:45;
margin-bottom:15px;}

.latest-text{
height:25px;
width:100%;
color:#000;
z-index:50;}

.center{
width:960px;
height:100%;
margin:0 auto;}

.content{
padding-top:20px;
height:100%;
position:relative;}

.logo{
height:125px;
width:125px;
float:left;}

.nav{
width:835px;
height: 125px;
position:relative;
z-index:20;
float:left;}

.nav-bump{
z-index:40;
height:125px;
float:right;}

.photo{
width:960px;
height:340px;
float:left;
padding:20px 0px 20px 0px;
margin: 0 auto;
}

.photo-about{
width:960px;
height:125px;
float:left;
padding:20px 0px 20px 0px;
background-image:url(images/rotate/2about.jpg);
background-repeat:no-repeat;
margin: 0 auto;
}

.photo-shadow{
-webkit-box-shadow: 0px 0px 5px  #9e9e9e;
-moz-box-shadow: 0px 0px 5px #9e9e9e;
box-shadow: 0px 0px 5px #9e9e9e; }

.title{
height:auto;
width:100%;
float:left;
margin-top:30px;
background-color:#CCCCCC;
border-bottom: 1ps solid black;}

.title h1{
font-family: Arial Black;
color: #444;
text-align: left;
font-size: 1.0em;
padding: 5px 0px 5px 5px;}

#modal{
width:960px;
float:left;
height:100%;
margin-top:20px;}
	
.modal-box{
width:125px;
height:125px;
background-color:white;
border-top:1px solid #5e0000;
border-bottom:1px solid #5e0000;
float:left;
margin-right:20px;
margin-top:10px;
padding: 10px 0px 10px 0px;
height:100%;
cursor:pointer;}
	
.black-line{
border:1px solid black;
}

/*****************
*****************
SLIDER CODE
*****************
*****************/

#s3slider {
   width: 960px; /* important to be same as image width */
   height: 340px; /* important to be same as image height */
   position: relative; /* important */
   overflow: hidden; /* important */
   background-image:url(../images/photo-bg.jpg);
}

#s3sliderContent {
   width: 960px; /* important to be same as image width or wider */
   position: absolute; /* important */
   top: 0; /* important */
   margin-left: 0; /* important */
}

.s3sliderImage {
   float: left; /* important */
   position: relative; /* important */
   display: none; /* important */
}

.s3sliderImage span {
   position: absolute; /* important */
   left: 0;
   font: 10px/15px Arial, Helvetica, sans-serif;
   padding: 10px 13px;
   width: 960px;
   background-color: #161616;
   filter: alpha(opacity=70); /* here you can set the opacity of box with text */
   -moz-opacity: 0.7; /* here you can set the opacity of box with text */
   -khtml-opacity: 0.7; /* here you can set the opacity of box with text */
   opacity: 0.7; /* here you can set the opacity of box with text */
   color: #fff;
   display: none; /* important */
   bottom: 0;

   /*
       if you put
       top: 0; -> the box with text will be shown at the top of the image
       if you put
       bottom: 0; -> the box with text will be shown at the bottom of the image
   */
}

.clear {
   clear: both;
} 

/*******
menu
********/

ul {
font-family: Arial, Verdana;
font-size: 14px;
margin: 0;
padding: 0;
list-style: none;
float:right;}

ul li {
display: block;
position: inherit;
float: left;}

li ul { display: none; }

ul li a {
display: block;
text-decoration: none;
color: #CCC;
padding: 10px 30px 10px 30px;
background: black;
margin-left: 0px;
white-space: nowrap;
}

ul li a:hover { background: #333; color:#FFF;}

li:hover ul {
display: block;
position: absolute;
}

li:hover li {
float: none;
font-size: 11px;
}

li:hover a { background: #CCC; -webkit-border-top-left-radius: 0px;
-webkit-border-top-right-radius: 5px;
-webkit-border-bottom-right-radius: 0px;
-webkit-border-bottom-left-radius: 5px;
-moz-border-radius-topleft: 0px;
-moz-border-radius-topright: 5px;
-moz-border-radius-bottomright: 0px;
-moz-border-radius-bottomleft: 5px;
border-top-left-radius: 0px;
border-top-right-radius: 5px;
border-bottom-right-radius: 0px;
border-bottom-left-radius: 5px;  }
li:hover li a:hover { background: #95A9B1;  }


/***********************************/

/* the overlayed element */
.simple_overlay {
	
	/* must be initially hidden */
	display:none;
	
	/* place overlay on top of other elements */
	z-index:10000;
	
	/* styling */
	background-color: #CCCCCC;
	
	width:auto;	
	min-height:auto;
	border:2px solid #666;
	
	/* CSS3 styling for latest browsers */
	-moz-box-shadow:0 0 50px 5px #000;
	-webkit-box-shadow: 0 0 90px #000;	
}

/* close button positioned on upper right corner */
.simple_overlay .close {
	background-image:url(../images/portfolio/close.png);
	position:absolute;
	right:-15px;
	top:-15px;
	cursor:pointer;
	height:35px;
	width:35px;
}

/* styling for elements inside overlay */
.details {
	position:relative;
	bottom:0px;
	left:0px;
	height:auto;
	font-size:11px;
	color:#fff;
	width:auto;
	background:#000;
	
 }

.details h1 {
	font-family: Verdana;
	font-size: 10px;
	color: #FFFFFF;
	font-weight:normal;
	padding: 10px;
	}
	
a.detlink:link {font-family: Verdana; font-size: 10px; color:white; font-weight:normal; margin:0px; line-height:1.2px;}
a.details:visited {font-family: Verdana; font-size: 10px; color:red; font-weight:bold; margin:0px; line-height:1.2px; }
a.details:hover {font-family: Verdana; font-size: 10px; color:red; font-weight:bold; margin:0px; line-height:1.2px;}
a.details:active {font-family: Verdana; font-size: 10px; color:red; font-weight:bold; margin:0px; line-height:1.2px; } 

a.textlink:link { color:#8d0d1a; text-decoration:none;}
a.textlink:visited { color:#666; }
a.textlink:hover { color:#000000; text-decoration:underline;}
a.textlink:active { color:#8d0d1a; } 

h1 {
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
font-weight: 300;
color: #444;
text-align: left;
font-size: 1.9em;
padding: 10px 0px 5px 15px;}

h2 {
font-family: Georgia, "Times New Roman", Times, serif;
color:#999;
text-align: left;
font-size: 1.0em;
line-height:1.2em;
padding: 5px 0px 5px 15px;
font-weight:normal;
margin-left:5px;
margin-right:25px;}

/* FORM STYLE */

fieldset {  
margin: 20px;
padding: 0;
border: 1px solid #CCC;
font-family:Arial, Helvetica, sans-serif;
color: #444;
word-spacing: 0.05em;
text-align: left;
line-height: 1.5em;
font-size: 0.8em;
font-weight:normal;}  

h3 {
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
font-weight: 300;
color: #444;
text-align: left;
font-size: 1.5em;}

legend {  
margin-left: 10px;  
color: #000000;  
font-weight: bold;}

fieldset ol {  
padding: 0;  
list-style: none;
margin-left:20px;}

fieldset li {  
padding-bottom: 1em;}

fieldset.submit {  
border-style: none;}

label {    
display: block;
width:100px;
margin-left:20px;}