.ic img{

    position: absolute;

    margin-top: -80px;

    margin-left: 25px;

}





.card-bodytex .ic{

    margin: 0 auto;

}



.card {

    width: 125px;

    border-radius: .50rem;

    float: left;

    margin-right: 32px;

}

.card-bodytex{

    height: 228px;

    padding: 20px 20px 0px 20px;

    text-align: center;

    background-color: #e1e1e1;

}

.card-bodytex p{

    margin-bottom: 0px;

}

.card-header1 {

    border-top-left-radius: .50rem;

    border-top-right-radius: .50rem;

    padding: .75rem 1.25rem;

    margin-bottom: 0;

    border-bottom: 1px solid rgba(0,0,0,.125);

    height: 70px;

    font-size: 30px;

    font-weight: bold;

    text-align: center;

    color: #fff;

}

.D-box:nth-child(1)  .card-header1{

    background-color:#002060;

}

.D-box:nth-child(2)  .card-header1{

    background-color:#00439f;

}

.D-box:nth-child(3)  .card-header1{

    background-color:#055b57;

}

.D-box:nth-child(4)  .card-header1{

    background-color:#57b3cd;

}

.D-box:nth-child(5)  .card-header1{

    background-color:#f0b600;

}

.D-box:nth-child(6)  .card-header1{

    background-color:#fc9d53;

}

.D-box:nth-child(7)  .card-header1{

    background-color:#c65753;

}

.radius-icon{
    /*border-radius: 100%;*/
    /*border: solid 1px #cccccc;*/
    width: 60px;
    height: 60px;
    margin: 0 auto;
}

.img-responsive {
	max-width: 100%;
}
/*  -----------------NAV --------------- */

.tab-content {

    padding: 20px 0 0 0;

    

}

.nav-tabs a.nav-link {

    /*width: 270px;*/
    width:auto;
    font-size: 18px;

    color: #9f9f9f;

}

.nav-tabs .nav-link.active {

    color: #fff;

    background-color: #0c4ca3;

    border-color: transparent;

    border-bottom: 4px solid #0c4ca3 !important;



}



.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover {

    border-color: #ffffff #1d3e5f #dee2e6;

}

.nav-tabs .nav-link {

    border: 1px solid;

    border-color: #ffffff #9f9f9f #ffffff #fcfcfc ;

}

.nav-tabs .nav-link:first-child {

    border: 1px solid;

    border-color: #ffffff #9f9f9f #ffffff #9f9f9f ;



}



/*  ----------------END-NAV --------------- */

/* -------------------2 nav---------------- */

.nav-tabs2 a.nav-link {

    width: 270px;

    font-size: 18px;

    color: #9f9f9f;

}

.nav-tabs2 .nav-link.active {

    color: #fff;

    background-color: #0c4ca3;

    border-color: transparent;

    border-bottom: 4px solid #0c4ca3 !important;



}



.nav-tabs2 .nav-link:focus, .nav-tabs2 .nav-link:hover {

    border-color: #ffffff #1d3e5f #dee2e6;

}

.nav-tabs2 .nav-link {

    border: 1px solid;

    border-color: #ffffff #9f9f9f #ffffff #fcfcfc ;

}

.nav-tabs2 .nav-link:first-child {

    border: 1px solid;

    border-color: #ffffff #9f9f9f #ffffff #9f9f9f ;



}

/* ----------------------END---2 nav---------------- */



.retail-in-bannar{

    position: relative;

    text-align: left;

    color: rgb(39, 7, 7);

}

.retail-in-bannar img{

    width: 100%;

}

.retail-in-bannar span{

    position: absolute;

    top: 38%;

    left: -1%;

    font-size: 20px;

    letter-spacing: 6px;

    font-weight: bold;

    color: #0c4ca3;

}



.retail-in-bannar h3{

    position: absolute;

    top: 47%;

    left: 2%;

    font-size: 40px;

    letter-spacing: 4px;

    color: #000;

}



.retail-in-bannar p{

    margin: 10px auto; 

    width: 85%;

    text-align: center;

}



.nev-pic img{

    width:100%;

}



.left-nev-box{

    width: 40%;

    float: left;

}



.right-nev-box{

    width: 60%;

    float: left;

}





.right-nev-box img {

    width: 100%;



}

.center-nev-box{

    width: 100%;

    float: left;

}





.center-nev-box img{

    width:100%;



}



.p-lon{

    width: 143% !important;

    border-radius: 8px;

    margin-left: 9px;

    height: 25px;

    border-color: #0c4ca3;

}



.sm-saving-typo{

    padding-top: 15%;

    text-align: center;

}

.sm-saving-typo h4{

    margin: 0 auto;

    font-size: 19px;

    margin-bottom: 30px;

    letter-spacing: 4px;

    line-height: 25px;

    color:#21409a;

    width: 74%;

}

.sm-saving-typo h2{

    font-size: 27px;

    letter-spacing: 5px;

    margin-top: 10px;

}

.form-lone{

    margin-left: 4%;

    margin-top: 9%;

}



.form-lone .btn{

    margin-left: 27%; 

}



/*code by tawhid*/



.card_button {

    border: 1px solid #25729a;

    -webkit-border-radius: 3px;

    -moz-border-radius: 3px;

    border-radius: 3px;

    font-size: 12px;

    font-family: arial, helvetica, sans-serif;

    padding: 3px 34px 3px 35px;

    text-decoration: none;

    display: inline-block;

    letter-spacing: 1px;

    font-weight: bold;

    color: #FFFFFF;

    /* background-color: #0147a9; */

    background-image: -webkit-gradient(linear, left top, left bottom, from(#0147a9), to(#002b6b));

    background-image: -webkit-linear-gradient(top, #0147a9, #002b6b);

    background-image: -moz-linear-gradient(top, #0147a9, #002b6b);

    background-image: -ms-linear-gradient(top, #0147a9, #002b6b);

    background-image: -o-linear-gradient(top, #0147a9, #002b6b);

    background-image: linear-gradient(to bottom, #0147a9, #002b6b);

}



.soc_icon{

    position: absolute;

    top: 40%;

    left: 40%;

}



.gcb_icon{

    position: absolute;

    top: 40%;

    left: 40%;

}

.gcb_text{

    position: absolute;

    top: 70%;

    margin-left: 25%;

}



.faq_icon{

    position: absolute;

    top: 40%;

    left: 40%;

}

.faq_text{

    position: absolute;

    top: 70%;

    padding-left: 39%;

}



.head_banner{

    position: absolute;left:-200px

}



.modal-header .close {

    padding: 0.5rem;

    margin: -1rem -0.5rem -1rem auto;

}





/* Smartphones (portrait) ----------- */

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



    .retail-in-bannar span {

        position: absolute;

        top: 11%;

        left: -1%;

        font-size: 12px;

        letter-spacing: 1px;

        font-weight: bold;

        color: #004bb1;

    }



}



/* Smartphones ----------- */

@media only screen and (min-width : 321px) and (max-device-width : 767px) {



    .retail-in-bannar span {

        position: absolute;

        top: 11%;

        left: -1%;

        font-size: 12px;

        letter-spacing: 1px;

        font-weight: bold;

        color: #004bb1;

    }



    .retail-in-bannar h3 {

        position: absolute;

        top: 18%;

        left: 2%;

        font-size: 17px;

        letter-spacing: 3px;

        color: #000;

    }



    .sm-saving-typo h4 {

        margin: -26px auto;

        font-size: 12px;

        margin-bottom: 14px;

        letter-spacing: 1px;

        line-height: 14px;

        color: #21409a;

        width: 91%;

    }



    .sm-saving-typo img {

        width: 22px;

    }



    .sm-saving-typo h2 {

        font-size: 10px;

        letter-spacing: 0px;

        margin-top: 8px;

    }



    .sm-saving-typo2 {

        padding-top: 6%;

        text-align: center;

    }



    .soc_icon {

        position: absolute;

        top: 35%;

        left: 44%;

    }



    .gcb_icon {

        position: absolute;

        top: 35%;

        left: 40%;

    }



    .gcb_text {

        position: absolute;

        top: 60%;

        margin-left: 30%;

    }



    .faq_icon {

        position: absolute;

        top: 29%;

        left: 40%;

    }



    .faq_text {

        position: absolute;

        top: 52%;

        padding-left: 40%;

    }



    .form-lone {

        margin-left: 10%;

        margin-top: 0%;

        width: 30%;

    }

    .form-lone button {

        font-size: 9px;

    }



    .table {

        width: 94%;

    }



    .head_banner{

        position: absolute;left:0px

    }



    .skl-header-video video {

        background-image: url(../img/retail/main_banner.jpg);

        margin-left: 60%;

    }



    .left-nev-box {

        margin-top: 10px;

    }



    .right-nev-box {

        margin-bottom: 10px;

    }



    .center-nev-box {

        margin-bottom: 10px;

    }













}



/* iPads (portrait and landscape) ----------- */

@media only screen and (min-device-width : 768px) and (max-device-width : 991px) {



    .retail-in-bannar span {

        position: absolute;

        top: 26%;

        left: -1%;

        font-size: 23px;

        letter-spacing: 3px;

        font-weight: bold;

        color: #0c4ca3;

    }



    .retail-in-bannar h3 {

        position: absolute;

        top: 40%;

        left: 2%;

        font-size: 40px;

        letter-spacing: 4px;

        color: #000;

    }



    .sm-saving-typo h4 {

        margin: -32px auto;

        font-size: 18px;

        margin-bottom: 14px;

        letter-spacing: 1px;

        line-height: 20px;

        color: #21409a;

        width: 70%;

    }



    .sm-saving-typo h2 {

        font-size: 20px;

        letter-spacing: 5px;

        margin-top: 10px;

    }



    .soc_icon {

        position: absolute;

        top: 21%;

        left: 35%;

    }



    .gcb_icon {

        position: absolute;

        top: 20%;

        left: 34%;

    }



    .gcb_text {

        position: absolute;

        top: 60%;

        margin-left: 10%;

    }



    .faq_icon {

        position: absolute;

        top: 20%;

        left: 35%;

    }



    .faq_text {

        position: absolute;

        top: 60%;

        padding-left: 33%;

    }



    .skl-header-video video {

        background-image: url(../img/retail/main_banner.jpg);

        margin-left: 60%;

    }

}



/* iPads (landscape) ----------- */

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

    /* Styles */

}



/* iPads (portrait) ----------- */

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {

    /* Styles */

}

/**********

iPad 3

**********/

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio : 2) {

    /* Styles */

}



@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio : 2) {

    /* Styles */

}

/* Desktops and laptops ----------- */

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

    /* Styles */

}



/* Large screens ----------- */

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

    /* Styles */

}



/* iPhone 4 ----------- */

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio : 2) {

    /* Styles */

}



@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio : 2) {

    /* Styles */

}