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

@import url("https://use.typekit.net/eaj4vcj.css");


body {
margin: 30px 0px 40px 0px ;
padding: 0px 0px 0px 0px ;
font-family: "helvetica-neue-lt-pro", sans-serif;
font-weight: 400;
font-style: normal;
color:#EEE;
background-color: #000;
background-image: url(cfo.png);
      background-repeat: repeat;   /* tile in both directions */

    
}


.vidbox {
width :98%;
margin:1%;
height:65vh;

}

#background-video {
  width: 100%;
    height:100%;
  object-fit: cover;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: -1;
overflow: hidden;
}


h1
{
color:#CCC;
font-size: 20px;
font-weight: normal;  
    padding-top:0px;
}

h2
{
color:#BBB;
font-size: 18px;
font-weight: normal;     
}

h3
{
color:#CCC;
font-size: 16px;
font-weight: normal; 
    line-height: 20px;
width:100%;
padding-top: 3px;
padding-bottom: 3px;
text-indent: 4px;
border-bottom: 1px Solid #666;
border-top: 1px Solid #666;
    

}

h4
{
color:#CCC;
font-size: 16px;
font-family: arial, helvetica, sans-serif;
font-weight: lighter; 
padding-top: 0px;
padding-bottom: 0px;
text-indent: 0px;
line-height: 16px;


}



.header {
width :100%;
margin-top:0px;
margin-bottom:0px;
border-bottom : 0px solid #FFF;
background-color: #000;


}

.logo {
width :300px;
height: 90px;
margin-top:10px;
margin-bottom:5px;
margin-left:10px;
border-bottom : 0px solid #FFF;
background-image:url("photo-logo.png");
background-position: 0px 5px;
background-repeat: no-repeat;
background-size: contain;
float:left;
}

.bike {
width :220px;
height: 90px;
margin-top:10px;
margin-bottom:0px;
margin-right:25px;
border-bottom : 0px solid #FFF;
background-image:url("hmmmm.png");
background-repeat: no-repeat;
background-size: contain;
float:right;
    background-position: right;
}

.topcontainer {
padding-top: 0px;
width:95%;
height: 110px;
margin-top:20px;
margin-left:auto;
    margin-bottom:0px;
margin-right:auto;
border-left:1px solid #333;
border-right:1px solid #333;
border-top:1px solid #333;
border-bottom:0px solid #333;
background-color: #000;
    border-top-right-radius: 10px;
        border-top-left-radius: 10px;
           border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;

   box-shadow: 
  3px 3px 3px rgba(0,0,0,0.5),      /* outer shadow */
  inset 1px 1px 2px rgba(0,0,0,0.8);  
    
  background: url('wood.png')  left top;
 

}


.topcontainershadow {
padding-top: 0px;
width:100%;
height:100%;
box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5) inset;
    border-top-right-radius: 10px;
        border-top-left-radius: 10px;
           border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;


}

.nav{
width: 95%;
margin-left:auto;
margin-right:auto;
clear:both;
margin-top: 0px;
    margin-bottom:0px;
border-top:1px solid #333;
border-bottom:1px solid #333;
border-left:1px solid #333;
border-right:1px solid #333;
z-index:10;
    border-top-right-radius: 0px;
        border-top-left-radius: 0px;
           border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.8);

}

.navshad{
background-image: linear-gradient(to top, rgba(000,0,0,0), rgba(000,0,0,.5));
height:5px;
}

.bottomshad{
background-image: linear-gradient(to top, rgba(000,0,0,.3), rgba(000,0,0,0));
 height:5px;
}

.container {

padding-top: 0px;
    padding-bottom: 10px;

width:95%;
margin-top:0px;
margin-bottom:0px;
margin-left:auto;
margin-right:auto;
border-left:1px solid #333;
border-right:1px solid #333;
border-top:1px solid #333;
border-bottom:1px solid #333;
box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.3);
    border-radius: 10px;
 
background-image: linear-gradient(to top left, #111, #222);



}


.bigslidecontainer {
padding-top: 0px;
width:95%;
    height:100%;
margin-top:10px;
margin-bottom:10px;
margin-left:auto;
margin-right:auto;
border-left:1px solid #333;
border-right:1px solid #333;
border-top:1px solid #333;
border-bottom:1px solid #333;
background-image:url("wood.png");
box-shadow: 
  5px 5px 7px rgba(0,0,0,0.7),      /* outer shadow */
  inset 1px 1px 2px rgba(0,0,0,0.6); 
  border-radius: 10px;
}

.bsleft {
    
Float: left;
    width:20%;

    
    
  }  


.bsright {
    
Float: right;
  Width:79%;  
    
  }  


.newscontainer {

padding-top: 5px;
width:95%;
margin-top:0px;
margin-bottom:0px;
margin-left:auto;
margin-right:auto;
border-left:0px solid #333;
border-right:0px solid #333;
border-top:0px solid #333;
border-bottom:0px solid #333;

}

.pdfcontainer {

padding-top: 0px;
width:95%;
margin-top:0px;
margin-bottom:0px;
margin-left:auto;
margin-right:auto;
border-left:1px solid #333;
border-right:1px solid #333;
border-top:1px solid #333;
border-bottom:1px solid #333;
background-color:#000;
box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.3);
border-radius: 10px;

}

.slcontainer {

padding: 2px;
width:95%;
    height: auto;
margin-top:0px;
margin-bottom:0px;
margin-left:auto;
margin-right:auto;
border-left:1px solid #333;
border-right:1px solid #333;
border-top:1px solid #333;
border-bottom:1px solid #333;
box-shadow: 4px 4px 3px rgba(0, 0, 0, 0.5);
   border-top-left-radius: 10px;
    border-top-right-radius: 10px;
       border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
background-color: #000;


}

.roundcontainer {
padding-top: 0px;
margin-left:auto;
margin-right:auto;
border-left:1px solid #333;
border-right:1px solid #333;
border-top:1px solid #333;
border-bottom:1px solid #333;
background-image: linear-gradient(to top left, #111, #222);
box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.3);
border-radius: 20px;


}


.fbcontainer {
padding: 10px;
margin-left:auto;
margin-right:auto;
margin-top:20px;
border-left:1px solid #333;
border-right:1px solid #333;
border-top:1px solid #333;
border-bottom:1px solid #333;
background-color: #111;
box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.3);
border-radius: 20px;
height:700px;
width :95%;

    


}





.subs{
width: 95%;
margin-left:auto;
margin-right:auto;
border: 1px solid #333;
margin-top: 0px;
margin-bottom:0px;
z-index:0;
  background-image: url("hardwood.jpg");
box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.5);
border-radius: 10px;


}


.subs2{
width: 100%;
margin-left:auto;
margin-right:auto;
margin-top: 0px;
margin-bottom:0px;
z-index:5;
background-color:#141414;
box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.0);


}


.substext{
font-family: "helvetica-neue-lt-pro", sans-serif;
font-weight: 400;
font-style: normal;
color:#AAA;
padding-left:20px;
padding-top:5px;
padding-bottom:5px;
text-shadow: 5px 5px 5px #000;
font-size: 16px;

}


.substext2{
font-family: "helvetica-neue-lt-pro", sans-serif;
font-weight: 400;
font-style: normal;
color:#AAA;
padding-top:5px;
padding-bottom:5px;
text-shadow: 5px 5px 5px #000;
font-size: 16px;
    text-align: center;

}

.substext3{
font-family: expressway, sans-serif;
color:#AAA;
padding-top:0px;
padding-bottom:5px;
font-weight: normal;
text-shadow: 5px 5px 5px #000;
font-size: 8px;
    text-align: center;

}


.substext4{
font-family: expressway, sans-serif;
color:#AAA;
padding-top:0px;
padding-bottom:5px;
font-weight: normal;
text-shadow: 5px 5px 5px #000;
font-size: 12px;
    text-align: center;

}

.a:substext3 {
font-family: expressway, sans-serif;
color:#AAA;
padding-top:0px;
padding-bottom:5px;
font-weight: normal;
text-shadow: 5px 5px 5px #000;
font-size: 8px;
text-align: center;
}

a.substext3:visited {
font-family: expressway, sans-serif;
color:#AAA;
padding-top:0px;
padding-bottom:5px;
font-weight: normal;
text-shadow: 5px 5px 5px #000;
font-size: 8px;
text-align: center;
}


a.one:link {color:#ff0000;}
a.one:visited {color:#0000ff;}
a.one:hover {color:#ffcc00;}


a.five:visited {color:#0000ff;text-decoration:none;}

.new{
    position:absolute;
    top:0;
    left:0;
width: 100%;
    height:100%;
background-image:url("new.png");
    background-size: contain;
    background-repeat: no-repeat;
    


}


.vidcontainer {
padding-top: 0px;
    padding-bottom: 0px;
width:90%;
margin-top:0px;
margin-bottom:-5px;
margin-left:auto;
margin-right:auto;
border-left:1px solid #333;
border-right:1px solid #333;
border-top:0px solid #333;
border-bottom:1px solid #333;
background-image: linear-gradient(to top left, #111, #333);
box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.5);
}

.inshadow {
   
    width:100%;
    min-height: 100%;
    overflow: hidden;
    box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.5) inset;
    border-top-right-radius: 10px;
border-top-left-radius: 10px;

  
}

.inshadow2 {
   
    width:100%;
    min-height: 100%;
    overflow: hidden;
    box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.5) inset;
    border-top-right-radius: 10px;
border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;

  
}





.caption {
height:12px;
float: right;
clear:both;
text-align: center;
color:#CCC;
font-size: 10px;
font-weight: normal;
font-style: italic;
display:block;
width:202px;
padding-top: 3px;
padding-bottom: 3px;
text-indent: 0px;
border-bottom: 1px solid #666;
border-top: 0px Solid #666;
margin-right: 0px;
margin-left:20px;
margin-bottom:10px;
background-color:#000;
box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
}

.spacer {
height:25px;
}

.spacer2 {
height:25px;
}

.spacer3 {
height:10px;
}

.spacer4 {
height:8px;
}

.innerbox {
    width:96%;
        margin-top:0px;

    margin-left:auto;
margin-right:auto;




}


.vidtitlebox{
width:59%;
margin-left:auto;
margin-right:auto;
margin-top: 20px;
margin-bottom: 10px;
padding-top:8px;
padding-bottom:8px;
padding-left:1%;
padding-right:1%;
font-weight: 400;
font-style: normal;
background-color: #000;
border: 1px solid #333;
border-radius: 0px;
text-align: left;
font-size: 14px;
color:#999;
box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
text-shadow: 3px 3px 3px #000;
background-image:url("hardwood.jpg");
}


.vidtitlebox2{
width:68%;
margin-left:auto;
margin-right:auto;
margin-top: 20px;
margin-bottom: 10px;
padding-top:8px;
padding-bottom:8px;
padding-left:1%;
padding-right:1%;
font-weight: 400;
font-style: normal;
background-color: #000;
border: 1px solid #333;
border-radius: 0px;
text-align: left;
font-size: 14px;
color:#999;
box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
text-shadow: 3px 3px 3px #000;
background-image:url("wood.png");
}


.flickrtitlebox{
width:95%;
margin-left:auto;
margin-right:auto;
margin-top:     0px;
margin-bottom: 10px;
padding-top:8px;
padding-bottom:8px;
padding-left:1%;
padding-right:1%;
font-weight: 400;
font-style: normal;
background-color: #000;
border: 1px solid #333;
text-align: left;
font-size: 14px;
color:#999;
box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
text-shadow: 3px 3px 3px #000;
background-image:url("hardwood.jpg");
    border-radius: 10px;
}

.pictitlebox{
width:59%;
margin-left:auto;
margin-right:auto;
margin-top: 20px;
margin-bottom: 10px;
padding-top:8px;
padding-bottom:8px;
padding-left:1%;
padding-right:1%;
font-weight: 400;
font-style: normal;
background-color: #000;
border: 1px solid #333;
border-radius: 0px;
text-align: left;
font-size: 14px;
color:#999;
box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.5);
text-shadow: 3px 3px 3px #000;
background-image:url("wood.png");
}



.styledphoto {
width:61%;
margin-left:auto;
margin-right:auto;
margin-top: 0px;
margin-bottom: 0px;
z-index: 1;
box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.5);
overflow:hidden;
border: 1px solid #333;
}

.styledphoto2 {
width:70%;
margin-left:auto;
margin-right:auto;
margin-top: 0px;
margin-bottom: 0px;
z-index: 1;
box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.5);
overflow:hidden;
border: 1px solid #333;
}


.styledphoto3 {
width:95%;
margin-left:auto;
margin-right:auto;
margin-top: 0px;
margin-bottom: 0px;
z-index: 1;
box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.8);
overflow:hidden;
border: 1px solid #333;
    
    border-radius: 10px;
}

.styledvideo {
width:58%;
margin-left:auto;
margin-right:auto;
margin-top: 20px;
margin-bottom: 0px;
z-index: 1;
box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.5);
overflow:hidden;
border: 1px solid #333;
}

.flickrwrap {position:relative;padding-bottom:66.6%;padding-top:0px;height:0;overflow:hidden;}
.flickrwrap iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.flickrwrap2 {position:relative;padding-bottom:30%;padding-top:0px;height:0;overflow:hidden;}
.flickrwrap2 iframe {
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
border-radius: 0px;
}


.flickrwrap3 {position:relative;padding-bottom:56.25%;padding-top:0px;height:0;overflow:hidden;}
.flickrwrap3 iframe {
position:relative;
width: 100%;
height: 100%;
}


.flickrcontainer {
padding-top: 0px;
width:95%;
margin-top:0px;
margin-bottom:0px;
margin-left:auto;
margin-right:auto;
border-left:1px solid #333;
border-right:1px solid #333;
border-top:1px solid #333;
border-bottom:1px solid #333;
background-image: linear-gradient(to top left, #111, #222);
box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.3);
border-radius: 10px;

}

.flickrwrap4 {
  position: relative;
  aspect-ratio: 16 / 9; /* change to 4/3, 3/2, etc. */
  overflow: hidden;
}

.flickrwrap4 iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.picwrap {position:relative;padding-bottom:67%;padding-top:0px;height:0;overflow:hidden;}
.picwrap iframe {
background-size: cover;
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 80%;
box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5) inset;
}

.framelinks {
width:61%;
margin-left:auto;
margin-right:auto;
margin-top: 10px;
font-weight: 400;
font-style: normal;
background-color: #000;
border: 0px solid #333;
border-radius: 0px;
text-align: center;
color:#CCC;
box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.5);
}


.framelinks2 {
width:68%;
margin-left:auto;
margin-right:auto;
margin-top: 10px;
padding-left:1%;
  padding-right:1%;  
      padding-top:10px;  
      padding-bottom:10px;  
font-weight: 400;
font-style: normal;
background-color: #000;
border: 1px solid #333;
border-radius: 0px;
text-align: center;
color:#CCC;
background-image:url("wood.png");
box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.5);
}

.audioframe {
width:59%;
margin-left:auto;
margin-right:auto;
margin-top: 10px;
padding-left:1%;
padding-right:1%;  
padding-top:5px;  
padding-bottom:5px;  
background-color: #000;
border: 1px solid #333;
border-radius: 0px;
text-align: center;
color:#CCC;
background-image:url("wood.png");
box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.5);
}


.video-responsive{
overflow:hidden;
padding-bottom:56.25%;
position:relative;
height:0;
}

.video-responsive iframe{
left:0;
top:0;
height:100%;
width:100%;
position:absolute;
}

.hiretext {
    display:block;
padding-top: 0px;
width:61%;
margin-top:20px;
margin-bottom:20px;
margin-left:auto;
margin-right:auto;
 color:#aaa;
    font-size: 12px;
}

.hiretext a {
  color:#CCC ;
  text-decoration: none;
  font-size: 12px;    
    text-shadow: 3px 3px 5px #000;
    
}

.copyright {
width:95%;
margin-top:0px;
margin-left:auto;
margin-right:auto;
text-align:center;
height:60px;
padding-top: 0px;
padding-bottom: 0px;	
border: 1px solid #333;
margin-bottom: 0px;
font-size: 10px;
background-color: #000;
  background-image: url("hardwood.jpg");
clear:both;
box-shadow: 
  3px 3px 3px rgba(0,0,0,0.5),      /* outer shadow */
  inset 0 0 6px rgba(0,0,0,0.6); 
    border-radius: 10px;

}


.copyrightshad {
padding-top: 0px;
width:100%;
height:100%;
box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5) inset;
    border-top-right-radius: 10px;
        border-top-left-radius: 10px;
           border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;


}



/* small devices (phones, 800px and down) */
@media only screen and (max-width: 768x) {
    

    #background-video {

  object-fit: contain;

}

    .vidbox {

height:auto;

}

.button {
font-size: 10px;
}
    
.textblockr {
padding-top: 0px;
width:80%;
margin-top:20px;
margin-bottom:20px;
margin-left:10%;
margin-right:10%;
float:right;
}

.textblockl {
padding-top: 0px;
width:80%;
margin-top:20px;
margin-bottom:20px;
margin-left:10%;
margin-right:10%;
float:left;   
}
     
}

/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
.bike{ 
display: none
}
    
        .slcontainer {

display: none

}

    
    .vidbox {

height:auto;

}

    
    #background-video {

  object-fit: contain;

}
    
.button {
font-size: 9px;
width:80%;
}
    
    
    .vidtitlebox {
width:90%;

}

.pictitlebox,.audioframe{
width:90%;

}
    
    .styledvideo {
width:90%;
        
    }
    
    .framelinks {
width:90%;
        
    }
    
    .styledphoto {
width:92%;
        
    }
    
    
/* Extra small devices (phones, 320px and down) */
@media only screen and (max-width: 400px) {
    
    

    
.bike{ 
display: none
}
    

    .vidbox {

height:auto;

}

    
    #background-video {

  object-fit: contain;

}
    
    .logo {
width :250px;

}

    
.button {
width:70%;
font-size: 8px;
}
}
}