/*
Created on : Jan 16, 2021
Author     : webiknows.com
Version: 1.1
*/
/*============================
 [Table of CSS]
 	1. Global variable css
	2. Background Color
	3. Color and Font
	4. Headings and Typographic Classes / .title, .uppercase etc
	5. Button
	6. Margins and Paddings
	7. Position
	8. Custom Checkbox and radio
	9. Reset Css
	10. Cus Scroll
	11. Ellipsis
  12. Animation
  13. FLOATING LABEL
  14. ACCORDION
========================================*/
/*-----------------
1. Global variable css
-----------------------*/
:root {
	--gradient-btn:  -webkit-linear-gradient(0deg, #394263 0%, #6373b1 100%);
    --primary-clr: #1f2278;
    --secondary-clr: #f17732;
    --text-clr: #333333;
    --accent-clr: #8f8d8d;
    --lightgrey-clr: #ededed;
    --ff-heading: 'Roboto', sans-serif;
    --ff-para: 'Merriweather', serif;
}

/*-----------------
2. Background Color
-----------------------*/
.bg-primary {background: var(--primary-clr);}
.bg-secondary {background: var(--secondary-clr);}
.bg-lightgrey {background: var(--lightgrey-clr);}
.bg-white {background: #fff !important;}
.bg-t {background: transparent !important;}
/*-----------------
3. Color and Fonts 
-----------------------*/
.primary-clr {color: var(--primary-clr);}
.secondary-clr {color: var(--secondary-clr);}
.text-clr {color: var(--text-clr) !important;}
.white {color: #fff !important;}
.green{color:#38BC68;}
.f-headind {font-family: var(--ff-heading);}
.f-para {font-family: var(--ff-para);}
/*-----------------
4. Headings and Typographic Classes / .title, .uppercase etc
-----------------------*/
/* - Font size classes - */
.big {font-size: 3.6rem;line-height: 4.8;}
.bigger {font-size: 4.8rem;line-height: 1.2;}
.super {font-size: 6rem;line-height: 1.2;margin-bottom: 0;}
.f-12 {font-size: 1.2rem;}
.f-13 {font-size: 1.3rem;}
.f-14 {font-size: 1.4rem;}
.f-16 {font-size: 1.6rem;}
.f-18 {font-size: 1.8rem;}
.f-20 {font-size: 2rem;}
.f-22 {font-size: 2.2rem;}
.f-24 {font-size: 2.4rem;}
.f-26 {font-size: 2.6rem;}
.f-28 {font-size: 2.8rem;}

/* - Font weight classes - */
.bold {font-weight: bold;}
.regular {font-weight: normal;}
.bold-500 {font-weight: 500;}
.bold-600 {font-weight: 600;}
.bold-700 {font-weight: 700;}

/* - Text transform classes - */
.txt-upper {text-transform: uppercase;}
.txt-lower {text-transform: lowercase;}
.txt-capital {text-transform: capitalize;}
.l-h-1 {line-height: 1;}
.l-h-2 {line-height: 1.2;}
.l-h-3 {line-height: 1.3;}
.l-h-4 {line-height: 1.4;}
.l-h-5 {line-height: 1.5;}
.l-h-6 {line-height: 1.6;}
.l-h-7 {line-height: 1.7;}
.l-h-8 {line-height: 1.8;}
.l-h-9 {line-height: 1.9;}
.l-h2 {line-height: 2;}

/*-----------------
5. Button  
-----------------------*/
.cus-primary-btn {
    color: #fff;
    background: var(--primary-clr);
    text-align: center;
    border: 1px solid var(--primary-clr);
    min-width: 100px;
    font-weight: 600;
    font-size: 14px;
    line-height: 34px;
    transition: all 0.3s;
}
.cus-primary-btn:hover {
    color: var(--primary-clr);
    background: var(--secondary-clr) ;
    border: 1px solid var(--secondary-clr);
}
.cus-primary-btn-outline {
    color: var(--primary-clr);
    background: transparent;
    text-align: center;
    border: 1px solid var(--primary-clr);
    min-width: 100px;
    font-weight: 600;
    font-size: 14px;
    line-height: 34px;
    transition: all 0.3s;
}
.cus-primary-btn-outline:hover {
    color: #fff !important;
    background: var(--secondary-clr) ;
    border: 1px solid var(--secondary-clr);
}

/*-----------------
7. Position
-----------------------*/
.top-left {position: absolute;top: 8px;left: 16px;}
.top-right {position: absolute;top: 8px;right: 16px;}
.top-center {position: absolute;top: 0;left: 50%;transform: translate(-50%, 0);}  
.bottom-right {position: absolute;bottom: 8px;right: 16px;}
.bottom-left {position: absolute;bottom: 8px;left: 16px;}
.bottom-center {position: absolute;bottom: 0;left: 50%;transform: translate(-50%, -50%);}
.middle-left {position: absolute;top: 50%;left: 50%;transform: translate(0%, -50%);}
.middle-right {position: absolute;top: 50%;right: 0;transform: translate(0%, 0);}
.p-centered {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);}
.v-center {-webkit-transform: translate(0,-50%);-o-transform: translate(0,-50%);transform: translate(0,-50%);top: 50%;margin: 0 auto;}
.modal-dialog-bottom {display: -ms-flexbox;display: flex;-ms-flex-align: center;align-items: flex-end; min-height: calc(100% - 0rem);}
.modal-rounded {border-radius: 8px 8px 0 0;}


/*-----------------
9. Reset Css
-----------------------*/
/* body {font-size: 10px;}

@media screen and (min-width: 320px) {
  body {font-size: 10px;}
  html {font-size: 80%;}
}
@media screen and (min-width: 991px) {
  body {font-size: 14px;}
  html {font-size: 100%;}
}  */
::selection {
  background-color: var(--primary-clr);
  color: #fff;
}
/*-----------------
11.Ellipsis
-----------------------*/
.ellipsis-line1 {  
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ellipsis-line2 {
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.ellipsis-line3 {
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}
.ellipsis-line4 {
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
}
.ellipsis-line5 {
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
}
.ellipsis-line6 {
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 6;
-webkit-box-orient: vertical;
}


/*------------------------------
COMMON CSS
-------------------------------*/
.vw-100 {width: 100vw;}
.vh-100 {height: 100vh;}
.vh-48 {height: 48vh;}
.vh-75 {height: 75vh;}
.fit-image {object-fit: cover;}
.grayscale{filter: grayscale(100%);}
.shadow-light {box-shadow: 0 0 10px rgba(0,0,0,.05);}
.zoom-hover {transition: all .5s ease;}
.zoom-hover:hover {transform: scale(1.1);-webkit-transform: scale(1.1);}
.rotated_180 {transform: rotate(180deg);}
/* PRELOADER CSS */
.page-loader1 {
	width: 100%;
	height: 100vh;
	position: fixed;
	background: #fff;
	z-index: 999999;
}
.page-loader1 .txt1 {
		color: #666;
		text-align: center;
		top: 40%;
		position: relative;
		text-transform: uppercase;
		letter-spacing: 0.3rem;
		font-weight: bold;
		line-height: 1.5;
}

/* SPINNER ANIMATION */
.spinner1 {
	position: relative;
	top: 35%;
  width: 80px;
  height: 80px;
  margin: 0 auto;
  background-color: var(--primary-clr);
  border-radius: 100%;  
  -webkit-animation: sk-scaleout 1.0s infinite ease-in-out;
  animation: sk-scaleout 1.0s infinite ease-in-out;
}

@-webkit-keyframes sk-scaleout {
  0% { -webkit-transform: scale(0) }
  100% {
    -webkit-transform: scale(1.0);
    opacity: 0;
  }
}

@keyframes sk-scaleout {
  0% { 
    -webkit-transform: scale(0);
    transform: scale(0);
  } 100% {
    -webkit-transform: scale(1.0);
    transform: scale(1.0);
    opacity: 0;
  }
}

.listNone {
  list-style-type: none;
  padding: 0;
}
.text-justify {text-align: justify;}
.categories-item:hover {cursor: inherit;}

.py_80 {
  padding: 80px 0;
}
.page-banner .page-banner-entry {
  height: 160px;
  vertical-align: middle;
  display: table-cell;
  padding-bottom: 0;
}
.page-banner {
  /* height: 160px; */
  height: 101px;
}

.startTest {height: calc(100vh - 30vh);}

.btn-check:checked + .btn-primary, .btn-check:active + .btn-primary, .btn-primary:active, .btn-primary.active, .show > .btn-primary.dropdown-toggle {
  color: #fff;
  background-color: var(--primary-clr);
  border-color: none;
}
.btn-primary {
  background-color: var(--primary-clr);
}
.section-area.section-area-no-header {
  min-height: 100vh;
}
.btn {font-size: 24px;}
.infoPara {font-size: 1.3rem;line-height: 1.4;margin-bottom: 4px !important;}
/*------------------------------
HEADER
-------------------------------*/
.menu-logo img {
  max-width: 90px;

}


.part-logo img {
  max-width: 232px !important;
}

.logo-brand img {
  max-height: 110px;
}

.logo-brand {
  padding: 10px;
}  

.collapse:not(.show) {
  display: unset  !important;
}

.menu-links {
 
  flex: unset;
}

.logo-brand img {
  max-height: 89px;
}

.part-logo img {
  max-width: 232px !important;
  margin-top: -10px;
  margin-right: 30px;
}


/*------------------------------
Homepage
-------------------------------*/
.menu-links .nav > li .mega-menu, .menu-links .nav > li .sub-menu {
  left: -20px !important;
}


.header-main {
  z-index: 5;
  position: sticky !important;
  background: #f5f5fc;
}

.account-wrapper2{
  height: 70vh !important;
}
/*------------------------------
SELECT-CHAPTER
-------------------------------*/

.main-banner .inner-content {
  top: 38% !important;
}

.main-banner .pt-img3 {
  top: 11%;
  left: 17%;
}

 

/*######### MEDIA QUERY START HERE ########*/
/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 768px) {
  
.sticky-header {padding: 6px 0;}
  
/* .page-banner {height: 160px;}
.page-banner .page-banner-entry {height: 200px;} */
.page-banner h1, .page-banner .h1 {
  font-size: 30px;
  margin-bottom: 0;
}
.section-area {
  min-height: calc(100vh - 140px);
  display: flex;
  align-items: center;
}
.startTest {
  height: calc(100vh - 30vh);
}

.collapse:not(.show) {
  display: none  !important;
}

.header-main{
  z-index: 5;
  position: sticky !important;
}

} 

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {


} 

@media only screen and (max-width: 600px) {
  .page-banner .page-banner-entry {
    height: 74px !important;
}

.mobo-logo-sec{
  display: block !important;
  text-align: center;
  margin-right: 0 !important;
}

.header-transparent {
  position: static ;
}

.page-banner {
  height: 74px !important;
}

.scale-md-0_2 {
  transform: scale(1);
}

.page-banner h1, .page-banner .h1 {
  font-size: 21px !important;

} 

.part-logo img {
  max-width: 174px !important;
  margin-right: 0 !important;
}
.menu-logo img {
  max-width: 90px;
}

.menu-logo {
  height: 100% !important;
  width: auto  !important;
}

.menu-bar {
  display: flex;
  align-items: center;
}

#google_translate_element{
  position: static !important;
}

} 

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {

} 

@media (max-width: 992px) {
  /* body {padding-top: 50px;} */
  .page-banner {
    height: 130px;
}
.page-banner .page-banner-entry {
  height: 130px;
}
.rs-nav .menu-links {background-color: #fff;}
.menu-links .nav > li {border-bottom: 1px solid #eee;} 
.menu-links .nav > li a,.header-transparent .is-fixed .menu-links .nav > li > a {color: var(--primary-clr);}
.menu-links .nav > li:hover > a, .menu-links .nav > li.active > a {color: #f17732;}
.menu-links .nav > li .mega-menu li a, .menu-links .nav > li .sub-menu li a {color: #666}






}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {

/*background*/
.lg-bg-primary {background: var(--primary-clr) !important;}
.lg-bg-secondary {background: var(--secondary-clr) !important;}
.lg-bg-white {background: #fff !important;}
.lg-bg-greylight {background: #f3f3f3 !important;}
.lg-bg-t {background: transparent !important;}  
.login-card{
  box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important;
}

.page-banner h1, .page-banner .h1 {
  font-size: 3rem;
}
.section-area {
  min-height: calc(100vh - 170px);
  display: flex;
  align-items: center;
  padding: 0 0 50px;
}


}  
    
/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (max-width: 1299.98px) {
  .scale-md-0_2 {
    transform: scale(0.8);
  }
 
}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {

}