@font-face {
    font-family: 'Netto';
    src:
        url('fonts/NettoOT.eot?') format('eot'),
        url('fonts/NettoOT.eot?#iefix') format('embedded-opentype'),
        url('fonts/NettoOT.svg') format('svg'),
        url('fonts/NettoOT.woff') format('woff'),
        url('fonts/NettoOT.ttf') format('truetype');
    font-weight: 400;
    font-style:normal;
}
@font-face {
    font-family: 'Netto-Bold';
    src:
        url('fonts/NettoOT-Bold.eot?') format('eot'),
        url('fonts/NettoOT-Bold.eot?#iefix') format('embedded-opentype'),
        url('fonts/NettoOT-Bold.svg') format('svg'),
        url('fonts/NettoOT-Bold.woff') format('woff'),
        url('fonts/NettoOT-Bold.ttf') format('truetype');
    font-weight: 400;
    font-style:normal;
}

@font-face {
    font-family: 'OpenSansLight';
    src: url('fonts/OpenSans-Light-webfont.eot');
    src: url('fonts/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/OpenSans-Light-webfont.woff') format('woff'),
         url('fonts/OpenSans-Light-webfont.ttf') format('truetype'),
         url('fonts/OpenSans-Light-webfont.svg#OpenSansLight') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'OpenSansLightItalic';
    src: url('fonts/OpenSans-LightItalic-webfont.eot');
    src: url('fonts/OpenSans-LightItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/OpenSans-LightItalic-webfont.woff') format('woff'),
         url('fonts/OpenSans-LightItalic-webfont.ttf') format('truetype'),
         url('fonts/OpenSans-LightItalic-webfont.svg#OpenSansLightItalic') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'OpenSansRegular';
    src: url('fonts/OpenSans-Regular-webfont.eot');
    src: url('fonts/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/OpenSans-Regular-webfont.woff') format('woff'),
         url('fonts/OpenSans-Regular-webfont.ttf') format('truetype'),
         url('fonts/OpenSans-Regular-webfont.svg#OpenSansRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'OpenSansItalic';
    src: url('fonts/OpenSans-Italic-webfont.eot');
    src: url('fonts/OpenSans-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/OpenSans-Italic-webfont.woff') format('woff'),
         url('fonts/OpenSans-Italic-webfont.ttf') format('truetype'),
         url('fonts/OpenSans-Italic-webfont.svg#OpenSansItalic') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'OpenSansSemibold';
    src: url('fonts/OpenSans-Semibold-webfont.eot');
    src: url('fonts/OpenSans-Semibold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/OpenSans-Semibold-webfont.woff') format('woff'),
         url('fonts/OpenSans-Semibold-webfont.ttf') format('truetype'),
         url('fonts/OpenSans-Semibold-webfont.svg#OpenSansSemibold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'OpenSansSemiboldItalic';
    src: url('fonts/OpenSans-SemiboldItalic-webfont.eot');
    src: url('fonts/OpenSans-SemiboldItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/OpenSans-SemiboldItalic-webfont.woff') format('woff'),
         url('fonts/OpenSans-SemiboldItalic-webfont.ttf') format('truetype'),
         url('fonts/OpenSans-SemiboldItalic-webfont.svg#OpenSansSemiboldItalic') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'OpenSansBold';
    src: url('fonts/OpenSans-Bold-webfont.eot');
    src: url('fonts/OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/OpenSans-Bold-webfont.woff') format('woff'),
         url('fonts/OpenSans-Bold-webfont.ttf') format('truetype'),
         url('fonts/OpenSans-Bold-webfont.svg#OpenSansBold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'OpenSansBoldItalic';
    src: url('fonts/OpenSans-BoldItalic-webfont.eot');
    src: url('fonts/OpenSans-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/OpenSans-BoldItalic-webfont.woff') format('woff'),
         url('fonts/OpenSans-BoldItalic-webfont.ttf') format('truetype'),
         url('fonts/OpenSans-BoldItalic-webfont.svg#OpenSansBoldItalic') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'OpenSansExtrabold';
    src: url('fonts/OpenSans-ExtraBold-webfont.eot');
    src: url('fonts/OpenSans-ExtraBold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/OpenSans-ExtraBold-webfont.woff') format('woff'),
         url('fonts/OpenSans-ExtraBold-webfont.ttf') format('truetype'),
         url('fonts/OpenSans-ExtraBold-webfont.svg#OpenSansExtrabold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'OpenSansExtraboldItalic';
    src: url('fonts/OpenSans-ExtraBoldItalic-webfont.eot');
    src: url('fonts/OpenSans-ExtraBoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/OpenSans-ExtraBoldItalic-webfont.woff') format('woff'),
         url('fonts/OpenSans-ExtraBoldItalic-webfont.ttf') format('truetype'),
         url('fonts/OpenSans-ExtraBoldItalic-webfont.svg#OpenSansExtraboldItalic') format('svg');
    font-weight: normal;
    font-style: normal;

}


h1, h2, h3, h4, h5, h6              { position: relative; font-weight: bold; }
h1, h2                              { line-height: 36px; margin-bottom: 18px; }
h1, h2, h3, h4                      { margin-top: 18px; }
h3, h4, h5, h6                      { line-height: 18px; }
h1                                  { font-size: 28px; top: 5px; }
h2                                  { font-size: 28px; top: 8px; }
h3                                  { font-size: 22px; top: 1px; }
h4                                  { font-size: 18px; top: 2px; }
h5                                  { font-size: 15px; top: 4px; }
h6                                  { font-size: 13px; top: 5px; }
h1:first-child,
h2:first-child,
h3:first-child,
h4:first-child                      { }

body {background:#ffffff; margin:0;padding:0;}

#header, #nav, #wrapper, #footer {width:100%;}

.contentblock {background:#fff; margin:0 0 20px 0; padding:0; box-shadow:0 0 4px #bbb; -moz-box-shadow:0 0 4px #bbb; -webkit-box-shadow:0 0 4px #bbb;}

.full {width:640px;}

.half {width:310px;}

.pad {margin-right:16px;}

table{width:100%;border:0;padding:1px}
table td{padding:5px}

/*****
    SITE COLORS
	
    blue:       #00b2ef
    black:      #231f20
    light grey: #f3f3f3
    dark grey:  #bfbfbf  

*****/

body{
    margin: 0px; 
    padding: 0px; 
    font-family: 'OpenSansLight','Open Sans'; 
    color: #231f20; 
    font-size: 14px;
    min-height: 100%;
    height: auto;
    /*display: inline-block;*/
}
h1{margin-top: 0px; color: #00b2ef; font-family: 'Netto';}
h2{margin-top: 0px; color: #00b2ef; font-family: 'Netto'; font-size: 22px;}
h3{margin-top: 20px; margin-bottom: 10px;  width: 100%; float: left; color: #000; font-family: 'Netto'; font-size: 20px;}
a, img{text-decoration: none; border: none; outline: 0; color: #00b2ef;}
a:hover{color: #231f20;}
p{font-size: 14px; font-weight: 400; line-height: 20px; margin: 16px 0px;}
img.roll{display: none;}
form{width: 100%; float: left;}
label{width: 100%; float: left; text-transform: uppercase; font-size: 11px; letter-spacing: 2px;}
.input{width: 100%; float: left; margin: 0px 0px 25px 0px;}
.input input{width: 250px; padding: 5px 10px; border: 2px solid #bfbfbf; background-color: #f3f3f3; font-size: 18px;}
.input.textarea textarea{border: 2px solid #bfbfbf; background-color: #f3f3f3; font-size: 12px;}
.submit{width: 100%; float: left; margin: 0px 0px 0px 0px;}
.blue_link{text-transform: uppercase; font-size: 14px; font-weight: bold;}
.black{color: #231f20;}
.blue{color: #00b2ef;}


/*****
    HEADER & FOOTER
*****/
#top{width: 100%; float: left;}
#header_container{width: 100%; float: left; padding: 15px 0px 0px 0px; margin: 0px; background-color: #fff;}
#header{width: 980px; margin: 0px auto; position: relative;z-index: 999;
}
#logo{float: left; padding: 0px 0px 5px 0px;}
#logo a {
    display: block;
}
#header_top{position: absolute; top: 0px; right: 0px;}
#header_nav{float: left; font-size: 11px; color: #00b2ef; margin: 5px 0px 0px 0px;}
#header_nav a{color: #000; padding: 0px 5px; font-weight: 700;}
#header_nav a:hover{color: #00b2ef;}
.social_media_icon{width: 26px; height: 25px; float: left; position: relative; margin: 0px 0px 0px 8px;}
.social_media_icon img{position: absolute;}
.social_media_icon.footer{width: 34px; height: 33px;}
#footer_container {
    width: 100%; 
    height: 10px; 
    float: left; 
    background-color: #f3f3f3; 
    margin: 60px 0px 0px 0px;
    padding: 35px 0px 70px 0px; 
    -webkit-box-shadow: 0px -4px 3px #d3d3d3; 
    -moz-box-shadow: 0px -4px 3px #d3d3d3; 
    box-shadow: 0px -4px 3px #d3d3d3;
}
#footer{width: 980px; margin: 0px auto;}
#footer_social_media_container{width: 100%; float: left;}
#footer_social_media{width: 126px; margin: 0px auto;}
#footer_copyright{width: 100%; float: left; text-align: center; font-size: 12px; font-weight: bold; margin: 15px 0px;}
#footer_terms_privacy{width: 100%; float: left; text-align: center; font-size: 12px; font-style: italic; color: #aaa;}
#footer_terms_privacy a{color: #00b2ef;}
#footer_terms_privacy a:hover{color: #231f20;}


/*****
    NAVIGATION
*****/
#navigation_spacer{width: 100%; height: 35px; display: none; float: left;}
#navigation_container{
    width: 100%; 
    float: left; 
    background-color: #000; 
    z-index: 9999; 
    position: relative;
}
#navigation_shadow{width: 100%; height: 100%; position: absolute; -webkit-box-shadow: 0px 4px 4px 0px #000; -moz-box-shadow: 0 4px 4px 0px #000; box-shadow: 0 4px 4px 0px #000; opacity: 0.2; filter:alpha(opacity=20);}
#navigation{width: 980px; margin: 0px auto;}
#navigation ul#nav{padding: 0px; margin: 0px; list-style-type: none;}
#navigation ul#nav li{display: inline; float: left; margin: 0px 9px; position: relative;}
#navigation ul#nav li.first{margin-left: 0px;}
#navigation ul#nav li.last{margin-right: 0px;}
#navigation img.nav_slash{display: inline; float: left; padding: 11px 0px 10px 0px; }
#navigation a.nav_link{font-family: 'Arial'; font-variant:small-caps; font-size:12pt; color:#FFF;position: relative; float: left; padding: 11px 0px 10px 0px;}
#navigation a:hover{color: #00b2ef;}
#navigation a.nav_link img{position: absolute;}

/*****
    LANDING
*****/
#main{width: 980px; height: 384px; float: left; position: relative; margin: 0px 0px 30px 0px;}
#main_text{position: absolute; top: 60px; z-index: 1;}
#main_text_link{position: absolute; top: 340px; left: 208px; text-transform: uppercase;}
#main_text_link a{color: #00b2ef; font-size: 14px; font-weight: bold;}
#main_text_link a:hover{color: #231f20;}
#main_img {
    position: absolute; 
    top: 0px;
    right: -100px;
}
#products_services{padding: 30px; background-color: #f3f3f3; float: left; width: 250px; height: 330px;}
#products_services ul{padding: 0px 0px 0px 15px; margin: 0px 0px 30px 0px; list-style-image: url('../img/arrow.png');}
#products_services ul li{margin-bottom: 12px;}
#products_services ul li a{color: #231f20; font-weight: bold; font-size: 13px;}
#products_services ul li a:hover{color: #00b2ef;}
#buckets{float: left;}
.bucket{width: 203px; height: 390px; position: relative; float: left; margin-left: 20px;}
.bucket_img{width: 203px; float: left; padding: 0px 0px 15px 0px; border-bottom: 3px solid #0091c4; margin: 0px 0px 15px 0px;}
.bucket_title{width: 100%; float: left; color: #231f20; font-size: 19px; font-family: 'Netto-Bold'; margin-bottom: 15px;}
#twitter_icon{float: left;}
.recent_tweets_title{float: left; margin: 0px 0px 0px 15px;}
.bucket_copy{width: 193px; padding-right: 10px; font-size: 13px;}
.bucket_link{position: absolute; bottom: 0px;}
#partners{width: 920px; float: left; padding: 35px 30px; margin: 60px 0px 0px 0px; border-top: 2px solid #bfbfbf; border-bottom: 2px solid #bfbfbf;}
#who_are_our_partners{width: 310px; float: left;}
#partners_graphic{float: right; margin-right: 40px;}



/*****
    GLOBAL CONTENT
*****/
/*****
    GLOBAL CONTENT
*****/

/*#content:before, #content:after, #content_container:before,
#content_container:after {
    content: " "; /* 1 *!/
    display: table; /* 2 *!/
}

#content:after, #content_container:after {
    clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 *!/

#content, #content_container {
    *zoom: 1;
}*/
#content_container{
    width: 980px;
    min-height: 350px;
    margin: 0px auto;
    position: relative; 
}
#content{
    width: 980px; 
    margin: 0px auto; 
    position: relative;
    display: inline-block;
}
.side_nav{width:175px; float: left; position: absolute; top: 40px; left: 0px;}
.side_nav ul{padding: 0px; margin: 0px; list-style: none;}
.side_nav ul li{border-top: 1px dotted #bfbfbf; width: 100%; float: left;}
.side_nav ul li.last{border-bottom: 1px dotted #bfbfbf;}
.side_nav ul li a{font-size: 13px; font-weight: 700; color: #000; padding: 10px 0px; width: 100%; padding: 10px 0px; float: left;}
.page{width: 970px; float: left; margin: 40px 0px 0px 0px; padding: 0px 0px 50px 0px;}
.spacer{height:10px; padding:20px;clear:both;border-bottom:1px solid #bfbfbf}

form .input {
    position: relative;
}

form .input p.error {
    position: absolute;
    top: 6px;
    left: 410px;
    width:170px;
    display: block;
    margin: 0 0 0 10px;
    font-size: 12px;
    padding: 0 10px;
    background:#fff;
}

form .input.textarea p.error{
    top:32px;
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
    #main { overflow: hidden; } 
}