html {
    background-color:   #3d3d3d;
}

body {
    background-color:   #3d3d3d;
    font-family:        "Segoe UI", "Tahoma", "Verdana", "Arial", serif;
    font-size:          62.5%;
    color:              #ffffff;
}

h1 {
    color:          #3369b3;
    font-size:      3.2em;
    padding:        20px 0 20px 60px;
    font-weight:    bold;
}

h1.homepage {
    font-size:      4.8em;
    padding-top:    150px;   
    text-shadow: #ffffff 1px 1px 2px;
}

h2 {
    font-size:      1.6em;
    color:          #ffffff;
    padding:        30px 0 5px 0;   
    font-weight:    bold;
}

h2.leftmost {
    padding-left:   60px;   
}

p {
    font-size:      1.4em; 
    color:          #3369b3;  
    padding:        0 30px 10px 60px;
    line-height:    1.4em;
}

p.header {
    font-weight:    bold;   
}

a {
    color:      #94c1ff;
    text-decoration:    none;   
}

a:hover {
    color:      #b4e1ff;
    text-decoration:    underline;   
}

strong {
    font-weight:    bold;   
}

/* Layout definitions */

#container {
    margin:         10px auto 10px auto;
    width:          960px;   
}

#header {
    width:          100%;
    height:         135px;
    background-color:   #ffffff;   
}

    #header #logo {
        width:      300px;
        height:     135px;
        float:      left;   
    }
    
    #header #logo p {
        padding:        0;
        margin:         0;   
    }
    
    #header #strapline {
        width:      660px;
        float:      left;   
        text-align: right;
    }
    
    #header #strapline ul {
        text-align:     right;
        margin:         -5px 60px 0 0;
    }
    
    #header #strapline ul li {
        float:          right;
        padding:        10px 0 10px 20px;
        color:          #e26b5c;   
        font-size:      1.6em;
        font-weight:    bold;
    }
    
    #header #strapline a {
        color:          #e26b5c;
        font-weight:    bold;
        text-decoration:    none;   
    }
    
    #header #strapline p {
        padding:    50px 60px 0 0;
        color:      #94c1ff;
        font-weight:    bold;
        font-size:      1.6em;
    }

#content {
    width:          100%;
    background-color:   #94c1ff;   
    border-bottom:      2px solid #ffffff;
    background-image:   url(/content/images/bg_content.jpg);
}

    .contentwrapper {
        background-image:   url(/content/images/contentwrapper.png);   
        background-repeat:  repeat-x;
    }
    
    .homepagewrapper {
        background-image:   url(/content/images/Homepage/mainbanner01.png);   
        background-repeat:  no-repeat;
    }

#footer {
    width:          100%;
    background-color:   #3369b3;  
    border-bottom:      1px solid #94c1ff; 
    padding-bottom:     20px;
}

#footer ul {
    padding:        0 0 35px 0;   
    margin:         0 0 0 0;
}

#footer ul.leftmost {
    padding-left:   60px;   
}

#footer ul li {
    font-size:      1.2em;
    padding:        0 0 5px 0;   
    margin:         0 0 0 0;
}

#footer ul li.on a {
    text-decoration:    none;
    color:              #3369b3;  
    background-color:   #94c1ff;
    border-radius:      3px;
    padding:            0 5px 0 5px;
    margin:             0 0 0 -5px;
}

#footer #tweet ul {
    padding-bottom:      13px; 
    padding-right:      30px;  
}

#footer li.twitter {
    background-image:   url(/content/images/icon_twitter.jpg);   
    background-repeat:  no-repeat;
    padding-left:       25px;
}

#footer li.facebook {
    background-image:   url(/content/images/icon_facebook.jpg);   
    background-repeat:  no-repeat;
    padding-left:       25px;
}

            

#copyright {
    width:          100%;
    background-color:   #323232;
    border-bottom:      1px solid #636363;   
}

    #copyright ul {
        padding:        0 0 0 60px;
    }

        #copyright ul li {
            float:      left;
            padding:    10px 20px 5px 0;
            color:              #aaaaaa;
            font-size:          1.1em;
        }

            #copyright ul li a {
                font-weight:    bold;
                text-decoration:    underline;   
                color:              #aaaaaa;
            }
            
    #copyright p {
        font-size:      1.0em;
        color:          #aaaaaa;
        font-weight:    bold;
        padding:        0 0 10px 60px;   
    }
    
    #copyright a {
        text-decoration:    underline;  
        color:  #aaaaaa; 
    }
    
    #terms {
        width:          100%;   
    }
    
    #terms ul {
        padding:        10px 60px 10px 60px;   
    }
    
    #terms ul li {
        color:          #636363;
        font-size:      1.0em;
        float:          left;
        padding:        0 20px 0 0;
    }
    
    #terms ul li a {
        color:          #636363;
        text-decoration:    underline;
    }



/* Fixes */

.clearFix {
    clear:      both;   
}


.col {
    float:      left;   
}

.colinnerservices {
    width:      230px;   
}
.colinneraboutus {
    width:      160px;   
}
.colinnertwitter {
    width:      300px;   
}
.colinnerlatestwork {
    width:      260px;   
}

.colinnerlatestwork p {
    color:      #ffffff;
    padding:    0 50px 0 0; 
    font-weight:    bold;  
}

.colinnerlatestwork p img {
    border:     2px solid #94c1ff; 
    margin-left:    -2px;  
}

.colinnerlatestwork a {
    font-weight:    normal;
    font-size:  0.8em; 
}


ul.homepage {
   text-align:      right;
   padding:         170px 0 0 105px; 
   margin:          0;
}

ul.homepage li {
    color:      #3369b3;
    font-weight:    bold;
    font-size:      1.8em;
    padding:        0 0 0 0;
    text-shadow: #ffffff 1px 1px 2px;
}

div.colcontent {
    width:      690px;   
    float:      left;
    padding-bottom: 20px;
}

div.colcontent a {
    color:      #e26b5c;
    text-decoration:    underline;  
    font-weight:        bold;
}

div.colimage {
    width:      270px;
    float:      left;   
}

div.colimage p {
    padding:    40px 0 10px 0;
}

div.colimage p img {
    border:     2px solid #ffffff; 
    margin-left:    -2px;  
}

div.colfoliotext {
    width:          390px;   
}

div.colfoliotext a {
    color:      #e26b5c;
    text-decoration:    underline; 
    font-weight:    bold;
}

div.colfoliotext h2 {
    color:      #3369b3;
    font-weight:        bold;
    padding:            0 0 10px 60px;
}

div.colfoliotext h3 {
    color:      #3369b3;
    font-weight:        bold;
    padding:            0 0 2px 60px;
    font-size:          1.4em;
}

div.colfoliotext ul {
    margin:            0 0 10px 60px;
}

div.colfoliotext li {
    color:              #3369b3;
    font-size:          1.2em;
    padding-left:       22px;
    padding-bottom:     6px;
    background-image:   url(/content/images/accept.png);
    background-repeat:  no-repeat;
}

div.colfolioimage {
    width:          570px;   
}

div.colfolioimage img {
    border:     2px solid #ffffff; 
    margin-left:    -2px;     
}



ul.portfolioindex {
    margin:         0 0 30px 0;
}

ul.portfolioindex li {
    float:      left;
    margin:     0 31px 30px 0;   
    padding:    0;
}


#map_canvas {
    width:      510px;
    height:     300px;   
    border:     2px solid #ffffff;
    margin-left:    -2px;
    margin-bottom:  30px;
}


label {
    float:          left;
    text-align:     right;
    width:          150px;
    font-size:      1.4em;
    font-weight:    bold;
    color:          #3369b3;  
    padding:        5px;
    margin:         0 10px 10px 0; 
}

input[type="text"] {
    padding:        5px;
    float:          left;
    font-size:      1.4em;
    color:          #3369b3;
    width:          250px;
    margin:         0 0 10px 0;
}

textarea {
    padding:        5px;
    float:          left;
    font-size:      1.4em;
    color:          #3369b3;
    width:          330px;
    font-family:    inherit;
    margin:         0 0 10px 0;
}

input[type="submit"] {
    padding:        5px;
    float:          left;
    font-size:      1.4em;
    margin:         0 0 40px 170px;
}

p.errormessage {
    background-color:   #ffaaaa;  
    padding:            10px;
    margin:             0 30px 10px 30px;
    color:              #c10000;
    border:             1px solid #c10000;
    font-weight:        bold; 
}

p.successmessage {
    background-color:   #aaccaa;  
    padding:            10px;
    margin:             0 30px 10px 30px;
    color:              #009900;
    border:             1px solid #009900;
    font-weight:        bold; 
}