/*===============
    CONTENT (SMALL TO EXTRA LARGE DEVICE)
===============
1. SUB HEADER
2. JUMBOTRON
3. HOME PAGE
4. ABOUT US PAGE
5. FAQ PAGE
6. OUR SERVICE PAGE
7. APPLYNOW PAGE
8. CONTACT PAGE
9. PRIVACY POLICY AND TERMS CONDITION PAGE
10. BILLPAY
11. RESPONSIVE
    * MAX 425
        * home page
        * jumbotron
        * about us page
        * service page
        * contact us page
    * MIN 426
        * jumbotron
        * billpay
    * MAX 575
        * global
        * about us page
    * MIIN 576
        * global
        * jumbotron
    * MIN 767
        * jumbotron
    * MIN 990
        * jumbotron
    * MAX 991
        * about us page
    * MIN 1024
        * jumbotron
*/




/*===============
    1. SUB HAEDER
===============*/
.static .home-about-us-title {
    background-color: #F1F0F1;
    line-height: 3;
    font-weight: 600;
    position: relative;
}

.static .home-about-us-title span {
    display: block;
    margin: 0 auto;
    font-size: 1.4rem;
}

.static .home-about-us-title i {
    position: absolute;
    top: 31%;
    left: 17.5px;
    font-size: 2rem;
}

.subheader-small h5{
    margin: 0 auto;
    font-size: 1.4rem;
    font-weight: 600;
    background: #ffffff;
    display: inline-block;
    border-radius: 0 40px 40px 0;
    padding: 30px;
    color: #e91e63;
}

.subheader-small h5.new-bill{
    border-radius: 40px 0 0 40px;
    float: right;
}




/*================
    2. JUMBOTRON
=================*/
.static .text-jumbotron,
.landing .text-jumbotron {
    padding-top: 8%;
    padding-bottom: 8%;
    overflow: hidden;
}

.static .text-jumbotron h2,
.landing .text-jumbotron h2 {
    font-size: 12rem;
    font-weight: 700;
}

.static .text-jumbotron h3,
.landing .text-jumbotron h3 {
    font-size: 9rem;
    font-weight: 700;
}

.static .text-jumbotron .row:first-child h2,
.landing .text-jumbotron .col-md-11:first-child h2 {
    color: #333333;
}

.static .text-jumbotron .row:nth-child(2) h2,
.landing .text-jumbotron .col-md-11:nth-child(2) h2 {
    color: #E91E63;
}





/*===================
    3. HOME PAHE
====================*/
.landing .text-jumbotron h2 {
    font-size: 3.5rem;
}

.landing .text-jumbotron h3 {
    font-size: 2rem;
}

/* scroll navigation arrow, delete in new design
.navigation-arrow div {
    font-size: 20px;
    color: #fff;
    border: 2px solid #fff;
    height: 50px;
    width: 25px;
    border-radius: 15px;
    line-height: 50px;
    cursor: pointer;
}

.navigation-arrow i {
    transform: translateY(-5px);
    -webkit-animation: jump 1s forwards infinite;
            animation: jump 1s forwards infinite;
}

@-webkit-keyframes jump {
    100% {
        transform: translateY(5px);
        opacity: 0;
    }
}

@keyframes jump {
    100% {
        transform: translateY(5px);
        opacity: 0;
    }
}
*/





/*================
    4. ABOUT US PAGE
=================*/
.static .container-team {
    background-color: #ffffff;
}

.static .text-about-us {
    background-color: #e91e63;
    color: #fff;
    padding-top: 4%;
    padding-bottom: 4%;
    overflow: hidden;
}

.static .about-us-title-text {
    font-weight: 600;
}

.static .container-team .container-team-block {
    padding: 3%;
}

.static .container-team .container-team-block .col-sm-6 {
    margin-bottom: 3rem;
}

.static .container-team .container-team-block h4 {
    color: #333333;
    font-weight: 600;
}

.static .container-team .container-team-block .card {
    padding: 5%;
    border-radius: 5px;
    height: 100%;
    box-shadow: 0 0 0 rgba(0, 0, 0, 1);
    transition: 1s all;
}

.static .container-team .container-team-block .card:hover {
    box-shadow: 0 0 12px rgba(0, 0, 0, 0);
}

.static .card-img-top img {
    border-radius: 50%;
    margin-left: 10%;
    margin-top: 10%;
    border: none;
    box-shadow: 0 0 27px -14px #000;
    height: 160px;
    width: 160px;
}

.static .card-img-top .social {
    margin-top: 40%;
}

.static .card-img-top .social span {
    float: right;
    margin-bottom: 5%;
}

.static .card-img-top .social .fab {
    font-size: 2rem;
}

.static .card-img-top .social .fa-facebook-f {
    color: #3c5a9a;
}

.static .card-img-top .social .fa-linkedin-in {
    color: #2389b3;
}

.static .card-img-top .social .fa-twitter {
    color: #00bcf5;
}

.static .card-img-top .social .fab:hover {
    transform: scale(1.3);
    transition: .5s all;
}

.static .name-block {
    padding: 10% 4%;
}

.static .designation-border {
    border-top: 2px solid #e91e63;
    width: 50%;
}

.static .name-text {
    font-weight: 700;
    color: #333333;
    display: inline-block;
}

.static .designation-text {
    color: #e91e63;
    font-weight: 600;
    display: inline-block;
}





/*===================
    5. OUR SERVICE PAGE
=====================*/
.static #services .contact_box {
    word-wrap: anywhere;
    padding: 30px 10px;
    box-shadow: 0 .8rem 1rem -.5rem #000 !important;
    /*    height:29em;*/
}

.static #services .col-md-4:nth-child(1n) .contact_box {
    background-color: #e91e63;
}

.static #services .col-md-4:nth-child(2n) .contact_box {
    background-color: #f44336;
}

.static #services .col-md-4:nth-child(3n) .contact_box {
    background-color: #4caf50;
}

.static #services .col-md-4:nth-child(4n) .contact_box {
    background-color: #673ab7;
}

.static #services .col-md-4:nth-child(5n) .contact_box {
    background-color: #ffc107;
}

.static #services .col-md-4:nth-child(6n) .contact_box {
    background-color: #3f51b5;
}

.static #services .contact_box::before {
    content: "";
    width: 0px;
    height: 0px;
    background-color: #ddd;
    position: absolute;
    top: 0;
    left: 15px;
    z-index: 1000;
    border-radius: 4px;
}

.static #services .contact_box:hover::before {
    -webkit-animation: 1s leftright forwards;
    animation: 1s leftright forwards;
}

@-webkit-keyframes leftright {
    100% {
        width: 100%;
        height: 100%;
        opacity: 0;
    }
}

@keyframes leftright {
    100% {
        width: 100%;
        height: 100%;
        opacity: 0;
    }
}

.static #services .contact_box::after {
    content: "";
    width: 0;
    height: 0;
    background-color: #ddd;
    position: absolute;
    bottom: 0;
    right: 15px;
    z-index: 1000;
    border-radius: 4px;
}

#services .contact_box:hover::after {
    -webkit-animation: 1s rightleft forwards;
    animation: 1s rightleft forwards;
}

@-webkit-keyframes rightleft {
    100% {
        width: 100%;
        height: 100%;
        opacity: 0;
    }
}

@keyframes rightleft {
    100% {
        width: 100%;
        height: 100%;
        opacity: 0;
    }
}

.static #services .contact_box p {
    line-height: 20px;
    padding-top: 10px;
    margin-bottom: 0 !important;
}

.static #services .contact_box h5 {
    font-size: 2.2rem;
}

.static #services .contact_box .fa {
    font-size: 50px;
    word-wrap: anywhere;
    border-radius: 50%;
    padding: 20px;
    height: 90px;
    width: 90px;
}

.static #services .contact_box p {
    font-size: 12px;
}





/*====================
    6. APPLYNOW PAGE
====================*/
.static .applynow .border.rounded {
    border-color: #ffc107 !important;
}





/*====================
    7. FAQ PAGE
====================*/
.static .btn-group .btn {
    border: none !important;
    border-radius: 0px;
    min-width: auto !important;
}

.static .btn-group .btn:active,
.static .btn-group .btn.active,
.static .btn-group .btn:focus,
.static .btn-group .btn:visited,
.static .btn-group .btn:hover {
    background-color: #3f51b5 !important;
    color: #fff !important;
    box-shadow: 0px 10px 5px -5px #999 !important;
}

.static .btn-group > .btn:not(:last-child) {
    margin-right: 0rem;
}

.static .btn-group > .btn:not(:first-child) {
    margin-left: 0px;
}

.static .all-qna a {
    color: #e91e63;
}

.static .all-qna .question-title,
.static .all-qna .answer-title {
    border-left: 3px solid #e91e63;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: 1rem 0;
    background: #f8f9fa;
}

.static .all-qna .answer-title {
    background: #ffffff;
    align-items: flex-start;
    border-left: 3px solid #3f51b5;
    padding-right: 3rem;
}

.static .all-qna .question-title > h2,
.static .all-qna .answer-title > h2 {
    display: inline-block;
    color: #e91e63;
    padding: 0 1rem;
}

.static .all-qna .answer-title > h2 {
    color: #3f51b5;
}

.static .all-qna .question-title > span,
.static .all-qna .answer-title > span,
.static .all-qna .answer-title > div {
    /*    text-align: justify;*/
    padding: 0 1rem;
}

.static .all-qna .question-title > span {
    font-weight: bold;
}

.static .all-qna .answer-title > div {
    display: flex;
    flex-direction: column;
}

.static .all-qna .answer-title > span ul {
    list-style: decimal;
    list-style-position: inside;
}





/*====================
    8. CONTACT PAGE
====================*/
.static .contacts h4 span {
    font-size: 3rem;
}

.static .contact_box {
    word-wrap: anywhere;
    padding: 10px;
    height: 100%;
}

.static .contact_box .fa {
    font-size: 50px;
    word-wrap: anywhere;
}

.static .contact_box p {
    font-size: 12px;
}





/*====================
    9. PRIVACY POLICY AND TERMS CONDITION PAGE
====================*/
.static.privacy_page p,
.static.tnc_page p{
    text-align: justify;
    font-size: 17px;
}

.static.privacy_page ul,
.static.tnc_page ul{
    text-align: justify;
    font-size: 17px;
    color: #6633CC;
}

.static.privacy_page h5,
.static.tnc_page h5{
    color: #e91e63;
}





/*====================
    10. BILLPAY
====================*/
.bbps_logo{
    position: absolute;
    top: 10px;
    right: 10px;
}

.bbps_logo.small{
    position: absolute;
    top: 0;
    right: 0;
}

.bbps_logo.assured{
    top: 50%;
}

.bbps_logo img{
    width: 50px;
}

.bbps_logo.small img{
    width: 100px;
}




/*====================
    11. RESPONSIVE
====================*/
@media screen and (max-width:425px) {
    /* homepage */
    .subheader-small h5{
        padding: 15px;
    }
    
    
    /* jumbotron */
    .static .text-jumbotron {
        padding-top: 20%;
        padding-bottom: 20%;
    }

    .static .text-jumbotron h2 {
        font-size: 4rem;
    }


    /* about page */
    .static .about-us-title-text {
        font-size: 2.5rem;
    }

    .static .name-block {
        padding: 8%;
    }

    /* service page */
    .static .heading {
        font-size: 3rem;
    }


    /* contact page */
    .static .contacts h4,
    .static .contacts h4 span,
    #why_pp h3{
        font-size: 2.5rem;
    }
}

@media screen and (min-width:426px) {

    /* jumbotron */
    .static .text-jumbotron h2 {
        font-size: 5rem;
    }

    /*billpay*/
    .bbps_logo{
        position: absolute;
        top: 60px;
        right: 60px;
    }
    .bbps_logo.small{
        top: 0;
        right: 0;
    }
    .bbps_logo.assured{
        top: 50%;
        right: 30px;
    }
    .bbps_logo img{
        width: 100px;
    }
}


@media screen and (max-width:575px) {

    /* global */
    .static p {
        font-size: 1.7rem;
    }

    .static span {
        font-size: 1.8rem;
    }


    /* about page */
    .static .container-fluid.text-about-us {
        padding-top: 7%;
        padding-bottom: 7%;
    }

    .static .container-team .container-team-block {
        padding-top: 10% !important;
    }

    .static .container-team .container-team-block .col-sm-6 {
        padding: 0;
    }

    .static .container-team .container-team-block .col-sm-6:nth-child(even) .card {
        background-color: #f0f0f0;
        transform: scaleX(-1);
    }

    .static .container-team .container-team-block .col-sm-6 .fab,
    .static .container-team .container-team-block .col-sm-6 .name-text,
    .static .container-team .container-team-block .col-sm-6 .designation-text,
    .static .container-team .container-team-block .col-sm-6 .card-text {
        font-size: 1.6rem;
    }

    .static .container-team .container-team-block .col-sm-6:nth-child(even) .fab,
    .static .container-team .container-team-block .col-sm-6:nth-child(even) .name-text,
    .static .container-team .container-team-block .col-sm-6:nth-child(even) .designation-text,
    .static .container-team .container-team-block .col-sm-6:nth-child(even) .card-text {
        transform: scaleX(-1);
    }
}

@media screen and (min-width:576px) {

    /* global */
    .static p,
    .static span {
        font-size: 1.5rem;
    }


    /* jumbotron */
    .static .text-jumbotron h2 {
        font-size: 7rem;
    }
}

@media screen and (min-width:768px) {

    /* jumbotron */
    .static .text-jumbotron h2 {
        font-size: 9rem;
    }
    
    
    /* billpay */
    .bbps_logo.mobile{
        display: none;
    }
    .bbps_logo{
        display: block;
    }
}

@media screen and (min-width:990px) {

    /* jumbotron */
    .static .text-jumbotron h2 {
        font-size: 10rem;
    }
}

@media screen and (max-width: 991px) {

    /* about us */
    .static .card-img-top .social {
        margin-top: 30%;
    }
}

@media screen and (min-width:1024px) {

    /* jumbotron */
    .static .text-jumbotron h2 {
        font-size: 11rem;
    }
}