/* html5doctor.com Reset v1.6.1 (http://html5doctor.com/html-5-reset-stylesheet/) - http://cssreset.com */
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}
body{line-height:normal}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
nav ul{list-style:none}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:none}
a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}
ins{background-color:#ff9;color:#000;text-decoration:none}
mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold}
del{text-decoration:line-through}
abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}
table{border-collapse:collapse;border-spacing:0}
hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}
input,select{vertical-align:middle}

a {
    outline: 0;
    color:#ff8f2c;
}

select {
    color:#ff8f2c;
    background:none;
    border:1px solid #ff8f2c ; 
}

input[type="email"], 
input[type="number"], 
input[type="text"], 
input[type="radio"], 
textarea 
{
    color:#ff8f2c;
    background:none;
    border:1px solid #ff8f2c; 
}

input, textarea {
    
    font-family: 'Ubuntu', sans-serif !important;
}

#newsletterEmail {
    width:180px;
    background:none;
    overflow:hidden;
    border:0px;
    font-size:14px;
    color:#ff8f2c;
    text-align:center;
    padding: 5px 0;
}
#newsletterSubmit {
    font-size:14px;
    width:68px;
    overflow:hidden;
    display:none;
}

#contactSubmit, #newsletterSubmit, input[type="submit"], input[type="button"] {
    
    background:#ff8f2c !important;
    border:0px !important; 
    padding:4px 2px !important;
    color:#000 !important;
    font-weight:bold;
}

#submenu {
    
    position:relative;
    top:100px;
    left:350px;
    width:400px;
    height:50px;
    text-align:center;
    float:left;
}



.caption {

    font-size:12px !important;

}

#loadingMask {
    width: 100%; 
    height: 100%; 
    position: fixed; 
    background: black;
    z-index: 99;
}

#loadingMask-image {
    position: absolute;
    top: 42%;
    left: 45%;
    z-index: 100;
}

html,body {
    margin:0;
    padding:0;
    height:100%;
    font-size:16px;
    font-weight:normal;

}

li {
    margin-bottom:5px;
}

body {
    
    font-family: 'Ubuntu', sans-serif;

    background:black;
    color:white;

    /* Suppose to display static image in background if video can't play, but
     doesn't work. */

    /*
    background-attachment: fixed;
    background-color: black;
    background-image: url(../cinematics/opening_static.png);
    background-position: center center;
    background-repeat: no-repeat;
    */
}

* html #container {

    min-height:800px;
    height: 100%;
}

.subMenuItem {

} 

#container {

    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    width:1200px;
    margin:0 auto;
    height: 100%;
    min-height: 720px;
    /*border:1px solid blue;*/
    position:relative;
    top:0px;
    margin-bottom:-72px; 
    bottom:0px;
    display: none;
}

a {

}

h2 {
    font-family: 'Ubuntu Mono', sans-serif !important;
    color:#ff8f2c;
    font-variant:small-caps;
    font-size:26px;
    margin:25px 0px 12px 0px;
}


h3 {
    font-size:18px;
    margin:15px 0px 8px 0px;
}


#screen{
    
    background-image: url(../images/screen.png);
    background-repeat: no-repeat;
    background-size: 900px;
    
    overflow: hidden;
    height: 100%;
    
    /* border:1px solid red; */
    width:860px;
    position:relative;
    top:0px;
    bottom:0px;
    background-position: top center;
    
}

.opera12 #screen {
    height: 112%;
}

#screen-container {
    
    display:inline-block;
    position: relative;
    width: 50%;
    
}

.subMenuItem {

    text-decoration:none;
    float:left;
    font-size:14px;
    text-transform:capitalize;
    font-family: 'Ubuntu Mono', sans-serif !important;
    color:#ff8f2c;
}

.subMenuItemBackground {

    float:left;    
    padding:6px;
    text-decoration:none;
    margin:2px;
    background-image: url('/images/opaque-amber.png');
}

.subMenuItemBackground:hover,
.subMenuItemBackground.selected {
    background-image:url('/images/opaque-amber-hover.png');
}

.contactFormElement {

    float:left;
    width:100%;
    margin:5px 0px;
}
.contactFormLabel {

    padding-top:4px;
    float:left;
    width:20%;
}
.contactFormField {

    float:left;
    width:80%;
}

.contactFormField input {
    width:50%;
}

.contactFormField select {
    width:50%;
}

.contactFormField textarea {
    width:50%;
    height:100px;
}
.contactFormArea {
    float:left;
    width:100%
}

.separator {

    opacity:0.3;
    filter:alpha(opacity:30); /* For IE8 and earlier */

    width: 100%; 
    height: 2px; 
    background: #ff8f2c; 
    overflow: hidden;
    
    margin-top: 30px;
    margin-bottom: 30px;
}

h3 {
    color:#ff8f2c;
    font-variant:small-caps;
    display:inline;    
}

#dummy-wrapper {
    margin-top: 80%;
}
 
#stretch-wrapper {
    position: relative;
    padding-bottom: 80%;
    height: 0;
}

.bio {
    /*margin:30px 0px;*/
}

.left {
    text-align:left;
}

.bioRight {
    padding-left:20px;
    padding-bottom:18px;
}

.bioLeft {
    padding-bottom:18px;
    padding-right:20px;
}

.bioRight img {
    padding-left:0px;
    padding-bottom:0px;
    width:175px;

    -moz-box-shadow: 3px 3px 4px #000;
    -webkit-box-shadow: 3px 3px 4px #000;
    box-shadow: 3px 3px 4px #000;
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";
    filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000');
}

.bioLeft img {
    padding-bottom:0px;
    padding-right:0px;
    width:175px;

    -moz-box-shadow: 3px 3px 4px #000;
    -webkit-box-shadow: 3px 3px 4px #000;
    box-shadow: 3px 3px 4px #000;
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";
    filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000');
}

.bioRight {
    float:right;
}

.bioLeft {
    float:left;
}
#video-container
{
    position:absolute;
    height: 100%; 
    width: 100%; 
    left: 0; 
    top: 0; 
    overflow: hidden;
}

#openingCinematic {
    height:100%;
    width:auto;
    position: fixed;
    /*top: 0; 
    left: 0;
    bottom: 0; 
    right: 0;*/
    /*width:100%;*/
    z-index: -1; 
}

@media screen and (min-aspect-ratio: 16/10) {

    #openingCinematic {
        height:auto;
        width:100%;
    }

}

.opera12 #openingCinematic {
    width: 100% !important;
    height: auto !important;
}

.bubble {
    
    text-align:center;
    font-family: 'Ubuntu Mono', sans-serif !important;
    font-size:14px;
    margin-top:15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    padding:15px;
}

.quote {

    text-align:center;
    font-family: 'Ubuntu Mono', sans-serif !important;
    font-size:14px;
    margin-top:20px;
    -moz-border-radius: 15px;
    border-radius: 15px;
}

q {
    font-style:italic;
}

#content {
    
    /*border:1px solid green;*/
    color: #FFFFFF;
    overflow: hidden;
    text-align: justify;
    /*text-shadow: #FFFFFF 0 0 1px, #FFFFFF 0 0 2px, green 0 0 5px, green 0 0 5px;*/
    position: absolute; 
    width: 760px; 
    height: 525px;
    top:160px;
    bottom:-400px;
    padding-left:40px; 
}

#loading {
    position: absolute; 
    width: 760px; 
    height: 525px;
    top:160px;
    bottom:-400px;
    background: url('../images/ajax-loader.gif') center center no-repeat;
    display: none;   
}

#content2 {
    width: 100%;
    height: 100%;
}

#content h1 {
    font-size: 20px;
}

#content p {
    margin-top: 20px;
}

#content a { 
    /*text-shadow: #ff9 0 0 5px, #ff9 0 0 5px;*/
    color:#ff8f2c;
}

#content i {
    font-style: italic;
}

#random_quote {
    display: none;
    float: left;
    margin: 20px;
    position: absolute;
    top: 50%;
    right: 0px;
    font-variant: small-caps;
}

.studio_hardware img {
    float: left;
    margin: 23px 15px 5px 0px;
    background-color: white;
    padding: 3px;
}

.news_coverage img {
    float: left;
    margin: 23px 15px 5px 0px;

    -moz-box-shadow: 3px 3px 4px #000;
    -webkit-box-shadow: 3px 3px 4px #000;
    box-shadow: 3px 3px 4px #000;
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";
    filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000');
}

.skip {
    display: none;
    opacity:0.25;
    filter:alpha(opacity=25); /* For IE8 and earlier */
    color: silver;
    font-family: 'Ubuntu Mono', sans-serif;
    position:absolute;
    bottom:5px;
    border-radius:5px;
    right:5px;
    color:#ff8f2c;
    background:none; 
    padding:5px 10px;
    cursor:pointer;
}

#content b {
    /*font-style: bold;*/
}



#mainsub{

    background-image: url(../images/menusub.png); 
    background-size: 275px auto;
    background-repeat: no-repeat;
    top:108px;
    width: 275px;
    position:relative;
    height: 550px;
    float:left;
    left: 8px;
    background-position: 0 70px;
}




/*---FADE IN/OUT---*/
#content
{
    animation: fadein 2s;
    -moz-animation: fadein 2s; 
    -webkit-animation: fadein 2s; 
    -o-animation: fadein 2s; 
}
@keyframes fadein {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-moz-keyframes fadein {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-webkit-keyframes fadein { 
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-o-keyframes fadein { 
    from {
        opacity:0;
    }
    to {
        opacity: 1;    }
}

/* ------LINKS------ */

a.control {
    font-size:0;
    color: transparent;
    position: absolute;
}

a.control.main-button {
    width: 28px; 
    height:35px;
    display:block;
    top: 119px;    
}

a.control.flat-button {
    height: 18px;
    width: 58px;
    left: 133px;
}

a.control.toggle {
    position: absolute;
    background-image: url("../images/switchb.png");
    background-repeat: no-repeat;
    background-size: 67%;
    background-position: -3px -10px;
    height: 57px;
    width: 53px;
}

a.control.toggle.on  {
    background-position: -3px -314px;
    -webkit-animation: upswitch .25s steps(3) forwards;
       -moz-animation: upswitch .25s steps(3) forwards;
        -ms-animation: upswitch .25s steps(3) forwards;
         -o-animation: upswitch .25s steps(3) forwards;
            animation: upswitch .25s steps(3) forwards;
}
a.control.toggle.off {
    -webkit-animation: downswitch .25s steps(3) forwards;
       -moz-animation: downswitch .25s steps(3) forwards;
        -ms-animation: downswitch .25s steps(3) forwards;
         -o-animation: downswitch .25s steps(3) forwards;
            animation: downswitch .25s steps(3) forwards;
}

@-webkit-keyframes upswitch {
    0% { background-position:    -3px -10px; }
    100% { background-position:   -3px -314px; }
}

@-moz-keyframes upswitch {
    0% { background-position:    -3px -10px; }
    100% { background-position:   -3px -314px; }
}

@-ms-keyframes upswitch {
     0% { background-position:    -3px -10px; }
    100% { background-position:   -3px -314px; }
}

@-o-keyframes upswitch {
    0% { background-position:    -3px -10px; }
    100% { background-position:   -3px -314px; }
}

@keyframes upswitch {
    0% { background-position:    -3px -10px; }
    100% { background-position:   -3px -314px; }
}

@-webkit-keyframes downswitch {    
    0% { background-position:   -3px -314px; }
    100% { background-position:    -3px -10px; }
}

@-moz-keyframes downswitch {
    0% { background-position:   -3px -314px; }
    100% { background-position:    -3px -10px; }
}

@-ms-keyframes downswitch {
    0% { background-position:   -3px -314px; }
    100% { background-position:    -3px -10px; }
}

@-o-keyframes downswitch {
    0% { background-position:   -3px -314px; }
    100% { background-position:    -3px -10px; }
}

@keyframes downswitch {
    0% { background-position:   -3px -314px; }
    100% { background-position:    -3px -10px; }
}


/*HOME*/
a#home { 
    left: 73px
     }
a#home.on {
	
    background-image: url("../images/green.png");
    background-size: 32.5px 40px;
    width:32.5px;
    height:40px;
    left: 70.5px;
    top: 117px;
}     


/*ABOUT*/
a#about { 
    left: 109px;
}
a#about.on { 
    background-image: url("../images/yellow.png");
    background-size: 32.5px 40px;
    width:32.5px;
    height:40px;
    left: 107px;
    top: 117px;
}

/*NEWS*/
a#news{ 
    left:145px ; 
 }
a#news.on{ 
    background-image: url("../images/red.png");
    background-size: 32.5px 40px;
    width:32.5px;
    height:40px;
    left: 143px;
    top: 117px;
}

/*GALLERY*/
a#gallery{
    left: 60px;
    top: 226px;
}

/*STORE*/
a#store{
    top: 299px;
    left: 64px
}

/*DOWNLOADS*/
a#downloads{
    top: 299px;
    left: 153px;
}

#handdrm{
margin-left: 145px;
margin-top: 30px;
}

#ccdrm{
   margin-left: 435px;
   margin-top: 0px;
   text-decoration: none;

}




/*--GETTING INVOLVED--*/
a#getting_involved{
top: 405px;
left: 59px;

}

#gallery_container {
    
    float:left;
    margin-top:20px;
    width:100%;
    height:auto;
    overflow:hidden;
    
}
#gallery_container IMG {
    
    float:left;
    width:29%;
    height: auto;
    margin:2%;
}

#gallery_container.thumbsGallery IMG {
    min-height: 150px;
}

.dropshadow {

    -moz-box-shadow: 3px 3px 4px #000;
    -webkit-box-shadow: 3px 3px 4px #000;
    box-shadow: 3px 3px 4px #000;
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";
    filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000');
}

.gallery_thumb {

    -moz-box-shadow: 3px 3px 4px #000;
    -webkit-box-shadow: 3px 3px 4px #000;
    box-shadow: 3px 3px 4px #000;
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";
    filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000');
}

ul
{
    list-style: initial;
    margin: initial;
    padding: 0 0 0 40px;
}

li
{
    display: list-item;
}


/*-----COMMUNITY & SUPPORT-----*/
a#community_and_support { 
    top: 412px;
 }
a#community_and_support.on{ 
    background-image: url("../images/community_and_support.png");
    background-size: 100% 100%;
}


/*-----CONTACT-----*/
a#contact{ 
    top: 435px; 
 }
a#contact.on{ 
    background-image: url("../images/contact.png");
    background-size: 100% 100% ;
}


#armed {
    position: absolute;
    height: 34px;
    left: 153px;
    top: 233px;
    width: 28px;
    background-image: url("../images/armed.png");
    background-repeat:no-repeat;
    background-size: 100% ;
}

#armed.on{
    background-image: url("../images/flash.png");
    -webkit-animation: flash      0.6s steps(2) forwards;
    -moz-animation: flash         0.6s steps(2) forwards;
    -ms-animation: flash         0.6s steps(2) forwards;
    -o-animation: flash         0.6s steps(2) forwards;
    animation: flash             0.6s steps(2) forwards;
    animation-iteration-count: 3;
    -webkit-animation-iteration-count: 3;
}

@-webkit-keyframes flash {
   0% { background-position: 0 0; }
 100% { background-position: 0 -82px; }
    
}

@-moz-keyframes flash {
   0% { background-position:  0 0; }
 100% { background-position:  0 -82px; }
}

@-ms-keyframes flash {
   0% { background-position:  0 0; }
 100% { background-position:  0 -82px; }
}

@-o-keyframes flash {
   0% { background-position: 0 0; }
 100% { background-position: 0 -82px; }
}

@keyframes flash {
   0% { background-position: 0 0; }
 100% { background-position: 0 -82px; }
}

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

#footer_img_container {
    
    width:1000px;
    margin:0 auto;
    padding-left:85px; 
    
}
.footer_img_container {
    
    float:left;
    height:48px;
    margin:0 auto;
    padding-right:32px; 
    overflow:hidden;
    position:relative;
    
}
#footer {
    background-image: url(../images/footer.png); 
    text-align:center;
    background-repeat: no-repeat;
    background-position:top center;
    width: 100%;
    min-width:1200px;
    height:52px;
    padding-top:20px;
    position:relative;
    bottom: 0;
    display: none;
}

@media screen and (max-height: 768px) {
    #footer {
        margin-top: 100px;
    }
}

#footer img {

    position: relative;
    /*top: 0px;*/
    opacity: 0.2;
    top: -48px;
}

#footer img:hover {

    position: none;
    opacity: 1.0;
    /*top: -48px;*/
    top: 0px;
}

.mailing_address {
    margin-left: 10px;
}

.short_descriptive_list dl dt {
    margin-left: 10px; 	
} 

.short_descriptive_list dl dd {
    font-family: 'Ubuntu Mono', monospace;
    margin-left: 40px;
}



.studio_software_list {


}

.studio_software_list ul {
    font-family: 'Ubuntu Mono', monospace;
    margin-right: 6%;

}

.studio_software_list li {
    width           : 50%;
    line-height     : 25px;
    float: left;
    list-style: none;
    text-align: center;
}


.studio_software_list li span {
    display             : -moz-inline-box;  /* FF2 or lower */
    display             : inline-block;     /* FF3, Opera, Safari */
    line-height         : normal;
    vertical-align      : middle;    
}

.studio_software_list li span {
   *display  : inline; /* haslayout for IE6/7 */
} 

a.software_link {
    text-decoration: none;
    color: white;
}



.separatorh2{
    font-family: 'Ubuntu Mono', sans-serif !important;

    color:#ff8f2c;

    font-variant:small-caps;

    font-size:26px;

    margin:25px 0px 30px 0px;

    border-bottom: solid rgb(255, 143, 44); /*fallback for rgba with no opacity effect */		
    border-bottom: solid rgba(255, 143, 44, 0.3) ; /* rgba utilized for border opacity hexadecimal color was #ff8f2c */	
    border-width: 2px;
    padding-bottom: 30px;
    -webkit-background-clip: padding-box; 
    background-clip: padding-box; 


}

#donationform{

}