/*
Theme Name: Radi8 Creative Custom Theme
Theme URI: http://www.acsutah.org
Description: Main theme for American Cancer Society Utah
Author: Nathan Bills for Radi8 Creative
Author URI: http://nerdmeeting.com
Version: 1
*/

@media screen {
    
* { margin: 0; padding: 0; }

body {
    font-family: "Droid Sans", sans-serif;
    overflow-y: scroll;
}
article, aside, figure, footer, header, hgroup, menu, nav, section { display: block; }

blockquote p:before { content: open-quote; font-weight: bold; }
blockquote p:after { content: close-quote; font-weight: bold; }

.group:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.group { display: inline-block; clear: both; }
/* start commented backslash hack \*/ * html .group { height: 1%; } .group { display: block; } /* close commented backslash hack */
  
a img {
    border: none;
}

/*
    TYPOGRAPHY
*/
h1, h2, h3, h4, h5 {
    font-family: "Droid Sans", sans-serif;
    color: #007BA6;
    font-weight: normal;
}

h1, h2 {
    font-size: 20px;
}

h3, h4, h5 {
    font-size: 14px;
    font-weight: bold;
    color: #666666;
    margin-bottom: 5px;
}

.error {
    display: block;
    margin: 50px auto;
    text-align: center;
}
p, li {
    color: #666666;
    font-size: 14px;
}

#social-footer h2 {
    font-family: "Droid Sans", sans-serif;
    color: #0079A5;
    display: inline;
}

#social-footer h2 a {
    color: #0079A5;
    text-decoration: none;
    vertical-align: text-top;
}

#social-footer h2 a:hover {
    text-decoration: underline;
}

a {
    text-decoration: none;
    font-size: 18px;
}

a:hover {
    text-decoration: underline;
}

div#main-content a, div.post  a {
    color: #2C799F;
    display: inline;
}

ul.featured-items li a {
    
}

div#page-wrap {
    /*width: 960px;*/
    width: 100%;
    margin: 15px auto 0;
}

#header-wrapper {
    background-color: #F0F0F0;
    box-shadow: 0px 0px 10px 5px #D8D8D8;
    padding: 15px 0;
    z-index: 2;
    position: relative;
}
header {
    position: relative;
}

header, nav#top-av, footer {
    width: 960px;
}

header, nav, div#rotator, div#main-content {
    margin: 0 auto;
}

div.width-960 {
    width: 960px;
    margin: 0 auto;
}

div.no-padding {
    width: 100% !important; 
    padding: 0px !important;
}

div#main-content.width-695-right {
    width: 645px;
    padding: 25px;
    float: right;
}
div#main-content.width-695-right img {
    display: block;
    margin: 0 auto;
}

/*div#main-content.homepage {
    width: 960px;
    padding: 0px;
}*/
div.post  {
    width: 635px;
    float: right;
    padding: 30px 30px 0;
    background-color: inherit;
}

div#main-content {
    width: 910px;
    padding: 25px;
    float: right;
}
div.featured-content img {
    display: block;
    margin: 0 auto;
}

div#all-content-wrap {
    width: 960px;
    background-color: #F0F0F0;
    margin: 0px auto;
    /*min-height: 350px;*/
}

div#page-content {
    clear: both;
    padding: 50px;
}

div#main-content .post h2, div.post  h2 {
    font-weight: bold;
    color: #666666;
    border-top: 1px solid #BFBFBF;
    margin-bottom: 5px;
    margin-top: 5px;
    padding-top: 5px;
    
}

#main-content .post .entry h2:first-of-type {
    /*color: #F2993E;*/
    border-top: none;
    /*font-weight: normal;*/
    margin-top: 10px;
}

div#main-content p, div.post p {
    margin-bottom: 20px;
}

div#main-content p, div.post p, div#content-left, div.entry ul {
    color: #666666;
    line-height: 160%;
}

div#main-content, div#page-content, div.post, footer {
    background-color: #F0F0F0;
}
div#main-content {
    border-bottom: 1px solid #CCCCCC;
    margin-bottom: 7px;
}

footer {
    margin: 0 auto 10px;
    text-align: center;
    clear: both;
}

div#wide-top {
    width: 100%;
    background-color: #F4EDDE;
    /*height: 100%;*/
    border-bottom: 1px solid #CDCDCD;
}

div#rotator-wrapper {
    width: 100%;
    background-color: #DFE6F0;
    z-index: 1;
    position: relative;
    top: -170px;
    padding-top: 136px;
    margin-bottom: -170px;
}
div#rotator {
    /*background-color: #F4EDDE;*/
    width: 960px;
    /*box-shadow: 250px 0 250px -95px #F4EDDE inset, -250px 0 250px -95px #F4EDDE inset;*/
    position: relative;
}
img.rotator-img {
    /*z-index: -1;*/
    position: relative;
}


/*#rotator span.left {
    box-shadow: 0px 0px 300px 200px #F4EDDE;
    height: 300px;
    display: block;
}*/

div#rotator img {
    display: block;
}

div#rotator a.rotator-button {
    text-align: center;
    background: #007AA5 url('images/circle-arrow-right.png') no-repeat 96% 50%;
    position: absolute;
    bottom: -30px;
    height: auto;
    max-height: 20px;
    overflow: hidden;
    border: 3px solid white;
    left: 25%;
    width: 380px;
    border-radius: 10px;
    /*-moz-border-radius: 10px;*/
    color: #FFF;
    text-decoration: none;
    padding: 20px 50px 20px 30px;
    /*margin: 0 auto;*/
    display: block;
}


div#rotator a:hover {
    background-image:  url('images/circle-arrow-right-hover.png');
    background-color: #006AA3;   
}

header p {
    position: absolute;
    left: 155px;
    top: 42%;
    color: #A3A3A3;
    text-transform: uppercase;
    letter-spacing: .7px;
}

header p {
    font-size: 14px;
}

div#main-content ul.featured-items li p {
    /*padding: 5px;*/
}

nav#top-nav ul, div#main-content ul.featured-items{
    width: 100%;
    font-size: 0px;/* trick to remove horizontal white-space between inline elements. must restore font-size in child element */
}



#div#main-content ul.featured-items {
    border-bottom: 1px solid #CDCDCD;
}

div#main-content ul.featured-items li{
    display: inline-block;
}

div#main-content ul.featured-items li {
    height: auto;/* Change to if 'featured <li>'s do not properly stretch 370px*/
    width: 33%;
    max-width: 33%;
    background-color: #F0F0F0;
    vertical-align: top;
    text-align: center;
}

div#main-content ul.featured-items li h2 {
    line-height: 95px;
    border-bottom: 1px solid #CDCDCD;
    color: #007AA5;
}

div#main-content ul.featured-items {
    /*border-bottom: 1px solid #CCCCCC;*/
    overflow: hidden;
    margin-top: 55px;
}

div#main-content ul.featured-items h2 {
    margin-bottom: 0px;
    box-shadow: 0 27px 27px -27px #E7E7E7, 0 24px 16px -24px transparent;
}


div#main-content ul.featured-items li div.featured-content {
    height: 55%;
    border-right: 1px solid #D1D1D1;
    margin: 0px;
    min-height: 250px;
    
}

div.featured-content p {
    padding: 25px;
    font-size: 16px;
    text-align: left;
}
div.featured-content svg + p {
    text-align: center;
    padding: 0px;
}
div#main-content ul.featured-items li:nth-child(2) {
}

div#main-content ul.featured-items li:last-child div.featured-content{
    border-right: none;
    /*margin: 12px;*/
}

h1.logo {
    background: url('images/logo-american-cancer-society.png') no-repeat;
    width: 110px;
    height: 65px;
}

div#pageroll {
    /*text-align: center;*/
    padding: 25px;
}

div#pageroll h1, div#pageroll h2, div#pageroll h3, div#pageroll h4, div#pageroll h5 {
    margin: 0px;
}

footer div#pageroll ul {
    /*margin: 0 15px;*/
    width: 100%;
}

footer div#pageroll ul h3, footer div#pageroll ul li a {
    color: #888888;
}

footer div#pageroll ul h3 {
    /*white-space: nowrap;*/
    margin-bottom: 10px;
    color: #595959;
    font-size: 18px;
    text-align: left;
}

footer div#pageroll ul li ul li, footer div#pageroll ul li ul li a {
    text-align: left;
    font-size: 14px;
}

div#pageroll ul li {
    text-align: center;
    width: 148px;
    display: inline-block;
    vertical-align: top;
}

div#pageroll ul li ul {
    
}

div#pageroll ul li ul li {
    
}


div#twitter-feed span {
    color: #FFFFFF;
    font-family: "Droid Sans";
    text-transform: none;
    display: inline-block;
    /*vertical-align: middle;*/
    /*background: url('images/twitter-bird-white.png') no-repeat 0 50%;*/
    /*padding-left: 40px;*/
    text-align: center;
}

div#twitter-feed a {
    color: #FFF;
    font-family: "Droid Sans";
    text-decoration: underline;
    font-size: 16px;
}

div#twitter-feed a:hover {
    text-decoration: underline;
    color: #F0F0F0;
}

div#twitter-feed ul {
    margin: 0 35px;
    text-align: left;
/*    background: url('images/twitter-bird-white.png') no-repeat 25px center;*/
    /*position: absolute;*/
    /*padding-left: 45px;*/
    /*height: 23px;*/
    color: #FFF;
    display: inline-block;
}

/* Hides the Twitter timestamp */
ul#twitter_update_list {
    position: relative;
    /*top: -5px;*/
    list-style: none;
}
#twitter_update_list li span + a {
    display: none;
}
#twitter_update_list li {
    /*list-style: none;*/
    background: url('/images/twitter-bird-white.png') no-repeat left top;
    /*border-top: 1px solid #376570;*/
    /*min-height: 31px;*/
    padding-left: 45px;
    padding-top: 5px;
    padding-bottom: 5px;
    margin-top: 10px;
}

#twitter_update_list li:first-of-type {
    border-top: none;
    margin-top: 0px;
}

nav#top-nav {
    position: relative;
    text-align: center;
    background: url('images/nav-white-transparent.png') center repeat-y;
    z-index: 2;
    /*opacity: .8;*/
    width: 960px;
    box-shadow: 0px 4px 7px -2px #CCCCCC;
    
}
nav#top-nav ul li a {
    opacity: .8;
}

/*nav#top-nav span {
    position: absolute;
    left: 50%;
    background-color: blue;
    width: 5px;
    height: 100%;
}*/

nav#top-nav ul li {
    display: inline-block;
    /*box-shadow: 0px 7px 7px -7px #D8D8D8 inset;*/
}

nav#top-nav ul li:hover a, nav#top-nav ul li:active a, nav#top-nav ul li:visited a {
    opacity: 1;
    /*box-shadow: 0px -7px 7px -7px #BFBFBF inset, 0px 7px 7px -7px transparent inset;*/
}

nav#top-nav ul, ul.featured-items, div#pageroll ul, div#social-header ul, div#social-footer ul, nav ul{
    list-style: none;
}

nav#top-nav ul li a {
    font-size: 20px;
    text-decoration: none;
    display: block;
    padding: 5px 25px;
    color: #007CA7;
    opacity: .75;
}
nav#top-nav ul li.current_page_item a {
    /*border-bottom: 1px solid #007CA7;*/
}

nav#top-nav ul li.current_page_item a {
    opacity: 1;
}
nav#top-nav ul li a:hover {
    text-decoration: none;
}
nav#top-nav ul li.current_page_item a, aside nav#left-side-nav ul li.current_page_item a, aside nav#left-side-nav ul li.current_page_ancestor a {
    
}
aside nav#left-side-nav ul li.current_page_ancestor a {
    color: #007CA7;
    line-height: 40px;
}


div#social-header ul, div#social-footer ul {
    margin: 0 auto;
    /*width: 50%;*/
}
div#social-header ul li, div#social-footer ul li  {
    padding: 10px;
    display: inline;
}


nav#top-nav ul li:nth-child(2) a {
    color: #C92586;

}
nav#top-nav ul li:nth-child(2).current_page_item a {
    /*border-bottom: 1px solid #C92586;*/
}


nav#top-nav ul li:nth-child(3) a {
    color: #6E66B3;
}
nav#top-nav ul li:nth-child(3).current_page_item a {
    /*border-bottom: 1px solid #6E66B3;*/
}


nav#top-nav ul li:nth-child(4) a {
    color: #FF9900;
}
nav#top-nav ul li:nth-child(4).current_page_item a {
    /*border-bottom: 1px solid #FF9900;*/
}


nav#top-nav ul li:nth-child(5) a {
    color: #407F77;
}
nav#top-nav ul li:nth-child(5).current_page_item a {
    /*border-bottom: 1px solid #407F77;*/
}


nav#top-nav ul li:nth-child(6) a {
    color: #213E88;
}
nav#top-nav ul li:nth-child(6).current_page_item a {
    /*border-bottom: 1px solid #213E88;*/
}


nav#left-side-nav {
    position: relative;
    text-align: left;
}

nav#left-side-nav ul li {
    display: inline;
    background-color: none;
}

nav#left-side-nav ul li:hover {

}

nav#left-side-nav ul li a {
    font-size: 20px;
    text-decoration: none;
    display: block;
    padding: 5px 25px;
    color: #666666;
    margin-bottom: 5px;
}
nav#left-side-nav ul li a:hover {
    text-decoration: none;
}

div#social-footer ul.social-icons {
    display: inline-block;
}

ul.social-icons {
    padding: 0 50px;
}

ul.social-icons li a {
    display: inline-block;
}

div#social-footer ul.social-icons {
    display: inline;
}

div#social-footer ul {
    margin: 0 auto;
    /*width: 50%;*/
}
div#social-footer ul li  {
    padding: 10px;
    display: inline-block;
}

nav#left-side-nav ul li a  {
    color: #666666;
    /*font-size: 20px !important;*/
}

nav#left-side-nav ul li:first-of-type a  {
    color: #666666;
    /*font-size: 20px !important;*/
}
nav#left-side-nav ul li.current_page_item a span {
    margin-right: 10px;
}
nav#left-side-nav ul li.current_page_item a {
    background-color: #789FB2;
    color: #FFFFFF;
    line-height: 40px;
}

div#content-left {
    width: 560px;
    float: left;
    padding: 40px 30px 40px 50px;
}

aside.right-column {
    width: 260px;
    float: right;
    padding: 50px 50px 25px 10px;
}
blockquote {
    font-size: 18px;
}
blockquote.quote-widget-right {
    background-color: #789FB2;
    color: #FFFFFF;
    font-family: Georgia, serif;
    font-style: italic;
    quotes: "\201C" "\201D";
    padding: 25px;
    margin-bottom:35px;
    float: right;
}

blockquote.quote-widget-right:last-of-type {
    margin-bottom: 0px;
}

blockquote p {
    color: #FFFFFF !important;
}

blockquote footer {
    background-color: inherit;
    border-top: 1px inset #99CCE4;
    padding-top: 10px;
    text-align: right;
    width: auto;
}

blockquote footer cite {
    font-style: normal;
}

div#content-left ul, div.entry ul {
    margin-left: 30px;
    margin-bottom: 25px;
    list-style: none;
}

div#content-left ul li, div.entry ul li {
    margin-top: 10px;
    background: url('/images/red-square.png') no-repeat left 8px;
    padding-left: 35px;
}

div#content-left h2 {
    border: none;
}

div#content-left h2 {
    border: none;
}

nav#left-side-nav ul#child-links {
    margin-top: 25px;
    margin-bottom: 25px;
}
nav#left-side-nav ul#child-links li a {
    padding-left: 50px;
    font-size: 14px;
    line-height: 20px;
    color: #2C799F;
}

nav#left-side-nav ul#child-links li.current_page_item a {
    color: #FFFFFF;
}

/* Alignment */
.alignright {
    text-align: right;
}

div#twitter-feed {
    margin-bottom: 7px;
    padding: 45px 10px;
    background-color: #789FB2;
    font-size: 16px;
    overflow: hidden;
}

div#social-header {
    text-align: right;
    position: absolute;
    top: 34%;
    right: 0px;
}

div#social-footer {
    border-top: 1px solid #CDCDCD;
    border-bottom: 1px solid #CDCDCD;
    padding: 45px 0;
    text-align: center;
    width: 100%;
}

div#twitter-feed p.rtw_main {
    margin-bottom: 0px;
    line-height: 25px;
}

div#twitter-feed p {
    vertical-align: middle;
    background: url('/images/twitter-bird-white.png') no-repeat left top;
    padding-left: 40px;
    line-height: 25px;
}
div.bnsaw-credit {
    padding: 0 50px;
}
div#twitter-feed p, div#twitter-feed a {
    color: #FFFFFF;
    font: 16px "Droid Sans", sans-serif;
}

div#twitter-feed .widget {
    border: none;
    padding: 0px;
    margin: 0px;
}

div#twitter-feed p a {
    text-transform: none;
}

div#copyright {
    font-family: "Arial", sans-serif;
    font-size: 13px;
    color: #AAAAAA;
    text-align: right;
    padding: 25px 123px 25px 25px;
    background: #FFFFFF url('images/logo-american-cancer-society-bw.png') no-repeat 95% center;
}
aside { 
    float: left; 
    width: 265px;
    background-color: #F0F0F0;
    padding-top: 30px;
}

aside nav {
    display: inline;
}

aside nav ul {
    /*min-height: 250px;*/
}

img.center {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.widget {
    border-top: 1px solid #BFBFBF;
    padding: 20px 0px;
    margin-left: 50px;
    margin-right: 20px;
}

#main-content aside .widget h1, 
#main-content aside .widget h2,
#main-content aside .widget h3, 
#main-content aside .widget h4,
#main-content aside .widget h5 {
    border-top: none;
    font-size: 18px;
    font-weight: bold;
    color: #666666;
    margin-bottom: 10px;
}

.widget p {
    font-size: 14px;
    line-height: 150%;
    margin-bottom: 10px;
}

#main-content a.donate-button-red, 
#main-content a.donate-button-red:visited {
    color: #FFFFFF;
}
.donate-button-red {
    background-color: #C5202B;
    font-family: menschregular;
    text-transform: uppercase;
    font-size: 28px;
    color: #FFFFFF;
    border-radius: 4px;
    padding: 10px 35px;
    letter-spacing: -2px;
    white-space: nowrap;
    display: block;
    margin-top: 20px;
    /* box-shadow: 0px 0px 6px 2px #999999;*/
    border: 1px solid transparent;
}

.donate-button-red:hover {
    /*box-shadow: 0px 0px 4px 1px #ffffff;*/
    background-color: #D6222E;
     border: 2px solid white;
}

.donate-button-red:hover {
    text-decoration: none;
}

.post {
    
}

/* Arrows */
/* Use a <div>. example: <div class="arrow-up"></div>*/
.arrow-up {
	width: 0; 
	height: 0; 
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	
	border-bottom: 5px solid black;
}

.arrow-down {
	width: 0; 
	height: 0; 
	border-left: 20px solid transparent;
	border-right: 20px solid transparent;
	
	border-top: 20px solid #f00;
}

.arrow-right {
	width: 0; 
	height: 0; 
	border-top: 7px solid transparent;
	border-bottom: 7px solid transparent;
	border-left: 7px solid #FEB13E;
        display: inline-block;
        margin-right: 10px;
}
.current_page_item .arrow-right {
	border-left: 7px solid #FFFFFF;
}
.current_page_ancestor .arrow-right {
	border-left: 7px solid #007CA7;
}

ul#child-links .arrow-right {
    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent;
    border-left: 4px solid #007CA7;
}

ul#child-links .current_page_item .arrow-right {
    border-left-color: #FFFFFF;
}
.arrow-left {
	width: 0; 
	height: 0; 
	border-top: 10px solid transparent;
	border-bottom: 10px solid transparent; 
	
	border-right:10px solid blue; 
}

div#main-content ul.featured-items li .d3_pie_chart h2 {
    line-height: 30px;
    border-bottom: none;
    text-transform: uppercase;
}
div.d3_pie_chart {
    /*padding-top: 30px;*/
}

.d3_pie_chart a.donate-button-red {
    position: relative;
    top: -90px;
}

a.no-underline:hover {
    text-decoration: none;
}

svg g.arc {
    color: #FFFFFF;
    font-size: 25px;
    font: "Droid Sans";
}

}/* END @media screen */


@font-face {
    font-family: 'menschregular';
    src: url('fonts/Mensch/mensch-webfont.eot');
    src: url('fonts/Mensch/mensch-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Mensch/mensch-webfont.woff') format('woff'),
         url('fonts/Mensch/mensch.webfont.ttf') format('truetype'),
         url('fonts/Mensch/mensch-webfont.svg#menschregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* Generated by Font Squirrel (http://www.fontsquirrel.com) on September 12, 2012 */
@font-face {
    font-family: 'Droid Sans';
    src: url('fonts/Droid/Droid_Sans/droidsans-webfont.eot');
    src: url('fonts/Droid/Droid_Sans/droidsans-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Droid/Droid_Sans/droidsans-webfont.woff') format('woff'),
         url('fonts/Droid/Droid_Sans/droidsans-webfont.ttf') format('truetype'),
         url('fonts/Droid/Droid_Sans/droidsans-webfont.svg#droid_sansregular') format('svg');
    font-weight: normal;
    font-style: normal;

}