/* ---------------------------------------------------------- It Gets Better Project CSS Managed by: Blue State Digital TABLE OF CONTENT 01 - GLOBAL BROWSER RESET 02 - COMMON STYLE 03 - LAYOUT 04 - HOMEPAGE 05 - SUBPAGES 06 - FRAMEWORK 07 - UTILITY COLOR GUIDE (Main Site Colors and their Hex Codes) ---------------------------------------------------------- */ /* 01 =GLOBAL BROWSER RESET ---------------------------------------------------------- */ /* YUI Reset version: 2.7.0 */ html { color: #000; background: #FFF; } body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td { margin: 0; padding: 0; } table { border-collapse: collapse; border-spacing: 0; } fieldset,img { border: 0; } address,caption,cite,code,dfn,em,strong,th,var,optgroup { font-style: inherit; font-weight: inherit; } del,ins { text-decoration: none; } li { list-style: none; } caption, th { text-align: left; } h1,h2,h3,h4,h5,h6 { font-size: 100%; font-weight: normal; } q:before, q:after { content: ''; } abbr,acronym { border: 0; font-variant: normal; } sup { vertical-align: baseline; } sub { vertical-align: baseline; } /*because legend doesn't inherit in IE */ legend { color: #000; } input,button,textarea,select,optgroup,option { font-family: inherit; font-size: inherit; font-style: inherit; font-weight: inherit; } /*@purpose To enable resizing for IE */ /*@branch For IE6-Win, IE7-Win */ input,button,textarea,select { *font-size: 100%; } .hide {display:none !important;} /* 02 =COMMON STYLE ---------------------------------------------------------- */ body { font: .8em/17px Helvetica; color: #000000; } .base h1 { color: #401537; font-size: 1.85em; line-height: 1em; margin-bottom: 15px; } .base h2 { color: #ffffff; text-transform: uppercase; font-size: 1.1em; line-height: 1.2em; margin-bottom: 10px; } .base .content-box h2 { color: #000000; text-transform: none; margin-bottom: 10px; font-size: 1.25em; font-weight: bold; } .base h3 { color: #401537; font-size: 1.2em; font-weight: bold;margin-bottom: 5px } .base h4, .base h4 a, .base h1.h4 { color: #401537; font-size: 1.1em; text-transform: none; margin-bottom: 3px; } .base h5 { color: #676767; font-size: 1.2em; text-transform: uppercase; margin-bottom: 10px; line-height: 1.4em; } .base p { margin-bottom: 10px; } a { text-decoration: none; color: #400b35; font-size: .85em; text-transform: uppercase; font-weight: bold; } a:hover { text-decoration: underline; } blockquote { margin-left: 45px; padding: 10px; margin-top: 10px; margin-bottom: 10px; background-color: rgba(48,14,42,0.39); font-size: .95em; } .base ul, ol { padding-left: 20px; } .base ul { } .base ol { } .base ul li { list-style-type: circle; list-style-position: outside; } .base ol li { list-style-type: decimal; list-style-position: outside; margin-bottom: 5px; } .base li ol { padding-left: 15px; } .base ol ul li { list-style-position: inside; list-style-type: disc; margin-top: 5px; } .base ol ul { padding-left: 10px; } .strong { } .yellow { color: #ffcc33; font-weight: bold; text-transform: uppercase; } .purple { color: #400b35; font-weight: bold; text-transform: uppercase; } input.text { color: #ffcc33; font-weight: bold; text-transform: uppercase; font-size: .9em; background: #000000; border: none; padding: 7px; -webkit-border-radius: 5px; -moz-border-radius: 5px; } .submit, input.gsc-search-button { background: #ffcc33; border: none; -webkit-border-radius: 5px; -moz-border-radius: 5px; padding: 5px 15px; color: #2b0e26; font-weight: bold; text-transform: uppercase; } .action-btn { border: none; -webkit-border-radius: 5px; -moz-border-radius: 5px; padding: 7px 10px 5px; color: #2b0e26; font-weight: bold; text-transform: uppercase; background: #ffffff; background: -moz-linear-gradient(top, #ffffff 0%, #DBDBDB 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#DBDBDB)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#DBDBDB',GradientType=0 ); ; font-size: .85em; } .submit:hover, .action-btn:hover, input.gsc-search-button:hover { cursor: pointer; background-color: #d19a2a; text-decoration: none; } .base .byline { color: #666666; text-transform: uppercase; font-size: .65em; line-height: 9px; margin-bottom: 3px; } .base .press-entry .byline { margin-bottom: 10px } .entry { margin-bottom: 20px; } .base .entry p { margin-bottom: 6px; } /* 03 =LAYOUT ---------------------------------------------------------- */ /* html { background: #411538 url(/page/-/img/bg-d.jpg) repeat-x; } html { background-color: #411538 ; background-image: -webkit-linear-gradient( top, #fff 10px, #411538 1800px); background-image: -moz-linear-gradient( top, #fff 10px, #411538 1800px); background-image: -ms-linear-gradient( top, #fff 10px, #411538 1800px); background-image: -o-linear-gradient( top, #fff 10px, #411538 1800px); background-image: linear-gradient( top, #fff 10px, #411538 1800px); } */ html {background:#fff;} #wrapper { width: 1010px; margin: 0 auto; } ul.nav { padding-left: 0; padding-right: 0; } .nav { height: 27px; padding: 10px 0; margin: 0; width: 1010px; } .nav .site-nav { list-style: none; margin: 5px 0 0; display: inline-block; float: left; padding-left: 9px; padding-right: 10px; } .nav .site-nav a { text-transform: uppercase; color: #401537; font-size: .95em; display: block; } .nav .site-nav a:hover { color: #fc3; text-decoration: none; } .main-nav .site-nav.home { padding-left: 0; padding-right: 3px; margin-top: 7px; display: block; width: 17px; height: 15px; } .nav .site-nav.home a { display: block; background: url(/page/-/img/home-btn-d-white.png)no-repeat; width: 17px; height: 15px; text-indent: -99999px; margin-left: 3px; margin-top: -3px; } .nav .site-nav.home:hover { cursor: pointer; } .nav .site-nav.about { width: 49px; } .nav .site-nav.pledge { width: 129px; } .nav .site-nav.stories { width: 131px; } .nav .site-nav.resources { width: 63px; } .nav .site-nav.video { width: 101px; } .nav .site-nav.contribute { width: 140px; float: right; padding-right:0px; margin-top:-1px; } .nav .site-nav.contribute a { color: #ffcc33; background:#480857; padding:7px; text-align:center; -webkit-border-radius:6px; -moz-border-radius:6px; border-radius:6px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } .nav .site-nav.contribute a:hover {color:white;} .nav .site-nav.affiliates { position:relative;} .nav .site-nav .affiliates {padding-right:15px; background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAApCAYAAAAMCrglAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAI5JREFUeNpi/P//fwIDA4M8A34wkQGo0ACI3//HDRKAmAGkEJ/iBKg8XCE2xQlIcigKkRUnoIkzMIJVowIBIP6ALohNIVbAxEAkGFU4qnBU4ahCKipkYThrQlTRzAIkLgBxP7S4wwYSQcUgE1ShI7YyEapoAbIbsSmGK0L3DLJiFEUQz6ACkGJFbM4ACDAAStWkheZAqzMAAAAASUVORK5CYII=); background-repeat:no-repeat; background-position:77px 6px; color:#401537;} .nav .site-nav .affiliates:hover, .nav .site-nav.menu_active a.affiliates { color:#fc3; background-position: 110px -29px;} ul#affiliates_list {list-style:none; background:black; z-index:1000; width:240px; margin:0; margin-left:-10px; padding:0; position:absolute; display:none;} #affiliates_list li {list-style:none; } #affiliates_list a {color:white; padding: 6px 10px;} #affiliates_list a:hover {color: #fc3; text-decoration: none;} .search-form { float: left; padding: 20px 0 0 45px; width: 304px; clear: left; } .search-form input.text, input.gsc-input { padding: 5px; background-color: #a78ba1; color: #ffffff; width: 191px; margin-right: 4px; } #video .search-form {padding:20px 0 20px 0;} ul.sorting { float: left; padding: 25px 0 0 0; } ul.sorting li { float: left; list-style: none; } ul.sorting li a { color: #a78ba1; padding: 0 40px; font-size: 1em; } ul.sorting li.selected a { color: #fff; } ul.sorting li.submit-sort a { color: #fc3; } #header { width: 1010px; background: url(/page/-/img/bg-main.jpg) repeat-y; color: #a78ba1; } #header .logoheader {background:white; height:105px; border: none #411538 solid; width:1010px; } #header .logoheaderint {background:white; height:125px; border: none #411538 solid; width:1010px; } #header .logoheaderbl {background:white; height:105px; border: none #411538 solid; width:1010px; } #header .logo { background: #fff url(/page/-/img/logo_jan_9_2013.png) 20px center no-repeat; height: 55px; display: block; text-indent: -9999px; width:450px; } #header .logoint { background: #fff url(/page/-/international/logo_jan_9_2013_intl.png) 20px center no-repeat; height: 55px; display: block; text-indent: -9999px; width:450px;} #header .logobl { background: #fff url(/page/-/betterlegal/logo_betterlegal-small.png) 20px center no-repeat; height: 55px; display: block; text-indent: -9999px; width:275px; float: left;} #header .logomedia { background: #fff url(/page/-/media/IGBP_logo_single_line_media.png) 20px center no-repeat; height: 55px; display: block; text-indent: -9999px; width:450px;} #header .logoblaffil { background: #fff url(/page/-/betterlegal/logo-pt2_betterlegal.png) 20px center no-repeat; height: 55px; width: 175px; display: block; text-indent: -9999px; float: left; } #header .header-text { float: left; display:none; width: 509px; height: 60px; margin-top: 10px; padding-top: 20px; padding-left: 14px; padding-right: 10px; } #header .header-text h3 { color: #a78ba1; font-weight: normal; font-style: normal; font-size: 1.1em; } .socialnav {float:right; width:340px; margin-top:0px;} .socialnav ul {list-style:none;} .socialnav a {width:48px; height:48px; float:left; background:#480857 url("/page/-/img/2015-05-17-igb-socialnav.png") center center no-repeat; vertical-align:middle; margin-left:8px; text-indent:-9999px; display:block; -webkit-border-radius:6px; -moz-border-radius:6px; border-radius:6px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } .socialnav a.facebook {background-position: -0px 0;} .socialnav a.twitter {background-position: -54px 0;} .socialnav a.youtube {background-position: -109px 0;} .socialnav a.tumblr {background-position: -163px 0;} .socialnav a.googleplus {background-position: -218px 0;} .socialnav a.instagram {background-position: -268px 0;} .socialnav a:hover { background-color: #ffcc33;} #main { width: 970px; padding: 20px; background: url(/page/-/img/bg-main.jpg) repeat-y; } #sidebar { float: right; width: 305px; } #footer-nav { height: 36px; padding: 10px 0; margin: 0; width: 1000px; } #footer-nav.nav .site-nav { margin-top: 8px; } #footer-nav.nav .site-nav a { text-transform: uppercase; color: #270d21; font-size: .75em; font-size: .95em;} #footer-nav.nav .site-nav.about { width: 72px; } #footer-nav.nav .site-nav.pledge { width: 104px; } #footer-nav.nav .site-nav.stories { width: 111px; } #footer-nav.nav .site-nav.resources { width: 54px; } #footer-nav.nav .site-nav.contribute { width: 74px; } #footer-nav.nav .site-nav.Contact { width: 72px; } #footer-nav.nav .site-nav.googletranslate { width: 190px; } #footer-nav.nav .site-nav.home { margin-top: 0; } #footer-nav.nav .site-nav.home a { display: block; background:#411538 url(/page/-/img/logo-footer-d.png) no-repeat center center; height: 36px; text-indent: -99999px; margin-left: 0; padding:7px; width: 60px; margin-top: 0; border-right: 1px solid #9f8a9b; -webkit-border-radius:6px; -moz-border-radius:6px; border-radius:6px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } #footer-nav.nav .site-nav a:hover { color: #fc3; } #footer-nav.nav .partner.bsd.footer {float:right;} #footer-nav.nav .partner.bsd.footer a { text-indent:-9999px; vertical-align:middle; display:block;background: url('/page/-/img/poweredbybsdpurple.png') center center no-repeat; width:206px; height:52px;} #footer p { float: left; width: 100%; margin-top: 10px; color: #270d21; font-size: .65em; font-weight: bold; text-align: center; } #footer p a { color: #270d21; } .content-box { background: #ffffff; float: left; border-right: 1px solid #2b0e24; border-bottom-color: 1px solid #2b0e24; } .partners { float: left; padding-top: 25px; padding-left: 25px; width: 455px; padding-right: 25px; } .partners.bsd { float: right; width: 169px; } .partners h4 { color: #ffffff; font-weight: bold; text-transform: uppercase; margin-bottom: 10px; } .partners a { display: block; float: left; padding-right: 30px; } /* 04 =HOMEPAGE ---------------------------------------------------------- */ #media-feature { width: 922px; height: 330px; margin-left: auto; margin-right: auto; margin-bottom: 15px; } .thumb { height: 55px; overflow: hidden; } .thumb img { width: 100px; } .thumb img:hover { cursor: pointer; } .media-gallery { float: left; width: 98px; height: 54px; overflow: hidden; margin-bottom: 8px; } .media-list { float: left; width: 98px; margin-right: 10px; display: inline; } #media-feature #ytplayer { } .media-list.four { margin-right: 0; } .main-video { width: 490px; float: left; background-color: #e6e6e6; margin-right: 10px; display: inline; height: 300px; } .video-home-prev { float: left; margin-left: -35px; border-color: #35112d #000000 #35112d #35112d; border-style: solid; border-width: 20px 20px 20px 0px; height: 0px; width: 0px; margin-top: -30px; margin-bottom: 4px;top: 163px; position: relative; text-indent: -99999px; } .video-home-next { float: right; text-indent: -99999px; position: relative; top: 135px; float: left; border-color: #35112d #35112d #35112d #000000; border-style: solid; border-width: 20px 0px 20px 20px; height: 0px; width: 0px; position: relative; text-indent: -99999px; margin-bottom: 4px; right: -45px; margin-left: -30px; display: block; } .box { padding: 10px; float: left; background-color: #2b0e24; display: inline; text-align: center; height: 59px; margin-bottom: 10px; } .box h2 { margin-bottom: 15px; } .box.left { margin-right: 10px; } .box .action-btn { margin-right: 5px; margin-left: 5px; margin-bottom: 10px; float: left; width: 112px; } .box.middle { width: 195px; margin-right: 10px; } .box.share { width: 285px; height: auto; } .box.share li { float: left; display: inline; width: 26px; } .box.share li a { background: url(/page/-/img/socnet.png) 0 0 no-repeat; width: 24px; height: 24px; display: block; text-indent: -9999em; overflow: hidden; } .box.share li.twitter a { background-position: -24px 0; } .box.share li.youtube a { background-position: -48px 0; } .box.share h2 { float: left; width: 200px; margin: 0; } .box.share ul { float: left; width: 78px; padding: 0; } #sidebar-share ul { width: 52px; } .box.pledge { width: 285px; height: auto; } .box.pledge .action-btn { height: auto; margin: 0; margin: 0 auto; width: 200px; padding: 10px 20px; float: none; text-transform: uppercase; font-size: 1.1em; display: block; } #home .content-box { height: 717px; } #home .content-box.twitter-home {height:auto;} .twitter-home .twtr-timeline {height:400px !important; overflow:scroll;} .content-box.pledge { width: 585px; padding: 16px 25px 25px; margin-top: -32px; } .upload-module { float: left; width: 291px } .upload-module .upload { border: none; -webkit-border-radius: 5px; -moz-border-radius: 5px; padding: 7px 10px 5px; color: #2b0e26; font-weight: bold; text-transform: uppercase; background: #ffffff; background: -moz-linear-gradient(top, #ffffff 0%, #DBDBDB 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#DBDBDB)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#DBDBDB',GradientType=0 ); display: block; font-size: 1.2em; text-align: center; } .submit:hover, .action-btn:hover { cursor: pointer; background-color: #d19a2a; text-decoration: none; } .content-box.pledge .instructions { float: right; width: 235px; background-color: #e1dbdd; height: 500px; overflow: hidden; padding: 20px; margin-top: -20px; } .pledge-text.new {} .content-box.pledge.short {height: 330px!important;} .content-box.pledge.new {height: 181px!important; margin: 16px 0 0 0; position: relative;} #big-pledge-arrow {background: url(/page/-/img/big-arrow-2.png); height: 82px; width: 63px; position: absolute; top: -30px;} #home .pledge-text { float: left; width: 595px; padding: 20px; height: 80px; margin-top: 0; background-color: #2d0f26; margin-bottom: 0; } #home .pledge-arrow { width: 67px; height: 52px; background: #fff url(/page/-/img/pledge-arrow.jpg) no-repeat; position: relative; float: left; left: 26px; margin-top: -1px; } #home .pledge-text p { color: #a78ba1; line-height: 1.6em; font-weight: bold; } #home .content-box #pledge-form { float: left; width: 545px; height: 29px; background-color: #cccccc; padding: 20px; margin-bottom: 20px; } #home .content-box #pledge-form input.text { float: left; width: 89px; margin-right: 3px; margin-bottom: 3px; color: #f0f0f0; background-color: #646464; display: inline; } #home .content-box #pledge-form input#pledge-lastname { margin-right: 3px; width: 90px; } #home .content-box #pledge-form input#pledge-email { width: 95px; } #home .content-box #pledge-form input#pledge-zip { width: 48px; margin-right: 3px; } #home .content-box #pledge-form input.submit { margin-top: 0;float: right; padding: 6px 10px 8px; } .content-box.blog { width: 255px; padding: 25px; float: right; } .content-box.blog.homepage {width: 585px; margin: 15px 0 0 0; float: left!important; height: auto!important;} #home .content-box.blog { height: 658px; } #sidebar .content-box.blog .entry { padding: 0; } .box.home-actions { height: 101px; float: left; width: 285px; } .box.home-actions h2 { float: left; width: 285px; color: #a78ba1; text-align: left; font-size: .65em; margin-bottom: 5px; padding-left: 9px; } .left-home { float: left; width: 635px; } .right-home { float: right; width: 306px; } #gallery-video-info { color: #a78ba1; display: block; position: relative; width: 721px; top: 2px; left: 2px; height: 0; } #gallery-video-link, #gallery-video-permalink { color: #a78ba1; ; } /* Modal Box */ #modalContainer { width:680px; height:430px; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; border: #5C186A; background-color: #FFF; } #modalContainer #pledge { position:relative; top:30px; left:30px; background-color: #CCC; width:600px; padding:10px 10px 10px 13px; margin-bottom:28px; } #modalContainer #pledge p { font-family: 'Arial'; font-size: 14px; color: #000; padding-left:2px; line-height:150%; } #modalContainer #pledge h1 { font-family: 'Arial'; font-size: 18px; font-weight: bold; color: #5C186A; padding-left:2px; line-height:150%; } #modalContainer #pledgeForm input[type='text'] { background-color:#646464; color: #f0f0f0; font-weight:bold; font-size: 14px; padding:4px; border:0; } #modalContainer #pledgeForm .submit { border:0px; } #modalContainer #pledgeForm fieldset { border:0; } #modalContainer #modal-footer { width: 620px; padding: 0 30px; } #modalContainer #modal-footer img#logo { position:relative; left:0px; top:10px; } #modalContainer #modal-footer a#skip { position:relative; top:-10px; left:150px; color: #ccc; text-decoration:none; text-transform:uppercase; font-family:'Arial'; font-size:12px; } #modalContainer #pledgeForm { margin-top: 10px; display: block; float: left; width: 100%;} #modalContainer #pledge-form { width: 620px; margin: 0px auto; display: block; clear: both; } #modalContainer #pledge-form input { width: 144px; } #modalContainer #pledge-form #modal-submit { margin: 20px auto; display: block; ; } #modalContainer #modalContainer #modal-footer { clear: both; float: left; margin-top: 20px; margin-bottom: 10px;} #modalContainer #closeBtn { float: right; margin-top: 25px; } ul#pledgers { padding: 0;text-align: center; float: left; } ul#pledgers li { list-style: none; background: #fc3; margin-right: -2px; margin-bottom: 1px; color: #401537; font-weight: bold; padding: 5px; display: inline-block; width: auto; } ul#pledgers li.last { background: none; } .blog.homepage { position: relative; } #home-rss-link {background: url(/page/-/img/feed-icon-28x28.png) no-repeat; height: 28px; width: 28px; display: block; text-indent: -999em; position: absolute; right: 15px; top: 15px;} /* rotator */ #home-feature-cont {height: 239px; width: 635px; overflow: hidden; position: relative; margin: 0 0 17px 0;} home-feature-nav {display: none;} .home-feature-entry {position: relative;} .feature-entry-text {background: #2d0f26; position: absolute; height: 162px; width: 164px; top: 15px; left: 15px; padding: 20px 20px; color: #fff; overflow: hidden;} .feature-entry-text h3 {font-size: 20px; margin: 0 0 5px 0;} .feature-entry-text a {text-transform: none; color: #efcc33;} .feature-entry-text p {font-size: 13px; line-height: 20px;} #home-feature-nav a {display: block; position: absolute; height: 35px; width: 13px; z-index: 50; text-indent: -900em; outline: none;} #feature-prev {background: url(/page/-/img/rotator-left-arrow.png); top: 100px; left: 20px;} #feature-next {background: url(/page/-/img/rotator-right-arrow.png); top: 100px; left: 212px; z-index: 100;} #pleadge-header {font-size: 20px; text-align: right; margin: 0 0 6px 0;} #home-feature-cont {position: relative;} #home-feature-nav {position: absolute; z-index: 100; overflow: hidden; bottom: 5px; right: 0;} #home-feature-nav a {position: static; text-indent: 0!important; float: left; font-size: 14px; background: #2d0f26; /*background: rgba(250, 250, 250, .8);*/ padding: 3px 6px; height: auto; margin-right:5px; text-align: center; color: #fff; font-weight: bold;} #home-feature-nav a.activeSlide {background: none; color: #2d0f26; background: #fff;} /* 05 =SUBPAGES ---------------------------------------------------------- */ .full-width .content-box.main { width: 920px; } .content-box.main { width: 585px; padding: 25px; min-height: 575px } #search .entry.odd { background-color: #d2cccc; -moz-border-radius: 5px; -webkit-border-radius: 5px; } #search .entry { padding: 15px; } #search .entry h2 { margin-bottom: 5px }r #search .entry .text { float: left; width: 400px; } #search .video-thumb { float: left; padding-right: 20px; width: 121px; } #video .entry.odd { background-color: #d2cccc; -moz-border-radius: 5px; -webkit-border-radius: 5px; } #video .entry { padding: 15px; } #video .entry h2 { margin-bottom: 5px } #video .entry .text { float: left; width: 400px; } #video .video-thumb { float: left; padding-right: 20px; width: 121px; } #video .entry-top { float: left; width: 910px; background-color: #ece8e8; padding: 5px; margin-bottom: 10px; } #video .entry-top p { float: left; margin-top: 5px; margin-bottom: 0; background-color: #; } #video .entry-top .search-form { padding-top: 0; } #video.full-width h1 { float: left; } .video-browse h1 { float: left; } .video-browse .content-box .search-form { padding-top: 3px; padding-right: 0; } .about-pledge {color: #676767; line-height: 24px; font-size:1.3em;} #search .upload-module { float: left; width: 291px; } #search .instructions { float: right; width: 235px; background-color: #e1dbdd; /*height: 465px; overflow: hidden;*/ padding: 20px; } .share-entry { float: right; width: 240px; padding-bottom: 5px; padding-left: 0; } .share-entry a { float: right; } #disqus_thread { padding-top: 25px; float: left } #blog .content-box #pledge-form { float: left; width: 545px; height: 29px; background-color: #cccccc; padding: 20px; margin-bottom: 20px; } #blog .content-box #pledge-form input.text { float: left; width: 89px; margin-right: 3px; margin-bottom: 3px; color: #f0f0f0; background-color: #646464; display: inline; } #blog .content-box #pledge-form input#pledge-lastname { margin-right: 3px; width: 90px; } #blog .content-box #pledge-form input#pledge-email { width: 95px; } #blog .content-box #pledge-form input#pledge-zip { width: 48px; margin-right: 3px; } #blog .content-box #pledge-form input.submit { margin-top: 0;float: right; padding: 6px 10px 8px; } #blog .entry .thumbnail, .content-box.blog.homepage .entry .thumbnail { float: left; width: 120px; } #blog .entry .thumbnail a, .content-box.blog.homepage .entry .thumbnail a { width: 120px; display: block; } #blog .entry .thumbnail img, .content-box.blog.homepage .entry .thumbnail img { width: 120px; display: block; } #blog .entry.has-thumbnail .text, .content-box.blog.homepage .entry.has-thumbnail .text { float: right; width: 445px; } .rss-icon { float:right; } #stories .entry.odd { background-color: #d2cccc; -moz-border-radius: 5px; -webkit-border-radius: 5px; } #stories .entry { padding: 15px; } #stories h1 { text-transform: capitalize; } #cse-search-results iframe {width: 590px;} #search .cse .gsc-control-cse, #search .gsc-control-cse { padding: 0; } #search .gs-result .gs-title, #search .gs-result .gs-title * { text-decoration: none; color: #400B35; text-transform: none; } #search .gs-result .gs-title:hover { text-decoration: underline; } #search .gs-result a.gs-visibleUrl, #search .gs-result .gs-visibleUrl { color: #666; } #search input.gsc-input { color: #666; } #search input.gsc-search-button { margin: 0 0 0 10px !important; } #search .gsc-result-info { padding: 0 0 15px; } #search .gsc-webResult .gsc-result { padding: 15px 0; } #search .gsc-results .gsc-cursor-box { padding: 15px 0; margin: 0; } /* 06 =FRAMEWORK ---------------------------------------------------------- */ #framework input.text { background: #b3afaf; text-transform: none; color: #270e23; } #framework input.submit { margin-top: 15px; margin-bottom: 5px; } .bsd-contribForm-oneCol .bsd-contribForm-aboveContent { float: left; width: 45% } .bsd-contribForm-oneCol #contribution { float: left; width: 45%; padding-left: 40px; } .bsd-contribForm-oneCol .bsd-contribForm-belowContent { float: left; width: 100%; margin-top: 20px; } /* 07 =UTILITY ---------------------------------------------------------- */ .cufon-loading .cufon { visibility: hidden !important; } .stretcher { clear: both; height: 1px; visibility: hidden; } .nomargin { margin-bottom: 0px; } .floatl { float: left; margin: 0; padding: 0 10px 10px 0; } .floatr { float: right; margin: 0; padding: 0 0 10px 10px; } .floatl-nomargin { float: left; margin: 0; padding: 0; } .floatr-nomargin { float: right; margin: 0; padding: 0; } .clear { clear:both; height:0; margin:0; font-size: 1px; line-height: 0; } .required { color: red; } i, em { font-style: italic; } b, strong { font-weight: bold; } sup, sub { height: 0; line-height: 1; vertical-align: baseline; _vertical-align: bottom; position: relative;} sup { bottom: 1ex; } sub { top: .5ex; } .clearfix:after { content:"."; display:block; height:0; clear:both; visibility:hidden; } .clearfix {display:inline-block;} .clearfix {display:block;} /* 08 =LIGHTBOX ---------------------------------------------------------- */ /* @override http://www.itgetsbetterproject.com/styles/modal/ */ /* ColorBox Core Style The following rules are the styles that are consistant between themes. Avoid changing this area to maintain compatability with future versions of ColorBox. */ #colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;} #cboxOverlay{position:fixed; width:100%; height:100%;} #cboxMiddleLeft, #cboxBottomLeft{clear:left;} #cboxContent{position:relative; overflow:hidden;} #cboxLoadedContent{overflow:auto;} #cboxLoadedContent iframe{display:block; width:100%; height:100%; border:0;} #cboxTitle{margin:0;} #cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;} #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;} /* Example user style The following rules are ordered and tabbed in a way that represents the order/nesting of the generated HTML, so that the structure easier to understand. */ #cboxOverlay{background:url(/page/-/img/lightbox/overlay.png) 0 0 repeat;} #colorbox{} #cboxContent{margin-top:20px;} #modalContainer { border: 10px solid #5C186A; } #cboxTitle{position:absolute; top:-20px; left:0; color:#ccc;} #cboxCurrent{position:absolute; top:-20px; right:0px; color:#ccc;} #cboxSlideshow{position:absolute; top:-20px; right:90px; color:#fff;} #cboxPrevious{position:absolute; top:50%; left:5px; margin-top:-32px; background:url(images/controls.png) top left no-repeat; width:28px; height:65px; text-indent:-9999px;} #cboxPrevious.hover{background-position:bottom left;} #cboxNext{position:absolute; top:50%; right:5px; margin-top:-32px; background:url(images/controls.png) top right no-repeat; width:28px; height:65px; text-indent:-9999px;} #cboxNext.hover{background-position:bottom right;} #cboxLoadingOverlay{background:#000;} #cboxLoadingGraphic{background:url(images/loading.gif) center center no-repeat;} #cboxClose{position:absolute; top:5px; right:5px; display:block; background:url(images/controls.png) top center no-repeat; width:38px; height:19px; text-indent:-9999px;} #cboxClose.hover{background-position:bottom center;} /* The following fixes png-transparency for IE6. It is also necessary for png-transparency in IE7 & IE8 to avoid 'black halos' with the fade transition Since this method does not support CSS background-positioning, it is incompatible with CSS sprites. Colorbox preloads navigation hover classes to account for this. !! Important Note: AlphaImageLoader src paths are relative to the HTML document, while regular CSS background images are relative to the CSS document. */ .cboxIE #cboxTopLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderTopLeft.png, sizingMethod='scale');} .cboxIE #cboxTopCenter{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderTopCenter.png, sizingMethod='scale');} .cboxIE #cboxTopRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderTopRight.png, sizingMethod='scale');} .cboxIE #cboxBottomLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderBottomLeft.png, sizingMethod='scale');} .cboxIE #cboxBottomCenter{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderBottomCenter.png, sizingMethod='scale');} .cboxIE #cboxBottomRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderBottomRight.png, sizingMethod='scale');} .cboxIE #cboxMiddleLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderMiddleLeft.png, sizingMethod='scale');} .cboxIE #cboxMiddleRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderMiddleRight.png, sizingMethod='scale');} /* 09 = CONNECT WITH US BAR ---------------------------------------------------------- */ #scrolltotop {background: #3F1638 url('/page/-/img/totoparrow.png') center center no-repeat; position: fixed; float : right; width:60px; height: 65px; margin-left:1032px; bottom:29px; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; opacity: 0; -webkit-transition: all 0.8s ease-out; -moz-transition: all 0.8s ease-out; -ms-transition: all 0.8s ease-out; -o-transition: all 0.8s ease-out; transition: all 0.8s ease-out; pointer-events:none; } #scrolltotop.show {opacity:.7; pointer-events:all;} .stickifying { width:100% !important; -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */ -moz-box-sizing: border-box; /* Firefox, other Gecko */ box-sizing: border-box; /* Opera/IE 8+ */} #sidebar-share, #sidebar-follow, .right-home .box.share {display:none;} #connectwithus {width:100%; color: #2B0E26;font-weight: bold;text-transform: uppercase;background: white; background: -moz-linear-gradient(top, white 0%, #DBDBDB 100%); display:none; background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,white), color-stop(100%,#DBDBDB)); margin-bottom:1em;} #connectwithus h2 {color:#2B0E26; float:left; vertical-align:middle; margin-top: 14px; margin-left: 17px;} #connectwithus ul { float:left; display:block; width:450px; vertical-align:middle;} #connectwithus li {list-style:none;} #connectwithus a {display:block; text-align:center; font-size:14px; float:left; padding:5px 5px; text-transform:none; margin:5px; width: 112px; -webkit-border-radius: 5px; -moz-border-radius: 5px; text-shadow:0px 1px 0px rgba(0,0,0,.3); line-height:22px; border:2px solid rgba(255,255,255,.6); background-image: -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0,0,0,.2))); background-image: -webkit-linear-gradient(top, transparent, rgba(0,0,0,.2)); background-image: -moz-linear-gradient(top, transparent, rgba(0,0,0,.2)); background-image: -ms-linear-gradient(top, transparent, rgba(0,0,0,.2)); background-image: -o-linear-gradient(top, transparent, rgba(0,0,0,.2)); background-image: linear-gradient(top, transparent, rgba(0,0,0,.2)); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='transparent', EndColorStr='rgba(0,0,0,.2)'); } #connectwithus a:hover {text-decoration:none;} #connectwithus a:active { background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,.2)), to(transparent)); background-image: -webkit-linear-gradient(top, rgba(0,0,0,.2), transparent); background-image: -moz-linear-gradient(top, rgba(0,0,0,.2), transparent); background-image: -ms-linear-gradient(top, rgba(0,0,0,.2), transparent); background-image: -o-linear-gradient(top, rgba(0,0,0,.2), transparent); background-image: linear-gradient(top, rgba(0,0,0,.2), transparent); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='rgba(0,0,0,.2)', EndColorStr='transparent'); } #connectwithus a.facebook { background-color:#557abd; color:white;} #connectwithus a.twitter { background-color:#48bce2; color:white;} #connectwithus a.youtube { background-color:#f6f6f6; color:#ff0f23; text-shadow:0px 1px 0px rgba(255,255,255,.3);} #connectwithus a span {width:24px; height:24px; float:left; background-image: url("/page/-/img/socnet-trans.png"); vertical-align:middle;} #connectwithus a.facebook span {background-position:-0px 0} #connectwithus a.twitter span {background-position: -24px 0;} #connectwithus a.youtube span {background-position: -48px 0;} /* 10 = Resources List ---------------------------------------------------------- */ #resources_picker {margin-bottom:1em; font-size:120%;} .resource {display:none;} .resource {margin-bottom:2em; color: #333; clear:both;} .resource_name {font-weight:bold; font-size: 15px; text-transform: uppercase;} .resource_name a {font-size: 100%} .resource dl dt {font-weight:bold; float:left; clear:left; text-transform:uppercase; padding-right:4px; line-height: 150%;width: 51px;} .resource dl a {color:#65485f;} address span {display:block;} .resource_description {margin-top:10px; font-size:90%;} /* 11 = About Page Accordion Styles ---------------------------------------------------------- */ .accordion {} .ui-accordion-header { -webkit-border-radius: 5px; -moz-border-radius: 5px; cursor:pointer; color: #666; padding:5px; margin-left:-5px; margin-top:20px; margin-bottom:20px;} .ui-accordion-header h2 {text-decoration:underline; color: #401537;} .ui-accordion-header span {float:right; text-transform:uppercase;color: #2B0E26; font-size:14px; font-weight:bold; } .ui-accordion-header:hover { background: #b1d0ff; color:black;} #maincontentbl .ui-accordion-header:hover { background: none; color:black;} .ui-accordion-header.selected {} .accordionbody {} .accordion-faux-header { -webkit-border-radius: 5px; -moz-border-radius: 5px; cursor:pointer; color: #666; padding:5px; margin-left:-5px; margin-top:-5px;} .accordion-faux-header:hover { background:#b1d0ff; color:black; text-decoration: none;} .accordion-faux-header-link .accordion-faux-header h2 {text-decoration:underline; font-size: 16px; color: #000000;} .accordion-faux-header-link {text-decoration:none; text-transform: none;} .accordion-faux-header-link p {text-decoration:none; text-transform: none; color: #666; font-size:13px; font-weight: normal;} .accordion-faux-header span {float:right; text-transform:uppercase;color: #2B0E26; font-size:14px; font-weight:bold; } /* 12 = Google Translate Box ---------------------------------------------------------- */ #google_translate_element, .goog-te-menu-value, .goog-te-menu-value span {color:#480857;font-family: 'Verlag A', 'Verlag B';font-weight: 700;font-style: normal;} a.goog-te-menu-value:hover { text-decoration:none; } .goog-te-gadget-simple {border-radius:3px;} .goog-te-menu2-item:link div, .goog-te-menu2-item:visited div, .goog-te-menu2-item:active div {color:#401537;} a.goog-te-menu2-item:hover div {background:#401537 !important;} /* 13 = International Content Page ---------------------------------------------------------- */ #headerborder { height: 10px; background-color: #00a9e4; display: block } #mainbackgroundintl {background: url("/page/-/international/background_intl.gif") repeat; padding: 20px;} #maincontentintl {background:#FFF; display:block; top: 30px; padding: 30px;} #mainleftcontentintl {width: 580px; float: left} #mainrightcontentintl {float: left; margin-left:60px} #mainleftcontentintl a {font-size: 120%} /*14 = Better Legal Content Page ---------------------------------------------------------- */ #headerborderbl { height: 8px; background-color: #d51968; display: block } #mainbackgroundbl {background: url("http://www.itgetsbetter.org/page/-/betterlegal/2013-02-04-igb-bl-topbkgd.png") repeat-y center #f39939; padding: 40px;} #maincontentbl {background:#d8d8d8 url("http://www.itgetsbetter.org/page/-/betterlegal/2013-02-04-igb-bl-contentbkgd.png"); display:block; padding: 30px;-moz-box-shadow: 0px 0px 20px -2px #505050; -webkit-box-shadow: 0px 0px 20px -2px #505050; box-shadow: 0px 0px 20px -2px #505050;} #mainleftcontentbl {width: 540px; float: left} #mainleftcontentblpages {width: 800px; float: left} #maincontentbl input.text { background: #b3afaf; text-transform: none; color: #270e23; } #bl-rotator {background: url("/page/-/betterlegal/igb-how-it-works-bkgnd-3.png"); display: block; width: 350px; height: 380px;} #prev-btn {background: url("/page/-/betterlegal/prev-arrow.png"); display:block; width: 40px; margin-left: 4px;} #next-btn {background: url("/page/-/betterlegal/next-arrow.png"); display:block; width: 40px;} #blactionsprite1, #blactionsprite2, #blactionsprite3 { background: url("/page/-/betterlegal/igb-bl-register-sprite1.png") no-repeat; height:83px; width: 139px; margin: 0 auto; overflow: hidden; float: left; margin-left: 30px} #blactionsprite1:hover, #blactionsprite2:hover, #blactionsprite3:hover {background-position: 0 -82px;} #blactionsprite2 { background: url("/page/-/betterlegal/igb-bl-volunteer-sprite2.png"); } #blactionsprite3 { background: url("/page/-/betterlegal/igb-bl-video-sprite3.png"); float: left; } #blsponsorsbackground { background: #666 url("/page/-/betterlegal/igb-bl-sponsors-footer.png") no-repeat; height: 100px; padding-top:10px;} #bottomleftcontentbl { background: #FFF; padding: 30px;width: 500px; float: left; -moz-box-shadow: 0px 0px 20px -2px #505050; -webkit-box-shadow: 0px 0px 20px -2px #505050; box-shadow: 0px 0px 20px -2px #505050;} #bottomrightcontentbl {float: left; margin-left:30px; padding: 30px; background: #dadada; display:block; max-width:365px; -moz-box-shadow: 0px 0px 20px -2px #505050; -webkit-box-shadow: 0px 0px 20px -2px #505050; box-shadow: 0px 0px 20px -2px #505050; margin-right:0;} #middledividerbl { background: url("http://www.itgetsbetter.org/page/-/betterlegal/2013-02-04-igb-bl-midstripebkgd.png") repeat-x; height:13px; margin-top:-7px; } #bottombl {background: url("http://www.itgetsbetter.org/page/-/betterlegal/2013-02-04-igb-bl-bottombkgd.png") repeat-y center #3a97c6; padding: 40px;} .bottomcontentcols { min-height: 1000px} .bottomcontentcols h3 { color: #555555; font-size: 1.2em; font-weight: bold; margin-bottom: 5px; margin-left:10px; } .bottomcontentcols p { margin-left:10px; } .bottomcontentcols h2 { color: #555555; text-transform: none; margin-bottom: 20px; font-size: 1.75em; font-weight: bold; } /* 14 = Media Content Page ---------------------------------------------------------- */ #mainbackgroundmedia {background: #d2256e; padding-top:30px; padding-bottom: 30px;} #mainbackgroundmedia p {font-size: 125%; line-height: 125%;} #mediathumbnailblock {float:left; margin-right:20px;} #mediathumbnailblock h3 {margin: 10px; font-weight:bold; font-size: 125%; line-height:100%;} #mainbackgroundmedia #mediathumbnailblock p {font-size: 100%; font-style:oblique} #mediathumbnailcontainer {width:420px; height: 170px; margin: 0px 25px 20px 10px; position: relative; float: left; display:block;} #mediathumbnailfullblock {width:420px; height: 170px; position: absolute; opacity:.75} #mediathumbnailfullblock a h3 {text-transform:none;} #mediathumbnailfullblock h3 {text-transform:none; margin-left:10px;} #mediathumbnailfullblock:hover {opacity:1} #mediathumbnailblocktext {position: absolute; z-index: 10;} #mainbackgroundmedia #maincontentbl {overflow: none; display:block; padding-bottom: 300px;} #mainbackgroundmedia h2 {font-family: verlag, sans-serif; font-size: 24px; color: #999: font-weight: bold; line-height:100%; margin:10px 0;} #mediathumbnailblock #btn {opacity:.8; display:block;} #mediathumbnailblock #btn:hover {opacity:1;} #mediathumbnailblock img .btn {width:120px; height:30px;} .mediacontentpage {width: 700px; display:block;} .mediacontentpage h2 {font-family: verlag, sans-serif; font-size: 24px; color: #999: font-weight: bold; line-height:100%; margin:10px 0;} .mediacontentpage h3 {font-size: 16px; color: #999: font-weight: bold; line-height:100%; margin:10px 0;} #mediapagesection2 {background: #f28b20; padding: 40px;} #mediapagesection3 {background: #00a9e4; padding: 40px;} #mediapagesection4 {background: #e63c2e; padding: 40px;}