﻿body {
    padding-bottom: 20px;
}

/* Wrapping element */
/* Set some basic padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/* Carousel */
.carousel-caption p {
    font-size: 20px;
    line-height: 1.4;
}

/* Make .svg files in the carousel display properly in older browsers */
.carousel-inner .item img[src$=".svg"] {
    width: 100%;
}

/* QR code generator */
#qrCode {
    margin: 15px;
}

/* Hide/rearrange for smaller screens */
@media screen and (max-width: 767px) {
    /* Hide captions */
    .carousel-caption {
        display: none;
    }
}

.form-control {
    box-sizing: border-box !important;
}

.committee-pod{
    height:240px;
}

/*==== 2.8 Tile Default ====*/
.tile {
    width: 120px;
    margin: 8px;
    float: left;
    overflow: hidden;
    position: relative;
    background: #34495e; /* Old browsers */
    background: -moz-linear-gradient(left, #2c3e50 0%, #34495e 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,#2c3e50), color-stop(100%,#34495e)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left, #2c3e50 0%,#34495e 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left, #2c3e50 0%,#34495e 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(left, #2c3e50 0%,#34495e 100%); /* IE10+ */
    background: linear-gradient(to right, #2c3e50 0%,#34495e 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2c3e50', endColorstr='#34495e',GradientType=1 ); /* IE6-9 */
    -webkit-box-shadow: inset 0px 0px 1px 1px #34495e;
    box-shadow: inset 0px 0px 1px 1px #34495e;
    color: #fff;
}

    .tile:hover > a {
        background: #415C76; /* Old browsers */
    }

    .tile:active > a {
        background: #507191; /* Old browsers */
    }

    .tile a {
        -webkit-transition: background 0.5s ease;
        -moz-transition: background 0.5s ease;
        -ms-transition: background 0.5s ease;
        -o-transition: background 0.5s ease;
        transition: background 0.5s ease;
    }

    .tile i, .tile img {
        line-height: 120px;
    }

.text-center {
    text-align: center;
}

.text-left {
    text-align: left;
}

.tile i, .tile .title {
    line-height: 14px;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.tile .title {
    font-size: 11px;
}

    .tile .title i {
        line-height: 20px;
    }

        .tile .title i.icon-2x {
            top: -20px;
            font-size: 16px;
            line-height: 20px;
        }

.tile .text {
    top: 0;
    left: 0;
    padding: 8px 16px;
}

    .tile .text * {
        position: relative;
    }

/*==== 2.9 Image Tile ====*/
.imagetile img {
    position: static;
}

.imagetile a {
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

/*==== 2.10 Tile Content ====*/
.tile .text, .tile .title, .tile .tilecontent .tile > i, .tile > a > i, .tile .caption, .tile .sub, .tile .title-right {
    position: absolute;
    margin: 0;
}

.tile .text, .tile .title, .tile .tilecontent .tile .caption, .tile .sub, .tile .title-right {
    font-size: 15px;
}

.IconReduce {
    transform: translateY(-20%);
}

.containerExpander {
    width: 100% !important;
}

.hxs {
    height: 28px;
}
/*==== 2.11 Tile Height ====*/
.hs {
    height: 52px;
}

    .hs i, .hs img {
        line-height: 52px;
    }

.h1 {
    height: 120px;
}

.h45 {
    height: 45% !important;
}

.vertical .h1 {
    min-height: 120px !important;
}

.h1 i, .h1 img {
    line-height: 120px;
}

.h2 {
    height: 256px;
}

.vertical .h2 {
    min-height: 256px !important;
}

.h2 i, .h2 img {
    line-height: 256px;
}

.h3 {
    height: 392px;
}

.vertical .h3 {
    min-height: 392px !important;
}

.h3 i, .h3 img {
    line-height: 392px;
}

.h4 {
    height: 528px;
    line-height: 528px;
}

.vertical .h4 {
    min-height: 528px !important;
}

.h4 i, .h4 img {
    line-height: 528px;
}

/*==== 2.12 Tile Width ====*/
.ws {
    width: 52px;
}

.w1 {
    width: 120px;
}

.w45 {
    width: 45% !important;
}

.w2 {
    width: 256px;
}

.w3 {
    width: 392px;
}

.w4 {
    width: 528px;
}

.w5 {
    width: 664px;
}

.w8 {
    width: 98%;
}
/*==== 2.13 Tile Responsive ====*/

@media screen and (max-height:740px) {
    .h4 {
        height: 392px;
    }

        .h4 i, .h4 img {
            line-height: 392px;
        }

    .tile {
        max-height: 392px
    }
}

@media screen and (max-height:600px) {
    .h3 {
        height: 256px;
    }

        .h3 i, .h3 img {
            line-height: 256px;
        }

    .h4 {
        height: 256px;
    }

        .h4 i, .h4 img {
            line-height: 256px;
        }

    .tile {
        max-height: 256px;
    }
}

@media screen and (max-height:400px) {
    .h2 {
        height: 120px;
    }

        .h2 i, .h2 img {
            line-height: 120px;
        }

    .h3 {
        height: 120px;
    }

        .h3 i, .h3 img {
            line-height: 120px;
        }

    .h4 {
        height: 120px;
    }

        .h4 i, .h4 img {
            line-height: 120px;
        }

    .tile {
        max-height: 120px;
    }
}

/*==== 2.14 Tile Link ====*/
.tile a {
    color: #fff;
}

.tile .link {
    height: 100%;
    width: 100%;
    position: absolute;
    color: white;
}

/*==== 2.15 Tile Icon ====*/
.tile i {
    height: 100%;
    width: 100%;
    text-align: center;
    top: 0;
    left: 0;
}

/*==== 2.16 Tile Title ====*/
.tile .title {
    top: 8px;
    text-align: center;
    line-height: 120%;
}

.tile .title-right {
    right: 16px;
    top: 8px;
    text-align: right;
    margin-right: 0;
}

.ws .title, .hs .title {
    display: none;
}

.title {
    padding: 5px;
    width: 100%;
    height: 100%;
}
.navigation-tile p{
    padding: 20px;
}



.green {
    background: #2ecc71; /* Old browsers */
    background: -moz-linear-gradient(left, #27ae60 0%, #2ecc71 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,#27ae60), color-stop(100%,#2ecc71)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left, #27ae60 0%,#2ecc71 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left, #27ae60 0%,#2ecc71 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(left, #27ae60 0%,#2ecc71 100%); /* IE10+ */
    background: linear-gradient(to right, #27ae60 0%,#2ecc71 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#27ae60', endColorstr='#2ecc71',GradientType=1 ); /* IE6-9 */
    -webkit-box-shadow: inset 0px 0px 1px 1px #2ecc71;
    box-shadow: inset 0px 0px 1px 1px #2ecc71;
}

.green:hover a {
    background: #2ecc71; /* Old browsers */
}

.green:active a {
    background: #59D98E; /* Old browsers */
}

.blue {
    background: #3498db; /* Old browsers */
    background: -moz-linear-gradient(left, #2980b9 0%, #3498db 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,#2980b9), color-stop(100%,#3498db)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left, #2980b9 0%,#3498db 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left, #2980b9 0%,#3498db 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(left, #2980b9 0%,#3498db 100%); /* IE10+ */
    background: linear-gradient(to right, #2980b9 0%,#3498db 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2980b9', endColorstr='#3498db',GradientType=1 ); /* IE6-9 */
    -webkit-box-shadow: inset 0px 0px 1px 1px #3498db;
    box-shadow: inset 0px 0px 1px 1px #3498db;
}

.blue:hover a {
    background: #3498db; /* Old browsers */
}

.blue:active a {
    background: #52A7E0; /* Old browsers */
}
.CommitteeSelection {
    background-color: #3498db;
    background-image: url('https://www.transparenttextures.com/patterns/3px-tile.png');
}
.SelectedCommitteeType {
    background-color: #2ecc71 !important;
}


#CommitteeSearchAutoComplete ul {
    z-index: 3 !important;
    margin-top: 0px !important;
}

.awesomplete ul {
    z-index: 3 !important;
    margin-top:45px;
}

#CreateCandidateButton {
    margin-left: -210px;
    position: absolute;
    z-index: 3 !important;
}

/*html {
    background-color: black !important;
}
div{
    background-color:black !important;
}
input {
    background-color: black !important;
}
select {
    background-color: black !important;

}*/

input.error {
    background: #fff0f0 !important;
    border-color: #A90329 !important;
}
label.error {
    color: #b94a48;
}
select.error {
    background: #fff0f0 !important;
    border-color: #A90329 !important;
}

select.error {
    background: #fff0f0 !important;
    border-color: #A90329 !important;
}
input[type='search'] {
    height: 31px !important;
}

.compressed fieldset{
    padding: 6px !important;
}

.compressed legend{
    padding-top:0px !important;
}


.tooltipX {
    position: relative;
    padding: 2px;
    border-color: #9cb4c5;
    color: #305d8c;
    background-color: #999;
}

.trigger .tooltipX {
    background-color: #333;
    color: #ccc;
    padding: 8px;
    position: absolute;
    z-Index: 999;
    display: none;
}

.popover{
    padding:8px !important;
}

.help-block {
    color: #D56161 !important;
}

.footer {
    position: fixed;

    bottom: 0px;

}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .DirectSearch {
        margin-top: -8px !important;
    }
    #DirectId {
        padding-top:4px !important;
    }
    #CommitteeSearchAutoComplete {
        padding-top: 4px !important;
    }
}


.js .inputfile {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    position: absolute;
    z-index: -1;
}

.inputfile + label {
    max-width: 80%;
    font-size: 1.25rem;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
    display: inline-block;
    padding: 0.625rem 1.5rem;
}

.no-js .inputfile + label {
    display: none;
}


.inputfile + label svg {
    width: 1em;
    height: 1em;
    vertical-align: middle;
    fill: currentColor;
    margin-top: -0.25em;
    margin-right: 0.25em;
}


.inputfile + label {
    color: #d3394c;
}

.inputfile + label {
    border: 1px solid #d3394c;
    background-color: #f1e5e6;
    padding: 0;
}


    .inputfile + label span,
    .inputfile + label strong {
        padding: 0.625rem 1.5rem;
    }

    .inputfile + label span {
        width: 205px;
        min-height: 2em;
        display: inline-block;
        text-overflow: ellipsis;
        white-space: nowrap;
        vertical-align: top;
    }

    .inputfile + label strong {
        height: 100%;
        color: #f1e5e6;
        background-color: #d3394c;
        display: inline-block;
    }


@media screen and (max-width: 50em) {
    .inputfile + label strong {
        display: block;
    }
}


.overlay2 {
    opacity: 1;
    background-color: #ccc;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    z-index: 1000;
}