/* -------------------------------------------------------------- 
   
   base.css
   * Default stylesheet for the website
  
-------------------------------------------------------------- */

/* Headings
-------------------------------------------------------------- */

@import url(reset.css);
@import url(typography.css);

body
{
    background-color: #272822;
    color: #f8f8f2;
    background-repeat: repeat-x;
    margin-top: 110px;
}

h1
{
    font-size: 4em;
    font-weight: normal;
    letter-spacing: 0.2em;
    font-family: Georgia, Times, serif;
}

h2
{
    font-weight: normal;
    border-bottom: 2px solid #646757;
    margin-bottom: 0.4em;
    letter-spacing: 0.2em;
    font-family: Georgia, serif;
    clear: both;
}

h3
{
    margin: 0;
    font-size: 1.2em;
    font-weight: bold;
    color: #868979;
}

#leftColumn h3
{
    font-size: 1.0em;
    
}

span
{
    color: #646757;
    font-weight: bold;
}

ul ul
{
    margin: 0;
}

ul
{
    list-style-type: none;
}

li
{
    margin-bottom: 0.25em;
}

ul ul li
{
    margin: 0;
}

.list
{
    list-style-type: square;
}

#workList img
{
    float: left;
    clear: left;
}

#workList li
{
    /*clear: both;*/
}

#workList p
{
    margin-left: 160px;
}

a, a:link, a:visited
{
    text-decoration: none;
}

a:hover, a:active
{
    text-decoration: underline;
}

hr
{
    border: 0;
    clear: both;
}



#middleColumn a, #middleColumn a:link, #middleColumn a:visited
{
    display: inline-block;
    width: 40px;
    height: 40px;
    margin: 5px;
}

#middleColumn a:hover, #middleColumn a:active
{
    width: 50px;
    height: 50px;
    margin: 0px;
}

#wrapper
{
    width: 80%;
    margin: 0 auto;
}

#container .column
{
    float: left;
}

#footer
{
    clear: both;
}

#leftColumn
{
    width: 35%;
    padding-right: 7%;
}

#middleColumn
{
    width: 8%;
}

#middleColumn ul
{
    margin: 0;
    margin-top: 0.75em;
}

#rightColumn
{
    width: 50%;
}

/** COLORS **/

#colorBlue
{
    background-color: #1fa9f3;
}

#colorGreen
{
    background-color: #7fe22b;
}

#colorOrange
{
    background-color: #ff6600;
}

#colorRed
{
    background-color: #ff2400;
}

#colorPurple
{
    background-color: #ae81ff;
}

#colorYellow
{
    background-color: #ffdc00;
}

#colorWhite
{
    background-color: #ffffff;
}

/**
    BLUE
**/
body#blue h1, body#blue h2, body#blue a:hover, body#blue a:active
{
    color: #1fa9f3;
}

body#blue a, body#blue a:link, body#blue a:visited
{
    color: #1a91e5;
}

body#blue
{
    background-image: url(../images/layout/header-blue.gif);
}

/**
    GREEN
**/
body#green h1, body#green h2, body#green a:hover, body#green a:active
{
    color: #7fe22b;
}

body#green a, body#green a:link, body#green a:visited
{
    color: #6ccc25;
}

body#green
{
    background-image: url(../images/layout/header-green.gif);
}

/**
    ORANGE
**/
body#orange h1, body#orange h2, body#orange a:hover, body#orange a:active
{
    color: #ff6600;
}

body#orange a, body#orange a:link, body#orange a:visited
{
    color: #ff5700;
}

body#orange
{
    background-image: url(../images/layout/header-orange.gif);
}

/**
    RED
**/
body#red h1, body#red h2, body#red a:hover, body#red a:active
{
    color: #ff2400;
}

body#red a, body#red a:link, body#red a:visited
{
    color: #ff1f00;
}

body#red
{
    background-image: url(../images/layout/header-red.gif);
}

/**
    PURPLE
**/
body#purple h1, body#purple h2, body#purple a:hover, body#purple a:active
{
    color: #ae81ff;
}

body#purple a, body#purple a:link, body#purple a:visited
{
    color: #966eff;
}

body#purple
{
    background-image: url(../images/layout/header-purple.gif);
}

/**
    YELLOW
**/
body#yellow h1, body#yellow h2, body#yellow a:hover, body#yellow a:active
{
    color: #ffdc00;
}

body#yellow a, body#yellow a:link, body#yellow a:visited
{
    color: #ffc500;
}

body#yellow
{
    background-image: url(../images/layout/header-yellow.gif);
}

/**
    WHITE
**/
body#white h1, body#white h2, body#white a:hover, body#white a:active
{
    color: #ffffff;
}

body#white a, body#white a:link, body#white a:visited
{
    color: #cccccc;
    text-decoration: underline;
}

body#white
{
    background-image: url(../images/layout/header-white.gif);
}