@import url('font.css');

* {
    margin: 0;
    padding: 0;
}

body, html {
    width: 100%;
    height: 100%;
    font-family: 'proxima_novalight' !important;
    background:#eaf9ff;
}
.parentDiv{
    display: flex;
    justify-content: center;
    align-items: center;
}
.car_container_outerdiv{
    width: auto;
    margin: 0;
    padding: 0;
}
.smallscreen{
    margin: 30px;
}
.classroomImageDiv img{
    /* height: 43vw !important; */
    margin-left: 0rem;
    padding: 0;
    padding-bottom: 6.5rem;
    width: 100%;
    margin-top: 3rem;
}

  
.logostyle{
    text-align:initial;
    margin-top: 0rem;
    margin-left: 5rem;
  }
a {
    color: #404040;
    text-decoration: none;
    background: none;
    outline: none !important;
    display: block;
}

/*a:hover, a:active, a:focus {
    text-decoration: none !important;
    background: none !important;
    border: none !important;
    outline: none !important
}
*/
.mt50 {
    margin: 50px 0px 0;
}

.mt10 {
    margin-top: 10px;
}

.mt30 {
    margin-top: 30px !important;
}

.mt20 {
    margin-top: 20px !important;
}

.mr10 {
    margin-right: 10px !important;
}

.mr20 {
    margin-right: 20px !important;
}
.nopadding{padding: 0 !important;}

.pd20 {
    padding: 20px 0px;
}

.pdb20 {
    padding-bottom: 20px !important;
}

.mt0 {
    margin-top: 0 !important;
}

.pdt0 {
    padding-top: 0 !important;
}

.pdb0 {
    padding-bottom: 0 !important;
}

.nomgb {
    margin-bottom: 0 !important;
}

li {
    list-style-type: none;
}

h2 {
    font-family: 'proxima_novalight' !important;
    font-size: 32px !important;
    line-height: 35px !important;
}

.bdb {
    border-bottom: 2px dashed #cecece;
}
.nbd{border: none !important;}

.nomargin {
    margin: 0 !important;
}

.close-icon {
    padding: 30px 0 0;
}

.head-raleway {
    margin: 6px 10px 0 0;
    font-size: 32px;
}

.bold1 {
    font-weight: bold;
}
.relative{position: relative;}

/* Buttons */
.btn {
    min-width: 100px;
    padding: 6px 20px;
    -webkit-border-radius: 20px !important;
    -moz-border-radius: 20px !important;
    border-radius: 20px !important;
    color: #ffffff;
    font-family: "proxima_novasemibold";
}

.btn-primary, .btn-primary:active, .btn-primary:active:focus, .btn-primary:focus, .sendbtn {
    background: #fd654d;
    border-color: #fd654d;
    outline: 0;
    box-shadow: none;
}

.btn-primary:hover, .btn-primary:active, .btn-primary:active:focus, .btn-primary:focus {
    background: #ea5c46;
    border-color: #ea5c46;
    outline: none
}

.btn-secondary, .btn-secondary:active, .btn-secondary:active:focus, .btn-secondary:focus {
    background: #f2a966;
    border-color: #f2a966;
    outline: 0;
    box-shadow: none;
}

.btn-secondary:hover, .btn-secondary:active, .btn-secondary:active:focus, .btn-secondary:focus {
    background: #ef9e53;
    border-color: #ef9e53;
    outline: none
}

.btn-default:hover, .btn-default:active, .btn-default:active:focus, .btn-default:focus, .btn-default.active.focus, .btn-default.active:focus, .btn-default.active:hover, .btn-default:active.focus, .btn-default:active:focus, .btn-default:active:hover, .open > .dropdown-toggle.btn.btn-default.focus, .open > .dropdown-toggle.btn.btn-default:focus, .open > .dropdown-toggle.btn.btn-default:hover, .btn-default.active, .btn.btn-default:active, .open > .dropdown-toggle.btn.btn-default {
    background: #fd654d;
    color: #ffffff;
    outline: none;
    border-color: #fd654d;
    box-shadow: none;
}

.btn-default {
    border-color: #bdbdbd;
    color: #3c3c3c;
}

.btn:focus, .btn:hover, .btn:active {
    color: #ffffff;
    box-shadow: none;
    outline: none !important;
}
/* Login */
.loginHeader{margin: 30px 0;}
.loginHeader a{    width: 200px;    margin: 0 auto;}
.nav-tabs.login-tabs{ border:none;}
.nav-tabs.login-tabs li:last-child{    margin-right: 0;}
.nav-tabs.login-tabs>li{float:none;display: inline-block;border-right: 3px solid #0e0e0e;}
.nav-tabs.login-tabs>li:last-child{border:none}
.nav-tabs.login-tabs>li a{font-family: 'proxima_novasemibold';text-align: center; color: #3c3c3c; font-size: 18px;border:none;padding: 0 10px;}
.nav-tabs.login-tabs li.active, .login-tabs li:hover{color:#fd654d;}
.nav-tabs.login-tabs>li.active a, .nav-tabs.login-tabs>li a:hover{color:#fd654d ;background: no-repeat;border:none; }
.loginTabContent{width:500px;background: #fff;margin: 30px auto;padding: 30px;}
.loginContent{position: relative;z-index: 1}.loginTabContent
.socialLogin{width: 350px;margin: 0 auto;border:1px solid #404040;padding: 20px 10px;}
.loginContent .socialLogin p{font-size: 18px;font-family: "proxima_nova_rgregular";margin-bottom: 20px;}
.loginList li{display: inline-block;vertical-align: top;width:150px;margin: 0 5px;text-align: left;}
.loginList li a{padding: 10px; color: #ffffff;}
.loginicons{width:30px;height: 20px;display: inline-block;vertical-align: middle;margin-right: 10px;background: url(../images/spritefb.svg) no-repeat}
.fb-icon{background-position:-59px -92px; }
.google-icon{background-position:-20px -92px; }
.facebook{background: #3b5998}
.google{background: #d0422a}
.message-icon{    width: 51px;position: relative;
    height: 40px;
    display: inline-block;
    margin-bottom: 10px;
    background: url(../images/spritefb.svg) no-repeat -21px -317px;}

.or {
    border-bottom: 1px solid #cdcdcd;
    position: relative;
    text-align: center;
    width: 200px;
    margin: 30px auto;
}
.or p {
    background: #fff;
    display: inline-block;
    left: 45%;
    margin-left: -10px;
    position: absolute;
    text-transform: uppercase;
    top: -13px;
    line-height: 26px;
    padding: 0 10px;
}
.profileph{width:70px;height:100px;display: block;margin:30px auto;}
.loginContent .form-group {display: inline-block;vertical-align: bottom;}
.loginContent .form-group .form-control{text-align:center;color:#3c3c3c;font-size: 16px; border-bottom: 2px solid #bebebe !important;border:none;box-shadow: none;-webkit-border-radius:0; -moz-border-radius:0; border-radius:0;padding:6px 20px 15px;margin-bottom: 20px; width:290px}
.loginContent .form-group .form-control.passcode{width:230px;letter-spacing:49px;font-size: 30px;border-bottom:none !important; border:1px solid transparent;box-shadow: none;background: linear-gradient(to left, #bebebe 0%, #bebebe 80%, transparent 50%, transparent 100%) repeat-x right bottom;  background-size: 60px 2px;}
.loginContent h5{font-family: "proxima_nova_rgregular";text-transform: none;font-size: 18px;}
.parentForm .form-group .form-control.passcode1, .addChildForm  .table>tbody>tr>td>  .form-group .form-control.passcode1{width:290px;letter-spacing:49px;font-size: 30px;border-bottom:none !important; border:1px solid transparent;box-shadow: none;background: linear-gradient(to left, #bebebe 0%, #bebebe 80%, transparent 50%, transparent 100%) repeat-x right bottom;  background-size: 60px 2px;padding:6px 20px 15px;}
.loginArea a{font-size: 16px; color: #fd654d;font-family: "proxima_novasemibold";}
.bgContent{position: absolute;top:0;left:0;}
.layer:nth-child(3) {
    margin-top: 510px;
}
.layer:nth-child(4) {
    margin-top: 620px;
}

/* Singn up Details */
.loginContent .addChildForm{width:auto;margin:0;}
.addChildForm .radio input, .addChildForm  .checkbox input, .curriculumGrade .radio input{opacity: 0;margin: 0;}
.inpticon{width:48px;height:48px;display:inline-block;vertical-align:middle;background: url(../images/sprite.svg) no-repeat -175px -21px;margin-right: 10px;}
.addChildForm .radio input:checked+p .inpticon{background-position:-153px -21px;}
.loginContent .addChildForm>.radio input:checked+ p .boybtn{background-position:-264px -245px}
.loginContent .addChildForm>.radio input:checked+ p .girlbtn{background-position:-378px -245px}
.loginContent p{font-size: 16px;margin: 0}
.loginContent .addChildForm>.radio label p{ font-size: 16px;}
.addChildForm  .table>tbody>tr>td>  .form-group .form-control.passcode1{padding: 6px 20px 10px;}
.addChildForm  .table>tbody>tr>td>p{margin: 0; line-height: 27px;}
.addChildForm  .table>tbody>tr>td.labelstyle>p{ line-height: 50px;}
.addChildForm  .table>tbody>tr>td{border:none;padding: 8px 0;position: relative;width: 100px;}
.addChildForm  .table>tbody>tr>td:first-child p:after{content: '*';position: absolute;top:5px;color:#fd654d;font-size: 16px;}
.addChildForm  .table>tbody>tr>td> .form-group, .addChildForm  .table>tbody>tr>td> .form-group .form-control,  .addChildForm  .table>tbody>tr>td> .form-group .dropdown-menu,.addChildForm  .table{margin: 0;width:100% }
.addChildForm  .table>tbody>tr>td> .form-group .form-control{padding:6px 0 10px;width: 290px;text-align: left;}
.addChildForm  .table>tbody>tr>td> .form-group .calender{position: absolute;top:15px;right: 0;background-position: -73px -82px;width:14px;height:14px; }
.addChildForm  .table>tbody>tr>td> .form-group .caret{position: absolute;right: 0px;top:10px;  border-top: 6px dashed #707070; border-top: 6px solid\9; border-right: 6px solid transparent;  border-left: 6px solid transparent;}
.addChildForm  .table>tbody>tr>td .datepicker{position: absolute; z-index: 10;background: #fff;border:1px solid #bebebe !important;width:210px;}
.loginContent .settingList li{border:none;padding: 10px 0}
.modal-body.small-modal{padding: 30px;}
.modal-body.small-modal p{font-size: 18px;padding: 0 50px;}
.successicon{width:20px; height:20px;display: inline-block;background: url(../images/sprite.svg) no-repeat -197px -21px;margin-bottom:10px;position: absolute;top:-10px;right: -10px;
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    border-radius:50%;}
.gradelist label{padding: 0; width:50px;height: 36px;}
.gradelist label p, .assesmentStep{background:#fff;margin:0;width:36px;height:36px;border:1px solid #484848;padding:7px 0;display: inline-block; -webkit-border-radius:50%; -moz-border-radius:50%; border-radius:50%;font-family: "proxima_novasemibold";text-align: center;}
.gradelist input:checked+p{border-color: #fd654d; background: #fd654d; color:#ffffff;}
.gradelist.board label{width:100px;}
.gradelist.board p{width:80px;height:26px; -webkit-border-radius:20px; -moz-border-radius:20px; border-radius:20px;padding:3px ; text-align: center;}

.loginTabContent h6{text-transform: none;position: relative;margin-top: 0px;}
.loginTabContent h6 p{display: inline-block;margin-right: 10px;}
.loginTabContent h6 p:after{content: '*';position: absolute;top:0px;color:#fd654d;font-size: 16px;}
.curriculumGrade h5, .quizBody h5 {text-transform: none;margin: 15px;}

/*Assessment */
.assesmentSection:hover{right:0px;}
.assesmentSection{background: #fd654d;padding: 10px;position: fixed; right: -220px;    top: 26%;z-index: 99999999;    -webkit-border-radius:20px 0 0 20px;    -moz-border-radius:20px 0 0 20px;  border-radius:20px 0 0 20px;  -webkit-transition: right .5s;  -moz-transition: right .5s;  -ms-transition: right .5s;  -o-transition: right .5s;  transition: right .5s;}
.assesmentSection a{color: #fff; font-size: 16px;font-family: "proxima_novasemibold";}
.assessmenticon{width:30px;height: 25px;display: inline-block;vertical-align: middle;margin-right: 5px;background: url(../images/sprite.svg) no-repeat -149px -90px;}
.asses-tab.nav-tabs.line-tab{border-bottom: none}
.assesmentStep{margin-right: 10px;}
.asses-tab.nav-tabs>li{min-width: 23%;text-align: left;margin-right: 20px;position: relative;}
.asses-tab.nav-tabs>li:last-child{margin-right: 0px}
.asses-tab.nav-tabs>li>a{padding: 0px 0 15px;font-size: 16px;}
.asses-tab.nav-tabs>li>a .successiconbig{display: none;margin-bottom: 0}
.asses-tab.nav-tabs>li.completed>a .successiconbig{display: inline-block;vertical-align: middle;margin-right: 10px;}
.asses-tab.nav-tabs>li.completed>a .assesmentStep{display: none;}


.assessmentContent{background: #ffffff;padding: 30px;margin: 30px 0 0;min-height: 500px;border:1px solid #bdbdbd;
    -webkit-border-radius:10px;
    -moz-border-radius:10px;
    border-radius:10px;}
.assessmentContent>img{width:500px;margin: 0 auto 30px;display: block}
.SubList{position:relative;}
.SubList>li{cursor:pointer;text-align:left;font-family:"proxima_novasemibold";width: 20%; padding:10px 20px; border:1px solid #c7c7c7;display: inline-block;vertical-align: top;margin: 0 10px;background: #ffffff ;   -webkit-box-shadow: 0px 3px 2px 0px rgba(0, 0, 0, 0.14);    -moz-box-shadow: 0px 3px 2px 0px rgba(0, 0, 0, 0.14);    box-shadow: 0px 3px 2px 0px rgba(0, 0, 0, 0.14);    -webkit-border-radius:10px;    -moz-border-radius:10px;    border-radius:10px;}
.subjecticons{width:20px;height: 20px;display: inline-block;background: url(../images/sprite.svg) no-repeat;}
.math-icon{background-position:-65px -21px;}
.eng-icon{background-position:-43px -21px;}
.sci-icon{background-position:-20px -21px;}
.playlist-icon{width:40px; height:40px;padding: 9px 0; color: #ffffff;border:1px solid #a09f9f;text-align: center;vertical-align: middle;
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    border-radius:50%;}
.SubList>li p{padding: 10px 0 10px 50px;margin: 0}
.SubList>li:hover, .SubList li.active{background: #fd654d;color:#ffffff}
.SubList>li:hover .playlist-icon, .SubList li.active .playlist-icon{background: #ffffff;border-color: #ffffff;}
.SubList>li:hover .math-icon, .SubList li.active .math-icon{background-position:-131px -21px;}
.SubList>li:hover .eng-icon, .SubList li.active.eng-icon{background-position:-109px -21px;}
.SubList>li:hover .sci-icon, .SubList li.active .sci-icon{background-position:-86px -21px;}
.topics{display:none;position: absolute;    top: 100px;    width: 670px;    left: 18%; padding:10px 20px; border:1px solid #c7c7c7;background: #ffffff ;   -webkit-box-shadow: 0px 3px 2px 0px rgba(0, 0, 0, 0.14);    -moz-box-shadow: 0px 3px 2px 0px rgba(0, 0, 0, 0.14);    box-shadow: 0px 3px 2px 0px rgba(0, 0, 0, 0.14);    -webkit-border-radius:10px;    -moz-border-radius:10px;    border-radius:10px;}
.topics h5{padding-bottom: 10px; margin: 0; border-bottom: 1px solid #c7c7c7;}
.topics li a{color: #3c3c3c;padding:5px 0;font-size: 16px;font-family: "proxima_nova_rgregular"}
.topics li{display: inline-block;vertical-align: top; width:32%;}
.topics li:hover a{color: #fd654d;}
.SubList li.active:before{content: '';position: absolute;bottom: -39px; border:10px solid transparent; border-bottom-color: #c7c7c7;z-index: 5;}
.SubList li.active:after{content: '';position: absolute;bottom: -40px; border:10px solid transparent; border-bottom-color: #ffffff;z-index: 5;}


/* Quiz */

.quizheader{background: #f4f6f7;padding: 20px;position: relative;border-bottom: 1px solid #bdbdbd;
    -webkit-border-radius:10px 10px  0 0;
    -moz-border-radius:10px 10px  0 0;
    border-radius:10px 10px  0 0;}
.quizheader p img{width:20px;margin: 0 5px;}
.quizheader p, .quizBody p{margin: 0;}
.quizBody{position: relative;}
.quiz-list{padding: 30px 0 ;margin: 0;text-align: center}
.quiz-list li{display: inline-block;vertical-align: top;width:80px;height:100px;margin: 0 15px;}
.answer li{border-bottom:1px solid #bdbdbd;padding: 20px 0}
.question li{cursor:pointer;border:1px solid #bdbdbd; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px;background: #f3f3f3;font-size: 48px;color:#6c6c6c;padding: 25px;-webkit-box-shadow: 0px 2px 2px 0px rgba(129, 129, 129, 0.15); -moz-box-shadow:    0px 2px 2px 0px rgba(129, 129, 129, 0.15); box-shadow:         0px 2px 2px 0px rgba(129, 129, 129, 0.15); margin-bottom: 20px;}
.helpsection{border:1px solid #d5d5d5;width:300px;margin: 0 auto;padding: 10px;font-size: 16px;color:#a4a4a4;}
.question.sentence li{height:40px;font-size: 16px;padding: 10px;background: #ffffff;}
.question.image li{background: #ffffff;}
.question.text li{display: block;margin:30px;}
.question.text{display: inline-block;vertical-align: top;}
.question li.ui-draggable{cursor: move;}
.question.longsentence {width:700px;margin: 0 auto;}
.question.longsentence li{width:45%;}
.image-area{height:100px;background: #ababab; color: #ffffff;font-size: 20px;width:500px;margin: 50px auto;padding: 40px;}
.question li p{padding: 10px;border:1px ridge #ababab;text-align: right;font-size: 16px; width: 50px; float: right; margin-top: 13px;}
.quizCompleted{}
.quizCompleted .playtypes{width: 200px; height:200px;margin: 30px 0 20px;}
.quizresult{border-right:1px solid #ededed;height: 300px;margin:0;}
.quizresult p{font-size: 16px;}
.progressContent{width:30%;position: absolute; top:20px;right: 0;}
.progressContent p{float:left;margin: 0 20px 0 0}
.progressContent .progress{width:200px;    margin: 4px 20px; height: 10px; border: 2px solid #25c6da;}
.progressContent .progress-bar{background:#25c6da;box-shadow: none; }
.result-details  .progress{height:10px;border: 2px solid #54bb96;width:98%;margin: 20px 0; position: relative;overflow: visible;}
.result-details  .progress:after{content:'';position: absolute;width: 10px;height:10px; background: #54bb96; -webkit-border-radius:50%; -moz-border-radius:50%; border-radius:50%;    top: -30px; right: 8.8%;}
.result-details  .progress-bar{background:#54bb96;box-shadow: none;position: relative;}
.result-details  .progress-bar:after{content:'';position: absolute;border-right: 2px solid #54bb96;height:30px;right:0;bottom: 0;}

.result-details{padding:0 0 0 45px;}
.question.result-list{padding: 20px 0;text-align: left;}
.question.result-list li{background: none;width:46%;font-size: 16px;padding: 10px;text-align: center;margin: 0 10px;}
.question.result-list li:first-child{margin-left: 0;}
.question.result-list li:last-child{margin-right: 0;}
.question.result-list li span{display: block;font-size: 50px; font-family: "proxima_novasemibold";}
.correct{color:#54bb96;}
.incorrect{color:#ff5757}
.assestabcontent{margin-bottom: 30px}
.hint-icon{width:20px;height:20px; display: inline-block; vertical-align: text-bottom;background: url(../images/sprite2.svg) no-repeat 3px -21px; margin-right: 5px;}
.cup-icon{width:20px;height:20px; display: inline-block; vertical-align: text-bottom;background: url(../images/sprite2.svg) no-repeat -14px -24px; margin-right: 5px;}
.timer{width:70px;height:70px;background: url(../images/sprite2.svg) no-repeat -6px -72px;margin: 0 auto;}
.wrapper {
    width: 90px;
    height: 90px;
    position: absolute;
    right: 20px;
    top:10px;
    margin: 0;
    padding: 10px;
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    border-radius:50%;
    background: #fff;
    -webkit-box-shadow: 0px 3px 5px 0px rgba(34, 30, 31, 0.3);
    -moz-box-shadow:    0px 3px 5px 0px rgba(34, 30, 31, 0.3);
    box-shadow:         0px 3px 5px 0px rgba(34, 30, 31, 0.3);}
.mountainContnet{border-left: 1px solid #bdbdbd;height:440px; background:url(../images/tent.svg) no-repeat 70% 90.5%,url(../images/AssessmentMountain.svg) no-repeat center center;position: relative;}
.levelList,.stepList{margin: 0;}
.levelList li{width:80px;padding:5px 10px;border:2px solid #9a9a9a;line-height: normal;position: absolute;background: #fff;cursor: pointer;text-align: center;
    -webkit-border-radius:20px;
    -moz-border-radius:20px;
    border-radius:20px;}
.levelList li.active, .quizCompleted .levelList li{border-color:#53bb96; color:#53bb96}
.levelList li:first-child{top: 55%;left: 20%;}
.levelList li:nth-child(2){top: 45%;    right: 25%;;}
.levelList li:nth-child(3){top: 65%;    right: 15%;}
.levelList li:last-child{top: 72%;left: 15%;}

.stepList li{width:15px;font-size: 10px;cursor: pointer; background: #ffffff;color: #53bb96;position: absolute;height:15px;padding: 1px;
    font-family: "proxima_novasemibold";
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    border-radius:50%;}
.stepList li.active{width:20px;height:20px; background: #53bb96;color:#faff01; border:1px solid #faff01;padding: 2px;}
.stepList li:first-child{    top: 31%;
    left: 49%;}
.stepList li:nth-child(2){top: 39%;    left: 51%;}
.stepList li:nth-child(3){bottom: 44%;    left: 50%;}
.stepList li:nth-child(4){bottom: 42%;    left: 44%;}
.stepList li:nth-child(5){bottom: 34%;    left: 42%;}
.stepList li:nth-child(6){bottom: 30%;    left: 55%;}
.stepList li:nth-child(7){    bottom: 23%;    left: 53%;}
.stepList li:nth-child(8){    bottom: 21%;    left: 40%;}
.stepList li:nth-child(9){    bottom: 15%;    left: 35%;}
.stepList li:last-child{bottom: 10%;left:52%;}
.successiconbig{width:40px;height:40px;display:inline-block;background: url(../images/sprite.svg) no-repeat -198px -130px;}
.successiconbig1{    width: 67px;    height: 67px;    display: inline-block;    background: url(../images/sprite.svg) no-repeat -20px -234px;}
.completeMsg{width:100%;padding:100px 20px 50px;}
.completeMsg p{font-family: "proxima_novasemibold";font-size: 18px;}
.quizCompleted{display: none;}
.quizCompleted .mountainContnet{margin-left: 50px}
.mountainContnet  .levelList li img{position: absolute;width:50px;}
.mountainContnet .levelList li:first-child  img{     left: -70px;
    top: -10px;  }
.mountainContnet .levelList li:nth-child(2) img{     top: -20px;
    right: -70px;}
.mountainContnet .levelList li:nth-child(3) img{    top: -20px;    right: -55px;}
.mountainContnet .levelList li:last-child  img{    left: -55px;
    top: -10px;}

.playerdetails{overflow:hidden;padding: 0 50px;}
.calculation{font-size: 26px;font-family: "proxima_novasemibold"}
.playerdetails form{margin: 0; width:100%;}
.playerdetails .form-group .form-control{width:100%;border: 1px solid #bebebe !important;padding: 6px 12px;margin-right: 10px;
    -webkit-border-radius:6px;
    -moz-border-radius:6px;
    border-radius:6px;}

 .child-tab{height:50px;}
.child-tab label{padding: 0;margin-right: 20px}
.child-tab label p{width:120px;border: 2px solid #bebebe; padding:2px 10px !important;background: #f5f5f5;margin-right: 20px;line-height: 30px;
    -webkit-border-radius:20px;font-size: 14px !important;text-align: left;
    -moz-border-radius:20px;
    border-radius:20px;margin: 0;}
 .child-tab label p .header-icon{margin-right: 5px;}
 .child-tab input:checked+p{background: #fd654d;color:#ffffff;border-color:#fd654d}
 .child-tab input{opacity: 0;}
.header-icon{width: 26px;height:26px;display: inline-block;vertical-align: middle;background: url(../images/sprite.svg)no-repeat ;margin-right: 5px}
.boy{background-position: -87px -89px}
.girl{background-position: -120px -89px}

.playtypes{position:relative;width:200px;height:250px;display: inline-block;vertical-align:top;margin: 50px 15px;padding: 20px;  -webkit-border-radius:10px;  -moz-border-radius:10px;  border-radius:10px;-webkit-box-shadow: 0px 2px 2px 0px rgba(34, 30, 31, 0.15);    -moz-box-shadow:    0px 2px 2px 0px rgba(34, 30, 31, 0.15);    box-shadow:         0px 2px 2px 0px rgba(34, 30, 31, 0.15);cursor: pointer;transition:all 0.3s ease;}
.playtypes.boy{background: #86d9e3  url(../images/card-pattern.svg) no-repeat center -8px;}
.playtypes.girl{background: #fad5b3  url(../images/card-pattern.svg) no-repeat center -8px;}
.profileph{width:80px;height:150px;display: block;margin:30px auto;}
.boy-icon{background: url(../images/boy.svg) no-repeat center center;}
.girl-icon{background: url(../images/girl.svg) no-repeat center center;}
.playtypes img{position: absolute;bottom:-40px;right:-40px}

.performancebar{width:50%;margin:40px  auto;padding: 0;}
.result-details .bar-graph {    height: 300px;width:360px; padding: 50px 0 0;position: relative;margin: 0}
.result-details .bar {     width: 50px;
    margin: 0px 0px 0 30px;
    border: 2px solid #404040;
    height: 250px;
    display: inline-block;
    position: relative;}
.result-details .bars1 {    height: 90%;    position: absolute;    left: 0px;    right: 0px;    bottom: 0px;    background: #25c6da;    -webkit-animation: grow 2s;    -moz-animation: grow 2s;    -o-animation: grow 2s;    animation: grow 2s;    -webkit-animation-delay: 0.9s;    -moz-animation-delay: 0.9s;    -o-animation-delay: 0.9s;    animation-delay: 0.9s;}
.result-details .bars2 {    height: 80%;    background: #25c6da;    position: absolute;    left: 0px;    right: 0px;    bottom: 0px;    -webkit-animation: grow 2s;    -moz-animation: grow 2s;    -o-animation: grow 2s;    animation: grow 2s;    -webkit-animation-delay: 0.9s;    -moz-animation-delay: 0.9s;    -o-animation-delay: 0.9s;    animation-delay: 0.9s;}
.result-details .bars3 {    height: 85%;    position: absolute;    left: 0px;    right: 0px;    bottom: 0px;    background: #25c6da;    -webkit-animation: grow 2s;    -moz-animation: grow 2s;    -o-animation: grow 2s;    animation: grow 2s;    -webkit-animation-delay: 0.9s;    -moz-animation-delay: 0.9s;    -o-animation-delay: 0.9s;    animation-delay: 0.9s;}
.result-details .bars4 {    height: 60%;    background: #25c6da;    position: absolute;    left: 0px;    right: 0px;    bottom: 0px;    -webkit-animation: grow 2s;    -moz-animation: grow 2s;    -o-animation: grow 2s;    animation: grow 2s;    -webkit-animation-delay: 0.9s;    -moz-animation-delay: 0.9s;    -o-animation-delay: 0.9s;    animation-delay: 0.9s;}
.result-details .text-below li {float: none;width:25px;    text-align: center; display: inline-block;margin:10px 25px; font-family: proxima_novasemibold}
.result-details .percent {    position: absolute;    top: 0px;width: 100%; text-align: center}
.result-details .percent li {    width: 50px;    margin: 10px 20px ;  display: inline-block;    text-align: center;    font-size: 20px; font-family: "proxima_novasemibold";}
.result-details{padding: 30px 44px;-webkit-border-radius:10px;    -moz-border-radius:10px;    border-radius:10px;    border: 1px solid #d5d5d5;    width: 450px;margin: 0 auto;text-align: center}
.achievementList li{border:1px solid #d5d5d5;padding: 10px;margin-bottom: 20px;    -webkit-border-radius:10px;    -moz-border-radius:10px;    border-radius:10px; text-align: center;font-family: "proxima_novasemibold";font-size: 16px;}
.achievementList li img{width:30px;margin: 0 5px;}
.marks{font-size: 35px;}
.labelList li{display: inline-block;width:150px;vertical-align: top;text-align: center;
    }
.box{width:15px; height:15px;display: inline-block; vertical-align: middle; margin-right: 10px;-webkit-border-radius:2px;    -moz-border-radius:2px;    border-radius:2px;}
.child{background: #58d3e3;}
.city{background: #167682;transform: rotate(45deg)}




@media only screen and (max-width: 1024px) {
    body{background-repeat:repeat-y;}
    .content img{width:100px; height:100px;}
    .content{max-width:500px;width:100%;}
    .content .para{padding:10px 20px 10px;line-height:1.5em;}
    .content .text-footer{font-size:15px;padding:10px 30px 20px;line-height:1.5em;}
    .layer:nth-child(3) {
        margin-top: 513px;
    }
    .layer:last-child {
        margin-top: 567px;
    }
    .layer:nth-child(4) {
        margin-top: 567px;
    }
}
@media only screen and (max-width: 768px) {


    .content{max-width:400px;width:100%;}
    .content .para{font-size:15px;padding:10px 20px 10px;line-height:1.5em;}
    .content .text-footer{font-size:12px;padding:10px 30px 20px;line-height:1.5em;}
    .layer:nth-child(3) {
        margin-top: 830px;
    }
    .layer:last-child {
        margin-top: 0;
    }
    .layer:nth-child(4) {
        margin-top: 867px;
    }
}
@media only screen and (max-width: 640px) {

    .content {
        margin: 0 auto;
        width: 300px;
    }
    .content h1 {
        font-size: 30px;
    }
    .content .para,
    .content .text-footer {
        padding: 10px 0;
        font-size: 13px;
    }
}
@media only screen and (max-width: 480px) {
    .content span img {
        width: 100px;
        height: 58px;
        margin-top: -21px;
        margin-bottom: 15px;
    }

    .content .logo {
        width: 85px;
        height: 85px;
        margin: 0 auto;
    }
    .content {
        margin: 0 auto;
        width: 280px;
        left:0;
        right:0;
        top:20px;
    }
    .content h1 {
        font-size: 30px;
        line-height:30px;
        padding-top: 5px;
    }
    .content .para,
    .content .text-footer {
        padding: 10px 0;
        font-size: 13px;
    }
    .layer:nth-child(3) {
        margin-top:400px;
    }
    .layer:last-child {
        margin-top: 0px;
    }
    .layer:nth-child(4) {
        margin-top: 418px;
    }

}
/******************************** Body Content ***************************/
/*Header */
header {
    background: #eaf9ff
}
.sectionHeader p{text-align: center}
.sectionHeader{padding-bottom: 30px;}

.navbar {
    background: url(../images/header-bg.png) repeat-x #eaf9ff;
    border: none;
    min-height: 90px;
}

.secondLevelNav {
    padding: 20px 0;
    border-bottom: 1px solid #ccc;
    margin: 0
}

.secondLevelNav li {
    display: inline-block;
    vertical-align: top;
    min-width: 100px;
    text-align: center;
}

.secondLevelNav li a {
    display: block;
}

.headeroption {
    padding: 0 20px;
}

.headeroption p {
    font-size: 16px;
    padding: 15px 0 15px 70px;
    margin: 0;
    text-align: center;
}

.container-fluid {
    padding: 0 !important;
}

.sectiongrey {
    background: #eff4f1;
}

.navbar .navbar-nav li a {
    padding: 30px 10px;
    text-align: center;
    text-transform: uppercase;
    color: #ffffff;
    display: block;
    font-family: 'proxima_novasemibold';
}

.navbar-fixed-top {
    z-index: 99999999 !important;
}

.navbar .navbar-nav li {
    min-width: 90px;
    text-align: center;
}

/*.navbar .navbar-nav li:last-child {padding: 0;width:180px;}
.navbar .navbar-nav li:last-child a{padding:40px 10px;}
.navbar .navbar-nav li:last-child img {width:120px;text-align: center; vertical-align:middle;padding: 0;margin-top:-25px;}
.navbar .navbar-nav li:last-child{width:auto;text-align:  center;}*/
.navbar .navbar-nav li a:hover {
    color: #ffffff;
    background: none;
    font-weight: 600;
}

.navbar .navbar-nav.btnContent .btn {
    text-transform: uppercase;
    padding: 5px 12px
}

.navbar .navbar-nav.btnContent .btn.btn-default {
    text-transform: none;
}

.navbar .navbar-nav.btnContent a {
    padding: 25px 10px;
}

.navbar .navbar-nav.btnContent li {
    display: inline-block;
    vertical-align: top;
    text-align: center
}

.rightContent {
    float: right;
}

.navbar-default .navbar-toggle, .navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {
    background: none;
    border: none;
}

.navbar-default .navbar-toggle .icon-bar {
    background: #fff;
}

.navbar-header {
    transition: padding 0.5s;
    -webkit-transition: padding 0.5s;
    -moz-transition: padding 0.5s;
    -o-transition: padding 0.5s
}

.navbar-collapse {
    padding: 0px;
    margin: 0px;
}

.navbar-brand {
    width: 200px;
    padding: 15px 0;
}

.navbar-brand img {
    width:100%;
}

/*********************** Main Page ***********************/

.text-change {
    font-family: 'proxima_novasemibold' !important;
}

.brand-name {
    font-weight: 500;
    font-family: 'Raleway-Light' !important;
    font-size: 26px;
    padding: 70px;
    line-height: 50px;
    margin: 0px;
}

.cursive {
    font-family: "GreatVibes-Regular";
    font-size: 65px;
    line-height: 60px;
}

.text, .text1 {
    width: 300px;
    margin: 20px auto 10px;
    font-size: 16px;
    font-weight: 500;
    display: block;
}

.section {
    height: auto;
    padding: 80px 0;
}

.section p.cursive {
    margin-bottom: 20px;
}

.container-start {
    margin-top: 160px;
}

/* Section1 */
.sectionContainer {
    padding: 50px 0
}

.secHeader .title {
    font-size: 18px;
    text-transform: uppercase;
    margin: 0
}

.webContent {
    margin: 30px 0 100px
}

.sectionContainer .carousel-indicators {
    bottom: -50px;
}

.sectionContainer .carousel-indicators li {
    border: 1px solid #44adbf;
    width: 12px;
    height: 12px;
}

.sectionContainer .carousel-indicators .active {
    background: #44adbf;
    margin: 1px;
}

.contentList li {
    padding: 10px 20px;
    margin-bottom: 20px;
    background: #ffffff;
    -webkit-box-shadow: 0px 3px 2px 0px rgba(0, 0, 0, 0.14);
    -moz-box-shadow: 0px 3px 2px 0px rgba(0, 0, 0, 0.14);
    box-shadow: 0px 3px 2px 0px rgba(0, 0, 0, 0.14);
}

.listCard p {
    overflow: hidden;
    text-align: left;
    font-size: 16px;
    margin: 10px 0;
    line-height: normal;
    text-overflow: ellipsis;
    height: 40px;
}

.icon-holder {
    float: left;
}

.listCard a, .newsContent a {
    font-size: 12px;
    color: #f3806c
}

/* Testimonials */
.testimonialCard {
    width: 300px;
    background: url(../images/testimonialbg.svg) 10px 0 no-repeat #ffffff;
    padding: 10px;
    border: 1px solid #404040;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    margin: auto;
}

.testimonialContent {
    padding: 20px 30px;
    border: 1px dashed #8f8f8f;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}

.testimonialContent img {
    margin-bottom: 20px;
}

.testimonialContent h5 {
    margin: 0 0 5px;
    text-transform: uppercase;
}

.testimonialContent .subtitle {
    margin: 0 0 10px;
    text-transform: uppercase;
    font-size: 12px;
    font-family: "proxima_novasemibold"
}

.newsContent {
    width: 300px;
    margin: 0 auto;
}

.newsContent img{border: 2px solid #868585;margin-bottom: 10px;
    -webkit-border-radius:6px;
    -moz-border-radius:6px;
    border-radius:6px;}

/*Subscribe Form */
.subscribeContent .form-control {
    width: 600px;
}

.owl-carousel.webCarousel .owl-next, .owl-carousel.webCarousel .owl-prev{width:40px;height: 50px;display: inline-block;background: url(../images/sprite.svg) no-repeat;color: transparent;position: absolute;top:40%;}
.owl-carousel.webCarousel .owl-next{background-position: -20px -180px;right:-10px;}
 .owl-carousel.webCarousel .owl-prev{background-position:-60px -180px;left:-10px;}


/**************************** animations *************************/

.section2 .illustrations {
    position: relative;
    height: 500px;
}

.illustration {
    position: relative;
    height: 500px;
}

#blue_mount {
    height: 300px;
    width: 280px;
    position: absolute;
    bottom: 0px;
    left: 20px;
}

#orange_mount {
    width: 400px;
    height: 500px;
    position: absolute;
    bottom: -65px;
    left: 110px;
}

#home {
    width: 115px;
    height: 80px;
    position: absolute;
    bottom: 21px;
    left: 330px;
    z-index: 1;
}

#tree {
    width: 70px;
    height: 140px;
    position: absolute;
    left: 0px;
    bottom: 0px;
}

#path1 {
    position: absolute;
    width: 140px;
    height: 300px;
    left: 230px;
    bottom: 80px;
}

#path2 {
    width: 210px;
    position: absolute;
    height: 400px;
    bottom: -20px;
    left: 220px;
}

#path3 {
    position: absolute;
    bottom: -20px;
    left: 180px;
    width: 250px;
    height: 300px;
}

#path4 {
    width: 210px;
    position: absolute;
    bottom: 50px;
    left: 180px;
}

#flag {
    width: 170px;
    height: 135px;
    position: absolute;
    top: 27px;
    left: 255px;
    z-index: -1;
    backface-visibility: hidden;
}

#recall {
    width: 120px;
    height: 40px;
    position: absolute;
    bottom: 80px;
    left: 100px;
}

#concept {
    width: 120px;
    height: 40px;
    position: absolute;
    left: 381px;
    bottom: 135px;
}

#analysis {
    width: 120px;
    height: 40px;
    position: absolute;
    left: 150px;
    top: 275px;
}

#synthesis {
    width: 120px;
    height: 40px;
    position: absolute;
    left: 310px;
    top: 230px;
}

#goals {
    width: 120px;
    height: 40px;
    position: absolute;
    top: 130px;
    left: 253px;
    z-index: 2
}

#book {
    width: 370px;
    height: 70px;
    position: absolute;
    bottom: 0px;
    right: 70px
}

#cellphone {
    width: 160px;
    height: 240px;
    position: absolute;
    bottom: 30px;
    right: 170px;
    z-index: -1;
}

#rays {
    width: 350px;
    height: 160px;
    position: absolute;
    top: 100px;
    right: 75px
}

.icon {
    width: 60px;
    height: 70px;
}

#icon1 {
    position: absolute;
    top: 170px;
    right: 440px
}

#icon2 {
    position: absolute;
    top: 40px;
    right: 365px;
}

#icon3 {
    position: absolute;
    top: 15px;
    right: 220px
}

#icon4 {
    position: absolute;
    top: 65px;
    right: 70px;
}

#icon5 {
    position: absolute;
    top: 160px;
    right: 0px;
}

#icon6 {
    position: absolute;
    top: 180px;
    right: 0px;
}

#star1 {
    width: 35px;
    height: 35px;
    position: absolute;
    bottom: 150px;
    left: 10px;
}

#star2 {
    width: 35px;
    height: 35px;
    position: absolute;
    left: 520px;
    bottom: 150px;
}

#boy {
    width: 120px;
    height: 360px;
    position: absolute;
    top: 50px;
    left: 150px
}

#bcrown {
    width: 150px;
    height: 370px;
    position: absolute;
    top: -100px;
    left: 126px;
}

#gcrown {
    width: 130px;
    height: 370px;
    position: absolute;
    top: -85px;
    left: 282px;
}

#girl {
    width: 130px;
    height: 320px;
    position: absolute;
    top: 70px;
    left: 290px;
}

#badge1 {
    width: 70px;
    height: 90px;
    position: absolute;
    left: 44px;
    bottom: 75px;
}

#badge2 {
    width: 100px;
    height: 120px;
    position: absolute;
    left: 114px;
    bottom: 30px;
}

#badge3 {
    width: 130px;
    height: 180px;
    position: absolute;
    left: 215px;
    bottom: -28px;
}

#badge4 {
    width: 100px;
    height: 120px;
    position: absolute;
    left: 345px;
    bottom: 30px;
}

#badge5 {
    width: 70px;
    height: 110px;
    position: absolute;
    left: 450px;
    bottom: 50px;
}

#line {
    width: 2px;
    height: 560px;
}

#dashed {
    border-right: 2px dashed #575959;
    height: 470px;
    position: absolute;
    top: 20px;
    right: 293px;
}

#patch1 {
    width: 300px;
    height: 70px;
    position: absolute;
    top: 50px;
    right: 125px;
}

#patch2 {
    width: 300px;
    height: 70px;
    position: absolute;
    bottom: 110px;
    right: 135px;
}

#patch3 {
    width: 300px;
    height: 70px;
    position: absolute;
    bottom: 20px;
    right: 114px;
}

#patchg {
    width: 360px;
    height: 360px;
    position: absolute;
    top: 42px;
    z-index: 2;
    right: 74px;
}

#patch11 {
    width: 300px;
    height: 70px;
    position: absolute;
    top: 180px;
    right: 119px;
}

#bluerect {
    width: 520px;
    height: 160px;
    position: absolute;
    top: 140px;
    right: -10px;
    z-index: 1
}

#playcircle {
    width: 500px;
    height: 530px;
    position: absolute;
    bottom: 0px;
}

#city {
    width: 370px;
    height: 390px;
    position: absolute;
    bottom: -8px;
    left: 70px;
}

#school {
    width: 260px;
    height: 270px;
    position: absolute;
    left: 130px;
    bottom: 0px;
}

#boycircle {
    width: 160px;
    height: 160px;
    position: absolute;
    bottom: 0px;
    left: 180px;
}

#aplay {
    width: 150px;
    height: 70px;
    position: absolute;
    left: 330px;
    top: 45px;
}

#acity {
    width: 150px;
    height: 60px;
    position: absolute;
    left: 302px;
    top: 160px
}

#aschool {
    width: 150px;
    height: 60px;
    position: absolute;
    left: 330px;
    top: 280px;
}

#dashed1 {
    border-right: 3px dashed #575959;
    height: 500px;
    position: absolute;
    top: 0px;
    right: 260px;
}

#girl-circle {
    width: 125px;
    height: 125px;
    position: absolute;
    z-index: 1;
    right: 0px;
    top: 0px;
}

#parent-circle {
    width: 125px;
    height: 125px;
    position: absolute;
    z-index: 1;
    right: 470px;
    top: 0px;
}

#correct1 {
    width: 120px;
    height: 125px;
    position: absolute;
    z-index: 1;
    right: 347px;
    bottom: 114px;
}

#correct2 {
    width: 140px;
    height: 130px;
    position: absolute;
    z-index: 1;
    right: 49px;
    bottom: 118px;
}

#rmobile {
    width: 210px;
    height: 400px;
    position: absolute;
    right: 20px;
    bottom: 20px
}

#lmobile {
    width: 250px;
    height: 460px;
    position: absolute;
    right: 290px;
    bottom: 0px
}

#circular-arrow {
    width: 480px;
    height: 520px;
    position: absolute;
    top: -6px;
    z-index: 1;
    left: 0px;
}

#bgcircle {
    width: 400px;
    height: 400px;
    position: absolute;
    bottom: 30px;
    right: 55px;
}

#kids {
    width: 200px;
    height: 180px;
    position: absolute;
    left: 330px;
    top: 270px;
}

#book1 {
    width: 360px;
    height: 260px;
    position: absolute;
    right: 200px;
    bottom: -100px;
}

#book2 {
    width: 360px;
    height: 260px;
    position: absolute;
    right: 200px;
    bottom: -29px;
}

#book3 {
    width: 360px;
    height: 260px;
    position: absolute;
    right: 200px;
    bottom: 43px;
}

#book4 {
    width: 360px;
    height: 260px;
    position: absolute;
    right: 200px;
    bottom: 109px;
}

#engcircle {
    width: 130px;
    height: 130px;
    position: absolute;
    top: 0px;
    right: 200px;
}

#mathcircle {
    width: 130px;
    height: 130px;
    position: absolute;
    right: 0px;
    bottom: 87px;
}

#scicircle {
    width: 130px;
    height: 130px;
    position: absolute;
    right: 30px;
    top: 95px;
}
.errMsg {color:#ff3333;}
#school1 {
    width: 400px;
    height: 350px;
    position: absolute;
    left: 60px;
    top: 40px;
}

/*********************** section1 *************************/

.section1 a:hover .text, a:hover .text1 {
    font-weight: 600;
}

/*.img-circle {width: 215px;    margin-left: 70px;    height: 220px;    background-image: url("../images/MountainCircle.svg");    background-repeat: no-repeat;}*/

/*.img-circle:hover {    background-image: url("../images/MountainCircle_Lined.svg");    background-repeat: no-repeat;}*/

/*.img-circle1 {    width: 215px;    margin-left: 70px;    height: 220px;    background-image: url("../images/AssesmentCircle.svg");    background-repeat: no-repeat;}*/

/*.img-circle1:hover {    background-image: url("../images/AssesmentCircle_Lined.svg");    background-repeat: no-repeat;}*/

/*.img-circle2 {    width: 215px;    margin-left: 70px;    height: 220px;    background-image: url("../images/BooksCircle.svg");    background-repeat: no-repeat;}*/

/*.img-circle2:hover {background-image: url("../images/BooksCircle_Lined.svg");background-repeat: no-repeat;}*/

/************************ Parallax *****************************/

#scene1 {
    position: absolute;
    top: 0px;
    z-index: -1
}

#scene1 .layer:first-child {
    padding-top: 10px;
}

#scene1 .layer:nth-child(2) {
    margin-top: 450px;
}

#scene1 .layer:last-child {
    margin-top: 700px;
}

#scene3 .layer img {
    margin-left: 150px;
}

.more {
    padding: 10px 20px;
    border: 1px solid #000;
    background-color: #fff;
    border-radius: 100px;
    width: 230px;
    margin-top: 50px;
}

.section3 .more {
    padding: 10px 20px;
    border: 1px solid #000;
    background-color: #fff;
    border-radius: 100px;
    width: 230px;
    margin: 50px 70px;
}

.more a {
    font-size: 18px;
}

.more .arrow {
    font-size: 20px;
    font-weight: 500 !important;
    transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -webkit-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
}

.more:hover .arrow {
    padding-left: 5px;
    transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -webkit-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
}

/****************************** section 2 ***************************/
.gicon{    width: 120px;
    margin-top: -5px;}
.section2 {
    overflow: hidden;
    position: relative;
    height: auto;
    margin-top: -50px;
    z-index: 999999;
}

.blocks {
    padding: 100px 0; /*  border: 1px solid #be0c0c;*/
}

.blocks:last-child {
    padding-bottom: 0px;
}

.blocks:first-child {
    padding-top: 0px;
}

.section2 {
    padding: 100px 0;
}

.section3, .section4 {
    padding: 150px 0;
}

.section2 .para {
    padding: 100px 0px 0px 100px;
}

.para p, .para1 p, .para2 p {
    font-size: 15px;
    padding: 20px 20px 0px 0px;
}

.para1 {
    padding: 100px 50px 0 20px;
}

.section2 .para2 {
    padding: 150px 70px 0 20px;
}

/*****************************Section 3***********************************/

.section3 .para {
    padding: 100px 0 0 70px;
}

.bar-graph {
    height: 400px;
    border-bottom: 2px solid #404040;
    margin: 50px 50px 0px 0px;
}

.bar {
    width: 50px;
    height: 400px;
    margin: 40px 30px 0 30px;
    border: 2px solid #404040;
    height: 360px;
    display: inline-block;
    position: relative;
}

.bars1 {
    height: 270px;
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background: #51d1e1;
    -webkit-animation: grow 2s;
    -moz-animation: grow 2s;
    -o-animation: grow 2s;
    animation: grow 2s;
    -webkit-animation-delay: 0.9s;
    -moz-animation-delay: 0.9s;
    -o-animation-delay: 0.9s;
    animation-delay: 0.9s;
}

.bars2 {
    height: 230px;
    background: #51d1e1;
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: 0px;
    -webkit-animation: grow 2s;
    -moz-animation: grow 2s;
    -o-animation: grow 2s;
    animation: grow 2s;
    -webkit-animation-delay: 0.9s;
    -moz-animation-delay: 0.9s;
    -o-animation-delay: 0.9s;
    animation-delay: 0.9s;
}

.bars3 {
    height: 200px;
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background: #51d1e1;
    -webkit-animation: grow 2s;
    -moz-animation: grow 2s;
    -o-animation: grow 2s;
    animation: grow 2s;
    -webkit-animation-delay: 0.9s;
    -moz-animation-delay: 0.9s;
    -o-animation-delay: 0.9s;
    animation-delay: 0.9s;
}

.bars4 {
    height: 300px;
    background: #51d1e1;
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: 0px;
    -webkit-animation: grow 2s;
    -moz-animation: grow 2s;
    -o-animation: grow 2s;
    animation: grow 2s;
    -webkit-animation-delay: 0.9s;
    -moz-animation-delay: 0.9s;
    -o-animation-delay: 0.9s;
    animation-delay: 0.9s;
}

@-webkit-keyframes grow {
    0% {
        height: 0px;
    }
}

@-moz-keyframes grow {
    0% {
        height: 0px;
    }
}

@-o-keyframes grow {
    0% {
        height: 0px;
    }
}

@keyframes grow {
    0% {
        height: 0px;
    }
}

.percent {
    position: absolute;
    top: 50px;
    font-weight: 600
}

.percent li {
    width: 50px;
    margin: 0px 33px;
    float: left;
    text-align: center;
    font-size: 24px;
    color: #51d1e1;
    font-weight: 600;
}

.text-below li {
    text-align: center;
    float: left;
    font-size: 14px;
    margin: 0 0 0 30px;
    padding: 10px 30px 0 0;
    font-weight: 600;
}

.graph {
    background: url(../images/Graph_Lines.svg);
    background-repeat: no-repeat;
    width: 100%;
    height: 500px;
    margin: 50px 0 0 0px;
}

/************************Section 4*****************************/

.section4 .para {
    padding: 100px 0 0 50px;
}

/*********************** Footer ****************************/

footer {
    padding-top: 100px;
    overflow: hidden;
}

.navlist {
    padding: 0px 0 50px 0;
}

.navlist li {
    padding: 0 0 15px;
    font-size: 20px;
    font-family: "proxima_novasemibold";
    text-transform: uppercase;
}

.navlist li a {
    color: #404040;
}

.navlist li sub {
    bottom: 0;
    font-size: 14px;
}

#contact h3 {
    font-size: 20px;
    font-family: "proxima_novasemibold";
    margin: 0 0 10px;
    color: #404040
}

#contact>p {
    font-size: 18px;
    padding: 10px 0
}

#contact form {
    padding: 60px 0;
}

#contact .form-group input, .form-group textarea {
    width: 100%;
    padding: 10px;
    border: 2px solid #999999;
    border-radius: 0 !important;
    resize: none;
}

#contact form .btn {
    text-align: center;
    border: 2px solid #404040;
    padding: 5px 30px;
    font-size: 20px;
    background-color: #fff;
}

#contact form .btn:hover {
    background-color: #51d1e1;
    color: #fff;
}

#contact form .btn:disabled {
    background-color: #cecece;
    color: #000;
}

#contact .btn:focus {
    outline: 0;
}

.googleplay {
    margin-top: 7px;
}

#contact {
    padding-bottom: 10px;
}

footer .form-group input:focus, textarea:focus {
    border-color: #999999;
    box-shadow: none;
    outline: none;
}
.footerSection{padding:20px 0;border-top:3px dashed #cecece;margin-top: 10px}
.socialList{margin: 0;}
.socialList li{display: inline-block;vertical-align: bottom;margin: 0 5px;}
.footerSection p{padding-top: 20px;
}

.social-icons {
    width:45px;
    height:45px;
    display: inline-block;
    vertical-align: top;
    background: url(../images/sprite.svg) no-repeat;
}
.facebook-icon{background-position:-19px -128px;}
.twitter-icon{background-position:-64px -128px}
.googlePlus{background-position: -107px -128px;}
.pinterest{background-position: -152px -128px;}

#contact .query {
    float: right;
}

#scene .layer img {
    margin-left: 150px;
}

.error {
    font-weight: 600;
    margin-left: 10px;
    color: #ff0000;
}

.error_show {
    color: red;
    margin-left: 10px;
}

input.invalid, textarea.invalid {
    border: 2px solid red;
}

input.valid, textarea.valid {
    border: 2px solid green;
}
.contactlist li a{font-size: 20px;padding-bottom: 10px;}
.contactlist li a:hover, .contactlist li a:focus{color:#404040;}
.fContacticons{width:25px;height:25px;display: inline-block;vertical-align: middle;background: url(../images/sprite.svg) no-repeat}
.mail{background-position: -20px -52px;}
.call{background-position:-44px -52px;}
.whatsApp{background-position: -68px -52px;}

/*********************** Features ****************************/

.feature-sec1 {
    background: #f9f2e7;
}

.feature-sec3, .feature-sec5, .feature-sec7 {
    background: #f9f2e7;
    position: relative;
    z-index: -1;
    padding-top: 100px;
}

.feature-sec2 .para, .feature-sec4 .para, .feature-sec6 .para {
    padding: 0px;
}

.feature-sec3 .para1, .feature-sec5 .para1, .feature-sec7 .para1 {
    padding: 0px;
    font-size: 16px;
}

.feature-sec2 .para h2, .feature-sec3 .para1 h2, .feature-sec4 .para h2, .feature-sec5 .para1 h2, .feature-sec6 .para h2, .feature-sec7 .para1 h2 {
    text-transform: uppercase;
}

.feature-sec1 p:last-child {
    padding-bottom: 150px;
}

.feature-sec1 {
    padding: 150px 0 100px;
}

.rewards-sec1 {
    padding: 150px 0 150px;
}

.feature-sec1 .heading {
    padding: 50px 50px 20px;
    line-height: 50px;
}

.feature-sec1 p, .rewards-sec1 p, .bloom-sec1 p {
    font-size: 18px;
}

.feature-sec2, .feature-sec4, .feature-sec6 {
    overflow: hidden;
    background: #eaf9ff;
    z-index: 1;
    padding-top: 100px;
}

.feature-sec3 .carousel, .feature-sec5 .carousel, .feature-sec7 .carousel {
    width: 250px;
    margin: 0 auto;
    z-index: 1;
}

.feature-sec1 .carousel, .feature-sec2 .carousel, .feature-sec4 .carousel, .feature-sec6 .carousel {
    width: 250px;
    margin-left: 95px;
    z-index: 1;
}

.feature-sec2 .blocks, .feature-sec3 .blocks, .feature-sec4 .blocks, .feature-sec5 .blocks, .feature-sec6 .blocks, .feature-sec7 .blocks {
    padding: 80px 0 0;
}

.feature-sec1 .carousel-inner, .feature-sec2 .carousel-inner, .feature-sec3 .carousel-inner, .feature-sec4 .carousel-inner, .feature-sec5 .carousel-inner, .feature-sec6 .carousel-inner, .feature-sec7 .carousel-inner {
    z-index: -5;
    width: 250px;
}

.feature-sec1 .carousel-control.left, .feature-sec2 .carousel-control.left, .feature-sec3 .carousel-control.left, .feature-sec4 .carousel-control.left, .feature-sec5 .carousel-control.left, .feature-sec6 .carousel-control.left, .feature-sec7 .carousel-control.left {
    background-image: none !important;
    left: -90px;
}

.feature-sec3 .carousel-control.right, .feature-sec5 .carousel-control.right, .feature-sec7 .carousel-control.right {
    background-image: none !important;
    right: -85px;
}

.feature-sec2 .carousel-control.right, .feature-sec4 .carousel-control.right, .feature-sec6 .carousel-control.right {
    background-image: none !important;
    right: -85px;
}

.feature-sec1 .carousel-control a, .feature-sec2 .carousel-control a, .feature-sec3 .carousel-control a, .feature-sec4 .carousel-control a, .feature-sec5 .carousel-control a, .feature-sec6 .carousel-control a, .feature-sec7 .carousel-control a {
    color: #000 !important;
    font-weight: 100;
}

.feature-sec1 .carousel-control, .feature-sec2 .carousel-control, .feature-sec3 .carousel-control, .feature-sec4 .carousel-control, .feature-sec5 .carousel-control, .feature-sec6 .carousel-control, .feature-sec7 .carousel-control {
    top: 45% !important;
    opacity: 1 !important
}

.feature-sec1 .carousel-inner .carousel-control span, .feature-sec2 .carousel-inner .carousel-control span, .feature-sec3 .carousel-inner .carousel-control span, .feature-sec4 .carousel-inner .carousel-control span, .feature-sec5 .carousel-inner .carousel-control span, .feature-sec6 .carousel-inner .carousel-control span, .feature-sec7 .carousel-inner .carousel-control span {
    border: 1px solid #404040
}

.carousel-control img {
    width: 40px;
    height: 40px;
}

.feature-sec2 .carousel-inner > .item, .feature-sec4 .carousel-inner > .item {
    width: 100% !important;
}

.feature-sec5 .carousel-inner > .item {
    width: 100%;
    top: 6px;
}

.feature-sec3 .carousel-inner > .item {
    width: 100%;
}

.mobile {
    position: absolute;
    width: 317px;
    left: -38px;
    bottom: 0px;
    z-index: -1;
}

.mobile1 {
    position: absolute;
    width: 317px;
    left: -38px;
    bottom: 0px;
    z-index: -1;
}

.mobile2 {
    position: absolute;
    width: 317px;
    left: -38px;
    bottom: 0px;
    z-index: -1;
}

.mobile3 {
    position: absolute;
    width: 316px;
    left: -38px;
    bottom: 0px;
    z-index: -1;
}

/************ About us **********************/

.about-sec1 .container {
    padding-top: 150px
}

.about-sec1 h2 {
    padding: 16px 0 0;
    font-size: 45px;
}

.about-sec1 .heading {
    padding: 0 60px;
}

.about-sec1 p {
    font-size: 18px;
    width: 1000px;
    margin: 20px auto;
    padding: 10px 20px;
}

.about-sec1 .close-icon {
    padding: 30px 0px 0px;
}

.about-sec1 .row {
    padding: 50px 0;
}

.about-sec2 .blocks {
    padding: 50px 0;
}

.about-sec2 li {
    float: left;
    padding: 10px;
}

.about-sec2 .para {
    padding: 0px 50px 0 0;
}

.about-sec2 .h2 span {
    display: block;
    font-size: 15px;
}

.about-sec2 .para h3 {
    font-size: 22px;
    margin: 0px;
}

.about-sec2 .para h3 .text-change {
    font-size: 22px;
}

.about-sec2 .para .sub-heading {
    font-size: 15px;
    font-weight: 800;
    display: block;
}

.about-sec2 .crew {
    background-color: #dfd5c7;
    height: 200px;
    width: 200px;
    border-radius: 50%;
    margin-left: 100px;
    overflow: hidden;
    position: relative;
}

.crew img {
    width: 200px;
    height: 200px;
    background-image: url(../images/crew_image_placeholder.png);
    position: absolute;
    left: 0;
    -webkit-transition: opacity 0.5s ease-in-out;
    -moz-transition: opacity 0.5s ease-in-out;
    -o-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
}

.crew img.avtars1:hover {
    opacity: 0;
}

/****************************** Rewards ***********************************/

.rewards-sec1 .illustration {
    height: 300px;
    margin: 0 150px;
}

.rewards-sec1 .illustration #star1 {
    top: 100px;
}

.rewards-sec1 .illustration #star2 {
    top: 100px;
}

.rewards-sec2 ul {
    padding: 0 0 0 20px;
}

.rewards-sec2 ul li {
    list-style-image: url(../images/tick.png);
}

.rewards-sec2 .para1 {
    padding: 50px 0 0 100px;
}

.rewards-sec4 .para {
    padding: 100px 0px 0px 100px;
    font-size: 16px
}

.rewards-sec3 .para {
    padding: 100px 150px 0px 20px;
    font-size: 16px
}

.rewards-sec1, .rewards-sec3 {
    background: #f9f2e7;
}

.rewards-sec1 .heading {
    padding: 0 80px 20px;
}

.rewards-sec2 .blocks, .rewards-sec3 .blocks, .rewards-sec4 .blocks {
    padding: 100px 0;
}

.rewards-sec3 .par {
    padding-top: 50px;
}

.rewards {
    width: 600px;
    margin: 0 auto;
}

.rewards-sec2 .rewards {
    width: 480px;
    margin: 0 auto;
}

.rewards-sec1 h2 {
    padding: 10px;
}

.rewards-sec1 .content p {
    font-size: 18px;
    width: 1000px;
    margin: 0 auto;
    padding: 30px 10px;
}

.rewards-sec1 > img {
    width: 100%;
}

.rewards-sec2 .illustration {
    padding-top: 30px;
}

#rewards-star1 {
    width: 35px;
    height: 35px;
    position: absolute;
    top: 70px;
    left: -26px;
}

#rewards-star2 {
    width: 35px;
    height: 35px;
    position: absolute;
    left: 620px;
    top: 70px
}

#rewards-badge1 {
    width: 90px;
    height: 90px;
    position: absolute;
    left: 10px;
    bottom: 120px
}

#rewards-badge2 {
    width: 120px;
    height: 120px;
    position: absolute;
    left: 100px;
    bottom: 75px
}

#rewards-badge3 {
    width: 180px;
    height: 180px;
    position: absolute;
    left: 225px;
    bottom: 0px
}

#rewards-badge4 {
    width: 120px;
    height: 120px;
    position: absolute;
    left: 410px;
    bottom: 75px
}

#rewards-badge5 {
    width: 90px;
    height: 110px;
    position: absolute;
    left: 530px;
    bottom: 100px
}

.illustration #scene2 .layer:nth-child(3) img {
    width: 300px;
    height: 250px;
    margin-top: 100px;
}

.illustration #scene2 .layer:nth-child(2) img {
    width: 200px;
    height: 200px;
    margin-top: 120px;
    margin-left: 200px;
}

.illustration #scene2 .layer:first-child img {
    width: 150px;
    height: 160px;
    margin-top: 130px;
    margin-left: 360px;
}

.illustration #scene2 .layer:nth-child(4) img {
    width: 500px;
    height: 160px;
    margin-left: 30px
}

.illustration #scene2 .layer:nth-child(5) {
    width: 400px;
    height: 160px;
    margin-top: 50px;
}

.illustration #scene2 .layer:last-child img {
    width: 150px;
    height: 160px;
    margin-top: 240px;
    margin-left: 300px;
}

#gm {
    width: 150px;
    height: 170px;
    position: absolute;
    right: 192px;
    z-index: 1;
    top: 10px;
}

#gms {
    width: 120px;
    height: 50px;
    position: absolute;
    top: -30px;
    right: 208px;
}

#gmt {
    width: 90px;
    height: 60px;
    position: absolute;
    right: 360px;
    top: 60px;
}

#mas {
    width: 130px;
    height: 130px;
    position: absolute;
    right: 55px;
    bottom: 70px;
    z-index: 1;
}

#masT {
    width: 100px;
    height: 100px;
    position: absolute;
    right: -58px;
    bottom: 70px;
}

#reward-mount {
    width: 370px;
    height: 400px;
    position: absolute;
    bottom: 0px;
    right: 80px;
}

#starl {
    width: 70px;
    height: 100px;
    position: absolute;
    top: 150px;
    right: 400px;
}

#starR {
    width: 90px;
    height: 100px;
    position: absolute;
    right: 20px;
    bottom: 150px;
}

#sup-mas {
    width: 135px;
    height: 150px;
    position: absolute;
    top: 200px;
    right: 300px;
    z-index: 1;
}

#sup-mast {
    width: 80px;
    height: 100px;
    position: absolute;
    right: 450px;
    bottom: 170px;
}

#mount1 {
    width: 220px;
    height: 150px;
    position: absolute;
    bottom: 22px;
    right: 136px;
}

#mount2 {
    width: 220px;
    height: 150px;
    position: absolute;
    bottom: 90px;
    right: 130px;
}

#mount3 {
    width: 220px;
    height: 150px;
    position: absolute;
    top: 120px;
    right: 153px;
}

.rewards-sec3 .illustration {
    margin-top: 80px;
}

.rewards-sec4 .carousel .carousel-inner {
    background: none;
}

.rewards-sec4 .carousel-inner > .item img {
    margin: 65px 30px 0 35px;
    width: 350px !important;
}

.rewards-sec4 .carousel {
    width: 400px;
    margin: 0 auto
}

.rewards-sec4 .carousel-control {
    top: 240px;
    background: none !important;
    opacity: 1
}

.rewards-sec4 .carousel-control.left {
    left: -70px;
}

.rewards-sec4 .carousel-control.right {
    right: -85px
}

/************ faq  *****************/

.faq {
    padding-top: 100px;
}

.faq .container {
    padding-top: 20px;
}

.faq ul {
    margin-left: 20px;
}

.faq li {
    list-style-type: disc;
    padding: 5px;
}

.faq-ques {
    padding: 50px 0 100px 10px;
}

.faq-wrap {
    background-color: #f9f2e7
}

.faq .panel {
    box-shadow: none !important;
}

.faq .panel-group {
    padding: 50px 0 0;
}

.faq h3 {
    border-bottom: 2px dashed #404040;
    padding: 10px 10px 10px 0
}

.faq .panel, .panel-default .panel-heading, .panel-default {
    background: none !important;
    border: none;
}

.faq .panel-group .panel-heading + .panel-collapse > .panel-body {
    border: none !important;
}

.faq .panel-default > .panel-heading h4 {
    line-height: 25px;
}

.faq .panel-default > .panel-heading {
    padding-left: 0px !important;
}

.faq .panel-default > .panel-heading > .panel-title {
    font-weight: 600;
}

/*Pricing */

.pricing-sec1 h2 {
    padding: 16px 0px 0 0;
}

.pricing-sec1 {
    padding: 0px 0 0px;
}

.pricing-sec1 .cursive {
    margin-right: 15px;
}

.pricing-sec1 .heading {
    margin: 50px auto 20px;
    width: 400px;
}

.pricing-sec1 {
    padding: 100px 0 400px;
    height: 100%;
}

.pricing-sec1 .row {
    padding-top: 100px;
}

.pricing-sec3 p {
    padding: 100px 0px 50px;
    font-size: 22px;
}

.pricing-sec3 i {
    padding: 100px 0px 50px;
    font-size: 22px;
}

.pricing-sec3 .rupee {
    font-family: 'rupee_foradianregular';
    color: #404040;
    font-size: 18px;
    padding: 2px 5px;
}

#monthlyplan {
    width: 250px;
}

#yearlyplan {
    width: 250px;
}

#quaterlyplan {
    width: 250px;
}

.pricing-sec1 .tag-text {
    text-align: center;
    font-family: 'Raleway-Medium';
    margin: 0 auto;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    position: absolute;
}

.pricing-sec1 .tag-text p {
    font-size: 30px;
    width: 150px;
    position: absolute;
    top: 475px;
    left: 0;
    right: 0;
    margin: 0 auto;
}

.pricing-sec1 .tag-text p span {
    font-size: 25px;
    display: block
}

.pricing-sec1 .tag-text i {
    font-size: 20px;
    width: 150px;
    position: absolute;
    top: 660px;
    left: 0;
    right: 0;
    margin: 0 auto;
}

.pricing-sec1 .tag-text i label {
    font-size: 25px;
    display: block
}

.pricing-sec3 .table > thead > tr > th, .pricing-sec3 .table > tbody > tr > td {
    border: none !important;
    font-size: 20px;
}

.pricetext {
    position: relative;
    top: 35px;
    z-index: 5;
    height: 700px;
}

.monthly {
    -webkit-animation: mover 2s infinite alternate;
    -moz-animation: mover 2s infinite alternate;
    -o-animation: mover 2s infinite alternate;
    animation: mover 2s infinite alternate;
}

.yearly p {
    padding-top: 45px;
}

.yearly i {
    padding-top: 25px;
}

.yearly {
    -webkit-animation: mover2 2s infinite alternate;
    -moz-animation: mover2 2s infinite alternate;
    -o-animation: mover2 2s infinite alternate;
    animation: mover2 2s infinite alternate;
}

.quaterly {
    -webkit-animation: mover1 2s infinite alternate;
    -moz-animation: mover1 2s infinite alternate;
    -o-animation: mover1 2s infinite alternate;
    animation: mover1 2s infinite alternate;
}

.price {
    color: #fff !important;
}

.pricing, .bloom {
    background: #f9f2e7;
    overflow: hidden !important;
}

.pricing #scene1 {
    position: absolute;
    z-index: 1;
    left: 0px;
    top: 100px;
}

.pricing #scene1 .layer img {
    margin-left: 0px;
}

.pricing #scene1 .layer:last-child {
    margin-top: 300px;
    margin-left: -370px;
}

.pricing #scene1 .layer:nth-child(2) {
    margin-top: 0px;
    margin-left: 250px;
}

.text-striked {
    text-decoration: line-through;
    padding: 0 8px;
    font-size: 18px;
}

.pricing-sec3 {
    padding: 0 0 100px;
}

.pricing-sec3 .table {
    border-right: 1px dashed #737372;
    margin: 30px 0 0px;
    padding-bottom: 50px;
}

.pricing-sec3 .table th {
    padding-bottom: 30px;
}

.nobd {
    border: none !important;
}

.pricing-sec1 .rupee {
    font-family: 'rupee_foradianregular';
}

@-webkit-keyframes mover {
    0% {
        transform: translateY(0);
    }
    100% {
        transform: translateY(-30px);
    }
}

@keyframes mover {
    0% {
        transform: translateY(0);
    }
    100% {
        transform: translateY(-30px);
    }
}

@-webkit-keyframes mover1 {
    0% {
        transform: translateY(0);
    }
    100% {
        transform: translateY(30px);
    }
}

@keyframes mover1 {
    0% {
        transform: translateY(0);
    }
    100% {
        transform: translateY(30px);
    }
}

@-webkit-keyframes mover2 {
    0% {
        transform: translateY(0);
    }
    100% {
        transform: translateY(-30px);
    }
}

@keyframes mover2 {
    0% {
        transform: translateY(0);
    }
    100% {
        transform: translateY(-30px);
    }
}

/******************** BLOOMS TAXONOMY **************************/

.bloom-sec1 {
    padding-top: 150px;
    position: relative;
    z-index: 10
}

.bloom-sec1 .heading {
    padding-bottom: 30px;
}

.bloom-sec2 .medium-screens {
    width: 500px;
    margin: 20px auto
}

.bloom-sec2 {
    padding-top: 50px;
    position: relative;
    z-index: 10
}

.bloom-sec3 {
    padding-top: 50px;
    position: relative;
    z-index: 10
}

.bloom-tabs li {
    text-align: center;
    border: 1px solid #404040;
    float: left;
    cursor: pointer;
}

.bloom-tabs li:nth-child(odd) {
    padding: 24px 10px;
    text-align: center;
    border: 2px solid #404040;
    float: left;
    border-radius: 50%;
    width: 80px;
    height: 80px;
    font-size: 20px;
}

.bloom-tabs li:nth-child(even) {
    width: 70px;
    margin: 40px 0;
}

.active-bloom {
    background: #f3806c;
    color: #fff;
}

.bloom-tabs {
    width: 540px;
    margin: 30px auto 10px;
}

.tabs-content {
    padding: 130px 80px;
}

.tabContent {
    display: none;
}

.tabContent h2 {
    text-transform: uppercase;
    font-weight: 600;
    margin-bottom: 20px;
}

.tabContent ul {
    margin: 20px 0 0 0px;
}

.bloom {
    position: relative;
}

.bloom #scene1 {
    position: absolute;
    z-index: 1;
    top: 100px;
}

.bloom #scene1 .layer:last-child {
    margin: 500px 0 0 200px;
}

.bloom #scene1 .layer:nth-child(2) {
    margin: 100px 0 0 50px;
}

.bloom #scene1 .layer:first-child img {
    margin: 50px 0 0 -70px;
}

/********************Graph**************************/

/*  Graph Container */

.graph-container {
    position: relative;
    width: 400px;
    height: 300px;
    left: 28px;
}

.graph-container > div {
    position: absolute;
    width: inherit;
    height: inherit;
    top: 95px;
}

.semi-bold {
    font-family: 'Raleway-SemiBold';
}

/***** BLOG ******/

.blog-sec1 {
    padding-top: 100px;
}

.blog-sec1 .heading {
    padding-bottom: 50px;
}

.bold {
    font-weight: 800;
    font-size: 24px;
}

.bloglist {
    float: right;
}

.bloglist li {
    float: left;
}

.bloglist li:nth-child(even) {
    float: left;
    width: 70px;
    padding: 5px
}

.bloglist li img {
    float: left;
    width: 30px;
}

.blog-sec1 .image {
    background: #ecf2f6;
    height: 300px;
    margin: 20px 10px 30px;
}

.article {
    font-size: 16px;
    padding-bottom: 80px;
}

.article span {
    display: block;
    padding: 30px 0;
}

.blog-sec2 {
    padding: 70px 0 50px;
}

.blog-sec2 .container {
    padding: 0px 0 50px;
}

.blog-sec2 .article {
    padding: 30px 15px;
}

.tags {
    padding: 10px 20px;
    margin: 0 20px;
    border: 1px solid #404040;
    border-radius: 30px;
    width: 100px;
    display: inline-block;
    text-align: center;
}

.blog-sec2 form {
    padding: 50px 15px;
}

.blog-sec2 .form-group textarea {
    width: 100%;
    padding: 10px 30px 30px 10px;
}

.blog-sec2 form .btn {
    padding: 5px 30px;
    background-color: #fff;
    color: #404040;
    border: 1px solid #404040;
    border-radius: 0;
}

.comments .img {
    width: 70px;
    height: 70px;
    background-color: #e4ddd3;
    border-radius: 50%;
}

.comments p span {
    font-size: 10px;
}

.comments p:first-child {
    padding: 10px 0 0;
}

.comments {
    padding: 30px 0 50px;
}

/* Curriculum */
.selectionSection{padding:30px 0;border-bottom: 1px solid #dadada;border-top:1px solid #dadada;}
.selectionSection h5{text-transform: none;margin: 0 70px 20px}

/* Tabs */
.nav-tabs.button-tab{ border:none;padding-left: 30px;}
.nav-tabs.button-tab li:last-child{    margin-right: 0;}
.nav-tabs.button-tab>li{    float:none; display:inline-block;vertical-align:top;border: 1px solid #3c3c3c;    -webkit-border-radius:20px;    -moz-border-radius:20px;    border-radius:20px;width:120px; background: #ffffff;margin: 0 10px}

.nav-tabs.button-tab>li a{font-family: 'proxima_novasemibold';text-align: center; color: #3c3c3c; font-size: 14px;border:none;padding:5px 10px;color:#3c3c3c;}
.nav-tabs.button-tab li.active, .button-tab li:hover{color:#ffffff;background: #fd654d; border-color: #fd654d}
.nav-tabs.button-tab>li.active a, .nav-tabs.button-tab>li a:hover{color:#ffffff ;background: no-repeat;border:none; }

.subjectContent{padding: 20px 0;}
.subjectContent h5, .subjectContent h6{text-transform: none; font-family: "proxima_novasemibold"}
.subjectContent p{padding: 0 30px;}

.learnCard{   -webkit-border-radius:10px;    -moz-border-radius:10px;    border-radius:10px;padding: 20px 0;text-align: left;position: relative;margin-bottom: 20px;height: 450px;}
.subjectContent.english .learnCard{background:url(../images/Curriculum/Eng_icn.svg) no-repeat 246px 88px #fbf3cd}
.subjectContent.maths .learnCard{background:url(../images/Curriculum/Math_icn.svg) no-repeat 246px 88px #fbf3cd}
.learnList>li{position: relative; padding: 10px 20px 10px 40px;}
.learnList>li:hover{background: #efe3a9;}
.learnList>li:hover > .curriculumSubContent{display: block}
.learnList>li:before{position: absolute; left:20px; content: ''; border:6px solid transparent; border-left-color: #ba8252;}
.curriculumSubContent{display:none;position: absolute;bottom: -150px; left:70%;width:400px;height:300px;background: #fff;border:1px solid #59bb97;padding:10px 20px;z-index: 1;-webkit-border-radius:10px;    -moz-border-radius:10px;    border-radius:10px;}
.curriculumSubContent:before{content: '';position: absolute; top:40%; left:-20px; border:10px solid transparent; border-right-color:#59bb97;}
.curriculumSubContent:after{content: '';position: absolute; top:40%; left:-19px; border:10px solid transparent; border-right-color:#ffffff;}
/* Line Tab */
.line-tab.nav-tabs, .line-tab.nav-tabs> li a{border:none;}
.line-tab.nav-tabs>li.active>a,.dashboard-container  .nav-tabs>li.active>a:focus,.dashboard-container  .nav-tabs>li.active>a:hover{border:none;background: none;}

/*Line Tab*/
.line-tab.nav-tabs{border-bottom: 1px solid #bdbdbd;}
.nav-tabs.line-tab>li{position: relative;    margin-bottom:0;}
.nav-tabs.line-tab>li:after{content: '';position: absolute;bottom:0;left:0;width:0;border-bottom: 3px solid transparent;  -webkit-transition: 0.3s ease-in-out; -moz-transition: 0.3s ease-in-out; -ms-transition: 0.3s ease-in-out; -o-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out;}
.nav-tabs.line-tab>li:hover:after, .nav-tabs.line-tab>li.active:after{width:100%; border-bottom: 3px solid #fd654d; }


/* MEDIA QUERIES*/

@media only screen and (max-width: 1600px) {
    #scene .layer img {
        margin: 0px;
        width: 100%;
    }

    .percent li {
        margin: 0 25px;
    }

    .bar {
        margin: 40px 10px 0 30px;
    }

    .text-below li {
        padding: 10px 15px 0 0
    }

    #scene1 .layer img {
        margin: 0px;
        width: 100%;
    }

    #scene1 {
        top: 20px;
    }

    /****** footer ******/


    #contact .form-group input, .form-group textarea {
        width: 100%;
    }

    #contact form {
        width: 100%;
    }

    .illsutration, .ilustrations {
        width: 100%;
    }

    .illsutration img, .ilustrations img {
        width: 100%;
    }

    #scene1 .layer:last-child {
        margin-top: 700px;
    }

    /**** Rewards *****/
    .rewards-sec1 .illustration {
        margin: 0 auto;
        width: 700px;
    }

    .rewards-sec1 .heading {
        padding: 0px;
        text-align: center;
    }

    .rewards-sec3 .illustration {
        margin-right: 50px;
    }

    .rewards-sec4 .carousel {
        margin-left: 50px;
    }

    /****** pricing *******/
    .pricing #scene1 {
        overflow: hidden !important;
    }

    .pricing #scene1 .layer:nth-child(2) {
        margin-left: 0px;
    }

    .pricing #scene1 .layer:last-child {
        margin: 0px;
        z-index: 5;
    }

    .pricing-sec1 {
        padding: 60px 0 400px;
    }

    /* FAQ */
    .faq-ques {
        padding: 20px 0 100px;
    }
}

/******* Media query 1366 ************/
@media only screen and (max-width: 1366px) {
    .navbar-brand {
        padding: 0px 10px;
    }

    .navbar-header {
        padding: 10px 20px 40px;
    }

    .brand-name {
        padding: 60px 0;
    }

    .blocks {
        padding: 50px 0;
    }

    .section2 {
        padding: 140px 0 80px;
    }

    .section3, .section4 {
        padding: 80px 0;
    }
}

/******* Media query 1024 ************/

@media only screen and (max-width: 1024px) {

    /**** header ****/

    .headeroption {
        padding: 0 7px;
    }
    .headeroption p{
        padding: 15px 0 15px 64px;
    }
    .navbar-header {
        padding: 0px;
    }

    .img-circle {
        margin: 0 40px;
    }

    .img-circle1 {
        margin: 0 40px;
    }

    .img-circle2 {
        margin: 0 40px;
    }

    .text {
        width: 230px;
        margin: 20px 25px 10px;
    }

    /*section3 */
    .percent li {
        margin: 0 25px;
    }

    .bar {
        margin: 40px 10px 0 30px;
    }

    .text-below li {
        padding: 10px 15px 0 0
    }

    /**** features ******/
    .feature-sec2 .para, .feature-sec4 .para, .feature-sec6 .para {
        padding: 0 20px;
    }

    .feature-sec3 .para1, .feature-sec5 .para1, .feature-sec7 .para1 {
        padding: 50px 0 0px 20px;
    }

    .phone-view {
        margin: 0px;
    }

    .feature-sec1 p:last-child {
        padding: 0px;
    }

    .feature-sec1 p {
        font-size: 16px;
    }

    .feature-sec1 h2 {
        font-size: 28px !important;
    }

    .feature-sec3 .carousel, .feature-sec5 .carousel, .feature-sec7 .carousel {
        margin: 0 auto;
        width: 250px;
    }

    .feature-sec3 .carousel-control.left {
        left: -90px;
    }

    .feature-sec3 .carousel, .feature-sec5 .carousel, .feature-sec7 .carousel {
        width: 250px;
        margin: 0px auto;
    }

    .feature-sec3 .para1, .feature-sec5 .para1, .feature-sec7 .para1 {
        padding: 0 20px;
    }

    .feature-sec1 p:last-child {
        padding: 0px;
    }

    .feature-sec1 p {
        font-size: 16px;
    }

    .feature-sec1 h2 {
        font-size: 28px !important;
    }

    .feature-sec3 .carousel, .feature-sec5 .carousel, .feature-sec7 .carousel {
        margin: 0 auto;
        width: 250px;
    }

    #carousel1 .carousel-control.left, .carousel-control.right {
        background-image: none !important;
        opacity: 1;
    }

    #carousel2 .carousel-control.left, .carousel-control.right {
        background-image: none !important;
        opacity: 1;
    }

    #carousel3 .carousel-control.left, .carousel-control.right {
        background-image: none !important;
        opacity: 1;
        z-index: 5;
    }

    #carousel1 .carousel-control {
        top: 55%;
    }

    #carousel2 .carousel-control {
        top: 55%;
    }

    #carousel3 .carousel-control {
        top: 57%;
    }

    #carousel3 .carousel-caption {
        position: static;
    }

    /**** rewards *****/
    .rewards-sec3 .para {
        padding: 100px 100px 0px 0px;
        font-size: 16px;
    }

    .rewards-sec1 .heading {
        padding: 0px 40px;
    }

    .rewards-sec1 .illustration {
        margin: 0 auto;
        width: 620px;
    }

    /*footer*/
    footer {
        padding-top: 80px;
    }

    #contact form {
        width: 300px;
        margin-left: 0px;
    }

    #contact p {
        padding-bottom: 20px;
    }

    #contact .form-group input, .form-group textarea {
        width: 300px;
    }

    .address {
        padding-left: 0px;
    }

    /**** pricing****/
    #monthlyplan {
        width: 210px;
    }

    #yearlyplan {
        width: 250px;
    }

    .text-below li {
        margin: 0 0 0 20px;
    }

    .bar-graph {
        margin: 50px 0px 0;
    }

    #quaterlyplan {
        width: 210px;
    }

    .pricing-sec1 .tag-text p {
        font-size: 15px;
        width: 140px;
        position: absolute;
        top: 400px;
        left: 0;
        right: 0;
        margin: 0 auto;
    }

    .yearly p {
        padding-top: 90px;
    }

    .pricing {
        overflow: hidden;
    }

    .pricing #scene1 .layer:nth-child(2) {
        margin-left: 0px;
    }

    .pricing #scene1 .layer:last-child {
        margin: 0px;
    }

    .pricing-sec1 .cursive {
        margin-left: 15px;
    }

    /** landing page */
    .par {
        color: #404040;
        text-shadow: none;
    }

    .par h2 {
        font-size: 18px;
        padding: 0 0 20px;
    }

    .section2 .more1 {
        margin: 0 auto;
    }

    .section2 .carousel-caption, .section3 .carousel-caption, .section4 .carousel-caption {
        position: static !important;
    }

    .cursive {
        font-size: 45px !important;
    }

    .now {
        margin-left: 15px;
    }

    .more {
        margin: 50px 70px;
    }

    .graph-container {
        width: 350px;
    }

    /** about us **/
    .about-sec1 h2 {
        padding: 6px 0 0;
        font-size: 45px;
    }

    .about-sec2 .crew {
        margin-left: 50px;
    }

    /* FAQ */
    .faq-ques {
        padding: 0px 0 100px;
    }

}

/******** Media query 800 *******/

@media only screen and (max-width: 800px) {
    .progressContent p{margin: 0}
     .rightContent {
        float: none;
        padding-bottom: 20px;
        margin: 0 30px 0px;
    }
    .carousel{margin-bottom: 60px;}

    .navbar .btnContent.navbar-nav {
        margin: 10px 0 8px;
    }
    .navbar-brand{padding: 0;margin: 15px 0 0}

    .navbar .navbar-nav.btnContent a {
        padding: 0 10px;
    }

    .collapse.in {
        background: #eff4f1
    }

    .navbar .navbar-nav li a, .navbar .navbar-nav li a:hover {
        color: #404040;
    }

    .secondLevelNav {
        border-top: 1px dashed #6b6d6d;
    }

    .container-start {
        margin-top: 120px;
    }

    .headeroption .icon-holder {
        float: none;
    }

    .secondLevelNav li {
        min-width: 30%
    }

    .navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse {
        max-height: 520px;
        height: auto;
        margin-top: 29px;
        border-bottom: 3px solid #44adbf;
        border-top:none;
    }

    .section1 {
        padding: 120px 0 70px;
    }

    /** header **/
    .pd30 {
        padding: 0 30px;
    }

    .navbar .navbar-nav li a #contact {
        padding: 0px;
    }

    .navbar .navbar-nav {
        padding: 40px 20px 0 0;
        transition: padding 0.5s;
        -webkit-transition: padding 0.5s;
        -moz-transition: padding 0.5s;
        -o-transition: padding 0.5s
    }

    .navbar .navbar-nav li a {
        padding: 0 0 10px;
    }

    .navbar .navbar-nav li:nth-child(8) a {
        padding: 20px 0 0 !important;
        margin: 0;
    }


    .text {
        width: 300px;
        margin: 10px auto 50px;
    }

    .text1 {
        width: 300px;
        margin: 10px auto 0px;
    }

    .navbar-header {
        height: 50px;
        transition: all 0.5s;
        -webkit-transition: all 0.5s;
        -moz-transition: all 0.5s;
        -o-transition: all 0.5s
    }

    .navbar-toggle {
        margin: 25px 20px 0;
        padding: 10px 5px;
    }

    .brand-name {
        font-size: 23px;
        padding: 0 30px 50px;
    }

    #scene .layer img {
        width: 100%;
    }

    #scene1 .layer img {
        width: 100%;
    }

    .img-circle {
        margin: 0px auto;
    }

    .img-circle1 {
        margin: 0 auto;
    }

    .img-circle2 {
        margin: 0 auto;
    }

    .section2 .para {
        text-align: center;
        padding: 0 110px;
    }

    .section2 .para1 {
        text-align: center;
        padding: 0 110px;
    }

    .section2 .para2 {
        text-align: center;
        padding: 0 110px;
    }

    .section3 .para {
        text-align: center;
        padding: 0 130px;
    }

    .section3 .para1 {
        text-align: center;
        padding: 0 110px;
    }

    .section4 .para {
        text-align: center;
        padding: 0 120px;
    }

    .section4 .para1 {
        text-align: center;
        padding: 0 110px;
    }

    #scene .layer img {
        margin: 0px;
    }

    .blocks {
        padding: 50px 0;
    }

    .par {
        padding: 0 20px;
        color: #404040;
        text-shadow: none;
    }

    .par p {
        font-size: 16px;
        margin: 0;
    }

    .par h2 {
        font-size: 18px;
        margin: 0px;
    }

    .section2 .more1 {
        margin: 30px auto 0;
    }

    .cursive {
        font-size: 55px !important;
    }

    .section3 .more {
        margin: 40px auto 0;
        display: block;
    }

    .section2 {
        padding: 110px 0 70px;
    }

    .section3, .section4 {
        padding: 70px 0;
    }

    /**** footer *****/


    footer {
        padding-top: 70px;
    }

    #contact form {
        margin: 0px;
        width: 100%;
    }

    #contact .query {
        float: left;
        margin: 0;
        line-height: 60px;
    }

    #contact {
        padding: 0px 0 30px;
    }

    #contact .form-group input, .form-group textarea {
        width: 100%;
    }

    #contact h3 {
        font-size: 18px;
        font-weight: 700;
        margin: 0px;
        line-height: 40px;
    }

    #contact p {
        padding: 0 0 20px;;
        margin: 0
    }

    .fb-like.fb_iframe_widget {
        padding: 50px 0 10px;
    }

    /*** rewards ***/
    .rewards-sec1 {
        padding: 150px 0 50px;
    }

    .rewards-sec1 .heading {
        padding: 0px;
    }

    .rewards-sec4 .carousel {
        height: 360px;
        margin: 0 auto;
    }

    .rewards-sec4 .carousel-inner > .item img {
        margin: 0 0 0 15px;
    }

    .address {
        padding: 20px 0 0 20px;
    }

    .rewards {
        width: 550px;
        margin: 0px auto;
    }

    .rewards-sec1 .heading {
        text-align: center;
    }

    .rewards-sec1 .cursive {
        margin-left: 30px;
    }

    .rewards-sec1 .illustration {
        margin: 0 20px;
    }

    .rewards-sec2 .par, .rewards-sec3 .par, .rewards-sec4 .par {
        padding: 20px;
    }

    .rewards-sec4 .carousel-control.right {
        right: -60px;
    }

    .rewards-sec4 .para {
        animation: none;
    }

    .rewards-sec2 .blocks, .rewards-sec3 .blocks, .rewards-sec4 .blocks {
        padding: 50px 0;
    }

    .h2 {
        font-size: 22px !important;
    }

    /*** pricing**/
    .pricing-sec1 {
        padding: 60px 0 50px;
    }

    #scene2 .layer img {
        width: 100%;
        margin: 0px;
    }

    #monthlyplan {
        width: 150px;
    }

    #yearlyplan {
        width: 160px;
    }

    #quaterlyplan {
        width: 150px;
    }

    .pricing-sec1 .row {
        padding: 0px;
    }

    .yearly p {
        padding-top: 35px;
    }

    .pricing-sec1 .tag-text p {
        top: 280px;
    }

    /*** features ***/
    .feature-sec2 .carousel, .feature-sec3 .carousel, .feature-sec4 .carousel, .feature-sec5 .carousel, .feature-sec6 .carousel, .feature-sec7 .carousel {
        animation: none;
        -webkit-animation: none;
        -moz-animation: none;
        -o-animation: none;
        animation: none;
    }

    .feature-sec2 .blocks, .feature-sec3 .blocks, .feature-sec4 .blocks, .feature-sec5 .blocks, .feature-sec6 .blocks, .feature-sec7 .blocks {
        padding: 0px;
    }

    .feature-sec2 .para, .feature-sec3 .para1, .feature-sec5 .para1, .feature-sec7 .para1, .feature-sec6 .para, .feature-sec4 .para {
        animation: none;
        -webkit-animation: none;
        -moz-animation: none;
        -o-animation: none;
        animation: none;
    }

    #carousel3 .carousel-caption {
        position: static;
    }

    .feature-sec1 p:last-child {
        padding: 0px 40px;
    }

    .feature-sec1 p {
        font-size: 16px;
    }

    .feature-sec1 h2 {
        font-size: 28px !important;
    }

    .feature-sec3 .carousel, .feature-sec5 .carousel, .feature-sec7 .carousel {
        margin: 0 auto 20px;
        width: 250px;
        animation: none;
    }

    .feature-sec2 .carousel, .feature-sec4 .carousel {
        margin: 0 auto 30px;
        animation: none;
    }

    .feature-sec6 .carousel {
        margin: 0 auto 20px;
        animation: none;
    }

    .feature-sec3 .para1, .feature-sec5 .para1, .feature-sec7 .para1 {
        padding: 0 50px 20px;
        text-align: center;
        background: #f9f2e7;
        animation: none;
        position: relative;
        z-index: 1;
    }

    .feature-sec2 .para, .feature-sec4 .para {
        text-align: center;
        padding: 0 50px 20px;
        position: relative;
        z-index: 1;
        background-color: #eaf9ff;
        animation: none;
    }

    .feature-sec6 .para {
        text-align: center;
        padding: 0px 50px 20px;
        position: relative;
        z-index: 1;
        background-color: #eaf9ff;
        animation: none;
    }

    .feature-sec2 h2, .feature-sec4 h2, .feature-sec6 h2, .feature-sec3 h2, .feature-sec5 h2, .feature-sec7 h2 {
        font-size: 20px !important;
        line-height: 28px !important;
    }

    .feature-sec2 p, .feature-sec4 p, .feature-sec6 p, .feature-sec3 p, .feature-sec5 p, .feature-sec7 p {
        font-size: 14px;
        padding: 10px 50px;
    }

    .mobile {
        width: 252px;
        left: 6px;
        bottom: 0px;
        z-index: 1;
    }

    .mobile1 {
        width: 252px;
        left: 6px;
        bottom: -1px;
        z-index: 1;
    }

    .mobile2 {
        width: 252px;
        left: 6px;
        bottom: -1px;
        z-index: 1;
    }

    .mobile3 {
        width: 252px;
        left: 6px;
        bottom: 0px;
        z-index: 1;
    }

    .feature-sec1 .carousel-inner, .feature-sec2 .carousel-inner, .feature-sec3 .carousel-inner, .feature-sec4 .carousel-inner, .feature-sec5 .carousel-inner, .feature-sec6 .carousel-inner, .feature-sec7 .carousel-inner {
        width: 200px;
        margin: 0 36px;
    }

    .feature-sec6 .carousel-inner > .item {
        width: 100%;
        top: 3px;
    }

    .feature-sec2 .carousel, .feature-sec3 .carousel, .feature-sec4 .carousel, .feature-sec5 .carousel, .feature-sec6 .carousel, .feature-sec7 .carousel {
        animation: none;
        -webkit-animation: none;
        -moz-animation: none;
        -o-animation: none;
        animation: none;
    }

    .feature-sec2 .para, .feature-sec3 .para1, .feature-sec5 .para1, .feature-sec7 .para1, .feature-sec6 .para, .feature-sec4 .para {
        animation: none;
        -webkit-animation: none;
        -moz-animation: none;
        -o-animation: none;
        animation: none;
    }

    /** faQ***/
    .faq .panel-group {
        padding: 20px 0 0;
    }

    .faq-ques {
        padding: 0px 40px 100px;
    }

    .pd {
        padding: 0px;
    }

    /** about us ***/
    .about-sec2 .para {
        padding: 0px 50px 0 70px;
    }

    .about-sec2 .para p {
        padding: 0px;
    }

    .about-sec2 .crew {
        margin: 0 auto 30px;
    }

    .about-sec2 .para h3 {
        text-align: center;
    }

    .about-sec2 .sub-heading {
        padding-bottom: 30px;
    }

    .about-sec1 h2 {
        margin: 6px 0 0 0;
        padding: 0
    }

    .about-sec2 .para {
        padding: 0px 20px;
    }

    .about-sec1 .heading {
        padding: 0px;
    }

    .about-sec1 h2 {
        margin: 25px 0 0 0;
        padding: 0;
    }

    .medium-screens {
        width: 500px;
        margin: 0 auto
    }

    /**** BLOOMS ****/
    .tabs-content {
        padding: 130px 20px;
    }

    .bloom-sec1 {
        padding-top: 100px;
    }

    /***** BLOG ******/
    .blog-sec1 {
        padding-top: 80px;
    }

    .blog-sec1 .heading {
        padding-bottom: 30px;
    }

    .bloglist li:nth-child(even) {
        float: left;
        width: 50px;
        padding: 5px
    }

    .bloglist li img {
        float: left;
        width: 30px;
    }

    .blog-sec1 .image {
        background: #ecf2f6;
        height: 300px;
        margin: 20px 10px 30px;
    }

    .article {
        font-size: 16px;
        padding-bottom: 80px;
    }

    .article span {
        display: block;
        padding: 30px 0;
    }

    .blog-sec2 {
        padding: 70px 0 50px;
    }

    .blog-sec2 .container {
        padding: 0px 0 50px;
    }

    .blog-sec2 .article {
        padding: 30px 15px;
    }

    .tags {
        padding: 10px 20px;
        margin: 0 20px;
        border: 1px solid #404040;
        border-radius: 30px;
        width: 100px;
        display: inline-block;
        text-align: center;
    }

    .blog-sec2 form {
        padding: 50px 15px;
    }

    .blog-sec2 .form-group textarea {
        width: 100%;
        padding: 10px 30px 30px 10px;
    }

    .blog-sec2 form .btn {
        padding: 5px 30px;
        background-color: #fff;
        color: #404040;
        border: 1px solid #404040;
        border-radius: 0;
    }

    .comments .img {
        width: 70px;
        height: 70px;
        background-color: #e4ddd3;
        border-radius: 50%;
    }

    .comments p span {
        font-size: 10px;
    }

    .comments p:first-child {
        padding: 10px 0 0;
    }

    .comments {
        padding: 30px 0 50px;
    }
    .curriculumGrade{text-align: center !important; margin-bottom: 30px;}
    .nav-tabs.button-tab{padding: 0;}
    .assessmentContent>img{width:100%;}
    .SubList li{display: block;width:100%; margin-bottom: 20px;}
    .topics{left:10px;width: 100%;top:70px;}
    .quiz-list li{    margin: 0 10px 20px;
        width: 40%;
    }
    .quizheader{height:100px;}
    .progressContent{width:auto; left:20px; top:70px;}
    .quizCompleted .mountainContnet{margin: 0;}
    .result-details{padding:30px 0;margin: 20px 0 30px;width:100%;}
    .result-details .bar{margin: 0 15px;}
    .result-details .bar-graph{width: 100%;}
    .result-details .percent li{margin: 10px 17px;}
    .playerdetails{padding: 0;}
    .asses-tab.nav-tabs>li{width:100%;margin-bottom: 20px;}
    .mountainContnet{border: none;}
    .headeroption p{
        padding: 15px 0;
    }
    .result-details .percent{left:27%}
    .wrapper{top:60px;right: 20px}
    .levelList li:first-child{top: 55%;left: 35%;}
    .levelList li:nth-child(2){top: 45%;    right: 35%;;}
    .levelList li:nth-child(3){top: 65%;    right: 30%;}
    .levelList li:last-child{top: 72%;left: 30%;}
    .subscribeContent .form-control {
        width: 100%;
    }
    .SubList li.active:before, .SubList li.active:after, .curriculumSubContent:before, .curriculumSubContent:after{display: none;}
    .curriculumSubContent{width:100%;left:0}
}

/******** Media query 767 *******/

@media only screen and (max-width: 767px) {
    /*** HEADER ***/
    .navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse{margin-top: -11px;}
    .navbar-header {
        height: 90px;
    }

    .navbar .navbar-nav {
        padding: 0px;
        margin: 40px 0 0px;
    }

    .navbar .navbar-nav li a {
        display: block;
    }

    .section2 .item img, .section3 .item img, .section4 .item img {
        width: 450px;
        height: 300px;
        margin: 0 auto;
    }

    #scene1 .layer:last-child {
        margin-top: 400px;
    }

    .section3 .more {
        margin: 20px auto
    }

    #carousel1 .carousel-indicators {
        top: 310px;
        height: 100px;
    }

    #carousel2 .carousel-indicators {
        top: 315px;
        height: 100px;
    }

    #carousel3 .carousel-indicators {
        top: 310px;
        height: 100px;
    }

    #carousel1 .carousel-indicators li, #carousel3 .carousel-indicators li {
        width: 30px;
        height: 5px;
        background-color: #CBECF9;
        border: 1px solid #CBECF9;
        margin: 0px;
        border-radius: 1px;
    }

    #carousel2 .carousel-indicators li {
        width: 30px;
        height: 5px;
        background-color: #E2D2BB;
        border: 1px solid #E2D2BB;
        margin: 0px;
        border-radius: 1px;
    }

    #carousel1 .carousel-indicators .active, #carousel3 .carousel-indicators .active {
        border: 1px solid #33ADDE;
        background-color: #33ADDE;
        height: 5px;
    }

    #carousel2 .carousel-indicators .active {
        border: 1px solid #7D7365;
        background-color: #7D7365;
        height: 5px;
    }

    .par {
        padding: 50px 20px 0
    }

    .section2 .carousel-caption, .section3 .carousel-caption, .section4 .carousel-caption {
        padding: 0px;
    }

    /**** FOOOTER *****/
    #contact form {
        margin: 0px !important;
        width: 90%;
    }

    #contact .form-group input, .form-group textarea {
        width: 100%;
    }

    .hidden-img {
        width: 500px;
        height: 500px;
        margin: 0 0 0 60px;
    }

    /**** PRICING ****/
    #monthlyplan {
        width: 120px;
    }

    #yearlyplan {
        width: 150px;
    }

    #quaterlyplan {
        width: 120px;
    }

    .yearly p {
        padding-top: 70px;
    }

    .pricing-sec1 .tag-text p {
        width: 112px;
        position: absolute;
        font-size: 12px;
        top: 228px;
        left: 0;
        right: 0;
        margin: 0 auto;
    }

    .pricing #scene1 .layer:last-child {
        margin: 60px 0 0 0;
    }

    .pricing-sec1 .illustration {
        height: 450px;
    }

    .pricing-sec1 {
        padding: 60px 0 0px;
    }

    .pricing #scene1 .layer:first-child {
        margin-top: 60px;
    }

    .pricing-sec1 .heading {
        text-align: center;
    }

    /*** REWARDS ***/
    .rewards-sec1 p {
        text-align: left;
        padding: 0 20px 30px;
    }

    .rewards-sec1 h2 {
        padding: 0px;
    }

    .rewards-sec1 .cursive {
        margin-left: 0px;
    }

    .h2 {
        font-size: 22px !important;
    }

    /*** ABOUT US ****/
    .about-sec1 h2 {
        margin: 24px 0 0 0;
    }

    /**** FEATURES ******/
    .feature-sec2 .carousel, .feature-sec3 .carousel, .feature-sec4 .carousel, .feature-sec5 .carousel, .feature-sec6 .carousel, .feature-sec7 .carousel {
        animation: none;
        -webkit-animation: none;
        -moz-animation: none;
        -o-animation: none;
        animation: none;
    }

    .feature-sec2 .para, .feature-sec3 .para1, .feature-sec5 .para1, .feature-sec7 .para1, .feature-sec6 .para, .feature-sec4 .para {
        animation: none;
        -webkit-animation: none;
        -moz-animation: none;
        -o-animation: none;
        animation: none;
    }

    .feature-sec2 .carousel-indicators li, .feature-sec4 .carousel-indicators li, .feature-sec6 .carousel-indicators li {
        width: 30px;
        height: 5px;
        border: 1px solid #CBECF9;
        background-color: #CBECF9;
        margin: 0px;
        border-radius: 1px;
    }

    .feature-sec3 .carousel-indicators li, .feature-sec5 .carousel-indicators li, .feature-sec7 .carousel-indicators li {
        width: 30px;
        height: 5px;
        border: 1px solid #E2D2BB;
        background-color: #E2D2BB;
        margin: 0px;
        border-radius: 1px;
    }

    .feature-sec2 .carousel-indicators .active, .feature-sec4 .carousel-indicators .active, .feature-sec6 .carousel-indicators .active {
        background-color: #33ADDE;
        border: 1px solid #33ADDE;
        height: 5px;
    }

    .feature-sec3 .carousel-indicators .active, .feature-sec5 .carousel-indicators .active, .feature-sec7 .carousel-indicators .active {
        background-color: #7D7365;
        border: 1px solid #7D7365;
        height: 5px;
    }

    .feature-sec2 .carousel-indicators, .feature-sec3 .carousel-indicators, .feature-sec4 .carousel-indicators, .feature-sec5 .carousel-indicators, .feature-sec6 .carousel-indicators, .feature-sec7 .carousel-indicators {
        top: 370px
    }

    .rewards-sec4 .carousel-indicators li {
        width: 30px;
        height: 5px;
        border: 1px solid #CBECF9;
        background-color: #CBECF9;
        margin: 0px;
        border-radius: 1px;
    }

    .rewards-sec4 .carousel-indicators .active {
        background-color: #33ADDE;
        height: 5px;
        border: 1px solid #33ADDE;
    }

    .rewards-sec4 .par {
        padding: 50px 20px 0;
    }

    .rewards-sec4 .carousel-indicators {
        top: 370px
    }

    /*** FAQ ***/
    .faq-ques {
        padding: 0px 20px 100px;
    }

    /*** About *****/
    .about-sec2 .para {
        padding: 0px 10px;
    }

    .result-details .percent {
        left: 18%;
    }
}

/******** Media query 480 *******/

@media only screen and (max-width: 480px) {
    /*** HEADER ***/
    .hidden-img {
        margin: 0 0 0 121px;
    }

    #carousel1 .carousel-indicators {
        top: 305px;
    }

    #carousel2 .carousel-indicators {
        top: 305px;
    }

    #carousel3 .carousel-indicators {
        top: 305px;
    }

    .head-raleway {
        margin: 6px 10px 0 0;
        font-size: 26px;
    }

    h2 {
        font-size: 27px !important;
    }

    .cursive {
        font-size: 45px !important;
    }


    .navbar-nav {
        margin: 0px;
    }

    #scene2 .layer img {
        width: 100%;
        margin: 0;
        padding: 0;
    }

    .par h2 {
        font-size: 22px !important;
        line-height: 28px !important;
    }

    .par p {
        font-size: 14px !important;
        padding: 0px;
        margin: 0px;
        font-weight: 100;
    }

    .brand-name {
        line-height: 33px;
    }

    .text, .text1 {
        width: 260px;
    }

    .rewards {
        width: 400px;
    }

    #carousel1 {
        padding-bottom: 0px;
    }

    /*** FEATURES ***/
    .feature-sec1 p:last-child {
        padding: 0px;
    }

    .feature-sec1 .heading {
        padding: 50px 20px 10px;
    }

    .feature-sec2 .carousel, .feature-sec3 .carousel, .feature-sec4 .carousel, .feature-sec5 .carousel, .feature-sec6 .carousel, .feature-sec7 .carousel {
        animation: none;
        -webkit-animation: none;
        -moz-animation: none;
        -o-animation: none;
        animation: none;
    }

    .feature-sec2 .carousel-indicators, .feature-sec3 .carousel-indicators, .feature-sec4 .carousel-indicators, .feature-sec5 .carousel-indicators, .feature-sec6 .carousel-indicators, .feature-sec7 .carousel-indicators {
        top: 325px
    }

    .feature-sec2 .para, .feature-sec3 .para1, .feature-sec5 .para1, .feature-sec7 .para1, .feature-sec6 .para, .feature-sec4 .para {
        animation: none;
        -webkit-animation: none;
        -moz-animation: none;
        -o-animation: none;
        animation: none;
    }

    .feature-sec2 p, .feature-sec4 p, .feature-sec6 p, .feature-sec3 p, .feature-sec5 p, .feature-sec7 p {
        padding: 0px 10px;
    }

    .feature-sec1 p, .rewards-sec1 p, .bloom-sec1 p {
        font-size: 14px;
    }

    .feature-sec2 .para, .feature-sec4 .para, .feature-sec3 .para1, .feature-sec5 .para1, .feature-sec7 .para1 {
        padding: 0px 0 20px;
    }

    .feature-sec6 .para {
        padding: 0px 0 20px;
        margin-top: 20px;
    }

    .feature-sec3 .carousel, .feature-sec5 .carousel {
        width: 260px;
        margin: 0 auto 20px;
    }

    .feature-sec7 .carousel {
        width: 250px;
    }

    .mobile {
        width: 220px;
        left: 12px;
    }

    .mobile1 {
        width: 220px;
        left: 12px;
    }

    .mobile2 {
        width: 220px;
        left: 12px;
    }

    .mobile3 {
        width: 220px;
        left: 12px;
    }

    .feature-sec2 .carousel-inner, .feature-sec3 .carousel-inner, .feature-sec4 .carousel-inner, .feature-sec5 .carousel-inner, .feature-sec6 .carousel-inner, .feature-sec7 .carousel-inner {
        width: 175px;
    }

    .feature-sec2 .carousel-inner > .item, .feature-sec4 .carousel-inner > .item, .feature-sec6 .carousel-inner > .item {
        width: 100% !important;
    }

    .feature-sec2 .carousel, .feature-sec3 .carousel, .feature-sec4 .carousel, .feature-sec5 .carousel, .feature-sec6 .carousel, .feature-sec7 .carousel {
        width: 250px;
        margin: 0 auto 25px;
    }

    .feature-sec3 .carousel-inner > .item, .feature-sec5 .carousel-inner > .item, .feature-sec7 .carousel-inner > .item {
        width: 100% !important;
    }

    .feature-sec6 .carousel {
        margin-top: 15%;
    }

    .feature-sec1 {
        padding: 100px 0 0px;
    }

    .rewards-sec1 {
        padding: 100px 0 50px;
    }

    /*** REWARDS ***/
    .rewards-sec1 p {
        padding: 0 50px 30px;
    }

    .rewards-sec1 .heading {
        padding: 0 70px;
    }

    .rewards-sec4 .carousel {
        height: 300px;
        width: 100%;
    }

    .rewards-sec4 .carousel-inner > .item img {
        width: 260px !important;
        margin: 0px auto !important
    }

    .rewards-sec2 .par, .rewards-sec3 .par, .rewards-sec4 .par {
        padding: 20px 10px 0;
    }

    .rewards .carousel {
        width: 300px !important;
    }

    .rewards-sec2 .rewards, .rewards-sec3 .rewards {
        width: 100%;
    }

    .rewards-sec1 p {
        text-align: left;
        padding: 30px 25px;
    }

    .rewards-sec1 .rewards {
        width: 100%;
    }

    .rewards-sec2 .para1, .rewards-sec4 .para1 {
        padding: 0px;
    }

    .rewards-sec1 .container {
        margin: 0px;
    }

    .rewards-sec1 .row:last-child {
        margin: 0px;
    }

    .rewards-sec4 .carousel-indicators {
        top: 275px;
    }

    /**** PRICING ****/
    .pricing #scene1 .layer:first-child {
        margin-top: 0px;
    }

    #monthlyplan {
        width: 90px;
    }

    #yearlyplan {
        width: 120px;
    }

    #quaterlyplan {
        width: 90px;
    }

    .pricetext {
        top: 50px;
    }

    .pricing-sec1 .tag-text {
        width: 140px;
    }

    .pricetext {
        height: 650px;
    }

    .pricing-sec1 .tag-text p {
        font-size: 9px;
        width: 82px;
        top: 170px;
    }

    .yearly p {
        padding-top: 70px;
    }

    #scene1 .layer:first-child {
        margin-top: 35px;
    }

    /**** FOOTER ****/
    #contact .btn-default {
        margin: 0;
        float: right;
    }

    .address {
        padding: 0 0 0 15px;
    }

    .address h3 {
        padding: 20px 0 0 0;
    }

    #contact h3 {
        font-size: 15px;
        margin: 0px;
        line-height: 40px;
    }

    #contact form {
        margin: 0px !important;
        width: 100%;
    }

    #contact .form-group input, .form-group textarea {
        width: 100%;
    }

    .address p {
        padding-bottom: 10px;
    }

    #contact p {
        padding: 0 0 10px;
        margin-bottom: 0px;
    }

    /*** ABOUT US ***/
    .about-sec1 .heading {
        margin: 0px;
    }

    .about-sec1 h2 {
        margin: 15px 10px 0 70px;
    }

    .about-sec1 .cursive {
        margin: 0px;
    }

    .about-sec1 .container {
        padding-top: 110px;
    }

    /*** FAQ ***/
    .faq .container {
        padding-top: 0px;
    }

    .faq h3 {
        font-size: 20px;
    }

    .faq-ques .panel-body {
        padding: 0px;
    }

    .faq-ques {
        padding: 0px 20px 100px;
    }

    /****** Bloom ******/
    .bloom-sec2 .medium-screens {
        width: 100%;
    }

    .bloom-sec3 p:first-child {
        padding: 0 20px 30px;
    }

    .bloom-tabs li:nth-child(odd) {
        padding: 8px 10px;
        text-align: center;
        border: 2px solid #404040;
        float: left;
        border-radius: 50%;
        width: 50px;
        height: 50px;
        font-size: 20px;
    }

    .bloom-tabs li:nth-child(even) {
        width: 40px;
        margin: 25px 0;
    }

    .bloom-tabs {
        width: 360px;
        margin: 0px auto 10px;
    }

    .tabs-content {
        padding: 70px 25px;
    }

    .tabContent ul {
        margin: 20px 0 0 20px;
    }
    .result-details .percent {
        left: 5%;
    }
    .footerSection{text-align: center;}
    .footerSection p{width: 100%;margin-bottom: 30px }
    .socialList{float: none !important;}
    .result-details .bar{margin: 0 5px}
    .result-details .percent li {
        margin: 10px 6px;
    }
    .levelList li:first-child{top: 55%;left: 25%;}
    .levelList li:nth-child(2){top: 45%;    right: 25%;;}
    .levelList li:nth-child(3){top: 65%;    right: 16%;}
    .levelList li:last-child{top: 72%;left: 16%;}
}

/******** Media query 360 *******/

@media only screen and (max-width: 360px) {

    /*** LANDING PAGE****/
    .img-circle {
        width: 175px;
        height: 175px;
    }

    .img-circle1 {
        width: 175px;
        height: 175px;
    }

    .img-circle2 {
        width: 175px;
        height: 175px
    }

    .img-circle {
        margin: 30px auto 0;
    }

    .now {
        margin-left: 15px;
    }

    .h2 {
        font-size: 18px !important;
    }

    .head-raleway {
        margin: 6px 0px 0 0;
        font-size: 25px;
    }

    .cursive {
        font-size: 34px !important;
        margin: 0px;
    }

    .section1 {
        padding: 100px 0 50px;
    }

    .brand-name {
        padding: 0px;
    }

    #carousel1 .carousel-indicators {
        top: 270px;
    }

    #carousel2 .carousel-indicators {
        top: 270px;
    }

    #carousel3 .carousel-indicators {
        top: 265px;
    }

    .section2 .item img, .section3 .item img, .section4 .item img {
        height: 260px;
    }

    .par {
        padding: 50px 10px 0;
    }

    .section4 {
        padding-bottom: 0px;
    }

    .section2 {
        padding: 90px 0 50px;
    }

    .section3, .section4 {
        padding: 50px 0px;
    }

    /*** FOOOTER ***/
    #contact form {
        width: 100%;
    }

    .query {
        margin-bottom: 20px;
    }

    #contact .form-group input,
    .form-group textarea {
        width: 100%;
    }

    /**** FEATURES ****/
    .feature-sec2 .carousel,
    .feature-sec3 .carousel,
    .feature-sec4 .carousel,
    .feature-sec5 .carousel,
    .feature-sec6 .carousel,
    .feature-sec7 .carousel {
        animation: none;
        -webkit-animation: none;
        -moz-animation: none;
        -o-animation: none;
        animation: none;
    }

    .feature-sec2 .para,
    .feature-sec3 .para1,
    .feature-sec5 .para1,
    .feature-sec7 .para1,
    .feature-sec6 .para,
    .feature-sec4 .para {
        animation: none;
        -webkit-animation: none;
        -moz-animation: none;
        -o-animation: none;
        animation: none;
    }

    .feature-sec1 h2 {
        font-size: 24px;
        line-height: 28px;
    }

    .feature-sec1 {
        padding: 70px 0;
    }

    /***PRICING ***/
    .pricing-sec1 .cursive {
        margin: 0px 10px 0 0;
    }

    .pricing-sec1 .heading {
        width: 100%;
    }

    .pricing-sec1 .tag-text {
        width: 90px;
    }

    .pricing-sec1 .tag-text p {
        top: 152px;
        font-size: 8px;
        width: 60px;
    }

    .yearly p {
        padding-top: 25px;
    }

    #yearlyplan {
        width: 90px;
    }

    #monthlyplan {
        width: 80px;
    }

    #quaterlyplan {
        width: 80px;
    }

    .pricing #scene1 .layer:last-child {
        margin: 20px 0 0 0;
    }

    .pricing #scene1 .layer:first-child {
        margin-top: 50px;
    }

    .pricetext {
        height: 450px;
    }

    /*** REWARDS ***/
    .rewards-sec1 .heading {
        padding: 0px;
    }

    .rewards-sec1 {
        padding-bottom: 50px;
    }

    .rewards-sec1 .rewards {
        width: 100%;
        margin: 0 auto;
    }

    .rewards-sec4 .carousel {
        margin-bottom: 20px;
    }

    .rewards-sec1 .cursive {
        margin-left: 0px !important;
    }

    .rewards-sec1 .heading {
        padding: 0px !important;
    }

    .rewards-sec1 .heading {
        padding: 0;
    }

    .rewards-sec4 .par {
        padding: 0px 10px;
    }

    /***ABOUT US ***/
    .about-sec1 h2 {
        margin: 6px 10px 0 0px;
    }

    .about-sec1 .cursive {
        margin-left: 0px;
    }

    /**** Blooom */
    .bloom-sec1 p {
        padding: 0 10px;
    }

    .bloom-tabs li:nth-child(even) {
        width: 23px;
        margin: 24px 0;
    }

    .bloom-tabs li:nth-child(odd) {
        padding: 9px 10px;
        text-align: center;
        border: 2px solid #404040;
        float: left;
        border-radius: 50%;
        width: 50px;
        height: 50px;
        font-size: 20px;
    }

    .tabs-content {
        padding: 100px 25px;
    }
}

.ajaxloading {
 position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  z-index: 9999;
  background: url('../images/logoLogin.gif') 50% 50% no-repeat rgb(255,255,255);
  opacity: 0.50;
}
/*child profile*/
.girlbtn {
    background-position: -255px -425px;
}
.boybtn {
    background-position: -114px -425px;
}
.loginArea .addChildForm>.radio input:checked+ p .boybtn {
    background-position: -161px -425px;
}
.loginArea .addChildForm>.radio input:checked+ p .girlbtn {
    background-position: -208px -425px;
}
.loginArea .addChildForm>.radio label{width:120px; padding: 0;}
.loginArea .addChildForm>.radio label p{ font-size: 16px;}

/** new features **/
.logoFront a
{
    width: 336px !important;
}
.socialLoginArea
{
    background: none !important;
}
.GorF
{
    margin: -58px 134px 6px auto;
    border-bottom: none !important;
}
.GorF p
{
   background: none !important;
   font-size: 20px !important;
   left: 34% !important;
   top: -14px !important;
   font-weight: bold !important;
}
.socialLoginArea .loginList li
{
    width: 104px !important;
    margin: 0 24px !important;
}
.socialLoginArea .socialLogin
{
    margin: 0 auto;
    border: none !important;
    padding: 0px 1px 15px 2px !important;
    width: 100% !important;
    margin-top: 23px;
}
.clickEmailLogin
{
    cursor: pointer;
}
.text_landing
{
    font-size: 23px !important;
    padding: 0 64px !important;
}
@media screen and (min-width:1300px){
.row-btm{
    padding-bottom: 4em;
}

.smallscreen{
    margin: 0;
}
.logostyle{
    text-align:initial;
    margin-top: 3rem; 
    margin-left: 11rem;
  }
.classroomImageDiv img{
    /* height: 42vw !important; */
    width: 100%;
    margin-top: 1.5rem;
    margin-left: 0rem;
    padding: 0;
    }
}
