:root {
	--main-font: "Roboto", sans-serif;
	--main-color: #36499C;
	--secound-color: #FFD00F;
	--black-color: #000000;
	--white-color: #ffffff;
	--content-color: #595959;
	--light-green-color: #81b922;
	--orange-color: #faa51d;
}
html{
	overflow-x: hidden;
}
body{
	font-family: var(--main-font);
}

.site-top{
	border-bottom: solid 1px #E1E1E1;
		padding: 4px 0;
}
.site-top .container{
	max-width: calc(1920px - 60px + 2 * 0px);
}
.site-top ul{
	margin: 0;
}
.site-top ul li {
	font-size: 14px;
	color: var(--content-color);
}
.site-top ul li a{
	color: var(--content-color);
	text-decoration: none;
	font-size: 14px;
}
.site-top ul li a:hover{
	color: var(--light-green-color);
}
.site-top ul li a:hover svg path,
.site-top ul li a:hover svg rect,
.site-top ul li a:hover svg circle{
	stroke: var(--light-green-color);
}
.site-top ul li a i{
	color: var(--content-color);
}
.site-top ul li a:hover i{
	color: var(--light-green-color);
}
.site-top .social a{
	width: 30px;
	display: inline-block;
	position: relative;
	justify-content: center;
	align-content: center;
}
.site-top .social a:after{
	background: #ebebeb;
    content: "";
    top: 2px;
    bottom: 2px;
    position: absolute;
    right: 0;
    width: 1px;
}
.site-top .social:last-child a:after{
	display: none;
}


header {
	padding: 1rem 0rem 1rem 0rem
}
header .custom-logo{
	height: 84px;
	width: auto;
}
header .logo{
	height: 84px;
	line-height: 84px;
	color: var(--main-color);
	font-weight: bold;
}
header .container{
	max-width: calc(1920px - 60px + 2 * 0px);
}

header .custom-logo-link{
    display:inline-flex;
    flex-shrink:0;
    width:auto;
}

header .mega-menu-row{
	box-shadow: 0 0 15px rgba(0,0,0,.08) !important;
	z-index: 99;
}
header .mega-menu-row .mega-sub-menu{
	max-width: 1320px !important;
	margin: auto !important;
}
header .mega-menu-wrap{
    flex:1;
}
header .mega-menu-wrap li a{
	font-weight: 600 !important
}
header .mega-menu-wrap li ul{
	padding: 10px 8px 10px 8px !important;
}
header .mega-menu-wrap li a{
	color: #333 !important;
	font-size: 13px !important;
}
header .mega-sub-menu{
	overflow: hidden !important;
}
header .mega-sub-menu li ul li ul li a{
	color: #333 !important;
	font-size: 13px !important;
}
header .mega-sub-menu li ul li ul li ul li a{
	color: #555 !important;
	font-size: 13px !important;
}
header .mega-sub-menu li ul li ul li ul li a:hover{
	color: var(--orange-color) !important;
}


header .header-action{
    flex-shrink:0;
    width:auto;
    margin-left:auto;
    white-space:nowrap;
}
header .header-action a{
	font-family: "Roboto", Sans-serif;
	font-weight: 600;
	color: #002d57;
	background-color: #ffd00f;
	font-size: 14px;
	text-decoration: none;
	border: 2px solid var(--orange-color);
	width: 134px !important;
	height: 46px !important;
	border-radius: 3px;
}
header .header-action a:hover{
	background: var(--orange-color);
}










.before-footer{
	padding: 60px 0;
	position: relative;
}
.before-footer:after{
	content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(51, 51, 51, .2);
    opacity: 0;
    border-radius: inherit;
    transition: opacity .3s, background .3s, transform .3s;
}
.before-footer:hover:after{
	opacity: 1;
	transition: opacity .3s, background .3s, transform .3s;
}

.before-footer .inner-before-footer{
	max-width: 650px;
	width: 100%;
	margin: auto;
	padding: 15px 0;
	background: rgba(242,243,245,.56);
position: relative;
	z-index: 99;
	
}
.before-footer .inner-before-footer h2 a{
	font-size: 2rem;
	font-weight: 600;
	color: var(--main-color);
	text-decoration: none;
	transition: color .3s;
}
.before-footer .inner-before-footer h2 a:hover{
	color: #cc6d36;
	transition: color .3s;
}
.before-footer .inner-before-footer p a{
	color: #cc6d36;
	transition: color .3s;
	font-weight: bold;
	text-decoration: none;
}

.sparkle {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 9;
    background-image: url(../images/sparkle1.png), url(../images/sparkle2.png);
    animation: sparkle 60s linear infinite;
}

@keyframes sparkle {
  0% {
    background-position:
      0px 0px,
      0px 0px,
      0px 0px;
  }

  100% {
    background-position:
      -500px -1000px,
      -400px -400px,
      300px 300px;
  }
}








footer{
	font-size: 14px;
	border-style: solid;
    border-width: 2px 0px 0px 0px;
    border-color: var(--main-color);
    transition: background .3s, border .3s, border-radius .3s, box-shadow .3s;
    margin: 0px 0px 0px 0px;
    padding: 6.7rem 0rem 0 0rem;
}
footer .custom-logo{
	height: 60px;
	width: auto;
	margin-bottom: 30px;
}
footer .logo{
	height: 84px;
	line-height: 84px;
	color: var(--main-color);
	font-weight: bold;
	margin-bottom: 30px;
}
footer .tag-line{
	font-size: 18px;
	line-height: 1.76em;
	color: var(--main-color);
	font-weight: 600;
}
footer .contact-info li{
	color: var(--black-color);
}
footer .contact-info li a{
	color: var(--content-color);
	font-weight: 500;
	text-decoration: none;
}

footer h4, 
footer h4 a{
	font-size: 18px;
	letter-spacing: 0px;
	color: var(--main-color);
	font-weight: 600;
	text-decoration: none;
}
footer h4 a{
	margin-top: 10px;
}
footer ul{
	float: left;
	width: 100%;
	padding: 0;
	margin: 0;
}
footer ul li{
	margin-bottom: 10px;
	list-style: none;
}
footer ul li a{
	color: var(--content-color);
	text-decoration: none;
	font-weight: 500;
	transition: color .3s;
}
footer ul li a:hover{
	color: #d8a416;
	transition: color .3s;
}

footer .banner{
	float: left;
	position: relative;
}
footer .banner figure{
	float: left;
	width: 100%;
	margin: 0;
}
footer .banner .hotspot-wrapper {
	position: absolute;
	z-index: 2;
	font-size: 7px;
}

.hotspot-type1:not(:hover):before {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    width: 10px;
    height: 10px;
    background: rgba(255,255,255,.3);
    border-radius: 50%;
    animation: zooming 2s infinite;
}
.hotspot {
    width: 6px;
    height: 6px;
    line-height: 6px;
    color: #fdd110;
}
.hotspot-wrapper .hotspot:before {
    content: "";
    position: absolute;
    left: -10px;
    right: -1rem;
    top: -1rem;
    bottom: -1rem;
}
@keyframes zooming {
  0% {
    opacity: 1;
    transform: scale(1);
  }

  100% {
    opacity: 0;
    transform: scale(4);
  }
}

footer .elementor-repeater-item-b5ecc80 {
    left: 10%;
    top: 28%;
}
footer .elementor-repeater-item-cfbbc41 {
    left: 15%;
    top: 32%;
}
footer .elementor-repeater-item-8adccb4 {
    left: 9%;
    top: 40%;
}
footer .elementor-repeater-item-c041d28 {
    left: 9%;
    top: 36%;
}
footer .elementor-repeater-item-8022431 {
    left: 22%;
    top: 37%;
}
footer .elementor-repeater-item-ad060bb {
    left: 20%;
    top: 43%;
}
footer .elementor-repeater-item-e606a99 {
    left: 24%;
    top: 44%;
}
footer .elementor-repeater-item-73e297d {
    left: 21%;
    top: 61%;
}
footer .elementor-repeater-item-87a941e {
    left: 30%;
    top: 70%;
}
footer .elementor-repeater-item-7bf1591 {
    left: 25%;
    top: 80%;
}
.elementor-element-9904d9b footer .elementor-repeater-item-349c0a3 {
    left: 86%;
    top: 82%;
}
footer .elementor-repeater-item-363718b {
    left: 89%;
    top: 30%;
}
footer .elementor-repeater-item-886a571 {
    left: 81%;
    top: 30%;
}
footer .elementor-repeater-item-a2a87e3 {
    left: 84%;
    top: 33%;
}
footer .elementor-repeater-item-6c0c008 {
    left: 80%;
    top: 48%;
}
footer .elementor-repeater-item-a921f4c {
    left: 76%;
    top: 59%;
}
footer .elementor-repeater-item-d95a063 {
    left: 67%;
    top: 52%;
}
footer .elementor-repeater-item-1d7a88d {
    left: 53%;
    top: 45%;
}
footer .elementor-repeater-item-fb9ad27 {
    left: 58%;
    top: 27%;
}
footer .elementor-repeater-item-123075e {
    left: 47%;
    top: 34%;
}
footer .elementor-repeater-item-b6cdaeb {
    left: 45%;
    top: 36%;
}
footer .banner .banner-content {
    left: 50%;
    top: 50%;
}

footer .elementor-repeater-item-583daf6 {
    left: 25%;
    top: 80%;
}
footer .elementor-repeater-item-349c0a3 {
    left: 86%;
    top: 82%;
}


footer .social-links li{
	margin: 10px 7px;
}
footer .social-links a{
	width: 30px;
	height: 30px;
	background: var(--main-color);
	color: var(--white-color);
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 100%;
	transition-duration: .3s;
}
footer .social-links a:hover{
	background: var(--secound-color);
	color: var(--white-color) !important;
	transition-duration: .3s;
}
footer .other-link a{
	font-weight: bold;
	color: var(--main-color);
	text-decoration: none;
}

footer .copy-right{
	padding: 36px 0px 35px 0px;
	background: var(--main-color);
	color: var(--white-color);
	font-weight: 600;
	margin-top: 80px;
	border-top: solid 2px var(--secound-color);
}






.seq-container{
    display:grid;
    grid-template-columns:repeat(5, 1fr);
    gap:20px;
}

.seq-card{
    height:260px;
    perspective:1200px;
}

.seq-card-inner{
    width:100%;
    height:100%;
    position:relative;
    transform-style:preserve-3d;
    transition:0.9s;
}

.seq-card:hover .seq-card-inner{
    transform:rotateX(-180deg);
}
.seq-card-front{
    position:absolute;
    width:100%;
    height:100%;
    backface-visibility:hidden;
    border-radius:18px;
    display:flex;
    align-items:center;
    justify-content:center;
}
.seq-card-back{
    position:absolute;
    width:100%;
    height:100%;
    backface-visibility:hidden;
    border-radius:18px;
    display:flex;
    justify-content:center;
}

.seq-card-front{
    background: #f4f4f4;
}
.seq-front-content{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:12px;
    text-align:center;
}

.seq-front-content span{
	border: solid 2px #cc6d36;
	border-radius: 100%;
}
.seq-front-content img{
    width: 144px;
}

.seq-front-content h3{
	font-size:16px;
	color:var(--main-color);
	font-weight: 600;
	margin:0;
}

.seq-card-back{
    background: var(--main-color);
    color:#fff;
    transform:rotateX(180deg);
    padding:15px;
    box-sizing:border-box;
    flex-direction:column;
    text-align:left;
}

.seq-card-back h3{
    font-size:14px;
    margin-bottom:10px;
}

.seq-card-back ul{
    padding-left:16px;
    font-size:12px;
    line-height:1.5;
}
.seq-card-back a{
	margin-top: 5px;
	float: left;
	background: linear-gradient(to right,  rgba(215,139,95,1) 0%,rgba(204,108,52,1) 100%);
	padding: 8px 19px;
	border-radius: 50px;
	color: var(--white-color);
	position: relative;
	overflow: hidden;
}
.seq-card-back a:after{
	content: "";
    position: absolute;
    top: -50%;
    left: 0%;
    right: 0%;
    bottom: -50%;
    background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 20%, rgba(255, 255, 255, .4) 50%, rgba(255, 255, 255, 0) 80%);
    transform: skewX(-45deg) translateX(-100%);
    transition: transform .8s;
}
.seq-card-back a:hover:after {
    transform: skewX(-45deg) translateX(100%);
}