@import "reset.css";
@import "jquery.fancybox-1.3.4.css";
@import "grid.css";
/* Getting the new tags to behave */
article,aside,audio,canvas,command,datalist,details,embed,figcaption,figure,footer,header,hgroup,keygen,meter,nav,output,progress,section,source,video {
display:block;
}
mark,rp,rt,ruby,summary,time {
display:inline;
}
/*global*/


a:link { color: yellow; }
a:active { color: yellow; }
a:visited { color: yellow; }
a:hover { color: yellow;}


@font-face {
    font-family: 'OratorStd';
    src: url('OratorStd.eot');
    src: url('OratorStd.eot?') format('embedded-opentype'),
         url('OratorStd.ttf') format('truetype'),
         url('OratorStd.svg') format('svg');
    font-weight: normal;
    font-style: normal;

}



#video_pattern {
background-image: url(../images/pattern2.png);
position: fixed;
opacity: .7;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
z-index: -999;
}

#video_background {
position: absolute;
background-size:cover;
bottom: 0px;
right: 0px;
min-width: 100%;
min-height: 100%;
width: auto;
height: auto;
z-index: -1000;
overflow: hidden;
}


body {
position:absolute;
font-family: 'lato', sans serif;
font-weight:300; 
color:#000000;


/* By removing the following to mins, we make it so the big images dont blow up and get cut off.  This way they adjust with the users window.  We can play width minimym min and max to help with small displays
*/

min-width: 1068px;
min-height: 1000px;





width:100%;
height:100%;
overflow:hidden;
z-index:1;
}
body p a {
text-decoration:none;
}
body p a:hover {
text-decoration:underline;
}
h1 {
}
h1>a{
position:relative;
display:inline-block;
text-indent: 100%;
white-space: nowrap;
overflow: hidden;
width: 267px;
height: 268px;
background: url(../images/logo.png) center top no-repeat;
margin-top: 0px;
}
h2 {
font-family: 'lato', sans serif;
font-weight:300; 
font-size:30px;
color: #fff;
text-transform: uppercase;
padding-bottom: 21px;
}
h3 {
color: #fff;
}
h3>a {
color: inherit;
}
h3>a:hover {
text-decoration: underline;
}

h4 {
font-family: 'oratorstd', sans serif;
font-weight:300; 
font-size:16px;
color: #000;
text-transform: uppercase;
}


p {
padding-bottom: 18px;
padding-top: 7px;
font-family: 'OratorStd', Georgia, Verdana;
font-weight:lighter;
font-size:16px;
letter-spacing: -1px;
color: #1F1F1F;
}

p2 {
padding-bottom: 18px;
padding-top: 7px;
font-family: 'OratorStd', Georgia, Verdana;
font-weight:lighter;
font-size:14px;
letter-spacing: -1px;
line-height:1px;
color: #1F1F1F;
}


address{
font-style: normal;
}
#glob {
position:absolute;
width:100%;
height:100%;
overflow:hidden;
z-index:2;
background: #;
}
.spinner {
position:fixed;
left:0px;
top:0px;
width:100%;
height:100%;
z-index:9999;
background:url( "../images/ajax-loader.gif") 50% 50% no-repeat #1e1e1e;
}
/*---------gallery bg--------*/

#galleryHolder{
position: absolute;
width: 100%;
height: 100%;
left: 267px !important;

overflow: hidden;
top: 0;
}


#imageHolder{
position: absolute;
width: 100%;
height: 100%;

overflow: hidden;
}




#imgSpinner{
position: absolute;
left:267px;
top:0px;
width:48px;
height:48px;
z-index:9999;
background:url( "../images/ajax-loader.gif") 50% 50% no-repeat #1e1e1e;
display: none;
}


/*end gallery bg*/
/* panel */
#leftPanel{
position: absolute;
width: 267px;
height: 100%;
/*
background: url(../images/left.png);
*/

/* the next two lines is how I make the left panel solid so that the movie doesnt go underneath it*/

background-image: url(../images/pattern.png);
background-color:#FFF;

z-index: 301;
}


.autorPic{
position: relative;
display: block;
width: 270px;
height: 268px;
overflow: hidden;
}
.autorPic>img{
position: relative;
-webkit-transition: all 0.4s ease-out;
-moz-transition: all 0.4s ease-out;
-o-transition: all 0.4s ease-out;
-ms-transition: all 0.4s ease-out;    
transition: all 0.4s ease-out;
}
.autorPic:hover>img{
margin-top: -268px;
}
header, footer{
position:absolute;
width:100%;
z-index:100;
text-align: center;
}
/*header*/
header{
position: relative;
top:0px;
height:268px;
background: #;
}
/*end header*/
/*footer*/
footer {
top:536px;
height:268px;
}
footer>div {
padding: 84px 40px 0;

/*
IN HERE IS WHERE THE WHITEBOX FOR THE ADDRESS IN THE PAGE FOOTER COMES FROM

background-color:#FFF;
opacity: 0.4;
*/

}
footer p {
position: relative;
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
   font-weight: 400;
   text-align:right;
font-size: 13px;
text-transform: uppercase;
color: #000;

}
footer p>.authorName {
font-family: 'lato', sans serif;
font-weight:300; 
font-size: 24px;
}
footer p a{
color: #000;
}
/*end footer*/
/*menu*/
.menu {
position: relative;
display: block;
margin: 60px 0px 0 0;
font-family:'oratorstd', sans serif;
text-align:center;
}
#menu>li {
display: block;
font-family:'oratorstd', sans serif;
position: relative;
text-align: center;
margin-bottom: 5px;
}
#menu>li>a {
position: relative;
display: inline-block;
font-family:'oratorstd', sans serif;
font-weight:100; 
font-size: 18px;
color: #FFFFFF;
text-transform: uppercase;
letter-spacing: 0px;
}
#menu>li>strong{
	font-family:'oratorstd', sans serif;
display: inline-block;
position:absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
z-index: -1;
}
.submenu_1, .submenu_2 {
position:relative;
z-index:9100;
width: 164px;
margin: 0px 0 0px 103px;
}
.submenu_1 li {
position:relative;
display: block;
}
.submenu_1 a {
position:relative;
display: block;
font-family: 'lato', sans serif;
font-weight:300; 
font-size: 12px;
color: #fff !important;
text-transform: uppercase;
-webkit-transition: all 0.4s ease-out;
-moz-transition: all 0.4s ease-out;
-o-transition: all 0.4s ease-out;
-ms-transition: all 0.4s ease-out;    
transition: all 0.4s ease-out;
letter-spacing: 1px;
padding-right: 42px;
}
.submenu_1 li>a:hover,.submenu_1 li.sfHover>a{
color:#000000 !important;
background: #FFFFFF;
}
.submenu_2 {
margin: 0px 0 0px 0px;
}
.submenu_2 a {
color: #000000;
background: transparent;
padding-right: 61px;
}
.submenu_2 li>a:hover,.submenu_2 li.sfHover>a{
color: #000000 !important;
background: #000000;
}
.submenu_1,.submenu_2 {
display: none;
}
/*end menu*/
/* end panel */
/*pages*/
/* folio */
.folio{
position: absolute;
left: 267px;
z-index: 200;

}
.folio>ul{
position: relative;
overflow: hidden;
margin-bottom: 0px;
margin-right: 0px auto;

/* this is how I make the side of screen right of the prtfolio not show the video*/

background-image: url(../images/pattern.png);
background-color:#FFF;
}


.folio>ul>li{
position: relative;
display: inline-block;

background-image: url(../images/pattern.png);


background-color:#FFF;
float: left;
width: 267px;
height: 268px;
display: none;
}
.folio>ul>li>a{
position: relative;
display: block;
width: 100%;
height: 100%;
overflow: hidden;
}


/*THIS IS WHERE WE DO THAT STUFF FOR FADING PICS IN AND OUT*/

.folio>ul>li>a>img{
 margin-top: -268px;
 opacity: .8;
   transition: opacity 1s ease-in-out;
   -moz-transition: opacity 1s ease-in-out;
   -webkit-transition: opacity 1s ease-in-out;

}


.folio>ul>li>a:hover>img{

margin-top: 0px;
-moz-opacity: 1;
-khtml-opacity: 1;
opacity: 1;



}
/* folio info block*/



.infoBlock{
position: absolute;
top: 0;
left: 267px;
width: 267px;
height: 268px;
margin-left:-267px;
background: url(../images/info_bg.png);
z-index: 300;
}
.infoBlock>ul,.infoBlock>ul>li{
position: relative;
display: block;
width: 100%;
height: 100%;
}
.infoBlock>ul>li{
padding-top: 80px;
padding-left: 20px;
}
.infoBlock p{
float:left;
font: bold 12px/14px 'oratorstd', sans-serif;
text-transform: uppercase;
color: #000;
padding: 0 32px 6px 0;
letter-spacing: 1px;
}
.closeBlock{
position: absolute;
display: block;
top: 268px;
left: 267px;
width: 267px;
height: 52px;
margin-left:-267px;
background: #000000;
-webkit-transition: all 0.4s ease-out;
-moz-transition: all 0.4s ease-out;
-o-transition: all 0.4s ease-out;
-ms-transition: all 0.4s ease-out;    
transition: all 0.4s ease-out;
z-index: 99;
overflow: hidden;
}
.closeBlock p{
color: #FFFFFF;
float: left;
font-family:'Oratorstd', sans-serif;
font-size:14px;
color: #CCC;
padding: 19px 73px 0 0;
padding-left:20px;
padding-top:20px;
letter-spacing: 1px;
-webkit-transition: all 0.4s ease-out;
-moz-transition: all 0.4s ease-out;
-o-transition: all 0.4s ease-out;
-ms-transition: all 0.4s ease-out;    
transition: all 0.4s ease-out;
}
.closeBtn{
position: absolute;
right: 0;
top: 0;
z-index: 10;
width: 52px;
height: 52px;
background: url(../images/close_btn.png) center top no-repeat;
overflow: hidden;
-webkit-transition: background-position 0.4s ease-out;
-moz-transition: background-position 0.4s ease-out;
-o-transition: background-position 0.4s ease-out;
-ms-transition: background-position 0.4s ease-out;    
transition: background-position 0.4s ease-out;
}
.closeBlock:hover{
background: #FFFFFF;
}
.closeBlock:hover p{
color: #333;
}
.closeBlock:hover>span{
background-position: center bottom;
}
.infoBlock, .closeBlock{
left: 0;
}
/* end folio info block*/
/* end folio */
#content {
position:relative;
width:950px;
height:750px;
margin-left: 220px;
z-index: 50;
}
#content>ul {
position: relative;
width:100%;
height: 400px;
margin-top: 55px;
}
#content>ul>li:first-child{
background: none;
}
#content>ul>li {
position:absolute;
width:100%;
height:100%;
background: none;
overflow: hidden;
}



#bottomBlock{
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 0px;
z-index: 0;
background: #;
}



#welcomeInfo{
position: relative;
overflow: hidden;
margin-left: -2000px;
}
.readMore {
position: relative;
display: inline-block;
font: bold 18px/1.2em 'Open Sans', sans-serif;
color: #FFFFFF;
background: transparent;
padding: 4px 0px;
-webkit-transition: all 0.4s ease-out;
-moz-transition: all 0.4s ease-out;
-o-transition: all 0.4s ease-out;
-ms-transition: all 0.4s ease-out;    
transition: all 0.4s ease-out;
letter-spacing: 1px;
}
.readMore:hover {
text-decoration: none;  
color: #fff;
}
.list1>li{
margin-bottom: 10px;
}
.list1>li>a{
font-family: 'lato', sans serif;
font-weight:700; 
font-size: 13px;
color: #000000;
-webkit-transition: color 0.4s ease-out;
-moz-transition: color 0.4s ease-out;
-o-transition: color 0.4s ease-out;
-ms-transition: color 0.4s ease-out;    
transition: color 0.4s ease-out;
}
.list1>li>a:before{
position: relative;
display: inline-block;
width: 4px;
height: 7px;
overflow: hidden;
background: url(../images/list_icon.png) left 0 no-repeat;
content: ' ';
margin: 0px 14px 0 0;
top: -1px;
}
.list1>li>a:hover{
color: #000000;
}
.list1>li>a:hover:before{
background-position: right 0;
}
.list2{
width: 590px;
height: 275px;
}
.list2>li{
margin-bottom: 11px;
}
.list2>li>div:first-child{
float: left;
margin: 6px 29px 0 0px;
width: 50px;
}
.list2>li>div:first-child>p{
font: bold 18px/1em 'Open Sans', sans-serif;
color: #FFFFFF;
letter-spacing: 2px;
}
.list2>li>div:first-child>p>span{
font-size: 35px;
margin-bottom: 7px;
position: relative;
display: block;
}
.list2>li>div:first-child+div{
overflow: hidden;
}
.list3{
margin-top: 3px;
}
.list3>li{
position: relative;
display: inline-block;
width: 202px;
margin-right: 16px;
}
.list3>li>a{
position: relative;
display: block;
width: 202px;
height: 182px;
overflow: hidden;
margin-bottom: 16px;
}
.slider1{
position: relative;
width: 590px;
height: 275px;
}
.slider2{
position: relative;
width: 890px;
height: 275px;
}
.btnsHolder{
position: relative;
display: inline-block;
margin-top: 32px;
}
.btnsHolder>a{
position: relative;
display: inline-block;
width: 101px;
height: 32px;
margin-left: -4px;
background: #000000;
-webkit-transition: background-color 0.4s ease-out;
-moz-transition: background-color 0.4s ease-out;
-o-transition: background-color 0.4s ease-out;
-ms-transition: background-color 0.4s ease-out;    
transition: background-color 0.4s ease-out;
}
.btnsHolder>a:first-child{
margin-left: 0;
}
.btnsHolder>a>span{
position: relative;
display: inline-block;
width: 100%;
height: 100%;
overflow: hidden;
-webkit-transition: background-position 0.4s ease-out;
-moz-transition: background-position 0.4s ease-out;
-o-transition: background-position 0.4s ease-out;
-ms-transition: background-position 0.4s ease-out;    
transition: background-position 0.4s ease-out;
}
.prev>span{
background: url(../images/arrowL_2.png) right center no-repeat;
}
.next>span{
background: url(../images/arrowR_2.png) left center no-repeat;
}
.btnsHolder>a:hover{
background: #e1a400;
}
.prev:hover>span{
background-position: left center;
}
.next:hover>span{
background-position: right center;
}
/* end btnsBlock */

/* this next one "bottom" controls the hright of the next button.  Default is "Bottom 144 zindex 100"*/
.btnsBlock{
position: absolute;
display: inline-block;

top: 268px;
left: 267px;
width: 215px;
height: 52px;
margin-left:0px;
overflow: hidden;
z-index: 150;
}
.btnsBlock>a{
position: relative;
display: inline-block !important;
width: 107px;
height: 52px;
margin-left: -4px;
background: #000000;
-webkit-transition: background-color 0.4s ease-out;
-moz-transition: background-color 0.4s ease-out;
-o-transition: background-color 0.4s ease-out;
-ms-transition: background-color 0.4s ease-out;    
transition: background-color 0.4s ease-out;
}
.btnsBlock>a:first-child{
margin-left: 0;
}
.btnsBlock>a>span{
position: relative;
display: inline-block;
width: 100%;
height: 100%;
overflow: hidden;
-webkit-transition: background-position 0.4s ease-out;
-moz-transition: background-position 0.4s ease-out;
-o-transition: background-position 0.4s ease-out;
-ms-transition: background-position 0.4s ease-out;    
transition: background-position 0.4s ease-out;
}
.prevBtn>span{
background: url(../images/arrowL.png) left center no-repeat;
}
.nextBtn>span{
background: url(../images/arrowR.png) right center no-repeat;
}
.btnsBlock>a:hover{
background: #FFFFFF;
}
.nextBtn:hover>span{
background-position: left center;
}
.prevBtn:hover>span{
background-position: right center;
}
/* end btnsBlock */

/*scroll*/
.outside{
position: relative;
}
.scroll{
float:left;
}
.outside .scroll{
width: 630px;
height: 347px;
}
.scroll-btns{
position: absolute;
top: -47px;
z-index: 200;
display: block;
right: 0px;
}
.scroll-btns>a{
position: relative;
display: inline-block;
width: 101px;
height: 32px;
margin-left: -4px;
background: #000000;
-webkit-transition: background-color 0.4s ease-out;
-moz-transition: background-color 0.4s ease-out;
-o-transition: background-color 0.4s ease-out;
-ms-transition: background-color 0.4s ease-out;    
transition: background-color 0.4s ease-out;
}
.scroll-btns>a:first-child{
margin-left: 0;
}
.scroll-btns>a>span{
position: relative;
display: inline-block;
width: 100%;
height: 100%;
overflow: hidden;
-webkit-transition: background-position 0.4s ease-out;
-moz-transition: background-position 0.4s ease-out;
-o-transition: background-position 0.4s ease-out;
-ms-transition: background-position 0.4s ease-out;    
transition: background-position 0.4s ease-out;
}
.btndown>span{
background: url(../images/arrow_down.png) center bottom no-repeat;
}
.btnup>span{
background: url(../images/arrow_up.png) center top no-repeat;
}
.scroll-btns>a:hover{
background: #FFFFFF;
}
.btndown:hover>span{
background-position: center top;
}
.btnup:hover>span{
background-position: center bottom;
}
/*end scroll*/
.sitem_over {
position:absolute;
background:url( '../images/pic_bg_over.png');
z-index:2;
width:100%;
height:100%;
display:none;
overflow: hidden;
}
.sitem_over>strong {
position:relative;
background:url( '../images/icon_zoom.png') center no-repeat;
width: 100%;
height: 100%;
display: block;
}
.color1{
color: #fff;
}
.color2{
color: #000000;
}
.color3{
color: #FFFFFF;
}
.width1{
display: inline-block;
width: 90px;
}
.fontStyle1{
font-family: 'lato', sans serif;
font-weight:100; 
font-size: 40px;
color: #FFFFFF;
text-shadow: 0 0 10px #000;
text-transform: uppercase;
padding-top: 116px;
padding-left:75px;
letter-spacing: 1px;
}
.fontStyle2{
font-family: 'lato', sans serif;
font-weight:300; 
font-size: 13px;
color: #FFFFFF;
text-shadow: 0 0 5px #000;
text-transform: uppercase;
padding-left:75px;
letter-spacing: 1px;
}
/*additional classes*/
.wrapper {
width:100%;
overflow:hidden;
}
a {
text-decoration:none;
}
a.nound,.nound a {
text-decoration:none;
}
a.nound:hover,.nound a:hover {
text-decoration:underline;
}
.clear {
clear:both;
line-height:0;
}
.right{
margin-right: 0 !important;
}
/*google map*/
.google_map{
position:  relative;
overflow: hidden;
border-radius: 0px;
width: 310px;
height: 227px;
border: none;
box-shadow: none;
background-color: #000000;
background-image: url(../images/ajax-loader.gif);
background-repeat: no-repeat;  
background-position: 50%;
margin: 3px 0 16px;
}
/*end google map*/
/* Forms*/
#form1 {
position: relative;
margin-top: 3px;
height: 350px;
}
#form1 input,
#form1 textarea,
#form1 .success {
position: relative;
background: none;
border: 1px solid #000000;
color:#000000;
padding: 5px 9px 6px;
width: 308px;
outline:none;
box-shadow:none;
margin: 0;
}
#form1 input{
width: 308px;
height: 29px;
box-sizing: border-box;
-moz-box-sizing: border-box;
}
#form1 textarea {
width: 410px;
height: 153px;
overflow:auto;
resize: none;
}
#form1 label {
display:inline-block;
min-height: 46px;
position: relative;
width: 310px;
}
#form1 label.message {
width: 430px;
}
#form1 .success{
position: absolute;
z-index: 10;
background: #000000;
text-align: center;
padding: 42px 9px 41px;
width: 288px;
}
#form1 .error, #form1 .empty {
text-align: right;
display:none;
font-size:10px;
color:#FFFFFF;
right: 3px;
top: 3px;
position: absolute;
}
fieldset{
height: 210px;
}
.btns{
float: right;
padding: 12px 0 0;
position: relative;
}
.btns a{
display:inline-block;
margin-left: 30px;
}
/* Form defaults */
input, select, textarea {
font: normal 13px/15px 'Trebuchet MS', sans-serif;
vertical-align:middle;
}
/*end forms*/