﻿body
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11pt;
}

/* << ----------------// Container Styles //---------------->> */
div#container
{
    margin: 8px auto 8px auto;
    width: 960px;
}

/* << ----------------// Header Styles //---------------->> */
div#header
{
    margin: 0 auto;
    padding: 8px;
}

/* << ----------------// Wrapper Styles //---------------->> */
div#wrapper
{
    margin: 0 auto;
    width: 100%;
}

/* << ----------------// Content Styles //---------------->> */
div#content
{
    float: left;
    width: 672px;
    padding: 8px;
}

/* << ----------------// Sidebar Styles //---------------->> */
div#sidebar
{
    float: right;
    width: 256px;
    padding: 8px;
}

/* << ----------------// Container Footer Styles //---------------->> */
div#footer
{
    margin: 0 auto;
    padding: 8px;
}



h1
{
    margin-top: 20px;
    margin-bottom: 16px;
    padding: 4px 0 0 20px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 26pt;
    font-weight: lighter;
    color: #0053A0;
    border-top: 1px solid #0053A0;
}

h1.about
{
    color: #da2420;
    border-top: 1px solid #da2420;
}

h1.members
{
    color: #89c33f;
    border-top: 1px solid #89c33f;
}

h1.students
{
    color: #29a8df;
    border-top: 1px solid #29a8df;
}

h1.agents
{
    color: #f8ad3b;
    border-top: 1px solid #f8ad3b;
}

h1.employers
{
    color: #b662a9;
    border-top: 1px solid #b662a9;
}

/* Top Navigation */
div#topNav
{
    font-family: Verdana, Geneva, sans-serif;
    font-size: 8pt;
    color: #999999;
    padding: 0 8px 0 8px;
    margin-bottom: 16px;
}

div#topNav ul
{
    float: right;
}

div#topNav ul li
{
    display: inline;
    border-left: solid 1px #999999;
    padding: 0 5px 0 8px;
}

div#topNav ul li:first-child, li.first_child
{
    border: 0;
}

div#topNav a
{
    font-size: 8.5pt;
    color: #777777;
    text-decoration: none;
}

div#topNav a:hover
{
    color: #e12e29;
    text-decoration: underline;
}

/* Header Logo */
div#headerLogo
{
    padding: 0 8px 0 8px;
}

div#headerLogo .weukLogo
{
    margin: auto 0;
    margin-right: 12px;
    float: left;
}

div#headerLogo .strapline
{
    margin: auto 0;
    float: left;
}

div#headerLogo .eukLogo
{
    margin: auto 0;
    float: right;
}

/* Home Slides */
#homeSlides
{
    width: 660px;
    height: 350px;
    margin: 0 2px;
}

#homeSlides .loading
{
    /*background: url(Images/loading.gif) no-repeat center center;*/
}

/* Home Navigation */
div#homeNav
{
    margin: 0 2px;
    width: 660px;
    margin-bottom: 16px;
}

div#homeNav ul
{
    float: left;
    padding-bottom: 6px;
}

div#homeNav ul li
{
    float: left;
}

div#homeNav a
{
    float: left;
    display: block;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12pt;
    font-weight: bold;
    padding: 6px 20px;
    text-decoration: none;
    text-align: center;
    width: 92px;
}

div#homeNav a.about
{
    color: #da2420;
    background-color: #f8d3d2;
    border-top: 4px solid #da2420;
    border-bottom: 2px solid #f8d3d2;
}

div#homeNav a.about:hover
{
    border-bottom: 2px solid #da2420;
}

div#homeNav a.employers
{
    color: #b662a9;
    background-color: #f0e0ee;
    border-top: 4px solid #b662a9;
    border-bottom: 2px solid #f0e0ee;
}

div#homeNav a.employers:hover
{
    border-bottom: 2px solid #b662a9;
}

div#homeNav a.members
{
    color: #89c33f;
    background-color: #e7f3d9;
    border-top: 4px solid #89c33f;
    border-bottom: 2px solid #e7f3d9;
}

div#homeNav a.members:hover
{
    border-bottom: 2px solid #89c33f;
}

div#homeNav a.students
{
    color: #29a8df;
    background-color: #d4eef9;
    border-top: 4px solid #29a8df;
    border-bottom: 2px solid #d4eef9;
}

div#homeNav a.students:hover
{
    border-bottom: 2px solid #29a8df;
}

div#homeNav a.agents
{
    color: #f8ad3b;
    background-color: #feefd8;
    border-top: 4px solid #f8ad3b;
    border-bottom: 2px solid #feefd8;
}

div#homeNav a.agents:hover
{
    border-bottom: 2px solid #f8ad3b;
}

/* Header Navigation */
div#headerNav
{
    margin: 0 auto;
    width: 660px;
}

div#headerNav ul
{
    float: left;
    padding-bottom: 6px;
}

div#headerNav ul li
{
    float: left;
}

div#headerNav a
{
    float: left;
    display: block;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12pt;
    font-weight: bold;
    padding: 6px 20px;
    text-decoration: none;
    text-align: center;
    width: 92px;
}

div#headerNav a.about
{
    color: #da2420;
    background-color: #f8d3d2;
    border-top: 4px solid #da2420;
    border-bottom: 2px solid #f8d3d2;
}

div#headerNav a.about:hover
{
    border-bottom: 2px solid #da2420;
}

div#headerNav a.employers
{
    color: #b662a9;
    background-color: #f0e0ee;
    border-top: 4px solid #b662a9;
    border-bottom: 2px solid #f0e0ee;
}

div#headerNav a.employers:hover
{
    border-bottom: 2px solid #b662a9;
}

div#headerNav a.members
{
    color: #89c33f;
    background-color: #e7f3d9;
    border-top: 4px solid #89c33f;
    border-bottom: 2px solid #e7f3d9;
}

div#headerNav a.members:hover
{
    border-bottom: 2px solid #89c33f;
}

div#headerNav a.students
{
    color: #29a8df;
    background-color: #d4eef9;
    border-top: 4px solid #29a8df;
    border-bottom: 2px solid #d4eef9;
}

div#headerNav a.students:hover
{
    border-bottom: 2px solid #29a8df;
}

div#headerNav a.agents
{
    color: #f8ad3b;
    background-color: #feefd8;
    border-top: 4px solid #f8ad3b;
    border-bottom: 2px solid #feefd8;
}

div#headerNav a.agents:hover
{
    border-bottom: 2px solid #f8ad3b;
}

/* Footer Navigation */
div#footerNav
{
    font-family: Verdana, Geneva, sans-serif;
    font-size: 8pt;
    color: #999999;
    padding: 8px;
    margin-bottom: 16px;
    border: dotted 1px #999;
    text-align: center;
}

div#footerNav ul
{
}

div#footerNav ul li
{
    display: inline;
    padding: 6px 6px 0 18px;
    background: url(Images/bullet.gif) no-repeat left center;
}

div#footerNav ul li:first-child, li.first_child
{
    background: none;
}

div#footerNav a
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 10pt;
    color: #0053a0;
    text-decoration: none;
}

div#footerNav a:hover
{
    color: #e12e29;
    text-decoration: underline;
}

/* Partners */
div#partners
{
    font-family: Verdana, Geneva, sans-serif;
    font-size: 8pt;
    color: #999;
    margin-bottom: 16px;
    text-align: center;
}

div#partners p
{
    padding: 8px 0 8px 0;
}

div#partners img
{
    margin: 0 6px 0 6px;
}

/* Bottom Navigation */
div#bottomNav
{
    font-family: Verdana, Geneva, sans-serif;
    font-size: 8pt;
    color: #999;
    padding: 0 8px 0 8px;
    text-align: center;
}

div#bottomNav ul
{
}

div#bottomNav ul li
{
    display: inline;
    border-left: solid 1px #999;
    padding: 0 5px 0 8px;
}

div#bottomNav ul li:first-child, li.first_child
{
    border: 0;
}

div#bottomNav a
{
    font-size: 8.5pt;
    color: #777;
    text-decoration: none;
}

div#bottomNav a:hover
{
    color: #e12e29;
    text-decoration: underline;
}

/* Side Navigation */
div#sideNav
{
    font-family: Verdana, Geneva, sans-serif;
    font-size: 8pt;
    float: left;
    margin: 0 12px 12px 0;
    width: 200px;
}

div#sideNav ul
{
}

div#sideNav ul li
{
    border-top: dotted 1px #999;
    padding: 3px;
}

div#sideNav ul li:first-child, li.first_child
{
    border: 0;
}

div#sideNav ul li a
{
    font-family: Arial, Helvetica, sans-serif;
    color: #0053A0;
    text-decoration: none;
    font-weight: bold;
    border-left: 6px solid #cccccc;
    margin-left: 6px;
    padding: 2px;
    padding-left: 8px;
}

div#sideNav ul li a:hover
{
    text-decoration: underline;
    border-left: 6px solid #0053A0;
}



div#sideNav ul.about
{
    list-style-image: none;
}

div#sideNav ul.about li a
{
    color: #da2420;
}

div#sideNav ul.about li a:hover
{
    border-left: 6px solid #da2420;
}

div#sideNav ul.members
{
    list-style-image: none;
}

div#sideNav ul.members li a
{
    color: #89c33f;
}

div#sideNav ul.members li a:hover
{
    border-left: 6px solid #89c33f;
}

div#sideNav ul.students
{
    list-style-image: none;
}

div#sideNav ul.students li a
{
    color: #29a8df;
}

div#sideNav ul.students li a:hover
{
    border-left: 6px solid #29a8df;
}

div#sideNav ul.agents
{
    list-style-image: none;
}

div#sideNav ul.agents li a
{
    color: #f8ad3b;
}

div#sideNav ul.agents li a:hover
{
    border-left: 6px solid #f8ad3b;
}

div#sideNav ul.employers
{
    list-style-image: none;
}

div#sideNav ul.employers li a
{
    color: #b662a9;
}

div#sideNav ul.employers li a:hover
{
    border-left: 6px solid #b662a9;
}

div#sideNav.admin
{        
    width: auto;
}

div#sideNav.admin ul li
{
    border-bottom: dotted 1px #999;
    border-top: 0;
    display: inline-block;
}

/* Introduction */
div#intro
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12pt;
    color: #333333;
    line-height: 16pt;
    margin-bottom: 24px;
}

div#intro p
{
    margin-bottom: 16px;
}

div#intro a
{
    font-family: Arial, Helvetica, sans-serif;
    color: #0053A0;
    text-decoration: none;
}

div#intro a:hover
{
    text-decoration: underline;
}

div#intro span.attention
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14pt;
    font-weight: bold;
    color: #da2420;
}

div.points
{
    overflow: hidden;
}

div.points ul
{
    list-style-image: url(Images/bullet.gif);
    margin-left: 24px;
    margin-bottom: 16px;
}

div.points ul li
{
}

div.points ol
{
    list-style-type: decimal;
    margin-left: 24px;
    margin-bottom: 16px;
}

#address
{
    float: left;
}

#address h2
{
    font-size: 11pt;
    margin-bottom: 16px;
}

#address p
{
    font-size: 11pt;
    line-height: 20pt;
}

#address label
{
    font-weight: bold;
}

#googleMap
{
    float: right;
}

#googleMap a
{
    font-size: 8pt;
}

/* Section */
div.section
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 10pt;
    color: #333333;
    line-height: 14pt;
    margin-bottom: 16px;
}

div.section h2
{
    margin-bottom: 16px;
    padding: 0 0 4px 4px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12pt;
    font-weight: bold;
    color: #0053A0;
    border-bottom: 1px solid #0053A0;
}

div.section p
{
    margin-bottom: 16px;
}

div.section ul
{
    list-style-image: url(Images/bullet.gif);
    margin-left: 24px;
    margin-bottom: 16px;
}

div.section ul li
{
}

div.section ol
{
    list-style-type: decimal;
    margin-left: 24px;
    margin-bottom: 16px;
}

div.section a
{
    font-family: Arial, Helvetica, sans-serif;
    color: #0053A0;
    text-decoration: none;
}

div.section a:hover
{
    text-decoration: underline;
}

div.section blockquote
{
    padding-left: 32px;
}

div.section blockquote h3
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 10pt;
    font-weight: bold;
}

div.section blockquote p
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 9pt;
}

div.section a.backToTop
{
    font-family: Arial, Helvetica, sans-serif;
    display: block;
    font-size: 8pt;
    color: #0053A0;
    text-decoration: none;
    float: right;
}

div.section a.backToTop:hover
{
    text-decoration: underline;
}

div.leftSection
{
    float: left;
    width: 328px;
    margin-right: 8px;
}

div.rightSection
{
    float: right;
    width: 328px;
    margin-left: 8px;
}

/* Box */
div.box
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 9pt;
    padding: 4px;
    margin-bottom: 10px;
}

div.box h3
{
    margin: 3px 0 3px 0;
    font-size: 11pt;
    font-weight: bold;
}

div.boxContent
{
    padding: 6px;
    font-size: 8pt;
}

div.boxContent h3
{
    font-weight: bold;
    margin-top: 4px;
    margin-bottom: 6px;
}

/* Latest News Box */
div#latestNewsBox
{
    background-color: #0053a0;
}

div#latestNewsBox h2
{
    color: #ffffff;
}

div#latestNewsBox div.boxContent
{
    background-color: #ffffff;
}

/* Search Box */
div#searchBox
{
    background-color: #0053a0;
}

div#searchBox h3
{
    color: #fff;
}

div#searchBox div.boxContent
{
    background-color: #fff;
}

div#searchBox select
{
    font: 11px/1.0 Verdana, Geneva, sans-serif;
}

/* Latest News Box */
div#latestNewsBox
{
    background-color: #0053a0;
}

div#latestNewsBox h3
{
    color: #fff;
}

div#latestNewsBox div.boxContent
{
    background-color: #fff;
}

.scrollable-vertical
{
    /* required settings */
    position: relative;
    overflow: hidden; /* vertical scrollers have typically larger height than width */
    height: 120px;
    width: 236px;
}

.items
{
    position: absolute; /* this time we have very large space for height */
    height: 20000em;
}

.items div
{
    height: 120px;
}

.items div h4
{
    font-size: 12px;
    margin: 3px 0 3px 0;
}

/* Member Info Box */
div#memberInfoBox
{
    background-color: #0053a0;
}

div#memberInfoBox h3
{
    color: #fff;
}

div#memberInfoBox div.boxContent
{
    background-color: #fff;
}

/* Enquiry Form */
div#enquiryForm div.formField
{
    padding: 4px;
    padding-left: 224px;
    margin-bottom: 2px;
    background-color: #ccddee;
}

div#enquiryForm div.formField label.formLabel
{
    font-weight: bold;
    text-align: right;
    float: left;
    margin-left: -224px;
    width: 216px;
}

.attention
{
    color: #da2420;
    font-weight: bold;
}

/* Events */
.events
{
    width: 100%;
}

.event
{
    padding: 6px;
    vertical-align: top;
    width: 50%;
}

/* Buttons */
.button
{
    background-color: #e12e29;
    border: 2px #990000 outset;
    color: #fff;
    font: 11px/1.0 Verdana, Geneva, sans-serif;
    font-weight: bold;
    padding: 1px 8px;
    text-decoration: none;
}

.button:hover
{
    background-color: #ec918f;
    border-style: inset;
    padding: 2px 7px 0 9px; /* shift text 1px to the right and down */
    text-decoration: none;
}
