/** ===========UPDATED STYLES FOR NEW HOME PAGE DESIGN ===================================================================================================== **/

/* Add the new background */

.layout_area_header { margin-top: -2px; }

.col_layout_header {
    background: url('/Resources/FY/Sites/FindYoga/Layout/header_bg.png') top left no-repeat;
    height: 150px;
}

.col_layout_body {
    background: url('/Resources/FY/Sites/FindYoga/Layout/search_bg.png') top left no-repeat;
}

/* Navigation */

#horizontalNav {
    height: 28px;
    vertical-align: middle;
    padding: 7px 0px 0px 0px;
    text-align: left;
}

#horizontalNav a {
    color: #333;
    font-size: 13px;
    text-decoration: none;
    padding: 7px 15px 25px 15px; 
}

#horizontalNav a.selected,#horizontalNav a:hover {
    background: url(/Resources/FY/Sites/FindYoga/Layout/nav_selected_bg.png) top left repeat-x;
    padding: 7px 15px 25px 15px;
    color: #126a92;
}

/* Update the Search Tab design */

#searchTabs .searchTab {
    background: url(/Resources/FY/Sites/FindYoga/Images/Backgrounds/searchTab_bg_repeat.png) top left repeat-x;
    border: 1px solid #39a305;
    border-bottom: none;
    margin: 0px 6px 0px 3px;
    -moz-border-radius-topleft: 1px;
    -moz-border-radius-topright: 1px;
    padding-top: 8px;
}

#searchTabs .searchTab.selected {
    margin: 0px 0px 0px 0px;
    border: none;
    background: none;
    padding: 10px 0px 10px 0px;
}


/* Update background for browse box */

#browseBox {
    background: url(/Resources/FY/Sites/FindYoga/Images/Backgrounds/browseBox_bg.png) right bottom no-repeat;
    margin: 20px -280px 0px -10px;
    height: 408px;
} 

#browseBox .top {
    background: url(/Resources/FY/Sites/FindYoga/Images/Backgrounds/browseBox_top.png) no-repeat left top;
    display: block;
    height: 10px;
    width: 978px;
}

#browseBox .bottom {
    background: url(/Resources/FY/Sites/FindYoga/Images/Backgrounds/browseBox_bottom.png) no-repeat left top;
    display: block;
    height: 10px;
    width: 978px;
}

#browseBox .middle {
    background: url(/Resources/FY/Sites/FindYoga/Images/Backgrounds/browseBox_body.png) no-repeat left top;
    display: block;
    height: 235px;
    width: 978px;
    overflow: hidden;
}

#browseBox .middle #content {
    background: none;
}

#browseBox .middle #content .left {
    border: none;
}

/* Hide the right col content */

#browseBox .middle #content .right {
    display: none;
}

/* Adjust the bottom padding of list items to make it fit the box */

#browseBox .middle #content .left .browse-listing .col ul li {
    font-size: 11px;
    padding: 0px 10px 1px 0px;
}

/* Move the info box up */

#infoBox {
    margin: -140px 0px 0px -10px;
}

/* Update the design for info box */

#infoBox .top {
    background: url(/Resources/FY/Sites/FindYoga/Images/Backgrounds/infoBox_top.png) no-repeat left top;
    display: block;
    width: 935px;
    height: 34px;
    padding: 20px 0px 0px 43px;
}

#infoBox .top h3 {
    color: #0a3e5f;
    font-size: 14px;
    font-weight: bold;
    display: block;
    text-transform: uppercase;
    height: 30px;

}

#infoBox .top h3 a { text-decoration: none; }
#infoBox .top .links { font-size: 12px; text-transform: lowercase; padding: 0px 0px 0px 10px; font-weight: normal; }
            
#infoBox .top h3.UpcomingEvents {
    width: 355px;
    border-right: 1px solid #d3e0e6;
    float: left;
    padding: 4px 0px 0px 0px
}

#infoBox .top h3.MessageBoard {
    width: 314px;
    border-right: 1px solid #d3e0e6;
    float: left;
    padding: 4px 0px 0px 30px;
}

#infoBox .top h3.Tweet {
    float: left;
    background: url(/Resources/FY/Sites/FindYoga/Images/Icons/icon_twitter.png) right top no-repeat;
    padding: 4px 30px 0px 20px;
    width: 120px;
}

.is_ie7 #infoBox .top h3.Tweet { padding-right: 20px; zoom: 1; }

#infoBox .top a.twitter_follow {
    float: right;
    background: url(/Resources/FY/Sites/FindYoga/Images/Backgrounds/twitter_followUs.png) right top no-repeat;
    margin: 0px -30px 0px 0px;
    color: #9a1b69;
    padding: 7px 10px 7px 15px;
    font-size: 10px;
    text-decoration: none;
}

#infoBox .middle #information #twitter_update_list a { display: inline; }

.is_ie7 #infoBox .top a.twitter_follow { font-size: 9px; margin-right: -10px; }

#infoBox .top a.twitter_follow:hover {
    color: #0092CF;
}

#infoBox .middle {
    background: url(/Resources/FY/Sites/FindYoga/Images/Backgrounds/infoBox_body_repeat_y.png) repeat-y left top;
    width: 978px;
    overflow: hidden;
}


#infoBox .bottom {
    background: url(/Resources/FY/Sites/FindYoga/Images/Backgrounds/infoBox_bottom.png) no-repeat left top;
    display: block;
    width: 978px;
    height: 54px;
}

#infoBox .middle #content {
    margin-left: 13px;
    min-height: 590px;
    width: 700px;
    border-right: 1px solid #DBE5E9;
    padding-top: 0px;
}

#infoBox .middle #information h3 {
    background: none;
}

#infoBox .middle #information {
    background:#EEF9FE url(/Resources/FY/Sites/FindYoga/Images/Backgrounds/info_content_bg.png) repeat-x left top;
    display:block; 
    margin: 0px 10px 0px 0px;
    width: 204px;
    padding: 10px 0px 0px 20px;
    min-height: 400px;
    
}

#infoBox .middle #content .right {
    width: 300px;
}

#infoBox .middle #content .right .message {
    width: 280px;
}

/* Information Box styles update */

#infoBox .middle #content .left .inner img {
    background: url(/Resources/FY/Sites/FindYoga/Images/Backgrounds/infoBox_img_bg.png) center	center no-repeat;
}

#infoBox .middle #content .left .news span.date {
	background: #0092cf;
	color: #fff;
	padding: 3px 10px;
	-moz-border-radius: 3px;
}

/* Tweet styles */

#infoBox .middle #information ul li {
	font-style: italic;
	border-bottom: 1px solid #BDD7E3;
	padding: 10px 0px 10px 0px;
	margin: 0px 0px 10px 0px;
}

#infoBox .middle #information ul li a {
	color: #0092CF;
	display: block;
	font-style: italic;
	padding: 5px 0px 0px 0px;
}

#infoBox .middle #information ul li a:hover {
	color: #005579;
	display: block;
	font-style: italic;
	padding: 5px 0px 0px 0px;
}


 






