html{
    color:#fff;
    font-family:"trebuchet ms"
}
a{
    text-decoration:none;
    color:#555;
    outline: 0;
}
a:hover{
    color:#fff;
    -webkit-transition: all .5s ease-in-out;  
    -moz-transition: all .5s ease-in-out;  
    transition: all .5s ease-in-out;      
}
@font-face {
    font-family: consola;
    src: url("/resources/fonts/consolab.ttf");
}
body{
    background-color:#000;
}
.hgroup *{
    display:none;
}
.overlay, .overlay_2{
    width:100%;
    height:100%;
    position:fixed;
    left:0;
    top:0;
    opacity:.25;
    z-index:6;
    background-color:#666;
    display:none;
}
.overlay_2{
    z-index:8;
    opacity:.8;
    background-color:#000;
}
.modal, .imgModal{
    z-index:7;
    position:fixed;
    display:none;
    top:0;
    background-color:#000;
    padding:50px;
    border:5px solid #fff;
    border-radius:5px;
    font-size:18px;
    max-width:700px;
}

.imgModal{
    z-index:9;
    padding:0;
    max-width:1300px;
    height:auto;
    width:auto;
    line-height:0px;
    margin-top:4%;
    margin-left:35%;
}

.modal a{
    text-decoration:underline;
}
.modal .close, .imgModal .close{
    width:37px;
    height:37px;
    background:url("../resources/images/close.png") no-repeat;
    position:absolute;
    right:0;
    top:0;
    margin-top:-20px;
    margin-right:-20px;
    cursor:pointer;
}
.modal h1{
    font-size: 24px;
    margin-bottom: 10px;
}
#clients{
    max-width:694px;
}

#clients .imgHover a {
    display:block;
    float:left;
    height:100px;
    margin:50px 50px 0 0;
}

#clients .imgHover a:last-child, #clients .imgHover a.active{
    margin-right:0;
    float:right;
}
#about, #resources{
    line-height:30px;
}
#about h1, #resources h1, #quotes h1 {
    margin-bottom:35px;
}
.imgHover a.bb{width:112px;}
.imgHover a.msm{width:351px;}
.imgHover a.active{width:102px}
.imgHover a.id4{width:92px}
.imgHover a.idol{width:160px}
.imgHover a.quicken{width:342px}


.imgHover img {
    position:absolute;
}    
.imgHover img:last-child{
    display:none;
}
#contact .imgHover{
    padding-bottom:40px;
}
#galleryImages div{
    float:left;
    margin: 15px 15px 0 0;
    cursor:pointer;
    left:50%;
    z-index:7;
}

nav{
    position:absolute;
    top:0;
    left:0;
    margin-left:1%;
    width:98%;
    background-color:#171717;
    border-radius: 0 0 5px 5px;
    border:solid 1px #2C2C2C;
    opacity:.4;
}
nav ul li:first-child{
    border-left:0;
     -webkit-transition: all .5s ease-in-out;  
    -moz-transition: all .5s ease-in-out;  
    transition: all .5s ease-in-out;       
}
nav ul li{
    float:left;
    font-weight:bold;
    font-size:16px;
    border-right:solid 1px #000;
    border-left:solid 1px #2C2C2C;
}
nav ul li.divider{
    border-left:solid 1px #2C2C2C;
    border-right:0;
}
nav ul li.contact{
    border-right:0;
    float:right;
}
nav ul li a{
    padding:10px 15px;
    display:block;
}
nav ul li a:hover, nav ul li a.selected{
    color:#fff;
    background-color:#1a1a1a;
    -webkit-transition: all .5s ease-in-out;  
    -moz-transition: all .5s ease-in-out;  
    transition: all .5s ease-in-out;  
    
}
nav ul li a.selected{
    cursor:default;
}
div#slants{
    margin:0 auto;
    position:relative;
    width:75%;
}

.slant{
    background-color:#171717;
    width:40px;
    height:100%;
    float:left;
    position:relative;
    
    background-image: -ms-radial-gradient(center, circle farthest-corner, #171717 90%, #000000 100%);
    background-image: -moz-radial-gradient(center, circle farthest-corner, #171717 90%, #000000 100%);
    background-image: -o-radial-gradient(center, circle farthest-corner, #171717 90%, #000000 100%);
    background-image: -webkit-gradient(radial, center center, 0, center center, 506, color-stop(.9, #171717), color-stop(1, #000000));
    background-image: -webkit-radial-gradient(center, circle farthest-corner, #171717 90%, #000000 100%);
    background-image: radial-gradient(circle farthest-corner at center, #171717 90%, #000000 100%);
}
#mainContent{
    overflow:hidden;
    padding:10px 0;
}
#slants .content{
    position:absolute;
    z-index:5;
    width:106%;
    margin-left:-3%;
    color:#000;
    font-family:courier;
    overflow:hidden;
    line-height:21px;
    font-size:14px;
    font-size:1.1em;
    cursor:default;
}
#slants .content::selection{
    background-color:transparent;
}
#slants .content::-moz-selection{
    background-color:transparent;
}

#slants .linkSet{
    z-index:6;
    position:absolute;
    width:100%;
    height:100%;
    display:none;
}
#slants .linkSet a {
    color:#666;
    font-weight:bold;
    top:0;
    left:0;
    cursor:pointer;
    position:absolute;
}
#slants .linkSet a:hover{
    color:#fff;
    -webkit-transition: all .5s ease-in-out;  
    -moz-transition: all .5s ease-in-out;  
    transition: all .5s ease-in-out;     
}
#slants .linkSet a.about {
    margin-top:4%;
    margin-left:8%;
}
#slants .linkSet a.resume {
    left:50%;
    top:50%
} 
#slants .linkSet a.resources {
    left:25%;
    top:75%
}
#slants .linkSet a.music {
    left:40%;
    top:40%
}
#slants .linkSet a.clients {
    left:70%;
    top:15%;
}
#slants .linkSet a.photos {
    left:30%;
    top:30%;
}
#slants .linkSet a.quotes {
    left:80%;
    top:70%;
}
.slant.h3{height:84%;top:8%;z-index:1}
.slant.h2{height:90%;top:5%;z-index:2}
.slant.h1{height:94%;top:3%;z-index:3}
.slant.h0{z-index:4}

.slant:last-child{
    position:absolute;
    right:0;
}

.csstransforms .slant.r1{
    -ms-transform:rotate(-176deg); /* IE 9 */
    -moz-transform:rotate(-176deg); /* Firefox */
    -webkit-transform:rotate(-176deg); /* Safari and Chrome */
    -o-transform:rotate(-176deg); /* Opera */    
}
.slant.r2{
    -ms-transform:rotate(-17deg); /* IE 9 */
    -moz-transform:rotate(-174deg); /* Firefox */
    -webkit-transform:rotate(-174deg); /* Safari and Chrome */
    -o-transform:rotate(-174deg); /* Opera */      
}
.slant.r3{
    -ms-transform:rotate(-172deg); /* IE 9 */
    -moz-transform:rotate(-172deg); /* Firefox */
    -webkit-transform:rotate(-172deg); /* Safari and Chrome */
    -o-transform:rotate(-172deg); /* Opera */      
}
.slant.l1{
    -ms-transform:rotate(176deg); /* IE 9 */
    -moz-transform:rotate(176deg); /* Firefox */
    -webkit-transform:rotate(176deg); /* Safari and Chrome */
    -o-transform:rotate(176deg); /* Opera */     
}
.slant.l2{
    -ms-transform:rotate(174deg); /* IE 9 */
    -moz-transform:rotate(174deg); /* Firefox */
    -webkit-transform:rotate(174deg); /* Safari and Chrome */
    -o-transform:rotate(174deg); /* Opera */     
}
.slant.l3{
    -ms-transform:rotate(172deg); /* IE 9 */
    -moz-transform:rotate(172deg); /* Firefox */
    -webkit-transform:rotate(172deg); /* Safari and Chrome */
    -o-transform:rotate(172deg); /* Opera */       
}

#onOff{
    width:20px;
    height:35px;
    opacity:.6;
    background:url("../resources/images/onoff.png") 0 -35px;
    position:fixed;
    bottom:20px;
    left:20px;
    cursor:pointer;
}
#onOff.off{
    background-position: 0 0;
}