/*
    Think Faces - Main pages style sheet.
    Build: October 2009
    Magic House
*/


/* Zero elements for browser compatibility */
html, body, ul, ol, li, p, h1, h2, h3, h4, h5, h6, form, fieldset
{
    margin: 0;
    padding: 0;
}

/* Style main page elements */
body 
{
    background-color:#000;
    font-family:Arial;
    color:#FFF;
    font-size:14px;
    padding-bottom:50px;
}
img 
{
    border:none;
}
h1 
{
    font-size:16px;
}
p 
{
    color:#E6E6E6;
}
a 
{
    outline:none; /* Remove Firefox outline */
    text-decoration:none;
    color:#00A2EF;
}

/* Structural elements */
#wrapper 
{
    width:960px;
    margin-left:auto;
    margin-right:auto;
}
#header
{
}
#flashLogo 
{
    width:232px;
    height:210px;
    background-image:url(../images/logos/main_logo_cyan.jpg);
    background-repeat:no-repeat;
    float:left;
    padding-bottom:20px; /* Used to pad header from main content */
}


        /* Navigation styling */
        #navigation 
        {
            width:150px;
            padding-top:26px;
            float:left;
        }
        #navigation ul
        {
            list-style:none;
            line-height:20px;
        }
        #navigation ul li a
        {
            color:#FFF;
            font-size:12px;
            text-decoration:none;
        }
        #navigation ul li a:hover
        {
            color:#01A1EF;
        }
        #nav_home 
        {
            padding-left:4px;
        }
        #nav_about 
        {
            padding-left:10px;
        }
        #nav_case 
        {
            padding-left:14px;
        }
        #nav_profiles 
        {
            padding-left:15px;
        }
        #nav_apply 
        {
            padding-left:14px;
        }
        #nav_staff 
        {
            padding-left:8px;
        }
        #nav_contact 
        {
            padding-left:0px;
        }
        /* Highlight navigation according to page */
        body.home #nav_home a,
        body.about #nav_about a,
        body.case #nav_case a,
        body.profiles #nav_profiles a, 
        body.apply #nav_apply a,
        body.staff #nav_staff a,
        body.contact #nav_contact a
        {
            color:#01A1EF;
            font-size:12px;
            text-decoration:none;
        }
        /* End navigation styling */
        
        
#buttons 
{
    float:right;
    text-align:right;
}
#share 
{
    padding-top:18px;
}
#content 
{
    clear:both;
    padding-bottom:50px;
}
#mainContentProse 
{
    padding:50px 175px 50px 0px;
    margin-left:165px;
}
#contactForm 
{
    padding:50px 175px 50px 0px;
    margin-left:165px;
}
#footerLines 
{
    clear:both;
    text-align:center;
}
#footerPoweredBy 
{
    width:960px;
    margin-left:auto;
    margin-right:auto;
    text-align:right;
}
#viewDifferentFace a 
{
    color:#FFF;
    padding-left:10px;
}
#returnToJobsBoard a 
{
    color:#FFF;
}
#applyOnlineForm 
{
    padding-left:50px;
    padding-top:20px;
    padding-bottom:20px;
    font-size:12px;
}
    #applyOnlineForm td 
    {
        padding-bottom:4px;
    }
#roundedCorners
{
    background-color:#343434;
    margin-left:115px;
}
#jobBoardContainer 
{
    padding:20px;
}
    #jobBoardContainer table td
    {
        vertical-align:top;
    }
#login 
{
    width:422px;
    margin-left:auto;
    margin-right:auto;
    border:solid 1px #FFF;
    margin-bottom:75px;
}
    #login h1 
    {
        font-size:25px;
        color:#FFF200;
        font-weight:normal;
    }
    .loginText
    {
        color:#999;
    }
    .loginTextBox 
    {
        width:310px;
        background-color:#333333;
        border:none;
        color:#FFF;
    }
    .loginButton 
    {
        padding-top:5px;
    }
    
/* Classes */
.shareButtonSpacing 
{
    padding-left:5px;
}
.strap 
{
    padding-top:10px;
}
.left_image_headings 
{
    float:left;
}
.floatClear 
{
    clear:both;
}
.cyanBold 
{
    color:#00A2EF;
    font-weight:bold;
}
.magentaBold
{
    color:#FF007A;
    font-weight:bold;
}
.yellowBold 
{
    color:#FFF200;
    font-weight:bold;
}
.contactTable td
{
    vertical-align:top;
}
.contactTable td p 
{
    padding-top:4px;
}
.contactTextBox 
{
    border-style: none;
    border-color: inherit;
    border-width: medium;
    background-color:#999;
    width:450px;
    margin:4px 0 4px 0px;
}
.contactDropDown
{
    border:none;
    background-color:#999;
    margin:4px 0 4px 0;
}
.contactButton 
{
    margin:4px 0 4px 0;
}
.contactTelNumber 
{
    font-size:20px;
}
.contactLink 
{
    color:#00A2EF;
    text-decoration:none;
}
.jobBoardHeaderCyan
{
    color:#00A2EF;
}
.jobBoardHeaderMagenta
{
    color:#FF007A;
}
.jobBoardHeaderYellow
{
    color:#FFF200;
}
.youHaveAppliedCyan 
{
    color:#00A2EF;
    font-size:10px;
    font-weight:bold;
}
.youHaveAppliedMagenta 
{
    color:#FF007A;
    font-size:10px;
    font-weight:bold;
}
.youHaveAppliedYellow
{
    color:#FFF200;
    font-size:10px;
    font-weight:bold;
}


        /* Main content settings */
        .weAreFaces_main_content
        {
            background-image:url(../images/backgrounds/face_background.gif);
            background-position:top right;
            background-repeat:no-repeat;
        }
        /* .bands_main_content
        {
            background-image:url(../images/backgrounds/bands_background.gif);
            background-position:top right;
            background-repeat:no-repeat;
        } */
        .become_main_content
        {
            background-image:url(../images/backgrounds/face_background.gif);
            background-position:top right;
            background-repeat:no-repeat;
        }
        .contact_main_content 
        {
            background-image:url(../images/backgrounds/face_background.gif);
            background-position:top right;
            background-repeat:no-repeat;
        }


        /* Classes for footers */
        .footer_face_line_all 
        {
            background-image:url(../images/footers/footer_line_all_bg.jpg);
        }
        .footer_face_line_cyan 
        {
            background-image:url(../images/footers/footer_line_cyan_bg.jpg);
        }
        .footer_face_line_magenta 
        {
            background-image:url(../images/footers/footer_line_magenta_bg.jpg);
        }
        .footer_face_line_yellow 
        {
            background-image:url(../images/footers/footer_line_yellow_bg.jpg);
        }
        
        
        /* Image border classes */
        /* NOTICE THAT COLOUR BEGINS LOWERCASE - THIS WAS DONE WHEN AMENDING LINKS TO PROFILES FROM HOME PAGE */
        img.cyanHomeBorder
        {
            border:#00A2EF;
            padding:6px;
            margin:3px;
        }
        img.magentaHomeBorder
        {
            border:#FF007A;
            padding:6px;
            margin:3px;
        }
        img.yellowHomeBorder
        {
            border:#FFF200;
            padding:6px;
            margin:3px;
        }
        img.CyanSelectBorder
        {
            border:#00A2EF;
            padding:6px;
            margin:3px;
        }
        img.MagentaSelectBorder
        {
            border:#FF007A;
            padding:8px;
            margin:2px;
        }
        img.YellowSelectBorder
        {
            border:#FFF200;
            padding:6px;
            margin:3px;
        }
        
        
        /* Styling profile layout */
        .greyProfileDetails 
        {
            font-weight:bold;
            font-size:14px;
            color:#999;
            text-transform:uppercase;
        }
        .greyProfileProse 
        {
            color:#999;
        }
        img.CyanProfile 
        {
            border:#00A2EF;
            padding:20px;
        }
        h1.CyanProfile 
        {
            font-weight:normal;
            font-size:20px;
            color:#00A2EF;
            text-transform:uppercase;
        }
        h2.CyanProfile 
        {
            font-weight:bold;
            display:inline;
            font-size:14px;
        }
        img.MagentaProfile 
        {
            border:#FF007A;
            padding:20px;
        }
        h1.MagentaProfile 
        {
            font-weight:normal;
            font-size:20px;
            color:#FF007A;
            text-transform:uppercase;
        }
        h2.MagentaProfile 
        {
            font-weight:bold;
            display:inline;
            font-size:14px;
        }
        img.YellowProfile 
        {
            border:#FFF200;
            padding:20px;
        }
        h1.YellowProfile 
        {
            font-weight:normal;
            font-size:20px;
            color:#FFF200;
            text-transform:uppercase;
        }
        h2.YellowProfile 
        {
            font-weight:bold;
            display:inline;
            font-size:14px;
        }
        
        /* Case Study */
        .caseStudySelectClient
        {
            font-weight:bold;
            font-size:14px;
            color:#FFF200;
            text-transform:uppercase;
        }
        .caseStudySelectEvent
        {
            font-weight:bold;
            font-size:14px;
            color:#FF0068;
            text-transform:uppercase;
        }
        .caseStudyHeadingClient 
        {
            font-size:25px;
            font-weight:normal;
            color:#FFF200;
            text-transform:uppercase;
        }
        .caseStudyHeadingEvent 
        {
            font-size:25px;
            font-weight:normal;
            color:#FF007A;
            text-transform:uppercase;
        }
        .caseStudyHeadingDetail 
        {
            font-weight:bold;
            color:#FFF;
            display:inline;
        }

/* From application CSS */
.textBlue 
{
    color:#00AEEF;
}
.textPink 
{
    color:#EC008C;
}
.textYellow
{
    color:#FFF200;
}