body{
    background-color: white;

    min-height:100%;
    height: auto!important;
}
a {
    color: #031B45;
    font-family: monospace;
}
.red {
    color:red;
}
.bold {
font-weight: bold;
}
#operatorpanel {
    display: none;
}
#index_footer #operatorpanel {
    display: block;
}
.box_container {
    margin: 0 auto;
}
/*-- planning --*/
.plan-top {
    background-color:#ECECEC;
    padding: 2em;
    height: 18em;
}
.w3l h3 {
    color: #ff5f8a;
    font-family: 'Ubuntu', sans-;
    font-size: 2.2em;
}
.w3l p {
    font-size: 1.2em;
    line-height: 1.7em;
    margin: 1em 0;
    color:#6D758A;
}
.w3l {
    padding: 5em 0;
}
.plan-top:hover{
	 background:#FCDFE7;
}
span.glyphicon.glyphicon-edit,span.glyphicon.glyphicon-object-align-right,span.glyphicon.glyphicon-home,span.glyphicon.glyphicon-equalizer,.glyphicon.glyphicon-heart-empty {
    font-size: 3em;
    color: #131A2C;
    margin-bottom: 0.5em;
}
/*-- /planning --*/
.coupons-gd h4 span {
        background: #48cfc1;
    padding: 50px;
    font-size: 50px;
    border-radius: 100%;
    color: #031B45;
}
#homePage.row p{
font-size: 19px;
    font-family: 'Varela Round', sans-serif;
}
.coupons-gd p {
    color: #A9A8A8;
    font-size: 19px;
    text-transform: uppercase;
    font-family: 'Varela Round', sans-serif;
    margin-top: 40px;
}
.coupons-gd h3 {
    color: #031B45;
    font-size: 24px;
    text-transform: uppercase;
    font-family: 'Varela Round', sans-serif;
    line-height: 1.5em;
}
.box_container span.glyphicon {
    font-size: 3em;
    color: #131A2C;
    margin-bottom: 0.5em;
}
.coupons {
    padding: 90px 0 90px 0;
    background: #f8f8f8;
}
.coupons2 {
    padding: 30px 0 120px 0;
    background: #f8f8f8;
}
.coupons3 {
    padding: 160px 0 274px 0px;
    background: #f8f8f8;
}
.always_hidden {
    display: none;
}
.right_align {
    float: right;
    display: inline-block
}
.left_align {
    display: inline-block;
}
.ccLOGO {
    height:100px;
    margin-top: 25px;
}
.ppLOGO {
    margin-top: 25px;
}
.mobileRechargeDv {
    width: 349px;
    float: left;
}
.dthRechargeDv {
    width: 250px;
    float: left;
    margin-left: 30px;
}
.dataCardRechargeDv {
    width: 270px;
    float: left;
    margin-left: 30px;
}
/* start span1_of_3 style1 */
.grid1_of_1{
    border-top: 10px solid #9DCCA0;
    border-bottom: 10px solid #9DCCA0;
    background: #ffffff;
    padding: 20px;
}
.grid1_of_5{
    border-top: 10px solid #9DCCA0;
    background: #ffffff;
    padding: 20px;
}
.grid1_of_2{
    border-top: 10px solid #F79F8B;
    border-bottom: 10px solid #F79F8B;
    background: #ffffff;
    padding: 20px;
}
.grid1_of_3{
    border-bottom: 10px solid #031B45;
    background: #ffffff;
    padding: 20px;
}
.grid1_of_4{
    border-top: 10px solid #FFC476;
    border-bottom: 10px solid #FFC476;
    background: #ffffff;
    padding: 20px;
}
.grid1_of_6{
    border-top: 10px solid #8BD5E0;
    background: #ffffff;
    padding: 20px;
}
.home_container, .coupon_container {
    width: 70%;
    margin: 0 auto;
}
#operatorpanel ul li {
    text-align: left;
}
#operatorpanel h1 {
    font-size: 26px;
}
#homePage > .style1{
    color:green
}
#homePage > .style2{
    color:red
}
#homePage > .style3{
    color:cornflowerblue
}
#homePage > .style4{
    color:orange;
}

/* start h_menu */
.h_menu{
}
.banner_text {
    font-size: 25px;
    color: white;
    font-weight: bold;
}
nav{
    display:block;
}
.menu{
    background: #ffffff;
    display:block;
    text-align:center;
}
.menu li{
    display:inline-block;
    position:relative;
    z-index:100;
    margin-left: -2px;
}
.menu li:first-child{margin-left:0;}
.menu li.color1 a{
    border-bottom: 5px solid #9DCCA0;
}
.menu li.color2 a{
    border-bottom: 5px solid #F79F8B;
}
.menu li.color3 a{
    border-bottom: 5px solid #8BD5E0;
}
.menu li.color4 a{
    border-bottom: 5px solid #FFC476;
}
.menu li.color5 a{
    border-bottom: 5px solid #9DCCA0;
}
.menu li.color6 a{
    border-bottom: 5px solid #F79F8B;
}
.menu li.color7 a{
    border-bottom: 5px solid #8BD5E0;
}
.menu li a{
    text-transform:uppercase;
    text-decoration: none;
    font-size: 16px;
    padding: 20px 10px;
    display: block;
    color: #5d5d5d;
    -webkit-transition: all 0.2s ease-in-out 0s;
    -moz-transition: all 0.2s ease-in-out 0s;
    -o-transition: all 0.2s ease-in-out 0s;
    -ms-transition: all 0.2s ease-in-out 0s;
    transition: all 0.2s ease-in-out 0s;
}
.menu li a:hover,.menu li:hover>a{
    color:#ffffff;
    background: #00D2DF;
}
.menu ul{
    display: none;
    margin: 0;
    padding: 0;
    width: 132px;
    position: absolute;
    top: 42px;
    left: 0px;
    background: #ffffff;
}
.menu ul li{display:block;float:none;background:none;margin:0;padding:0;}
.menu ul li a{
    font-size: 13px;
    font-weight: normal;
    display: block;
    color: #ffffff;
    border-left: 3px solid #C03C35;
    background: #E2534B;
    padding: 10px 20px;
}
.menu ul li a:hover,.menu ul li:hover>a{
    background: #f0f0f0;
    border-left: 3px solid #62A29E;
    color: #797979;
    box-shadow: none;
    border-radius: 0px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    -o-border-radius: 0px;
}
.menu li:hover>ul{display:block;}
.menu ul ul{
    left: 132px;
    top: 0px;
}
.mobile-menu{
    display: none;
    width: 100%;
    padding: 12px;
    color: #ffffff;
    background-color: #ffffff;
    text-transform: uppercase;
    font-size: 16px;
    margin-bottom: 10px;
}
.mobile-menu:hover{background:honeydew;color:#ffffff;text-decoration:none;cursor:pointer}
@media (max-width: 1500px){
}
@media (max-width: 1600px) {
    .eroLOGO {
        height:65px;
    }
    .ppLOGO {
        height: 35px;
    }
    .ccLOGO {
        height: 35px;
    }
    .menu li a {
        border-width: 3px!important;
    }
}
@media (min-width: 768px) and (max-width: 979px) {.mainWrap{width:768px;}.menu ul{top:37px;}

}
@media (max-width: 767px) {
    .menu li a {
        border-width: 2px!important;
    }
    .home_container {
        width: 95%;
        margin: 0 auto;
    }
    .eroLOGO {
        height:65px;
    }
    .ppLOGO {
        height: 35px;
    }
    .ccLOGO {
        height: 35px;
    }
    #header_images {
        display: none;
    }
    .coupons {
        padding: 20px 0 20px 0px
    }
    .coupons-gd h3,.coupons-gd p {
        font-size: 10px;
    }
    .coupons-gd h4 span {
        font-size: 20px;
        padding: 20px;
    }
    .mainWrap{width:auto;padding:50px 20px;}

    .mobile-menu{display:block;margin-top:20px;}
    .menu, #index_footer #operatorpanel {display:none;}

    nav{margin:0;background:none;}
    .menu li{display:block;margin:0;}
    .menu li a{background:#ffffff;color:#797979;border-top:1px solid #e0e0e0;
                                                                   }
    .menu li a:hover,.menu li:hover>a{background:#f0f0f0;color:#797979;
    }
    .menu ul{display:none;position:relative;top:0;left:0;width:100%;}
    .menu ul ul{left:0;}
    .main > div {
        line-height: 38px;
    }
}
 .navbar-toggle {
    border-color: black;
}
.navbar-toggle .icon-bar {
    background: black;
}
@media (max-width: 700px){

}
@media (max-width: 600px){
    .banner_text{
        font-size: 20px;
    }
    .eroLogo {
        height:80px;
    }
    .ppLOGO {
        height: 20px;
        margin-top: 0px;
    }
    .ccLOGO {
        height: 80px;
        margin-top: 0px;
    }

}
@media (max-width: 480px) {

    .banner_text{
        font-size: 16px;
    }
    .eroLOGO {
        height: 40px;
        margin-top: 7px;
    }
    .ccLOGO {
            height: 20px;
        margin-top: 10px;
    }
    .ppLOGO {
        height: 20px;
        margin-top: 8px;
    }

}@media (max-width: 320px) {
    .banner_text{
        font-size: 14px;
    }
}
.sk-spinner-pulse.sk-spinner {
    width: 40px;
    height: 40px;
    margin: 0 auto;
    background-color: #333;
    border-radius: 100%;
    -webkit-animation: sk-pulseScaleOut 1s infinite ease-in-out;
    animation: sk-pulseScaleOut 1s infinite ease-in-out; }
@-webkit-keyframes sk-pulseScaleOut {
    0% {
        -webkit-transform: scale(0);
        transform: scale(0); }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 0; } }
@keyframes sk-pulseScaleOut {
    0% {
        -webkit-transform: scale(0);
        transform: scale(0); }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 0; } }

.sk-spinner-wave.sk-spinner {
    margin: 0 auto;
    width: 50px;
    height: 30px;
    text-align: center;
    font-size: 10px; }
.sk-spinner-wave div {
    background-color: #333;
    height: 100%;
    width: 6px;
    display: inline-block;
    -webkit-animation: sk-waveStretchDelay 1.2s infinite ease-in-out;
    animation: sk-waveStretchDelay 1.2s infinite ease-in-out; }
.sk-spinner-wave .sk-rect2 {
    -webkit-animation-delay: -1.1s;
    animation-delay: -1.1s; }
.sk-spinner-wave .sk-rect3 {
    -webkit-animation-delay: -1s;
    animation-delay: -1s; }
.sk-spinner-wave .sk-rect4 {
    -webkit-animation-delay: -0.9s;
    animation-delay: -0.9s; }
.sk-spinner-wave .sk-rect5 {
    -webkit-animation-delay: -0.8s;
    animation-delay: -0.8s; }
@-webkit-keyframes sk-waveStretchDelay {
    0%, 40%, 100% {
        -webkit-transform: scaleY(0.4);
        transform: scaleY(0.4); }
    20% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1); } }
@keyframes sk-waveStretchDelay {
    0%, 40%, 100% {
        -webkit-transform: scaleY(0.4);
        transform: scaleY(0.4); }
    20% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1); } }




.headerBlock{
    margin: 0 10px;
    background-repeat:no-repeat;
    background-position: top center;
    background-size: 100%;
}
.panel {
    margin:0 10px;
    -webkit-animation: myfirst 2s; /* Chrome, Safari, Opera */
    animation: myfirst 2s;
}


/* Chrome, Safari, Opera */
@-webkit-keyframes myfirst {
    from {background: transparent;}
    to {background: white;}
}

/* Standard syntax */
@keyframes myfirst {
    from {background: transparent;}
    to {background: white;}
}

#dthRechargePage, #chargesPage, #homePage ,#faqPage,#refundPolicyPage, #mobileRechargePage, #adminPanelPage ,#adminDashboard, #postpaidMobilePage ,#broadBandPage{
    max-width: 800px;
    margin: 0 auto;
}
.hideOnLoad {
    display: none;
}

.showOnLoad{
    width:100%;
    min-height:500px!important;
    background-repeat:no-repeat!important;
    background-size:cover;
    background: url("/images/loading.gif");
}

.panel-heading > h1{
    color:midnightblue;
}
#footer{
    text-align: center;
}
footer {
    background: transparent;
    position: relative;
    bottom: 0;
    margin-top: 10px;
    width: 100%;
    /* Set the fixed height of the footer here */
    height: 60px;
    clear:both;
}
footer > .container {
    padding-right: 15px;
    padding-left: 15px;
}

#homePage {
    padding: 20px;
}



.panel{

}

#formDiv {
    margin: 0 20px;
}
.centerAlignedDiv {
    text-align: center;

}

#errorNotification,#successNotification {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    text-align: center;
    z-index: 100;
    -webkit-animation: fadeIn 1s;
    animation: fadeIn 1s;

}

#mobileVersion{
    border: 1px solid;
    background-color: red;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    text-align: center;
    z-index: 100;
}
#mobileVersion a {
    color: #ffffff;
}
#mobileVersion span{
    margin-left: 10px;
}

#mobileVersion span:hover{
    margin-left: 10px;
    cursor: pointer;
}

.customCheckbox{
    min-width:200px!important;
    text-align: center;
    margin: 0 auto;
}

.activeTab {
    background: lightblue;
}

@media screen and (max-width: 768px) {
    footer{
        position: relative;
    }

}

#marquee{
    width:1000px;
    text-align: center;
    margin: 0 auto;
    font-weight: bold;
}

.adsenseContainer{
    text-align: center;
}

@-webkit-keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}