@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,400italic,300italic,600,600italic,700,700italic);
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

@font-face {
    font-family: "Lulo Clean";
    src:
        url("../fonts/LuloCleanOneBold.woff2") format("woff2"),
        url("../fonts/LuloCleanOneBold.woff") format("woff");
    font-weight:700;
    font-style:normal;
    font-display:swap;
}
Body{
	color: #0b0d2f;
	font-size: clamp(14px, 1vw, 17px);  
	font-family: 'Jost', sans-serif;
	margin:0;
	padding:0;
	line-height: 1.3
}
html{
    scroll-padding-top:120px;
}
::selection {color:#FFF;background:#0f4d7f;}
::-moz-selection {color:#FFF;background:#0f4d7f;}
::-o-selection {color:#FFF;background:#0f4d7f;}
::-ms-selection {color:#FFF;background:#0f4d7f;}
::-webkit-selection {color:#FFF;background:#0f4d7f;}
 
.Shadow{
box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;}	
	
 
.FontColor1 {color:#0f4d7f;}
.FontColor2 {color:#d70303;}
.FontColor3 {color:#FFFFFF;}
.FontColor4 {color:#000;}


.FontStyle1{
    font-family: "Lulo Clean", sans-serif;
    font-size: clamp(2rem,5vw,5rem);
    font-weight:700;
    letter-spacing:3px;
    text-transform:uppercase;
}


.BgColor1{background-color:#fff;}

.TableAltHeader1 {background-color:#0f4d7f; color:#fff;}
.AltColor11 {background-color:#cfecf6;}
.AltColor12 {background-color:#eaf7fc;}

.TableAltHeader2 {background-color:#d70303; color:#fff;}
.AltColor21 {background-color:#fee8dc;}
.AltColor22 {background-color:#fef6f2;}

/* Font Sizes */
.SmallerText {font-size: clamp(11px, 1vw, 12.5px);}
.MediumText {font-size: clamp(13px, 1vw, 15px);}
.NormalText {font-size: clamp(15px, 2vw, 19px);}
.NormalTextBig {font-size: clamp(16px, 2vw, 24px); font-family: "Lulo Clean", sans-serif; font-weight: 600}
.Heading {font-size: clamp(20px, 3vw, 32px); font-family: "Lulo Clean", sans-serif; font-weight: 500}
.BiggerText {font-size: clamp(20px, 4vw, 45px); font-family: "Lulo Clean", sans-serif; font-weight: 600}
.LargeText {font-size: clamp(26px, 4vw, 50px); font-family: "Lulo Clean", sans-serif;}
.ExtraLargeText {font-size: clamp(29px, 5vw, 60px); font-family: "Lulo Clean", sans-serif;}
.SmallerLink{font-size: clamp(11px, 1vw, 12px); text-decoration: none}
a.SmallerLink:hover {text-decoration:none;}

h3 {font-weight: normal; margin: 0; display: inline;}
h2 {font-weight: normal; margin: 0; display: inline;}
h1 {font-weight: normal; margin: 0; display: inline;}
	
.JustLinks {TEXT-DECORATION: none;}
a.JustLinks:hover{TEXT-DECORATION: underline;}

.AllCaps{text-transform:uppercase;}

.PositionABT{position: absolute}

.PositionREL{position: relative}

.PositionFIX{position: fixed}

/* Button Styles */
.Button{
	font-family: 'Jost', sans-serif;
	font-size:16px;		
	padding:7px 20px;
	cursor:pointer;
	text-decoration:none;
	outline:none;
	display:inline-block;
	margin:2px;
}
.ButtonSmall{
	font-family: 'Jost', sans-serif;
	font-size:12px;		
	padding:2px 8px;
	cursor:pointer;
	text-decoration:none;
	outline:none;
	display:inline-block;
	margin:2px;
}
.ButtonMedium{
	font-family: 'Jost', sans-serif;
	font-size:14px;	
	padding:4px 15px;
	cursor:pointer;
	text-decoration:none;
	outline:none;
	display:inline-block;
	margin:2px;
}
.ButtonBig{
	font-family: 'Jost', sans-serif;
	font-size:20px;	
	padding:9px 20px;
	cursor:pointer;	
	text-decoration:none;	
	outline:none;	
}
.ButtonColor1{
	color:#fff;	
	background-color: #0f4d7f;			
	border:1px solid #0f4d7f;	
}
.ButtonColor1:hover{
	color:#fff;	
	background-color: #d70303;		
	border:1px solid #d70303;
	transition:0.3s ease;	
}
.ButtonColor2{
	color:#fff;	
	background-color: #d70303;		
	border:1px solid #d70303;	
}
.ButtonColor2:hover{
	color:#fff;	
	background-color: #0f4d7f;			
	border:1px solid #0f4d7f;
	transition:0.3s ease;	
}
.Button:active, ButtonMedium:active, ButtonSmall:active, ButtonBig:active{
	top:1px;
	position:relative;
}

/* All Border Styles */
.Border1 {border-width:1px; border-style:solid}
.Border2 {border-width: 2px;  border-style:solid}
.Border5 {border-width: 5px;  border-style:solid}

.DottedBorder {border-width:1px; border-style:dotted}

.BorderBottom1{border-bottom: 1px solid;}
.BorderBottom2{border-bottom: 2px solid;}
.BorderBottom5{border-bottom: 5px solid;}
.BorderBottomDashed{border-bottom: dashed 1px;}
.BorderBottomDotted{border-bottom: dotted 1px;}

.BorderTop1{border-top: 1px solid;}
.BorderTop2{border-top: 2px solid;}
.BorderTop5{border-top: 5px solid;}
.BorderTop7{border-top: 7px solid;}
.BorderTopDashed{border-top: dashed 1px;}
.BorderTopDotted{border-top: dotted 1px;}

.BorderLeft1{border-left:1px solid;}
.BorderLeft8{border-left:8px solid;}
.BorderRight1{border-right:1px solid;}
.BorderRight2{border-right:2px solid;}
.BorderRight3{border-right:3px solid;}

.BorderColor1{border-color: #ddd}
.BorderColor2{border-color: #d70303}

/* Border Rounded Corners */
.BorderRounded15{border-radius:15px;}
.BorderRounded10{border-radius:10px;}
.BorderRounded8{border-radius:8px;}
.BorderRounded5{border-radius:5px;}
.BorderRounded20{border-radius:20px;}

/* Table Style */		
.TableStyle {
    border-collapse: collapse;
    border-spacing: 0;	     
	background-color: #fff;
}
.TableStyle th {    
    padding:7px;
	color:#000;
	background-color: #f0f5f6;
	background-image: -webkit-linear-gradient(top, #effaff, #c8edff);
	background-image: -moz-linear-gradient(top, #effaff, #c8edff);
	background-image: -ms-linear-gradient(top, #effaff, #c8edff);
	background-image: -o-linear-gradient(top, #effaff, #c8edff);
}
.TableStyle td {      
    padding:3px 7px;
	border: 1px solid #dbe2e2;	
}
.TableStyle tr:nth-child(even){background-color: #f0f5f8; }

/* TextBox Style*/	

.TextBox{	
	color:#000;
	padding:10px 7px;
	border:1px solid #d0d0d0;	
	background-color: #fff;	
	box-sizing: border-box;
	outline: none;
}
.TextBox:focus{	
	border:1px solid #19315b;
	background-color: #ffffff;	
	box-sizing: border-box;
	outline: none;
}
input:focus::-webkit-input-placeholder { color:transparent; }
input:focus:-moz-placeholder { color:transparent; } /* FF 4-18 */
input:focus::-moz-placeholder { color:transparent; } /* FF 19+ */
input:focus:-ms-input-placeholder { color:transparent; } /* IE 10+ */
::placeholder{
	font-size:13px;
	font-style:italic;
	font-family: 'Open Sans', sans-serif;
	opacity:0.4;
	color:#fff;	
	}
:-ms-input-placeholder{
	font-size:13px;
	font-style:italic;
	font-family: 'Open Sans', sans-serif;
	opacity:0.4;
	color:#fff;
}

.TextBoxBig::placeholder,
.TextBoxBig::-webkit-input-placeholder{
  color: #000;
  opacity:0.5;
  font-style:normal;
  font-family: 'Open Sans', sans-serif;
  font-size:16px;
}
.TextBoxBig::-moz-placeholder{
  color: #000;
  opacity:0.5;
  font-style:normal;
  font-family: 'Open Sans', sans-serif;
  font-size:16px;
}
.imgcircle{
	width: 220px;
	height: 220px;
	border-radius: 50%;
	overflow: hidden;
}
.imgzoom{
	width: 220px;
	height: 220px;
	border-radius: 50%;
	 overflow: hidden; 
            margin: 0 auto; 
}
      
 .imgzoom img { 
            object-fit: cover;
            transition: 0.5s all ease-in-out; 
        } 
      
.imgzoom:hover img {             
	-ms-transform: scale(1.15);	
	-webkit-transform: scale(1.15);	
	-moz-transform: scale(1.15); 
	transform: scale(1.15);
        } 


.paddingtop{padding-top: 70px;}

.bannercaption{z-index: 11; position: absolute; bottom:15%;  left: 50%; transform: translateX(-50%);  text-shadow: 2px 2px 2px #222; width: 95%; text-align: center;}
.banner{height: 680px; background: url("../images/home-banner-img.jpg") no-repeat bottom center; background-size: cover;}
.aboutusimg{min-height: 350px; background: url("../images/india-flag.jpg") no-repeat center center; background-size: cover;}
.parallaxbg{min-height: 450px; background: url("../images/parallax-bg.jpg") no-repeat center center; background-size: cover; background-attachment: fixed}

.areas{
	color: #19315b;
	text-decoration: none;
	width: 100%;
	float:left;
	background-color: #fff;	
	border-radius: 10px;
	padding: 15px;
	box-sizing: border-box;
	box-shadow: 0px 6px 15px 0px #999;
	transition: 0.5s all ease-in-out;
	overflow: hidden;
}
.areas:hover{	
	background-color: #fff;
	box-shadow: 0px 6px 15px 0px #666;
	transition: 0.5s all ease-in-out;
}
.areas img {             
	-ms-transform: scale(1);	
	-webkit-transform: scale(1);		
	transform: scale(1);
	transition: 0.5s all ease-in-out;
        }
.areas:hover img {             
	-ms-transform: scale(1.2);	
	-webkit-transform: scale(1.2);		
	transform: scale(1.2);
	transition: 0.5s all ease-in-out;	
        }
.icon-btn {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 50px;
    height: 40px;
    padding: 0 15px;
    border: none;
    border-radius: 0 25px 25px 0;
    background: #d70303;
    color: #fff;
    cursor: pointer;
    overflow: hidden;
    white-space: nowrap;
    transition: width .35s ease;
}

.icon {
    font-size: 20px;
    flex-shrink: 0;
	line-height:1;
}

.text {
	font-size: clamp(14px, 2vw, 17px);
    opacity: 0;
    transition: opacity .2s ease .15s;
}

.icon-btn:hover {
    width: 150px;
}

.icon-btn:hover .text {
    opacity: 1;
}

.footer{background:#0693ad;}
.wave{background: url("../images/wave.png") 0 0 repeat-x;}
.wave{height: 30px; position: relative; width: 100%; z-index: 12; left: 0; bottom: 0px; margin-top: -30px }
.wave {
  -webkit-animation: wave-animation1 6.3s infinite linear; /* Safari 4+ */
  -moz-animation:    wave-animation1 6.3s infinite linear; /* Fx 5+ */
  -o-animation:      wave-animation1 6.3s infinite linear; /* Opera 12+ */
  animation:         wave-animation1 6.3s infinite linear; /* IE 10+ */
}

@-webkit-keyframes wave-animation1 {
  0%   { background-position: 0 0; }
  100% { background-position: 1601px 0; }
}
@-moz-keyframes wave-animation1 {
  0%   { background-position: 0 0; }
  100% { background-position: 1601px 0; }
}
@-o-keyframes wave-animation1 {
  0%   { background-position: 0 0; }
  100% { background-position: 1601px 0; }
}
@keyframes wave-animation1 {
  0%   { background-position: 0 0; }
  100% { background-position: 1601px 0; }
}

.container{
    display:flex;
    min-height:50vh;
	background: rgba(255,255,255,0.75);
	padding: 15px;
	box-sizing: border-box;
	box-shadow: 0px 5px 15px 0px #bbb;
	border-radius: 10px;
}

.left-menu{
    max-width: 767px;
  width: 25%;
    background:#fff;
}

.left-menu ul{
    list-style: none;
  padding-inline-start: 0px;
	margin: 0;
}

.left-menu li{
	font-size: clamp(14px, 1vw, 20px);
    border-bottom:1px solid #ddd;
}
.left-menu li:hover{
	color: #fff;
	background:#666;
    border-bottom:1px solid #999;
	transition: 0.3s ease;
}

.left-menu li[data-tab]{
    padding:8px 15px;
    cursor:pointer;
	box-sizing: border-box;
}

.left-menu li.active{
    background:#0f4d7f;
    color:#fff;
	font-weight: 600;
}

.content{
    flex:1;
    padding:0 20px;
	box-sizing: border-box;
}

.tab-content{
    display:none;
}

.tab-content.active{
    display:block;
}

/* Accordion */

.accordion-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:8px 15px;
    cursor:pointer;
}

.arrow{
    transition:.3s;
}

.submenu{
    max-height:0;
    overflow:hidden;
    background:#fafafa;
    transition:max-height .35s ease;
	font-size: 14px;
}

.submenu li{
    padding:8px 15px 8px 35px!important;
    cursor:pointer;
    border-top:1px solid #eee;
    color:#333;
	font-size: clamp(14px, 1vw, 18px);
	font-weight: 400;
}

.submenu li:hover{
    background:#efefef;
	color:#0f4d7f;
}

.submenu li.active{
    background:#5e6190;
    color:#fff;
	font-weight: 500;
}

.accordion.open .submenu{
    max-height:300px; /* Increase if you add more submenu items */
}

.accordion.open .arrow{
    transform:rotate(180deg);
}


/* Desktop */

#tabDropdown{
    display:none;

    width:100%;
    padding:12px;
    border:1px solid #ccc;
    border-radius:5px;
    transition:all .3s ease;
}

#tabDropdown:hover{
    border-color:#171b52;
}

#tabDropdown:focus{
    outline:none;
    border-color:#171b52;
    box-shadow:0 0 8px rgba(0,115,230,.25);
}  
	
.accordion.active > .accordion-header{
    background:#171b52;
    color:#fff;
}

.accordion.active > .accordion-header .arrow{
    color:#fff;
}	  
	
.Gradientbg{
	color:#000;	
	background-color: #c9e6f3;
	background-image: -webkit-linear-gradient(top, #fff, #c9e6f3);
	background-image: -moz-linear-gradient(top, #fff, #c9e6f3);
	background-image: -ms-linear-gradient(top, #fff, #c9e6f3);
	background-image: -o-linear-gradient(top, #fff, #c9e6f3);	
	border:1px solid #97b5cc;
	padding:2px 10px;
	
}

a.Gradientbg{
	color:#000;	
	
	text-decoration: none;
	transition: 0.3s ease;
}
a.Gradientbg:hover{
	color:#000;	
	border:1px solid #97b5cc;
	text-decoration: none;
	box-shadow: 0px 5px 8px 0px #ccc;
}  
/*=============================
PRELOADER
=============================*/
#preloader-active {
    position: fixed;
    inset: 0;
    background: #fff;
    z-index: 999999;
    display: flex;
    justify-content: center;
    align-items: center;
}
/*=============================
LOADER
=============================*/

.loader {
    position: relative;
    width: 120px;
    height: 120px;
}
/*=============================
ROTATING COMPASS
=============================*/

.compass {
    position: absolute;
    inset: 0;
    animation: spin 8s linear infinite;
}
/*=============================
OUTER RING
=============================*/

.ring {
    position: absolute;
    inset: 0;
    border: 2px solid #26277e;
    border-radius: 50%;
}
/*=============================
COMPASS POINTS
=============================*/

.north, .south, .east, .west {
    position: absolute;
    background: #26277e;
}
.north {
    width: 2px;
    height: 18px;
    left: 50%;
    top: -6px;
    transform: translateX(-50%);
}
.south {
    width: 2px;
    height: 18px;
    left: 50%;
    bottom: -6px;
    transform: translateX(-50%);
}
.east {
    width: 18px;
    height: 2px;
    right: -6px;
    top: 50%;
    transform: translateY(-50%);
}
.west {
    width: 18px;
    height: 2px;
    left: -6px;
    top: 50%;
    transform: translateY(-50%);
}
/*=============================
TICKS
=============================*/

.ticks {
    position: absolute;
    inset: 8px;
    border-radius: 50%;
    background: repeating-conic-gradient( #26277e 0deg 1deg, transparent 1deg 12deg );
    -webkit-mask: radial-gradient(circle, transparent 0 40px, black 41px);
    mask: radial-gradient(circle, transparent 0 40px, black 41px);
    opacity: .35;
}
/*=============================
anchorlogo
=============================*/

.anchorlogo {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 60px;
    height: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 5;
}
.anchorlogo img {
    width: 100%;
    display: block;
}

/*=============================
ROTATION
=============================*/

@keyframes spin {
from {
transform:rotate(0deg);
}
to {
transform:rotate(360deg);
}
}
/*=============================
FADE OUT
=============================*/

#preloader-active.hide {
    opacity: 0;
    visibility: hidden;
    transition: .5s ease;
}



@media screen and (max-width:1399px) {
.banner{height: 580px;}
	.bannercaption{bottom:10%;  left: 50%; transform: translateX(-50%); width: 95%; text-align: center;}
}
@media screen and (max-width:1279px) {
	.banner{height: 500px;}
	.imgcircle{
	width: 180px;
	height: 180px;
	
}
.imgzoom{
	width: 180px;
	height: 180px;
	
}
}
@media screen and (max-width:1023px) {
.banner{height: 400px;}
	.paddingtop{padding-top: 50px;}
	.imgcircle{
	width: 150px;
	height: 150px;
	
}
.imgzoom{
	width: 150px;
	height: 150px;
	
}
}
@media screen and (max-width:767px) {
	.banner{height: 350px;}
	.bannercaption{bottom:7%;  left: 50%; transform: translateX(-50%); width: 95%; text-align: center;}
.Button{	
	font-size:14px;	
	padding:5px 15px;	
}
.ButtonSmall{	
	font-size:11px;		
	padding:2px 8px;	
}
.ButtonMedium{	
	font-size:12px;	
	padding:3px 8px;	
}
.ButtonBig{	
	font-size:16px;	
	padding:7px 15px;	
}

.container{
    display:block;
}

.left-menu{
    width:100%;
}

#tabList{
    display:none;
}

#tabDropdown{
    display:block;
    width:100%;
    padding:8px 10px;
    font-size:13px!important;
    border:1px solid #ccc;
    background:#fff;
    margin-bottom:10px;
}

.content{
    padding:15px;
}
	.imgcircle{
	width: 180px;
	height: 180px;
	
}
.imgzoom{
	width: 180px;
	height: 180px;
	
}
}



@media screen and (max-width:639px) {
.banner{height: 280px;}
	.aboutusimg{min-height: 250px}
}

@media screen and (max-width:479px) {
.banner{height: 250px;}
	.aboutusimg{min-height: 200px}
.Button{	
	font-size:13px;	
	padding:5px 12px;	
}
.ButtonSmall{	
	font-size:10px;		
	padding:2px 8px;	
}
.ButtonMedium{	
	font-size:10px;	
	padding:2px 8px;	
}
.ButtonBig{	
	font-size:14px;	
	padding:7px 15px;	
}
	.bannercaption{bottom:3%;  left: 50%; transform: translateX(-50%); width: 95%; text-align: center;}
}