﻿/* 
family41_channels_screen.css
Copyright 2008, Focus on the Family
Created: 5/16/08
Modified: 5/4/10
Version 1.1
Modification history:
1/15/10: Changes to support Super Bowl
5/4/10: Declare the tab strip and override others
*/

/* overrides of other styles */


#editorialWell {width:747px;margin:0 0 0 12px;*margin:0 0 0 14px;}
#channelSideBar .sbBox { width:200px; overflow:hidden; background:url(/family/images/backgrounds/article_tile.png) repeat-y; padding-bottom:5px; }
#channelSideBar .sbBox .content {background:url(/family/images/backgrounds/newarticle_tile.png) repeat-y; overflow:hidden; padding-top:5px;  }
ul.backNext li { background:none; line-height:13px; margin:0; padding:0 0 0 3px; }
#mediaSelector ul.backNext li a { color:rgb(37,100,107); }
ul.backNext { margin:0 0 8px 0; float:right; }

#mediaSelector .sbBox { height:282px; }
#mediaSelector .sbBox .content { height:201px; }

/* main layout styles*/
#channelSideBar { width:198px; overflow:hidden; margin:4px 0px 0px 12px; float:left;  }

#mediaSelector { height:282px; margin:0 0 5px 0; overflow:hidden; }

#familyStore,
#yourStories { margin:0 0 5px 0; overflow:hidden; }

.storeboxLeft { width:506px; overflow:hidden; }

.mediaboxLeft { float:left; width:506px; overflow:hidden; height:292px; }

.storiesboxLeft { float:left; width:506px; overflow:hidden; }

/* edwell styles */
#pageLeft{float:left; width:200px;}
#pageRight{float:left;}
#bottomRight{margin:-4px 0 0 20px;float:left;border-top:1px solid rgb(62,108,121);border-left:1px solid rgb(62,108,121); }

.marriage {  }
.parenting { }

.channelTitle h1 { margin:0; height:63px; width:743px;  padding:15px 0 0 15px; }

.channelTitle h2.tagline { font-size:13px; line-height:15px; color:#fff; }

#playerBox { display:none; }
#featureBox { width:506px; padding:15px 15px 0 15px; margin:-27px 0 0 -15px; min-height:180px; overflow:hidden;  }

#featureBox h2 a {color:#80b5c3;text-decoration:none;}
#featureBox a.moreLink { color:#0d3c44; font-weight:bold; text-decoration:none; }
#featureBox h3 a { color:rgb(37,100,107);text-transform:uppercase; }

#featureBox h2 a:hover,
#featureBox a:hover.moreLink { color:rgb(139,184,179); }
#featureBox h3 { margin:0; font-size:1.2em; line-height:1.5em; font-weight:bolder;  }
#featureBox h2 { margin:5px 0; font-size:2.3em; line-height:1;font-weight:bold;text-transform:capitalize; }

#featureBox a.moreLink { float:right; text-decoration:none; font-weight:bold; }
#featureBox a.moreLink:hover { color:#A27E44; }

/* media box styles */

#tabs { width:506px; clear:both; overflow:hidden; padding-top:15px; }

#left span{padding:11px 0 0 68px;color:Gray; float:left; position:absolute;}

#filtedTitle{float:right;}
#mediaSelector #tabs div { float:right; width:300px; overflow:hidden; text-align:center; }
h2#mSelector,
#yStories h2,
h2#fStore { color:rgb(136,187,206); font-size:1.8em; font-weight:bolder; margin:0 0 3px 0; border-bottom:1px solid #4b4b4b; }

h2#mSelector { float:left; width:180px; border:none; margin:0;   }

h2#mSelector a{  margin-left:-10px;margin-top:-3px; color:rgb(31,71,81);text-transform:uppercase;font-size:0.6em;font-weight:bolder; line-height:1em; font-weight:bold;text-decoration:underline;}

#tabs ul { float:right;list-style:none; margin:0 auto; padding:0; overflow:hidden; }
#tabs li { border:1px solid #4b4b4b; border-bottom:none; margin:0 3px -1px 0px; }
#tabs a { display:block; padding:5px 10px; color:#0d3c44; background:#fff; text-decoration:none; }

#tabs a:hover { color:#A27E44; }

#tabs a.tab1selected,
#tabs a:hover.tab1selected { background:#0d3c44; color:#fff; }

#tabs a.tab2selected,
#tabs a:hover.tab2selected { background:#0d3c44; color:#fff; }

#tabs a.tab3selected,
#tabs a:hover.tab3selected { background:#0d3c44; color:#fff; }
.tabstrip ul { width:auto !important;}

#filterBox { overflow:hidden; height:210px; background-color:rgb(221,228,197); width:516px; clear:both; border-top:1px solid #4b4b4b; }

#sort { overflow:hidden; height:50px; margin:-5px 11px 0 2px;}
#sort1 { height:25px; overflow:hidden; }
#sort p,
#sort1 p { margin:6px 0 0 0; }
#sort ul,
#sort1 ul { text-align:right; list-style:none; margin:6px 0; padding:0; }
#sort li,
#sort1 li { display:inline; margin:0 1px; }
#sort li a,
#sort1 li a { color:#0d3c44; text-decoration:none;  font-weight:normal; }/* Modified by Sushma to Apply font-weight bold only to selected anchor */
#sort li a:hover,
#sort1 li a:hover { color:#A27E44; }
#sort li a.selected,
#sort1 li a.selected { font-weight:bold; }
#sort li a.selected:hover,
#sort1 li a.selected:hover { color:#A27E44; }

#filterBox .content img { width:88px; height:82px; margin:0 0 1px 13px; }
#filterBox .content { border-right:1px solid #4b4b4b; float:left; width:118px; height:188px; overflow:hidden; margin:1px 10px 0 0; }
#filterBox .content p { margin:0px 0 0px 18px; line-height:14px; overflow:hidden;  }
#filterBox .content .info { overflow:hidden; padding:0 0 2px 0; height:63px; }
#filterBox .last { margin-right:0; border:0 }

#filterBox h4 {  margin:0; }
#filterBox h4 a { font-size:.3em; background:url(/family/images/backgrounds/sprites.gif) no-repeat; padding:0 0 0 20px; font-weight:bold; }
#filterBox h4 a.Article { background-position: -328px -165px; }
#filterBox h4 a.Video { background:url(/family/images/backgrounds/sprites.gif) -283px -212px no-repeat; }
#filterBox h4 a.Audio { margin:0 0 3px 0; background:url(/family/images/backgrounds/sprites.gif) -303px -189px no-repeat; }


#filterBox .content h4 a { font-size:12px; font-family:Arial, Helvetica, sans-serif; color:#0d3c44; font-weight:bolder; text-decoration:none; }

#filterBox .content .info h4 a .desc,
#filterBox .content .info h4 a .sfhover { display:none; position:absolute; margin:0; }
#filterBox .content .info h4 a:hover .desc,
#filterBox .content .info h4 a:hover .sfhover { position:absolute; padding:10px; background:url(/family/images/backgrounds/info_bg.gif) no-repeat; width:200px; display:block; z-index:600; margin:-11px 0 0 -10px; font-weight:normal; font-size:10px; color:#000; text-decoration:none; height:110px; overflow:hidden; line-height:11px; }

#filterBox p { color:#4b4b4b; font-size:.9em; }
#editorialWell #filterBox p a { font-size:1em; color:#0d3c44; font-weight:bold; text-decoration:none; clear:both;  }
#editorialWell #filterBox p a:hover { color:#A27E44; }

#mediaPager,
#storePager,
#storiesPager { color:#4b4b4b; height:31px; padding:5px 0 0 0; overflow:hidden;  }

#mediaPager { margin-top:0px; background-color:rgb(239,228,206);}

#mediaPager li.first,
#storePager li.first,
#storiesPager li.first { text-transform:uppercase; color:rgb(63,94,97); font-weight:bold; }
#mediaPager ul,
#storePager ul,
#storiesPager ul { list-style:none; float:right; padding:0; margin:0; }
#mediaPager li,
#storePager li,
#storiesPager li { display:inline; margin:0 3px; }

#mediaPager ul li a,
#storePager ul li a,
#storiesPager ul li a { color:#0d3c44; font-size:15px; font-weight:bold; text-decoration:none;  }
#mediaPager ul li a:hover,
#storePager ul li a:hover,
#storiesPager ul li a:hover { color:#A27E44; }
#mediaPager ul li a.selected,
#storePager ul li a.selected,
#storiesPager ul li a.selected { color:#A27E44; }

#yStories { width:506px; overflow:hidden; padding-top:15px; margin:0 0 4px 0; border-bottom:1px solid #4b4b4b; }
#yStories h2 { width:200px; float:left; border:none; color:rgb(141,178,197);}
#yStories a { text-align:right; float:right; color:rgb(60,76,73); font-weight:bold; font-size:.9em; line-height:1; width:250px; text-decoration:none; margin:8px 5px 0 0; }
#yStories a:hover { color:#A27E44; }

/* sbBox styles */
#channelSideBar a { color:rgb(37,100,107); font-weight:bold; text-decoration:none; }
#channelSideBar a:hover { color:#A27E44; }
#channelSideBar .sbBox h2 { text-align:center; display:block; width:180px; padding:10px; height:17px; overflow:hidden; font-size:1.2em; font-weight:bold; color:#fff; background-color:rgb(69,113,126); margin:0; }
#channelSideBar .sbBox h3 a { font-size:0.6em; color:rgb(37,100,107);}

#channelSideBar li a { font-weight:bold; }

#channelSideBar .sbBox p { line-height:13px; }
#channelSideBar .sbBox a.moreLink { margin:0 10px 0 0;  }

/* family store styles */
.leftBorder { width:494px; padding:0 4px; overflow:hidden; margin:5px 0 5px 4px; }
#editorialWell #familyStore .resource,
#editorialWell #yourStories .resource { overflow:hidden; float:left; min-height:121px; width:235px; margin:0 0 0 5px; padding:4px 5px 0 0;  }
#editorialWell #familyStore .resource h4,
#editorialWell #yourStories .resource h4 { margin:0; float:left; width:140px; }
#editorialWell #familyStore .resource h4 a,
#editorialWell #yourStories .resource h4 a { color:rgb(41,81,93); font-size:.8em; font-weight:bold; text-decoration:none; float:left; }
#editorialWell #familyStore .resource h4 a:hover,
#editorialWell #yourStories .resource h4 a:hover { color:#A27E44; }
#editorialWell #familyStore .resource img,
#editorialWell #yourStories .resource img { float:left; margin:0 5px 0 5px; }
#editorialWell #familyStore .resource .itemDesc,
#editorialWell #yourStories .resource .itemDesc { float:left; line-height:1.1; font-size:1em; margin:5px 0 0 0; width:140px; }
#editorialWell #familyStore .resource a.moreLink,
#editorialWell #yourStories .resource a.moreLink { color:#0d3c44; text-decoration:none; float:right; }
#editorialWell #familyStore .resource a:hover.moreLink,
#editorialWell #yourStories .resource a:hover.moreLink { color:#A27E44; }
#editorialWell #familyStore .resource div.clear,
#editorialWell #yourStories .resource div.clear { display:none; clear:none; overflow:hidden; width:0em; height:0em; }

/* your stories styles */
#letterImage { display:none; }
#letterImage a { text-indent:-9999px; display:block; font-size:1px; width:136px; height:150px; background:url(/family/images/backgrounds/letterimage_background.gif) no-repeat; }
#letterImage b { text-indent:-9999px; display:block; font-size:1px; width:136px; height:150px; background:url(/family/images/backgrounds/keyboard.jpg) no-repeat; }
#mapImage a { text-indent:-9999px; display:block; font-size:1px; width:136px; height:150px; background:url(/family/images/backgrounds/mapofusa.gif) no-repeat; }
#submitLink { position:absolute; z-index:900; top:1137px; left:513px; }
#submitLink a { text-transform:uppercase; color:#fff; font-size:11px; line-height:13px; }
#readerSubmit { float:left; width:240px; margin:0; padding:0; overflow:hidden; }
#readerSubmit p { margin:0; }
#storyList { float:left; min-height:149px; width:180px; overflow:hidden; margin:0 0 3px 10px; padding:0 0 0 10px; border-left:1px solid #4b4b4b; }
#storyList ul { list-style:none; margin:0; padding:0; }
#storyList li { margin:0 0 5px 0; line-height:15px; }

#storyList li a { color:#0d3c44; font-weight:bold; text-decoration:none; }
#storyList li a:hover { color:rgb(60,76,73); }

#borderLine {height:135px; width:0px; border-right:1px solid #4b4b4b; margin-left:250px;position:absolute; margin-top:5px;}
