@charset "UTF-8";
/* 
pio_articles_screen.css
Copyright 2009, Plugged In
Created: 5/12/2009
Version:1.0
*/

/* main layout divs */
#titleBar {height:65px; text-indent:-9999px;margin:10px 0 0 20px; }
#titleBar h2(delete) { height:37px; width:260px;margin:3px 0 0 0;}
.date { color:#63a336; font-weight:bold; text-align:right; margin:-12px 5px 0 0;}
#article { width:432px; overflow:hidden; float:left; padding:0 0 0 53px; }
.mediaBox { overflow:hidden; float:left; margin:0 13px 0 0; }
.mediaBox img { margin-left:auto; margin-right:auto;}
#creditBox { width:219px; position:absolute; z-index:10; left:505px; padding-bottom:185px;top:75px; }
.creditboxTop { width:200px; height:9px; margin:0 0 0 9px; background:url(~/media/PIO/Images/Site/backgrounds/creditboxtop_bg.ashx) no-repeat; font-size:1px; overflow:hidden; text-indent:-9999px; clear:both; }
.creditboxBottom { width:200px; height:9px; margin:0 0 0 9px; background:url(~/media/PIO/Images/Site/backgrounds/creditboxbottom_bg.ashx) no-repeat; font-size:1px; overflow:hidden; text-indent:-9999px; clear:both; }

#sidebar { width:240px; float:right; overflow:hidden; padding:0 15px 0 0; }
.adBox { width:240px; clear:both; overflow:hidden; }
.reviewControls { width:146px; padding:5px 0 0 36px; }
.reviewControls ul li a { padding-right:8px; }
.reviewControls ul li a.listen { padding-right:0; }

/* article styles */
#article h1 { font-size:17px; font-weight:bold; margin:0 9px 17px 0; color:#9f250a; }
#article p { line-height:1.5; font-size:12px; margin:0 0 15px 0; }
#article p a { color:#3B5956; text-decoration:none;  }
#article p a:hover { color:#9f250a; text-decoration:underline; }
#article h3 { border-bottom:1px solid #ccc68d; text-indent:-9999px; padding-bottom:3px; margin:0 0 5px 0; width:432px; height:12px; font-size:1px; display:block; overflow:hidden; }
#article h3.shorter { width:230px; }

ul#share { overflow:hidden; width:200px; list-style:none; margin:20px 0 0 9px; padding:13px 0 0 0;  }
#share li { padding:3px 0 0 0; }
#share li a { display:block; width:198px; height:21px; text-indent:-9999px; font-size:1px; background:url(~/media/PIO/Images/Site/backgrounds/share_bg.ashx) no-repeat; }

#share a#send { background-position:0 -24px; }
#share a#print { background-position:0 -48px; }

#share a#shareThis:hover { background-position:0 -69px; }
#share a#send:hover { background-position:0 -93px; }
#share a#print:hover { background-position:0 -117px; }


/* Social Media Share Tools Starts */


#socialMediaContainer  {margin:21px 0 0 0; height:auto;padding:0;  position:absolute;  }

 .shareBtn { background: url("~/media/PIO/Images/Site/backgrounds/pio-share-button.ashx") no-repeat scroll 0 0 transparent; margin-left:15px;  padding: 3px 0 0 0;width:155px; height:22px; float:left; cursor:pointer; text-indent:-9999px; }
 .shareBtn:hover { background-position: 0 -25px; }
 .shareBtn img {border:0; outline:none;}
 
.shareTools { margin:28px 0 0 4px; width:210px; padding:5px 0 5px 0; position:relative; box-shadow: 0 0 5px #AAAAAA;background-color: #fff; display:block; border-top:20px solid #63A336; overflow:hidden;  }
.shareIcon { margin-left:5px; width:104px; overflow:hidden; }
.shareIcon ul { margin: 0; padding:0; }
.shareIcon li { margin:3px 0 3px 0; float:left; list-style:none;padding:0; background:none; width:104px;  }
.shareIcon li a {list-style:none;padding:0;margin:0; float:left; color:#000!important; font-weight:bold; text-decoration:none!important;}
.shareIcon li a span {text-decoration:none!important; top:4px; position:relative;}
.shareIcon li a span:hover, .shareIcon li a:hover img {text-decoration:underline!important;}
.shareIcon li a img{ margin-right:3px; float:left;}
.leftShare { float:left; width:97px;  } 
.rightShare { float:left; width:97px;  } 


/* Social Media Share Tools End */


#article h3 { background:url(~/media/PIO/Images/Site/backgrounds/subtitles_bg.ashx) no-repeat; }

#article h3.postiveElements { background-position:0 0; }
#article h3.spiritualContent { background-position:0 -15px; }
#article h3.sexualContent { background-position:0 -30px; }
#article h3.violentContent { background-position:0 -45px; }
#article h3.crudeLanguage { background-position:0 -60px; }
#article h3.drugContent { background-position:0 -75px; }
#article h3.negativeElements { background-position:0 -90px; }
#article h3.conclusion { background-position:0 -105px; }
#article h3.proSocial { background-position:0 -120px; }
#article h3.objectionable { background-position:0 -135px; }
#article h3.summmaryAdvisory { background-position:0 -150px; }
#article h3.videoExtras { background-position:0 -165px; }


/* credits box styles */
p.editorsNote { width:200px; height:100px; margin:0 0 7px 9px; font-size:1px; text-indent:-9999px; color:#a47c68; }

#creditBox dl { width:184px; /*background:#fff;*/ margin:0 0 0 7px; padding:0 8px 8px 8px; }
#creditBox dt { font-weight:bold; font-size:9px; text-transform:uppercase; color:#886955; margin:5px 0 0 0;clear:both; }
#creditBox dd { margin:0; font-size:11px; }

#creditBox a,
#creditBox dd a { color:#3B5956; text-decoration:none;  }
#creditBox a:hover,
#creditBox dd a:hover { color:#9f250a; text-decoration:underline; }

#creditBox dl dt#mpaa { height:1px; text-indent:-9999px; font-size:1px; margin:0; }

#creditBox dl dd.r,
#creditBox dl dd.g,
#creditBox dl dd.pg, 
#creditBox dl dd.pg13,
#creditBox dl dd.nc17,
#creditBox dl dd.nr { width:19px; height:18px; font-size:1px; text-indent:-9999px; background:url(~/media/PIO/Images/Site/backgrounds/mpaa_bg.ashx) no-repeat; }

#creditBox dl dd.r { background-position:0 0; }
#creditBox dl dd.g { background-position:0 -18px; }
#creditBox dl dd.pg { width:29px; background-position:0 -36px; }
#creditBox dl dd.pg13 { width:44px; background-position:0 -54px; }
#creditBox dl dd.nc17 { width:44px; background-position:0 -72px; }
#creditBox dl dd.nr { width:29px; background-position:0 -91px; }
#creditBox dl dt.first { margin-top:0; padding-top:0; }

/* find styles */
#find { margin-bottom:12px; border-left:1px solid #63A436; line-height:normal;float:left; width:214px;/*height:272px;*/padding:0 0 0 30px; overflow:hidden; /*background:url(~/media/PIO/Images/Site/backgrounds/find_bg_green.ashx) no-repeat;*/}
#find h1 { margin:0 0 10px -2px; text-indent:-9999px; font-size:1px; width:214px; height:15px;background:url(~/media/PIO/Images/Site/backgrounds/findreviews_bg.ashx) no-repeat;}
#find ul { list-style:none; margin:0 0 10px 0; padding:0; width:185px;padding:0 0 0 3px;}
#find ul li { display:inline; padding:0 2px 0 0;}  
#find ul li a { font-weight:bold; font-size:12px; color:#6e4537; text-decoration:none; }
#find ul li a:hover { text-decoration:underline; }

#find p.showAll { margin:0 0 5px 50px; text-align:right; width:60px; overflow:hidden; }
#find p a { text-decoration:none;color:#6e4537; font-size:12px; text-align:right;  }
#find p a:hover { text-decoration:underline; }

#find p.linkClock{margin:22px 0 0 75px;}
#find p.linkClock a {width:34px; height:35px; overflow:hidden; display:block; font-size:10px;text-align:left;text-indent: -9999px;}

.dropdowns { margin:11px 0 0 20px; width:177px; float:left; text-align:left; }
.dropdowns span { display:block; margin:0 0 4px 0; font-weight:bold; font-size:12px; color:#6e4537; }
#find p.instructions { padding:20px 0; width:182px; float:left; margin:0; text-align:left; font-size:12px; line-height:1.3; }

.genre,.rating,.network{ width:150px; border:1px solid #63a436; margin-bottom:10px; }

#ratingDropdown,
#genreDropdown,
#platformDropdown,
#channelDropdown,
#albumsandtracksDropdown,
#upfrontDate,
#upfrontCategory,
#audienceDropdown { width:150px; border:1px solid #63a436; margin-bottom:10px; }
.sideAdReview{width:100%;height:180px;margin: 80px 0 0 15px;}
.sideAdReview img {border: medium none;height: 150px;width: 198px;}
.bottomReviewAd{width:728px;height:90px;margin: 0px auto 0;position:relative;top:28px;}


#creditBox .numRatings { width:188px; float:left; margin:0 0 18px 15px; border-bottom:#f4f5f2 1px solid; }
#creditBox .ratingTitle { font-size:14px; color:#888; font-weight:bold; float:left;  }
#creditBox .popupIcon { float:left; margin-left:5px; }
#creditBox .popupIcon a img { border:0; }
#creditBox .ratingPlugs { border-bottom:#d0d2ce 1px solid; padding:15px 0 22px 0; float:left; width:100%; }
#creditBox .cautionTitle { font-size:14px; color:#888; width:100%; font-weight:bold; float:left; border-top:#f4f5f2 1px solid; padding:13px 0 11px 0; }
#creditBox .ratingImgs { float:left; }
#creditBox .ratingImgs .adultsImg, #creditBox .ratingImgs .teensImg, #creditBox .ratingImgs .kidsImg { float:left; margin-right:5px; }
#creditBox .ratingLegends { border-bottom:#d0d2ce 1px solid; padding:18px 0 13px 0; float:left; width:100%; }
#ratingPoptext{ background:url(/~/media/PIO/Images/Ratings/rating-popupbox-bg.png) no-repeat transparent; width:262px; height:135px; padding:11px; top:-119px !important; left:-29px !important; }
#ratingPoptext h2 { font-size:16px; color:#a1f045; font-weight:bold; text-transform:uppercase; margin:0; text-shadow: 0 0 5px #000; }
#ratingPoptext p { font-size:12px; color:#fff; margin:4px 0 0 0; line-height:18px; text-shadow: 0 0 5px #000; }
#ratingPoptext #close img { position:absolute; right:7px; top:-10px; border:0; }
#ratingPopup { display: block;}

/* Main box styles */
.MainBoxRating dd.r,
.MainBoxRating dd.g,
.MainBoxRating dd.pg, 
.MainBoxRating dd.pg13,
.MainBoxRating dd.nc17,
.MainBoxRating dd.nr { width:19px; height:18px; font-size:1px; text-indent:-9999px; background:url(~/media/PIO/Images/Site/backgrounds/mpaa_bg.ashx) no-repeat; float:left; }

.MainBoxRating dd.r { background-position:0 0; }
.MainBoxRating dd.g { background-position:0 -18px; }
.MainBoxRating dd.pg { width:29px; background-position:0 -36px; }
.MainBoxRating dd.pg13 { width:44px; background-position:0 -54px; }
.MainBoxRating dd.nc17 { width:44px; background-position:0 -72px; }
.MainBoxRating dd.nr { width:29px; background-position:0 -91px; }
.MainBoxRatingx dt.first { margin-top:0; padding-top:0; }

/* Large box styles */
#LargeBox { width:100%; float:left; }

.LargeBoxRating dd.r,
.LargeBoxRating dd.g,
.LargeBoxRating dd.pg, 
.LargeBoxRating dd.pg13,
.LargeBoxRating dd.nc17,
.LargeBoxRating dd.nr { width:19px; height:18px; font-size:1px; text-indent:-9999px; background:url(~/media/PIO/Images/Site/backgrounds/mpaa_bg.ashx) no-repeat; float:right; }
.LargeBoxRating dd.pg13, .LargeBoxRating dd.r, .LargeBoxRating dd.g, .LargeBoxRating dd.pg, .LargeBoxRating dd.pg13, .LargeBoxRating dd.nc17 { *margin-top:10px; }


.LargeBoxRating dd.r { background-position:0 0; }
.LargeBoxRating dd.g { background-position:0 -18px; }
.LargeBoxRating dd.pg { width:29px; background-position:0 -36px; }
.LargeBoxRating dd.pg13 { width:44px; background-position:0 -54px; }
.LargeBoxRating dd.nc17 { width:44px; background-position:0 -72px; }
.LargeBoxRating dd.nr { width:29px; background-position:0 -91px; }
.LargeBoxRating dt.first { margin-top:0; padding-top:0; }

.LargeBoxReview .reviewControls { clear: both; float: left; padding: 5px 0 15px; width: 146px; }
.MainBoxReview .reviewControls { width:146px; padding:5px 0 15px 0; }

#LargeBox .mediaBox { *margin:0 0 10px 0; }

.LargeBoxReview h1 { color: #9F250A; float: left; font-size: 17px; font-weight: bold; margin: 0 9px 10px 0 !important; width:375px !important; }

.LargeBoxReview h1 { *margin:10px 0 10px 0 !important; width:375px !important; }

.MediaBoxReview h1 { margin:0 9px 0 0 !important;}

#LargeBox .mediaBox, #MainBox .mediaBox { overflow:hidden; float:left; margin:0 13px 13px 0;  }
#LargeBox .mediaBox { width:100%; }
.creditsText{ color: #888888; float: left; font-size: 14px; font-weight: bold; margin-bottom:10px; }

.MainBoxReview h1 { font-size:17px; font-weight:bold; margin:0 9px 7px 0 !important; color:#9f250a; }

/* Play Icon styles starts here */
div.mediaBox {
    display: inline-block;
    position: relative;
}
/*:before and :after used to get rid of underline on hover in Safari*/
    div.mediaBox .fa-play-circle-o:before {
        content: "";
    }

    div.mediaBox .fa-play-circle-o:after {
        content: "\f01d";
        color: #fff;
        top: 50%;
        left: 50%;
        position: absolute;
        z-index: 1;
        width: 75px;
        height: 75px;
        margin: -42px 0 0 -38px;
    }

    div.mediaBox a:hover img {
        opacity: 0.8;
    }

#MainBox div.mediaBox .fa-play-circle-o:before {
    content: "";
}

#MainBox div.mediaBox .fa-play-circle-o:after {
    content: "\f01d";
    color: #fff;
    top: 50%;
    left: 50%;
    position: absolute;
    z-index: 1;
    width: 47px;
    height: 47px;
    margin: -28px 0 0 -24px;
}
/* Play Icon styles ends here */
/* Clearplay styles starts here */
.clearPlayContainer {
    padding-left:15px;
    margin-top:65px;
    margin-bottom:-60px;
}
/* Clearplay styles ends here */