﻿/* Move down content because we have a fixed navbar that is 50px tall */
body {
    padding-top: 65px;
    padding-bottom: 0;
    background-image:none;
    background-size:cover;
    background-repeat:no-repeat;
}

.container {
    padding-left:15px;
    padding-right:15px;
}

footer {
    padding:30px 5px;
}

.navbar-inverse .navbar-toggle {
    border-color:blue;
}
.navbar-inverse .navbar-toggle .icon-bar {
    background-color:blue;
}

.navbar-brand {
    padding:15px;
}

li {
    letter-spacing:1px;
}
table {
    width:100%;
}
th {
    padding:5px 0;
}
td {
    padding:5px 0;
}

h1 {
    color:skyblue;
    font-size:32px;
}
h1.service-title {
    color:#000000;
    font-size:20pt;
    padding:0 5px;
}
h3.home {
    color:#ffffff;
    padding:5px;
    /*border-bottom:1px solid skyblue;*/
    background-color:none!important;
    margin-top:0;
    font-weight:bold;
    font-size:14pt;
    text-align:center;
}
h3.home-partner {
    color:#999999;
    text-align:center;
    font-size:14pt;
    margin:30px 0 15px;
}
h3.service-point {
    text-align:right;
    margin:5px 0 0;
}
h4.home-title {
    line-height:1.3em;
    font-weight:normal;
    color:#ffffff;
    font-size:18pt;
    margin-bottom:30px;
}
h5 {
    font-weight:bold;
}
h5.service {
    color:#000000;
}
h5.service-vendor {
    color:#999999;
}
h5.form-header {
    color:#999999;
    font-weight:normal;
    padding-left:5px;
    margin-bottom:-5px;
}


img {
    width:100%;
}
img.vendor-logo {
    width:calc((100% - 100px) / 2);
    margin:15px;
    display:inline-block;
}
img.logo-sos {
    max-width:75px;
    margin:0;
}

.login {
    font-size:10pt!important;
    color:red!important;
}
    .login:hover {
        color:#000000!important;
        border:0!important;
    }

p {
    letter-spacing:1px;
}

.btn-dashboard {
    color:#f2f2f2!important;
    display:inline-block;
    border:0;
    border-left:5px solid red;
    margin:15px;
    padding:5px 15px;
    font-size:14pt;
    background-color:transparent;
}
    .btn-dashboard:hover {
        border-left:5px solid deepskyblue;
        text-decoration:none;    
        color:#f2f2f2!important;
    }

a.recovery {
    color:#000000!important;
    text-shadow:0 0 5px #999999;
}
a.faq {
    color:#ffffff;
    font-weight:bold;
    text-decoration:underline;
}
a.btn-round {
    border-radius:50%;
    background-color:#333333;
    color:#ffffff!important;
    margin:15px;
    padding:5px!important;
    width:30px;
    text-align:center;
}
    a.btn-round:hover {
        text-decoration:none!important;
        background-color:#999999!important;
        border:0!important;
    }

p.box {
    margin:15px 5px;
}
p.faq {
    font-size:12pt;
    color:#ffffff!important;
}

div.home-title {
    background-color:rgba(0,0,0,0.75);
    margin:15px 0;
    padding: 30px;
    border-radius:5px;
    color:#ffffff;
    box-shadow:0 0 5px #333333;
}
div.home-about {
    background-color:blue;
    color:#ffffff;
    border-radius:2px;
    margin:30px 0 15px;
    padding:30px 15px;
    box-shadow:0 0 5px #333333;
}
div.home-how {
    background-color:blue;
    color:#ffffff;
    border-radius:2px;
    margin:15px 0;
    padding:45px;
    box-shadow:0 0 5px #333333;
}
div.home-partner {
    border:5px solid #f2f2f2;
    padding:15px;
    margin:15px 0;  
}
div.contact-title {
    background-color:rgba(0,0,0,0.5);
    margin:5px 0;
    padding:15px;
    border-radius:5px;
    color:#ffffff;
}
div.home-login {
    margin:15px 0;
    padding:15px 0;
    color:#000000;
}
div.home-dashboard {
    background-color:rgba(0,0,0,0.7);
    margin:15px 0;
    padding:30px;
    color:#ffffff;
    box-shadow:0 0 5px #333333;
}
div.service-box {
    width:100%;
    display:inline-block;
    margin:0 0 15px;
    vertical-align:top;
}
div.service-box-container {
    padding-top:50%;
    overflow:hidden;
    position:relative;
    border-top:1px solid deepskyblue;
}
div.service-box-img {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}
div.service-box-text {
    margin:0;
    background-color:#f2f2f2;
    padding:15px;
    border-radius:1px;
}
div.service-points {
    float:right;
    display:inline-block;
    clear:both;
    border:1px solid deepskyblue;
    background-color:blue;
    color:#ffffff;
    font-size:11pt;
    padding-bottom:5px;
    padding-left:15px;
    padding-right:15px;
    padding-top:5px;
    margin:15px 0;
}
div.service-vendor {
    padding:15px 5px 15px 5px;
    vertical-align:top;
    margin:0 0 15px;
}

div.exclusive-filter {
    background-color:#f2f2f2;
    padding:15px;
    margin:15px 0;
    color:deepskyblue;
    text-align:center;
    box-shadow:0 0 5px deepskyblue;
}

span.quote {
    font-size:10pt;
    color:red;
    font-weight:normal;
}

/* Wrapping element */
/* Set some basic padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}
.text-bold {
    font-weight:bold;
}
.navbar-inverse {
    background-color:rgba(255,255,255,0.9);
    border-bottom:0;
    box-shadow:0 0 10px blue;
}
.navbar-inverse .navbar-nav>li>a {
    color:blue;
    font-size:12pt;
    margin-top:15px;
    padding:0 15px;
}
    .navbar-inverse .navbar-nav>li>a:hover {
        color:red;
        border:0;
    }   
.btn.btn-default {
    background-color:red;
    color:#ffffff;
    border:0;
    padding:5px 30px;
}
    .btn.btn-default:hover {
        background-color:lightcoral;
    }
.btn.btn-exclusive {
    background-color:red;
    color:#ffffff;
    border:0;
    padding:15px 30px;
    margin:30px auto;
    font-size:14pt;
    box-shadow:0 0 5px #333333;
}
    .btn.btn-exclusive:hover {
        background-color:lightcoral;
    }
.btn-apply {
    padding-top:5px!important;
    padding-bottom:5px!important;
    border:1px solid red;
    margin:15px;
    border-radius:5px;
    color:red!important;
    background-color:transparent;
    font-size:11pt!important;
}
    .btn-apply:hover {
        border:1px solid #000000!important;
        color:#000000!important;
        background-color:#f2f2f2!important;
    }
.btn-apply-white {
    padding: 15px;
    border:2px solid #ffffff;
    margin-top:10px;
    border-radius:5px;
    color:#ffffff!important;
    background-color:transparent;
}
    .btn-apply-white:hover {
        border:2px solid #000000!important;
        color:#000000!important;
    }
.btn-apply-black {
    padding: 15px;
    border:2px solid #000000;
    margin-top:15px;
    border-radius:5px;
    color:#000000!important;
    background-color:transparent;
}
    .btn-apply-black:hover {
        border:2px solid blue!important;
        color: blue!important;
    }

.skyblue {
    color:deepskyblue;
}

.agreement {
    font-size:10pt;
    color:#999999;
    margin-top:15px;
}

.login-error {
    color:#ffffff;
    background-color:rgba(0,0,0,0.75);
    margin:15px 0;
}

.row.home {
    background-image:url('/images/bg-login.jpeg');
    background-size:cover;
    background-repeat:no-repeat;
    padding:0;
    box-shadow:0 0 5px #333333;
}
.row.logged {
    background-image:url('/images/bg-login.jpeg');
    background-size:cover;
    background-repeat:no-repeat;
    padding:0;
}
.row.contact {
    background-image:url('/images/bg-contact.jpeg');
    background-size:cover;
    background-repeat:no-repeat;
    padding:0;
}
.row.partnership {
    background-image:url('/images/bg-partner.jpeg');
    background-size:cover;
    background-repeat:no-repeat;
    padding:0;
}
.row.membership {
    background-image:url('/images/bg-application.jpg');
    background-size:cover;
    background-repeat:no-repeat;
    padding:0;
}
.row.faq {
    background-color:blue;
    color:#ffffff;
    padding:30px;
    text-align:center;
    font-size:20pt;
}

.form-textbox {
    border:0!important;
    border-bottom:1px solid lightblue!important;
    padding:5px;
    margin:15px 0;
    width:100%!important;
    background-color:transparent;
}
.form-textbox-nospace {
    border:0!important;
    border-bottom:1px solid lightblue!important;
    padding:5px;
    margin:0 0 15px;
    width:100%!important;
    background-color:transparent;
}
.form-dropdown {
    padding:5px;
    border:0;
    background-color:#f2f2f2;
    margin:15px 0;
}
.form-textarea {
    border:0!important;
    border-bottom:1px solid lightblue!important;
    padding:5px;
    margin:15px 0;
    width:90%!important;
    background-color:transparent;
}
.form-steps {
    color: #F50000;
    font-size:11pt;
    vertical-align:middle;
}

.exclusive-dropdown {
    padding:15px;
    border:0;
    border-bottom:2px solid deepskyblue;
    color:#333333;
    font-size:14pt;
    background-color:#f2f2f2;
}

.vendor-logo {
    max-width:200px;
    width:100%;
}

.col-md-6.about {
    padding:0;
}
.col-md-8.form {
    border:0;
    border-radius:2px;
    background-color:#f9f9f9;
    padding:5px;
    box-shadow:0 0 5px #999999;
}
.col-md-4.form-left {
    padding-right:0;
    padding-left:0;
}
.col-md-12.contact {
    padding:5px;
}

.gvHeader td, .gvHeader th {
    padding:5px;
}

.view-btn {
    padding:5px 15px;
    margin:5px;
    border:0;
    box-shadow:0 0 5px #999999;
    background-color:#f2f2f2;
    color:#000000;
    width:100%;
}
    .view-btn:hover {
        background-color:Highlight;
    }
    .view-btn.selected {
        background-color:blue;
        color:#ffffff;
        cursor:default;
    }
    .view-btn.inactive {
        background-color:#f2f2f2;
        color:#999999;
        cursor:default;
    }

/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}
.modal.show {
    display:block;
}

/* Modal Content/Box */
.modal-content {
    background-color: #fefefe;
    margin: 100px auto 30px; /* 15% from the top and centered */
    padding: 20px;
    border: 1px solid #888;
    width: 90%; /* Could be more or less, depending on screen size */
    font-size:9pt;
}

/* The Close Button */
.close {
    color: #333;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.close:hover,
.close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}

.btn-application {
    border:0;
    background-color:transparent;
    color:blue;
    margin:0;
    padding:0;
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set widths on the form inputs since otherwise they're 100% wide */
input[type="text"],
input[type="password"],
input[type="email"],
input[type="tel"],
input[type="select"] {
    max-width: 400px;
    padding:5px;
    width:100%;
}
input[type=checkbox] {
    vertical-align:sub;
}

label {
    font-weight:normal;
    padding:0 0 0 5px;
}
    label:disabled {
        color:#999999;
    }

/* Responsive: Portrait tablets and up */
@media screen and (min-width: 400px) {
    div.service-box {
        width:calc(50% - 33px);
        margin:15px;
    }
}

@media screen and (min-width: 768px) {
    .container {
        padding-left:0;
        padding-right:0;
    }
    .jumbotron {
        margin-top: 20px;
    }
    .body-content {
        padding: 0;
    }
    .navbar-brand {
        padding:15px 30px 15px 0;
    }
    .col-md-4.form-left {
        padding-right:30px!important;
        padding-left:15px!important;
    }
    .col-md-8.form {
        padding:15px;
    }
    .form-steps {
        font-size:14pt;
    }
    .btn-apply {
        margin:15px 0 0 0;
    }
    h1 {
        font-size:34pt;
    }
    h1.service-title {
        padding:0;
    }
    img.vendor-logo {
        width:calc((100% - 100px) / 4);
    }
    p.box {
        margin:5px 0;
    }
    div.box-white {
        padding:0 15px;
    }
    div.service-box {
        width:calc(25% - 33px);
        margin:15px;
    }
    div.service-points {
        font-size:14pt;
        padding-bottom:5px;
    }
    div.service-vendor {
        padding:15px 5px 15px 0;
    }
}
