@font-face {
    font-family: "Montserrat Regular";
    src: url("font/Montserrat-Regular.woff") format('woff');
}

@font-face {
    font-family: "Montserrat SemiBold";
    src: url("font/Montserrat-SemiBold.woff") format('woff');
    font-weight: bold;
}

@font-face {
    font-family: "Montserrat Bold";
    src: url("font/Montserrat-Bold.woff") format('woff');
    font-weight: bold;
    font-style: italic;
}
@font-face {
    font-family: 'Code Pro LC';
    src: url("font/subset-Code-Pro-LC.woff2") format('woff2'),
        url("font/subset-Code-Pro-LC.woff") format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

body{font-family: 'Montserrat Regular' !important; overflow-x: hidden;}
body.mainmenuopened {
    overflow-y: hidden;
}
.mainHeader {
    width: 100%;
    height: 140px;
    position: absolute;
    z-index: 1000;
    left: 0;
    top: 0; 
}

*, *:after, *:before { -webkit-box-sizing: border-box; box-sizing: border-box; }
.clearfix:before, .clearfix:after { display: table; content: ''; }
.clearfix:after { clear: both; }
.clearfix{ clear:both; float:none;}

#nav{display: none;}
.indexNewsContainer{width: 100%; min-height:365px; background: rgb(0,166,226); position: relative;
background: linear-gradient(-90deg, rgba(0,166,226,1) 0%, rgba(0,166,226,1) 25%, rgba(121,50,130,1) 55%, rgba(229,0,102,1) 81%, rgba(232,60,77,1) 100%);}
.indexNewsMask{background: url(../img/index-news-mask.png) no-repeat right; min-height:365px; width: 100%; height: auto;}

a.indexNews{display: inline-block; width: auto; height: 50px; border: 1px solid rgba(255,255,255,0.11); border-radius: 25px; line-height: 50px; padding: 0 30px; font-size:16px; color: #fff; transition: all 0.3s ease-in-out; margin-right: 10px;}
a.indexNews:hover{ border: 1px solid rgba(255,255,255,1); background: #fff; color: #A5A5A5;}

a.indexNewsAr{display: inline-block; width: 50px; height: 50px; border-radius: 100%; border: 1px solid rgba(255,255,255,1); line-height: 50px; padding: 0; font-size:18px; color: #A5A5A5; transition: all 0.3s ease-in-out; background: #fff; text-align: center;}
a.indexNewsAr:hover{ border: 1px solid rgba(255,255,255,0.11); background: none; color: #fff;}


a.indexNewsArc{display: inline-block; width: 50px; height: 50px; border-radius: 100%; border: 1px solid rgba(255,255,255,1); line-height: 50px; padding: 0; font-size:18px; color: #fff; transition: all 0.3s ease-in-out; background:none; text-align: center;}
a.indexNewsArc:hover{ border: 1px solid rgba(255,255,255,0.11); background: #fff; color: #E31B5D;}


.midBg{width: 60%; height: 450px; background: linear-gradient(-90deg, rgba(0,166,226,1) 0%, rgba(0,166,226,1) 25%, rgba(121,50,130,1) 55%, rgba(229,0,102,1) 81%, rgba(232,60,77,1) 100%); position: absolute; z-index: 0; right: 0%; bottom:-50px;}
.midBgMask{background: url(../img/index-news-mask.png) no-repeat center; min-height:450px; width: 100%; height: auto;}

.indexProductBox{width: 100%; min-height: 500px; background: rgba(242,242,242,0.7); backdrop-filter: blur(25px);}
.indexPBoxL{width: 141px; height: 141px; display: inline-block; display: flex; align-items: center; justify-content: left; float: left; margin: 30px 0 0 38px; display: none;}
.indexPBoxTc{width: 100%; display: block; height: auto; padding: 30px 38px 30px 38px;}
.indexPBoxT{width: 100%; height: auto; font-size:24px; font-weight: 600; color:#001341;}
.indexPBoxST{width: 100%; height: auto; font-size:24px; font-weight: 300; color:#001341; padding: 10px 0;}
.indexPBoxSp{width: 66px; height: 2px; background: rgba(0,0,0,0.04);}
.indexPBoxTxt{width: 100%; height: auto; font-size:16px; font-weight:400; color:#001341; padding: 25px 0 0 0; line-height: 25px;}

.indexProductBg{
	position: absolute;
	left:-10%;
	padding: 0 10%;
	top:-310px;
	background: linear-gradient(-90deg, rgba(0,166,226,1) 0%, rgba(0,166,226,1) 25%, rgba(121,50,130,1) 55%, rgba(229,0,102,1) 81%, rgba(232,60,77,1) 100%);
	width: 120%;
	height: 821px;
	border-radius: 50% / 30%;
	border-top-left-radius: 0;
	border-top-right-radius: 0;	
	
}
.indexProductMask{background: url(../img/index-news-mask.png) no-repeat right; min-height:821px; width: 120%; height: auto;
	position: relative;
	left:-10%;
	padding: 0 10%;
	
	border-radius: 50% / 30%;
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}

.midInfCon{background: url(../img/mdb.png) no-repeat right; min-height:321px; width: 100%; height: auto; position: relative; border-radius: 10px;
}


.footerLogo{width: 197px; height: 77px; background: #fff; box-shadow: 0px 20px 20px 0px rgba(0,0,0,0.11); border-radius: 10px; text-align: center; display: flex; align-items: center; justify-content: center; margin: 30px; overflow: hidden;}

.footerLogo img{ max-width: 60%}

.midConTC{width: 100%; padding: 60px 150px;}

.midSStrB{width: 150%; height: 748px; background: #011E65; position: absolute;}
.midSStrIB{width: 100%; height: auto; position: absolute;}
.midSStrIB img{width: 100%;}
.midSStrST{font-size: 16px; color:#6C6C6C; width: 100%; height: auto; padding: 30px;}
.midSStrSTx{font-size:44px; color:#001341; width: 100%; height: auto; padding:10px 30px; line-height: 50px; font-weight: 600;}
.midSStrSTxx{font-size: 16px; color:rgba(0,19,65,0.56); width: 100%; height: auto; padding:10px 30px; line-height: 25px;}






































a.accordionOneT{

	border-top:1px solid;
	border-right:1px solid;
	border-left:1px solid;
	border-color:#FAFBFC;
	height: 60px; line-height:60px;
	width: 100%;
	font-size:16px;
	color: #000;
	background: #fff;
	padding: 0 60px 0 15px;
	text-align:left;
	position: relative;
	display: block;
	transition: all 0.3s ease-in-out; 
}
a.accordionOneT:before{
	content:"\f105";
	position:absolute; 
	font-family: 'FontAwesome';
	right:13px; 
	font-size:20px; 
	top:50%; 
	color: #868687;
	
	margin-top:-25px; 
	transition: all 0.3s ease-in-out;
}



a.accordionOneT:hover{color:#333333;background: #fff; opacity: 1;}

a.accordionOneT:hover:before{
	content:"\f107";
	position:absolute; 
	font-family: 'FontAwesome';
	right:13px; 
	font-size:20px; 
	top:50%; 

	
	margin-top:-25px; 
	transition: all 0.3s ease-in-out;
}
a.accordionOneT:nth-child(1) {
  border-radius: 10px 10px 0 0; 
}
a.accordionOneT:last-child {
   border-bottom:1px solid;
	  border-radius: 0 0 0 0; 

}

a.accordionOneT:hover  .iconnnn{ color:#fff;}

a.accActiveT {color:#333333; opacity: 1; background: #fff;}
a.accActiveT:before{
	content:"\f107";
	position:absolute; 
	font-family: 'FontAwesome';
	right:13px; 
	font-size:20px; 
	top:50%; 

	
	margin-top:-25px;
	transition: all 0.3s ease-in-out;
}


.accordionConT {
	margin:0 0 0 0; padding:25px 15px;
	border-left:1px solid #FAFBFC;
	border-right:1px solid #FAFBFC;
	overflow: hidden;
	clear: both;
	text-align:justify; background: #fff;
	font-size:14px; color:rgb(112,112,112,0.63); line-height:18px; font-family: 'Montserrat Regular',sans-serif;
	
}
a.accordionConT:last-child {
	border-bottom:1px solid #FAFBFC;
}

.accordionConT p{ color:rgb(112,112,112,0.63);}



.nFooterLogo{width: 100%; height: auto; text-align: left;}
.nFooterIC{margin-top: 40px;  width: 100%;}
.nFooterI{width: 20px;
    margin-right: 29px;
    height: 79px;
    font-size: 35px;
    float: left;
    color: #fff;}
.nFooterT{font-size: 13px; color:#fff; font-weight: 300; line-height: 15px;}
.nFooterSC{margin-top: 10px;  width: 100%;}
.nFooterSI{width: 20px;
    margin-right: 29px;
    height: 49px;
    font-size: 35px;
    float: left;
    color: #fff;}
.nFooterST{font-size: 22px; color:#fff; padding-top: 7px;}
.nFooterSS{width: 100%; margin-top: 22px;}

#footer {
    position: relative;
    display: block;
    background-color: #1b1c21;
    width: 100%;
    color: #fff;
    font-size: 13px;
    /*margin-top: 105px;*/
}
#footer .footer-menu {
    width: 100%;
    display: block;
    padding: 0 0 74px;
}
#footer .footer-menu .menu-wrapper {
    width: 16.666%;
    height: 280px;
    float: left;
}
#footer .footer-menu ul {
    color: #6c6c6c;
    display: block;
}

#footer .footer-menu ul li {
    width: 100%;
    display: block;
    margin-bottom: 18px;
    line-height: 1;
}

#footer .footer-menu ul li label {
    font-weight: 600;
    color: #fff;
    display: block;
    font-size: 16px;
}

#footer .copyright-block {
    display: block;
    width: 100%;
    border-top: 1px solid #2d2d2d;
    padding: 18px 0;
}
#footer .copyright-block .copyright-text {
    padding: 6px 0 0 43px;
    color: #6c6c6c;
}

#footer a {
    color: #fff; font-weight: 300;
    transition: color .3s linear;
}

.swiper { width: 100%; height: 100%; }

.successS{ background: rgba(255,255,255,0.4); backdrop-filter: blur(15px);}

.successS  .swiper-pagination-bullet{
	width:6px !important;
	height:6px !important;
	background:#011E65 !important;
	opacity: 1 !important;
	cursor: pointer;
	position: relative !important;
	border-radius: 100% !important; left: 20px;
	border:1px dotted transparent;
	box-sizing:content-box; transition:all .3s;	
	margin: 30px 0 !important;
	display: block
	
}
.successS  .swiper-pagination-bullet-active{
	background: #fff !important;
}
.successS  .swiper-pagination-bullet-active:before{
	content: "";
	position: absolute;
	padding: 10px;
	border-radius: 100%;
	left: -8px;
	top: -8px;
	border:1px dashed rgb(1,30,101,0.5);	
}

.successS .swiper-pagination-horizontal{
	bottom: inherit;
	left: 30px !important;
    top: 50% !important;
    transform: translate3d(0px,-50%,0);	
	width: 50px !important;
}



ul.midmenu{margin: 0; padding: 0; display: inline-block; text-align: center; width: 100%;}
ul.midmenu li{display: inline-block; padding: 10px 20px;}
ul.midmenu li a{color: rgb(108,108,108, 0.56);}
ul.midmenu li a:hover{color: rgb(108,108,108,1);}


a.successL{color: #001341; transition:all .3s;}
a.successL:hover{ text-decoration: underline;}

a.aboutLink{display: block; width: 100%; height: 30px; transition:all .3s; color: #fff;}
.aboutLT{display: inline-block; float: left; line-height: 32px; transition:all .3s;}
.aboutLI{display: inline-block; float: left; line-height: 0; margin-left: 35px; font-size:32px; transition:all .3s;}

a.aboutLink:hover .aboutLI{ margin-left: 25px;}




.successSM  .swiper-pagination-bullet{
	width:6px !important;
	height:6px !important;
	background:rgba(255,255,255,0.55) !important;
	opacity: 1 !important;
	cursor: pointer;
	position: relative !important;
	border-radius: 100% !important; right: 15px;
	border:1px dotted transparent;
	box-sizing:content-box; transition:all .3s;	
	margin: 0 20px 0 0 !important;
	
}
.successSM  .swiper-pagination-bullet-active{
	background: #fff !important;
}
.successSM  .swiper-pagination-bullet-active:before{
	content: "";
	position: absolute;
	padding: 10px;
	border-radius: 100%;
	left: -8px;
	top: -8px;
	border:1px dashed #73E9F2;	
}

.successSM  .swiper-pagination-bullets.swiper-pagination-horizontal {
    bottom: 130px;
    left: 25px;
    width: 400px;
}

.successSM .swiper-pagination {
    position: absolute;
    text-align: left;
    transition: .3s opacity;
    transform: translate3d(0,0,0);
    z-index: 10;
}

a.viewAll{width: 100%; min-height: 200px; background:rgba(1,30,101,0.1); backdrop-filter: blur(25px); padding: 50px 25px; display:block; transition:all .3s;}
.viewAT1{width: 100%; height: auto; font-size: 24px; font-weight: 600; color: #fff; transition:all .3s;}
.viewAT2{width: 100%; height: auto; font-size: 24px; font-weight: 300; color: #fff; padding: 10px 0 0 0; transition:all .3s;}
.viewAT3{width: 100%; height: auto; font-size: 16px; line-height: 25px; font-weight: 300; color: #fff; padding: 10px 0 0 0; transition:all .3s;}
.viewAT4{width: 100%; height: auto; font-size: 22px; font-weight: 300; color: #fff; padding: 10px 0 0 0; transition:all .3s;}

a.viewAll:hover{background: #011E65;}
a.viewAll:hover .viewAT4{ padding-left: 20px;}

.whyBulutLCon{width: 100%; height: 204px; background: rgba(255,255,255,0.3); backdrop-filter: blur(25px); z-index: 10; border:1px solid rgba(255,255,255,0.1); border-radius: 12px; padding: 30px;}
.whyBulutLT{width: 100%; height: auto; padding: 10px 0; font-size:24px; font-weight: 600; color: #fff;}
.whyBulutLTx{width: 100%; height: auto; padding: 10px 0; font-size:16px; font-weight: 400; color: #fff; line-height: 25px;}

.wyhBulutSw .swiper-slide{width: 370px;}



#tabHead{ width:100%; height:39px; text-align: center; display: inline-block;}
#tab-head{ width:100%; margin:0 auto; height:49px; display: inline-block; text-align: center;}
#tab-head li{ display:inline-block; width:auto; height:50px; padding:0 10px;}
#tab-head a{ font-size:18px; color: rgb(108,108,108, 0.56); font-weight:600; display:inline-block; text-align:center; width:auto; height:50px; line-height:50px; transition: all 0.4s ease-in-out; padding:0 15px; margin:0 5px 0 0;}
#tab-head a:hover{ color: rgb(108,108,108,1);}
#tab-head a.active{color: rgb(108,108,108,1);}

.bulutCloudProduct .swiper-slide{width: 397px;}


.tabContent { width:100%; min-height:420px; float:left; position:relative; padding:25px 0 0 0; margin:0 0 0 0;}
#tabContent { width:100%; position:relative; padding:0;}


a.readMoreBlog{ border: 1px solid #fff; color: #fff; padding: 12px 18px; margin-right: 10px; transition: all 0.4s ease-in-out;}
a.readMoreBlog:hover{  background: #fff; color: #000;}

a.readMoreG{ border: 1px solid #fff; color: #fff; font-size: 16px; padding: 12px 18px; margin-right: 10px; transition: all 0.4s ease-in-out;}
a.readMoreG:hover{  background: #fff; color: #000;}


a.viewAllBlog{ text-decoration: underline; color: #fff; padding: 12px 18px; margin-right: 10px; transition: all 0.4s ease-in-out;}
a.viewAllBlog:hover{ text-decoration: none; }

.bulutRef .swiper-slide{width: 197px; height:320px;}




.indexNewsSVM{display: inline-block; width: 100%; height: 50px; border: 1px solid rgba(255,255,255,0.11); border-radius: 25px; line-height: 50px; padding: 0 0; font-size:16px; color: #fff; transition: all 0.3s ease-in-out; text-align: center; cursor: pointer;}
.indexNewsSVM:hover{ border: 1px solid rgba(255,255,255,1); background: #fff; color: #A5A5A5;}
.swiper-slide-active .indexNewsSVM{ border: 1px solid rgba(255,255,255,1); background: #fff; color: #A5A5A5;}

.bulutMVS .swiper-pagination-bullet {
	display: inline-block; width: auto; height: 50px; border: 1px solid rgba(255,255,255,0.11); border-radius: 25px; line-height: 50px; padding: 0 30px; font-size:16px; color: #fff; transition: all 0.3s ease-in-out; margin-right: 10px;
}
.bulutMVS .swiper-pagination-bullet-active {
	border: 1px solid rgba(255,255,255,1); background: #fff; color: #A5A5A5;
}

.bulutMVS  .swiper-horizontal>.swiper-pagination-bullets {
    bottom: -100px;
    left: 0;
    width: 100%;
}

.bulutMVSN{display: inline-block; width: 50px; height: 50px; border-radius: 100%; border: 1px solid rgba(255,255,255,1); line-height: 50px; padding: 0; font-size:18px; color: #A5A5A5; transition: all 0.3s ease-in-out; background: #fff; text-align: center; position: absolute; right: -70px; top: 10px;}
.bulutMVSN:hover{ border: 1px solid rgba(255,255,255,0.11); background: none; color: #fff; cursor: pointer;}

.bulutMVSP{ width: 50px; height: 50px; border-radius: 100%; border: 1px solid rgba(255,255,255,1); line-height: 50px; padding: 0; font-size:18px; color: #A5A5A5; transition: all 0.3s ease-in-out; background: #fff; text-align: center; position: absolute; right: -70px; top: 10px; display: none; cursor: pointer;}
.bulutMVSP:hover{ border: 1px solid rgba(255,255,255,0.11); background: none; color: #fff;}

.bulutMVSNav .swiper-slide{width:160px;}


a.midBtn{width: 100%; height: 87px; border-radius: 15px; background: rgba(233,240,251,0.25); padding: 20px 20px; display: block; transition: all 0.3s ease-in-out;}
.midBtnS1{width: 51px; height: 51px; background: #fff; border-radius:8px; float: left; text-align: center; line-height: 56px; font-size:30px; color: #1034A1;}
.midBtnS2{width: 100%; font-size:16px; color: #fff; font-weight: 500; padding-top: 10px; transition: all 0.3s ease-in-out;}
.midBtnS3{width: 100%; font-size:12px; color:rgba(255,255,255,.55); font-weight: 500; padding-top: 5px; transition: all 0.3s ease-in-out;}

a.midBtn:hover{ background: rgba(233,240,251,1);}
a.midBtn:hover .midBtnS2{ color: #1034A1;}
a.midBtn:hover .midBtnS3{ color: #1034A1;}

.careerBannerImage {
    position: absolute;
    display: block;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
	z-index: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}




#careerTab{ width:100%; margin:0 auto; height:auto; display: inline-block; text-align: center;}
#careerTab a{ display: block; width: 100%; height: auto;}
#careerTab a > .img{width: 100%; height: auto;}
#careerTab a > .img img{width: 100%; height: auto; display: block;}
#careerTab a > .titleCon{ width: 100%; height: auto; padding-top: 10px; position: relative;}
#careerTab a > .titleCon > .icon{width: 40px; height: 40px; border: 1px solid rgb(112,112,112,0.06); border-radius: 40px; line-height: 42px; text-align: center; color: #10A4EF; float:left;}
#careerTab a > .titleCon > .title{margin-left: 55px; height:40px; line-height: 42px; color: #001341; text-align:left; font-weight: 600; font-size:20px;}

#careerTab a.active > .titleCon:before{
	content: "";
	position: absolute;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 28px 28px 28px;
	bottom: -35px;
	left: -8px;
	border-color: transparent transparent #FCFCFC transparent;	
	transition: all 0.3s ease-in-out;
	transition-delay: 0.72s;
	
}

#careerTab a:hover .icon{ background: #10A4EF; color: #fff;}
#careerTab a.active .icon{background: #10A4EF; color: #fff;}




.careerContent { width:100%; min-height:300px; background: #FCFCFC; padding: 90px 0 70px 0 ; }
#careerContent { width:100%; position:relative; padding:0;}

a.careerReadMore{font-size:16px; color: #10A4EF; margin-top: 20px; display: inline-block; width: auto; line-height: 20px;}
a.careerReadMore > i {color: #134563;}

.iBannerB{width: 100%; height: auto; position: absolute; top: -50px;}

.sStory{width: 100%; text-align: center;}
.sStoryD{width: 100%; text-align: center; font-size:16px; font-weight: 300; color: #001341; padding-top: 55px;}
.sStoryI{width: 100%; padding: 45px 0 0 0;}
.iEventC{width: 100%; height: 230px; background: #E31B5D; margin-top: 50px; padding: 30px;}
.iEventL{font-size: 12px; font-weight: 300; color: #fff; padding: 10px 20px 10px 15px; background:#011E65; width: auto; display: inline-block;}
.iEventTitle{width: 100%; height: auto; font-size: 24px; color: #fff; font-weight: 600;}
.iEventSTitle{width: 100%; height: auto; font-size: 24px; color: #fff; font-weight: 100; padding-top: 10px;}
.iEventDt{width: auto; height: auto; font-size: 30px; color:rgba(255,255,255,0.2); font-weight: 600; padding-top: 30px; display: inline-block;}
.iEventLk{display: inline-block;  width: auto; float: right; padding-top: 20px;}

.iAvardC{width: 100%; height: 230px; background:#011E65; margin-top: 50px; padding: 30px;}
.iAvardT{width: 100%; height: auto; font-size: 24px; color: #fff; font-weight: 600; padding-top: 47px;}
.iAvardST{width: 100%; height: auto; font-size: 24px; color: #fff; font-weight: 100; padding-top: 10px;}
.iAvardLk{width: 100%; height: auto; font-size: 24px; color: #fff; font-weight: 100; padding-top: 10px;}
.iAvardIC{width: 100%; padding: 50px 0;}

.iAboutLLCon{width: 100%; height: auto; padding:80px;}
.iAboutLCon{width: 100%; height: auto; padding:130px 80px 20px 80px; position: relative;}
.iAboutRCon{height: auto; padding:10px 0 0 80px; position: relative; width: 410px;}

.iSolutionC{width: 100%; height: auto; background:rgb(242,242,242, 0.28);}
.iSolutionCn{width: 141px; height: 141px; background:#011E65; display: inline-block; display: flex; align-items: center; justify-content: center; float: right;}
.iSolutionCnn{width: 100%; display: block; height: auto; padding: 90px 30px 50px 30px;}

.iWhyBImg{width: 130%; z-index: 1; position: absolute; height: 100%; object-fit: cover;}
.iWhySubT{width: 60%; padding: 30px 10px 30px 90px; font-size:16px; font-weight: 100; color: #FFFFFF; line-height: 25px;}
.iWhyTT{width: 100%; height: auto; font-size:16px; color:#6C6C6C; line-height: 25px; padding-top: 120px;}
.iWhyTTS{width: 100%; height: auto; font-size:44px; font-weight: 600; line-height: 50px; color:#001341; padding-top: 10px;}

.iProT{width: 100%; height: auto; text-align: center; font-size: 44px; color: #001341; font-weight: bold;}

.pT50{padding-top: 50px;}
.pB50{padding-bottom: 50px;}
.pT90{height: 90px;}
.pT60{height: 60px;}
.pT90W{height: 90px;}
.pT450{height: 450px;}
.pT0{height: 0;}
.pT100{height: 100px;}
.pT150{height: 150px;}
.proNumT{width: 100%; height: auto; font-size:53px; color: #fff; font-weight: 600; text-align:center; padding-top: 20px;}
.proNumTx{width: 100%; height: auto; font-size:20px; color: #fff; font-weight: 300; text-align:center; padding-top: 30px; padding-bottom: 20px;}
.border-r1{border-right: 1px solid #D2D2D2;}
.border-r2{border-right: 1px solid #D2D2D2;}

.iProBg{width: 100%; position: relative; height: 630px;}

.tchNC{width: 100%; height: auto; min-height: 794px; background-color:  #E82C52 ; background-image:url('../img/story-bg.png'); background-repeat: no-repeat; background-position: -500px -450px;}
.tchNTC{width: 120%; height: auto; position: absolute;}
.tchNTCT1{width:175px; height: 175px; display: inline-block; float: left;}
.tchNTCTR{width:107px; height: 107px; display: inline-block; float: left; margin: 25px 20px 0 20px;}
.tchNTCTRR{width: 100%; height: auto; position: relative;}








#slider {
    position: relative;
    display: block;
    background-color: #0031a8;
    background-size: cover;
    color: #fff;
    background-image: url("../images/demo-img/slider.jpg")
}
#slider .header-slider {
    width: 514px;
    margin: 103px 0 170px;
    padding: 60px 0 60px 0
}
#slider .header-slider-title {
    line-height: 48px;
    letter-spacing: -0.5px;
    margin-bottom: 34px;
    opacity: 0
}
#slider .header-slider-text {
    font-size: 16px;
    margin-bottom: 39px;
    letter-spacing: .3px;
    padding-left: 5px;
    line-height: 1.88;
    opacity: 0
}
#slider .header-slider .btn-border-ice {
    color: #fff;
    font-family: "Montserrat Bold", sans-serif;
    font-size: 13px;
    padding: 15px 38px 10px;
    transition: opacity 250ms ease;
    opacity: 0
}
#slider .header-slider .btn-secondaryb {
    font-family: "Montserrat Bold", sans-serif;
    font-size: 13px;
    padding: 15px 38px 10px;
    transition: opacity 250ms ease;
    opacity: 0
}


@media(max-width: 1440px)and (min-width: 1199px) {
    #slider .swiper-container {
        max-height: calc(100vh - 120px)
    }
}

@media(max-width: 1199px)and (min-width: 992px) {

    #slider .swiper-container {
        max-height: calc(100vh - 120px)
    }
}


#slider .swiper-container {
    width: 100%;
    height: 100vh;
}
#slider .swiper-container.swiper-container-vertical > .swiper-pagination-bullets {
    right: auto !important;
    left: 50px !important
}
#slider .swiper-container.swiper-container-vertical .swiper-pagination-bullet {
    opacity: .3;
    background: transparent !important;
    border-radius: 0 !important;
    height: 26px !important;
    font-family: "Montserrat Regular", sans-serif !important;
    font-size: 13px
}
#slider .swiper-container.swiper-container-vertical .swiper-pagination-bullet.swiper-pagination-bullet-active {
    opacity: 1 !important
}
#slider .swiper-container.swiper-container-vertical .swiper-pagination-bullet.swiper-pagination-bullet-active:before {
    content: " ";
    border-bottom: 1px solid #fff;
    width: 30px;
    margin-left: -50px;
    position: absolute;
    margin-top: 8px
}
#slider .swiper-container .swiper-slide {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    overflow-y: hidden
}
#slider .swiper-container .swiper-slide.swiper-slide-active .video {
    display: block !important
}
#slider .swiper-container .swiper-slide .video {
    display: none;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 0
}
#slider .swiper-container .swiper-slide .video #uxr-fp-video {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -1000;
    overflow: hidden
}
#slider .swiper-container .swiper-slide .container-fluid {
    z-index: 1
}
#slider .swiper-slide-active .header-slider-title {
    -webkit-animation: banner-title ease-in .7s forwards;
    -o-animation: banner-title ease-in .7s forwards;
    animation: banner-title ease-in .7s forwards;
    animation-delay: .4s;
    opacity: 0
}
#slider .swiper-slide-active .header-slider-text {
    -webkit-animation: banner-title-desc ease-in .7s forwards;
    -o-animation: banner-title ease-in .7s forwards;
    animation: banner-title ease-in .7s forwards;
    animation-delay: .7s;
    opacity: 0
}
#slider .swiper-slide-active .header-slider .btn-border-ice {
	width: auto; border:1px solid #fff; padding: 10px 30px; font-size: 14px; display: inline-block;
    -webkit-animation: banner-button ease-in .7s forwards;
    -o-animation: banner-button ease-in .7s forwards;
    animation: banner-button ease-in .7s forwards;
    animation-delay: 1s;
    opacity: 0
}
#slider .swiper-slide-active .header-slider .btn-secondaryb {
    -webkit-animation: banner-button ease-in .7s forwards;
    -o-animation: banner-button ease-in .7s forwards;
    animation: banner-button ease-in .7s forwards;
    animation-delay: 1.2s;
    opacity: 0
}
#slider .swiper-slide-active .header-slider .text-right {
    -webkit-animation: banner-desc ease-in .4s forwards;
    -o-animation: banner-desc ease-in .4s forwards;
    animation: banner-desc ease-in .4s forwards;
    animation-delay: 1.2s;
    opacity: 0
}

@media(max-width: 450px) {
#slider .swiper-slide-active .header-slider .text-right {

    animation: none;
    opacity: 1;
}	
    #slider {
        background-position: bottom;
        background-size: cover;
        padding-top: 0 !important;
        height: 400px;
		margin-top: 80px;
        background-image: url("../images/banner-mbl.jpg")
    }
    #slider .swiper-container {
        height: 400px
    }
    #slider .swiper-pagination {
        display: none
    }
    #slider .header-slider {
        margin: 0 0 80px;
        max-width: 555px;
        width: 100%;
        height: 400px
    }
    #slider .header-slider-title {
        font-size: 47px;
        line-height: 50px;
        letter-spacing: -0.5px;
        margin: 0 12px 13px
    }
    #slider .header-slider-text {
        padding-left: 12px;
        font-size: 13px;
        margin-bottom: 22px;
    }
    #slider .header-slider-text br {
        display: none;
    }	
    #slider .header-slider .btn-border-ice {
        display: block;
        margin-left: 12px;
        width: 130px;
        height: 30px;
        font-size: 10px;
        padding: 6px 13px 10px !important;
    }
    #slider .header-slider .icon-down {
        position: absolute;
        left: 0;
        right: 0;
        bottom: -4px;
        font-size: 55px;
        display: block;
        margin: 0 auto;
        width: 54px
    }
}

.iBlogT{width: 100%; height: auto; font-size: 44px; font-weight: 600; line-height: 50px; color: #fff; padding-top: 40px;}


	
@keyframes banner-title {
    from {
        transform: translateX(500px);
        opacity: .1
    }
    to {
        transform: translateX(0);
        opacity: 1
    }
}
@keyframes banner-desc {
    from {
        transform: translateY(100px);
        opacity: .1
    }
    to {
        transform: translateX(0);
        opacity: 1
    }
}
@keyframes banner-descM {
    from {
        transform: translateY(95px);
        opacity: .1
    }
    to {
        transform: translateX(-20px);
        opacity: 1
    }
}
@keyframes banner-button {
    from {
        opacity: 0
    }
    to {
        opacity: 1
    }
}


.card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgba(0,0,0,.125);
    border-radius: 0.25rem;
}

.contact-popup {
    right: 10px;
    bottom: 0;
    z-index: 999;
    width: 25%;
    max-width: 337px;
    min-width: 337px;
}
.shadow {
    box-shadow: 0 0.5rem 1rem rgb(0 0 0 / 15%) !important;
}
.position-fixed {
    position: fixed !important;
}
.border-0 {
    border: 0 !important;
}

.card-header {
    padding: 0.75rem 1.25rem;
    margin-bottom: 0;
    background-color: rgba(0,0,0,.03);
    border-bottom: 1px solid rgba(0,0,0,.125);
}

.m-0 {
    margin: 0 !important;
}

.text-white {
    color: #fff !important;
}


.card-header:first-child {
    border-radius: calc(0.25rem - 1px) calc(0.25rem - 1px) 0 0;
}

.contact-popup .card-header {
    background-color: #011E65;
}

.contact-popup .toggle-contact i {
    margin-top: 3px;
}

.card-body {
    flex: 1 1 auto;
    padding: 1.25rem;
}

.pb-2, .py-2 {
    padding-bottom: 0.5rem !important;
}

.contact-popup .card-body {
    display: none;
}

.form-row {
    display: flex;
    flex-wrap: wrap;
    margin-right: -5px;
    margin-left: -5px;
}

.cool-input {
    position: relative;
}

.form-control {
    display: block;
    width: 100%;
    height: calc(1.5em + 0.75rem + 2px);
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.form-control {
    border-radius: 0;
    border: 1px solid #f1f1f1;
    outline: none;
}

textarea, input:not([type=checkbox]) {
    min-height: 60px;
    padding: 18px 10px;
    margin-bottom: 20px;
    outline: none;
    color: #1b1c21;
    font-size: 14px;
}

.contact-popup .form-control {
    font-size: 14px;
}

.contact-popup .card-body input:not([type=checkbox]) {
    min-height: auto;
}




.contact-popup .toggle-contact {
    cursor: pointer;
}

.contact-popup.open .card-body {
    display: block;
}


.form-control {
    display: block;
    width: 100%;
    height: calc(1.5em + 0.75rem + 2px);
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.cool-input textarea {
    height: 100px;
    resize: none;
}

.float-right {
    float: right !important;
}

.form-control {
    border-radius: 0;
    border: 1px solid #f1f1f1;
    outline: none;
	color: #1b1c21;
}
.select-form select {
    color: #707080;
    height: 60px;
    margin: 0 0 20px 0;
    padding-left: 21px;
}
.contact-popup .card-body .select-form select {
    height: calc(1.5em + 0.75rem + 2px);
}


	
.custom-checkbox {
    line-height: 18px;
    min-height: 30px;
    vertical-align: middle;
    cursor: pointer;
    font-size: 14px;
    display: flex;
    flex-wrap: nowrap;
    align-items: center
}
.custom-checkbox span {
    display: inline;
    float: left
}
.custom-checkbox input {
    display: none
}
.custom-checkbox input + span {
    border: 1px solid #f1f1f1;
    width: 30px;
    height: 30px;
    margin-right: 15px;
    max-width: 30px;
    flex: 0 0 30px
}
.custom-checkbox input:checked + span {
    background-color: #4ec9f9
}
.custom-checkbox.danger .error {
    display: none
}
.custom-checkbox.danger span {
    color: #aa7476 !important
}
.custom-checkbox.danger input {
    display: none
}
.custom-checkbox.danger input + span {
    border: 1px solid #aa7476
}



.btn {
    display: inline-block;
    font-weight: 400;
    color: #212529;
    text-align: center;
    vertical-align: middle;
    user-select: none;
    background-color: transparent;
    border: 1px solid transparent;
    padding: 0.375rem 0.75rem;
    font-size: 16px;
    line-height: 1.5;
    border-radius: 0.25rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.btn-link {
    background-color: #0031a8;
    color: #fff;
}

.btn {
    border-radius: 50px;
}




a.contactCheck{
	display: block; width: 124px; height: 164px; background: #FCFCFC; border: 1px solid rgba(112, 112, 112, .06); text-align: center; padding: 30px 0;  transition: all 0.4s ease-in-out; float: left; margin-right: 15px;
}

.contactIcon{width: 64px; height: 64px; border-radius: 64px; background: #011E65; text-align: center;display: flex;
    align-items: center;
    justify-content: center; margin: 0 auto;  transition: all 0.4s ease-in-out;}
.contactIcon path{width: 30px;}
.contactText{width: 100%; height: auto; padding: 20px 0; font-size: 14px; color: #000;}

a.contactCheck:hover{ background: #011E65; border-color: #011E65;}
a.contactCheck:hover .contactIcon{ background: #fff;}
a.contactCheck:hover .contactIcon path { fill:#011E65; }
a.contactCheck:hover .contactText{ color: #fff;}





.formtTboxT{width: 100%; height: auto; font-size: 14px; color:#474A4D; padding: 5px 0;}
.formtTboxC{width: 100%; height: auto; font-size: 14px; color: #fff; padding: 10px 0;}

.formInputTxt{    padding: 12px 36px 12px 24px !important; min-height:30px !important;
    background-color: transparent;
    border: 1px solid rgba(202, 208, 215, .28);
    color: #474A4D; width: 100%; font-size: 16px; border-radius: 10px;}



.contactBtnC {
    display: inline-block;
    width: 100%;
	margin: 20px 0;
    border-radius: 10px;
    padding: 5px 50px !important;
    font-size: 16px !important;
    color: #fff !important;
	height: 40px;
    border: 1px solid #E31B5D;
    font-weight: 600;
    transition: all .4s ease-in-out;
    position: relative;
	background: #E31B5D;
}
.contactBtnC:hover {
    color: #E31B5D !important;
    background: #fff;
}

.contactBtnC:disabled {
    color: #fff !important;
    background: #E31B5D; opacity: 0.5;
}

input[type="radio"]{
  display: none;
}

.formSubject{
	display: block; width: 124px; height: 164px; background: #FCFCFC; border: 1px solid rgba(112, 112, 112, .06); text-align: center; padding: 30px 0;  transition: all 0.4s ease-in-out; float: left; margin-right: 15px; cursor: pointer;
}

#formSbj1:checked:checked ~ .formSubject1,
#formSbj2:checked:checked ~ .formSubject2,
#formSbj3:checked:checked ~ .formSubject3,
#formSbj4:checked:checked ~ .formSubject4
{
   background: #011E65; border-color: #011E65;
}

#formSbj1:checked:checked ~ .formSubject1 .contactIcon,
#formSbj2:checked:checked ~ .formSubject2 .contactIcon,
#formSbj3:checked:checked ~ .formSubject3 .contactIcon,
#formSbj4:checked:checked ~ .formSubject4 .contactIcon
{
   background: #fff;
}

#formSbj1:checked:checked ~ .formSubject1 .contactIcon path,
#formSbj2:checked:checked ~ .formSubject2 .contactIcon path,
#formSbj3:checked:checked ~ .formSubject3 .contactIcon path,
#formSbj4:checked:checked ~ .formSubject4 .contactIcon path
{
   fill:#011E65;
}

#formSbj1:checked:checked ~ .formSubject1 .contactText,
#formSbj2:checked:checked ~ .formSubject2 .contactText,
#formSbj3:checked:checked ~ .formSubject3 .contactText,
#formSbj4:checked:checked ~ .formSubject4 .contactText
{
   color: #fff;
}
.error{border: 1px solid #aa7476}

label.error {
		border: none;
	color: #aa7476;
	}

.contactKvkk{width: auto; display: inline-block; min-width: 150px; float: left; font-size: 14px; color: #474A4D; line-height: 80px;}