.browsehappy {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}

/* Space out content a bit */
body {
    padding-top: 20px;
    padding-bottom: 20px;
}

/* Everything but the jumbotron gets side spacing for mobile first views */
.header,
.marketing,
.footer {
    padding-left: 15px;
    padding-right: 15px;
}

/* Custom page header */
.header {
    border-bottom: 1px solid #e5e5e5;
}

/* Make the masthead heading the same height as the navigation */
.header h3 {
    margin-top: 0;
    margin-bottom: 0;
    line-height: 40px;
    padding-bottom: 19px;
}

/* Custom page footer */
.footer {
    padding-top: 19px;
    color: #777;
    border-top: 1px solid #e5e5e5;
}

.container-narrow > hr {
    margin: 30px 0;
}

/* Main marketing message and sign up button */
.jumbotron {
    text-align: center;
    border-bottom: 1px solid #e5e5e5;
}

.jumbotron .btn {
    font-size: 21px;
    padding: 14px 24px;
}

/* Supporting marketing content */
.marketing {
    margin: 40px 0;
}

.marketing p + h4 {
    margin-top: 28px;
}

/* Responsive: Portrait tablets and up */
@media screen and (min-width: 768px) {
    .container {
        max-width: 730px;
    }

    /* Remove the padding we set earlier */
    .header,
    .marketing,
    .footer {
        padding-left: 0;
        padding-right: 0;
    }

    /* Space out the masthead */
    .header {
        margin-bottom: 30px;
    }

    /* Remove the bottom border on the jumbotron for visual effect */
    .jumbotron {
        border-bottom: 0;
    }
}



/*.navbar-inner {*/
    /*background-color: #6896d2;*/


    /* Gradients for modern browsers, replace as you see fit */
    /*background-image: -moz-linear-gradient(top, #6896d2, #6896d2);*/
    /*background-image: -ms-linear-gradient(top, #6896d2, #6896d2);*/
    /*background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#6896d2), to(#6896d2));*/
    /*background-image: -webkit-linear-gradient(top, #6896d2, #6896d2);*/
    /*background-image: -o-linear-gradient(top, #6896d2, #6896d2);*/
    /*background-image: linear-gradient(top, #6896d2, #6896d2);*/
    /*background-repeat: repeat-x;*/

    /* IE8-9 gradient filter */
    /*filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#333333', endColorstr='#222222', GradientType=0);*/


/*}*/

.navbar-nav > li > a {
    color:#428bca !important;
}
.navbar-nav > li > a:hover {
    text-decoration: underline;
}

.navbar-brand {
    line-height:18px;
    font-size:20px;
    padding-top:12px;
    padding-bottom:5px;
    font-weight:bold;
}

.navbar-brand small {
    display:block;
    margin-top:2px;
    margin-bottom:4px;
    padding-top:3px;
    font-size:12px;
}

#progressBar, #progressBarMain {

    position:absolute !important;
    width:70%;
    margin-left:10%;
    margin-top:10%;
    opacity:0.7;
    z-index:3000;
    pointer-events:none;
}

#progressBarText, #progressBarMain {

    font-weight:bold;

}

#miniGraphArea {
    width:100%;
    /*height:35%;*/
    /*border:1px solid blue;*/
}

#mainGraphArea {
    width:100%;
    /*height:65%;*/
    /*border:1px solid #bbbbff;*/
    border-radius:5px;
}

@media (max-width: 1040px) {
    #meOfContactMe {
        display:none;
    }
}

@media (max-width: 959px) {
    /* Don't show these tables */
    #detailTableInputWrapper, #detailTableSpendingWrapper {
        display:none;
    }
    #youCanClickSubRects {
        display: none;
    }
    #bestOnDesktop {
        display:inline-block;
    }

}

/* ugh - need to make another pass, as there are several breakpoints at odds with each other */
@media (max-width: 780px) {
    #bestOnDesktop {
        display:none;
    }
}

#topNavBar {
    padding-left: 15%;
}

.navbar-header {
    float: left;
} /* so that tweet/share buttons stay over there on the right */

.navbar-right {
    float:right !important;
}

.navbar-nav>li {
    float:left;
}
#contactMeNextToTitle {
    display:none;
}

#contactMe {
    font-weight:bold;
    font-style:italic;
}

#usAbbreviated {
    display:none;
}

@media (max-width:440px) {
    #youCanClickHereToPickYear {
        font-size:12px;
    }
}


/* my iPhone, portrait */
@media (max-width:320px) {


    #contactMeNextToTitle {
        display:inline;
    }

    #contactMe, #otherViz {
        display: none;
    }

}

@media (max-width:800px) {
}

/* Weird edge case where if you had exactly 768 this won't work */
@media (max-width:767px) {
    #topNavBar {
        padding-left: 1%;
    }
    .main {
        padding-top: 0 !important;
    }
}

@media (max-width: 680px) {
     .navbar-brand {
         font-size:12px;
     }
    #contactMe, #otherViz {
        font-size:10px;
    }

}

@media (max-width: 500px) {
    #otherViz {
        display:none;
    }
}

/* iPhone 5 landscape, from http://stephen.io/mediaqueries/ */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 568px)
and (orientation : landscape) {
    /* STYLES GO HERE */
}


@media (min-width:1023px) {
    .main {
        padding-left:5px !important;
    }
}

/*@media (max-width: 900px) {*/
@media (max-width: 9000px) {
    #googlePlusShare {
        display:none;
    }
}
#tweetIt {
    display:none; /*I don't think anyone needs to see this - they'll tweet if they want to */
}
@media (max-width: 900px) {
    #tweetIt {
        display:none;
    }
}

/* For fixed header stuff */
div.FixedHeader_Cloned th,
div.FixedHeader_Cloned td {
    background-color: white !important;
}


.xDetailGrid.axis line , .yDetailGrid.axis line, .xDetail.axis line, .yDetail.axis line {
    stroke: lightgrey;
    opacity: 0.7;
}

.overlay {
    fill: none;
    pointer-events: all;
    z-index:1060; /* over detail tables... */
}


.main {
    imargin-top:25px;
}

.pickPicture_name:first-letter {
    text-transform: uppercase;
}

.picturePicture_thumb {
    width:50px;
}

#fadeBack {
    display:none;
}

#containerForMainImages, #selectPicturePicker {
    opacity:0;
}

.canYouTellDifference {
    font-weight: bold;
}

.description {
    font-size:12px;
}

#mainWrapper {
    margin-top:40px;
}

#fade_0, #switch_0 {
    opacity:0;
}

.methodSubTitle {
    font-size:12px;
    margin-top:6px;
}

#btnSwitchBackAndForth {
    margin-bottom:5px;
}

#mainTable td {
    width:50%;
}

p {
    text-indent:16px;
    margin-left:10px;
    margin-right:10px;
}

#me {
    font-weight:bold;
    font-style: italic;
}

/*img {*/
    /*background-image: url('../images/loading.gif');*/
    /*background-repeat: no-repeat;*/
    /*background-attachment: fixed;*/
    /*background-position: 48% 48%;*/
/*}*/