@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
/*
font-family: 'Raleway', sans-serif;
*/

/* -----------------------------------
[01] GENERAL
[02] LOADER
[03] FOOTER
[04] SCROLL UP
[05] HEADER
[06] TOP MENU
[07] SIDE BAR
[08] SIDE BAR MENU
[09] ZOOM MODAL
[10] INDEX
	[10.1] TITLE PAGE
	[10.2] COURSE
	[10.3] LECTURE CAROUSEL
	[10.4] LABS BLOCK
	[10.5] PRESENTATION
	[10.6] VIDEO BLOCK
	[10.7] BALLS
	[10.8] FAQ
	[10.9] TEACHER
[11] PAGES
-------------------------------------*/

:root {	
	--gim-main:#122235;
	--gim-main-rgb:44,46,53;
	--gim-red:#f54281;
	--gim-blue:#4273f5;
	--gim-white:#fff;	
	--gim-light:#eceff1;
	
	--gim-gray:#98A5B5;
	--gim-gray-rgba:96,125,139;	
	
	--gim-border: 1px solid #cecece;
	--gim-shadow:0 10px 20px 0 rgba(8,0,42,0.08);
}

/* -----------------------------------
	[01] GENERAL
-------------------------------------*/
* {
	outline: none!important;
	transition: all 0.3s ease-out 0s;
	margin: 0;
	padding: 0;
}
*, *::after, *::before {
	box-sizing: border-box;
}
html {
	position: relative;
	min-height: 100%;
	overflow-x: hidden;
	scroll-behavior: smooth;
	font-family: 'Raleway', sans-serif;
}
body {
	-webkit-tap-highlight-color: transparent;	
	   -webkit-text-size-adjust: 100%;	
	width: 100%;	
	background:#fff;
	color: var(--gim-main);
	font-family: 'Raleway', sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height:1.5;  
	/*overflow-x: hidden;*/
}
@media (min-width: 992px) {
	body {
		margin-bottom:80px;
	}
	footer {
		position: absolute;
		bottom: 0;
		width: 100%;
		height: 90px;
	}
}
h1, h2, h3, h4, h5, h6 {	
	font-family: 'Raleway', sans-serif;
	font-weight: 500;
	margin: 20px 0;
	line-height: 1.5;
}
h6 {
	text-align: center;
}
a:hover, 
a:active,
a:focus{
	color: var(--gim-main);
}
a {
	color: var(--gim-blue);
	text-decoration: none;
}
ul {
	list-style: outside none none;
	margin: 0;
	padding: 0;
}

button {
	color: inherit;
	outline: none;
	border: none;
	background: transparent;
}
img {
	max-width: 100%;
	height: auto;
	object-fit: cover;
}
.w-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.m-img img {
	max-width: 100%;
	height: 100%;
	object-fit: cover;
}
button:hover {
	cursor: pointer;
}
button:focus {
	outline: 0;
}
hr:not([size]) {
	margin: 0;
	border-color: rgba(var(--gim-main), 0.1);
	opacity: 1;
	border-width: 1px;
}
*::-moz-selection {
	background: var(--gim-main);
	color: var(--gim-light);
	text-shadow: none;
}
::-moz-selection {
	background: var(--gim-main);
	color: var(--gim-light);
	text-shadow: none;
}
::selection {
	background: var(--gim-main);
	color: var(--gim-light);
	text-shadow: none;
}
.simple-list li{
	margin: 10px 10px 10px 0;
}
.simple-list ul li{
	margin-left: 60px;
	list-style: circle;
}
@media (min-width: 1200px) {
	.container-narrow {
		max-width: 1024px;
		width: 100%;
		margin-right: auto;
		margin-left: auto;	  
	}
}
.large-container {
  max-width: 1620px;
  margin: 0 auto;
  padding: 0 15px;
}
section {
  padding-top: 120px;
  padding-bottom: 120px;
}
section.page-block {
	padding-top: 30px;
	padding-bottom: 50px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  section {
    padding-top: 100px;
    padding-bottom: 100px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  section {
    padding-top: 80px;
    padding-bottom: 80px;
  }
}
@media only screen and (max-width: 767px) {
  section {
    padding-top: 60px;
    padding-bottom: 60px;
  }
}
.section-space-top {
  padding-top: 120px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .section-space-top {
    padding-top: 100px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .section-space-top {
    padding-top: 80px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .section-space-top {
    padding-top: 70px;
  }
}

.section-space-bottom {
  padding-bottom: 120px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .section-space-bottom {
    padding-bottom: 100px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .section-space-bottom {
    padding-bottom: 80px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .section-space-bottom {
    padding-bottom: 70px;
  }
}

.p-relative {
  position: relative;
}
.p-absolute {
  position: absolute;
}	
.fix {
  overflow: hidden;
}	
.g-0, .gy-0 {
  --bs-gutter-y: 0;
}

.g-0, .gx-0 {
  --bs-gutter-x: 0;
}

.container-narrow ul li {
	list-style: circle;
	margin: 10px 0 10px 30px;
}
.container-narrow ol li {
	list-style: decimal;
	margin: 10px 0 10px 30px;
}
.container-narrow a {
	color: var(--gim-blue);
}
.container-narrow a:hover, 
.container-narrow a:active,
.container-narrow a:focus{
	color: var(--gim-red);
}
main ul li {
	list-style: circle;
	margin: 10px 0 10px 30px;
}
main ol li {
	list-style: decimal;
	margin: 10px 0 10px 30px;
}
main a {
	color: var(--gim-blue);
}
main a:hover, 
main a:active,
main a:focus{
	color: var(--gim-red);
}

/*----------------------------------------*/
/*  BUTTON
/*----------------------------------------*/

.btn-red{
	color: var(--gim-white);
	text-transform: uppercase;
	font-size: 0.9em;
	font-weight: 600;
	background-color: var(--gim-red);
	border: 1px solid var(--gim-red);
	display: inline-flex;
	align-items: center;
	line-height: normal;
	white-space: nowrap;
	padding: 20px 24px;
	gap: 10px;
	overflow: hidden;
	position: relative;
	z-index: 1;
	transition: all .6s
}
.btn-red span {
	position: absolute;
	display: block;
	width: 0;
	height: 0;
	border-radius: 50%;
	background-color: var(--gim-gray);
	transition: all .6s;
	transform: translate(-50%,-50%);
	z-index: -1
}
.btn-red:hover {
	color: var(--gim-white);
	border: 1px solid var(--gim-gray);
}
.btn-red:hover span {
	width: 225%;
	height: 1000.5px
}
.btn-red:active {
	background-color: var(--gim-white);
}

.btn-dark{
	color: var(--gim-white);
	font-size: 0.8em;
	font-weight: 600;
	background-color: var(--gim-main);
	border: 1px solid var(--gim-main);
	display: inline-flex;
	align-items: center;
	line-height: normal;
	white-space: nowrap;
	padding: 15px 20px;
	gap: 10px;
	overflow: hidden;
	position: relative;
	z-index: 1;
	transition: all .6s;
}
.btn-dark span {
	position: absolute;
	display: block;
	width: 0;
	height: 0;
	border-radius: 50%;
	background-color: var(--gim-red);
	transition: all .6s;
	transform: translate(-50%,-50%);
	z-index: -1;
}
.btn-dark:hover {
	color: var(--gim-white);
	border: 1px solid var(--gim-red);
}
.btn-dark:hover span {
	width: 225%;
	height: 1000.5px;
}
.btn-dark:active {
	background-color: var(--gim-white);
}	
/*----------------------------------------*/
/*  LIST
/*----------------------------------------*/
.border-list {
	margin:0;
}
.border-list li {
	margin:0;
	border-bottom: 1px dashed var(--gim-gray);
	padding: 8px;
	font-size: 0.9em;
}
.border-list li:hover{
	padding-left: 13px;
}
.border-list li span{
	display: inline-flex;
	align-items: center;
    justify-content: center;	
	background: var(--gim-gray);
	width:30px;
	height:30px;
	margin-right:10px;
	border-radius:100%;
	font-size: 1.1em;
	color:var(--gim-white);
}
.border-list li:hover span{
	transform: rotate(360deg);
}	
/*----------------------------------------*/
/*  FOOTER
/*----------------------------------------*/

footer{
	border-top: 1px solid rgba(var(--gim-main-rgb), 0.2);
	text-align: center;
	padding: 40px 0 0;
}
/*----------------------------------------*/
/*  PRELOADER CSS START
/*----------------------------------------*/
#preloader {
	position: fixed;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background: var(--gim-main);
	z-index: 999;
}
.bd-loader-wrap {
	height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	position: fixed;
	width: 100%;
}
.bd-loader-inner {
	position: fixed;
	width: 100%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 100vh;
}
.bd-loader {
	margin-left: 92px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), 
	(max-width: 575px) {
	.bd-loader {
		transform: scale(0.8);
		margin-left: 66px;
	}
}
.bd-loader-item {
	position: absolute;
	width: 6px;
	height: 80px;
	margin-top: -45px;
	border-radius: 0px;
	background-color: var(--gim-red);
	animation: bd-loader-aim 0.8s infinite;
	animation-direction: alternate-reverse;
}

.bd-loader .bd-loader-item:nth-child(1) {
	margin-left: 0px;
}
.bd-loader .bd-loader-item:nth-child(2) {
	margin-left: -14px;
	animation-delay: 0.1s;
}
.bd-loader .bd-loader-item:nth-child(3) {
	margin-left: -28px;
	animation-delay: 0.2s;
}
.bd-loader .bd-loader-item:nth-child(4) {
	margin-left: -42px;
	animation-delay: 0.3s;
}
.bd-loader .bd-loader-item:nth-child(5) {
	margin-left: -56px;
	animation-delay: 0.4s;
}
.bd-loader .bd-loader-item:nth-child(6) {
	margin-left: -70px;
	animation-delay: 0.5s;
}
.bd-loader .bd-loader-item:nth-child(7) {
	margin-left: -84px;
	animation-delay: 0.6s;
}
.bd-loader .bd-loader-item:nth-child(8) {
	margin-left: -98px;
	animation-delay: 0.7s;
}

@keyframes bd-loader-aim {
	0% {
		height: 2px;
		margin-top: 0;
		transform: rotate(0deg);
	}
	100% {
		height: 80px;
		transform: rotate(0deg);
	}
}

/*----------------------------------------*/
/*  SCROLLUP
/*----------------------------------------*/
.scrollup-wrap {
	position: fixed;
	bottom: 35px;
	right: 30px;
	height: 44px;
	width: 44px;
	cursor: pointer;
	display: block;
	border-radius: 100%;
	z-index: 100;
	opacity: 0;
	visibility: hidden;
	transform: translateY(20px);
	transition: all 400ms linear;
	color: var(--gim-white);
	justify-content: center;
	background-color: var(--gim-red);
	box-shadow: 0 1px 2px 0 rgba(0,0,0,0.3);
}
.scrollup-wrap:hover {
	transform: translateY(-2px);
	box-shadow:var(--gim-shadow);
}
.scrollup-wrap.active-progress {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}
.scrollup-wrap::after {
	position: absolute;
	font-family: "Font Awesome 6 Pro";
	content: "\f062";
	text-align: center;
	line-height: 44px;
	font-size: 1.1em;
	font-weight: 900;
	left: 0;
	top: 0;
	height: 44px;
	width: 44px;
	cursor: pointer;
	display: block;
	z-index: 1;
}
.scrollup-wrap svg path {
	fill: none;
}
.scrollup-wrap svg.scrollup-circle path {
	stroke: var(--gim-blue);
	stroke-width: 0;
	box-sizing: border-box;
	transition: all 400ms linear;
}

/*----------------------------------------*/
/* OFFCANVAS
/*----------------------------------------*/
.offcanvas__close button {
	height: 45px;
	width: 45px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.2em;
	background-color: var(--gim-red);
	border-radius: 100%;
	overflow: hidden;
	position: relative;
}
.offcanvas__close button i {
	color: var(--gim-white);
}
.offcanvas__info {
	background: var(--gim-white);
	position: fixed;
	right: 0;
	top: 0;
	width: 400px;
	height: 100%;
	transform: translateX(calc(100% + 80px));
	transition: transform 0.45s ease-in-out, opacity 0.45s ease-in-out;
	z-index: 999;
	overflow-y: scroll;
	overscroll-behavior-y: contain;
	scrollbar-width: none;
}
.offcanvas__info ::-webkit-scrollbar {
	display: none;
}
@media (max-width:450px) {
	.offcanvas__info {
		width: 300px;
	}
}
.offcanvas__info.info-open {
	opacity: 1;
	transform: translateX(0);
}
.offcanvas__wrapper {
	position: relative;
	height: 100%;
	padding: 30px 30px;
}
@media (max-width: 575px) {
	.offcanvas__wrapper {
		padding: 20px;
	}
}
.offcanvas__top {
	padding-bottom: 20px;
}
.offcanvas__overlay {
	position: fixed;
	height: 100%;
	width: 100%;
	background: var(--gim-main);
	z-index: 900;
	top: 0;
	opacity: 0;
	visibility: hidden;
	right: 0;
}
.offcanvas__overlay.overlay-open {
	opacity: 0.8;
	visibility: visible;
}
.sidebar__toggle {
	cursor: pointer;
	height: 50px;
	width: 50px;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
}
.sidebar__toggle:hover {
	color: var(--gim-red);
}
.sidebar__toggle:hover .bar-icon span,
.sidebar__toggle:hover .bar-icon span small {
	background: var(--gim-white);
}
@media (max-width: 992px) {
	.app__offcanvas-overlay.overlay-open {
		background: rgba(0,0,0,0.6);
		position: fixed;
		top: 0px;
		left: 0px;
		right: 0px;
		bottom: 0px;
		z-index: 10;
	}
}
/*----------------------------------------*/
/*  HEADER
/*----------------------------------------*/
header {
	background: var(--gim-white);
	box-shadow: var(--gim-shadow);
}
.top-line {
	background: var(--gim-main);
	color: var(--gim-white);
}
.header-top {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 10px 0;
}
.header-top	li {
	display: inline-block;
	margin-left: 30px;
}
.header-top	a {
	color: var(--gim-light);
}
.header-top	a:hover {
	color: var(--gim-blue);
}	
@media only screen and (max-width: 991px){ 
	.header-top {
		display: none;
	} 
}
.header-area {
	position: relative;
	z-index: 2;
	padding: 0 50px;
	overflow-x: clip;
}
@media (max-width: 991px) {
	.header-area {
		padding: 20px 15px;
	}
}	
@media only screen and (min-width: 992px) and (max-width: 1199px) {
	.header-area {
		padding: 0 15px;
	}
}	
.header-main {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.header-menu {
	display: flex;
	justify-content: flex-end;
	gap: 40px;
}
.sticky {
	position: fixed !important;
	top: 0;
	z-index: 111;
	inset-inline-end: 0;
	inset-inline-start: 0;
	width: 100%;
	animation: 500ms ease-in-out 0s normal none 1 running fadeInDown;
	background: var(--gim-white);
	box-shadow: var(--gim-shadow);
}
.bar-icon {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	overflow: hidden;
	font-size: 40px;
	transform: scaleX(-1);
}
.bar-icon span {
	width: 100%;
	height: 2px;
	background: var(--gim-main);
	display: inline-block;
}
.bar-icon span:nth-child(2) {
	position: relative;
	width: 6.56px;
}
.bar-icon span:nth-child(2) small {
	position: absolute;
	height: 100%;
	background: var(--gim-main);
	left: 12.56px;
	width: 18.06px;
	z-index: 555;
}
.bar-icon span:nth-child(3) {
	position: relative;
	width: 10px;
	margin: 0 0 0 auto;
}
/*----------------------------------------*/
/*  MENU
/*----------------------------------------*/
.main-menu ul {
	margin-bottom: 0;
}
.main-menu ul li {
	position: relative;
	list-style: none;
	display: inline-block;
	margin-inline-end: 30px;
}
.main-menu ul li:last-child {
	margin-inline-end: 0;
}
.main-menu ul li a {
	display: inline-block;
	font-size: 1em;
	font-weight: 500;
	color: var(--gim-main);
	padding: 40px 0;
	text-align: left;
	position: relative;
}
.main-menu ul li.has-dropdown > a {
	position: relative;
}
.main-menu ul li .submenu {
	position: absolute;
	top: 100%;
	inset-inline-start: 0;
	min-width: 240px;
	background: var(--gim-white);
	z-index: 99;
	visibility: hidden;
	opacity: 0;
	transform-origin: top center;
	box-shadow: var(--gim-shadow);
}
.main-menu ul li .submenu li {
	display: block;
	width: 100%;
	margin: 0;
	padding: 0;
}
.main-menu ul li .submenu li a {
	position: relative;
	z-index: 11;
	color: var(--gim-main);
	font-weight: 600;
	font-size: 0.9em;
	padding: 0 25px;
	padding-bottom: 11px;
	padding-top: 11px;
	width: 100%;
	border-bottom: var(--gim-border);
}
.main-menu ul li .submenu li:last-child a {
	border: none;
}
.main-menu ul li .submenu li:hover > a {
	background: var(--gim-light);
}
.main-menu ul li .submenu li:hover > a::after {
	color: var(--gim-white);
}
.main-menu ul li:hover > a, 
.main-menu ul li.active > a {
	color: var(--gim-red);
}
.main-menu ul li:hover > a::after {
	color: var(--gim-main);
}
.main-menu ul li:hover > .submenu {
	visibility: visible;
	opacity: 1;
}

/*----------------------------------------*/
/*  MOBILE MENU
/*----------------------------------------*/
.mean-container a.meanmenu-reveal {
	display: none;
}
.mean-container .mean-nav {
	background: none;
	margin-top: 0;
}
.mean-container .mean-bar {
	padding: 0;
	min-height: auto;
	background: none;
}
.mean-container .mean-nav > ul {
	padding: 0;
	margin: 0;
	width: 100%;
	list-style-type: none;
	display: block !important;
}
.mean-container a.meanmenu-reveal {
	display: none !important;
}
.mean-container .mean-nav ul li a {
	width: 100%;
	padding: 10px 0;
	color: var(--gim-main);
	font-size: 1em;
	line-height: 1.5;
	font-weight: 500;
	text-transform: capitalize;
	border-top: var(--gim-border);
}
.mean-container .mean-nav ul li a:last-child {
	border-bottom: 0;
}
.mean-container .mean-nav ul li a:hover {
	color: var(--gim-blue);
}
.mean-container .mean-nav ul li a.mean-expand {
	margin-top: 5px;
	padding: 0 !important;
	height: 30px;
	width: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--gim-main);
	line-height: 30px;
	top: 0;
	font-weight: 400;
	border-radius: 50%;
}
.mean-container .mean-nav ul li > a > i {
	display: none;
}
.mean-container .mean-nav ul li > a.mean-expand i {
	display: inline-block;
}
.mean-container .mean-nav > ul > li:first-child > a {
	border-top: 0;
}
.mean-container .mean-nav ul li a.mean-expand.mean-clicked i {
	transform: rotate(45deg);
}
.mean-container .mean-nav ul li .mega-menu li a {
	height: 200px;
	width: 100%;
	padding: 0;
	border-top: 0;
	margin-bottom: 20px;
}

/*----------------------------------------*/
/*  BANNER
/*----------------------------------------*/

.banner-block {
	overflow: hidden;
}	
.banner-content {
	position: relative;
	background: var(--gim-main);
}	
.banner-content .shape-1 {
	position: absolute;
	top: 0;
	right: 0;
	width: 32px;
	height: 100%;
	background-repeat: repeat-y;
	background-position: right;
	background-size: contain;
	animation: slide_up 50s linear infinite;
}
.banner-content .shape-2 {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: left bottom;
	background-size: contain;
}
.banner-content .shape-3 {
	position: absolute;
	top: 180px;
	left: 100px;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: center;
}	
.float-bob-x {
	animation-name: float-bob-x;
	animation-duration: 3s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
}	
@keyframes float-bob-x {
	0% {transform: translateX(-30px);}
	50% {transform: translateX(-10px);}
	100% {transform: translateX(-30px);}
}	
.float-bob-y {
	animation-name: float-bob-y;
	animation-duration: 3s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
}
@keyframes float-bob-y {
	0% {transform: translateY(-30px);}
	50% {transform: translateY(-10px);}
	100% {transform: translateY(-30px);}
}

.banner-content .banner-info {
	padding: 150px 150px;
	padding-left: 150px;
	animation: info-left 1.3s forwards cubic-bezier(.645,.045,.355,1) .4s;
	opacity: 0;
}
@keyframes info-left {
	0% {
		transform: translateX(-5%);
		clip-path: inset(0 100% 0 0);
		opacity: 0;
	}
	100% {
		transform: translateX(0);
		clip-path: inset(0 0 0 0);
		opacity: 1;
	}
}
@media only screen and (max-width: 991px){ 
	.banner-content .banner-info{
		padding: 100px 20px;
	}
}	
@media only screen and (max-width: 768px){ 
	.banner-info {
		padding-left: 0;
	}      
}
.banner-block .banner-btn-box,
.banner-block .banner-text,
.banner-block .banner-sub-title,
.banner-block .banner-title{
	opacity: 1;
	transform: inherit;
}
.banner-sub-title{
	position: relative;
	opacity: 0;
	transform: translateX(50px);
	transition: all 1000ms ease;
	color: var(--gim-white);
	font-size: 1.2em;
	text-transform: uppercase;
	margin-left: 56px;	
}
.banner-sub-title:before {
	content: "\e92c";
	font-family: 'icomoon';
	color: var(--gim-red);
	border: 1px solid var(--gim-red);
	position: absolute;
	top: 0px;
	left: -56px;
	height: 20px;
	width: 40px;
	padding: 2px 1px;
	display: flex;
	justify-content: start;
	align-items: center;
	border-radius: 50px;
}
.banner-sub-title.no-border:before {
	border: none;
}	
.banner-title {
	color: var(--gim-white);
	font-size: 4em;
	font-style: normal;
	font-weight: 700;
	line-height: 1.3;
	padding: 20px 0;
}
.banner-text {
	color: var(--gim-white);
	font-size: 1.2em;
	font-style: normal;
	font-weight: 600;
	line-height: 1.3;
	padding-bottom: 40px;
	padding-right: 29px;
}	
.banner-btn-box{
	position: relative;
	opacity: 0;
	transform: translateX(50px);
	transition: all 1000ms ease;	
	display: flex;
	justify-content: flex-start;
	align-items: center;
	gap: 30px;
}
@media only screen and (max-width: 991px){ 	
	.banner-content .banner-btn-box{
		align-items: self-start;
	}
	.banner-title {
		font-size: 3em;
	}	
}		
@media only screen and (max-width: 768px){ 
	.banner-btn-box {
		flex-direction: column;
	}
	.banner-title {
		font-size: 2em;
	}	
}
.banner-image {
	position: relative;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-repeat: no-repeat;
}
.banner-image .content-1 {
	position: absolute;
	top: 74px;
	left: 39%;
}
.banner-image .content-2 {
	position: absolute;
	top: 433px;
	left: 82px;
}
.banner-image .content-3 {
	position: absolute;
	top: 306px;
	left: 85%;
}
.banner-notice {
	max-width: 288px;
	background: var(--gim-red);
	display: flex;
	justify-content: start;
	align-items: center;
	padding: 16px;
	gap: 25px;
	position: absolute;
	bottom: 30px;
	left: 30px;
}
@media only screen and (max-width: 1399px){ 
	.banner-notice,
	.banner-image .content-1,
	.banner-image .content-2,
	.banner-image .content-3,
	.banner-content .shape-3{
		display: none;
	}                 
}
.banner-notice .icon-box {
	font-size: 5em;
	background: var(--gim-white);
	height: 108px;
	width: 125px;
	display: flex;
	justify-content: center;
	align-items: center;
	color: var(--gim-red);
}
.banner-popup {
	cursor: pointer;
	position: relative;
}
.banner-popup .popup-icon {
	color: var(--gim-white);
	z-index: 2;
	position: relative;
	font-size: 1em;
	cursor: pointer;
}
.banner-popup-btn {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 48px;
	width: 48px;
	border-radius: 100%;
	transition: all 500ms ease;
}
.banner-popup-btn:before, 
.banner-popup-btn:after {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
	display: block;
	width: 100%;
	height: 100%;
	background-color: var(--gim-red);
	opacity: 1;
	border-radius: 100%;
}
.banner-popup-btn:before {
	z-index: 0;
	animation: pulse-border 1500ms ease-out infinite;
}
.banner-popup-btn:after {
	z-index: 1;
	transition: all 200ms;
}
@keyframes pulse-border {
	0% {
		transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
		opacity: 1;
	}
	100% {
		transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
		opacity: 0;
	}
}
.banner-popup:hover .best-quality {
	transform: scale(1,1);
	opacity: 1;
	visibility: visible;
}
.best-quality {
	background: var(--gim-red);
	color: var(--gim-white);
	padding: 5px 8px;
	border: 5px;
	font-size: 1em;
	clip-path: polygon(0% 0%, 100% 0%, 100% 75%, 75% 75%, 75% 100%, 50% 75%, 0% 75%);
	height: 50px;
	position: absolute;
	width: 92px;
	top: -55px;
	left: -60px;
	opacity: 0;
	visibility: hidden;
	transform: scale(0);
	transform-origin: right;
	transition: all 500ms ease;
}

/*----------------------------------------*/
/* TITLE
/*----------------------------------------*/
.title-box {
	margin-bottom: 50px;
}
.section-title {
	margin-top: 10px;
}
.section-sub-title{
	position: relative;
	color: var(--gim-red);
	font-family: var(--primary-font);
	font-size: 1em;
	font-weight: 600;
	text-transform: uppercase;
	margin-left: 45px;
}
.section-sub-title:before {
	content: "";
	content: "\e92c";
	font-family: 'icomoon';
	color: var(--gim-red);
	border: 1px solid var(--gim-red);
	position: absolute;
	top: 2px;
	left: -45px;
	height: 16px;
	width: 36px;
	padding: 2px 1px;
	display: flex;
	justify-content: start;
	align-items: center;
	border-radius: 50px;
}

/*----------------------------------------*/
/* COURSE
/*----------------------------------------*/



.course-block {
	position: relative;
	background: url(images/index/bg-course.png) no-repeat center center;
	background-size: cover;
}	
.course-block .shape-1 {
	position: absolute;
	top: 71px;
	right: 0;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: top right;
}
.course-image-box {
	position: relative;
}	
.course-image-box .shape-1 {
	position: absolute;
	top: 40px;
	right: 30px;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: top right;
}
.course-image-box h1 {
	font-size: 100px;
	text-transform: capitalize;
	opacity: 0.08;
	position: absolute;
	top: 30%;
	left: -280px;
	transform: rotate(270deg);
}		
.course-image-box figure.image {
	position: relative;
	display: block;
	overflow: hidden;
	padding-inline-end:100px;
}
.course-image-box figure.image:before {
	position: absolute;
	top: 0;
	left: -75%;
	display: block;
	content: '';
	width: 50%;
	height: 100%;
	background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .3) 100%);
	transform: skewX(-25deg);
}
.course-image-box:hover figure.image:before {
	animation: shine 1.5s;
}	
.course-image-box .image-small {
	position: absolute;
	bottom: 30px;
	right: -25px;
	border: 10px solid var(--gim-white);
	box-shadow: var(--gim-shadow);
}
@media only screen and (max-width: 767px){
	.course-image-box .image-small{
	right: 0px;
	}                        
}
@media only screen and (max-width: 425px){ 
	.course-image-box figure.image {
		padding-inline-end:0;
	}	
	.course-image-box .image-small{
		display: none;
	}                        
}
.course-image-box .image-small .play-btn {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%)
}
.course-image-box .play-btn a {
	border-radius: 50%;
	color: var(--gim-white);
	z-index: 2;
	position: relative;
	font-size: 1.1em;
}
.video_player_btn {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 57px;
	width: 57px;
	border-radius: 50%;
}
.video_player_btn:before,
.video_player_btn:after {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);
	display: block;
	width: 100%;
	height: 100%;
	background-color: var(--gim-red);
	opacity: 1;
	border-radius: 100%;
}
.video_player_btn:before {
	z-index: 0;
	animation: pulse-border 1500ms ease-out infinite;
}
.video_player_btn:after {
	z-index: 1;
	transition: all 200ms;
}	

.course-content {
	position: relative;
	padding-left: 60px;
}
@media only screen and (max-width: 991px){ 
	.course-content{
		padding-left: 0;
		padding-top: 50px;
	}                        
}
.course-part {
	margin-top: 30px;
}	
.course-block .icon-block {
	background: var(--gim-white);
	border-bottom: 5px solid var(--gim-white);
	box-shadow: 0 0 20px rgba(var(--gim-main-rgb),0.1);
	padding: 20px;
	display: flex;
	justify-content: start;
	align-items: center;
	gap: 15px;
}
.course-block .icon-block:hover {
	box-shadow: 0 0 25px rgba(var(--gim-main-rgb),0.2);
	border-bottom: 5px solid var(--gim-blue);
}
.course-block .icon-box {
	margin-right: 25px;
}

/*----------------------------------------*/
/* PART
/*----------------------------------------*/

.part-block {
	position: relative;
	background: var(--gim-light);
	text-align: center;
}
.part-block .shape-1 {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: center;
}
.part-box {
	padding: 20px;
	position: relative;
	text-align: center;
}
.part-box .icon-box {
	position: relative;
	width: 100px;
	height: 100px;
	border-radius: 50%;
	font-size: 40px;
	background: var(--gim-white);
	box-shadow: 0px 4px 25px rgba(0, 0, 0, 0.08);
	color: var(--gim-red);
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 0 auto;
}
.part-box .icon-box span {
	position: absolute;
	top: -3px;
	left: -5px;
	width: 40px;
	height: 40px;
	background: var(--gim-light);
	color: var(--gim-gray);
	border-radius: 100%;
	border: 3px solid var(--gim-white);
	font-size: 18px;
	display: flex;
	justify-content: center;
	align-items: center;
	font-family: 'Raleway', sans-serif;
	font-weight: 600;
	line-height: 1;
	padding: 0;
}
.part-box .icon-box:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: var(--gim-red);
	border-radius: 100%;
	transform: scale(0);
	transition: all 500ms ease;
}
.part-box:hover .icon-box:before {
	transform: scale(1.4);
}
.part-box:hover .icon-box i {
	color: var(--gim-white);
	position: relative;
}
.part-box .text-box h4 {
	margin-bottom: 0;
}	
.part-box .text-box h5 {
	margin: 0;
	color: var(--gim-red);
}	

/*----------------------------------------*/
/*  LECTURE
/*----------------------------------------*/
.lecture-block {
	position: relative;
	overflow: hidden;
}
.lecture-navigation{
	position: relative;
	text-align: right !important;
	margin-top: 30px;
	z-index: 1;
	}
.lecture-navigation button {
	color: var(--gim-red);
	height: 50px;
	width: 50px;
	border: 1px solid var(--gim-red);
	border-radius: 50%;
	font-size: 20px;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	margin-left: 20px;
}
.lecture-navigation button:hover {
	background: var(--gim-red);
	color: var(--gim-white);
}
@media only screen and (max-width: 1400px){
	.lecture-navigation {
		margin-top: 0;
		margin-bottom: 30px;
		text-align: left !important;
	}
	.lecture-navigation button {
		margin-left: 0;
		margin-right: 20px;
	}    
}	
.lecture-slide {
	position: relative;
}	
.lecture-slide:hover .content-area {
	opacity: 1;
}	
.lecture-slide .title-area {
	background: var(--gim-white);
	padding: 17px 24px;
	width: calc(100% - 110px);
	clip-path: polygon(0% 0%, 0 0, 94% 0, 100% 100%, 0% 100%);
}
.lecture-slide .icon-area {
	background: var(--gim-red);
	color: var(--gim-white);
	padding: 30px;
	font-size: 31px;
	width: 110px;
	text-align: right;
	clip-path: polygon(0% 0%, 0 0, 100% 0, 100% 100%, 20% 100%);
}
.lecture-slide .content-area {
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	bottom: 30px;
	left: 30px;
	right: 30px;
}
.lecture-slide .title-area {
	background: var(--gim-white);
	padding: 17px 24px;
	width: 413px;
	clip-path: polygon(0% 0%, 0 0, 94% 0, 100% 100%, 0% 100%);
}
.lecture-slide .title-area h5:hover{
	color: var(--gim-red);
}
.lecture-slide .icon-area {
	background: var(--gim-red);
	color: var(--gim-white);
	padding: 30px;
	font-size: 31px;
	width: 113px;
	text-align: right;
	clip-path: polygon(0% 0%, 0 0, 100% 0, 100% 100%, 20% 100%);
}
.lecture-slide .content-area {
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	bottom: 30px;
	left: 30px;
	right: 30px;
	opacity: 0;
	transition: all 800ms ease;
}
.lecture-slide:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(180deg, rgba(16, 32, 57, 0.00) -19.59%, rgba(16, 32, 57, 0.80) 92.89%);
	transform: scale(0);
	transition: all 700ms ease;
}
.lecture-slide:hover:before {
	transform: scale(1,1);
}
.lecture-block .lecture-active {
	margin-left: -250px;
	margin-right: -250px
}
@media only screen and (max-width: 1440px){ 
	.lecture-block .lecture-active {
		margin-left: inherit;
		margin-right: inherit;
	}
}

/*----------------------------------------*/
/* PRESENTATION
/*----------------------------------------*/
.presentation-block {
	position: relative;
	background: var(--gim-main);
	padding-bottom: 200px;
}
.presentation-block .bg-shape-1 {
	position: absolute;
	bottom: -120px;
	left: 0;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: bottom left;
}
.presentation-block .bg-shape-2 {
	position: absolute;
	bottom: -20px;
	left: 0;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: bottom right;
}
.presentation-btn ul {
	display: flex;
	flex-direction: column;
	gap: 16px;
	border: none;
	margin-bottom: 20px;
}
.presentation-btn ul .nav-link {
	position: relative;
	color: var(--gim-gray);
	font-size: 16px;
	font-weight: 600;
	line-height: 1.3;
	display: flex;
	align-items: center;
	justify-content: start;
	gap: 27px;
	padding: 24px;
	background: var(--gim-white);
	width: 298px;
	border-radius: 0 !important;
	border: none !important;
}
@media only screen and (max-width: 991px){
	.presentation-btn ul .nav-link {
		width: 90%;
	}	
}	
.presentation-btn ul .nav-link:before {
	content: "";
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: -35px;
	width: 35px;
	height: 60px;
	background: var(--gim-white);
	clip-path: polygon(100% 49%, 0 0, 0 100%);
}
.presentation-btn ul .nav-link .icon-box {
	font-size: 3em;
	color: var(--gim-red);
}
.presentation-btn ul .nav-link.active {
	background: var(--gim-red);
	color: var(--gim-white);
}
.presentation-btn ul .nav-link.active:before {
	background: var(--gim-red);
}
.presentation-btn ul .nav-link.active .icon-box {
	color: var(--gim-white);
}	
.presentation-tab-content {
	position: relative;
	background: var(--gim-white);
	padding: 30px;
}
.presentation-list li {
	list-style:none;
	display: flex;
	align-items: center;
	margin:0;
	border-bottom: 1px dashed rgba(var(--gim-main-rgb),0.3);
	padding: 8px;
	font-size: 0.9em;
}
@media only screen and (max-width: 767px){ 
	.presentation-tab-content{
		display: flex;
		flex-direction: column;
	}
	.presentation-btn {
		margin-bottom: 50px;
	}
}

/*----------------------------------------*/
/* LABS
/*----------------------------------------*/
.labs-block {
	position: relative;
	overflow: hidden;
	background: var(--gim-white);
}
.labs-block .shape-1 {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}
.labs-block .shape-2 {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: bottom left;
}
.labs-block .shape-3 {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: top right;
}
.labs-title-box {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 30px;
}
.labs-block .section-title {
	margin-top: 10px;
}
	
.labs-navigation	{
	position: relative;
	z-index: 1;
}
.labs-navigation button {
	color: var(--gim-red);
	height: 50px;
	width: 50px;
	border: 2px solid var(--gim-red);
	border-radius: 50%;
	font-size: 20px;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	margin-left: 20px;
}
.labs-navigation button:hover {
	color: var(--gim-gray);
	border: 2px solid var(--gim-gray);
}	
.labs-block .labs-active {
	margin-right: -366px;
}
.labs-box {
	position: relative;
	text-align: center;
	border: var(--gim-border);
}
.labs-box .inner {
	background:var(--gim-white);
}
.labs-box .content-box {
	padding: 70px 20px 0 20px;
}
.labs-box .icon-box {
	width: 80px;
	height: 80px;
	font-family: 'Raleway', sans-serif!important;
	font-size: 3em;
	font-weight: 600;
	color: var(--gim-gray);
	border: 1px dashed var(--gim-gray);
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 0 auto;
	margin-top: -110px;
	background: var(--gim-white);
	position: relative;
	z-index: 1;	
}
.labs-box .icon-box:before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	width: 0;
	height: 100%;
	background: var(--gim-red);
	transition: all 500ms ease;
}
.labs-box:hover .icon-box:before {
	left: 0;
	width: 100%;    
}	
.labs-box:hover .icon-box p{
	color: var(--gim-white)!important;
	position: relative;
}	
.labs-box .content-box h4 {
	margin: 30px 0;
	font-size: 1.3em;
}
.labs-box .btn-area {
	font-weight: 600;
	line-height: 26px;
	text-transform: uppercase;
	background:var(--gim-light);
	padding: 12px 0;
	position: relative;
}
.labs-box .btn-area:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 0;
	height: 100%;
	background: var(--gim-red);
	transition: all 700ms ease;
}
.labs-box:hover .btn-area:before {
	width: 100%;
	right: 0;
}
.labs-box:hover .btn-area a {
	position: relative;
	color: var(--gim-white);
}
@media only screen and (max-width: 1024px){ 
	.labs-block .labs-active {
		margin-right: inherit;
	}                        
}
@media only screen and (max-width: 991px){ 
	.labs-title-box {
		align-items: start;
		flex-direction: column;
		gap: 20px;
		margin-bottom: 20px;
	}                        
}


/*----------------------------------------*/
/* SELFWORK
/*----------------------------------------*/
.selfwork-block{
	position: relative;
	/*padding-bottom: 240px;*/
	background: var(--gim-light);
}
.selfwork-block .bg-shape {
	position: absolute;
	top: 0;
	right: 0;
	background-repeat: no-repeat;
	background-position: right bottom;
	width: 100%;
	height: 100%;
}
.selfwork-image {
	position: relative;
	margin-right: 30px;
}	
.selfwork-image .shape-1 {
	position: absolute;
	top: 0;
	right: -20px;
	background-repeat: repeat-y;
	background-position: right;
	width: 30px;
	height: 100%;
	animation: slide_up 50s linear infinite;
}
@keyframes slide_up{
  from {background-position: 0 0;}
    to {background-position: 0 1000px;}
}
.selfwork-image figure.image {
	position: relative;
	display: block;
	overflow: hidden;
}
.selfwork-image figure.image:before {
	position: absolute;
	top: 0;
	left: -75%;
	display: block;
	content: '';
	width: 50%;
	height: 100%;
	background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .3) 100%);
	transform: skewX(-25deg);
}
.selfwork-image:hover figure.image:before {
	animation: shine 1.5s;
}
@keyframes shine {
	100% {
		left: 125%;
	}
}	
.selfwork-content {
	position: relative;
	padding-inline-end:30px;
	padding-top:20px;
}	
ul.selfwork-list {
	margin-left: 40px;
	margin-bottom: 40px;
}
ul.selfwork-list li {
	position: relative;
	/*margin-bottom: 10px;
	margin-left: 10px;*/
}
ul.selfwork-list li:before {
	content: "\e921";
	font-family: 'icomoon';
	position: absolute;
	top: 1px;
	left: -30px;
	color: var(--gim-red);
}
.selfwork-progress-bar {
	position: relative;
}	
.selfwork-progress-bar h6 {
	font-size: 1em;
	margin-bottom: 15px;
}	
.selfwork-content .progress {
	max-width: 527px;
	height: 16px;
	border-radius: 20px;
	background: var(--gim-gray);
}
.selfwork-content .progress-bar {
	background-color: var(--gim-red);
}
.selfwork-content .progress-count {
	font-size: 0.8em;
	font-weight: 600;
	position: absolute;
	top: 0;
	right: 15px;
}
@media only screen and (max-width: 991px){ 
	.selfwork-content .progress {
		max-width: 100%;
	}                      
}
@media only screen and (max-width: 991px){ 
	.selfwork-content .progress {
		max-width: 100%;
	}
}
	

/*----------------------------------------*/
/*  BRAND
/*----------------------------------------*/
.brand-block {
	position: relative;
}
.brand-block img{
	filter: grayscale(1);
	opacity: 0.75;
}
.brand-block img:hover{
	filter: grayscale(0);
	opacity: 1;
}

/*----------------------------------------*/
/* INFO
/*----------------------------------------*/

.info-block {
	position: relative;
	z-index: 1;
}
.info-box {
	position: relative;
	background: var(--gim-red);
	padding: 60px 80px;
	text-align: center;
}
.info-box h3 {
	color: var(--gim-white);
}

.info-box .shape-1 {
	position: absolute;
	top: 0;
	left: 0;
	background-repeat: no-repeat;
	background-position: left bottom;
	width: 100%;
	height: 100%;
}
.info-box .shape-2 {
	position: absolute;
	top: 0;
	left: 0; 
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: top right;
}
@media only screen and (max-width: 991px){ 
	.info-box {
		padding: 40px;
	}                   
}
.info-resourse {
	position: relative;
	z-index: 12;
}

/*DISTRIBUTE BALLS*/
.distribute	{
	background: var(--gim-light);
}
.distribute-list {
	text-align: center;
}
.distribute-list li {
	display: inline-block;
	list-style: none;
	width: 350px;
	margin: 10px;
	vertical-align: top;
}	
@media (max-width: 575px) {
	.distribute-list li {
		width: 90%;
	}
}
.distribute-list li figure{
	background: var(--gim-white);
	padding: 20px;
	box-shadow: 0 15px 45px rgba(1, 2, 2, 0.10);
}	
.distribute-list li:hover figure{
	transform: translateY(-5px);
    box-shadow: 0 25px 45px rgba(1, 2, 2, 0.15);
}
.distribute-list li figure h3{
	font-size: 2em;	
	margin: 0;
}
.distribute-list li figure figcaption {
	font-size: 2em;
}	
.distribute-list li figure dl {
	margin: 20px 0;
}	
.distribute-list li figure dd {
	display: flex;
	align-items: center;
	text-align: left;
	border-bottom: var(--gim-border);
	margin:0;
	padding: 10px 0;
}
.distribute-list li figure dd:hover {
	background: var(--gim-light);
	padding-left: 5px;
}	
.distribute-list li figure dd span{
	display:inline-block;
	text-align:center;
	font-size:1.3em;
	font-weight: 600;
	line-height:2.2;
	background:var(--gim-light);
	width:50px;
	height:50px;
	margin-right:10px;
	border-radius:100%;
}
.distribute-list li figure dd span.test{
	background:var(--gim-blue);
	color: #fff;
}	
.deadline-list {
	text-align:center;
}
.deadline-list li {
	list-style:none;
	display: inline-flex;
	align-items: center;
	margin: 10px;
}
.deadline-list li strong{
	display:inline-block;
	background:var(--gim-light);
	width:30px;
	height:30px;
	margin-right:5px;
	border-radius:100%;
}
.deadline-list li strong.test{
	background:var(--gim-blue);
}

/*----------------------------------------*/
/* FAQ
/*----------------------------------------*/
.faq-block {
	position: relative;
	background: var(--gim-main);
	margin-bottom: 20px;
	z-index: 10;
} 
.faq-block .shape-1 {
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: bottom right;
}
.faq-container .section-title {
	color: var(--gim-white);
}
.accordion-button {
	padding: 20px 30px;
	text-align: left;
	background: var(--gim-white);
	gap: 15px;
	color: var(--gim-gray);
	font-size: 20px;
	font-style: normal;
	font-weight: 500;
	line-height: 40px;
}
.accordion-button::after {
	content: "\f101";
	background-image: none;
	font-family: "Font Awesome 6 Pro";
	font-size: 20px;
	font-weight: 400;
	height: 30px;
	width: 30px;
	border: 1px solid var(--gim-white);
	line-height: 30px;
	border-radius: 50%;
	margin-inline-start: 0;
	text-align: center;
	position: absolute;
	right: 19px;
}
.accordion-button:not(.collapsed) {
	background-color: transparent;
	box-shadow: none;
	color: var(--gim-red);
}
.accordion-button:not(.collapsed)::after {
	background: var(--gim-white);
	color: var(--primary-color);
	content: "\f102";
}
.accordion-button:focus {
	box-shadow: none;
}
.accordion-body {
	position: relative;
	font-size: 1em;
	/*line-height: 28px;*/
	padding: 0 30px 20px 30px;
	/*color: #787878;*/
	z-index: 11;
	
}
.accordion-collapse {
	border: none;
	transition: all 0.5s;
}
.accordion-item {
	border: none;
	background: var(--gim-white);
	box-shadow: 0px 4px 60px 0px rgba(0, 0, 0, 0.10);
}
.accordion-item h2{
	margin: 0;
}	
.accordion-item:first-of-type .accordion-button {
	border-radius: 0px;
}
.accordion-item:last-of-type .accordion-button.collapsed {
	border-width: 1px;
	border-radius: 0px;
}
.bd-faq-group {
	display: flex;
	flex-direction: column;
	gap: 10px;
}
@media only screen and (max-width: 991px){ 
	.faq-wrapper {
		padding-right: 0;
	}
}

.faq-list {
	margin:0;
}
.faq-list li {
	margin:0;
	border-bottom: 1px dashed var(--gim-gray);
	padding: 8px;
	font-size: 1em;
}
.faq-list li:hover{
	padding-left: 13px;
}
.faq-list li span{
	display: inline-flex;
	align-items: center;
    justify-content: center;	
	background: var(--gim-gray);
	width:30px;
	height:30px;
	margin-right:10px;
	border-radius:100%;
	font-size: 0.9em;
	color:var(--gim-white);
}
.faq-list li:hover span{
	transform: rotate(360deg);
}

/* PAGES */


aside h5 {
	font-size: 1.2em;
}
.box-code {
	background:var(--gim-light);
	padding:10px 20px;
	margin:20px 0;
	line-height: 1;
}
.image-list {
	padding: 0px;
	margin: 20px auto;
	list-style: none;
	text-align: center;
}
.image-list li {
	width:250px;
	display: inline-block;
	margin: 10px;
	padding: 0px;
	vertical-align:top;
	list-style-type: none;
}
.image-list figure{
	position: relative;
    overflow: hidden;
    margin: 0;
	padding:10px;
	transition: all 1s ease;
}
.image-list figure:hover{
	box-shadow: 0 10px 20px -12px rgba(0, 0, 0, 0.42), 
				0 3px 20px 0px rgba(0, 0, 0, 0.12), 
				0 8px 10px -5px rgba(0, 0, 0, 0.2);	
}
.image-list figure img{
	max-width:230px;
	max-height:230px;
}
.image-list figcaption {
	padding: 10px;
	font-size: 1.2em;
} 
.work-tags li {
	display: inline-block;
	margin: 0 10px 10px 0;
	list-style: none;
}
.work-tags li a {
	display: block;
	background:var(--gim-light);
	color:var(--gim-main);
	padding: 10px;
}
.work-tags li a:hover {
	background:var(--gim-blue);
	color:var(--gim-white);
}
.resource-list li {
	border-bottom: 1px solid var(--gim-light);
	padding: 0;
	margin: 0;
	padding-bottom: 10px;
	margin-bottom: 10px;
	font-size: 0.9em;
	list-style: none;
}
.resource-list li a {
	color:var(--gim-main);
	display: block;
}
/*
.resource-list li:hover {
	background: var(--gim-light);
}*/
.resource-list li:hover a {
	color: var(--gim-red);
}

ul.column3,
ul.column2,
ul.column1 {
	margin:10px 0 20px;
}
ul.column3{
 -webkit-columns: 3; 
	-moz-columns: 3; 
		 columns: 3;
		 
-webkit-column-gap: 2em;
   -moz-column-gap: 2em;
		column-gap: 2em;	 
}
ul.column2{
 -webkit-columns: 2; 
	-moz-columns: 2; 
		 columns: 2;
		 
-webkit-column-gap: 2em;
   -moz-column-gap: 2em;
		column-gap: 2em;	 
}
ul.column3,
ul.column2 {
	margin:10px 0 20px;
}
@media (max-width:991px) {
	ul.column3,
	ul.column2 {
	 -webkit-columns: 1; 
		-moz-columns: 1; 
			 columns: 1;
	}
}
.video-block .ratio {
	margin: 10px;
}
.video-block h5 {
	text-align: center;
	margin: 0 0 25px;
}
@media only screen and (min-width: 992px) {
	.ratio-box  {
		width: 60%;
		margin: auto;
	}
}

/* Journals*/
.result-block .nav-pills .nav-link {
	border: 0;
	border-radius: 0;
	background-color: var(--gim-light);
	color: var(--gim-main);
	margin-bottom: 10px;
	width: auto;
}
.result-block .nav-pills .nav-link.active, 
.nav-pills .show > .nav-link {
	color: #fff;
	background-color: var(--gim-gray);
}
.result-title .nav-link span:after{
	display: inline-block;
	margin-left: 10px;	
	font-family: "Font Awesome 6 Pro";
	font-weight: 900;
	content: "\f107";
}	
@media (min-width:1200px){
	.result-block{
		display: flex;
		width: 100%;
		justify-content: space-between;
	}	
	.result-title {
		flex-shrink: 0;
		/*width: 20%;*/
		display: block;
	}
	.result-title .nav-link{
		/*width: 100%;
		text-align: right;*/
	}
	.result-title .nav-link span:after{
		display: inline-block;
		content: "\f105";
		margin-left: 10px;
		font-family: "Font Awesome 6 Pro";
		font-weight: 900;
	}	
	.result-table {
		width:100%;
		min-height: 100vh;
		border: 1px solid #ccc;
		overflow: auto;
		scrollbar-width: thin;
	}
}			
.result-table::-webkit-scrollbar{
	width: 7px;
	background:var(--gim-light);
}
.result-table::-webkit-scrollbar-thumb{
	width: 7px;
	background: var(--gim-gray);
}
		
.result-table iframe{
	width: 100%!important;
	min-height: 100vh;
}
.result-table h6 {
	font-size: 0.85em;
	text-align: right;
	margin:10px 20px;
	font-weight: 400;
}