﻿.title {
    /* font-family: 'Buenard', serif;*/
    font-family: 'Alex Brush', 'cursive';
    color: #002355;
    margin-left: 250px;
    text-shadow: 0 2px 3px rgba(0,0,0,0.50);
    line-height: 80px;
    vertical-align:middle;
}

.trimmedCombo {
    overflow: hidden;
    -ms-text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    width:100%;
}

.contentBackground{
    background: rgba(255, 255, 255, 0.95);
    -webkit-box-shadow: rgba(0, 0, 0, 0.6) 0px 0px 18px;
    -o-box-shadow: rgba(0, 0, 0, 0.6) 0px 0px 18px;
    -moz-box-shadow: rgba(0, 0, 0, 0.6) 0px 0px 18px;
    box-shadow: rgba(0, 0, 0, 0.6) 0px 0px 18px;
    margin-top: 0px;
        border-style: solid;
}

.contentBackgroundFooter {
    background: rgba(255, 255, 255, 0.95);
    -webkit-box-shadow: rgba(0, 0, 0, 0.6) 0px 6px 10px;
    -o-box-shadow: rgba(0, 0, 0, 0.6) 0px 6px 10px;
    -moz-box-shadow: rgba(0, 0, 0, 0.6) 10px 5px 18px;
    box-shadow: rgba(0, 0, 0, 0.6) 0px 6px 10px;
    margin-top: 0px;
}

.logoAndTitleDiv {
    padding-right:5px;
}

.fundlogo {
    margin-top: 7px;
}

@media screen and (min-width: 992px) and (max-width:1199px) {
    .title{
        font-size: 30px;
    }
}

@media screen and (min-width: 768px) and (max-width:991px) {
    .title{
        font-size: 25px;
        margin-left: 200px;
    }

    .fundlogo {
        margin-top: 12px;
        height: 90px;
        width: 185px;
    }
}


@media screen and (min-width: 768px) {

    .navbar
    {
        border-radius:0px !important;
        padding-bottom:20px;
    }

    .navbar-text {
        display: inline-block !important;
        float: none !important;
        margin-left: 0px !important;
        margin-bottom: 0px !important;
    }

    .static > a {
        padding: 0px !important;
        text-shadow:0 1px 1px rgba(0,0,0,0.20);
    }

    .static > .level2 {
        margin-left: 12px;
    }
}

.mobilelogo{
    padding:4px;
}

@-ms-viewport{
	width: device-width;
}

#loginControl .row
{
    margin-top: 4px;
}

.btn{
    height:26px;
    padding-top:3px;
}

.buttonbar{
    padding:12px 0px 4px 0px;
}

.debug
{
    border:1px solid red;

}

.loginFailure
{
    color:red;
    font-size:small;
    font-weight:bold;
    text-align:center;

}

.noSizing
{
    width:auto !important;
}

.card {
    background-color: white;
    height:200px;
    width:200px;
    font-size: x-small;
    border: 1px solid #dcdcdc;
    border-radius: 2px;
    padding-top: 5px;
    margin: 10px 20px 0px 20px;

    /* to play with bootstrap, match margins, etc. of typical col-*-* */
    position: relative;
    min-height: 1px;
    padding-left: 15px;
    padding-right: 15px;
    box-shadow:0px 8px 15px 0px rgba(50, 50, 50, 0.75);
    cursor:default;
}

.cardPressed
{
    border:2px solid rgb(102,175,233);
    box-shadow:0px 5px 5px 0px rgba(50, 50, 50, 0.90);
}

.card:hover .cardMenuBar
{
    background-color: #cccccc;
}

.clickableCard{
    cursor:pointer;
}

.clickableCard:hover{
    border:1px solid #90c4ee;
    cursor:pointer;
}

.cardMenuBar
{
    float:right;
    margin-top:-6px;
    margin-right:-10px;
    padding-top:4px;
    background-color: #dddddd;
    border-bottom: 1px solid #cccccc;
    border-left: 1px solid #cccccc;
    border-right: 1px solid #cccccc;
    border-bottom-left-radius:3px;
    border-bottom-right-radius:3px;
}

.cardMenuBar:hover{
   cursor:pointer;
}

.card:hover .cardMenuButton
{
    color:black;
}

.card:hover .cardFlipButton
{
    background-image:url(Images/flip.png);
    background-repeat:no-repeat;
    visibility:visible;
    z-index:99999;
}
.card .cardButton
{
    min-width:25px;
    min-height:20px;
    float:right;
    padding:0px;
    z-index:100;
}

.card .cardFlipButton
{
    background-image:url(Images/flip.png);
    background-repeat: no-repeat;
    background-position-y:-2px;
    background-position-x:3px;

    display:inline-block;
}

.card .cardMenuButton
{
    text-align:center;
    font-size:small;
    float:right;

    
}

@media screen and (max-width:767px)
{
    .card .cardButton
    {
        min-width:33px;
        min-height:33px;
        height:33px;
        width:33px;
        padding-top:6px;
    }

    .card .cardFlipButton
    {
        background-position-y:3px;
        background-position-x:center;
    }

    .dropStatementOwner{
        margin-top: -12px;
    }
}

.cardMenuButton .dropdown-toggle
{
    width:100%;
    height:100%;
    min-height:100%;
}


.postmark{
    background-image: url(Images/postmarkCard.png);
    background-repeat:no-repeat;
    background-position:right bottom;
}

.estimateCard
{
    background-image: url(Images/estimateCard4.png);
    background-repeat:no-repeat;
    background-position:right bottom;
}

.beneficiaryCard
{
    background-image: url(Images/beneficiaryCard.png);
    background-repeat:no-repeat;
    background-position:right bottom;
}
.calculatorCard
{
    background-image: url(Images/calculatorCard3.png);
    background-repeat:no-repeat;
    background-position:right bottom;
}

.depositCard
{
    background-image: url(Images/bank.png);
    background-repeat:no-repeat;
    background-position:right bottom;
}

.withholdingCard
{
    background-image: url(Images/capitol.png);
    background-repeat:no-repeat;
    background-position:right bottom;
}

.irs1099Card
{
    background-image: url(Images/1099.png);
    background-repeat:no-repeat;
    background-position:right bottom;
}

.benefitPaymentHistCard
{
    background-image: url(Images/benpaymenthist.png);
    background-repeat:no-repeat;
    background-position:right bottom;
}

.statementCard
{
    background-image: url(Images/statement.png);
    background-repeat:no-repeat;
    background-position:right bottom;
}

.dropCard
{
    background-image: url(Images/dropVault.png);
    background-repeat:no-repeat;
    background-position:right bottom;
}

.ytdCard
{
    background-image: url(Images/ytd.png);
    background-repeat:no-repeat;
    background-position:right bottom;
}

.onlineFormCard
{
    background-image: url(Images/lighttab.png);
    background-repeat:no-repeat;
    background-position:right bottom;
}

.seminarCard
{
    background-image: url(Images/seminarCard.png);
    background-repeat: no-repeat;
    background-position: center;
}

.taxCard
{
    background-image: url(Images/taxCard.png);
    background-repeat:no-repeat;
    background-position:right bottom;
}

.cardList {
    margin-left: -15px !important;
    margin-right: 5px !important;
    padding-left: 0px;
    padding-bottom:5px;
    text-align: center;
}

.card .cardHeader{
    z-index:10;
}

.cardTitle
{
    color:#002355;
}

.card .col-xs-5{
    padding-left:0px;
}

.estimateIcon
{
    margin:10px 0;
}

.card .cardTitle
{
    font-weight:bold;
    font-size:small;
}

.cardTitle a
{
    color:#002355 !important;
}

.card .details
{
    font-style:italic;
    color: #555555;
    font-weight: bold;
}

.card .plan
{
    font-size:x-small;
}

.row-centered {
    text-align:center;
}

.col-centered {
    display:inline-block;
    float:none;
    /* reset the text-align */
    text-align:left;
    /* inline-block space fix */
    margin-right:-4px;
}

.fieldLabel + div
{
}

.cardBack
{
    display:none;
    height:100%;
}

.contributionName {
    text-align:right;
}

@media screen and (max-width: 991px)
{
    /* small devies, force to not behave like a table anymore */
    table.flextable, .flextable thead, .flextable tbody, .flextable th,
    table.flextable td, .flextable tr{

        display:block;

    }

    table.flextable thead tr {
        display:none;
    }


    table.flextable td{
        border:none;
        border-bottom: 1px solid #eee;
        position:relative;
        
    }

    table.flextable tr:nth-of-type(odd)
    {
        background: #ddd;
    }

    table.flextable td:before {
        position:absolute;
        top:6px;
        left: 6px;
        width:25%;
        padding-right:10px;
        white-space: nowrap;
    }

    .flextableHideColon {
        display:none;
    }

    .contributionName {
        text-align:center;
        font-weight:bold;
    }

}

.drivingDirectionsPanel
{
    display:none;
}

#directionsContainer{
    /*margin-top:-50px;*/
}

#mapDiv{
    border: solid 1px #d4d4d4;
}

.menuBarLeft {
    background-color: rgba(255, 255, 255, 0.85);
    border-left: solid 2px;
    border-right: solid 2px;
    border-top: solid 2px;
    -webkit-border-top-left-radius: 15px;
    border-top-left-radius: 15px;
    -webkit-border-top-right-radius: 15px;
    border-top-right-radius: 15px;
}

.menuBarRight {
    background-color: rgba(255, 255, 255, 0.85);
    border-left: solid 2px;
    border-right: solid 2px;
    border-top: solid 2px;
    -webkit-border-top-left-radius: 15px;
    border-top-left-radius: 15px;
    -webkit-border-top-right-radius: 15px;
    border-top-right-radius: 15px;
}

.fundAddress{
    font-size:x-small;
    margin-top: 15px;
    font-weight:300;
    color: white;
    text-shadow: 0 1px 2px rgba(0,0,0,0.50);
    padding-left: 0px;
}

.tablehack  .fieldLabel
{
    padding-right:10px;
}

.tablehack .fieldLabel hr
{
    margin: 0px;
}

.tablehack th
{
    padding-left:4px;
    padding-right:4px;
}

.tablehack td
{
    padding-left:4px;
    padding-right:4px;
}

.tablehack table
{
    border-color:lightgray;
    margin:0 auto;
    font-size:smaller;
}
.tablehack table tr td
{
    border-color:lightgray;
}

.dropBalance {
    font-size:x-large;
    font-weight:bolder;
    color: green;
    text-shadow:0px 1px 3px rgba(0,0,0,.2);
}

.headerCenter {
    text-align:center !important;
}

.headerRight {
    text-align:right !important;
}

.DROPBegginingBalance {
    padding-right:30px !important;
}

.DROPPostedDate {
    padding-right:50px !important;
}

@media screen and (max-width:767px) {
    .DROPPostedDate {
        padding-right:5px !important;
    }
}

.leftHandNavLink {
    color: #002355;
}

@media screen and (max-width:767px){
    .checkPopOverImage{
        width:200px;
    }
}


