@charset "utf-8";

/* Import font declerations */
@import url("fonts/fonts.css");

/* Primary Style Declarations */

body {
    font-family: 'GillSansMT', sans-serif;
    font-size: 11px;
    padding: 0;
    margin: 0;
    color: #ffffff;
    background-color: #3F3F3F;
    background-image: url("../images/mattedesign.png");
    background-position: 50% 0;
    background-repeat: no-repeat;
    /* -moz-background-size: contain; */
    /* background-size: contain; */
    z-index: 0;
}

/*
@media only all and (max-width: 938px) and (max-height: 702px) {
    body {
        -moz-background-size: 938px 702px;
        background-size: 938px 702px;
    }
}
*/

a:link {
    font-weight: bold;
    text-decoration: none;
    color: #cccccc;
}

a:visited {
    font-weight: bold;
    text-decoration: none;
    color: #cccccc;
}

a:hover, a:active {
    text-decoration: none;
    color: #d66d04;
    background-image: none;
}

img {
    border: 0px solid;
}

span.underline {
    text-decoration: underline;
}

span.bold {
    font-weight: bold;
}

.note {
    font-size: 11px;
    color: #cccccc;
}

.code {

}

.vertalign {
    vertical-align: bottom;
}

/* -------------------- */

/* index.php */

/* Main Content positioning DIV */

div#Container {
    overflow: visible;
}

/* -------------------- */

/* Main logo image container*/

div#LogoBox {
    float: left;
    width: 20em;
    height: 30em;
    background-image: url("../images/bbmainlogo.png");
    background-position: 0 0;
    background-repeat: no-repeat;
}

/* Gallery placeholder */

div#MainBox {
    margin: 5em auto 0 auto;
    width: 68.2em;
    height: 48em;
    background-image: url("../images/mainboxmatte.png");
    background-position: 0 0;
    background-repeat: no-repeat;
}

/* Gallery/Portfolio content */

h4#portfolio_title {
    text-decoration: underline;
    margin-bottom: 0;
    text-shadow: 1px 1px 3px #242424;
}

div#PortfolioBox {
    height: 30em;
    margin: 2em 0 0 0;
    float: left;
    width: 31em;
    overflow-x: hidden;
    overflow-y: auto;
}

.portfolio_image {
    /* for IE */
    filter:alpha(opacity=60);
    /* CSS3 standard */
    opacity: 0.6;
}

.portfolio_caption {
    background-color: #000000;
    width: 193px;
    height: 1.5em;
    padding: 0 0 0 .5em
}

.portfolio_link:link {
    text-decoration: none;
    color: #ffffff;
}

.portfolio_link:hover {
    text-decoration: none;
    color: #ffffff;
}

.portfolio_link:visited {
    text-decoration: none;
    color: #ffffff;
}

#pi1 {
    width: 200px;
    height: 40px;
    background-image: url("../images/portfolio/BowenBan.png");
    background-position: 0 0;
    background-repeat: no-repeat;
}

#pi2 {
    width: 200px;
    height: 40px;
    background-image: url("../images/portfolio/AirbuzzBan.png");
    background-position: 0 0;
    background-repeat: no-repeat;
}

#pi3 {
    width: 200px;
    height: 40px;
    background-image: url("../images/portfolio/OflBan.png");
    background-position: 0 0;
    background-repeat: no-repeat;
}

#pi4 {
    width: 200px;
    height: 40px;
    background-image: url("../images/portfolio/WriseBan.png");
    background-position: 0 0;
    background-repeat: no-repeat;
}

/* Sub page thumbnails */

div.subThumb {

}

p.subThumbTxt {

}

/* AIRbuzz */

h4.airbuzztitle {
    text-decoration: underline;
}

div#airbuzzbanner {
    height: 300px;
    width: 71px;
    margin: 0 0 0 .5em;
    float: left;
    background-image: url("../images/portfolio/airbuzzbanner.png");
    background-position: 0 0;
    background-repeat: no-repeat;
}

div#airbuzzinfo {
    margin: 0 0 0 .5em;
    float: left;
}

div#airbuzzdl {
    float: left;
    margin: 0 0 0 5.2em;
    text-align: left;
    padding: .3em;
    color: #000000;
    background-color: #ffffff;
    border: 1px solid #cccccc;
    /* for IE */
    filter:alpha(opacity=80);
    /* CSS3 standard */
    opacity: 0.8;
}

div#airbuzzdl img {
    vertical-align: bottom;
}

div#airbuzzcode {
    text-align: center;
    margin: 0 0 0 3.3em;
    float: left;
}

div.homebox {
    float: left;
}

#abuzzcode_a {
    padding: .4em 1em .4em 20px;
    text-decoration: none;
    position: relative;
}
#abuzzcode_a span.ui-icon {
    margin: 0 5px 0 0;
    position: absolute;
    left: .2em;
    top: 50%;
    margin-top: -8px;
    zoom: 1;
}

#abuzzcode_b {
    padding: .4em 1em .4em 20px;
    text-decoration: none;
    position: relative;
}
#abuzzcode_b span.ui-icon {
    margin: 0 5px 0 0;
    position: absolute;
    left: .2em;
    top: 50%;
    margin-top: -8px;
    zoom: 1;
}

/* about.php */

div#about {
    float: left;
    width: 38em;
    height: 11em;
    margin: 1em 0 0 1.5em;
    font-size: 10px;
    overflow: auto;
    color: #cccccc;
}

div#phpprojectbrowserholder {
    margin: 1em 1em 0 0;
    float: right;
    width: 16em;
    height: 40em;
    overflow: hidden;
}

/* footer.php */

div#footer {
    width: 100%;
    clear: both;
    padding: 1.5em 0 0 0;
    text-align: left;
    height: 10em;
    background-color: rgba(58, 27, 21, 0.5);
    box-shadow: inset 0 5px 8px #000;
    -webkit-box-shadow: inset 0 5px 8px #000;
    -moz-box-shadow: inset 0 5px 8px #000;
}

div#footer img {
    padding-left: 0.8em;
}

/* contact.php */

div#contactform {
    border: 1px solid #3F3F3F;
    padding: .4em;
    width: 85%;
}

div#contactform input, textarea, select {
    font-family: 'GillSansMT', sans-serif;
    font-size: 10px;
    border: 1px #3F3F3F dotted;
    background-color: #ffffff;
    /* for IE */
    filter:alpha(opacity=40);
    /* CSS3 standard */
    opacity: 0.4;
}

input#txt_Name {
    width: 15em;
}

input#txt_Email {
    width: 15em;
}

div.row {
    margin: 0 0 4px 0;
    padding: 5px 0;
}
div.row label {
    display: block;
    font-weight: bold;
}

div.messagebar {
    position: absolute;
    margin: 0;
    top: 0;
    left: 0;
    color: #FF0000;
    padding: 0.3em 0 0.3em 0.3em;
    width: 100%;
    border: #3F3F3F 1px solid;
    background-color: #ffffff;
    overflow: hidden;
    /* for IE */
    filter:alpha(opacity=60);
    /* CSS3 standard */
    opacity: 0.6;
}

/* Reference */

/*
box-shadow: 5px 5px 15px #000;
-webkit-box-shadow: 5px 5px 15px #000;
-moz-box-shadow: 5px 5px 15px #000;
*/