/****************************************************************************
*****************************************************************************
**
**
**    Created on : 20 Dec, 2016, 11:20:36 AM
**    Author     : shashank
**
**
*****************************************************************************
****************************************************************************/
/******************Keep your fonts here****************************/
@font-face {
    font-family: JosefinSans-Bold;
    src: url(../fonts/JosefinSans-Bold.ttf);
}
@font-face {
    font-family: Schoolbell;
    src: url(../fonts/Schoolbell.ttf);
}

@font-face {
    font-family: Sniglet-Regular;
    src: url(../fonts/Sniglet-Regular.ttf);
}
@font-face {
    font-family: Sniglet-ExtraBold;
    src: url(../fonts/Sniglet-ExtraBold.ttf);
}
@font-face {
    font-family: Lato-Black;
    src: url(../fonts/Lato-Black.ttf);
}
@font-face {
    font-family: Lato-Bold;
    src: url(../fonts/Lato-Bold.ttf);
}
@font-face {
    font-family: Lato-Regular;
    src: url(../fonts/Lato-Regular.ttf);
}
@font-face{
    font-family: JosefinSans-regular;
    src: url(../fonts/JosefinSans-Regular.ttf);
}
@font-face{
    font-family: badScript;
    src: url(../fonts/BadScript-Regular.ttf);
}
@font-face{
    font-family: PlayfairDisplay-Regular;
    src: url(../fonts/PlayfairDisplay-Regular.ttf);
}
/************************Body*********************************/
html, body {
    width: 100%;
    height: 100%;
}
body{
    overflow-x:hidden;
    /*    background:
            radial-gradient(#8c8b8b 5%, transparent 5%) 0 0,
            radial-gradient(#8c8b8b 5%, transparent 10%) 2px 2px,
            radial-gradient(rgba(255,255,255,.1) 5%, transparent 2%) 0 1px,
            radial-gradient(rgba(255,255,255,.1) 5%, transparent 2%) 5px 5px;*/
    /*background-color:#e7e7e7;*/
    /*background-color: #FFF;*/
    background-color:rgba(242, 242, 242, 0.55);   
    
    background-size:16px 16px;
    font-family: JosefinSans-regular;
    /*    background: url("../img/background.jpg");
        overflow: auto;
        height: 100%;
        width: inherit;*/
    
}
/*****************************Dashboard*******************************/
.dashboard{
    background-color: #0e3f79;
    padding: 5px 10px;
    /*border-bottom: 1px solid #f3f3f3;*/
}
.dashboard-logo{
    display: block;
    width: 50px;
    height: auto;
    float: left;
    margin: auto;
}
.mobile-dashboard-logo{
    display: block;
    width: 80px;
    height: auto;
    margin-left: 5px;
}
.dash-inner{
    position: relative;
    margin-top: 12px;
}
.dashboardCategory{
    border: 1px solid #ccc;
}
.dashboard-categories{
    padding: 8px 5px;
    /*vertical-align: sub;*/
    /*font-weight: 100;*/
    margin: 0px;
    font-family: Lato-Regular;
    font-size: 12px;
}
.dashboard-switch {
    position: relative;
    /*display: inline-block;*/
    width: 30px;
    height: 15px;
    vertical-align: text-top;
    margin: 0px;
}
.dashboard-checkslide{
    display: none;
}
.dashboard-slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;    
    background-color: #4d4d4d;
    -webkit-transition: .4s;
    transition: .4s;
}
.dashboard-slider:before {
    position: absolute;
    content: "";
    height: 19px;
    width: 19px;
    left: -2px;
    bottom: -2px;
    background-color: #ffe210;
    -webkit-transition: .4s;
    transition: .4s;
}
.divider {
        background-color: #333;
}

.dropdown-menu{
 background-color:#bfe530; 
 font-family: Sniglet-Regular;
 border-radius:10px;
}
.mob{
    top:9%;
    left:25%;
}

.homeContainer{
    background-image: url(../img/bluepattern.png);
    min-height: 500px;
    background-size: inherit;
    background-repeat: repeat;
}
.todayfeature{

    /*background: url(../img/todays-feature-gif.gif);*/
    background: url(../img/todayfeature.png);
    background-size: 100%;
    font-family: Sniglet-Regular;
    /*margin: 20px 0 0 50px;*/
    margin-top: 20px;
    background-repeat: no-repeat;

}
.funfact{
    background-image: url(../img/facts.png);
    background-size: 100%;
    font-family: Sniglet-Regular;
    /*margin: 52px 0 0 0;*/
    margin-top: 52px;
    background-repeat: no-repeat;
}
/*.announcements{
    background-image: url(../img/announcements.png);
    background-size: 100%;
    margin: 40px 0 0 -40px;
    margin-top: 40px;
    background-repeat: no-repeat;
}
#announcements{
    margin-right: 40px;
    background-image: url(../img/announcements.png),url(../img/panel.png);
    background-position: top left, bottom left;
}*/
.homeblock1{
    margin: 0 40px;
}
.homeblock1:before{
    display: table;
    content: " ";
}
.homeblock1:after
{
    display: table;
    content: " ";
    clear: both;
}
.homeblock2{
    margin: 20px 40px 0 40px;
}
.homeblock2:before{
    display: table;
    content: " ";
}
.homeblock2:after
{
    display: table;
    content: " ";
    clear: both;
}
.recommendations{
    background-image: url(../img/recommend.png);
    background-size: 100%;
    background-repeat: no-repeat;
    margin-top: 20px;
}

.cat{
    margin-top: 15%;
    margin-left: -35px;
    /*width: 90%;*/
}
.technews{
    background-image: url(../img/tech-news1.png);
    background-size: 100%;
    /*margin-top: 15px;*/
    background-repeat: no-repeat;
}
.diy{
    background-image: url(../img/diy.png);
    background-size: 100%;
    /*margin: 15px 0 0 40px;*/
    background-repeat: no-repeat;
}
.dontclick{
    /*margin-top: -15px;*/
    width: 56%;
    margin-right: auto;
    margin-left: auto;
}
.dontclick{
    /*margin-top: -15px;*/
    width: 56%;
    margin-right: auto;
    margin-left: auto;
}
.dontclickmodal{
    background: url(../img/tv.png);
    background-size: 100%;
    border: 0;
    margin-top: -100px;
    box-shadow: none;
    /*margin: 15px 0 0 40px;*/
    background-repeat: no-repeat;
}
/*.poll{
    background-image: url(../img/poll.png);
    background-size: 100%;
    margin-top: 25px;
    background-repeat: no-repeat;
}*/
.quotes{
    background-image: url(../img/thought.png);
    background-size: 100%;
    margin-top: 25px;
    background-repeat: no-repeat;
}
.wod{
    background-image: url(../img/word.png);
    background-size: 100%;
    /*margin-top: 15px;*/
    /*margin-right: 40px;*/
    background-repeat: no-repeat;
}
.mouse{
    margin-top: 25px;
    /*width: 80%;*/
    float: right;
}
.blogs{
    background-image: url(../img/signboard.png);
    background-size: 100%;
    /*margin: 15px 0 0 40px;*/
    background-repeat: no-repeat;
}
.story{
    background-image: url(../img/story.png);
    background-size: 100%;
    margin-top: 15px;
    /*margin-right: 40px;*/
    background-repeat: no-repeat;
}
.generalbg{
    visibility: hidden;
}
#examsContainer {
    background-image:  url(../img/corner-exams.png),url(../img/bg.png);
    background-position: left top, right bottom;
    background-repeat: no-repeat, space;
    background-size: 25%,100%;
    margin-top: 35px;
    min-height: 500px;
}

#schoolContainer {
    background-image:  url(../img/corner-school.png),url(../img/bg.png);
    background-position: left top, right bottom;
    background-repeat: no-repeat, space;
    background-size: 25%,100%;
    margin-top: 25px;
    min-height: 500px;
}
#tuitionContainer {
    background-image:  url(../img/corner-tuition.png),url(../img/bg.png);
    background-position: left top, right bottom;
    background-repeat: no-repeat, space;
    background-size: 25%,100%;
    margin-top: 25px;
    min-height: 500px;
}
#studymaterialContainer {
    background-image:  url(../img/corner-study.png),url(../img/bg.png);
    background-position: left top, right bottom;
    background-repeat: no-repeat, space;
    background-size: 25%,100%;
    margin-top: 25px;
    min-height: 500px;
}
#BlogsContainer {
    background-image:  url(../img/bg.png);
    /*background-position: left top, right bottom;*/
    /*background-repeat: no-repeat, space;*/
    background-size: 100%;
    /*margin-top: 25px;*/
    min-height: 500px;
}

@media screen and (max-width: 768px){
   #examsContainer {
    background-image:  url(../img/corner-exams.png),url(../img/bg.png);
    background-position: left top, right bottom;
    background-repeat: no-repeat, space;
    background-size: 25%,100%;
    margin-top: 0px;
    min-height: 500px;
}
#schoolContainer {
    background-image:  url(../img/corner-school.png),url(../img/bg.png);
    background-position: left top, right bottom;
    background-repeat: no-repeat, space;
    background-size: 25%,100%;
    margin-top: 0px;
    min-height: 500px;
}
#tuitionContainer {
    background-image:  url(../img/corner-tuition.png),url(../img/bg.png);
    background-position: left top, right bottom;
    background-repeat: no-repeat, space;
    background-size: 25%,100%;
    margin-top: 0px;
    min-height: 500px;
}
#studymaterialContainer {
    background-image:  url(../img/corner-study.png),url(../img/bg.png);
    background-position: left top, right bottom;
    background-repeat: no-repeat, space;
    background-size: 25%,100%;
    margin-top: 0px;
    min-height: 500px;
}
#BlogsContainer {
    background-image:  url(../img/bg.png);
    /*background-position: left top, right bottom;*/
    /*background-repeat: no-repeat, space;*/
    background-size: 100%;
    /*margin-top: 25px;*/
    min-height: 500px;
}

}
.navbar-brand, .navbar-nav > li > a{
    font-family: Sniglet-Regular;
}
.archivesmenu{
    background-color: #bee530;
    border-radius: 15px;
    /*margin-top: 25%;*/
    box-shadow: 10px 10px 0 #83bf00;
    font-family: Sniglet-Regular;
    list-style:none;
}
.blogmenu{
    background-color: #bee530;
    border-radius: 15px;
    margin-top: 45%;
    box-shadow: 10px 10px 0 #83bf00;
    font-family: Schoolbell;
}
.archivesmenu li, .blogmenu li{
    font-size: 20px;
    padding: 10px;
    /*margin: 10px;*/ 
    font-family: Sniglet-Regular;
    border-bottom: 1px solid #83bf00;
    color: #83bf00;

}
/*.archivesmenu li a,.blogmenu li a,*/ 
.archivesmenu li.active {
    background-color: #bfd300;
    color: #fff;
    font-family: Sniglet-Regular;
    margin: 0px;
}
a:visited{
    font-family: Schoolbell;
    font-size: 16px;
    color: #388c02;
    text-decoration: none;
}
archivesmenu ul a:hover, blogmenu ul a:hover,
a:active{
    color: #286600;
    background-color: #83bf00;
    text-decoration: none;
}
.archive{
    font-family: Sniglet-Regular;
    font-size: 18px;
    margin-left: 25px;
}


input:checked + .dashboard-slider:before {
    -webkit-transform: translateX(18px);
    -ms-transform: translateX(18px);
    transform: translateX(18px);
}
/* Rounded sliders */
.dashboard-slider.round {
    border-radius: 40px;
}
.dashboard-slider.round:before {
    border-radius: 100px;
}
.inner-addon { 
    position: relative; 
    height: 34px;
}
.search-mob{
    height: 34px;
    width: 70%;
    border: 1px solid #ccc;
    padding:0 5px;
    border-radius: 10px;
}
.search{
    height: 34px;
    width: 100%;
    border: 1px solid #ccc;
    border-radius: 10px;
}
.user-profile{
    background-color: #bfe530;
    border-radius: 10px;
    height: 52px;
    width: auto;
    /*margin:0 10px;*/
}
.user-profile-mobile{
    display:-webkit-inline-box;
    float:right;
    background-color: #bfe530;
    border-radius: 15px;
    padding:0 10px;
    height: 52px;
    width: auto;
    /*margin:0 10px;*/
}

/* style icon */
.inner-addon .glyphicon {
    position: absolute;
    padding: 10px;
    pointer-events: none;
}

/* align icon */
.left-addon .glyphicon  { left:  0px;}
.right-addon .glyphicon { right: 0px;}

/* add padding  */
.left-addon input  { padding-left:  30px; }
.right-addon input { padding-right: 30px; }


.dashboard-pic{
    /* width: 35px;
     max-height:35px;
     border-radius: 50%;
     margin-right: 15px;
     display: inline-block;*/
    width: 45px;
    height: 45px;
    border-radius: 50%;
    margin: 3.5px 10px 3.5px 0;
    display: inline-block;
}
/**************************Sidebar Navigation*************************/
nav.sidebar, .main{
    -webkit-transition: margin 200ms ease-out;
    -moz-transition: margin 200ms ease-out;
    -o-transition: margin 200ms ease-out;
    transition: margin 200ms ease-out;
}
.main{
    padding: 10px 10px 0 10px;
}
@media (min-width: 765px) {
    .main{
        position: absolute;
        width: calc(100% - 40px); 
        margin-left: 40px;
        float: right;
    }
    .details-area{
        /*width: 95.85%;*/
        background-color:#f2f2f2;

    }
    .mynavigation{
        padding-left: 0px;
        padding-right: 0px;
        font-family: Lato-Regular;
        /*background-color: #e7e7e7;*/
        background-color: #FFF;
        z-index: 100;
        width: 4.15%;
    }
    nav.sidebar:hover + .main{
        margin-left: 200px;
    }
    nav.sidebar.navbar.sidebar>.container .navbar-brand, .navbar>.container-fluid .navbar-brand {
        margin-left: 0px;
    }
    nav.sidebar .navbar-brand, nav.sidebar .navbar-header{
        text-align: center;
        width: 100%;
        margin-left: 0px;
    }
    nav.sidebar a{
        padding-right: 13px;
    }
    nav.sidebar .navbar-nav > li:first-child{
        border-top: 1px #e5e5e5 solid;
    }
    nav.sidebar .navbar-nav > li{
        border-bottom: 1px #e5e5e5 solid;
    }
    nav.sidebar .navbar-nav .open .dropdown-menu {
        position: static;
        float: none;
        width: auto;
        margin-top: 0;
        background-color: #ccc;
        border: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
    }
    nav.sidebar .navbar-collapse, nav.sidebar .container-fluid{
        padding: 0 0px 0 0px;
    }
    .navbar-inverse .navbar-nav .open .dropdown-menu>li>a {
        color: #777;
    }
    .nav>li>a>img {
        max-width: 30px;
        margin-top: -5px;
    }
    nav.sidebar{
        width: 200px;
        height: 100%;
        margin-left: -145px;
        float: left;
        margin-bottom: 0px;
        border-radius: 0px;
    }
    nav.sidebar li {
        width: 100%;
    }
    nav.sidebar:hover{
        margin-left: 0px;
    }
    .forAnimate{
        opacity: 0;
    }
}
@media (min-width: 1330px) {
    .main{
        width: calc(100% - 200px);
        margin-left: 200px;
    }
    nav.sidebar{
        /* margin-left: 0px;*/
        float: left;
    }
    nav.sidebar .forAnimate{
        opacity: 1;
    }
}
nav.sidebar .navbar-nav .open .dropdown-menu>li>a:hover, nav.sidebar .navbar-nav .open .dropdown-menu>li>a:focus {
    color: #CCC;
    background-color: transparent;
}
nav:hover .forAnimate{
    opacity: 1;
}
section{
    padding-left: 15px;
}
/************************HomePage*************************************/
.containerHeadings{
    font-family: Sniglet-Regular; 
}
#technewsMainDiv{
    padding: 10px 0 10px 0;
    font-family: PlayfairDisplay-Regular;
}
.eduBlocks{
    border: 1px solid transparent;
    background-color: white;
    margin-bottom: 15px;
}
.notificationblock{
    border: 1px solid transparent;
    background-color: white;
}
.notificationblock .title{
    padding-left: 15px;
    font-family: Sniglet-Regular; 
}
.techBlocks{
    border: 1px solid transparent;
    background-color: #e8e8e8;
    padding: 0 12px;
    min-height: 256px;
    max-height: 256px;
    text-overflow: ellipsis;
    overflow: hidden;

}
.techBlocks div{
    padding: 14px 0 6px 0;
}
.techBlocks img{
    width:100%;
    height: 150px;
    position: relative;
}
.techBlocks a{
    color: inherit;
}

.techBlocks:hover{
    background: #2196f3 url("../img/view-more.png") no-repeat center center;
    opacity: 1;
}
.techBlocks:hover img, .techBlocks:hover span{
    background-color: #2196f3;
    opacity: 0.2;
}
.techBlocks:hover .viewmore{
    visibility: visible;
    opacity: 1;
    /* margin-left: 55px;*/
}
.viewmore{
    position: absolute;
    visibility: hidden;
    opacity: 0;
    font-family: Sniglet-Regular;
    color: #eee;
    text-align: center;
    width: 80%;
    top:140px;
}
.oldernews{
    padding-bottom: 10px;
}
.oldernews a{
    color: #2ECCFA;
}
.eduMainBlocks{
    background-color: #e8e8e8;
    display: inline-block;
    padding: 20px 5px;
}
.notiDiv{
    font-family: PlayfairDisplay-Regular;
    padding: 0;
}
.notiDiv li{
    padding: 5px 0;
}
.notiDiv ul{
    padding: 0;
    list-style: none;
}
.notiDiv a{
    color:rgb(98, 227, 253)
}
.notiDiv i{
    font-size: 15px;
}
#notificationDiv{
    overflow: auto;
    height: 625px;
    padding-left: 15px;  
}
.blogcategory{
    padding: 15px;
}
.blogcattitle{
    font-family: Lato-Bold;
    background-color: #ffe210;
    text-align: center;
    padding: 3px;

}
.ih-item {
    position: relative;
    -webkit-transition: all 0.35s ease-in-out;
    -moz-transition: all 0.35s ease-in-out;
    transition: all 0.35s ease-in-out;
}
.ih-item,
.ih-item * {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.ih-item a {
    color: #333;
}
.ih-item a:hover {
    text-decoration: none;
}
.ih-item img {
    width: 100%;
    height: 100%;
}
.ih-item.square {
    position: relative;
    /*width: 316px;*/
    /*height: 216px;*/
    /*border: 8px solid #fff;*/
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
}
.ih-item.square .info {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    text-align: center;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
.ih-item.square.effect13 {
    overflow: hidden;
}
.ih-item.square.effect13.colored .info {
    background: #ffe210 ;
    /*background: rgba(26, 74, 114, 0.6);*/
}
.ih-item.square.effect13.colored .info h3 {
    background: rgba(12, 34, 52, 0.6);
}
.ih-item.square.effect13 .img {
    -webkit-transition: all 0.35s ease-in-out;
    -moz-transition: all 0.35s ease-in-out;
    transition: all 0.35s ease-in-out;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}
.ih-item.square.effect13 .info {
    background: #333333;
    background: rgba(0, 0, 0, 0.6);
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    -webkit-transition: all 0.35s ease-in-out;
    -moz-transition: all 0.35s ease-in-out;
    transition: all 0.35s ease-in-out;
}
.ih-item.square.effect13 .info h3 {
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    font-size: 17px;
    padding: 10px;
    background: #111111;
    margin: 30px 0 0 0;
}
.ih-item.square.effect13 .info p {
    font-style: italic;
    font-size: 12px;
    position: relative;
    color: #bbb;
    padding: 20px 20px 20px;
    text-align: center;
}
.ih-item.square.effect13:hover .img {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
}
.ih-item.square.effect13:hover .info {
    visibility: visible;
    opacity: 1;
}

/*.ih-item.square.effect13.left_to_right .info {
  -webkit-transform: translateX(-100%);
  -moz-transform: translateX(-100%);
  -ms-transform: translateX(-100%);
  -o-transform: translateX(-100%);
  transform: translateX(-100%);
}
.ih-item.square.effect13.left_to_right a:hover .info {
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  -o-transform: translateX(0);
  transform: translateX(0);
}*/

/*.ih-item.square.effect13.right_to_left .info {
  -webkit-transform: translateX(100%);
  -moz-transform: translateX(100%);
  -ms-transform: translateX(100%);
  -o-transform: translateX(100%);
  transform: translateX(100%);
}
.ih-item.square.effect13.right_to_left a:hover .info {
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  -o-transform: translateX(0);
  transform: translateX(0);
}*/

/*.ih-item.square.effect13.top_to_bottom .info {
  -webkit-transform: translateY(-100%);
  -moz-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  -o-transform: translateY(-100%);
  transform: translateY(-100%);
}
.ih-item.square.effect13.top_to_bottom a:hover .info {
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  -o-transform: translateY(0);
  transform: translateY(0);
}*/

.ih-item.square.effect13.bottom_to_top .info {
    -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%);
    -ms-transform: translateY(100%);
    -o-transform: translateY(100%);
    transform: translateY(100%);
}
.ih-item.square.effect13.bottom_to_top:hover .info {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
}
.seeall {
    position: absolute;
    bottom: 1px;
    right: 1px;

}
/***********************Landing Page Style****************************/
.landing-container{
    position: relative;
    max-width: 100vw;
    overflow: hidden;
    background-color: #fff;
    /*height: 100vh;*/
    /*margin: 0 auto;*/
    /*padding: 5%;*/
}
.scene {
    padding: 0;
    margin: 0;
    /*height: 60%;*/
}
img {
    display: block;
    width: 100%;
}
.aspect {
    opacity: 0.2;
}
.layer:nth-child(1) {
    opacity: 1.0;
}
.layer:nth-child(1) button {
    -webkit-transform: rotate(150deg);
}
.layer:nth-child(2) {
    opacity: 1.0;
}
.layer:nth-child(2) button {
    -webkit-transform: rotate(120deg);
}
.layer:nth-child(3) {
    opacity: 1.0;
}
.layer:nth-child(3) button {
    -webkit-transform: rotate(90deg);
}
.layer:nth-child(4) {
    opacity: 1.0;
}
.layer:nth-child(4) button {
    -webkit-transform: rotate(60deg);
}
.layer:nth-child(5) {
    opacity: 1.0;
}
.layer:nth-child(5) button {
    -webkit-transform: rotate(30deg);
}
.layer:nth-child(6) {
    opacity: 0.90;
}
.layer:nth-child(6) button {
}
.login{
    position: absolute;
    z-index: 1;
    right: 1%;
    text-align: right;
    color: #8c8282;
    font-family: Lato-Bold;
    margin-top: 1%;
    padding-left: 0;
    padding-right: 0;
}
.landing-intro{
    position: absolute;
    z-index: 1;
    margin: 20% 12%;
    font-family: Lato-Black;
    font-size: 38px;
}
.landing-intro2{
    position: absolute;
    z-index: 1;
    margin: 28% 12%;
    font-family: Lato-Black;
    font-size: 38px;
}
.SelectCategory{
    position: absolute;
    z-index: 1;
    margin: 35% 12%;
    font-family: Lato-Black;
    font-size: 36px;
}
.categoryDiv{
    display: inline-block;
    border: 1px solid #ccc;    
    width: auto;
    padding: 5px;
    z-index: 1;
    /*font-size: 20px;*/
    background-color:white;
    /*margin-left: 10%;*/
    /*margin-top: 0.8%*/
    position: absolute;
    margin: 35% 12%;
}
.categories{
    padding: 15px 10px;
    vertical-align: sub;
    /*font-weight: 100;*/
    margin: 0px;
    font-family: Lato-Regular;
    font-size: 15px;
}
.switch {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 20px;
    vertical-align: text-top;
    margin: 0px;
}
.checkslide{
    display: none;
}
.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #4d4d4d;
    -webkit-transition: .4s;
    transition: .4s;
}
.slider:before {
    position: absolute;
    content: "";
    height: 26px;
    width: 26px;
    left: -3px;
    bottom: -3px;
    background-color: #ffe210;
    -webkit-transition: .4s;
    transition: .4s;
}
input:checked + .slider:before {
    -webkit-transform: translateX(29px);
    -ms-transform: translateX(29px);
    transform: translateX(29px);
}
/* Rounded sliders */
.slider.round {
    border-radius: 40px;
}
.slider.round:before {
    border-radius: 100px;
}
.pickCategoryDiv{
    position: absolute;
    font-size: 14px;
    font-family:badScript;
    width: auto;
    padding: 0 10px;
    margin-top: 33%;
    margin-left: 65%;
}
#arrowImg{
    width: 30px;
    /*margin-right: 50%*/
}
.menu{
    position: absolute;
    top: 62%;
    font-family: Lato-Bold;
    height: 100%;
    width: 100vw;
    background:
        radial-gradient(#d0d0d0 2%, transparent 2%) 0 0,
        radial-gradient(#d0d0d0 5%, transparent 10%) 2px 2px,
        radial-gradient(rgba(255,255,255,.1) 5%, transparent 2%) 0 1px,
        radial-gradient(rgba(255,255,255,.1) 5%, transparent 2%) 5px 5px;
    background-color:#fff;
    background-size:16px 16px;
    text-align: center;
}
.menu-intro{
    font-size: 22px;
    text-align: center;
    margin: 15px auto;
}
.menu-icons{
    width: initial;
    height: auto;  
    display: inline-block;
    padding: 10px 20px;
}
.menu-slider{
    text-align: center;    
}
.showmemore{
    font-family: Lato-Bold;
    font-size: 11px;
    background-color:#ffe210;
    padding: 1% 2%;
    word-spacing: 1px;
    border: 0 solid #ccc;
    margin-top: 10px;
}
/****************************General********************************/
/*textarea {
    max-width: 100%; 
    max-height: 100%;
}*/
textarea {
    width: 100%; 
    max-height: 100%;
    resize: none;
}
.block{
    margin: 0px;
}
.block:before{
    display: table;
    content: " ";
}
.block:after
{
    display: table;
    content: " ";
    clear: both;
}
.filters{
    /*background-color: #fff;*/
    padding: 10px;
    /*border-bottom: 1px solid #f3f3f3;*/
}
.select {
    position: relative;
    display: inline-block;
    /*width: 100%;*/
    /*margin-bottom: 15px;*/
}
.select option{
    background: #fff;
    color:#00afef;

}
/*#city{
    color: #00afef;
    background: #fff;
}*/
.select select {
    color: #fff;
    font-family: Sniglet-Regular;
    display: inline-block;
    border: 0 solid #ccc;
    width: 100%;
    font-size: 14px;
    margin: 0 0 3px 15px;
    background-color: #00afef;
    border-radius: 8px;
    /*margin-left: 10%;*/
    margin-top: 2%;
    height: 30px;
    padding:0 25px 0 10px;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
}
.select select::-ms-expand {
    background: #fff;
    /* display: none;*/
}
.select__arrow {
    position: absolute;
    top: 45%;
    right: 5%;
    /*	width: 0;
            height: 0;*/
    pointer-events: none;
    border-width: 8px 5px 0 5px;
    border-style: solid;
    border-color: #fff transparent transparent transparent;
}
.select select:hover ~ .select__arrow,
.select select:focus ~ .select__arrow {
    border-top-color: #fff;
}
select option:hover {
    background: #00afef;
    color: #fff;

    /*box-shadow: 0 0 10px 100px #000 inset;*/
}


/************************Scrollbar Styling********************/
::-webkit-scrollbar {
    width: 5px;
    opacity:0.8;
}
/* Track */
::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
}
/* Handle */
::-webkit-scrollbar-thumb {
    background: rgb(211,211,211);
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}

::-webkit-scrollbar-thumb:window-inactive {
    background:rgba(16, 15, 15, 0.18); 
}
a {
    outline: none;
}
/*a:focus {
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px;*/
p{
    margin: 0px;
}
x{
    background-color: #ffe210;
}
h7{
    margin: 5px 0 5px 0;
}
hr {
    margin-top: 2px;
    margin-bottom: 2px;
    border: 0;
    border-top: 1px solid #eee;
}
.blogh {
    margin-top: 2px;
    margin-bottom: 2px;
    border: 0;
    border-top: 2px solid #83bf00;
}
.blogfooter {
    padding: 5px;
    border-top: 1px solid #83bf00;
}
.bloglist{
    list-style:none;
}
h8{
    margin: 5px 5px;
    font-family: PlayfairDisplay-Regular;
    font-size: 16px;
    color: #00afef;
}
/***************************Box******************************/
.box {
    margin-right: auto;
    margin-left: auto;
}
.card-info {
    margin-right: auto;
    margin-left: auto;
    text-align: center;
    font-family: PlayfairDisplay-Regular;
    font-size: 16px;
    padding: 5px;
    height: 80px;
}

/***********************Landing Page CSS*********************/
.landing-logo{
    display: block;
    max-width: 55%;
    height: auto;
    margin: auto;
}
.loginBtn{
    background-color:white;
    padding: 2.5% 8.5%;
    border: 1px solid #ccc;
    font-size: 13px;
}
.createAccBtn{
    background-color:white;
    margin-left: 2.5%;
    padding: 2.5% 5%;
    border: 1px solid #ccc;
    font-size: 13px;
}
/*************************Footer Style**********************/
/*footer {
    padding: 30px 0;
    background: url(../img/footer.png);
    background-size: 100%;
    margin-top: 15px;
    background-repeat: no-repeat;
}*/
footer {
    padding: 20px 0;
    background-color: #bfd300;
    overflow: hidden;
}
.footcontent{
    padding: 15px;
}
footer .box {
    font-family: Sniglet-Regular;
    font-size: 16px;
    line-height: 2em;
    border: 0px;
    border-top: 10px solid #e0e02f;
    border-right: 10px solid #e0e02f;
    border-radius: 20px;
    margin: 0 15px;
    /*    padding: 15px;*/
    background-color: #e5ed43;
    background-image: url(../img/plants.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: bottom;
    overflow: hidden;
    color: #388c02;
    padding: 0px;
}
.footer-title {
    font-family: Sniglet-Regular;
    font-size: 22px;
    font-weight: 600;
    color: #286600;
}
.footer-subtitle {
    font-family: Sniglet-Regular;
    font-size: 18px;
    font-weight: 600;
    color: #286600;
}
footer aside {
    width: 33.3333%;
    float: left;
}
footer aside.logo {
    text-align: right;
}
footer ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}
footer ul a, 
a:visited{
    font-family: Sniglet-Regular;
    font-size: 16px;
    color: #388c02;
    text-decoration: none;
}
footer ul a:hover,
a:active{
    color: #286600;
    text-decoration: none;
}
footer .copyright {
    margin-top: 30px;
    text-align: center;
}
footer span {
    font-size: 16px;
}
footer .copyright a {
    color: #f4dadd;
}
/**********************card styles**********************/
.card {
    /* box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);*/
    transition: 0.3s;
    width: 100%;
    margin: 10px 0 10px 0;
    border: 2px solid #00afef;
    border-radius: 10px;
    overflow: hidden;
}
/*******************School--Cards***********************/
.card-school{
    color: #484949;
    background-color: #fff;
}
.school-name,
.school-name:hover{
    color: #4c4c4c;  
    text-decoration: none;
    outline: none;
}
.school-name-card {
    overflow: hidden;
    color: #000;
    text-overflow: ellipsis;
    display: -webkit-box;
    line-height: 20px;     /* fallback */
    max-height: 40px;      /* fallback */
    -webkit-line-clamp: 2; /* number of lines to show */
    -webkit-box-orient: vertical;
}
.school-card-info {
    margin: 15px 10px 0 15px;
    text-align: inherit;
    font-family: Sniglet-Regular;
    font-size: 18px;
    height: 80px;
}
.school-bottom{
    /*background-color: #e97728;*/
    height: 32px;
}
/***********************School--Modal*******************/
.school-modal{
    width: 80vw;
    margin: 30px auto;
}
.school-content {
    position: relative;
    background-color: #fff;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid #999;
    border: 1px solid rgba(0, 0, 0, .2);
    border-radius: 0;
    outline: 0;
    -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
    box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
}
.school-header {
    padding: 15px;
    background-color: #484949;
    color: #fff;
    font-family: PlayfairDisplay-Regular;
    text-align: center;
    border-bottom: 1px solid #e5e5e5;
}
.school-header .close {
    margin-top: -2px;
    color: #fff;
    font-size: 30px;
}
.school-title {
    margin: 0;
    line-height: 1.42857143;
}
.school-body {
    position: relative;
    padding: 15px;
}
.school-header:before,
.school-header:after{
    display: table;
    content: " ";
}
.school-header:after{
    clear: both;
}
/**********************Tuition--Cards*******************/
.card-tuition{
    color: #484949;
    background-color: #fff;
}
.tuition-name{
    color: #4c4c4c;  
    text-decoration: none;  
    outline: none;
     overflow: hidden;
    color: #000;
    text-overflow: ellipsis;
    display: -webkit-box;
    line-height: 20px;     /* fallback */
    max-height: 20px;      /* fallback */
    -webkit-line-clamp: 1; /* number of lines to show */
    -webkit-box-orient: vertical;
}
.tuition-name:hover{
    color: #4c4c4c;  
    text-decoration: none;  
    outline: none;
     overflow: hidden;
    color: #000;
    text-overflow: ellipsis;
    display: -webkit-box;
    line-height: 20px;     /* fallback */
    max-height: 40px;      /* fallback */
    -webkit-line-clamp: 1; /* number of lines to show */
    -webkit-box-orient: vertical;
}

.tuition-card-info{
    margin: 15px 10px 0 15px;
    text-align: inherit;
    font-family: Sniglet-Regular;
    font-size: 18px;
    height: 80px;
}
.tuition-bottom{
    /*background-color: #bfd300;*/
    height: 32px;
}
/*********************Tuition--Modal******************/
.tuition-modal{
    width: 80vw;
    margin: 30px auto;
}
.tuition-content {
    position: relative;
    background-color: #fff;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid #999;
    border: 1px solid rgba(0, 0, 0, .2);
    border-radius: 0;
    outline: 0;
    -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
    box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
}
.tuition-header {
    padding: 15px;
    background-color: #484949;
    color: #fff;
    font-family: PlayfairDisplay-Regular;
    text-align: center;
    border-bottom: 1px solid #e5e5e5;
}
.tuition-header .close {
    margin-top: -2px;
    color: #fff;
    font-size: 30px;
}
.tuition-title {
    margin: 0;
    line-height: 1.42857143;
}
.tuition-body {
    position: relative;
    padding: 15px;
}
.tuition-header:before,
.tuition-header:after{
    display: table;
    content: " ";
}
.tuition-header:after{
    clear: both;
}
/*********************Tuition--Modal******************/
.tuition-modal{
    width: 80vw;
    margin: 30px auto;
    overflow-y:auto;
    max-height:90%;
}
.tuition-content {
    position: relative;
    background-color: #fff;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid #999;
    border: 1px solid rgba(0, 0, 0, .2);
    border-radius: 0;
    outline: 0;
    -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
    box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
}
.tuition-header {
    padding: 15px;
    background-color: #484949;
    color: #fff;
    font-family: PlayfairDisplay-Regular;
    text-align: center;
    border-bottom: 1px solid #e5e5e5;
}
.tuition-header .close {
    margin-top: -2px;
    color: #fff;
    font-size: 30px;
}
.tuition-title {
    margin: 0;
    line-height: 1.42857143;
}
.tuition-body {
    position: relative;
    /*padding: 15px;*/
}
.tuition-header:before,
.tuition-header:after{
    display: table;
    content: " ";
}
.tuition-header:after{
    clear: both;
}
.tuition-std-subj{
    background-color: #f2f2f2;
    font-family: PlayfairDisplay-Regular;
    font-size: 16px;
    padding: 15px;

}
.std {
    display: inline-block;
    padding: 0 10px;
    margin: 3px;
    font-family: JosefinSans-bold;
    /*height: 50px;*/
    font-size: 16px;
    line-height: 30px;
    border-radius: 8px;
    background-color: #DDD;

}
.sub {
    display: inline-block;
    padding: 0 10px;
    margin: 3px;
    font-family: JosefinSans-bold;
    /*height: 50px;*/
    font-size: 16px;
    line-height: 30px;
    border-radius: 8px;
    background-color: #DDD;
}
.tuition-std{
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px; 
    width: 50%;
    float: left;
    border-right: 2px solid #e6e6e6;
}
.tuition-subj{
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;  
    width: 50%;
    float: left;
}
.tuition-info{
    /*    font-family: JosefinSans-bold;
        font-size: 16px;*/
    padding: 20px 0 20px 20px;
    width: 70%; 
    float: left;
    /*border-right: 2px solid #e6e6e6;*/
}
.tuition-imp-dates{
    font-family: JosefinSans-bold;
    font-size: 16px;
    padding: 20px;
    width: 30%; 
    float: left;
    /*border-left: 2px solid #e6e6e6;*/    
}
.tuition-dates{
    font-family: JosefinSans-bold;
    font-size: 16px;
    padding: 0 0 0 20px;
    /*width: 25%;*/ 
    /*float: left;*/
    border-left: 2px solid #e6e6e6;

}
.tuition-general-info{
    font-family: JosefinSans-bold;
    font-size: 16px;
    margin-bottom: 10px;
}
.titles{
    padding: 5px;
    background-color: #484949;
    color: #fff;
    font-family: PlayfairDisplay-Regular;
    text-align: center;
    margin-bottom: 10px;    
}
.addtofav{
    background-color:#00afef;
    padding: 1.5% 7.5%;
    font-family: PlayfairDisplay-Regular;
    color: #fff;
    border: 0px;
    font-size: 16px;
    margin-bottom: 20px;
}
.setreminder{
    background-color:#00afef;
    padding: 1.5% 7.5%;
    position: relative;
    margin-left: 15%;
    margin-top: 20px;
    font-family: PlayfairDisplay-Regular;
    color: #fff;
    border: 0px;
    font-size: 16px;
    margin-bottom: 20px;
}
.tuition-more-info{
    /*    font-family: JosefinSans-bold;
        font-size: 16px;*/
    padding: 20px 0;
    width: 50%; 
    float: left;
    border-right: 2px solid #e6e6e6;
}
.more-info{
    /*    font-family: JosefinSans-bold;
        font-size: 16px;*/
    padding: 20px 0;
    width: 50%; 
    float: left;
    /*border-right: 2px solid #e6e6e6;*/
}
.star-rating{
    font-size: 1.5em;
    color: #999999;
    /*margin: 0 10px 15px 15px;*/
}
.ratings{
    text-align: center;
    padding-right:45px;
}
.details-ratings{
    text-align: left;
    margin-bottom: 15px;
}
.submitrating{
    background-color:#00afef;
    padding: 1.5% 7.5%;
    position: relative;
    width: 100%;
    margin-top: 10px;
    font-family: PlayfairDisplay-Regular;
    color: #fff;
    border: 0px;
    font-size: 16px;
    margin-bottom: 20px;
}
div[class^="ratings"] span {
    float: right; 
    position: relative;
}

div[class^="ratings"] span input {
    position: absolute;
    top: 0px;
    left: 0px;
    opacity: 0;
    height:25px;
    width:25px;
}

div[class^="ratings"] span label {
    display: inline-block;
    width: 30px;
    height: 30px;
    text-align: center;
    color: #FFF;
    background-size:cover;
    background-image: url("../img/star-empty.png");
    font-size: 30px;
    margin-right: 2px;
    line-height: 30px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
}

div[class^="ratings"] span:hover ~ span label, div[class^="ratings"] span:hover label,
div[class^="ratings"] span.checked label, div[class^="ratings"] span.checked 
~ span label {
    background-image: url("../img/star.png");
    color: #FFF;
}

/*********************Exam--Cards*********************/
.card-exam{
    color: #484949;
    background-color: #fff;
}
.exam-name,
.exam-name:hover{
    color: #4c4c4c;  
    text-decoration: none;
    outline: none;
}
.exam-name-card {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    line-height: 20px;     /* fallback */
    max-height: 60px;      /* fallback */
    -webkit-line-clamp: 3; /* number of lines to show */
    -webkit-box-orient: vertical;
}
.exam-card-info {
    margin: 15px 10px 0 15px;
    text-align: inherit;
    font-family: Sniglet-Regular;
    font-size: 16px;
    height: 80px;
}
.exam-bottom{
    /*border-top: 1px solid #00afef;*/
    height: 32px;
}
/*************************Exam--Modal**************************/
.exam-modal{
    width: 80vw;
    margin: 30px auto;
    overflow-y:auto;
    overflow-x: hidden;
    max-height:90%;
}
.exam-content {
    position: relative;
    background-color: #fff;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid #999;
    border: 1px solid rgba(0, 0, 0, .2);
    border-radius: 0;
    outline: 0;
    -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
    box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
}
.exam-header {
    padding: 15px;
    background-color: #484949;
    color: #fff;
    font-family: PlayfairDisplay-Regular;
    text-align: center;
    border-bottom: 1px solid #e5e5e5;
}
.exam-header .close {
    margin-top: -2px;
    color: #fff;
    font-size: 30px;
}
.exam-title {
    margin: 0;
    line-height: 1.42857143;
}
.exam-body {
    position: relative;
    /*padding: 15px;*/
}
.exam-header:before,
.exam-header:after{
    display: table;
    content: " ";
}
.exam-header:after{
    clear: both;
}
.exam-std-subj{
    background-color: #f2f2f2;
    font-family: PlayfairDisplay-Regular;
    font-size: 16px;
    padding: 15px;

}
/*.std {
    display: inline-block;
    padding: 0 25px;
    margin: 3px;
    font-family: JosefinSans-bold;
    height: 50px;
    font-size: 16px;
    line-height: 30px;
    border-radius: 10px;
    background-color: #fff;

}*/
/*.sub {
    display: inline-block;
    padding: 0 25px;
    margin: 3px;
    font-family: JosefinSans-bold;
    height: 50px;
    font-size: 16px;
    line-height: 30px;
    border-radius: 10px;
    background-color: #fff;
}*/
.exam-std{
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px; 
    width: 50%;
    float: left;
    border-right: 2px solid #e6e6e6;
}
.exam-subj{
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;  
    width: 50%;
    float: left;
}
.exam-info{
    /*    font-family: JosefinSans-bold;
        font-size: 16px;*/
    padding: 20px 0 20px 20px;
    width: 70%; 
    float: left;
    /*border-right: 2px solid #e6e6e6;*/
}
.exam-imp-dates{
    font-family: JosefinSans-bold;
    font-size: 16px;
    padding: 20px;
    width: 30%; 
    float: left;
    /*border-left: 2px solid #e6e6e6;*/    
}
.exam-dates{
    font-family: JosefinSans-bold;
    font-size: 16px;
    padding: 0 0 0 20px;
    /*width: 25%;*/ 
    /*float: left;*/
    border-left: 2px solid #e6e6e6;

}
.exam-general-info{
    font-family: JosefinSans-bold;
    font-size: 16px;
    margin-bottom: 10px;
}
.titles{
    padding: 5px;
    background-color: #484949;
    color: #fff;
    font-family: PlayfairDisplay-Regular;
    text-align: center;
    margin-bottom: 10px;    
}
.addtofav{
    background-color:#00afef;
    padding: 1.5% 7.5%;
    font-family: PlayfairDisplay-Regular;
    color: #fff;
    border: 0px;
    font-size: 16px;
    margin-bottom: 20px;
}
.reminder{
    text-align: center;
    color: #fff;
}
.setreminder{
    background-color:#00afef;
    padding: 1.5% 7.5%;
    position: relative;
    margin-top: 20px;
    font-family: PlayfairDisplay-Regular;
    color: #fff;
    border: 0px;
    font-size: 16px;
    margin-bottom: 20px;
}
.exam-more-info{
    /*    font-family: JosefinSans-bold;
        font-size: 16px;*/
    padding: 20px 0;
    width: 50%; 
    float: left;
    border-right: 2px solid #e6e6e6;
}
.more-info{
    /*    font-family: JosefinSans-bold;
        font-size: 16px;*/
    padding: 20px 0;
    width: 50%; 
    float: left;
    /*border-right: 2px solid #e6e6e6;*/
}

/****************************************/
/* Dates and Months of Exam Modal */
.date-as-calendar {
    font-variant: normal;
    font-style: normal;
    font-weight: normal;
    color: #00afef;

    /* It seems vertical-align: baseline does not work correctly with display: inline-flex. */
    vertical-align: top;

    /* margin: 1ex; */

    /*color: black;*/
    background: white;
    border-radius: 0px;
    overflow: hidden;


}
.date-as-calendar .day{
    text-align: center;
    /* line-height: 1.0;*/
    margin-bottom:5px;
    font-family: JosefinSans-bold;
}
.date-as-calendar .month{
    text-align: center;
    line-height: 1.0;
}
.date-as-calendar .month {
    font-family: Sniglet-Regular;
    /*color: #00afef;*/
    text-transform: uppercase;
}

.position-pixels.date-as-calendar {
    display: inline-block;
    background:transparent;
    position: relative;
    width: 72px;
    height: 72px;
    float: left;
    font-family: Sniglet-Regular;
}
.position-pixels.date-as-calendar .day,
.position-pixels.date-as-calendar .month{
    display: block;
    left: 0;
    right: 0;
    width: 100%;
    height: 1em;
}
.position-pixels.date-as-calendar .years {
    font-size: 18px;
    display:inline-block;
    float: right;
    margin-top:15px;
    margin-left: -15px;
    transform:rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);

    position:relative;

}
.position-pixels.date-as-calendar .month {
    top: 0px;
    font-size: 11px;
    padding: 2px 0;
    text-align:left;
    margin-left:20px;
}
.position-pixels.date-as-calendar .day {
    top: 26px;
    font-size: 35px;
}
/*********************StudyMaterial--Cards*********************/
.card-StudyMaterial{
    color: #484949;
    background-color: #fff;
}
.studymaterial-name,
.studymaterial-name:hover{
    color: #4c4c4c;  
    text-decoration: none;
    outline: none;
}
.studymaterial-card-info {
    margin: 15px 10px 0 15px;
    text-align: inherit;
    font-family: Sniglet-Regular;
    font-size: 16px;
    height: 50px;
}
.studymaterial-bottom{
    background-color: #fff;
    height: 32px;
}
/************************User--Cards**********************************/
.card-user{
    color: #484949;
    background-color: #fff;
}
.user-card-info {
    margin-right: auto;
    margin-left: auto;
    text-align: center;
    font-family: PlayfairDisplay-Regular;
    font-size: 16px;
    padding: 5px;
    height: 80px;
}
.card:hover {
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
}
.container {
    padding: 2px 16px;
}
.img-card {
    display: inline-block;
    max-width: 100%;
    line-height: 1.42857143;
    background-color: #fff;
    display: block;
    margin: 20px auto auto auto;
    -webkit-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}
.thumb150 {
    width: 130px!important;
    height: 130px;      /*Added by Aishwarya*/
    display: block;
}
.thumb120 {
    width: 120px!important;
    max-height: 120px;
    display: block;
}
.School_tu-img {
    max-width: 30%!important;
    max-height: 20%;
    display: block;
    float: left;
    margin: 0 25px 25px 0;
}
.responsive {
    width: 80%;
    height:auto;
    display: block;
}
.ratestar{
    /* font-size: 1.5em;
     color: #00afef;
     float: right;
     padding: 5px 5px 5px 5px;*/
    width: 25px;
    float: left;
    margin-right: 10px;
}
.like{
    /* font-size: 1.5em;
     color: #00afef;
     float: right;
     padding: 5px 5px 5px 5px;*/
    width: 12%;
    float: right;
    margin-right: 10px;
}
.view{
    font-size: 1.5em;
    color: #ccc;
    float: right;
    padding: 5px 5px 5px 5px;
}
.download{
    font-size: 1.5em;
    color: #ccc;
    float: right;
    padding: 5px 5px 5px 5px;
}
.web{
    font-size: 1.5em;
    color: #999999;
    margin: 0 10px 15px 15px;
}
.book{
    font-size: 1.5em;
    color: #999999;
    margin: 0 10px 15px 15px;
}
.star{
    width: 25px;
    display: inline-block;
    margin-bottom: 5px;
    /*font-size: 0.8em;
    color: #999999;
    background-image: url(../img/icons/rating.png);
    margin: 0 10px 15px 15px;*/
}
.area{
    font-size: 0.8em;
    color: #999999;
    vertical-align: super;
    /*margin: 0 10px 15px 15px;*/
}
.link{
    vertical-align: super;
    color: #000;
    font-family: Sniglet-Regular; 
    font-size: 15px;
    text-decoration: none;
}
.location{
    display: inline-block;
    width: 10%;
    margin-bottom: 7px;
}
.subject-name{
    vertical-align: super;
    color: #00afef;
    font-family: Sniglet-Regular;  
    text-decoration: none;
    margin: 15px;
}

.test-tab-menu{
    text-align: center;
}
.tab-Alltest{
    border-bottom-color: #fbe300;
    border-width: 0 0 2px 0;
    font-size: 20px;
}
.tab-Mytest{

}
.homework{
    font-family:Sniglet-Regular;
}

.nav-tabs {
    border-bottom: 2px solid #ffe315; position: absolute 
}
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:focus,
.nav-tabs > li.active > a:hover { 
    border-width: 0; 
    border-bottom:4px solid #ffa300;
}
.nav-tabs > li > a { 
    border: none; 
    color: #666; 
}
.nav-tabs > li.active > a,
.nav-tabs > li > a:hover {
   /* border: none; */
   border-bottom:4px solid #ffa300;
    color: #000 !important;
    background: transparent; 
}
.nav-tabs > li > a::after {
    content: "";
    /*background: #ffe210;*/ 
    height: 2px; 
    position: absolute;
    width: 100%; 
    left: 0px;
    bottom: -1px;
    transition: all 250ms ease 0s;
    transform: scale(0);
}
.nav-tabs > li.active > a::after,
.nav-tabs > li:hover > a::after {
    transform: scale(1);
    border-bottom:4px solid #ffa300;
    background: transparent; 
}
.tab-nav > li > a::after { 
    background: #21527d none repeat scroll 0% 0%; 
}
.tab-pane {
    padding: 15px 0;
}
.tab-content{
    padding:40px
}

/*.card {background: #FFF none repeat scroll 0% 0%; box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3); margin-bottom: 30px; }*/
.card-basic-package{
    color: #fff;
    background-color: #39afd3;
}
.package-name,
.package-name:hover{
    color: #fff;  
    text-decoration: none;

    outline: none;
}
.package-info {
    margin: 15px 10px 15px 10px;
    text-align: inherit;
    text-align: center;
    font-family: Sniglet-Regular;
    font-size: 18px;

}
.basic-package-cost{
    /*margin: 15px 10px 15px 10px;*/
    padding: 10px;
    text-align: inherit;
    text-align: center;
    font-family: JosefinSans-Bold;
    font-size: 32px;
    background-color: #0791c0;

}

.card-pro-package{
    color: #fff;
    background-color: #30bd88;
}
.pro-package-cost{
    /*margin: 15px 10px 15px 10px;*/
    padding: 10px;
    text-align: inherit;
    text-align: center;
    font-family: JosefinSans-Bold;
    font-size: 32px;
    background-color: #10af6f;

}
.card-advanced-package{
    color: #fff;
    background-color: #f1bc0e;
}
.advanced-package-cost{
    /*margin: 15px 10px 15px 10px;*/
    padding: 10px;
    text-align: inherit;
    text-align: center;
    font-family: JosefinSans-Bold;
    font-size: 32px;
    background-color: #dba40b;
}
.package-size{
    padding: 15px;
    color: #fff;
    font-size: 26px;
    font-family: JosefinSans-Bold;
}
.basic-btn{
    /*margin:0 0 10px;*/
    border-radius: 25px;
    padding: 5px 15px 2px 15px;
    border-color: #0791c0;
    border-width: 3px;
    border-style: solid;
    color: #39afd3;
    font-family:Sniglet-Regular;
    background-color: #fff;
    margin-top: 15px;
    margin-bottom: 15px;
}
.pro-btn{
    margin:0 0 10px;
    border-radius: 25px;
    padding: 5px 15px 2px 15px;
    border-color: #10af6f;
    border-width: 3px;
    border-style: solid;
    color: #30bd88;
    background-color: #fff;
}
.advanced-btn{
    margin:0 0 10px;
    border-radius: 25px;
    padding: 5px 15px 2px 15px;
    border-color: #dba40b;
    border-width: 3px;
    border-style: solid;
    color: #f1bc0e;
    background-color: #fff;
}
.mytest-basic{
    border-width: 2px; 
    border-style: solid;
    border-color: #39afd3;
    text-align: center;
    /*height:220px;*/
}
.mytest-pro{
    border-width: 2px; 
    border-style: solid;
    border-color: #30bd88;
    text-align: center;
}
.mytest-advance{
    border-width: 2px; 
    border-style: solid;
    border-color: #f1bc0e;
    text-align: center;
}
.test-info{
    text-align: left;
    margin: 15px 10px 15px 10px;
    font-family: Sniglet-Regular;
    font-size: 18px;
    color: #666;
}
.test-exam-name{
    color: #4c4c4c;
}
.test-count{
    float: right;
    color: #4c4c4c;
    font-size: 16px;
    padding: 2px 5px 0 5px;
    background-color: #DDD;
}
.test-title{
    text-align: center;
    font-size: 24px;
    color: #666;
    font-family: Sniglet-Regular;
}
.test-no{
    font-family: Sniglet-Regular;
    text-align: center;
    font-size: 24px;
}
.test-detail{
    background-color: #39afd3;
    color: #fff;
}
.instructions{
    margin: 30px;
    border-width: 2px; 
    border-style: solid;
    border-color: #ccc;
    color: #333333;
    text-align: center;

}
.instruction-title{
    background-color: #CCC;
}
.instruction{
    font-family: Sniglet-Regular;
    color: #666;
    text-align: center;
    font-size: 24px;
}
.instruction-details{
    text-align: left;
    margin: 15px 10px 15px 10px;
    font-family: Sniglet-Regular;
    font-size: 18px;
    color: #666;
}
.instruction-marks{
    float: right;
    color: #4c4c4c;    
}

.instruction-startbtn{
    margin:0 0 10px;
    border-radius: 18px;
    padding: 5px 15px 2px 15px;
    font-family: Sniglet-Regular;
    font-size: 18px;
    border-color: #0791c0;
    border-width: 3px;
    border-style: solid;
    background-color: #39afd3;
    color: #fff;

}
.test-timer{
    background-color: #39afd3;
    color: #fff;
    padding: 10px;
    font-size: 18px;
    font-family: Sniglet-Regular;
    border-width: 2px;
    border-style: solid;
    border-color: #0791c0;
}
.test-marks{
    float: right;    
}
.question-no,
.option-no{
    padding: 10px;
    font-size: 22px;
    font-family: JosefinSans-bold;
}
.question-paper{
    min-height: 550px;
    border: 0;
    border-right: #ccc;
    border-style: solid;
}
.question,
.options{
    padding: 10px;
    font-size: 20px;
    font-family: Sniglet-Regular;
}
.submitanswer{
    text-align: center;
    margin-top: 30px;
}
.submitanswer-btn,
.nextquestion-btn,
.submittest-btn{
    margin:0 0 10px;
    border-radius: 18px;
    padding: 5px 15px 2px 15px;
    font-family: Sniglet-Regular;
    font-size: 18px;    
    border-width: 2px;
    border-style: solid;

}
.submitanswer-btn{
    background-color: #30bd88;
    border-color: #1b9a67;
    color: #fff;
}
.nextquestion-btn{
    background-color: #DDD;
    border-color: #7b7b7b;
    color: #7b7b7b;
}
.submittest-btn{
    background-color: #39afd3;
    border-color: #0791c0;
    color: #fff;
}
.question-grid{
    text-align: center;
}
.question1, .question2, .question3, .question4, .question5 {
    font-size:20px;
    font-weight:bold;
}

.answered{
    min-height: 60px;
    background-color: #30bd88;
    padding: 0px;
    color: #fff;
    text-align: center;
    line-height: 60px;
    font-family: Sniglet-Regular;
    font-size: 20px;
    border-style: solid;
    border-width: 1px;
    border-color: #1b9a67;
}
.unanswered{
    min-height: 60px;
    background-color: #DDD;
    padding: 0px;
    line-height: 60px;
    font-family: Sniglet-Regular;
    font-size: 20px;
    color: #7b7b7b;
    text-align: center;
    border-style: solid;
    border-width: 1px;
    border-color: #7b7b7b;
}
.answered-box{
    width: 30px;
    height: 30px;
    margin-left: 15px;
    background-color: #30bd88;
    padding: 0px;
    color: #fff;
    text-align: center;
    line-height: 60px;
    font-family: Sniglet-Regular;
    font-size: 20px;
    border-style: solid;
    border-width: 1px;
    border-color: #1b9a67;
}
.unanswered-box{
    width: 30px;
    height: 30px;
    background-color: #DDD;
    padding: 0px;
    margin-left: 15px;
    line-height: 60px;
    font-family: Sniglet-Regular;
    font-size: 20px;
    color: #7b7b7b;
    text-align: center;
    border-style: solid;
    border-width: 1px;
    border-color: #7b7b7b;
}
.answered-noti-name,
.unanswered-noti-name{
    text-align: left;
    margin: 3px;
    font-family: JosefinSans-bold;
    font-size: 18px;
}
.submittest-modal{
    position: relative;
    background-color: #fff;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid #999;
    outline: 0;
    -webkit-box-shadow: 0 3px 9px rgba(0,0,0,.5);
    box-shadow: 0 3px 9px rgba(0,0,0,.5);
}
.test-warning{
    text-align: center;
    margin-top: 25px;
    font-size: 22px;
    font-family: JosefinSans-bold;
}
.time-warning{
    text-align: center;
    margin-top: 10px;
    font-size: 18px;
    font-family: Sniglet-Regular;

}
.attempted{
    background: url("../img/attempted.png");
    background-size: cover;
    min-height: 190px;
    /*line-height: 60px;*/
    font-family: JosefinSans-bold;
    background-repeat: round;


}
.unattempted{
    background: url("../img/unattempted.png");
    background-size: cover;
    min-height: 190px;
    /*line-height: 60px;*/
    font-family: JosefinSans-bold;
    background-repeat: round;

}
.test-modal{
    display: table;
    text-align: center;
    vertical-align: middle;
    margin-top: 100px;
}
.attempted-count{
    padding-left: 21%;
    text-align: center;
    padding-top: 45px;
    font-size: 20px;
}
.unattempted-count{
    padding-left: 18%;
    text-align: left;
    padding-top: 45px;
    font-size: 20px;
}
.attempted-count-no{
    padding-left: 21%;
    text-align: center;
    font-size: 48px;
}
.unattempted-count-no{
    padding-left: 25%;
    text-align: left;
    font-size: 48px;
}
.basic-details{
    background-color: #39afd3;
    font-family: Sniglet-Regular;
    color: #fff;
    font-size: 24px;

}
.pro-details{
    background-color: #30bd88;
    font-family: Sniglet-Regular;
    color: #fff;
    font-size: 24px;

}
.adv-details{
    background-color: #f1bc0e;
    font-family:Sniglet-Regular;
    color: #fff;
    font-size: 24px;
}
.examdetails-name{
    font-family: Sniglet-Regular;
    font-size: 24px;
    color: #4c4c4c;
    margin-top: 25px;    
}
.details-tab{
    font-family: Sniglet-Regular;
    font-size: 14px;
    margin-top: 15px;
    background-color: #339eff;
    border: 1px solid #0b71b9;
    border-radius: 15px;
    padding: 7px;
    color: #fff;
    text-align: center;
    /*commented n added by MD*/
    display:inline-block;
    /* width: 500px; */
}
.details-tab-area{
    background-color:#fff;
    box-shadow: 0 0 8px 0 rgba(0,0,0,0.2);
    border-radius: 10px;
    margin-top: 25px;
}
.details-tab>li.active>a, .details-tab>li.active>a:focus, .details-tab>li.active>a:hover {
    color: #fff;
    background-color: #005898;
    text-align: -webkit-center;
    text-align: -moz-center;
    border-radius: 10px;
    padding: 8px 25px;
}
.details-tab>li>a, .details-tab>li>a:focus, .details-tab>li>a:hover {
    color: #fff;
    /*background-color: #0791c0;*/
    padding: 8px 25px;
    border-radius: 10px;
    text-align: -webkit-center;
    text-align: -moz-center;
}
.details-tab>li>a:focus, .details-tab>li>a:hover {
    color: #fff;
    background-color: #005898;
    text-align: -webkit-center;
    text-align: -moz-center;
    padding: 8px 25px;
    border-radius: 10px;
}
.details-tab-menu{
    color: #fff;   
    padding: 8px 25px;
}
.details-tab-menu>li.active>a, .details-tab-menu>li.active>a:focus, .details-tab-menu>li.active>a:hover {
    color: #fff;
    background-color: #0791c0;
    padding: 8px 25px;
    border-radius: 10px;
}
.details-tab li{
    cursor: pointer;
}
.section-title{
     font-family: Sniglet-Regular;
    font-size: 18px;
    color: #484949;
    margin-bottom: 15px;
}
.section-headings{
    display: inline-block;
    border-bottom: 2px #0791c0 solid;
    line-height: 34px;
    margin-bottom: 15px;
}
.rating-section-headings{
    display: inline-block;
    border-bottom: 2px #0791c0 solid;
    line-height: 34px;
    margin-bottom: 15px;
    float: left;
    margin-right: 20px;
}
.btn-detailspage{
    font-family: Sniglet-Regular;
    font-size: 14px;
    margin-top: 15px;
    margin-right: 10px;
    background-color: #39afd3;
    border-radius: 10px;
    border-style: solid;
    border-width: 0px;
    padding: 14px 20px;
    color: #fff;
    text-align: center;
    text-align: -webkit-center;
    text-align: -moz-center;
}
.fav{
    background-color: #f1bc0e;
    font-size: 12px;
}
.fav img{
    /*background-color: #f1bc0e;*/
    max-width: 30px;
}
.rem{
    background-color: #30bd88;
    color: #fff;
    font-size: 12px;
}
.rem img{
    max-width: 30px;
}
.details-right-area{
    background-color:#fff;
    box-shadow: 0 0 8px 0 rgba(0,0,0,0.2);
    border-radius: 10px;
    padding: 10px;
    margin-top: 25px;
}
.detail-titles{
    padding: 5px;
    background-color: #39afd3;
    border-radius: 10px;
    padding: 10px;
    /*margin: 0 15px;*/
    color: #fff;
    font-family: Sniglet-Regular;
    text-align: center;
    margin-bottom: 10px;    
}
.details-title{
    padding: 5px;
    font-size: 18px;
    background-color: #39afd3;
    border-radius: 10px;
    padding: 10px;
    display: inline-block;
    color: #fff;
    font-family: Sniglet-Regular;
    text-align: center;
    margin-bottom: 10px;  
}
.dates{
    font-family: JosefinSans-bold;
    font-size: 16px;
}
.contactlogos{
    font-size: 40px;
    float: left;
    color: #39afd3;
    border: 2px solid #ccc;
    border-radius: 10px;
    padding: 18px;
    margin: 0 10px 30px 0;
}
.img-reviewer{
    width: 85px;
    float: left;
    margin:0 25px; 
}
.reviewer-image{
    display: inline-block;
    vertical-align: top;

}
.reviewer-name{
    font-family: JosefinSans-bold;
    font-size: 20px;
}
.reviewer-info{
    display: inline-block;
}
.review-date{
    font-family: Sniglet-Regular;
    font-size: 16px;
    color: #999999;
    margin-bottom: 10px;

}
.review{
    font-family: Sniglet-Regular;
    font-size: 18px;
    padding: 0 20px;
    /*text-indent: 35px;*/
}
.reviewer-rating{

}
/*By MD : For settings page [vertical menubar]*/
.settingmenu{  
    padding: 17px 17px;
    display:block;
    cursor:pointer;
    font-family: Sniglet-Regular;
    background-color: #bfe530;
    border-bottom: 2px solid #83bf00;
    color:gray;
}
.settingmenu:first-child,.settingmenu:last-child{
    border-radius: 0px;    
}
.settingmenu.active{
    border-left:8px solid #83bf00;
    color:#000;
}
.settingMenubar{
    padding-left: 0px;
    padding-right: 0px;
    margin-left: 20px;
    margin-top: 20px;
}
.menuContent{
    background-color: #fff;
    border-radius:0px;
    /* border:1px solid graytext;
     border-top: 0px;*/
    margin-left: 20px;
    margin-top: 20px;
    padding:0px;
}
.noleftrightpadding{
    padding-left:0px;
    padding-right: 0px;
}

.vcenter {
    display: inline-block;
    vertical-align: middle;
    float: none;
    margin-left: 25px;
}
.profileForm{
    padding:20px;

}
.custButton{
    font-family: Sniglet-Regular;
    font-size: 18px;
    display: inline-block;
    border: 0px solid #ccc;    
    color: #fff;
    background-color: #00afee;
    margin-left: 10%;
    margin-top: 2%;
    height: 35px;
}
.profileTabs>li.active>a,.profileTabs>li.active>a:focus,.profileTabs>li.active>a:hover{
    border:0px;
    border-bottom:2px solid yellow;    
}
.profileTabs>li>a:focus,.profileTabs>li>a:hover{
    /*border:0px;
    border-bottom:2px solid yellow;*/
    color:#000;
    background-color: #fff;
    border:0;    
}
.profileTabs>li{
    margin-bottom:-2px;
    color:#ddd;
}
.profileTabs{
    border-bottom: 2px solid #F5F5F5;
    color:red;
}
.menuContent .form-horizontal .control-label{
    text-align:left
}
.reminder-modal-icon{
    color: #30bd88;
}
.reminder-form{
    font-family: Sniglet-Regular;
    font-size: 18px;
    padding: 30px;
}
.reminder-modal-txt{
    /*color: #30bd88;*/
    font-family: Sniglet-Regular;
    font-size: 18px;
    margin: 0 10px;

}
.modal-save-btn{
    margin:0 0 10px;
    border-radius: 5px;
    padding: 5px 15px 2px 15px;
    font-family: Sniglet-Regular;
    font-size: 18px;    
    /*border-width: 2px;*/
    border-style: none;
    background-color: #30bd88;
    border-color: #1b9a67;
    color: #fff;
}
.submit{
    text-align: center;
}
.reminder-form-div{
    margin: 10px 0;
}
.updates{
    font-family: Sniglet-Regular;
    font-size: 14px;  
    border-right: 1px solid #ddd;
    padding: 0px;
    /*background-color: #DDD;*/
}
.buddylist{
    font-family: Sniglet-Regular;
    font-size: 12px; 
    padding: 0px;
}
.tab-content-updates{
    padding:20px 0;
}
.post-update{
    padding-left: 0px;
}
.announce-btn{
    margin:0 0 10px;
    border-radius: 5px;
    padding: 5px 15px 2px 15px;
    font-family: Sniglet-Regular;
    font-size: 18px;    
    /*border-width: 2px;*/
    border-style: none;
    background-color: #30bd88;
    border-color: #1b9a67;
    color: #fff;
}
.newgroup-btn{
    margin:0 0 10px;
    border-radius: 5px;
    padding: 5px 5px 2px 5px;
    font-family: Sniglet-Regular;
    /*font-size: 18px;*/    
    /*border-width: 2px;*/
    border-style: none;
    background-color: #30bd88;
    border-color: #1b9a67;
    color: #fff;
}
.buddies{
    padding: 10px 0;
    /*border-bottom: 2px solid #30bd88; position: absolute*/
}
.buddysection > li > a::after {
    content: "";
    background: #30bd88; 
    height: 2px; 
    position: absolute;
    width: 100%; 
    left: 0px;
    bottom: -1px;
    transition: all 250ms ease 0s;
    transform: scale(0);
}
.userpost-pic{
    width: 40px;
    height: auto;
    float: left;
}
.userpost-name,
.messageuser-name{
    font-family: Sniglet-Regular;
    font-size: 16px;
    font-weight: 600;
    display: block;
    margin-left: 45px;
}
.messageuser-name{
    margin-top: 10px;
}
.post-description{
    color: #999;
    font-size: 13px;
    display: block;
    margin-left: 50px;

}
.post{
    border: none;
    position: relative;
    border-radius: 3px;
    background: #ffffff;
    border-top: 1px solid #d2d6de;
    /*padding: 2px 10px;*/
    margin-top: 10px;
    margin-bottom: 20px;
    box-shadow: 0px 0px 2px 1px rgba(0,0,0,0.1);
}
.text-post{
    font-family: JosefinSans-bold;
    font-size: 16px;
}
.buddyupdatessection{
    padding: 0px;
    width: 95.66666667%;
}
.user-block{
    /*margin: 10px 0 0 0;*/
    padding: 5px;
}
.user-block-messages{
    margin: 10px 0 0 0;
    padding: 5px;
}
.buddyrequest{
    text-align: left;
    padding: 5px;

}
.buddyrequestname{
    /*    margin-right: 15px;
        float: left;*/
}
.accept-btn{
    /*float: right;*/
    background-color: #fff;
}
.requests{
    margin: 10px 0;
    padding: 10px;
    font-size: 14px;
    text-align: center;    
    background-color: #ddd; 
}
.mybuddylist{
    margin: 10px 0;
    padding: 10px;
    font-size: 14px;
    text-align: center;    
    /*background-color: #ddd;*/ 
}
.box-header {
    color: #444;
    display: block;
    padding: 10px;
    position: relative;
}
.box-header.with-border {
    border-bottom: 1px solid #f4f4f4;
}
.box-body {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
    padding: 10px;
    font-size: 16px;
    font-weight: 600;
}
.box-comments {
    background: #f7f7f7;
}

.box-footer {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
    border-top: 1px solid #f4f4f4;
    padding: 10px;
    background-color: #fff;
}
.box-comments .box-comment:first-of-type {
    padding-top: 0;
}

.box-comments .box-comment {
    padding: 8px 0;
    border-bottom: 1px solid #eee;
}
.img-sm, .box-comments .box-comment img, .user-block.user-block-sm img {
    width: 30px !important;
    height: 30px !important;
}

.img-sm, .img-md, .img-lg, .box-comments .box-comment img, .user-block.user-block-sm img {
    float: left;
}

.box-comments .box-comment img {
    float: left;
}
.box-comments .comment-text {
    margin-left: 40px;
    color: #555;
}
.box-comments .username {
    color: #444;
    display: block;
    font-weight: 600;
}
.box-comments .text-muted {
    font-weight: 400;
    font-size: 12px;
}
.box-footer {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
    border-top: 1px solid #f4f4f4;
    padding: 10px;
    background-color: #fff;
}
.img-sm, .box-comments .box-comment img, .user-block.user-block-sm img {
    width: 30px !important;
    height: 30px !important;
}
.img-sm, .img-md, .img-lg, .box-comments .box-comment img, .user-block.user-block-sm img {
    float: left;
}
.img-sm+.img-push {
    margin-left: 40px;
}
.pad {
    padding: 10px;
}
.box-comment{
    text-align: left;
}
.group-search{
    padding: 0px;
}
.group-labels{
    float: left;
}
.group-input{
    width: 70%;
    margin-left: auto;
}
.group-textarea{
    width: 70%;
    margin-left: auto;
}
/***  Styling added by Aishwarya  ****/
#deleteRatingImg{
    height:25px;
    width:25px;
    float:right;
    cursor:pointer;
}

.modal-register {
    width: 450px;
    margin: 30px auto;
}
.modal-Registration {
    position: relative;
    background-color: #fff;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid #999;
    border: 1px solid rgba(0, 0, 0, .2);
    outline: 0;
    -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
    box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
}
.modal-Registration-input {
    font-family: Sniglet-Regular;
    display: inline-block;
    border: 1px solid #ccc;
    width: 80%;
    font-size: 18px;
    margin: 0 0 3px 15px;
    background-color: white;
    margin-left: 10%;
    margin-top: 2%;
    height: 39px;
    padding-left: 10px;
}
#displayLoginPopup .nav-tabs { border-bottom: 2px solid #DDD; padding-left:0; position:relative}
#displayLoginPopup .nav-tabs > li.active > a,#displayLoginPopup .nav-tabs > li.active > a:focus,#displayLoginPopup .nav-tabs > li.active > a:hover { border-width: 0; }
#displayLoginPopup .nav-tabs > li > a { border: none; color: #666; }
#displayLoginPopup .nav-tabs > li.active > a,#displayLoginPopup .nav-tabs > li > a:hover { border: none; color: #000 !important; background: transparent; }
#displayLoginPopup .nav-tabs > li > a::after { content: ""; background: #ffe210; height: 2px; left: 0px; bottom: -1px; transition: all 250ms ease 0s; transform: scale(0); }
#displayLoginPopup .nav-tabs > li.active > a::after, .nav-tabs > li:hover > a::after { transform: scale(1); }
#displayLoginPopup .tab-nav > li > a::after { background: #21527d none repeat scroll 0% 0%; color: #fff; }
#displayLoginPopup .tab-pane { padding: 0; }
#displayLoginPopup .nav-tabs>li{
    width:50%;
}
#edu-mascot-popup{
    max-width:10%;
}

/*select:disabled{
    background: #e5e5e5;
}
 Code for login popup

.selectPopup {
    position: relative;
    display: inline-block;
    width: 100%;
    margin-bottom: 15px;
}

.selectPopup select {
    color: #a9a9a9;
    font-family: Sniglet-Regular;
    display: inline-block;
    border: 1px solid #ccc;
    width: 80%;
    font-size: 18px;
    margin: 0 0 3px 15px;
    background-color: white;
    margin-left: 10%;
    margin-top: 2%;
    height: 39px;
    padding-left: 10px;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
}
.selectPopup select::-ms-expand {
    display: none;
}
.select__arrowpopup {
    position: absolute;
    top: 45%;
    right: 14%;
    	width: 0;
            height: 0;
    pointer-events: none;
    border-width: 8px 5px 0 5px;
    border-style: solid;
    border-color: #7b7b7b transparent transparent transparent;
}

.selectPopup select:hover ~ .select__arrow,
.selectPopup select:focus ~ .select__arrow {
    border-top-color: #000;
}

.radio-toolbar input[type="radio"] {
    display:none; 
}

.radio-toolbar label {
    font-family: Sniglet-Regular;
    display: inline-block;
    color: #aeaeae;
    border: 1px solid #ccc;
    width: 35%;
    font-size: 16px;
    font-weight: 300;
    margin: 0 0 3px 15px;
    background-color: white;
    margin-left: 10%;
    margin-top: 2%;
    height: 39px;
    text-align: center;
    padding-top: 2%;
            display:inline-block;
            background-color:#ddd;
            padding:4px 11px;
            font-family:Arial;
            font-size:16px;
}
.radio-toolbar label:hover {
    font-family: Sniglet-Regular;
    display: inline-block;
    color: #fff;
    border: 1px solid #ccc;
    width: 35%;
    font-size: 16px;
    font-weight: 300;
    margin: 0 0 3px 15px;
    background-color: #00afee;
    margin-left: 10%;
    margin-top: 2%;
    height: 39px;
    text-align: center;
    padding-top: 2%;
    padding-left: 10px;
}


.radio-toolbar input[type="radio"]:checked + label { 
    background-color:#00afee;
    color: #fff;
}

.radio-cat input[type="radio"]:checked + label { 
    border-color:#00afee;
    border-width: 2px;
    color: #fff;
}

.radio-cat input[type="radio"] {
    display:none; 
}

.radio-cat label {
    font-family: Sniglet-Regular;
    display: inline-block;
    color: #aeaeae;
    border: 1px solid #ccc;
    width: 30%;
    font-size: 14px;
    font-weight: 300;
    margin: 0 0 3px 15px;
    background-color: white;
    margin-left: 12.5%;
    margin-top: 2%;
    height: 100px;
    text-align: center;
    padding-top: 81px;
    padding-left: 10px;
}
.radio-cat label:hover {

    font-family: Sniglet-Regular;
    display: inline-block;
    color: #000;
    border: 2px solid;
    width: 30%;
    font-size: 14px;
    font-weight: 300;
    margin: 0 0 3px 15px;
    border-color: #00afee;
    margin-left: 12.5%;
    margin-top: 2%;
    height: 100px;
    text-align: center;
    padding-top: 81px;
    padding-left: 10px;
}

.modal-Registration-student {
    font-family: Sniglet-Regular;
    display: inline-block;
    color: #aeaeae;
    border: 1px solid #ccc;
    background: url(../img/student.png);
    background-repeat: no-repeat;
    background-size: 70%;
    background-position-x: 20px;
    width: 35%;
    font-size: 14px;
    font-weight: 300;
    margin: 0 0 3px 15px;
    background-color: white;
    margin-left: 10%;
    margin-top: 2%;
    height: 39px;
    text-align: center;
    padding-top: 81px;
    padding-left: 10px;
}
.modal-Registration-student:hover {
    font-family: Sniglet-Regular;
    display: inline-block;
    color: #000;
    border-width: 2px;
    background: url(../img/student.png);
    background-repeat: no-repeat;
    background-size: 70%;
    background-position-x: 20px;
    width: 35%;
    font-size: 14px;
    font-weight: 300;
    margin: 0 0 3px 15px;
    border-color: #00afee;
    margin-left: 10%;
    margin-top: 2%;
    height: 39px;
    text-align: center;
    padding-top: 81px;
    padding-left: 10px;
}
.modal-Registration-parent {
    font-family: Sniglet-Regular;
    display: inline-block;
    color: #aeaeae;
    border: 2px solid #ccc;
    background: url(../img/parent.png);
    background-repeat: no-repeat;
    background-size: 70%;
    background-position-x: 20px;
    width: 35%;
    font-size: 14px;
    font-weight: 300;
    margin: 0 0 3px 15px;
    background-color: white;
    margin-left: 10%;
    margin-top: 2%;
    height: 39px;
    text-align: center;
    padding-top: 81px;
    padding-left: 10px;
}
.modal-Registration-parent:hover {
    font-family: Sniglet-Regular;
    display: inline-block;
    color: #000;
    border: 2px solid ;
    background: url(../img/parent.png);
    background-repeat: no-repeat;
    background-size: 70%;
    background-position-x: 20px;
    width: 35%;
    font-size: 14px;
    font-weight: 300;
    margin: 0 0 3px 15px;
    border-color: #00afee;
    margin-left: 10%;
    margin-top: 2%;
    height: 39px;
    text-align: center;
    padding-top: 81px;
    padding-left: 10px;
}

.modal-Registration-checkbox {
    font-family: Sniglet-Regular;
    display: inline-block;
    border: 1px solid #ccc;
    width: 80%;
     padding: 0.4% 0; 
    font-size: 20px;
    background-color: white;
    margin-left: 10%;
    margin-top: 2%;
    height: 35px;
}
.modal-Login-checkbox {
    font-family: Sniglet-Regular;
    display: inline-block;
    border: 1px solid #ccc;
    width: 80%;
     padding: 0.4% 0; 
    font-size: 20px;
    background-color: white;
    margin-left: 15%;
    margin-top: 2%;
    height: 35px;
}
.checkbox-custom, .radio-custom {
    opacity: 0;
    position: absolute;   
}
.checkbox-custom, .checkbox-custom-label, .radio-custom, .radio-custom-label {
    display: inline-block;
        vertical-align: middle;
    margin: 5px;
    cursor: pointer;
}
input[type="checkbox"] {
     margin: 4px 0 0; 
    margin-top: 1px \9;
    line-height: normal;
}

.checkbox-custom-label, .radio-custom-label {
    position: relative;
    font-size: 13px;
    font-weight: 300;
    font-family: Sniglet-Regular;
}
.terms{
    color: #00afee;
}
.checkbox-custom + .checkbox-custom-label:before, .radio-custom + .radio-custom-label:before {
    content: '';
    background: #fff;
    border: 1px solid #ddd;
    display: inline-block;
    vertical-align: middle;
    width: 20px;
    height: 20px;
    padding: 2px;
    margin-right: 10px;
    text-align: center;
}

.checkbox-custom:checked + .checkbox-custom-label:before,.radio-custom:checked + .radio-custom-label:before {
    background: #00afee;
}

.radio-custom + .radio-custom-label:before {
    border-radius: 50%;
}




.checkbox-custom:focus + .checkbox-custom-label, .radio-custom:focus + .radio-custom-label {
    outline: 1px solid #ddd;  focus style 
}

.btn-login{
    font-family: Sniglet-Regular;
    font-size: 18px;
    display: inline-block;
    border: 0px solid #ccc;
    width: 70%;
    color: #fff;
    background-color: #00afee;
    margin-left: 15%;
    margin-top: 2%;
    height: 35px;
}
.btn-register{
    font-family: Sniglet-Regular;
    font-size: 18px;
    display: inline-block;
    border: 0px solid #ccc;
    width: 80%;
    color: #fff;
    background-color: #00afee;
    margin-left: 10%;
    margin-top: 2%;
    height: 35px;
}

.modal-Login-input {
    font-family: Sniglet-Regular;
    display: inline-block;
    border: 1px solid #ccc;
    width: 70%;
     padding: 0.4% 0; 
    font-size: 18px;
    background: url(../img/user.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position-x: 10px;
    margin: 0 0 10px 15px;
    background-color: white;
    margin-left: 15%;
    margin-top: 2%;
    height: 39px;
    padding-left: 60px;
}
.modal-Password-input {
    font-family: Sniglet-Regular;
    display: inline-block;
    border: 1px solid #ccc;
    width: 70%;
     padding: 0.4% 0; 
    font-size: 18px;
    background: url(../img/password.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position-x: 10px;
    margin: 0 0 5px 15px;
    background-color: white;
    margin-left: 15%;
    margin-top: 2%;
    height: 39px;
    padding-left: 60px;
}

.modal-Registration-input {
    font-family: Sniglet-Regular;
    display: inline-block;
    border: 1px solid #ccc;
    width: 80%;
     padding: 0.4% 0; 
    font-size: 18px;
        background: url(../img/password.png);
        background-repeat: no-repeat;
        background-size: contain;
        background-position-x: 10px;
    margin: 0 0 3px 15px;
    background-color: white;
    margin-left: 10%;
    margin-top: 2%;
    height: 39px;
    padding-left: 10px;
}

.login-form{
    padding: 5px 15px;
    font-weight: 100;
    font-size: 18px;
    font-family: Sniglet-Regular;
    margin-top: 2px;
    margin-bottom: 2px;
}
.modal-fgtpwd {
    font-family: Sniglet-Regular;
    display: inline-block;
    border: 1px solid #ccc;
    width: 50%;
     padding: 0.4% 0; 
    font-size: 18px;
    background-color: white;
    margin-left: 35%;
    margin-top: 2%;
    height: 39px;
    padding-left: 50px;
}
.fgtpwd{
    padding: 5px 15px;
    color: #00afee;
    margin-left: auto;
    margin-right: auto;
    font-weight: 100;
    font-size: 14px;
    font-family: Sniglet-Regular;
    margin-top: 2px;
    margin-bottom: 2px;
}

.registration-logo{
    display: block;
    max-width: 15%;
    height: auto;
    margin: auto;
}
.modal-Login {
    position: relative;
    background-color: #fff;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid #999;
    border: 1px solid rgba(0, 0, 0, .2);
    border-radius: 6px;
    outline: 0;
    -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
    box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
}

.create-account-way {
    font-family: Sniglet-Regular;
    font-size: 17px;
    display: inline-block;
    font-weight: 500;
    margin-left: 40%;
    margin-right: auto;
    vertical-align: text-top;
}*/
.landingDialogs {
    width: 450px;
    margin: 30px auto;
    margin-top: 150px;
}
.blog-title{
    font-weight:500;
}
.modal-Login, .blogmodal {
    font-family: Sniglet-Regular;
    position: relative;
    background-color: #fff;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid #67b502;	
    box-shadow: 0 0 0 17px #83bf00;
    -webkit-box-shadow: 0 0 0 17px #83bf00;
    -moz-box-shadow: 0 0 0 17px #83bf00;
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    border-radius: 5px;
    padding: 10px 20px 10px 20px;
}


.login-title{
    text-align: center;
    font-size: 25px;
    margin-bottom: 10px;
}

#forgotTitle{
    margin-bottom: 20px;
}

.modal-Registration {
    font-family: Sniglet-Regular;
    position: relative;
    background-color: #fff;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid #005899;	
    box-shadow: 0 0 0 17px #339eff;
    -webkit-box-shadow: 0 0 0 17px #339eff;
    -moz-box-shadow: 0 0 0 17px #339eff;
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    border-radius: 5px;
    padding: 10px 30px 10px 0;
}
.login-close-img{
    position: absolute;
   left:calc(100% - 30px);
    bottom:calc(100% - 30px);  
    cursor: pointer;
    opacity:1;
}
.login-close-img img{
    width:initial;
}
.register-close-img{
    position: absolute;
    left:calc(100% - 30px);
    bottom:calc(100% - 30px);  
    cursor: pointer;
    opacity:1;
}
.register-close-img img{
    width: initial;
}
.forgot-close-img{
    position: absolute;
    left:calc(100% - 30px);
    bottom:calc(100% - 30px);  
    cursor: pointer;
    opacity:1;
}
.forgot-close-img img{
    width: initial;
}
.register-popup-close-img{
    position: absolute;
   left:calc(100% + 5px);
    bottom:calc(100% - 20px);  
    cursor: pointer;
    opacity:1;
}
.register-popup-close-img img{
    width: initial;
}
.login-popup-close-img{
    position: absolute;
    left:calc(100% + 5px);
    bottom:calc(100% - 20px);  
    cursor: pointer;
    opacity:1;
}
.login-popup-close-img img{
    width:initial;
}
.modal-Login-input {
    display: inline-block;
    border: 1px solid #7dcc00;
    border-radius: 12px;
    width: 100%;
    font-size: 18px;
    background-color: white;
    height: 39px;
    padding-left: 10px;
}

.modal-Password-input {
    display: inline-block;
    border-radius: 12px;
    border: 1px solid #7dcc00;
    width: 100%;
    font-size: 18px;
    background-color: white;
    height: 39px;
    padding-left: 10px;
}

.modal-Registration-input {
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 12px;
    width: 100%;
    font-size: 18px;
    margin: 0 0 5px 15px;
    background-color: white;
    margin-top: 1%;
    height: 39px;
    padding-left: 10px;
}

.login-form{
    padding: 5px 15px;
    font-weight: 100;
    font-size: 18px;
    font-family: JosefinSans-regular;
    margin-top: 2px;
    margin-bottom: 2px;
}
.modal-fgtpwd {
    font-family: Sniglet-Regular;
    display: inline-block;
    width: 50%;
    background-color: white;
    margin-left: 33.5%;
    margin-top: 2%;
}
.fgtpwd{
    padding: 5px 15px;
    color: #7dcc00;
    margin-left: auto;
    margin-right: auto;
    font-weight: 100;
    font-size: 14px;
    margin-top: 2px;
    margin-bottom: 2px;
}
.fgtpwdpopup{
    padding: 5px 25px;
    color: #339eff;
    margin-left: auto;
    margin-right: auto;
    font-weight: 100;
    font-size: 14px;
    margin-top: 2px;
    margin-bottom: 2px;
}
.login-logo{
    display: block;
    max-width: 13.5%;
    margin:0 0 0 15px;
    height: auto;

}
.modal-Registration-checkbox {
    display: inline-block;
    width: 80%;
    background-color: white;
    margin-left: 5%;
    margin-top: 3%;
}
.modal-Login-checkbox {
    display: inline-block;
    width: 80%;
    background-color: white;
    margin-top: 2%;
    margin-left: 5%;
}
.checkbox-custom, .radio-custom {
    opacity: 0;
    position: absolute;   

}
.checkbox-custom, .checkbox-custom-label, .radio-custom, .radio-custom-label {
    display: inline-block;
    vertical-align: middle;
    /*margin: 5px;*/
    cursor: pointer;

}
input[type="checkbox"] {
    margin-top: 1px \9;
    line-height: normal;
}

.checkbox-custom-label, .radio-custom-label {
    position: relative;
    font-size: 18px;
    font-weight: 300;
}
.terms{
    color: #00afee;
}

/*New*/
.checkbox-custom + .checkbox-custom-label:before, .radio-custom + .radio-custom-label:before {
    content: '';
    background: #fff;
    border: 1px solid #7dcc00;
    display: inline-block;
    vertical-align: middle;
    width: 20px;
    height: 20px;
    padding: 2px;
    margin-right: 10px;
    text-align: center;
    border-radius: 4px;
}
/*New*/
.checkbox-custom:checked + .checkbox-custom-label:before {
    background: #7dcc00;
}
/*New*/
.checkbox-custom + #regi-custom-label:before{
    border: 1px solid #339eff;
}
/*New*/
.checkbox-custom:checked + #regi-custom-label:before {
    background: #339eff;
}
.radio-custom + .radio-custom-label:before {
    border-radius: 50%;
}

.radio-custom:checked + .radio-custom-label:before {
    background: #bfe530;
}


.checkbox-custom:focus + .checkbox-custom-label, .radio-custom:focus + .radio-custom-label {
    /*outline: 1px solid #ddd;  focus style */
}

/*New*/
.btn-login{
    font-size: 18px;
    display: inline-block;
    border: 0px solid #7dcc00;
    border-radius: 10px;
    width: 30%;
    color: #fff;
    background-color: #7dcc00;
    margin-left: 37%;
    height: 35px;
}
.btn-register{
    font-size: 18px;
    display: inline-block;
    border: 0px solid #157fce;
    border-radius:10px;
    width: 38%;
    color: #fff;
    background-color: #157fce;
    margin-left: 35%;
    margin-top: 4%;
    height: 40px;
}

select option:hover {
    box-shadow: 0 0 10px 100px #000 inset;
}

ar {
    margin-top: -10px;
    margin-right: 70px;
    margin-bottom: 10px;
    margin-left: 125px;
    border-top-width: 2px;
    border-top-style: solid;
    border-top-color: #00afee;
    display: block;
    /*    -webkit-margin-before: 0.5em;
        -webkit-margin-after: 0.5em;
        -webkit-margin-start: auto;
        -webkit-margin-end: auto;*/
}
/*New*/
.category-title{
    margin-left: 25px;
    margin-right: 6px;
}
.catDiv{
   /* margin-top: 20px;*/
}
.usertypeDiv{
   /* margin-bottom: 25px;*/
}

.radio-toolbar input[type="radio"] {
    display:none; 
}
.radio-toolbar label {
    display: inline-block;
    color: #aeaeae;
    border: 1px solid #ccc;
    border-radius: 10px;
    width: 34%;
    font-size: 14px;
    font-weight: 300;
    background-color: white;
    margin-top: 2%;
    height: 39px;
    text-align: center;
    padding-top: 2%;
}
/*New*/
.radio-toolbar label:hover {
    display: inline-block;
    color: #fff;
    border: 1px solid #ccc;
    border-radius: 10px;
    width: 34%;
    font-size: 14px;
    font-weight: 300;
    background-color: #ffa300;
    margin-top: 2%;
    height: 39px;
    padding-top: 2%;
}

.radio-toolbar input[type="radio"]:checked + label { 
    background-color:#ffa300;
    border:1px solid #ff8500;
    color: #fff;
}
.radio-toolbar #UGPG:hover { 
    background-color:greenyellow;
    border:1px solid #4d7c03;
    color: #fff;
}
.modal-Registration-student{
    margin-left: 2.5px;
}

.modal-Registration-parent{
    margin-left: 12px;
}

.radio-toolbar #radio2:checked + label{
    background-color:greenyellow;
    border:1px solid #4d7c03;
    color: #fff;
}

.radio-cat input[type="radio"]:checked + label { 
    border-color:#00afee;
    border-width: 2px;
}

.radio-cat input[type="radio"] {
    display:none; 
}

.radio-cat label {
    font-family: JosefinSans-regular;
    display: inline-block;
    color: #aeaeae;
    border: 1px solid #ccc;
    width: 30%;
    font-size: 14px;
    font-weight: 300;
    margin: 0 0 3px 15px;
    background-color: white;
    margin-left: 12.5%;
    margin-top: 2%;
    height: 100px;
    text-align: center;
    padding-top: 81px;
    /*padding-left: 10px;*/
}
.radio-cat label:hover {

    font-family: JosefinSans-regular;
    display: inline-block;
    color: #000;
    border: 2px solid;
    width: 30%;
    font-size: 14px;
    font-weight: 300;
    margin: 0 0 3px 15px;
    border-color: #00afee;
    margin-left: 12.5%;
    margin-top: 2%;
    height: 100px;
    text-align: center;
    padding-top: 81px;
    /*padding-left: 10px;*/
}
/*.modal-Registration-student {
    font-family: JosefinSans-regular;
    display: inline-block;
    color: #aeaeae;
    border: 1px solid #ccc;
    background: url(../img/student.png);
    background-repeat: no-repeat;
    background-size: 70%;
    background-position-x: 20px;
    width: 35%;
    font-size: 14px;
    font-weight: 300;
    margin: 0 0 3px 15px;
    background-color: white;
    margin-left: 10%;
    margin-top: 2%;
    height: 39px;
    text-align: center;
    padding-top: 81px;
    padding-left: 10px;
}
.modal-Registration-student:hover {
    font-family: JosefinSans-regular;
    display: inline-block;
    color: #000;
    border-width: 2px;
    background: url(../img/student.png);
    background-repeat: no-repeat;
    background-size: 70%;
    background-position-x: 20px;
    width: 35%;
    font-size: 14px;
    font-weight: 300;
    margin: 0 0 3px 15px;
    border-color: #00afee;
    margin-left: 10%;
    margin-top: 2%;
    height: 39px;
    text-align: center;
    padding-top: 81px;
    padding-left: 10px;
}
.modal-Registration-parent {
    font-family: JosefinSans-regular;
    display: inline-block;
    color: #aeaeae;
    border: 2px solid #ccc;
    background: url(../img/parent.png);
    background-repeat: no-repeat;
    background-size: 70%;
    background-position-x: 20px;
    width: 35%;
    font-size: 14px;
    font-weight: 300;
    margin: 0 0 3px 15px;
    background-color: white;
    margin-left: 10%;
    margin-top: 2%;
    height: 39px;
    text-align: center;
    padding-top: 81px;
    padding-left: 10px;
}
.modal-Registration-parent:hover {
    font-family: JosefinSans-regular;
    display: inline-block;
    color: #000;
    border: 2px solid ;
    background: url(../img/parent.png);
    background-repeat: no-repeat;
    background-size: 70%;
    background-position-x: 20px;
    width: 35%;
    font-size: 14px;
    font-weight: 300;
    margin: 0 0 3px 15px;
    border-color: #00afee;
    margin-left: 10%;
    margin-top: 2%;
    height: 39px;
    text-align: center;
    padding-top: 81px;
    padding-left: 10px;
}*/

select:disabled{
    background: #e5e5e5;
}
/* Code for login popup*/

.selectPopup {
    position: relative;
    display: inline-block;
    width: 100%;
    /*margin-bottom: 15px;*/
}

.selectPopup select {
    color: #a9a9a9;
    font-family: JosefinSans-regular;
    display: inline-block;
    border: 1px solid #ccc;
    width: 80%;
    font-size: 18px;
    margin: 0 0 3px 15px;
    background-color: white;
    margin-left: 10%;
    margin-top: 2%;
    height: 39px;
    padding-left: 10px;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
}
.selectPopup select::-ms-expand {
    display: none;
}
.select__arrowpopup {
    position: absolute;
    top: 45%;
    right: 14%;
    /*	width: 0;
            height: 0;*/
    pointer-events: none;
    border-width: 8px 5px 0 5px;
    border-style: solid;
    border-color: #7b7b7b transparent transparent transparent;
}

.selectPopup select:hover ~ .select__arrow,
.selectPopup select:focus ~ .select__arrow {
    border-top-color: #000;
}

.selectRegi {
    position: relative;
    display: inline-block;
    width: 100%;
}

.selectRegi select {
    color: #a9a9a9;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 12px;
    width: 80%;
    font-size: 18px;
    margin: 0 0 3px 15px;
    background-color: white;
    margin-top: 2%;
    height: 37px;
    padding-left: 10px;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
}
.selectRegi .select__arrow {
    position: absolute;
    top: 45%;
    right: 18%;
    pointer-events: none;
    border-width: 8px 5px 0 5px;
    border-style: solid;
    border-color: #7b7b7b transparent transparent transparent;
}

.selectRegi select:hover ~ .select__arrow,
.selectRegi select:focus ~ .select__arrow {
    border-top-color: #000;
}
.sampletest-link{
    text-align: center;
}

/*blog image*/
.thumb128 {
    width: 128px !important;
    height: 128px !important;
}

/****************Tuition category*****************/
.tuitionCategory{
    font-family:Sniglet-Regular;
    text-align: center;
    margin-top: 7px;
}
.login-popup{
    padding: 0px;
}

#profile_pic{
    max-height:150px;
    max-width:150px;
}

/*  Header  */
.username{
    display: inline-block;
    color: #4c4c4c;
    font-family: Sniglet-Regular;
    font-size: 16px;
}

/*By MD for std btns on exam details page */
.std.stdbtn.selected{
    background-color: #30bd88;
    color:#fff;
}
/***********/
.homi-question-paper{
    min-height: 550px;
}

/**************MAIN MENUBAR new design changes by MD *****************/
.menubar{
    background-color: #ffe315; /*Rohini has given this code "#ffe315" but it is not alike */
    width:100%;
    font-family: Sniglet-Regular;
    border-bottom: 5px solid #ffa300;
}

.menubar .menus{
    min-width: 125px;
    text-align: center;
    font-family: Sniglet-Regular;
    background-color: #ffe315; /*Rohini has given this code "#ffe315" but it is not alike */
    border-right:3px solid  #ffa300;
    /*border-bottom:5px solid  #ffa300;*/
    font-weight:bolder;
    color:#000;    
    font-size:16px;
}

.menubar>li>a{
    color: #000;
    font-family: Sniglet-Regular;
}

.menubar .menus :hover,.menubar .active{
    background-color: #ffbf0d;         
    font-family: Sniglet-Regular;
}
/************************************************************************************/
/********************  technews landing Aishwarya ***********************/
.techDiv{
    padding: 0;
    position: relative;
}
.technewsDivMain{
    position: relative;
    height:100%;
    /*    min-height: 35em;*/
    background: url(../img/tech-news1.png);
    background-repeat: no-repeat;
    background-size: 100%;
    padding: 0 6.5% 0 2%;
    overflow: hidden;
    width:97%;
    left: 0;
}

.technewsSubDiv{
    padding: 0 6.5% 0 2%;
}

.technewsBlocks{
    left: 0;
    width:33.33%;
    font-family: Sniglet-Regular;
    height:100%;
    padding: 0 12px;
    float: left;
    min-height: 35em;
    background: url(../img/news-panel.png);
    background-repeat: no-repeat;
    background-size: 91%;
}
.technewsspan{
    overflow: hidden;
    margin-top: 10px;
    text-overflow: ellipsis;
    display: -webkit-box;
    line-height: 20px;
    color: #000000;
    max-height: 60px;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
.technewsBlocks a > div{
    padding: 3px 5px 15px 5px;
    margin-top: 100px;
    color: black;
    word-wrap: break-word;
    width:90%;
    font-size: 16px;
}

.techimg{
    width: 155px;
    height: 120px;
   /* margin-bottom: -15px;*/
}

#seeall{
    position: absolute;
    top: 69%;  
    outline: 0;
    width: 75%;
    height: 100%;
    text-indent: -9999px;
    z-index: 9;
    left: 79.5%;
    background: url(../img/seeall.png) no-repeat;
    background-size: 17.5%;
}

@media screen and (min-width: 1500px){
    #seeall {
        top: 84%;  
    }
}


/* Code by Sunil for today feature, fun fact, thoughts and word of day */

/* Code by Sunil */
#featureTitle{
    position: absolute;
    top: 22%;
    word-wrap:break-word;
    left: 10%;
    right:10%;
    font-size: 18px;
    font-weight: bold;
    color: #000000;
}

#featureContent{
    position: absolute;
    top: 35%;
/*    margin-top:15px;  */
    left: 10%;
    font-size: 16px;
    /*max-width: auto;*/
  /*  padding-right: 10%; */ 
    color: #000000;
max-height:48%;
width:80%;
overflow-y:auto;
}

#featureImage{
   /* position: absolute;
    top: 22%;
    left: 55%; */
    max-width: 35%;
    max-height: 60%;
float:right;
}

#funfactContent{
    position: absolute;
    top: 25%;
    left: 20%;
    font-size: 16px;
    max-width: 60%;
    height: 45%;
    color: #000000;
    overflow-y:auto;
}

#recommendationContent{
    position: absolute;
    font-family: sniglet-Regular;
    top: 30%;
    left: 20%;
    overflow:hidden;
    overflow-y:auto;
    font-size: 16px;
    max-width: 65%;
    height: 60%;
    color: #000000;
}

#wordTitle{
    position: absolute;
    top: 11%;
    left: 10%;
    font-size: 36px;
    max-width: 80%;
    max-height: 55%;
    color: yellow;
}

#wordMeaning{
    position: absolute;
    top: 18%;
    left: 10%;
    font-size: 22px;
    max-width: 80%;
    height: 55%;
    color: #FFFFFF;
}

#wordExample{
    position: absolute;
    top: 32%;
    left: 15%;
    font-size: 18px;
    max-width: 70%;
    height: 50%;
    color: #000000;
}

#wordEg{
    border: none;
    outline: none;
}

#wordSubmit{
    position: absolute;
    top: 49%;
    left: 35%;
    border-radius: 30px;
    background-color: yellow;
    min-width: 30%;
    font-size: 18px;
    font-weight: bold;
    box-shadow: 2px 5px 5px 0px #ffbf0d;
}

#sentenceCount{
    position: absolute;
    top: 59%;
    left: 19%;
    border-radius: 30px;
    background-color: yellow;
    min-width: 60%;
    padding: 8px 25px;
    text-align: center;
    font-size: 18px;
    font-weight: bold;
}

#sentenceContainer{
    position: absolute;
    font-family: Sniglet-Regular;
    top: 67%;
    left: 15%;
    max-width: 75%;
    height: 27%;
    font-size: 16px;
    overflow-y: -moz-scrollbar-none;
    overflow-x: hidden;
}

#quoteContent{
    position: absolute;
    top: 20%;
    left: 15%;
    font-size: 18px;
    max-width: 70%;
    max-height: 50%;
    color: #FFFFFF;
}
.sentence{
        padding-bottom: 10px;
}
.sentence:before{
  content : "";
  position: absolute;
  left    : 0;
  bottom  : 0;
  height  : 1px;
  width   : 80%; 
  border-bottom: 1px solid #e6e6e6;
}

/*#featureLike{
    position: absolute;
    top: 83%;
    left: 59%;
    background-color: #2196f3;
    height: 14%;
    width: 10%;
    border-radius: 10px;
}*/

#featureShare{
    position: absolute;
    top: 83%;
    left: 71%;
    background-color: #005899;
    height: 14%;
    width: 10%;
    border-radius: 10px;
    display: inline;
    cursor: pointer;
}

.gi-2x
{
    top: 10px;
    left: 18%;
    font-size: 2.5em;
    color: #FFFFFF;
    border: none;
}

#funFactShare{
    position: absolute;
    top: 8%;
    left: 81%;
    background-color: #cc2211;
    height: 13%;
    width: 18%;
    border-radius: 10px;
    display: inline;
    cursor: pointer;
}

#thoughts{
    position: absolute;
    top: 15%;
    left:10%;
    right:10%;
    font-family:Sniglet-Regular;
    color: #FFFFFF;
    font-size: 20px;
}

.todayDate{
    color: #023568;
    font-size: 14px;
    font-weight: bold;
}

.todayTitle{
    color: #339eff;
    font-size: 20px;
    font-weight: bold;
}

.todayImage{
    height: 90%;
    width: 90%;
}

/******************  Announcements   ***********************/
#announcements .carousel{
    margin-top: 37%;
    font-family: Sniglet-Regular;
}
#announcements .carousel-inner.vertical {
    height: 50%; 
}
#announcements .carousel-inner.vertical > .item {
    -webkit-transition: .6s ease-in-out top;
    -o-transition: .6s ease-in-out top;
    transition: .6s ease-in-out top;
}


#announcements .carousel-inner.vertical > .item > .notificationsBlocks{
    margin-bottom: -15px;
    width:100%;
    height:7.7em;
    padding:10px 30px 0 12px;
    background: url(../img/panel.png);
    background-repeat: no-repeat;
    background-size: 100%;

}

@media screen and (min-width: 1500px){
    #announcements .carousel-inner.vertical > .item > .notificationsBlocks{
        height:9em;
    }
}
#announcements .notiHeader{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 95%;
}
#announcements .notiContent{
    overflow: hidden;
    word-wrap: break-word;
    width: 95%;
    height: 3em;
}

@media all and (transform-3d),
(-webkit-transform-3d) {
    #announcements .carousel-inner.vertical > .item {
        -webkit-transition: -webkit-transform .6s ease 0s;
        -o-transition: -o-transform .6s ease 0s;
        transition: transform .6s ease 0s;
        -webkit-perspective: 1000;
        perspective: 1000;
    }

    #announcements .carousel-inner.vertical > .item.next,
    #announcements .carousel-inner.vertical > .item.active.right {
        -webkit-transform: translate3d(0, 33.33%, 0);
        transform: translate3d(0, 33.33%, 0);
        top: 0;
    }
    #announcements .carousel-inner.vertical > .item.prev,
    #announcements .carousel-inner.vertical > .item.active.left {
        -webkit-transform: translate3d(0, -33.33%, 0);
        transform: translate3d(0, -33.33%, 0);
        top: 0;
    }
    #announcements .carousel-inner.vertical > .item.next.left,
    #announcements .carousel-inner.vertical > .item.prev.right,
    #announcements .carousel-inner.vertical > .item.active {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        top: 0;
        transform-style: preserve-3d;

    }
}
#announcements .carousel-inner.vertical > .active {
    top: 0;
}
#announcements .carousel-inner.vertical > .next.left,
#announcements .carousel-inner.vertical > .prev.right {
    top: 0;
}
#announcements .carousel-inner.vertical > .active.left {
    left: 0;
    top: 33.33%;
    right:0;
}
#announcements .carousel-inner.vertical > .active.right {
    left: 0;
    top: 33.33%;
    right:0;
}

#announcements #carousel-pager .carousel-control.left {
    top: 100%;
    background:transparent;
    /*    padding-left: 23%;*/
    margin-left:30%;
}
#announcements #carousel-pager .carousel-control.right {
    top: 100%;
    background:transparent;
    /*    padding-left: 43%;*/
    margin-right: 40%;
}
#announcements #carousel-pager .carousel-control{
    opacity: 1;
    position: absolute;
    left: auto;
    width: 12%;
}
#announcements #carousel-pager .carousel-control img{
    width: initial;
}

.announcementsImg{
    z-index: 999;
    position: absolute;
    margin: 38px 0 0 -10px;
}

.notificationsBlocks a{
    color: black;
    font-size: 16px;
}

#wordAll{
    position: absolute;
    top: 1.5%;
    left: 70%;
    background-color: #ffa300;
    border-radius: 20px;
    color: yellow;
}

#seeAllDiv{
    position: absolute;
    top: 71%;
    left: 49%;
    font-size: 36px;
    text-decoration: none;
    color: #FFFFFF;
}

#blog1ModalLink{
    position: absolute;
    top: 8%;
    left: 17%;
    font-size: 1.7em;
    transform: rotate(2deg);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    word-wrap: break-word;
    width:65%;
}

#blog2ModalLink{
    position: absolute;
    top: 29%;
    left: 32%;
    font-size: 1.4em;  
    transform: rotate(4deg);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 55%;
}

#blog3ModalLink{
    position: absolute;
    top: 50%;
    left: 32%;
    font-size: 1.4em;
    transform: rotate(8deg);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 55%;   
}
#blog1ModalLink a,#blog2ModalLink a,#blog3ModalLink a{
color: #FFFFFF;
text-decoration: none;
font-family:Sniglet-Regular;
} 
@media screen and (min-width: 1500px){
    #blog3ModalLink,#blog2ModalLink{
    font-size: 1.7em;
}
#blog1ModalLink{
    font-size: 2em;
}
}
/* Code by Asharani for poll functionality */
.poll{
    background-image: url(../img/poll.png);

    background-size: 100%;
    margin-top: 25px;
    background-repeat: no-repeat;
}
.pollcontent{
    position: absolute;
    top: 25%;
    left: 10%;
    font-size:15px;                  
    font-family:Sniglet-Regular;
    color:white;
    padding-left:2px; 
    overflow:hidden;
    
}


.pollbtn{   
    width:100px;
    height:40px;    
    /*    border-color:#bfd300; */
    font-size:15px;                              
    border-radius:15px;
    background-color:#bfd300;  
    margin-left: 30%;
}
.pollqt{
    width:90%;
    right: 10%;
    margin-bottom:10px; 
}
.polloptions{
    
    top:20%;
    right: 10%;
}
.section input[type='radio'] {
    margin:0px 10px;

    -webkit-appearance:none;
    width:20px;
    height:20px;
    border:1px solid darkgray;
    border-radius:50%;
    outline:none;
    background: #fff;
    box-shadow:0 0 5px 0px gray inset;
}
.section input[type='radio']:before {

    margin:2px 10px;

    content:'';
    display:block;
    width:60%;
    height:60%;
    margin: 20% auto;    
    border-radius:50%;    
}

.section input[type='radio']:checked:before {
    position: relative;   

    background:#bfd300;
}
.percolor{
    color:black;
}


.gkhead{
    position: absolute;
    top: 7%;
    left: 10%;
    color:#fff;
    font-family:Sniglet-Regular;
    text-align: center;
}
.gkdetails{
    position: absolute;
    top: 25%;
    left: 10%;

    width: 260px;
    height:230px;
    display: inline-block;
    word-wrap: break-word;
    font-size:15px;                  
    font-family:Sniglet-Regular;

    padding-left:2px; 
    overflow:hidden;


}
p.small {
    overflow: hidden;
    line-height: 200%;
    font-size:20px;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 6; 
    -webkit-box-orient: vertical;
}
a.gkreadmore{
    position: absolute;
    top: 79%;
    left:10%;
    color:#339eff;
    font-size:20px;                   
    font-family:Sniglet-Regular;

}

.gkimage{
    position: absolute;
    height:100%;
    width:40%;

    top: 25%;
    left: 48%;
}
.gkimg{
    height:60%; 
}
.gkbtn{
    position: absolute;
    color:white; 
    box-shadow: 2px 2px 0px #005899;
    font-family:Sniglet-Regular;
    background-color:#157fce;
    height:40px;
    width:90px;
    border-radius:12px; 
    top: 88%;
    left:82%; 

}
.gkmodal{
    background-color: #157fce; 
}
.gkmodal1{
    font-size:15px;                  
    font-family:Sniglet-Regular;

}
.gkmodalimage{
    height:100%;
    width:40%;
    top: 25%;
    left: 48%; 
}
.gkmodaltitle{
    color:white;   
}
/*.....Home archives.....*/
.gkContainer{
    margin-left: 10px;
    margin-top:2%;
    margin-bottom: 1%;
}
.tabdetails{
    background-color:white;
    margin-top: 3.5%;
    position: relative;
    height:auto;
    border-radius: 7px;
    font-size:15px;                  
    font-family:Sniglet-Regular;
    overflow: hidden;
    word-break: break-all;
}
.archivesMonth{
    background-color: #ffe315;
    border-color:#ffe315;
    border-radius: 5px;
    padding: 5px 15px;
}
.funfactblock{
    padding: 15px;
    margin-left: 25px;
}
.selectmonth{
    margin-left:4%;   
}
.hmreadmore{
    color:#339eff;
    font-size:17px;                   
    font-family:Sniglet-Regular; 

}
.hmreadmore1{
    color:#339eff;
    font-size:15px;                   
    font-family:Sniglet-Regular;

    text-decoration: underline;
}
.hmgkdetails{
    overflow: hidden;
    margin-top: 1%;
    margin-bottom: 1%;
    max-height:4.2em;
    font-size:15px;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp:3; 
    -webkit-box-orient: vertical;
}
.gkContainer1{
    margin-bottom: 2%; 
}
.hmgkdate{
    color: #023568; 
}
.mytabs-content {
    font-family:Sniglet-Regular;
    margin: 40px 10px;
    padding: 10px;
}
.mytabs {
    padding: 25px;
    background-color: #fff;
    border: 2px solid #f7f7f7;
    border-radius: 15px;
}
.wordoftheday{
    font-family:Sniglet-Regular;
    font-size: 28px;
    color: #339eff;
}
.wordmeaning{
    font-family:Sniglet-Regular;
    font-size: 18px;
}
.wordmeaning a{
    font-family:Sniglet-Regular;
    font-size: 16px;
    color: #339eff;
    text-decoration: underline;
    text-underline-position: under;
}
.loginBtn{
    font-family: Sniglet-Regular;
    background-color: #bfe530;
    border-radius: 7px;
    height: 34px;
    padding: 0 20px;
    font-size: 18px;
    width: auto;
    margin: 10px 5px;
}
#schoolView{
    margin-right: -12%;
}
.catBtn{
    padding: 0;
}
.catBtn label{
    font-family: Sniglet-Regular;
    background: transparent ;
    border-radius: 7px;
    border: 1px solid #339eff;
    height: 34px;
    padding: 3px 7px;
    /*text-shadow: 0px 0px 2px;*/
    color: #339eff;
    cursor: pointer;
    font-size: 18px;
    width: auto;
   
}
.catBtn input[type="radio"]:checked + label, 
.catBtn:hover label{
    font-family: Sniglet-Regular;
    background: transparent ;
    border-radius: 7px;
    border: 1px solid #7de3ff;
    height: 34px;
    padding: 3px 7px;
    text-shadow: 0px 0px 10px;
    box-shadow: 0px 0px 10px;
    color: #7de3ff;
    font-size: 18px;
    width: auto;
   
}

.catBtnmob{
    padding: 0;
}
.catBtnmob label{
    font-family: Sniglet-Regular;
    background-color: #0e3f79 ;
    border-radius: 7px;
    border: 1px solid #339eff;
    height: 34px;
    padding: 3px 16px;
    /*text-shadow: 0px 0px 2px;*/
    color: #339eff;
    cursor: pointer;
    font-size: 12px;
    width: auto;
    margin: 0 5px;
}
.catBtnmob input[type="radio"]:checked + label, 
.catBtnmob:hover label{
    font-family: Sniglet-Regular;
    background-color: #0e3f79 ;
    border-radius: 7px;
    border: 1px solid #7de3ff;
    height: 34px;
    padding: 3px 16px;
    text-shadow: 0px 0px 10px;
    box-shadow: 0px 0px 10px;
    color: #7de3ff;
    font-size: 12px;
    width: auto;
    margin: 0 5px;
}

/*............Do It Yourself...........*/
.diycarousel{
 position: absolute;
 height:40%;
 top: 17%;
 width:80%;
 left: 10%;
 
}
.diyimage{
 position: abosolute;
 height:250px;
 top: 13%;
 width:88%;   
 left: 11%;
}


#diyindicater li{
 visibility:hidden;   
}
.diyanchor a{
  color: white;
padding-left: 30px;
text-align: center;
}

#diycarousel .carousel-control.left {
    top: 50%;
    background:transparent;
}
#diycarousel .carousel-control.right {
    top: 50%;
    background:transparent;
}
#diycarousel .carousel-control{
    opacity: 1;
    position: absolute;
    left: auto;
    width: 10%;
}

.diybtn{
    position: absolute;
    color:#ff8500; 
    box-shadow: 4px 4px 1px #ffa300;
    font-family:Sniglet-Regular;
    background-color:#ffe315;
    height:35px;
    width:90px;
    border-radius:12px; 
    top: 180%;
    left:85%; 
}
.diyimgarchives{
 position: abosolute;
 height:100%;
 top: 13%;
 bottom: 10%;
 width:100%;    
}
/********Footer about us modal*******/

#aboutusmodal p{
padding-bottom:5px;
}
.modal-Registration-textarea {
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 12px;
    width: 100%;
    font-size: 18px;
    margin: 0 0 5px 15px;
    background-color: white;
    margin-top: 1%;
    padding-left: 10px;
}

.blogAuthor{
    width: 120px;
    height:120px;
}

#recommendedTuition img{
   display: inline-block;
}

.searchContainer{
    min-height:500px;
}
/*..Mobile Design by Aishwarya..*/
   @media (max-width: 1024px){
#announcements .carousel-inner.vertical > .item > .notificationsBlocks{
        margin-bottom:15px;
        width:97%;
        height:6em;
        background:white;
        border: 1px solid #ccc;
        border-radius: 20px;
        box-shadow: 10px 10px 4px #888888;
    }
    #announcements .announcementsImg{
        z-index: 999;
        position: absolute;
        margin: 7% 0;
        padding: 0;
    }
    #announcements .carousel-inner.vertical{
        height: 25%;
    }
}

@media (max-width: 990px){
    #announcements .announcementsImg{
        margin: -27% 0;
        padding: 2%;
    }
    
    #announcements{
        margin-bottom: 10%;
    }
}


@media screen and (max-width: 480px){
  #announcements .carousel-inner.vertical > .item > .notificationsBlocks{
        border: 1px solid #ccc;
        border-radius: 20px;
    }
    #announcements .announcementsImg{
        margin: -27% 0;
        padding: 3%;
    }
    #announcements .carousel-inner.vertical{
        height: 25%;
    }

}
.mobile-ul-middle{
    display: none;
}

#featureLike {
    position: absolute;
    top: 83%;
    /*left: 55%;*/
    right: 32%;
    /*background-color: #2196f3;*/
    background-color: #005899;
    height: 14%;
    min-width: 10%;
    border-radius: 10px;
    padding: 0 2% 0 2%;
    display:inline;
}

#todayInHistoryLikesCount,#funFactLikesCount{
    color:white;
    display:inline;
}

#funFactLike{
    position: absolute;
    top: 89%;
    left: 1%;
    background-color: #cc2211;    
    min-width: 18%;
    border-radius: 10px;
    display: inline;
    cursor: pointer;
    padding: 0 4% 0 1%;
}

#recommendLike {
    position: absolute;
    top: 89%;
    right: 20%;
    background-color: #67b502;
    min-width: 18%;
    border-radius: 10px;
    border: #4d7c03 solid 1px;
    display: inline;
    cursor: pointer;
    padding: 0 4% 0 1%;
}

#gkLike {
    position: absolute;
    top: 88%;
    right: 20%;
     
    background-color: #157fce;        
    border-radius: 10px;
    border: #4d7c03 solid 1px;
    display: inline;
    cursor: pointer;
    padding: 0 1% 0 1%;
    color:#fff;
}

.heartFunFact, .hearthTodayInHistory, .heartRecommendation, .heartGK {
    display: inline;
    width:inherit;
}
.heartGK{
    width:40px;
}
                            
/*#chart-container {
    width: 50%;
    height: auto;
}*/
/*---------------------ADDED BY MEGHA------------------------------*/
.commonContainer{
    min-height: 60%;
}
.btn-login_admin{
    font-size: 18px;
    display: inline-block;
    border: 0px solid #7dcc00;
    border-radius: 10px;
    width: 30%;
    color: #fff;
    background-color: #7dcc00;
    
    height: 35px;
}
.back_link{
    background-color: #f7f7f7 !important;
    border: none !important;
    font-family: Sniglet-Regular !important;
    font-size: 16px !important;
    color: #388c02 !important;
}
.back_button{
    margin-top: 10px;
    font-size: 17px;
}

.test-detail{
  display: table;
  width: 101%;
}

.test-detail span {
  vertical-align:middle;
  display: table-cell;
}
.chip {
            
    font-size: 16px;
    margin: auto;
    width: 75%;
    border-radius: 0px 134px 134px 28px;
    background-color: #00AEEF;
}

.maincard{
    width:80%;
    margin-left:auto;
    margin-right:auto;
    margin-top:20px;
    background-color:white;
    border-radius: 26px;
    padding-bottom:20px;

    border-color:white;
}
.innercard{
    width:75%;
    margin-left:auto; 
    margin-right:auto; 
    margin-top:-20px;
    margin-bottom:50px;
    padding-bottom:50px;
    background-color: rgba(64, 109, 162, 0.9);
   
}
.titletext{
    color: white;text-align: center;
    padding:15px;
}
.earth{
    width: 100%; height:auto; margin-left:10px;
}
.textsection{
    color:#FFFFFF;
}
.infotext{
    color: white;
   position:relative;
    margin-top:30px;
    margin-left: 16%;
}
.infotextinner{
    color: white;
    position:relative;
    margin-top:10px;
    margin-left: 16%;
    margin-right: 29%;
    font-size:18px;
}
.privacy_policy_styles{
    padding: 20px;
    overflow-y: scroll;
    height: 80vh;
    font-size: 17.5px;
}
.privacy_policy_title_align{
    text-align: center;
}
.DisplayTopic{
    color:white;
    margin-top:8%;
    margin-left:22%;
    /*border-bottom: solid;*/
    /*border-width: 10%;*/
}
/* .progress-bar, .progress{
    height: 10px;
} */
.game-bg{
    width:150px; 
    height:150px; 
    position:relative; 
    top:19%; 
    cursor:pointer;  
    margin-left:51%;
}
#game-section{
    height:100%; 
    background-repeat: no-repeat;
    background-size: cover;
}
.game-landing-title{
    text-align: center;
    color:#0E3579;
    margin-top:90px;
    margin-bottom:20px
}
.game-btn{
    border-radius: 20px; 
    width:15%; 
    margin-left:1%;
}
.subcat-btn{
    border-radius: 20px; 
    width:15%; 
   
}
.game-landing-container{
    padding:10px
}
.game-landing-img{
    width:100%;
    padding:10px;
    cursor:pointer;
}
.score-img{
    width:300px; 
    display: block;  
    margin-left: auto;  
    margin-right: auto;
}
.level-btn{
    border-radius: 20px; 
    text-align:center;
    width:200px;
}
.level-img{
    width:100%;
    padding:10px; 
    cursor:pointer;
}
.level-title{
    text-align: center;
    color:white;
    margin-top:50px;
    margin-bottom:20px
}
.level-heading{
    text-align: center;
    color:white;
    margin-top:50px;
    margin-bottom:20px
}
.displaytimeupmsg{
    font-size:20px;
}
.displaytimeupmsg{
    font-size:20px;
}
.levelendstyles{
    min-height:800px;
    background-repeat:no-repeat;
    margin-top:50px;
}
.LevelDone{
    border-radius: 20px;
    color:white;
    margin-top:41%;
    margin-left:10%;
}
.showLevel{
    border-radius: 20px;
    color:white;
    margin-left:30%;
}
.scoretitle{
    border-radius: 20px;
    color:white;
    margin-left:25%;
}
.showtotalscore{
    border-radius: 20px;
    color:white;
    margin-top:5%;
    margin-left:38%;
}
.sharescore{
    border-radius: 30px;
    color:white;
    margin-top:3%;
    margin-left:10%;
    padding:10px 20px 10px 20px;
    font-size:x-large;
}
.displaycategorybox{
    margin-left: 5%;
    padding:10px;
}
.catnamebox{
    border-radius: 20px;
    text-align:center;
    width:200px;
}
.othercatname{
    border-radius: 20px;
    text-align:center;
    width:200px;
}
.cat-title{
    text-align: center;
    color:white;
    margin-top:50px;
    margin-bottom:20px;
}
.wrap-text{
    width: 17em;
}
@media (max-width: 768px) {
    .carousel-inner .carousel-item > div {
        display: none;
    }
    .carousel-inner .carousel-item > div:first-child {
        display: block;
    }
}

.carousel-inner .carousel-item.active,
.carousel-inner .carousel-item-next,
.carousel-inner .carousel-item-prev {
    display: flex;
}

@media (max-width: 768px) {
    .carousel-inner .carousel-item > div {
        display: none;
    }
    .carousel-inner .carousel-item > div:first-child {
        display: block;
    }
}

.carousel-inner .carousel-item.active,
.carousel-inner .carousel-item-next,
.carousel-inner .carousel-item-prev {
    display: flex;
}

.carousel-inner .active.left { left: -33%; }
.carousel-inner .next        { left:  33%; }
.carousel-inner .prev        { left: -33%; }

.carousel-control.left,.carousel-control.right {background-image:none;}

