body {margin: 0px; padding: 0px; text-align: center; font-size: 14px; font-family: 'Open Sans', arial, sans-serif; color: #333}

.greybar {width: 100%; height: 40px; position: absolute; top: 0px; right: 0px; background-color: white;}
.tealbar {width: 70%; height: 54px; position: absolute; top: 89px; right: 0px; background-color: white;}
.tealbar2 {width: 30%; height: 87px; position: absolute; top: 56px; left: 0px; background-color: white;}
.whitebar {width: 50%; height: 32px; position: absolute; top: 56px; right: 0px; background-color: white; }

#contentwrapper {width: 100%;  }

header {width: 98%; max-width: 1100px; margin: 0 auto; height: 145px; position: relative; }

a.skipper, a.skipper:visited {line-height: 0; font-size: 0; border: 0; background: transparent;position: absolute; top: 0; left: 0; z-index: 101}
a.skipper:focus, a.skipper:visited:focus {border: solid 2px white; color: black; background-color: yellow; line-height: 1; font-size: 14px;}

.homelink{position: absolute; left: 0px; top: 56px; background: url(../images/logo_bg.png) no-repeat bottom; width: 244px; height: 87px;}

.homelink_client {width: 520px; height: 86px;position: absolute; left: 0px;  top: 58px; padding-right: 40px; z-index: 51}
.homelink_client a:first-child {position: absolute; left: 0px; bottom: 0; background-color: WHITE;  }
.homelink_client a:last-child {position: absolute; left: 130px; bottom: 0;background: url(../images/logo_bg_wider.png) no-repeat right bottom; padding: 0 40px 0 20px; min-height: 58px }


a.chat {position: absolute; top: 0px; right: 0px; display: none;}

.pipe { margin: 0px 2px;}
.bottomlinks a, .toplinks a {white-space: nowrap;}

.phone {width: 720px; height: 40px; position: absolute; top: 48px; right: 60px; text-align: right; background-color: white; font-size: 13px; padding-top: 10px; z-index: 50}
.phone a {text-decoration: none;}

.searchbttn, .searchbttn:visited, .iconic a, .iconic a:visited  {width: 35px; height: 34px; text-align: center; color: white; background-color:  #65646a; display: inline-block; top: -2px; position: relative; padding-top: 2px; margin: 0 5px; font-size: 18px; text-decoration: none;}
.searchbttn:hover, .iconic a:hover {color: white; background-color:  #e0592a;text-decoration: none;}

.searchbttn {position: absolute; top: 48px; right: 0px;}

header .login {display: block;}


.pennant {position: absolute; top: 0px; left: 0px; z-index: 99; background: url(../images/BannerOverlay2.png) no-repeat; width: 249px; height: 181px}
#apply {position: relative; top: 70px;z-index: 99; }
#chat {position: relative; top: 82px;z-index: 99; display: none; }



section { width: 100%; max-width: 1100px; margin: 0 auto; line-height: 1.5;}
article {width: 70%;  position: relative; float: left; text-align: left;}
aside {z-index: 99; overflow: hidden; width: 252px;  position: relative; float: right;  }
aside.home {z-index: 99; overflow: hidden; width: 28%;  position: relative; float: right;  }

section.inside {background: url(../images/InteriorAngle.jpg) no-repeat #f5f5f5 left top;margin-top: 30px; width: 96%;}
article.int {padding: 40px 0 20px 140px; line-height: 2;}
.pageicon {position: absolute; top: 20px; left: 40px;}
aside.int {top: -18px; right: 20px}

.bannerbox { margin: -44px 0 10px 0;  }
.vidbox { margin-bottom: 10px;}

.bannerbox::before {content: ' ';background: url(../images/InsideBottomRegion.jpg.png) no-repeat; width: 252px; height: 44px; display: block; position: relative; top: 44px;}

.regionbox, .code_block_indiv_content {overflow: hidden; width: 100%;  text-align: left; background: url(../images/InsideSliceRegion.jpg) repeat-y; width: 252px; margin-bottom: 0px; padding: 0 40px; color: white;}
.regionbox h2, .sidebarcontent h1 {color: white; font-size: 18px;}
.regionbox ul, .code_block_indiv_content ul {margin: 0px; padding: 0 0 0 15px; list-style: none;}
.boxtop, .code_block_indiv_top, .boxbottom, .code_block_indiv_bttm {display: none;}
.regionbox li, .code_block_indiv_content li {margin-bottom: 5px; list-style:  url(../images/li.png);}
.regionbox a, .code_block_indiv_content a, .regionbox a:visited, .code_block_indiv_content a:visited {color: white; text-decoration: none;}
.regionbox a:hover, .code_block_indiv_content a:hover {color: white; text-decoration: underline;}
.regionbox::before, .code_block_indiv_content::before {content: ' '; background: url(../images/InsideTopRegion.jpg) no-repeat; width: 252px; height:36px; display: block; position: relative; left: -40px}

.ratesbox {width: 100%; background-color:#f5f5f5; padding: 20px;}
.ratesbox h2 {color: #a80000; font-weight: 600}
.ratesbox h2 span {font-size: 13px; line-height: 1}
.ratesbox h4 {color: #333333; font-size: 16px; font-weight: 600; border-top: solid 1px #d0d0ce; margin: 10px 0 0 0; padding: 5px 0;}
a.scrollarrow {color:#e0592a; font-size: 40px; width: 100%; height: 20px; line-height: 1; display: block; border-top: solid 2px #d0d0ce}
.ratesbox a.scrollarrow:first-child {border: 0; border-bottom: solid 2px #d0d0ce}
a.scrollarrow i {position: relative; top: -14px;}

.rateR, .rateL {width: 50%; position: relative; float: left; font-weight: 600; color: #333; text-transform: uppercase; font-size: 12px; text-align: left; line-height: 1}
.rateR {float: right; text-align: right;}
.rateR span, .rateL span {font-size: 20px; color: #43b02a;position: relative; top: 2px;}
a.assumptions, a.assumptions:visited {font-weight: 600; text-decoration: none; margin: 10px 0 0 0; padding: 10px 0; width: 100%; clear: both;  display: block;border-top: solid 1px #d0d0ce;}
a.assumptions:hover {}


/*
Background Color: #f5f5f5
Date: Open Sans Regular, 12pt, #666666
Featured Rates: Open Sans Bold, 18pt, #0097a9
Mortgage Name: Open Sans Bold, 16pt, #333333
RATE: Open Sans Semibold, 12pt, #666666
APR: Open Sans Semibold, 12pt, #666666
Rate %: Open Sans Semibold, 20pt, #43b02a
APR %: Open Sans Semibold, 20pt, #43b02a
*/

.Tbox {width: 100%; position: relative; height: 78px; }
.Tbox h1 {z-index: 99;position: absolute; top: 24px; right: 0px; color: #38393c; FONT-SIZE: 18PX; background-color: #e7e7e7; width: 98%; padding-left: 80px; height: 30px; z-index: 90}
.Tbox img {position: absolute; top: 0px; left: 0px; z-index: 99}
a.more, a.more:visited {width: 100px; height: 30px; background-color: #e0592a; color: white; text-decoration: none; position: absolute; top: -68px; right: -16%; display: block; z-index: 99; text-align: center; padding-top: 5px;}
a.more:hover {color: white; text-decoration: none; background-color: #44b029;}

.homebox {width: 76%; margin: 10px 12% 30px 12%; position: relative;line-height: 2 } 

.footerbar {background-color: #38393c; color: white; margin-top: 20px;}
footer {width: 96%;max-width: 1100px; margin: 0 auto; padding: 20px 0;  }
footer img {margin: 10px 0;}

.bottomlinks {color: white; width: 100%; padding: 10px 0;}
.bottomlinks a, .bottomlinks a:visited {text-decoration: none; color: white;}
.bottomlinks a:hover {text-decoration: underline; color: white;}

.socmed {margin: 10px 0;}
.socmed img {margin: 0 5px;}

.mobi, .iconic, section .login, .applier, .breakit{display: none;}

/*
grey - #d0d0ce
dk grey - #65646a
pale grey - #f5f5f5
teal- #0097aa
green - #44b029
orange - #e0592a

*/

/*****************************************/

.tester {position: absolute; top: 0; left: 0; font-weight: bold; font-size: 18px; z-index: 1020}

*{-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
a, a:visited {color: #333; }
a:hover {color: #a80000;}
.breaker {clear: both;}
.border {border: solid 1px red;}
img {border: 0px;}
.print {display: none;}
strong {font-weight: 600;}

/*input {-webkit-appearance: none; -moz-appearance: none;}*/
    input[type=�checkbox�]{ -webkit-appearance: checkbox;}
    input[type=�radio�]{ -webkit-appearance: radio;}

.col4 {width: 23%; margin: 0 1%; position: relative; float: left;}
.col3 {width: 31%; margin: 0 1%; position: relative; float: left;}
.col2 {width: 48%; margin: 0 1%; position: relative; float: left;}


h1, h2, h3 {margin-top: 0; text-transform: uppercase}
h1, .blog_title, .content_blog_header, .category_name, .podcast_list_header {color: #38393c; font-size: 24px; font-weight: 500;}
h2, .content_rates_category1, .faq_header, .faq_question, .comments_section_header, .pod_episode_header, #KJETitle  {color: #a80000; font-size: 18px; font-weight: 500;}
h3, .content_rates_table_title, .region_faq_header, .comment_title {color: #43b02a /*#e0592a*/; font-size: 16px; font-weight:500;}
h4 {color: black; font-size: 14px; font-weight: normal;  }
h5 {color: black; font-size: 14px; font-weight: bold; }
h6 {color: black; font-size: 14px; font-style: italic; font-weight: bold;}

/* podcasts */
.stream_list_inside_header_border, .stream_list_inside_header_border_right, td.pod_text_bold {color: #53565a; font-weight: 600;  border-bottom: solid 1px #00315D}
.pod_text_bold { border-bottom: 0; color: #53565a; font-weight: 600;}
table.stream_list_border {background-color: #EEEEEE; margin-bottom: 20px;}
table.stream_list_border td {padding: 2px 5px;}
tr.podcast_stream_list  {}
tr.podcast_stream_list_bg td{min-width: 150px;border-top: solid 1px #00315D; border-bottom: solid 1px #00315D}
a.sm2_button, a.sm2_button:visited{font-size: 10px; color: white; background-color: #53565a; text-decoration: none; width: 65px; display: block; text-align: center; padding: 2px 0;}
a.sm2_button:hover{background-color: silver; color: white; text-decoration: none;}

/* old forms */
.captcha_warning {font-size: 14px; color: red; font-weight: bold;}
.required_legend {padding-bottom: 20px;color: gray;font-style: italic;}

/* new forms */
div.taft_formElement-wrapper.wide {width: 100%;}
span.fb_legend {padding-bottom: 10px;color: gray;font-style: italic;}
hr.fb_legend {display: none;}
li.fb_element{ padding: 0 ;}
form.taft_fb_form ul {padding: 0; margin: 0;}
.taft_label-wrapper {clear: both; width: 20%; position: relative; float: left; min-height: 30px; border: solid 0px red; padding-right: 10px;}
.taft_formElement-wrapper {width: 80%; position: relative; float: left; min-height: 30px; border: solid 0px #53565a; padding-right: 10px;}
input.fbPhoneprt{ width:50px;}
.captcha {clear: both;}
.taft_formElement-wrapper label {margin-left: 5px;}


.col2  li.fb_element .taft_label-wrapper {width: 40%; padding-right: 10px; border: solid 1px red}
.col2  li.fb_element .taft_formElement-wrapper {width: 60%;  padding-right: 10px; border: solid 1px #53565a}


/* rates page */
.content_rates_table {margin-bottom: 20px; width: 100%;}
.content_rates_table_fields {background-color: #53565a; color: white; font-weight: bold; }
.content_rates_table_row2 {background-color: white;}
.content_rates_table_row_highlight {color: #0a6104;}
.sideslider {width: 100%;}

/* featured rates */
.regions_rates_table {width: 100%;}
.regions_rates_table_row1, .regions_rates_table_row2 {background-color: silver; border-bottom: 3px solid white; font-size: 12px; }
.regions_rates_table_effectivedate {font-size: 12px;}
.regions_rates_table_title {display: none;}
.regions_rates_table_fields { font-size: 12px; color: #53565a;}
.aprnote {font-size: 12px; width: 180px;}
td.regions_rates_table_row2 marquee, td.regions_rates_table_row1 marquee {width: 242px;}

/* for polls */
.region table td table td {padding: 2px;}
.region table td table{margin-bottom: 10px;}

/* calendars */
.content_calendar_table {border: solid 1px black; border-collapse: collapse}
td.content_calendar_table_headercell {background-color: #53565a; color: white; text-align: center; font-weight: bold;} 
td.content_calendar_table_headercell a, td.content_calendar_table_headercell a:visited { color: white; text-decoration: none;} 
td.content_calendar_table_headercell a:hover { color: silver; text-decoration: none;} 
td.content_calendar_table_cell { border: solid 1px black} 
td.content_calendar_table_selectedcell { border: solid 1px black; background-color: silver} 

/* polls */
.content_poll_option, .regions_poll_option {margin: 5px 0px; display: inline-block;}
.content_poll_title, .regions_poll_title {margin: 5px 0px; display: inline-block; font-weight: bold}
.votebutton, .votebutton_regions  {}
.poll input[type=radio] {position: relative; top: 3px;}


/* faqs page */
.faq_toolbar {padding-bottom: 0px;}
.faq_browse {margin-bottom: 20px;}
.faq_viewed {color: #53565a; font-size: 11px; font-weight: bold; font-family:  arial, sans-serif;}
.faq_search {margin: 20px 0px}
.faq_question_block {margin-top: 10px;}
.faq_advanced_search_panel {padding: 0px;}
.faq_advanced_search_panel table {margin: 20px 0px;}
.faq_advanced_search_panel table td {padding: 2px 0px;}
.faq_advanced_search_panel i {color: silver;}
.faq_search_form {margin:0;}

/* faqs regions */
ul.region_faq_list li {margin-bottom: 5px;}
span.region_faq_header {display: block; margin-bottom: 10px}

/* blog styles */
.blog_posted_date {display: block; color: gray;}
.blog_share {position: relative; float: right;}
.blog_main_post a {display: block; margin-bottom: 20px;}
.comments_sortbox {position: relative; float: right; background-color: white; top: -20px; }
.comment_item {border: solid 1px #53565a; padding: 0px 10px 10px 10px; margin: 10px 0px;clear: both;}
.comment_posted_by_and_who {color: gray;}
.comment_text {margin-top: 10px;}
table.comments_form_table{border: solid 1px #53565a; width: 100%} 
table.comments_form_table td {padding: 3px 5px;}
.comments_submitted {margin: 10px 0px; border: solid 1px red; padding: 10px; }  
.comment_reply_body {border: solid 1px #53565a; padding: 10px; margin: 10px; background-color: #E9E7E6;}
textarea.comments_form_textbox {width: 98%; height: 75px;}


/* for sidebar content */
.code_block {overflow: hidden; width: 100%} /* prevents breaking the design with images that are too wide, if width set */
.code_block_top {}
.code_block_center {}
.code_block_bttm {}
.code_block_indiv_content p{margin-top: 0px;}

/* for image gallery */

.slideshow-container {width: 300px; height: 200px; overflow: hidden;}