@charset "utf-8";
/* CSS Document */
html{overflow-x:hidden;scroll-behavior:smooth}
body{background-color:#fff;font-family:'Roboto',sans-serif;font-style:normal;-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%; margin:0; padding:0}
h1, h2, h3, h4, h5, h6, p, span{font-family:'Roboto',sans-serif}
body a{-webkit-transition:0.5s all;-moz-transition:0.5s all;-o-transition:0.5s all;transition:0.5s all;}
*{-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;}
.cl{clear:both}
.top-menu{}
.top-menu .navbar-brand{padding:0;margin:20px 0 0 20px;float:left;display:none}
.navbar-default{background:rgba(0,0,0,0.5); border:0; border-radius:0}
.navbar-nav > li > a{color:#fff !important; padding:44px 15px;text-transform: capitalize;}
.navbar-nav > li > a:hover{color:#f00 !important}
.navbar-default .navbar-nav > .open > a{background:transparent}
.nav .open > a{background:transparent}
.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:focus, .navbar-default .navbar-nav > .open > a:hover{background:transparent}
.dropdown-menu > li > a{display: block;padding: 5px 20px;}
.dropdown-menu > li > a:hover{background:#b3090d; color:#fff}
.user-circle{border-radius:100%;width:50px; margin: 27px 0}
.header{background:#b3090d}
.left{margin:0;padding:0; height:500px}
.left-logo{background:#fff;border-left:20px solid#e77818;padding:0px}
.left-logo img{width:180px}
.left-logo .firstlogo{margin-left:auto; margin-right:auto; display:block}

.loginform{padding:30px; margin-top:0px}
.loginform h1{color:#fff; font-size:3em; font-weight:100}
.loginform label{color:#fff}
.loginform .formgroup{margin-top:15px}
.loginform .form-control{background:transparent; height:50px;border: 1px solid #fff; color:#fff !important}
.login{background:#fff;color:#b3090d;text-align:center;padding:15px 50px;border-radius:4px;font-weight:500;text-decoration:none;margin:25px 0;font-size:1em;border:1px solid#fff; text-transform:uppercase;-webkit-transition:0.5s all;-moz-transition:0.5s all;-o-transition:0.5s all;transition:0.5s all;}
.login:hover{background:transparent;color:#fff; border:1px solid#fff;-webkit-transition:0.5s all;-moz-transition:0.5s all;-o-transition:0.5s all;transition:0.5s all;}
.loginform .col-lg-6{padding:0}
.loginform .pull-right{text-align:right}
.loginform a{color:#fff; text-decoration:none}
.loginform .form-control::placeholder {color:#fff;opacity: 1;}
.loginform .form-control:-ms-input-placeholder {color:#fff;}
.loginform .form-control::-ms-input-placeholder {color:#fff;}

.login2{background:#fff;color:#b3090d !important;text-align:center;padding:15px;border-radius:4px;font-weight:500;text-decoration:none;margin:25px 0;font-size:1em;border:1px solid#fff; text-transform:uppercase;-webkit-transition:0.5s all;-moz-transition:0.5s all;-o-transition:0.5s all;transition:0.5s all; width:100%}
.login2:hover{background:transparent;color:#fff !important; border:1px solid#fff;-webkit-transition:0.5s all;-moz-transition:0.5s all;-o-transition:0.5s all;transition:0.5s all;}


.overlay {position: fixed;top: 0;bottom: 0;left: 0;right: 0;background: rgba(0, 0, 0, 0.7);transition: opacity 500ms;visibility: hidden;opacity: 0;}
.overlay:target {visibility: visible;opacity: 1;}
.popup {margin: 70px auto;padding: 20px;background: #fff;border-radius: 5px;width: 30%;position: relative;transition: all 5s ease-in-out;}
.popup h2 {font-size:1.5em; font-weight:100; color:#b3090d}
.popup .close {position: absolute;top: 20px;right: 30px;transition: all 200ms;font-size: 30px;font-weight: bold;text-decoration: none;color: #333;}
.popup .close:hover {color: #06D85F;}
.popup .content {max-height: 30%;overflow: auto;}

@media screen and (max-width: 700px){
.box{width: 70%;}
.popup{width: 70%;}
}

.pageheading{padding:15px}
.pageheading h1{color:#fff; font-size:2.5em; font-weight:100; margin: 0}
.pageheading h2{color:#fff; font-size:2em; font-weight:300; text-transform: capitalize;}
.right{background-image:url(../images/bg.jpg);background-position:right top;background-repeat:none;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;height:660px;margin:0;padding:0}
.left-in{margin:0;padding:0; height:350px}
.right-in{background-image:url(../images/banner-in.jpg);background-position:right top;background-repeat:none;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;-o-background-size:cover;height:350px;margin:0;padding:0}
.welcome{margin-top:50px}
.welcome h1{font-size:2.5em; font-weight:100; color:#4c5463; line-height:20px}
.welcome span{font-weight:600; color:#b3090d}
.welcome p{font-size:1.2em; font-weight:300; color:#8891a1; margin-top:25px}
.courses-box{margin-top:35px}
.courses{ margin-left:-40px}
.courses strong{color:#b3090d;}
.courses p{line-height:18px}
.welcomepic{}
.welcome-overlay{ margin-top:-70px; margin-left:50px}
.explore-courses{margin-top:50px}
.explore-courses h2{font-size:2.5em; font-weight:300; color:#4c5463; line-height:20px; text-align:center; margin-bottom:50px}
.explore-courses span{font-weight:600; color:#b3090d}
.explore-courses p{font-size:1.1em; font-weight:300; color:#5e5d5d; text-align:center; line-height:30px}
.explore-courses ul{}
.explore-courses li{font-size:1.1em; font-weight:300; color:#5e5d5d; text-align:center; line-height:30px}
.imgeffect p{font-size:1.2em; font-weight:300; color:#b3090d; line-height:40px; text-align:left}
.more{display:inline-block;text-align:center;vertical-align:middle;cursor:pointer;white-space:nowrap;padding:8px 50px;line-height:1.6;border-radius:4px;font-weight:500;position:relative;text-decoration:none;background:#b3090d;color:#fff;font-size:1em;}
.more:hover{background:#4c5463;border-color:#4c5463;color:#fff;text-decoration:none}

.page-action{text-align:center;vertical-align:middle;cursor:pointer;white-space:nowrap;padding:15px;line-height:1.6;border-radius:4px;font-weight:500;position:relative;text-decoration:none;background:#b3090d;color:#fff;font-size:1em;width:250px !important;margin-bottom: 15px}
.page-action:hover{background:#4c5463;border-color:#4c5463;color:#fff;text-decoration:none}

.in-wrap{margin-top:50px}
.in-wrap h2{font-size:2.5em; font-weight:300; color:#4c5463; line-height:20px; text-align:center; margin-bottom:50px}
.in-wrap span{font-weight:600; color:#b3090d}
.in-wrap p{font-size:1.1em; font-weight:300; color:#5e5d5d; line-height:30px}
.in-wrap ul{}
.in-wrap li{font-size:1.1em; font-weight:300; color:#5e5d5d; line-height:30px}
.prod img{border:1px solid#ccc; border-radius:3px}
.prod p{font-size:1.1em; font-weight:300; color:#5e5d5d; line-height:30px}
.marg{padding:25px 0; border-bottom:1px solid#ecebeb}
.footer{background:#2b2b2b; padding-top:40px; padding-bottom:30px; margin-top:50px}
.footer h6{font-size:1.5em; color:#fff; font-weight:300; padding-bottom:10px; border-bottom:1px solid#fff; text-transform:uppercase}
.footer .third{margin-top:20px !important}
.footer ul {padding: 10px}
.footer ul li {display: block;}
.footer ul li a {font-size: 0.9em !important; font-weight: 300; line-height:25px; color:#fff; text-decoration:none}
.footer ul li a:hover{margin-left:10px}
.footer p{font-size:0.9em; font-weight:300; color:#fff; line-height:40px}
.copywrite{padding:20px; background:#151515; color:#fff; font-size:0.9em}
.copywrite a{color:#fff; display:inline; text-decoration:none}
.copywrite a:hover{text-decoration:underline}

/* Facebook */
.fb-icon-bg {background:#354f88;height: 37px;margin: 0 0 -37px 0;width: 41px;}
.fb-icon-bg:after {content:url(../images/fb.png); display: block; padding: 3px 10px 5px 6px;}
.fb-bg {background:#3b5998;display: block;height: 37px;margin: 0 0 20px 41px;width: 166px;} 
.fb-bg:after {color:#fff;content: "facebook";font-family: 'Oswald', sans-serif;height: 37px;left: 8%;	position: relative;	text-transform: uppercase;top: 22%;width: 41px; }
.fb-bg:hover{cursor: pointer;}
.fb-bg:active{background:#354f88;}
/* Twitter */
.twi-icon-bg:after {content: url(../images/tw.png); display: block; padding: 3px 10px 6px 5px;}
.twi-icon-bg {background:#40a2d1;height: 37px;margin: 0 0 -37px 0;width: 41px;}
.twi-bg {background:#45b0e3;height: 37px;margin: 0 0 20px 41px;width: 166px;}
 .twi-bg:after {color:#fff;content: "twitter";font-family: 'Oswald', sans-serif;height: 37px; left: 11%;position: relative; text-transform: uppercase;top: 22%;  width: 41px;}
.twi-bg:hover {cursor: pointer;}
.twi-bg:active {background:#40a2d1;}
/* Google+ */
.g-icon-bg:after {content: url(../images/g.png);display: block;padding: 4px 10px 6px 5px;}
.g-icon-bg {background:#ce3e26;height: 37px;margin: 0 0 -37px 0;width: 41px;}
 .g-bg {background:#de4c34;height: 37px;margin-left: 41px;width: 166px;}
 .g-bg:after {color:#fff;content: "Youtube";font-family: 'Oswald', sans-serif;height: 37px;left: 10%;position: relative;text-transform: uppercase;top: 22%;	width: 41px;}
.g-bg:hover { cursor: pointer;}
.g-bg:active { background:#ce3e26;}

.top-scroll{display:none;position:fixed;bottom:50px;right:4%;z-index:1000;display:block;width:40px;height:40px;line-height:35px;font-size:23px;color:#fff;text-align:center;background-color:#005395;-webkit-border-radius:25px;-moz-border-radius:25px;border-radius:25px;cursor:pointer;-webkit-transform:translateZ(0);-moz-transform:translateZ(0);transform:translateZ(0);opacity:0.7;}
.top-scroll:hover{opacity:1;}

.form-side{padding:20px; background:#f3f4f8; border:1px solid#eee}
.form-side .fhead{font-size:1.5em; color:#000; font-weight:500; text-align:center}
.form-side .form-btm .labal{font-size:1.1em; line-height:30px; font-weight:400 !important;color:#000 !important; padding-top:5px; margin-bottom:0px !important}
.form-side .form-group{color:#fff;width:100%;font-weight:normal;font-size:15px;}
.form-side .form-control{background:#fff;border:1px solid#e2e1e0!important;-webkit-border-radius:0;-moz-border-radius:0;-o-border-radius:0;border-radius:0;opacity:1;color:#2f3a4c;padding-left:10px!important;font-size:1.1em;font-weight:300}
.form-side .top-mrgn input{box-shadow:none}
.form-side .btn{float:left}
.form-side .apply-now{margin:0}
.form-side .textarea{height:80px}
.form-side .submit{border:1px solid#000;padding:10px 30px;font-weight:300;border-radius:3px;width:auto;font-size:1em; background:#000; margin:10px 0px;-webkit-transition:0.5s all;-moz-transition:0.5s all;-o-transition:0.5s all;transition:0.5s all; text-transform:uppercase; color:#fff !important}
.form-side .submit:hover{background:#b3090d;color:#fff !important;border:1px solid#b3090d}
.form-side textarea:focus, input:focus {color:#666!important;}
.address p{font-size:1.5em; font-weight:600}

.modal-header .close {margin-top: -2px;position: absolute;top: 10px;right: 10px; color:#b3090d; opacity:1}
.modal-header{padding: 0px 32px;}
.modal-header h3{font-size:1.5em; font-weight:100; color:#b3090d}
#registration-form{padding:0 20px 30px}

.profile{margin-top:50px}
.profile-pic{border:1px solid#fff;width:160px; padding:5px;}
.p-circle{width:150px; height: 160px}
.profile .table-bordered > tbody > tr > th{padding:20px;}
.profile .table > tbody > tr > td{vertical-align: middle; text-transform:capitalize}

.gallery{margin-top:30px}
.gpic{margin-bottom:10px; border:1px solid#b3090d !important; padding:5px !important; border-radius:5px}

.gbt{text-align:center;vertical-align:middle;cursor:pointer;white-space:nowrap;padding:8px 0px;line-height:1.6;border-radius:4px;font-weight:500;position:relative;text-decoration:none;background:#b3090d;color:#fff;font-size:1em; float:right; width:200px; margin-right:15px}
.gbt:hover{background:#4c5463;border-color:#4c5463;color:#fff;text-decoration:none}

.content-wrap{margin-top:50px}
.content-wrap h3{font-size:2em; font-weight:300; color:#b3090d; line-height:20px}
.content-wrap p{font-size:1.2em; font-weight:300; color:#8891a1; margin-top:25px}
.content-wrap li{font-size:1.2em; font-weight:300; color:#8891a1;}
.content-wrap strong{color:#b3090d}
.content-wrap blockquote{font-size:1.2em; font-weight:300; color:#b3090d;}
.innerpic{margin-left:auto; margin-right:auto; display:block}
.gap1 p{font-size:1em; font-weight:600; text-transform:capitalize}

.choose-level-box select{width:500px !important; height:45px; margin-left:auto; margin-right:auto; display:block; background:#b3090d; color:#fff}
.videobox{color: #fff;padding: 20px;margin-top: 20px;}
.videobox h2{font-size: 2em;font-weight: 300;color: #b3090d;line-height: 20px; margin:0;margin-bottom: 20px; text-align:center}
.level-one{}
.level-two{}
.level-three{}
.level-four{}
.level-five{}
.level-six{}
.level-seven{}
.level-eight{}

.gap2{margin-top:20px}

.modal-active {position: fixed;top: 0;right: 0;bottom: 0;left: 0;height: auto;}
.modal-wrapper {display: flex;align-items: center;justify-content: center;position: fixed;top: 0;right: 0;bottom: 0;left: 0;z-index: 9999;}
.modal-layer {position: absolute;top: 0;right: 0;bottom: 0;left: 0;background-color: rgba(0, 0, 0, .5); z-index: 9998;}
.modal2 {display: flex;position: relative;width: 90%;max-width: 90%;max-height: 90%;z-index: 9999;}
.modal-youtube {width: 640px;height: 360px;}
.modal-close-btn {position: absolute;background-color: #FFF;line-height: 0;padding: 13px;border: 1px solid deepskyblue;border-radius: 99px;color:#b3090d;   right: 0px;top: 0px;cursor: pointer;}
.modal-content {width: 100%;background:#fff;overflow-x: hidden;overflow-y: auto;box-shadow: 0 1px 2px rgba(0, 0, 0, .35);}
.demo-modal {max-width: 700px;}
.demo-modal-content {padding: 0px;}
.demo-modal-content img{width:100%}
.fmbg{background:#fff}
.calllink a{font-size:1.3em !important; color:#000 !important; text-decoration:none;}
.calllink a:hover{color:#000}

#selectedName, #selectedNamedelete{padding:13px; display:none;}
.nameblock{display: inline;padding:4px;background: #f4f4f4;border-radius:5px;border: 1px solid #000;margin-left:5px;position: relative; font-size:0.9em}
.namehead{display: inline;padding:5px 10px;background:#f00;border-radius:5px;cursor: pointer;color:#fff;font-size:0.9em;-webkit-transition:0.5s all;-moz-transition:0.5s all;-o-transition:0.5s all;transition:0.5s all;}
.namehead:hover{ background:#000;text-decoration:none;-webkit-transition:0.5s all;-moz-transition:0.5s all;-o-transition:0.5s all;transition:0.5s all;}
.crossButton{width: 15px;height: 15px;position: absolute;background: #f00;line-height: 11px;vertical-align: top;text-align: center;border-radius: 10px;color:#fff;top: -4px;right: -4px;cursor: pointer;}
table.table-bordered.dataTable tbody td a{color:#ff0; text-decoration:none}
.upload-result-form{width:600px; margin:auto}


/*abacus tool*/
.main{margin-top:10px; width:auto; border:15px solid#000; margin-left:auto; margin-right:auto}
.top-cols .col-1{float:left; display:inline-block; width:14.28%; background:url(../img/bit-line.jpg) top center repeat-y, #fff; text-align:center;padding-bottom:3%}
.divider{height:15px; width:auto;background:#000}
.bottom-cols .col-2{float:left; display:inline-block; width:14.28%; background:url(../img/bit-line.jpg) top center repeat-y, #fff; text-align:center;padding-top:3%}
.beads-top{}
.beads-bottom img{}
.unique{height:15px; width:15px; background:#ff0; position:absolute;margin-top: 33px;margin-left: 71px; border-radius:50%}
.unique2{height:15px; width:15px; background:#ff0; position:absolute;margin-top: 33px;margin-left: -404px; border-radius:50%}
[trigger]{position:relative;cursor: pointer;}
#movable2{position:relative;cursor: pointer;}
#movable3{position:relative;cursor: pointer;}
#movable4{position:relative;cursor: pointer;}
.btn-info{padding:10px 15px; margin-top:10px}
/*abacus tool*/

.m-abacus{display:none;}

@media (min-width: 320px) and (max-width: 480px) {
.left-logo{display:none}
.top-menu .navbar-brand{display:block}
.navbar-default{background:rgba(255,255,255,0.5);height: 90px;z-index: 99}
.top-menu .navbar-brand {width:auto; padding:10px; margin:0}	
.navbar-brand img{padding:0px; width:60%}
.navbar-toggle {margin-top: 25px;}
.navbar-default .navbar-toggle{background:#b3090d}
.navbar-default .navbar-toggle .icon-bar {background-color: #fff;}
.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {background-color: #000;}
.navbar-default .navbar-collapse{border-color: none;background:#000;margin-top: 20px;}
.navbar-nav > li > a{padding:10px}
.navbar-nav > li > a:hover{color:#fff !important}
.navbar-default .navbar-nav .open .dropdown-menu > li > a {color: #fff;}
.navbar-default .navbar-nav .open .dropdown-menu > li > a:hover{color: #fff;}
.user-circle{margin: 0 15px 15px 10px;float: left;}
.right{height:325px}
.welcome h1 {font-size: 2em;}
.right-in{height:175px}
.profile-pic{float:right}
.content-wrap h3 {line-height: 30px;}
.demo-gallery > ul > li{width:50% !important}
.upload-result-form {width: 100%; margin-bottom:25px}
.choose-level-box select{width:100% !important}
.welcome-overlay {margin-left:0px;}
.welcome-overlay img{width: 75%;margin-left: 40px;}
.calllink a{font-size:0.8em !important;font-weight: 600;}
.d-abacus{display:none;}
.m-abacus{display:block;}
}

@media (min-width: 481px) and (max-width: 767px) {
.left-logo{display:none}
.top-menu .navbar-brand{display:block}
.navbar-default{background:rgba(255,255,255,0.5);height: 90px;z-index: 99}
.top-menu .navbar-brand {width:auto; padding:10px; margin:0}	
.navbar-brand img{padding:0px; width:60%}
.navbar-toggle {margin-top: 25px;}
.navbar-default .navbar-toggle{background:#b3090d}
.navbar-default .navbar-toggle .icon-bar {background-color: #fff;}
.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {background-color: #000;}
.navbar-default .navbar-collapse{border-color: none;background:#000;margin-top: 20px;}
.navbar-nav > li > a{padding:10px}
.navbar-nav > li > a:hover{color:#fff !important}
.navbar-default .navbar-nav .open .dropdown-menu > li > a {color: #fff;}
.navbar-default .navbar-nav .open .dropdown-menu > li > a:hover{color: #fff;}
.user-circle{margin: 0 15px 15px 10px;float: left;}
.right{height:325px}
.welcome h1 {font-size: 2em;}
.right-in{height:175px}
.profile-pic{float:right}
.content-wrap h3 {line-height: 30px;}
.demo-gallery > ul > li{width:50% !important}
.upload-result-form {width: 100%; margin-bottom:25px}
.choose-level-box select{width:100% !important}
.welcome-overlay {margin-left:0px;}
.welcome-overlay img{width: 75%;margin-left: 40px;}
.calllink a{font-size:1.1em !important;font-weight: 600;}
.d-abacus{display:none;}
.m-abacus{display:block;}
}

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

@media (min-width: 768px) and (max-width: 1024px) {
.navbar-inverse .navbar-brand {width:auto !important}	
.navbar-brand img{padding:0px; width:70%}
.navbar-inverse .navbar-nav > li > a {padding: 30px 15px;}
.container > .navbar-header{ border:0}
.d-abacus{display:none;}
.m-abacus{display:block;}
}