@font-face {
    font-family: "SharpSansDisplayNo1";
    src: url("/fonts/SharpSansDispNo1-Medium.eot") format('embedded-opentype'), url("/fonts/SharpSansDispNo1-Medium.woff2") format("woff2"), url("/fonts/SharpSansDispNo1-Medium.woff") format("woff");
    font-weight: normal;
}

@font-face {
    font-family: "SharpSansDisplayNo1";
    src: url("/fonts/SharpSansDispNo1-Semibold.eot") format('embedded-opentype'), url("/fonts/SharpSansDispNo1-Semibold.woff2") format("woff2"), url("/fonts/SharpSansDispNo1-Semibold.woff") format("woff");
    font-weight: bold;
}

@font-face {
    font-family: "SharpSansDisplayNo2";
    src: url("/fonts/SharpSansDispNo2-Medium.eot") format('embedded-opentype'), url("/fonts/SharpSansDispNo2-Medium.woff2") format("woff2"), url("/fonts/SharpSansDispNo2-Medium.woff") format("woff");
    font-weight: normal;
}

@font-face {
    font-family: "SharpSansDisplayNo2";
    src: url("/fonts/SharpSansDispNo2-Semibold.eot") format('embedded-opentype'), url("/fonts/SharpSansDispNo2-Semibold.woff2") format("woff2"), url("/fonts/SharpSansDispNo2-Semibold.woff") format("woff");
    font-weight: bold;
}

@font-face {
    font-family: "DMSans";
    src: url("/fonts/DMSans-Bold.ttf") format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: "DMSans";
    src: url("/fonts/DMSans-Regular.ttf") format('truetype');
    font-weight: normal;
    font-style: normal;
}

html, body {
    font-family: 'SharpSansDisplayNo1', sans-serif,'Times New Roman';
     font-size:21px; /*16 point conversion*/
    color: #00386B !important;
    padding: 0px;
    margin: 0px;
}

html {
     /*-ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;*/
        width: 100vw;
        /*width:100vw;*/

       overflow:auto;
}

body {
    width: 100vw;
    
       overflow-x:hidden;
       max-width:100vw;
}

 
 
.header {
    background-image: url('../images/spa/Condensed Header Pic.png') !important;
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position: top;
   padding-bottom: 225px;
}
 
.tva-blue {
    color: #00386B;
}

.headertext {
    padding: 47px;  
}
.headertext-medium{
    font-size:26px;
    color:#fff;
}
.header-bottom-row{
    padding-bottom:30px;
}
.ppntitle{
    font-size:48px;
}
nav {
    margin-right: 47px;
}

.navbar {
    border: none !important;
}

.navbar-brand {
    margin-left: -1.5rem;
}
 

.spa-container {
    
    margin-left: 51px;
    margin-right: 51px;
}


.spa-contentholder {
   
    margin-left: 96px;
    margin-right: 96px;
}

    .spa-contentholder > hr {
        border-top: solid 15px #C6DAE7;
        margin-bottom: 71px;
        margin-top: 71px;
        border-radius: 10px;
    }

.boxwrapper {
    min-width: 420px;
    /*width:624px;*/
    max-width:624px;
    padding-right:121px;
    padding-left:0px;
}

.spa-box-container {
    min-width: 335px;
    max-width: 650px;
    border: 5px solid #0072CE;
}

.spa-box-container-title {
   font-size:28px;
   font-weight: bold;
}

.spa-box-container-description {
    min-height: 160px;
    font-size:16px;
}

.partner-box {
    background-color: #C6DAE7;
    padding-top: 29px;
    /*height: 450px;*/
    /*margin-right: 10%;*/
    max-width: 346px;
     min-width: 200px;
    padding-bottom:26px;
}

    .partner-box > .quote {
        /*margin: 10px;*/
        height: 220px;
        margin-left: auto;
        margin-right: auto;
        max-width: 254px;
        font-size:16px;
    }

    .partner-box > .icon {
        height: 150px;
        text-align: center;
        margin-top: 17px;
        margin-bottom: 12px;
    }

    .partner-box > .name {
        text-align: center;
        vertical-align: bottom;
        margin-bottom: 26px;
        font-size:12px;
    }

.whybecomeppn {
    /*max-width: 1500px;
    padding-left: 200px;
    padding-bottom: 120px;*/
    max-width: 588px;
    padding-bottom:87px;
}

.whybecomeppn-row {
    margin-left: -5rem;
    padding-top:149px;
}

.whybecomeppn-desc-container {
    margin-top: 80px;
    margin-right: 90px;
}

.whybecomeppn-title {
    margin-top: 20px;
    font-weight: bold;
    font-size:24px;
    padding-top:28px;
    padding-bottom:20px;
}

.whybecomeppn-desc {
    margin-top: 15px;
    font-family: DMSans;
    font-size:20px;
}

.joinus {
    background-image: url('../images/spa/Join Us - Background Image-01.png');
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: center;
    padding-top: 120px;
    padding-bottom: 107px;
}

.joinus-container {
    /*max-width: 1000px;*/
    margin-left: 90px;
}
.joinus-container .title{
    font-size:52px;
    padding-bottom:40px;
}
.joinus-container .content{
    font-size:32px;
    padding-bottom:53px;
}
.downloadapp {
    font-size: 24pt !important;
    margin-top: 30px;
     
 }

.requirements {
    text-align: center;
}
.requirements ,details {
   font-size:22px;
}
.requirementlistcontainer {
    max-width:200px;
    min-width:fit-content;
    padding-top:36px;
    padding-bottom:42px;
}

ul.requirementlist {
    margin-left: 30px;
    font-weight: normal;
}

    ul.requirementlist li {
        float: left;
        margin-right: 23px;
        list-style: none;
        counter-increment: list;
        display: inline;
    }

        ul.requirementlist li:before {
            content: counter(list, disc);
            padding-right: 5px;
        }

.btn-primary {
    background-color: #0072CE;
    border-color: #0072CE;
}

.btn-tvag {
    color: #fff;
    background-color: #55A51C;
    border-color: #55A51C;
    padding: 8px 20px;
    font-size:21.33px;
}

.btn-tvag-small{
    font-size:18px;
}
    .btn-tvag.focus, .btn-tvag:focus {
        color: #fff;
        background-color: #449d44;
        border-color: #255625;
    }

    .btn-tvag:hover {
        color: #fff;
        background-color: #449d44;
        border-color: #398439;
    }

    .btn-tvag.active, .btn-tvag:active, .open > .dropdown-toggle.btn-tvag {
        color: #fff;
        background-color: #449d44;
        border-color: #398439;
    }

        .btn-tvag.active.focus, .btn-tvag.active:focus, .btn-tvag.active:hover, .btn-tvag:active.focus, .btn-tvag:active:focus, .btn-tvag:active:hover, .open > .dropdown-toggle.btn-tvag.focus, .open > .dropdown-toggle.btn-tvag:focus, .open > .dropdown-toggle.btn-tvag:hover {
            color: #fff;
            background-color: #398439;
            border-color: #255625;
        }

    .btn-tvag.active, .btn-tvag:active, .open > .dropdown-toggle.btn-tvag {
        background-image: none;
    }

    .btn-tvag.disabled.focus, .btn-tvag.disabled:focus, .btn-tvag.disabled:hover, .btn-tvag[disabled].focus, .btn-tvag[disabled]:focus, .btn-tvag[disabled]:hover, fieldset[disabled] .btn-tvag.focus, fieldset[disabled] .btn-tvag:focus, fieldset[disabled] .btn-tvag:hover {
        background-color: #55A51C;
        border-color: #4cae4c;
    }

    .btn-tvag .badge {
        color: #55A51C;
        background-color: #fff;
    }

.btn-tvag {
    border-radius: 5px;
}
/*.login {
  position: absolute;
  top: 0;
  right: 15px; }*/
.login > a {
    background: #3f426f;
    color: #fff;
    /*font-size: 15px;*/
    font-weight: 500;
    /*padding: 6px 16px;*/
}

    .login > a:hover, .login > a:focus {
        color: #bababa;
    }

/* 
  ##Device = Desktops
  ##Screen = 1281px to higher resolution desktops
*/

@media (min-width: 1281px) {

    /* CSS */
    .nav-buttons {
        padding-right: 40px;
    }
     .boxwrapper {
        padding-bottom: 30px;
    }
    /*.requirementlistcontainer {
        margin-left: 0px !important;
    }*/
}

/* 
  ##Device = Laptops, Desktops
  ##Screen = B/w 1280px to 1904px
*/
@media (min-width:1280px) and (max-width: 1450px) {
    body {
    }
    /* CSS */
    .spa-box-container-description {
        height: 150px;
    }
    .spa-box-container-title{
        height:105px;
    }
    /*.requirementlistcontainer {
        margin-left: 0px;
    }*/
}
/* 
  ##Device = Laptops, Desktops
  ##Screen = B/w 1025px to 1280px
*/
@media (min-width: 1025px) and (max-width: 1280px) {

    /* CSS */
    .nav-buttons {
        padding-right: 40px;
    }
     .whybecomeppn-row {
        margin-left: 0;
    }

       .spa-box-container-title{
        height:105px;
    }
    /*.requirementlistcontainer {
        margin-left: 0px !important;
    }*/
}


@media (min-width: 768px) and (max-width: 1424px){
    /*.ppntitle {
        width: 900px !important;
    }*/

    .header {
        background-size: 100% 90%;
    }
    /*.partner-box{
        margin-right:8%;
    }*/
 
}
@media(min-width:768px){
    .boxwrapper{
     padding-bottom:20px;
 }  
}

/* 
  ##Device = Tablets, Ipads (portrait)
  ##Screen = B/w 768px to 1024px
*/
@media (min-width: 768px) and (max-width: 1024px) {

    /* CSS */
    /*.header {
        background-size: 100% 100%;
    }*/

    .nav-buttons {
        padding-right: 40px;
    }

    /*.partner-box{
        margin-right:5%;
    }*/

    /*.requirementlistcontainer {
        margin-left: 0px !important;
    }*/

    .partner-box {
        height: auto;
        margin-bottom: 30px;
        /*margin-right:0px;*/
    }

        .partner-box > .quote {
            height: auto;
        }

    .boxwrapper {
        padding-bottom: 30px;
    }
}

/* 
  ##Device = Tablets, Ipads (landscape)
  ##Screen = B/w 768px to 1024px
*/

@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {

    /* CSS */

}
/* 
  ##Device = Low Resolution Tablets, Mobiles (Landscape)
  ##Screen = B/w 481px to 767px
*/

@media (min-width: 481px) and (max-width: 767px) {

    /* CSS */
    /*.header {
        background-size: 100% 100% !important;
    }*/
}

/* 
  ##Device = Most of the Smartphones Mobiles (Portrait)
  ##Screen = B/w 320px to 479px
*/
@media (min-width: 320px) and (max-width: 500px)and (-webkit-min-device-pixel-ratio: 1) {
    body {
        width: 95vw;
    }

    /*.header {
        background-size: 100% 100%;
    }*/
    /* CSS */
    .login {
        margin-top: 60px;
        padding-left: 90px;
    }

    .headertext {
        margin-left: 10px;
        width: 90vw;
    }

    .collapsemenu {
        margin-left: 90px;
    }

    /*.requirementlistcontainer {
        margin-left: 100px !important;
    }*/

    .collapse.show {
        margin-left: 90px;
    }

    .boxwrapper {
        padding-bottom: 30px;
    }

    .partner-box {
        height: auto;
        margin-bottom: 30px;
        margin-right: 0px;
    }

        .partner-box > .quote {
            height: auto;
        }

    .joinus-container {
        margin-left: 0px;
    }

    .whybecomeppn-row {
        margin-left: inherit;
    }
}

@media (min-width: 320px) and (max-width: 480px) {

    /* CSS */

    .login {
        margin-top: 60px;
        padding-left: 90px;
    }

    /*.header {
        background-size: 100% 100%;
    }*/

    .collapsemenu {
        margin-left: 90px;
    }

    /*.requirementlistcontainer {
        margin-left: 100px !important;
    }*/

    .collapse.show {
        margin-left: 90px;
    }
}

/*-------------footer------------*/
footer {
    padding: 2rem 0;
    background: #002855;
    color: rgba(255,255,255,.8);
    line-height: 1.5;
}

    footer ul {
        list-style-type: none;
        padding: 0;
        line-height: 1.5;
    }

        footer ul li {
            margin: .5rem 0;
        }

            footer ul li a {
                color: #FFFFFF;
            }

a {
    color: #64a70b;
    text-decoration: none;
    background-color: transparent;
}

footer ul.social {
    margin-top: 0;
    margin-bottom: 1.5rem;
    line-height: 2;
}

    footer ul.social li {
        display: inline;
        padding-right: 1.15rem;
        line-height: 2.85;
    }

        footer ul.social li img {
            height: 1.5rem;
            width: auto;
            display: inline-block;
        }