/*Tweaks to Unify for ViewClix web site*/
/*(this file replaces custom.css*/

/*first, OVERALL ADJUSTMENTS to fonts, pages, footer, rows */

body {
    font-family: vc-regular, sans-serif;
    /*letter-spacing: .02em;*/
    line-height: 1.4em;
    font-size: 12.5pt;
    color: #444444;
}
.bootstrap-dialog .modal-content {
    border-radius: 1rem;
    overflow: hidden;
    border: 1px solid #428bca;
}
.bootstrap-dialog .modal-header {
    background-color: #428bca !important;
    border-radius: 0 !important;
}
.bootstrap-dialog-title {
    font-size: 1.5rem !important;
    margin-bottom: 8pt;
}
.bootstrap-dialog-message {
    font-size: 1rem !important;
}
.bootstrap4-dialog-button {
    padding: 4pt 12pt;
    background-color: #808080;
    border: none;
    font-weight: normal;
}
.bootstrap-dialog-close-button button {
    opacity: 1!important;
    font-family: vc-light, sans-serif;
    font-size: 1.3rem !important;
    padding: 0 0 2px 2px;
}
p,
li,
li a {
   color: #000;
}
.content {
    /*padding-top: 7px;*/
    padding-bottom: 20px;
    background-color: white;
}

.fa-home {
    font-size: 1.2em;
    margin-top:-4px;
}
.footer-v1 .footer h2 {
    line-height:20px
}

.footer-v1 .footer {
    /*background:#383838;*/
    background-color: #404040;
    padding-top:15px;
    padding-bottom:0px;
}
.link-list a {
    padding: 0;
    font-size: 11pt;
}

@media print {
    .no-print {
        display:none;
    }
}
/* prevent dialogs and modals from messing with page width */

.modal-open {
    overflow: scroll;
    padding-right:0px;
}
/* override bootstrap and bootstrap dialog close class and button*/
.close {
    font-weight: normal;
    line-height: inherit;
    color: #404040;
    text-shadow: none;
}
.close:focus, .close:hover {
    color: white;
}
.modal-header .close {
    margin-top: 0;
}
.modal-footer {
    padding: 0 10pt 10pt
}
/*Fancy font for headings*/
h1, h2, h3, h4, h5, h6 {
    font-family: vc-bold, sans-serif;
    font-weight: normal !important;
    color: #33659f;
}

h1 { font-size: 24pt; }
h2 { font-size: 22pt; }
h3 { font-size: 20pt; }
h4 { font-size: 16pt; }

/* change the underline of headlines to VP-logo orange */
.headline div,
.headline h2, 
.headline h3, 
.headline h4 {
    border-bottom: 2px solid #ff9900;
    padding-bottom: 0px;
    margin-top:25px;
}

.headline h2 { 
     font-size: 24pt;
     margin-left: 8px;
}

/* TOP OF PAGE heading adjustments*/
/*Move the logo up to line up better with Top Nav Menu*/
#logo-header {
	/*margin-top:-33pt;*/
    /* z-index: 999999; */
    /* margin-top: -20pt;
    margin-left: 4pt; */
}

/*Change the header and navbar*/
.header {
	position: relative;
	border-bottom: 0px;
	/*background: #FFFAEA;
    background-color: #263c56;
    background-color: #3a75b8;*/
    background-color: #004465;
}
#navbar {
    border:none;
    /*background-color: #d0f0ff;
    background-color: #263c56;*/
    background-color: #3a75b8;
    /*background-color: #004465;*/
    border-radius: 0;
    box-shadow: rgb(0 0 0 / 70%) 0 0 15px 0;
    padding: 6pt 0;
}
.nav-item > a {
    color:white !important;
    padding: 9px 10pt 6px !important;
    font-family: vc-light, sans-serif;
}
.nav-item a:hover {
    border-bottom: 2pt solid white !important;
}
.loginbar {
    display: inline-block;
    margin-right: 10pt;
    list-style: none;
    font-size: 9.5pt;
    text-transform: uppercase;
}
.loginbar > li > a {
    color:white!important;
}
.loginbar > li > a:hover {
    border-bottom: 1px solid white!important;
}

#buy-now-btn, #buy-now-btn-xs, #support-btn {
    color:white;
    cursor:pointer;
    background-color: #ff9900;
    font-family: vc-regular, sans-serif;
    text-shadow: 1px 1px 2px black;
    /*background-color:#3a75b8;
    text-shadow: 2pt 2pt 1pt #000000;*/
}
#buy-now-btn {
    font-size:.82em;
    padding:4pt;
    margin: 0 4pt 0 6pt;
    border-radius: 20px;
    display:inline-block;
    /*position: absolute;
    top:0;
    right:0;
    z-index:100;*/
}
#buy-now-cart {
     font-size:1.4em;
}
#buy-now-text::after {
    content: "BUY NOW ";
}
#buy-now-btn-xs {
    padding: 2px 4px 2px 6px;
    position: absolute;
    z-index: 100;
    right: 70px;
    top: -40px;
    /* top: -86px;  with top banner */
    font-size:1em;
    border-radius: 18px;
    display: none;
    text-shadow: none;
}
#support-btn {
    padding:4pt 8pt;
    position:fixed;
    z-index:100;
    bottom:5pt;
    font-size:.9em;
    vertical-align:text-top;
    border-radius: 22px;
    display:inline-block;
}

/*Change top Navbar - modifies header1.css*/
.header .navbar-default .navbar-nav > li > a {
    color: white;
    /*font-size: 12pt;*/
    padding: 8pt 12pt;
    /*letter-spacing:1.1pt;*/
    font-family: vc-light, sans-serif;
    font-weight: normal;
    text-transform: none;
    background-color: #004465;

}
#navbar-nav {
    font-size: 1rem;
    letter-spacing: .5pt;
}
/*Change top Navbar - modifies header1.css*/
.header .navbar-default .navbar-nav > li > a:hover {
    color: white;
    font-size: 12pt;
    padding: 8pt 12pt;
    letter-spacing:1.1pt;
    border-bottom: 4px solid white;
    font-family: vc-light, sans-serif;
    font-weight: bold;
    text-transform: none;
}
#main-img {
    margin: auto;
}

.navbar {
    margin-bottom:-5px;
}

/*fix-up stuff on current home page*/
.service .desc h4 {
    font-size: 24px;
}

.service {
    padding-bottom: 0px;
}

.thumbnail-style h3 {
    font-size:20px;
}

.padding-15 {
    padding-left:15px;
    padding-right:15px;
}

.padding-30{
    padding-left:30px;
    padding-right:30px;
}

.input-bg {
    background-color: #F4F4F4;
    padding-left:6px;
}
a:hover {
    color:#ff9900;
}
.extra-menu {display:none!important}
#extra-top-links { 
    flex-basis: 60%;
    text-align: end;
    font-size: .8em;
    color: white;
    display: none;
}
.navbar-toggler {
    margin-left: 0;
}
#top-banner {
    text-align: center;
    /*background-color: #b11e31;  holiday color */
    background-color: #008000; /* green */
    display: inline-block;
    width: 100%;
    padding: 11pt 0 10pt;
    color: white;
    position: fixed;
    font-size: 1.2rem;
    top: 84px;
}
#top-banner span {
    font-size: 1.05rem;
}
#top-banner img {
    height: 2.7rem;
}
#top-banner-button1, #top-banner-button2 {
    font-size: .7em;
    border: 1px solid white;
    padding: 0 4pt;
    background: white;
    border-radius: 4pt;
    color: black;
    margin: 0 5pt 0 3pt;
    cursor:pointer;
}
#top-banner-text2, #top-banner-button2 {
    display: none;
}
#vc-content {
    margin-top: 84px;
    /* margin-top: 138px; with top-banner */
}
@media (max-width: 991px) {
    #vc-content {
       margin-top: 61px;
    }
    #logo-header {
        width:180px;
        margin-top: -8pt;
        margin-left: 0;
    }
    .extra-menu {
        display:inline!important;
    }
    .navbar-expand-lg .navbar-collapse {
        background-color: #3a75b8;
    }
    .navbar-expand-lg .navbar-nav .nav-item {
        margin-bottom: 0.5rem;
        padding-bottom: 4pt;
        border-bottom: 1px solid white !important;
    }
    #navbar-nav > li:first-child {
        border-top: 1px solid white;
        padding-top: 4pt;
        margin-top: 5pt
    }
    #loginbar-div {
        display: none;
    }
    #extra-top-links {
        display:block;
    }
}
@media (max-width: 896px) { /* for both tablet: portrait and phone:portrait */
    #vc-content {
        margin-top: 55px;
        /* margin-top: 98px;  with top-banner */
    }
    #top-banner {
        padding: 7pt 0 5pt;
        top: 61px;
    }
}
@media (max-width: 480px) { /* phone: portrait */
    .members-nav {
        display:none!important;
    }
    #logo-header {
        width: 170px;
        margin-top:-4pt;
    }
    .topbar {
        display:none;
    }
    .header-sticky {
        position: fixed!important;
        width: 100%!important;
    }
    .navbar-header {
        margin-right: -6pt!important;
    }
    #buy-now-btn-xs {
        display: inline-block;
    }
    #extra-top-links {
        display:none;
    }
    /*#top-banner-text1, #top-banner-text2 {
        display: none;
    }
    #top-text2, #top-button2 {
        display: inline;
    }*/
}
.btn-primary {
    color: #fff;
    background-color: #337ab7;
    border-color: #2e6da4;
    font-weight: normal;
}
.btn-primary:hover {
    color: #fff;
    background-color: #286090;
    border-color: #204d74;
}
.vc-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    padding: 20pt 20pt;
    margin: 10pt 0;
}
.vc-row .home-buttons {
    font-size: 1.0rem;
    letter-spacing: 1px;
}
.vc-row a {
    color: white;
}
.vc-row h2 {
    margin: 10pt 0 10pt;
}

#cookie-container {
    display: none;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    z-index: 999;
    position: fixed;
    left: 0;
    width: 100vw;
    background: #606060;
    color: #f5f6fa;
    padding: 6px 25px;
    /*box-shadow: 0 -2px 16px #000000;*/
    transition: 300ms;
     font-size: .92em;
}

#cookie-container.active {
    display: flex;
    bottom: 0;
}
#cookie-msg {
    float: left;
    margin: 10px 0;
    color: white;
}
#cookie-msg a, #cookie-msg a:visited {
    /*color: #f5f6fa;*/
    color: #ffffff;
}
#cookie-btn {
    background: #0ABF53;
    border: 0;
    color: #f5f6fa;
    padding: 6px 24px;
    border-radius: 8px;
    cursor: pointer;
    margin-left: 20px;
}
@media (max-width: 480px) { /* phone: portrait */
    #cookie-container {
        flex-wrap: wrap;
    }
    #cookie-btn {
        margin-left: 0;
        margin-bottom: 10px;
    }
}