:root{
    --header-height:100px
}
*,::after,::before{
    -webkit-box-sizing:inherit;
    box-sizing:inherit
}
html{
    height:100%;
    -webkit-box-sizing:border-box;
    box-sizing:border-box;
    font-family:Ubuntu,sans-serif;
    -webkit-text-size-adjust:100%
}
body{
    margin:0;
    min-width:320px;
    min-height:100%;
    font-size:24px;
    line-height:1.17;
    color:#000;
    background-color:#fff
}
img,video{
    height:auto;
    max-width:100%;
    -o-object-fit:cover;
    object-fit:cover
}
a{
    text-decoration:none;
    color:inherit
}
.nav{
    font-family:Poppins,sans-serif;
    font-weight:600;
    font-size:16px
}
.nav li a:hover{
    text-decoration:underline
}
.nav li a.is-active{
    color:#063a8d
}
.title{
    font-family:Georgia,Verdana,serif;
    font-weight:700;
    font-size:64px
}
.subtitle{
    font-family:Georgia,Verdana,serif;
    font-weight:700;
    font-size:48px
}
.color-accent{
    color:#063a8d
}
.uppercase{
    text-transform:uppercase
}
.is-hidden{
    display:none!important
}
.btn-reset{
    border:none;
    padding:0;
    background:0 0;
    cursor:pointer
}
.list-reset{
    list-style:none;
    margin:0;
    padding:0
}
.input-reset{
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
    border:none;
    border-radius:0;
    background-color:#fff
}
.input-reset::-webkit-search-cancel-button,.input-reset::-webkit-search-decoration,.input-reset::-webkit-search-results-button,.input-reset::-webkit-search-results-decoration{
    display:none
}
.visually-hidden{
    position:absolute;
    overflow:hidden;
    margin:-1px;
    border:0;
    padding:0;
    width:1px;
    height:1px;
    clip:rect(0 0 0 0)
}
.main{
    overflow-x:hidden
}
.container{
    margin:0 auto;
    padding:0 15px;
    max-width:1140px
}
.text-center{
    text-align:center
}
.disable-scroll,.disable-scroll body,.overflow-hidden,.overflow-hidden body{
    overflow:hidden
}
.burger{
    position:relative;
    display:none;
    border:none;
    padding:0;
    width:26px;
    height:20px;
    color:#063a8d;
    background-color:transparent;
    cursor:pointer
}
.burger::after,.burger::before{
    content:"";
    position:absolute;
    left:0;
    width:100%;
    height:3px;
    background-color:currentcolor;
    -webkit-transition:top .35s ease-in-out,-webkit-transform .35s ease-in-out;
    transition:transform .35s ease-in-out,top .35s ease-in-out,-webkit-transform .35s ease-in-out
}
.burger::before{
    top:0
}
.burger::after{
    top:calc(100% - 3px)
}
.burger__line{
    position:absolute;
    left:0;
    top:50%;
    width:100%;
    height:3px;
    background-color:currentcolor;
    -webkit-transform:translateY(-50%);
    -ms-transform:translateY(-50%);
    transform:translateY(-50%);
    -webkit-transition:-webkit-transform .35s ease-in-out;
    transition:transform .35s ease-in-out;
    transition:transform .35s ease-in-out,-webkit-transform .35s ease-in-out
}
.burger.is-active{
    z-index:9
}
.burger.is-active::before{
    top:50%;
    -webkit-transform:rotate(45deg);
    -ms-transform:rotate(45deg);
    transform:rotate(45deg);
    -webkit-transition:top .3s ease-in-out,-webkit-transform .3s ease-in-out;
    transition:transform .3s ease-in-out,top .3s ease-in-out,-webkit-transform .3s ease-in-out
}
.burger.is-active::after{
    top:50%;
    -webkit-transform:rotate(-45deg);
    -ms-transform:rotate(-45deg);
    transform:rotate(-45deg);
    -webkit-transition:top .3s ease-in-out,-webkit-transform .3s ease-in-out;
    transition:transform .3s ease-in-out,top .3s ease-in-out,-webkit-transform .3s ease-in-out
}
.burger.is-active .burger__line{
    -webkit-transform:scale(0);
    -ms-transform:scale(0);
    transform:scale(0);
    -webkit-transition:-webkit-transform .3s ease-in-out;
    transition:transform .3s ease-in-out;
    transition:transform .3s ease-in-out,-webkit-transform .3s ease-in-out
}
.socials{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    margin:-8px
}
.socials li{
    margin:8px;
    -webkit-transition:.25s ease-in-out;
    transition:.25s ease-in-out
}
.socials li:hover{
    -webkit-transform:scale(1.05);
    -ms-transform:scale(1.05);
    transform:scale(1.05)
}
.socials a{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex
}
.header{
    position:fixed;
    left:0;
    top:0;
    z-index:10;
    padding:20px 0;
    width:100%;
    background-color:rgba(255,255,255,.8)
}
.header__inner{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    -webkit-box-pack:justify;
    -ms-flex-pack:justify;
    justify-content:space-between
}
.header__logo,.header__nav ul{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex
}
.header__nav li{
    margin-right:10px
}
.header__nav li:last-child{
    margin-right:0
}
.hero{
    padding:500px 0 30px
}
.hero__content{
    position:relative;
    margin:0 auto 80px;
    border-radius:10px;
    padding:60px 30px;
    width:100%;
    max-width:730px;
    text-align:center;
    color:#fff;
    background-color:#063a8d
}
.hero__content::before{
    content:"";
    position:absolute;
    left:-190px;
    bottom:97%;
    width:705px;
    height:330px;
    background:url(../images/hero-1.png) center/cover no-repeat
}
.hero__content::after{
    content:"";
    position:absolute;
    right:-211px;
    top:50%;
    width:487px;
    height:322px;
    background:url(../images/hero-2.png) center/cover no-repeat;
    -webkit-transform:translateY(-50%);
    -ms-transform:translateY(-50%);
    transform:translateY(-50%)
}
.hero__content p{
    position:relative;
    z-index:2
}
.hero__title{
    position:relative;
    z-index:2;
    margin-bottom:25px;
    line-height:1;
    text-transform:uppercase
}
.about__inner{
    position:relative;
    padding:45px 0
}
.about__img {
    min-height: 680px;
}

@media (max-width: 768px) {
    .about__img {
        min-height: 400px;
    }
}

@media (max-width: 576px) {
    .about__img {
        min-height: 340px; 
    }
}
.about__img picture{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center
}
.about__content{
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    margin:0 auto;
    border-radius:10px;
    padding:60px 20px 20px;
    width:100%;
    max-width:730px;
    text-align:center;
    color:#000;
    background:rgba(255,255,255,.3);
    -webkit-backdrop-filter:blur(25px);
    backdrop-filter:blur(25px)
}
.about__title{
    margin-bottom:15px
}
.info{
    padding:80px 0 90px;
    color:#fff
}
.info__inner{
    position:relative;
    border-radius:10px;
    padding:60px 20px;
    max-width:730px;
    text-align:center;
    background-color:#063a8d
}
.info__title{
    margin-bottom:18px
}
.info__img{
    position:absolute;
    right:calc(-100% + 240px);
    top:-60px
}
.info__img picture{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex
}
.images{
    padding:60px 0 80px
}
.images__title{
    margin-bottom:70px;
    text-align:center
}
.images__slider{
    margin:0 auto;
    padding-top:115px;
    max-width:800px;
    max-height:500px
}
.images__item{
    position:relative;
    padding-bottom:90px;
    cursor:pointer
}
.images__item picture{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-transform-origin:bottom;
    -ms-transform-origin:bottom;
    transform-origin:bottom;
    -webkit-transition:-webkit-transform .25s ease-in-out;
    transition:transform .25s ease-in-out;
    transition:transform .25s ease-in-out,-webkit-transform .25s ease-in-out
}
.images__item img{
    border-radius:10px
}
.images__item.swiper-slide-active .images__pagination{
    background-color:#063a8d
}
.images__item.swiper-slide-active picture{
    -webkit-transform:scale(1.32) translateY(-10px);
    -ms-transform:scale(1.32) translateY(-10px);
    transform:scale(1.32) translateY(-10px)
}
.images__pagination{
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    margin:0 auto;
    border-radius:5px;
    width:90px;
    height:10px;
    background-color:rgba(6,58,141,.56);
    -webkit-transition:background-color .25s ease-in-out;
    transition:background-color .25s ease-in-out
}
.footer{
    padding:40px 0 35px;
    color:#fff;
    background-color:#063a8d
}
.footer__inner{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
    -ms-flex-direction:column;
    flex-direction:column;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    text-align:center
}
.footer__link{
    margin-bottom:20px;
    font-weight:600;
    font-size:16px;
    text-transform:uppercase
}
.footer__link:hover{
    text-decoration:underline
}
.footer__img{
    margin-bottom:40px
}
.footer__nav,.footer__nav li{
    margin-bottom:15px
}
.footer__nav li a.is-active{
    color:#fff
}
.footer__nav li:last-child{
    margin-bottom:0
}
.footer .socials{
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center
}
@media screen and (max-width:1280px){
    .title{
        font-size:48px
    }
    .subtitle{
        font-size:36px
    }
}
@media screen and (max-width:1024px){
    body{
        font-size:20px
    }
    .menu{
        position:fixed;
        right:0;
        top:0;
        bottom:0;
        z-index:8;
        display:none;
        -webkit-box-orient:vertical;
        -webkit-box-direction:normal;
        -ms-flex-direction:column;
        flex-direction:column;
        -webkit-box-align:center;
        -ms-flex-align:center;
        align-items:center;
        overflow:auto;
        padding:50px 15px;
        width:100%;
        max-width:350px;
        background:#fff;
        opacity:0;
        -webkit-transition:.35s ease-in-out;
        transition:.35s ease-in-out
    }
    .menu.is-active{
        opacity:1
    }
    .overlay{
        position:fixed;
        left:0;
        right:0;
        top:0;
        bottom:0;
        z-index:5;
        display:none;
        width:100%;
        height:100%;
        background-color:rgba(0,0,0,.5);
        opacity:0;
        -webkit-transition:.35s ease-in-out;
        transition:.35s ease-in-out
    }
    .overlay.is-active{
        opacity:1
    }
    .title{
        font-size:42px
    }
    .subtitle{
        font-size:30px
    }
    .burger{
        display:block
    }
    .socials{
        -webkit-box-pack:center;
        -ms-flex-pack:center;
        justify-content:center
    }
    .header{
        padding:10px 0
    }
    .header__logo img{
        width:160px
    }
    .header__nav ul{
        display:block
    }
    .header__nav li{
        margin-right:0;
        text-align:center
    }
    .header__nav li:last-child{
        margin-right:0
    }
    .header__nav a{
        display:block;
        padding:12px 0;
        font-size:20px
    }
    .hero{
        padding-top:400px
    }
    .hero__content{
        margin-bottom:40px;
        margin-left:0
    }
    .info{
        padding-top:100px
    }
    .info__inner{
        margin:0 auto
    }
    .info__img{
        right:-120px;
        top:-154px
    }
    .info__img img{
        width:300px
    }
}
@media screen and (max-width:768px){
    body{
        font-size:18px
    }
    .title{
        font-size:36px
    }
    .subtitle{
        font-size:24px
    }
    .socials li img{
        width:30px;
        height:30px
    }
    .hero{
        padding-top:350px
    }
    .hero__title{
        margin-bottom:10px
    }
    .hero__content::before{
        left:-10px;
        bottom:122%;
        width:365px;
        height:170px
    }
    .hero__content::after{
        right:0;
        top:auto;
        bottom:27%;
        width:200px;
        height:192px;
        background-image:url(../images/hero-2-mobile.png)
    }
    .info{
        position:relative;
        padding-top:300px;
        padding-bottom:40px
    }
    .info__inner{
        position:static
    }
    .info__img{
        left:0;
        right:0;
        top:0;
        margin:0 auto
    }
    .info__img picture{
        -webkit-box-pack:center;
        -ms-flex-pack:center;
        justify-content:center
    }
    .images{
        padding-top:30px
    }
    .images__item{
        padding-bottom:40px
    }
}
@media screen and (max-width:575px){
    body{
        font-size:16px
    }
    .hero{
        padding-top:220px
    }
    .hero__content{
        padding:37px 15px
    }
    .hero__content::before{
        left:-10px;
        bottom:170px;
        width:230px;
        height:108px
    }
    .hero__content::after{
        bottom:50px;
        width:125px;
        height:122px
    }
    .footer__img{
        margin-bottom:20px
    }
    .footer__img img{
        width:160px
    }
}
@media screen and (max-width:475px){
    .images__title{
        margin-bottom:40px
    }
    .images__slider{
        margin:0 -15px
    }
    .images__pagination{
        width:70px
    }
}
.button-group {
     text-align: center;
     margin-top: 20px;
    /* Space above the button group */
}
.button {
     display: inline-block;
     padding: 10px 20px;
     margin: 0 10px;
    /* Adjust space between buttons */
     background-color: #063a8d;
    /* Adjust to match your theme */
     color: white;
     text-decoration: none;
     text-align: center;
     border-radius: 5px;
     font-family: 'Poppins', sans-serif;
}
.button:hover {
     background-color: #143cee;
    /* Darker background on hover */
}
/* (c)matheus 2014 */
@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro);
/*----1st loader----*/
.ring1{
  width: 50px;
  height: 50px;
  border-radius: 100%;
  background-color: transparent;
  position: absolute;
  margin-left: auto;
  margin-right: auto;
  animation: rotate 3s infinite linear;
  border-left: 5px solid rgba(202, 235, 15, 0.685);
  border-bottom: 5px solid rgba(27, 188, 155, 1);
  border-right: 5px solid rgba(188, 27, 134, 0.5);
  border-top: 5px solid rgba(27, 188, 155, 1);
}
.ring2{
  width: 40px;
  height: 40px;
  border-radius: 100%;
  background-color: transparent;
  animation: rotate 2s infinite linear;
  border-left: 5px solid rgba(8, 85, 69, 0.5);
  border-bottom: 5px solid rgba(226, 7, 91, 0.5);
  border-right: 5px solid rgba(27, 188, 155, .5);
  border-top: 5px solid rgb(214, 231, 228);
}
.ring3{
  width: 30px;
  height: 30px;
  border-radius: 100%;
  background-color: transparent;
  animation: rotate 1s infinite linear;
  border-left: 5px solid rgba(53, 19, 245, 0.5);
  border-bottom: 5px solid rgba(27, 188, 155, .5);
  border-right: 5px solid rgba(27, 188, 155, .5);
  border-top: 5px solid rgba(27, 188, 155, 1);
}
.ring4{
  width: 20px;
  height: 20px;
  border-radius: 100%;
  background-color: transparent;
  animation: rotate .90s infinite linear;
  border-left: 5px solid rgba(27, 188, 155,.5);
  border-bottom: 5px solid rgba(27, 188, 155,.5);
  border-right: 5px solid rgba(27, 188, 155,.5);
  border-top: 5px solid rgba(27, 188, 155, 1);
}
@keyframes rotate {
  from{
    transform: rotate(0deg);
  }
  to{
    transform: rotate(360deg);
  }
}
/*----2nd loader code----*/
.con{
  width: 100px;
  height: 100px;
  background-color: transparent;
  border-radius: 100px;
  position: absolute;
  left: 36%;
  top: 45%;
  background: #22313f;
}
.con:before{
  content: '';
  width: 20px;
  height: 35px;
  background-color: #1BBC9B;
  border-radius: 10px;
  position: absolute;
  left: 39%;
  top: 26%;
  animation: loader-2 1.5s infinite linear;
  animation-direction: reverse;
  transform-origin: 50% 50%;
}
.con:after{
  content: 'Loading';
  color: #1BBC9B;
  position: absolute;
  left: 23.5%;
  top: 66%;
  font-family: 'Source Sans Pro', sans-serif;
  font-wheight: bold;
}
@keyframes loader-2{
  0%{
    transform: rotateY(90deg);
    left: 50;
  }
  50%{
    transform: rotateY(-90deg);
  }
  100%{
    transform: rotateY(90deg);
  }
}
/*----3rd code----*/
.pill{
  width: 100px;
  height: 100px;
  background-color: transparent;
  border-radius: 100px;
  position: absolute;
  left: 26%;
  top: 45%;
  background: #22313f;
}
.pill:before{
  content: '';
  width: 20px;
  height: 35px;
  background-color: #1BBC9B;
  border-radius: 10px;
  position: absolute;
  left: 39%;
  top: 6%;
  animation: loader-3 1.5s infinite linear;
  animation-direction: reverse;
  transform-origin: 50% 50%;
  trasnsform: rotate(180deg);
}
/*.pill:after{
  content: 'Loading';
  color: #1BBC9B;
  position: absolute;
  left: 23.5%;
  top: 66%;
  font-family: 'Source Sans Pro', sans-serif;
  font-wheight: bold;
}*/
@keyframes loader-3{
  0%{
    height: 35px;
    top: 6%;
  }
  50%{
    height: 15px;
    top: 76%;
  }
  100%{
    height: 35px;
    top: 6%;
  }
}
/*----misc code----*/

.ty{
  color: rgba(27, 188, 155,.5);
  transition: .5s font-size;
  font-size: 20px;
  text-align: center;
  font-family: 'Audiowide', cursive;
}
.ty:hover{
  color: rgba(27, 188, 155,1);
  cursor: default;
  font-size: 30px;
}
.con-holder{
  width: 50px;
  heght: 50px;
}
.about__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.about__img {
	width: 100%;
	max-width: 1000px;
}

.about__img picture,
.about__img img {
	display: block;
	width: 100%;
	height: auto;
}

.about__content {
	width: 100%;
	max-width: 800px;
	text-align: center;
	padding: 20px;
}

.about__title {
	margin-top: 20px;
}