@charset "UTF-8";

/* html definitions */

body { background-color:#de0000;  }
img { border: none; }


/*site wrapper and header */
div#master-site-wrapper{  padding:0px;  width:960px;  margin:0px auto;   }
div#site-contents-wrapper {  position: relative; padding-top:20px; width:100%;   }

div#site-logo { width:245px; height:182px; padding-left:40px; }

div#work-wrapper { padding:0px; margin:0px; width:664px; position:absolute; top:75px; left:148px; background-color:#1a1a1a;  }

div.work { padding:0px; margin:0px; width:665px; height:181px; }

div.work-title-box { float:left; padding:0px; margin:0px; width:221px; height:181px; background-color:#1a1a1a; display: table; #position: relative; overflow: hidden;
                    border-top-style:solid; border-top-width: 1px; border-top-color:white; 
                    border-right-style:solid; border-right-width: 1px; border-right-color:white;
                    border-bottom-style:solid; border-bottom-width: 1px; border-bottom-color:white;
                    border-left-style:solid; border-left-width: 1px; border-left-color:white; }
div.work-image-box { float:left; padding:0px; margin:0px; width:441px; height:181px; overflow:hidden; position:relative;
                    border-top-style:solid; border-top-width: 1px; border-top-color:white; 
                    border-right-style:solid; border-right-width: 1px; border-right-color:white;
                    border-bottom-style:solid; border-bottom-width: 1px; border-bottom-color:white; }

div.work-end { clear: both; font: 1px/1px sans-serif; }

div.work-title-box p { padding:0px; margin: 0 auto; #position: absolute; #top: 50%; display: table-cell; vertical-align: middle;  
                    text-align:center;  color: #ffffff; font-family:'lato_lightregular', Helvetica, Arial, sans-serif; font-size:24px; width:210px;  }

div.work-example-text-wrapper { display:none; position:absolute; top:10px; left:10px; width:420px; }
div.work-example-text-blocker { position:absolute; top:0px; left:0px; padding:0px; margin:0px; width:441px; height:181px; overflow:hidden;  background: url("../img/blocker.png") no-repeat; }
p.work-example-text { font-family:'latoregular', Helvetica, Arial, sans-serif; font-size:16px; color: #FFFFFF; padding:0px; margin:0px auto;   z-index:1000;   line-height:20px;  }

p#copyright { position:fixed; bottom:0px; right:0px; font-family:'lato_lightregular', Helvetica, Arial, sans-serif; font-size:16px; padding:10px; margin:0px;  color: #FFFFFF; }



/*
*   <contact-info>
*/
div#contact-info { padding:0px; margin:0px; width:300px; position: absolute; top:30px; left:615px; }
div#contact-info-cols { padding:0px; margin:0px; }
div#contact-info-col1 { float:left; padding:0px; margin:0px; }
div#contact-info-col2 { float:left; padding:0px; margin:0px; }
div#contact-info-cols-end { clear: both; font: 1px/1px sans-serif; }
div#contact-info a:link, div#contact-info a:visited { font-family:'lato_lightregular', Helvetica, Arial, sans-serif; font-size:35px; padding:5px; margin:0px;  color: #1a1a1a; text-decoration: none; }
div#contact-info a.active, div#contact-info a:active, div#contact-info a:hover { font-family:'lato_lightregular', Helvetica, Arial, sans-serif; font-size:35px; padding:5px; margin:0px;  color: #ffffff; text-decoration: none; }
/*
*   </contact-info>
*/



/*
*   <contact>
*/
div#contact-wrapper { padding:0px; margin:0px; width:665px; position:absolute; top:75px; left:148px;   }
div#contact { padding:0px; margin:0px; width:665px; height:610px;  background-color:#1a1a1a;
            border-left-style:solid; border-left-width:1px; border-left-color: white;  
            border-top-style:solid; border-top-width: 1px; border-top-color:white; 
            border-bottom-style:solid; border-bottom-width: 1px; border-bottom-color:white;
            border-right-style:solid; border-right-width: 1px; border-right-color:white; }

div#contact-title-box { float:left; padding:0px; margin:0px; width:50px;  display: table;
                        /*border-left-style:solid; border-left-width:1px; border-left-color: white;  
                        border-top-style:solid; border-top-width: 1px; border-top-color:white; 
                        border-bottom-style:solid; border-bottom-width: 1px; border-bottom-color:white;*/ }

div#contact-title-box p { padding:0px; margin: 0 auto; #position: absolute; #top:50%; display: block; vertical-align: middle;  padding:10px; 
                        text-align:center;  color: #ffffff; font-family:'lato_lightregular', Helvetica, Arial, sans-serif; font-size:60px;  }

div.contact-content-box { float:left; padding:0px; margin:0px; width:593px;  
                        /*border-top-style:solid; border-top-width: 1px; border-top-color:white; 
                        border-right-style:solid; border-right-width: 1px; border-right-color:white;
                        border-bottom-style:solid; border-bottom-width: 1px; border-bottom-color:white; */ }

div.contact-content-box p.title { font-family:'lato_lightregular', Helvetica, Arial, sans-serif; font-size:24px;  margin:0px;  color: #ffffff;  margin:20px; }
div.contact-content-box p.button { font-family:'lato_lightregular', Helvetica, Arial, sans-serif; font-size:24px; padding:5px; margin:0px;  color: #ffffff;  }

div.contact-content-box input { font-family:'lato_lightregular', Helvetica, Arial, sans-serif; font-size:16px; color:#1a1a1a; display:block;  margin:5px; margin-left:20px; width:200px; padding:2px; }
div.contact-content-box textarea { font-family:'lato_lightregular', Helvetica, Arial, sans-serif; font-size:16px; color:#1a1a1a; display:block; padding:2px; margin:5px; width:450px; height:150px; resize:none; margin-left:20px; }
div#contact-button { width:150px; height:25px; padding:10px; margin-left:20px;  background-color: #de0000;
                    border-top-style:solid; border-top-width: 1px; border-top-color:white; 
                    border-right-style:solid; border-right-width: 1px; border-right-color:white;
                    border-bottom-style:solid; border-bottom-width: 1px; border-bottom-color:white;
                    border-left-style:solid; border-left-width:1px; border-left-color: white;  }

div#contact-button p { padding:0px; margin: 0 auto; #position: absolute; #top:50%; display: block; vertical-align: middle; text-align:center; }

p.contact-body-copy { font-family:'lato_lightregular', Helvetica, Arial, sans-serif; font-size:16px;  margin:0px;  color: #ffffff; margin-left: 20px; }
p.contact-body-copy a:link, p.contact-body-copy a:visited { font-family:'lato_lightregular', Helvetica, Arial, sans-serif; font-size:16px;  color: #ffffff; text-decoration: none;  }
p.contact-body-copy a:active, p.contact-body-copy a:hover { font-family:'lato_lightregular', Helvetica, Arial, sans-serif; font-size:16px;  color: #de0000;  text-decoration: none; }

div.social-media-contact-cols { padding:0px; margin:0px; width:400px;  }
div.social-media-contact-col1 { float:left; padding:0px; margin:0px; width:200px; }
div.social-media-contact-col2 { float:left; padding:0px; margin:0px; width:200px; }
div.social-media-contact-cols-end { clear: both; font: 1px/1px sans-serif; }
div.contact-content-box-end { clear: both; font: 1px/1px sans-serif; }

input.invalid::-webkit-input-placeholder {
    color: #FF0000;
}

input.invalid:-moz-placeholder { /* Firefox 18- */
    color: #FF0000;
}

input.invalid::-moz-placeholder {  /* Firefox 19+ */
    color: #FF0000;
}

input.invalid:-ms-input-placeholder {  
   color: #FF0000;
}

input.valid::-webkit-input-placeholder {
    color: #C4C4C4;
}

input.valid:-moz-placeholder { /* Firefox 18- */
    color: #C4C4C4;
}

input.valid::-moz-placeholder {  /* Firefox 19+ */
    color: #C4C4C4;
}

input.valid:-ms-input-placeholder {  
   color: #C4C4C4;
}

textarea.invalid::-webkit-input-placeholder {
    color: #FF0000;
}

textarea.invalid:-moz-placeholder { /* Firefox 18- */
    color: #FF0000;
}

textarea.invalid::-moz-placeholder {  /* Firefox 19+ */
    color: #FF0000;
}

textarea.invalid:-ms-input-placeholder {  
   color: #FF0000;
}

textarea.valid::-webkit-input-placeholder {
    color: #C4C4C4;
}

textarea.valid:-moz-placeholder { /* Firefox 18- */
    color: #C4C4C4;
}

textarea.valid::-moz-placeholder {  /* Firefox 19+ */
    color: #C4C4C4;
}

textarea.valid:-ms-input-placeholder {  
   color: #C4C4C4;
}

/*
*   </contact>
*/



/*
*   <fonts>
*/
@font-face {
    font-family: 'lato_blackregular';
    src: url('../fonts/lato-bla-webfont.eot');
    src: url('../fonts/lato-bla-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lato-bla-webfont.woff') format('woff'),
         url('../fonts/lato-bla-webfont.ttf') format('truetype'),
         url('../fonts/lato-bla-webfont.svg#lato_blackregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'latobold';
    src: url('../fonts/lato-bol-webfont.eot');
    src: url('../fonts/lato-bol-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lato-bol-webfont.woff') format('woff'),
         url('../fonts/lato-bol-webfont.ttf') format('truetype'),
         url('../fonts/lato-bol-webfont.svg#latobold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'lato_hairlineregular';
    src: url('../fonts/lato-hai-webfont.eot');
    src: url('../fonts/lato-hai-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lato-hai-webfont.woff') format('woff'),
         url('../fonts/lato-hai-webfont.ttf') format('truetype'),
         url('../fonts/lato-hai-webfont.svg#lato_hairlineregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'lato_lightregular';
    src: url('../fonts/lato-lig-webfont.eot');
    src: url('../fonts/lato-lig-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lato-lig-webfont.woff') format('woff'),
         url('../fonts/lato-lig-webfont.ttf') format('truetype'),
         url('../fonts/lato-lig-webfont.svg#lato_lightregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'latoregular';
    src: url('../fonts/lato-reg-webfont.eot');
    src: url('../fonts/lato-reg-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lato-reg-webfont.woff') format('woff'),
         url('../fonts/lato-reg-webfont.ttf') format('truetype'),
         url('../fonts/lato-reg-webfont.svg#latoregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
/*
*   </fonts>
*/