@media (min-width : 0px) and (max-width : 789px){ .holder_wide { margin: 0 auto; width: 380px !important; } .post { float: left; margin: 0 0 30px 30px; overflow: hidden; position: relative; width: 380px; } } @media (min-width : 790px){ .holder_wide { margin: 0 auto; width: 790px !important; } } @media (min-width : 1200px){ .holder_wide { margin: 0 auto; width: 1200px !important; } } @media (min-width : 1610px){ .holder_wide { margin: 0 auto; width: 1610px !important; } } @media (min-width : 2020px){ .holder_wide { margin: 0 auto; width: 2020px !important; } } /* Desktops and laptops ----------- */ @media (min-width : 769px){ body{ -webkit-overflow-scrolling: touch; } .white_bg{ background-color:#fff; } @font-face { font-family: 'geogrotesque_mdmedium'; src: url('../fonts/geogtq-md-webfont.eot'); src: url('../fonts/geogtq-md-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/geogtq-md-webfont.woff') format('woff'), url('../fonts/geogtq-md-webfont.ttf') format('truetype'), url('../fonts/geogtq-md-webfont.svg#geogrotesque_mdmedium') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'geogrotesque_rgregular'; src: url('../fonts/geogtq-rg-webfont.eot'); src: url('../fonts/geogtq-rg-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/geogtq-rg-webfont.woff') format('woff'), url('../fonts/geogtq-rg-webfont.ttf') format('truetype'), url('../fonts/geogtq-rg-webfont.svg#geogrotesque_rgregular') format('svg'); font-weight: normal; font-style: normal; } html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { border: 0 none; font-size: 100%; margin: 0; padding: 0; } .logo-holder .logo { height: 23px; left: 50%; margin: 0 0 0 -206px; position: absolute; text-align: left; width: 412px; z-index: 99; } .logo a { background-image: url("../images/logo@2x.png"); background-repeat: no-repeat; display: block; height: 24px; width: 412px; background-size:100% } /*share drop*/ ul.new_sharing { display: none; height: auto; line-height: 40px; margin: 0; padding: 0 10px; width: 50px; z-index: 9999999; } .new_sharing li a { display: block; height: 45px; line-height: 45px; } .new_sharing li a:hover{ zoom: 1; filter: alpha(opacity=60); opacity: 0.6; } ul.new_sharing li, ul.new_sharing_land li { border-bottom: 1px solid #888888; display: block; height: 45px; list-style: none outside none; margin: 0; padding: 0; width: 30px; } ul.new_sharing li:last-child, ul.new_sharing_land li:last-child { border-bottom: 0px solid #888888; } /*.holder { background-color: #000000; font-family: helvetica; margin: auto; position: absolute; right: 80px; text-align: center; top: 0; width: 50px; }*/ ul, li { margin:0; padding:0; list-style:none; } .share { color: #FFFFFF; font-size: 11px; height: 45px; line-height: 45px; } /*share drop*/ /*masonry*/ @font-face { font-family: 'klinic_slabbook'; src: url('../fonts/klinicslabbook-webfont.eot'); src: url('../fonts/klinicslabbook-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/klinicslabbook-webfont.woff') format('woff'), url('../fonts/klinicslabbook-webfont.ttf') format('truetype'), url('../fonts/klinicslabbook-webfont.svg#klinic_slabbook') format('svg'); font-weight: normal; font-style: normal; } .centered { width: 80%; height: 75%; overflow: auto; margin: auto; position: absolute; top: 0; left: 0; bottom: 0; right: 0; } .w2 .centered { width: 50%; height: 60%; } .text, .text-js { letter-spacing: 0.5px; font-family: 'Open Sans', sans-serif; font-weight:300; font-size:16px; line-height:150%; background-image:url(../images/gold_90.png); bottom: 0; color: #FFFFFF; display: none; left: 0; padding: 20px 50px; position: absolute; right: 0; text-align: center; top: 0; width: 100%; cursor:pointer; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } .w2 .text-js{ padding: 20px 25% !important; } .item:hover .text { display: block } .read_more { border: 2px solid #000000; margin: 0 auto 40px; position: relative; top: 0; width: 150px; } .read_more a{ color:#000; font-family: 'Open Sans', sans-serif; font-size:16px; line-height:150%; display:block; padding:10px 20px; text-decoration:none } .read_more a:hover{ background-image:url(../images/black_70.png); text-decoration:none; color:#fff } #grid { margin: 0 auto; max-width: 1200px; padding: 30px 0; } .grid li { display: block; float: left; /*opacity: 0;*/ } .grid li.shown, .no-js .grid li, .no-cssanimations .grid li { opacity: 1; } .outer { background-color: #F2F2F2; position: relative; } .item { position: relative; background-color: #FFFFFF; float: left; margin: 0 0 30px; width: 380px; padding: 0; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-box-shadow: 0px 1px 1px 1px rgba(0, 0, 0, .05); box-shadow: 0px 1px 1px 1px rgba(0, 0, 0, .05); } .item.w2 {width: 790px; } .item img { display: block; width: 100%; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px; } .meta_wrap { background-color: #FFFFFF; overflow: auto; padding: 0; position: relative; z-index: 999999; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; } .item .meta { background-color: #FFFFFF; color: #CCCCCC; padding: 15px 10px 5px; } .item .meta2 { background-color: #FFFFFF; border-top: 1px solid #DDDDDD; margin: 10px; padding:10px 0 0; overflow: auto; } .item .meta h1 { color: #C0A764; font-family: 'klinic_slabbook'; font-size: 26px; line-height: 26px; } .item .meta h1 a { color: #b0944f; text-decoration: none; } .item .meta h1 a:hover{ color:#9d7f34; text-decoration:none } .item .meta h2{ font-family: 'Open Sans', sans-serif; letter-spacing: 0.5px; font-weight:300; color:#000; font-size:14px; line-height:150%; margin-top: 5px; text-transform:uppercase } .item .meta2 h1 { color: #000000; float: left; font-family: 'Open Sans',sans-serif; font-size: 14px; font-weight: 300; line-height: 150%; text-align: left; text-transform: uppercase; } .item .meta2 h2 { background-image: url("../images/comment_land.png"); background-position: right 3px; background-repeat: no-repeat; color: #8D855A; float: right; font-family: 'Open Sans',sans-serif; font-size: 14px; font-weight: 300; line-height: 150%; padding-right: 22px; text-align: right; text-transform: uppercase; } .grid li a, .grid li img { outline: none; border: none; display: block; max-width: 100%; } /* Effect 2: Move Up */ .grid.effect-2 li.animate { -webkit-transform: translateY(200px); -moz-transform: translateY(200px); transform: translateY(200px); -webkit-animation: moveUp 0.65s ease forwards; -moz-animation: moveUp 0.65s ease forwards; animation: moveUp 0.65s ease forwards; } @-webkit-keyframes moveUp { to { -webkit-transform: translateY(0); opacity: 1; } } @-moz-keyframes moveUp { to { -moz-transform: translateY(0); opacity: 1; } } @keyframes moveUp { to { transform: translateY(0); opacity: 1; } } /*masonry*/ .fyre .fyre-comment p { line-height: 22px; margin: 0 0 10px !important; padding: 0 !important; } #progress { background-color:#000; height: 45px; position: fixed; top: 0; z-index: 200; } .photo_cred { bottom: 5px; color: #999999; font-family: Arial,Helvetica,sans-serif; font-size: 10px; position: absolute; right: 5px; z-index: 999; } .main_stick{ margin-top:-45px; } img.slug { margin: 0 0 0 5px; } .network_bar{ height:35px; width:100%; text-align:center; background-image:url(../images/network_bar_bg.jpg); } .header_top { background-image: url("../images/75_trans.png"); height: 45px; position: absolute; width: 100%; z-index: 9999; } .header_top_land { width: 100%; z-index: 9999; } .absolute-center{ bottom: 0; left: 0; margin: auto; position: absolute; right: 0; top: 0; z-index: 999; } .absolute-center img { width:auto !important; } .landing{ position:relative } .landing img { position: relative; width: 100%; z-index: 10; } .comingsoon { bottom: 0; color: #FFFFFF; font-family: 'PT Serif',serif; font-size: 50px; height: 70px; left: 0; letter-spacing: 8px !important; line-height: 30px; margin: auto; position: absolute; right: 0; text-align: center; top: 0; width: 450px; z-index: 999; } .comingsoon .title{ font-style:italic; letter-spacing:normal; font-size:20px; line-height:20px; } .landing .date { font-family: 'PT Serif', serif; color: #FFFFFF; font-size: 14px; left: 10px; position: absolute; top: 10px; z-index: 999; } .top_holder { background-image: url("../images/gold_90.png"); box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.05); padding: 25px 0 0; position: relative; width: 100%; z-index: 99; } .logo_land { clear: both; margin: 35px auto 0; text-align: center; width: 100%; } .more-stories { background-color: #151515; color: #FFFFFF; font-family: 'PT Serif',serif; font-size: 14px; line-height: 16px; margin: 0; padding: 10px; text-align: center; } .more-stories span { background-image: url("../images/down_arrow.png"); background-position: center center; background-repeat: no-repeat; letter-spacing: 1px; padding: 0 20px 0 20px; text-transform: uppercase; } .header_top .logo { height: 45px; line-height: 45px; margin: 0 auto; width: 397px; } .header_top .logo_si { display:none; height: 23px; margin: 4px 0 0 10px; width: 254px; } hr.sep { background-color: #000000; border: 0 none; height: 2px; margin: 0; } ul.sharing { float: right; height: 40px; line-height: 40px; margin: 0; position: absolute; right: 10px; top: 0; z-index: 9999999; } ul.sharing_land { height: 30px; line-height: 30px; margin: 0; padding: 0 10px 0 0; right: 10px; text-align: right; top: 0; z-index: 9999999; } ul.sharing li, ul.sharing_land li { display: inline-block; list-style: none outside none; margin: 0 2px; } ul.sharing li.comments, ul.sharing_land li.comments { background-image: url("../images/comments.png"); background-position: center 1px; background-repeat: no-repeat; color: #FFFFFF; font-family: 'geogrotesque_mdmedium' !important; font-size: 12px; height: 20px; line-height: 18px; margin: 0; padding-top: 0; text-align: center; vertical-align: middle; width: 18px; } /*.header_top .comments { background-color: #000000; background-image: url("../images/comments_new.png"); background-position: center center; background-repeat: no-repeat; font-family: helvetica; font-size: 11px; height: 45px; line-height: 40px; margin: auto; position: absolute; right: 30px; text-align: center; top: 0; width: 50px; } .header_top .comments a { color: #FFFFFF; display: block; } .header_top .comments a:hover { text-decoration:none }*/ ul.sharing li.comments a, ul.sharing_land li.comments a{ color: #FFFFFF; font-size: 10px; } .footer_comments { margin: 0 auto; max-width: 700px; padding: 20px 0; } #footer .sep_up { background-image: url("../images/sep_up.jpg"); height: 20px; margin: 60px 0; } #footer .sep_down { background-image: url("../images/sep_down.jpg"); height: 20px; margin: 60px 0; } #footer #credits { color: #595959; font-size: 15px; text-align: center; font-family: 'geogrotesque_rgregular' !important; } #footer #credits a{ color: #595959; } #footer #credits a:hover{ color: #999; } #footer #credits p { margin: 10px 20px !important; padding: 0; } #footer #credits strong { font-family: 'geogrotesque_mdmedium' !important; font-weight: normal; } #footer #credits .logo { margin: 0 auto 40px; width: 255px; } #footer #more_posts { margin: 0 auto; max-width: 1200px; overflow: auto; width: 100%; } #footer #more_posts .column{ width:370px; } ol, ul { list-style: none outside none; } /*ol.slats { float: left; margin: 0 1.5%; width: 30%; }*/ ol.slats { float: left; margin: 0 1%; width: 31%; } ol.slats li { border-bottom: 1px solid #EEEEEE; margin: 15px 0 0; overflow: auto; padding: 0 0 15px; } ol.slats li h3 { font-family: 'geogrotesque_mdmedium' !important; text-transform:uppercase; font-size: 18px; font-weight: bold; line-height: 1.1; } ol.slats li h3 a{ color:#000; text-decoration:none } ol.slats li h3 a:hover{ color:#999; text-decoration:none } ol.slats li h3 a img { float: left; margin: 0 10px 0 0; padding: 4px; border: 1px solid #eee; } ol.slats li h3 a:hover img { background: #eee; } ol.slats li p { font-family: 'geogrotesque_mdmedium' !important; margin: 0 0 0 76px; font-size: 14px; line-height: 1.4; } ol.slats li span.meta { font-family: 'geogrotesque_mdmedium' !important; display: block; font-size: 14px; color: #808080; } #footer #base{ } #footer #base .logo { margin: 0 auto 20px; width: 101px; } #footer #base .footer_terms { color: #666666; font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; font-size: 10px; line-height: 16px; margin: 0 auto; max-width: 800px; text-align: center; } .fixed_scroll { background: none repeat scroll 0 0 #FFFFFF; display: none; left: 10px; padding: 5px; position: fixed; top: 50px; z-index: 999; } #more_posts .col-md-4{ padding:5px 0; overflow:hidden } #more_posts h3 { font-family: 'geogrotesque_mdmedium' !important; font-size: 18px; font-weight: bold; line-height: 1.1; text-transform: uppercase; min-height: 40px; } #more_posts h3 a { color: #000000; text-decoration: none; } .backtosi { height: 130px; line-height: 130px; margin: 0 auto; padding: 0; width: 200px; } .backtosi img{ width: 100% } #more_posts h3 a img { border: 1px solid #EEEEEE; float: left; margin: 0 10px 0 0; padding: 4px; } #more_posts span.meta { color: #808080; display: block; font-family: 'geogrotesque_mdmedium' !important; font-size: 14px; line-height: 20px; } #more_posts p { font-family: 'geogrotesque_mdmedium' !important; font-size: 14px; line-height: 1.4; margin: 0 !important; padding: 0 0 15px 0 !important; } #siBar-wrapper UL.inner LI { line-height: 18px; } #more_posts h3 a:hover{ color:#999; text-decoration:none } #more_posts h3 a:hover img { background: #eee; } .video-container > span { display:block !important; } #more_posts h2 { color: #666666; font-family: Helvetica, sans-serif; font-size: 16px; font-weight:normal; line-height: 20px; margin: 0 0 30px; text-align: center; } /*LIVEFYRE*/ div#livefyre a.lf_comment_user_nick { color : #465A67; } div#livefyre div.lf_body p a { color : #EC2C21; } #cnnStoryContent { /*padding-bottom: 36px;*/ } #showCommentsBtn { background: url(http://i.cdn.turner.com/si/.element/img/4.1/story/global/scroll_down.png) no-repeat; display: block; width: 295px; height: 21px; margin: 5px auto; position: relative; /*top: -35px; margin-bottom: -35px;*/ } #showCommentsBtn:hover { background-position: left bottom; } .ie7 #showCommentsBtn { margin-bottom: -10px; } #livefyre .lf_action_bar { background: none!important; border: none!important; } #livefyre .lf_action_bar .lf_follow_link label { background: url(http://i.cdn.turner.com/si/.element/img/4.1/story/global/follow_conversation.png) no-repeat; display: block; width: 154px; height: 21px; margin: -7px 0 0 -14px; text-indent: -9999px; } #livefyre .lf_action_bar .lf_follow_link label:hover { background-position: left bottom; } #livefyre .lf_share_post { float: left!important; margin-left: 160px!important; } #livefyre .lf_post { background: url(http://i.cdn.turner.com/si/.element/img/4.1/story/global/post_comment.png) no-repeat; width: 154px; height: 21px!important; padding: 0!important; margin: 5px 0 0 0!important; border: none!important; text-indent: -9999px; border-radius: 0px!important; box-shadow: none!important; } #livefyre .lf_post:hover { background-position: left bottom; } #livefyre .lf_comment_container .lf_comment .lf_comment_footer .lf_comment_date { position: absolute; top: 0; right: 0; text-align: right; margin-top: 8px; color: #000; } #livefyre .lf_comment_container:hover .lf_comment .lf_comment_footer .lf_comment_date { display: block!important; } #livefyre .lf_comment_container .lf_comment .lf_comment_footer .lf_share, #livefyre .lf_comment_container .lf_comment .lf_comment_footer .lf_flag, #livefyre .lf_comment_container .lf_comment .lf_comment_footer .lf_mod_options a { opacity: 100; filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; } #livefyre .lf_comment_container:hover .lf_comment .lf_comment_footer .lf_share, #livefyre .lf_comment_container:hover .lf_comment .lf_comment_footer .lf_flag, #livefyre .lf_comment_container .lf_comment .lf_comment_footer .lf_mod_options a:hover { opacity: 1; filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; } #livefyre .lf_comment_container .lf_comment .lf_comment_footer .lf_share, #livefyre .lf_comment_container .lf_comment .lf_comment_footer .lf_flag, #livefyre .lf_comment_container .lf_comment .lf_comment_footer .lf_mod_options a { display: block!important; width: 49px; height: 21px!important; padding: 0!important; text-indent: -9999px; border: none!important; } #livefyre .lf_comment_container .lf_comment .lf_comment_footer .lf_mod_options a { background: url(http://i.cdn.turner.com/si/.element/img/4.1/story/global/delete.png) no-repeat!important; } #livefyre .lf_comment_container .lf_comment .lf_comment_footer a.lf_like, #livefyre .lf_comment_container .lf_comment .lf_comment_footer a.lf_reply { display: block; width: 49px; height: 21px!important; padding: 0!important; text-indent: -9999px; border: none!important; border-radius: 0px!important; opacity: 100; filter: alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; } #livefyre .lf_comment_container .lf_comment .lf_comment_footer .lf_share { background: url(http://i.cdn.turner.com/si/.element/img/4.1/story/global/share.png) no-repeat!important; } #livefyre .lf_comment_container .lf_comment .lf_comment_footer .lf_flag { background: url(http://i.cdn.turner.com/si/.element/img/4.1/story/global/flag.png) no-repeat!important; } #livefyre .lf_comment_container .lf_comment .lf_comment_footer a.lf_like { background: url(http://i.cdn.turner.com/si/.element/img/4.1/story/global/like.png) no-repeat; float: left!important; } #livefyre .lf_comment_container .lf_comment .lf_comment_footer a.lf_reply { background: url(http://i.cdn.turner.com/si/.element/img/4.1/story/global/reply.png) no-repeat; } #livefyre .lf_comment_container .lf_comment .lf_comment_footer a.lf_reply:hover, #livefyre .lf_comment_container .lf_comment .lf_comment_footer a.lf_like:hover, #livefyre .lf_comment_container .lf_comment .lf_comment_footer .lf_share:hover, #livefyre .lf_comment_container .lf_comment .lf_comment_footer .lf_flag:hover, #livefyre .lf_comment_container .lf_comment .lf_comment_footer .lf_mod_options a:hover { background-position: left bottom!important; } #livefyre .lf_comment_container .lf_comment .lf_comment_footer .lf_mod_options { padding: 0!important; } /*LIVEFYRE*/ }