﻿/* BASICS */

html {
    background-color:#fff;
    background-image:url(backdrop.png);
    background-repeat:repeat-x;
    background-position:left top;   
    font-family:Georgia,Serif;
    font-size:12px;
    color:#000;
    overflow-y: scroll;
}

a {
    color:#677f98;
}
a:hover {
    color:#b2b2b2;
}

p {
    line-height:18px;
}

h1 {
    color:#7793b1;
    font-size:26px;
    margin-bottom:10px;
}
h2 {
    color:#333;
    font-size:16px;
    font-weight:bold;
    margin-bottom:5px;
    margin-top:20px;
}
h3 {
    color:#7793b1;
    font-size:14px;
    margin-bottom:10px;
}
h4 {
    color:#333;
    font-size:18px;
}
h5 {
    color:#333;
    font-size:16px;
    margin-bottom:5px;
    margin-top:20px;
}

.floatfix, .floatfix-20, .floatfix-100 {
    display:block;
    clear:both;
    width:0px;
    height:0px;
    overflow:hidden;
}
.floatfix-20 {
    height:20px;
}
.floatfix-100 {
    height:100px;
}



/* TOP MENU */

.menu {
    font-family: Arial, Sans-Serif, Helvetica;
    font-size:11px;
    font-weight:bold;
    background-image:url(menu_bg.png);
    background-repeat:repeat-x;
    height:25px;
    padding-left:15px;
}
.menu li {
    float:left;    
    background-image:url(menu_splitter.png);
    background-position:right top;
    background-repeat:no-repeat;
    padding-right:1px;
}
.menu a {
    text-decoration:none;
    text-align:center;
    color:#666;
    display:block;
    width:100px;
    height:20px;
    padding-top:5px;    
}

.menu a:hover, .menu li.active a {
    color:#fff;
    background-image:url(menu_hover.png);
    background-position:1px top;
    background-repeat:repeat-x;
}
.menu li.login {
    padding-left:350px;
    background-image:none;
}
.menu li.login a img {
    width:8px;
    height:13px;
    vertical-align:top;
    margin-left:5px;
    background-image:url(lock.png);
}
.menu li.login a:hover img, .menu li.login.active a img {
    background-image:url(lockhover.png);
}



/* PAGE LAYOUT */

.page {
    margin-left:auto;
    margin-right:auto;
    width:1000px;
    position:relative;
    margin-top:10px;
}

.header {
    background-image:url(top_bg.png);
    background-repeat:repeat-x;
    background-position:left top;
    height:129px;
    position:relative;
}
.header .logo {
    position:absolute;
    left:40px;
    top:40px;
}
.header .fatcat {
    position:absolute;
    left:660px;
    top:3px;
}
.header .quicklinks {
    position:absolute;
    right:20px;
    width:100px;
    top:9px;
    background-image:url(vdots.png);
    background-repeat:repeat-y;
    background-position:80px top;
    text-align:right;
    padding-top:15px;
}
.header .quicklinks a {
    display:block;
    height:15px;
    font-family: Arial, Sans-Serif, Helvetica;
    font-size:10px;
    text-decoration:none;
    color:#000;
}
.header .quicklinks a img {
    vertical-align:middle;
    margin-left:13px;
}

.slideshow {
    height:156px;
}

.content {
    background-image:url(main_bg.png);
    background-repeat:repeat-y;
    background-position:left top;
    padding-left:10px;
    padding-right:10px;
    padding-bottom:20px;
    clear:both;
}

.menubar {
    background-image:url(main_bg.png);
    background-repeat:repeat-y;
    background-position:left top;
    padding-left:10px;
    padding-right:10px;
}

.footer {
    background-image:url(bottom_bg.png);
    background-repeat:repeat-x;
    background-position:left top;
    height:25px;
    padding-top:3px;
    margin-bottom:10px;
    padding-left:30px;
    padding-right:10px;
    color:#ccc;
    font-family: Arial, Sans-Serif, Helvetica;
    font-size:10px;
}
.footer a {
    color:#ccc;
    text-decoration:none;
}
.footer a:hover {
    color:#a4c0de;
}
.footer .right {
    float:right;
    margin-right:20px;
}



/* CONTENT AREA STYLES */

.content .hsplitter {
    height:30px;
    overflow:hidden;
    background-image:url(hsplitter.png);
    background-repeat:repeat-x;
    background-position:left top;
}

.content p {
    margin-bottom:10px;
}

.content ul.bullets {
    margin-left:70px;
    margin-bottom:20px;
}
.content ul.bullets li {
    list-style-type:disc;
    margin-bottom:5px;
}


.content .columns {
    width:980px;
    padding-left:55px;
    clear:both;
}

.content .columns .image-right {
    float:right;
    margin-left:30px;
}

.content .left-640 {
    float:left;
    width:640px;    
    padding-right:30px;
    background-image:url(vdots.png);
    background-repeat:repeat-y;
    background-position:right top;
}
.content .right-200 {
    float:left;
    width:165px;
    margin-left:35px;
}

.content .left-590 {
    float:left;
    width:590px;    
    padding-right:30px;
    background-image:url(vdots.png);
    background-repeat:repeat-y;
    background-position:right top;
}
.content .right-250 {
    float:left;
    width:215px;
    margin-left:35px;
}


.content .full-880 {
    float:left;
    width:880px;    
}

.content ul.quicklinks {
    margin:0px;
}
.content ul.quicklinks li {
    margin:0px;
    padding-left:20px;
    margin-bottom:5px;
    background-image:url(bullet.png);
    background-repeat:no-repeat;
    background-position:left 3px;
}
.content ul.quicklinks li a {
    text-decoration:none;
    color:#000;
}
.content ul.quicklinks li a:hover {
    color:#677f98;
}

.content blockquote {
    font-style:italic;
    margin-left:60px;
    margin-right:60px;
    margin-top:20px;
    margin-bottom:20px;
    color:#666;
}
.content blockquote h3 {
    color:#333;
    font-size:16px;
}


/* SPECIAL ELEMENTS */

.gmap {
    margin-left:auto;
    margin-right:auto;
    width:550px;
    margin-top:30px;
    margin-bottom:30px;
    padding:1px;
    border:solid 1px #7793b1;
}

.bluebox {
    margin-left:auto;
    margin-right:auto;
    width:515px;
    margin-top:30px;
    margin-bottom:30px;
    padding:20px;
    padding-bottom:0px;
    background-color:#f1f4f7;
    border-top:solid 1px #7793b1;
    border-bottom:solid 1px #7793b1;
}
.bluebox.cat {
    background-image:url(fatcatlogo_small.png);
    background-repeat:no-repeat;
    background-position:320px bottom;
}
.bluebox .text-left {
    float:left;
    width:120px;
    margin-top:20px;
}
.bluebox .text-right {
    float:left;    
    clear:right;
    width:300px;
    padding-left:30px;
    padding-bottom:10px;
    border-left:solid 1px #7793b1;
    margin-top:20px;
}

.bluebox .form-label {
    width:120px;
    float:left;
    padding-top:6px;
}
.bluebox .form-field {
    width:380px;
    float:left;
    margin-bottom:16px;
    clear:right;
}
.bluebox .form-field input, .bluebox .form-field textarea {
    font-family: Arial, Sans-Serif, Helvetica;
    font-size:12px;
    color:#666;
    padding-top:3px;
    padding-bottom:3px;
    padding-left:3px;
    padding-right:3px;
    border-top:solid 1px #a6a8a9;
    border-left:solid 1px #a6a8a9;
    border-bottom:solid 1px #cdcfd1;
    border-right:solid 1px #cdcfd1;
    width:375px;    
}
.bluebox .form-field textarea {
    height:200px;
}
.button {
    width:120px;
    height:22px;
    font-family: Arial, Sans-Serif, Helvetica;
    font-size:10px;
}



.clientlist {
    width:940px;
    clear:both;
    display:block;
}
.client {
    display:block;
    float:left;
    width:405px;
    height:320px;
    margin-bottom:30px;
    margin-left:55px;
    border-bottom:solid 1px #dfdfdf;
}
.client a {
    margin:0px;
    padding:0px;
    display:block;
    color:#000;
    line-height:18px;
    text-decoration:none;
}
.client a:hover {
    color:#7793b1;
}
.client a img {
    width:405px;
    height:195px;
    margin-bottom:18px;
    display:block;
}
.client a b {
    display:block;    
    font-size:16px;
    font-weight:normal;
    height:28px;
    border-bottom:solid 1px #dfdfdf;
    margin-bottom:10px;
}
