

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
	font-family: 'Unbounded', cursive; font-style: normal; font-variant: normal;
	background-color: #F6F6F6;
	/*color:#212225;*/
}


/*** scroll to top ***/

.to-top{
position: fixed;
bottom:0px;
right:0px;
padding:20px;
margin:20px;
display:block;
border-radius:50px;
background-color:#212121;
color:#fff;
height:15px;
width:15px;
line-height:15px !important; 
text-align:center;
} 


#top-nav{
/* display:inline;*/
}




ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}



/*links*/

a{
text-decoration: none;
border:0;
color:#212225;

}


a.hover{
cursor: pointer; !important
}


.arrow-to-top{
  color: #fff;
  margin-top: -4px;

}



/* images */


.hero-background-image{
background-image: url('');
background-size: cover;
height:inherit;
}

.img{
width:100%;
border-radius: 15px;
}


.col3-img{

width:100%;
border-radius: 15px;
display: flex;
margin: 0 auto;
height: 335px;
}


.spacer{
margin-bottom:50px;
}

.thumb{
  
}






/*** Hero backgrounds***/

/*
.full-width-gradient-dark{
width:100%;
background: rgb(19,18,36);
background: linear-gradient(90deg, rgba(19,18,36,1) 15%, rgba(9,9,121,0) 100%);
height:inherit;
padding-bottom:70px;
padding-top:70px;
}
*/

.full-width-gradient-light{
width:100%;
background: rgb(255,255,255);
background: linear-gradient(90deg, rgba(255,255,255,1) 20%, rgba(9,9,121,0) 100%);
height:inherit;
padding-bottom:70px;
padding-top:70px;
}

.hero-construction{
background-image: url('https://images.unsplash.com/photo-1589939705384-5185137a7f0f?auto=format&fit=crop&q=80&w=2940&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D');
background-size:cover;
}


.hero-service{
background-color: #220616;
/*
background-image: url('https://mysticarium.art/img/mymind-XUlsF9LYeVk-unsplash.jpg');
background-size:cover;
*/
}


.hero-restaurant{
background-image: url('https://images.unsplash.com/photo-1622547748225-3fc4abd2cca0?auto=format&fit=crop&q=80&w=2532&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D');
background-size:cover;

}


.column-one-hero{
width:70%;
text-align:center;
display:inline;
margin: 0 auto;
color:#212225;

}











/* Structure */


.wrapper{
margin:30 auto;
}


.column-1-wrapper-body{
margin: 0 auto;
width:85%;
padding-bottom:70px;
padding-top:70px;
text-align:left;
display:flex;
}



.column-1-wrapper-inner{
margin: 0 auto;
width:100%;
padding-bottom:70px;
padding-top:70px;
text-align:left;
display:flex;
}


.column-1-wrapper-body-short{
margin: 0 auto;
width:85%;
padding-bottom:30px;
text-align:left;
display:flex;
}


.column-1-wrapper-body-xtra-short{
margin: 0 auto;
width:85%;
text-align:left;
display:flex;
}


.column-1-wrapper-divider{
margin: 0 auto;
width:85%;
padding-bottom:0px;
text-align:left;
height:2px;
}


.text-divider{
margin: 0 auto;
width:100%;
padding-bottom:0px;
text-align:left;
height:20px;
display: inline-block;
}







header.container-full-width{
margin:0 auto;

color:#fff;
min-height:400px;
background-position: top; 
background-size: cover; 
}


.container{
margin:0px 80px 0 80px; auto;
}


.element-padding{
height:15px;
display:block;
}

.element-padding-large{
height:40px;
display:block;
}


.center{
padding-top: 80px;
}





/*Infinite horizontal scroll*/

.fullwidth-overflow {
  display: flex;
  flex-wrap: nowrap;
  white-space: nowrap;
  min-width: 100%;
  overflow-x: hidden;
  overflow-y: hidden;
}
.scroll {
  display: flex;
  flex-shrink: 0;
  height: 200px;
  align-items: center;
  animation: slide-left 10s linear infinite;
}
.rolling-text{
  font-size: 4.5em;
  padding-left: 0.5em;
}
@keyframes slide-left {
  from {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  to {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }
}


/* number circle */
.circle {
border-radius: 50%;
width: 93px;
height: 34px;
padding: 10px;
background: #fff;
border: 3px solid #000;
color: #000;
text-align: center;
font: 32px Arial, sans-serif;
margin-right: 20px;
}






/*column rules start*/

.column-one{
width:100%;
text-align:left;
display:inline;
}


.column-half-first{
width:50%;
/*padding:0 2.5% 0 0;*/
padding:0 0 2.5% 0;
text-align:left;
display:inline;
}

.column-half-first-flex{
width:50%;
padding:0 2.5% 0 0;
text-align:left;
display:flex;
}


.column-half-second{
width:50%;
padding:0 0 0 2.5%;
text-align:left;
display:inline;
}

.column-half-second-hero{
width:75%;
/*padding:0 0 0 2.5%;*/
padding:0 0 0 0;
text-align:left;
display:inline;
}


.column-half-second-flex{
width:50%;
padding:0 0 0 2.5%;
text-align:left;
display:flex;
}



.column-third-social{
text-align:left;
padding:0 2.5% 0 0;
display: flex;
align-items: center;
}


/*third columns*/

.column-third-first-col{
text-align:left;
padding:0 2.5% 0 0;
display:inline;
/*max-width: 30%;*/
min-width:30%;
}

.column-third-first-col-flex{
text-align:left;
padding:5% 2.5% 0 0;
display:flex;
}

.column-third-second-col{
padding:0 2.5% 0 2.5%;
text-align:left;
display:inline;
/*max-width: 30%;*/
min-width:30%;
}

.column-third-second-col-flex{
padding:5% 2.5% 0 2.5%;
text-align:left;
display:flex;
}


.column-third-second-col-img{
padding: 0 2.5% 0 2.5%;
text-align:left;
display: inline;
max-width: 30%;
}



.column-third-third-col{
text-align:left;
padding:0 0 0 2.5%;
display:inline;
/*max-width: 30%;*/
min-width:30%;

}

.column-third-third-col-flex{
text-align:left;
padding:5% 0 0 2.5%;
display:flex;
}




/*2 columns*/

.column-three-fourths{
width: 100%;
padding:0 0 0 5%;
text-align:left;
display:inline;
}

.column-three-fourths-first{
width: 90%;
/* padding:0 2.5% 0 0;*/
text-align:left;
display:inline;
}

.column-three-fourths-second{
width:40%;
padding:0 0 0 2.5%;
text-align:left;
display:inline;
}

.column-one-fourth-half-first{
  width: 40%;
  padding: 0 2.5% 0 5%;
  text-align: left;
  display: inline;
}





/*Fourth columns*/

.column-one-fourth-first{
min-width:15%;
max-width:25%;
padding:0 2.5% 0 0;
text-align:left;
display:inline;
}

.column-one-fourth-second{
min-width: 15%;
padding:0 2.5% 0 2.5%;
text-align:left;
display:inline;
}


.column-one-fourth-third{
min-width: 15%;
padding:0 2.5% 0 2.5%;
text-align:left;
display:inline;
}


.column-one-fourth-fourth{
min-width: 15%;
padding:0 0 0 2.5%;
text-align:left;
display:inline;
}





/*Fifth columns*/


.column-one-fifth-first{
padding:0 2.5% 0 0;
text-align:left;
display:inline;
min-width: 5%;
}

.column-one-fifth-second{
padding:0 2.5% 0 2.5%;
text-align:left;
display:inline;
min-width: 5%;
}

.column-one-fifth-third{

padding:0 2.5% 0 2.5%;
text-align:left;
display:inline;
min-width: 5%;
}

.column-one-fifth-fourth{
padding:0 2.5% 0 2.5%;
text-align:left;
display:inline;
min-width: 5%;
}

.column-one-fifth-fifth{
padding:0 0 0 2.5%;
text-align:left;
display:inline;
min-width: 5%;
}









/* text */


h1 { 
font-family: 'Unbounded', cursive; font-size: 6vw; font-style: normal; font-variant: normal; font-weight: 100; line-height: 85px; } 

h2 { 
font-family: 'Unbounded', cursive; font-size: 38px; font-style: normal; font-variant: normal; font-weight: 300; line-height: 50px; } 

h3 { font-family: 'Unbounded', cursive; font-size: 23px; font-style: normal; font-variant: normal; font-weight: 300; line-height: 40px; } 

h4 { font-family: 'Unbounded', cursive; font-size: 18px; font-style: normal; font-variant: normal; font-weight: 400; line-height: 20px; } 

p { font-family: 'Unbounded', cursive; font-size: 14px; font-style: normal; font-variant: normal; font-weight: 200; line-height: 24px; letter-spacing:.5px; } 

blockquote { font-family: Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 21px; font-style: normal; font-variant: normal; font-weight: 400; line-height: 30px; } 

pre { font-family: Helvetica Neue, Helvetica, Arial, sans-serif; font-size: 13px; font-style: normal; font-variant: normal; font-weight: 400; line-height: 18.5667px; }


.text-link{
border-bottom-width: 2px;
border-bottom-color: #212225;
border-bottom-style: solid;
padding-bottom:3px;
display: table;
}

.dark-paragraph{
color:#000;
}



b{
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-rendering: geometricPrecision;
}


/* buttons */


.button{
color:#a6f3ff;
display:inline-flex;
border:1px solid #a6f3ff;
padding:18px;
position:relative;
border-radius:50px;
font-family: 'Unbounded', cursive; font-size: 14px; font-style: normal; font-variant: normal; font-weight: 400; letter-spacing:.5px;
}

.button:hover:after{
content: "\00a0 \00a0 \27F6";
}


.button:hover{
background:#a6f3ff;
 transition: 0.3s;
 color:#062233;
}


.rectangle-button-dark{
display:inline-flex;
border:1px solid #062233;
position:relative;
color:#fff;
background-color:#062233;
padding:20px 25px 20px 25px;
border-radius:5px;
margin-top:10px;
font-family: 'Unbounded', cursive; font-size: 14px; font-style: normal; font-variant: normal; font-weight: 400; letter-spacing:.5px;
}



.rectangle-button-dark:hover{
border:1px solid #062233;
color: #062233;
background-color: unset;
padding:20px 25px 20px 25px;

border-radius:5px;
margin-top:10px;
font-family: 'Unbounded', cursive; font-size: 14px; font-style: normal; font-variant: normal; font-weight: 400; letter-spacing:.5px;
}




.dark-button:hover:after{
content: "\00a0 \00a0 \27F6";
}



.rectangle-button{
color:#000;
background-color:#fff;
padding:20px 25px 20px 25px;
border-style: none;
border-radius:5px;
margin-top:10px;
}


.rectangle-button:hover{
color:#fff;
background-color:unset;

border-style: none;
border: 1px solid #fff;
margin-top:10px;
}

.rectangle-button:focus{
border-style: none;
}





/*lists*/


li{
list-style-type:none; 
display:inline;
/*margin-right:1%;*/
text-decoration: none;
}


.category-list{
list-style-type:none; 
display:block;
line-height:20px;
}

.sub-category-list{
list-style-type:none; 
display:block;
line-height:35px;
}





.border-list-first{
text-indent: 20px;
padding:30px 0 30px 0;
border-bottom: 1px solid #d6d9e3;
}

.border-list{
text-indent: 20px;
padding:30px 0 30px 0;
border-bottom: 1px solid #d6d9e3;
}


.border-list-last{
text-indent: 20px;
padding:30px 0 30px 0;
border-top: 0px solid #fff;
}




.border-list:hover{
border-bottom: 1px solid #fff;
box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
border-radius: 10px;
}


.border-list-last:hover{
box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
border-radius: 10px;
}


.border-list-first:hover{
box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
border-radius: 10px;
}













/*div reveal*/

.inline-photo {

  opacity: 0;
  transform: translateY(4em);
  transition: transform 4s .25s cubic-bezier(0,1,.3,1),
              opacity .3s .25s ease-out;
  /*max-width: 600px;
  width: 90%;
  */
  will-change: transform, opacity;
  
}

.inline-photo.is-visible {
  opacity: 1;

  transform: translateY(.4em); 
}

.inline-photo.is-visible {
  opacity: 1;

}

header {
  /*opacity: 0;*/
  transition: opacity .5s .25s ease-out;
}

header.is-visible {
  opacity: 1;
}

.main-photo {
  transform: scale(.8);
}

.heading {
  transform: translate(-50%, calc(-50% + 1em));
}

.is-visible .main-photo {
  transform: none;
}

.is-visible .heading {
  transform: translate(-50%, -50%);
}

.main-photo,
.heading {
  transition: transform 4s .25s cubic-bezier(0,1,.3,1),
              filter 10s 2s ease-out;
  will-change: transform;
}




/***** animated counter *****/

.bg{
  background-color: #1e1f26;
  height: 100vh;
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
}
.level{
  background-color: #00d1b2;
  padding: 5rem 0;
  color: #ffffff;
  margin: 0!important;
}

.title{
  color: inherit;
  width: 200px;
  height: 36px;
}






/***** navbar start *****/

:root {
    --color-accent-light: #00DBDE;
    --color-accent-dark: #FC00FF;
    --color-secondary: #ccc;

    --text-color-default: #2c2c2c;
    --text-color-light: #fff;

    --font-size-default: 15px;
    --font-size-lg: 25px;

    --font-weight-regular: 400;
    --font-weight-semibold: 600;
    --font-weight-default: var(--font-weight-regular);

    --border-color-default: var(--color-secondary);
    --border-color-accent: var(--color-accent-dark);

    --bg-color-default: #fff;
    --bg-color-dark: #2c2c2c;
    --bg-color-accent--lignt: var(--color-accent-light);
    --bg-color-accent--dark: var(--color-accent-dark);

    --transition-duration: .2s;
    --transition-timing-function: linear;
    --transition-delay: 0s;

    --negative-multiplier: -1;

    --gradient-default: linear-gradient(122deg, var(--color-accent-light) 0%, var(--color-accent-dark) 100%);

}

body {

}

/* EXAMPLE STYLES: YOU DON'T NEED THEM!!! */


.header__btns {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin-top: 30px;
}

body a {
  
}

.header__btn {
    transition:
            all
            var(--transition-duration)
            var(--transition-timing-function)
            var(--transition-delay);
    padding: 10px 20px;
    margin-right: 10px;
    background-color: var(--bg-color-default);
    border: 1px solid var(--border-color-default);
    border-radius: 3px;
    cursor: pointer;
    outline: none;
}

.header__btn:hover,
.header__btn.js-active {
    color: var(--text-color-light);
    background-color: var(--bg-color-dark);
}

.header__title {
    margin-bottom: 10px;
    font-weight: var(--font-weight-semibold);
}

.content {

}

.content__title {
    margin-bottom: 80px;
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-default);
    text-align: center;
}

/* TIMELINE STYLES: YOU NEED THEM!!! */
.timeline {
    /*--wrapper-width: 900px;*/

    width: 100%;
    max-width: var(--wrapper-width);
    margin: auto;
}

.timeline__stepper {
    --step-border-width: 3px;
    --offset-to-slider-content: 30px;

    position: relative;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-bottom: var(--offset-to-slider-content);
}

@media(min-width: 530px) {
    .timeline__stepper {
        display: flex;
        justify-content: space-around;
        gap: 0;
    }
}

@media(min-width: 700px) {
    .timeline__stepper {
        --offset-to-slider-content: 50px;
    }
}

.timeline__step {
    position: relative;
    width: 100%;
    cursor: pointer;
}

@media(min-width: 530px) {
    .timeline__step {
        width: 100%;;
    }
}

.timeline__icon {
    --timeline-icon-dimensions: 45px;

    position: relative;
    display: block;
    width: var(--timeline-icon-dimensions);
    max-height: var(--timeline-icon-dimensions);
    height: auto;
    margin: 0 auto;
    transition: opacity var(--transition-duration) var(--transition-timing-function) var(--transition-delay);
}

@media(min-width: 700px) {
    .timeline__icon {
        --timeline-icon-dimensions: 60px;

        margin-bottom: 30px;
    }
}

.timeline__icon--active {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    fill: url(#icon-gradient);
    opacity: 0;
}

.timeline__step-title {
    --timeline-dot-dimensions: 11px;
    --extra-offset-fox-pixelperfect: -1px;

    position: relative;
    display: none;
    padding-top: 30px;
    margin-bottom: 0;
    text-align: center;
    line-height: 1.7;
    border-top: var(--step-border-width) solid var(--border-color-default);
}

@media(min-width: 700px) {
    .timeline__step-title {
        display: block;
    }
}

.timeline__step-title:before,
.timeline__step-title:after {
    position: absolute;
    top: var(--dot-top-position);
    left: 50%;
    display: block;
    width: var(--timeline-dot-dimensions);
    height: var(--timeline-dot-dimensions);
    content: '';
    border-radius: 50%;
}

.timeline__step-title:before {
    --dot-top-position: calc(
            var(--timeline-dot-dimensions)/2 * var(--negative-multiplier) + var(--extra-offset-fox-pixelperfect)
    );

    transform: translate(-50%);
    border: 2px solid var(--border-color-default);
    border-radius: 50%;
    background-color: #fff;
    z-index: 5;
}

.timeline__step-title:after {
    --timeline-dot-dimensions: 25px;
    --dot-top-position: calc(
            var(--timeline-dot-dimensions)/2 * var(--negative-multiplier) + var(--extra-offset-fox-pixelperfect)
    );

    transform: translate(-50%) scale(0);
    border-radius: 50%;
    background-color: #fff;
}

/* this elements generates in JS */
.timeline__step-active-marker {
    --slide-pos-y: none; /* calcs on the fly in js */
    --slide-pos-x: none; /* calcs on the fly in js */
    --slide-width: auto; /* calcs on the fly in js */

    --transition-timing-function: cubic-bezier(0, 0, 0, 1.2);

    position: absolute;
    top: var(--slide-pos-y);
    left: 0;
    display: none;
    width: var(--slide-width);
    height: var(--step-border-width);
    transform: translateX(var(--slide-pos-x));
    transition: transform var(--transition-duration) var(--transition-timing-function) var(--transition-delay);
    background-image: var(--gradient-default);
}

@media(min-width: 700px) {
    .timeline__step-active-marker {
        display: block;
    }
}

.timeline__step.is-active {
    cursor: default;
}

.timeline__step.is-active .timeline__step-title {
    font-weight: var(--font-weight-semibold);
}

.timeline__step.is-active .timeline__step-title:before {
    transition: background-color var(--transition-duration) var(--transition-timing-function) var(--transition-delay);
    background-color: var(--color-accent-dark);
    border-color: var(--border-color-accent);
}

.timeline__step.is-active .timeline__step-title:after {
    transform: translate(-50%) scale(1);
    transition: transform var(--transition-duration) var(--transition-timing-function) var(--transition-delay);
    background-image: var(--gradient-default);
    opacity: .35;
}

.timeline__step.is-active .timeline__icon--default,
.timeline__step:not(.is-active):hover .timeline__icon--default {
    opacity: 0;
}

.timeline__step.is-active .timeline__icon--active,
.timeline__step:not(.is-active):hover .timeline__icon--active {
    opacity: 1;
}

.timeline__slides {

    --slides-container-height: 0px; /* calcs on the fly in js */

    /*--content-offset-x: 20px;*/
   --content-offset-y: 30px;

   /* --decoration-blur-spread: 20px;*/
   /* --decoration-opacity: .7;*/
   /* --decoration-pos-x: 0; */
   /* --decoration-pos-y: 20px; */
    /*--decoration-scale: 1; */

    position: relative;
    width: 100%; /*600px*/
    max-width: 100%;
    margin: auto;
    height: var(--slides-container-height);
   /* border-radius: 5px;*/
    /*background-color: var(--bg-color-default);*/
}

@media(min-width: 700px) {
    .timeline__slides {
        /*--content-offset-x: 30px;*/
        --content-offset-y: 40px;
    }
}

.timeline__slides:before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: "";
    /* opacity: var(--decoration-opacity); */
    /*background-image: var(--gradient-default); */
   /* filter: blur(var(--decoration-blur-spread));*/
    transform: translate3d(var(--decoration-pos-x), var( --decoration-pos-y), 0) scale(var(--decoration-scale));
    z-index: -1;
}

.timeline__slide {
    position: absolute;
    top: 0;
    left: 0;
    padding: var(--content-offset-y) var(--content-offset-x);
    opacity: 0;
    visibility: hidden;
}

.timeline__slide.is-active {
    transition: opacity var(--transition-duration) var(--transition-timing-function) var(--transition-delay);
    opacity: 1;
    visibility: visible;
}

.timeline__slide-title {
    margin-top: 0;
}

.timeline__slide-content {
    line-height: 1.7;
}

.timeline__slide-content p:first-child {
    margin-top: 0;
}

.timeline__slide-content p:last-child {
    margin-bottom: 0;
}


/***** navbar end *****/




/***** blockquote start *****/
body { 
  /*background-color: #FAF9FE;*/
 }

/* center the blockquote in the page */
.blockquote-wrapper {
  /*  display: flex;*/
   height: 20vh;
  /* height: 100vh;*/
   /*padding: 0 20px;*/
    padding: 0;
}

/* Blockquote main style */
.blockquote {
    position: relative;
    font-family: inherit;
    /*max-width: 620px;*/
    /*margin: 80px auto;*/
     margin: 0 auto;
    align-self: center;
  text-align:center;
}

/* Blockquote header */
.blockquote h1 {
    font-family: inherit;
    position: relative; /* for pseudos */
    color: #0a3060;
    font-size: 1.5rem;
    font-weight: 200;
    line-height: 1;
    margin: 0;
    border: 2px solid #FAF9FE;
    border: solid 2px;
    border-radius:20px;
    padding: 35px;
}

/* Blockquote right double quotes */
.blockquote h1:after {
    content:"";
    position: absolute;
    border: 2px solid #0a3060;
    border-radius: 0 50px 0 0;
    width: 60px;
    height: 60px;
    bottom: -62px;
    left: 50px;
    border-bottom: none;
    border-left: none;
    z-index: 3; 
}

.blockquote h1:before {
    content:"";
    position: absolute;
    width: 80px;
    border: 6px solid #F6F6F6;
    bottom: -3px;
    left: 50px;
    z-index: 2;
}

/* increase header size after 600px */
@media all and (min-width: 600px) {
    .blockquote h1 {
        font-size: 2rem;
        line-height: 1.2;
   }

}

/* Blockquote subheader */
.blockquote h4 {
    position: relative;
    color: #0a3060;
    font-size: 1.3rem;
    font-weight: 400;
    line-height: 1.2;
    margin: 0;
    padding-top: 15px;
    z-index: 1;
    margin-left:150px;
    padding-left:12px;
}

 
.blockquote h4:first-letter {
  margin-left:-12px;
}




.animate__fadeInUp{
      --animate-duration: .5s;
    --animate-delay: .5s;
    --animate-repeat: 1;
  
}
/***** blockquote end *****/



/*** begin navbar ***/


.bd-placeholder-img {
        font-size: 1.125rem;
        text-anchor: middle;
        -webkit-user-select: none;
        -moz-user-select: none;
        user-select: none;
      }

      @media (min-width: 768px) {
        .bd-placeholder-img-lg {
          font-size: 3.5rem;
        }
      }

      .b-example-divider {
        width: 100%;
        height: 3rem;
        background-color: rgba(0, 0, 0, .1);
        border: solid rgba(0, 0, 0, .15);
        border-width: 1px 0;
        box-shadow: inset 0 .5em 1.5em rgba(0, 0, 0, .1), inset 0 .125em .5em rgba(0, 0, 0, .15);
      }

      .b-example-vr {
        flex-shrink: 0;
        width: 1.5rem;
        height: 100vh;
      }

      .bi {
        vertical-align: -.125em;
        fill: currentColor;
      }

      .nav-scroller {
        position: relative;
        z-index: 2;
        height: 2.75rem;
        overflow-y: hidden;
      }

      .nav-scroller .nav {
        display: flex;
        flex-wrap: nowrap;
        padding-bottom: 1rem;
        margin-top: -1px;
        overflow-x: auto;
        text-align: center;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
      }

      .btn-bd-primary {
        --bd-violet-bg: #712cf9;
        --bd-violet-rgb: 112.520718, 44.062154, 249.437846;

        --bs-btn-font-weight: 600;
        --bs-btn-color: var(--bs-white);
        --bs-btn-bg: var(--bd-violet-bg);
        --bs-btn-border-color: var(--bd-violet-bg);
        --bs-btn-hover-color: var(--bs-white);
        --bs-btn-hover-bg: #6528e0;
        --bs-btn-hover-border-color: #6528e0;
        --bs-btn-focus-shadow-rgb: var(--bd-violet-rgb);
        --bs-btn-active-color: var(--bs-btn-hover-color);
        --bs-btn-active-bg: #5a23c8;
        --bs-btn-active-border-color: #5a23c8;
      }

      .bd-mode-toggle {
        z-index: 1500;
      }

      .bd-mode-toggle .dropdown-menu .active .bi {
        display: block !important;
      }
/*** end navbar ***/







/*** start carousel ***/

html,
body {
    height: 100%;
}


.carousel,
.item,
.active {
    height: 100%;
}

.carousel-inner {
  height: 100%;
  background: #000;
}

.carousel-caption{padding-bottom:80px;}

h2{}
p{}

/* Background images are set within the HTML using inline CSS, not here */

.fill {
    width: 100%;
    height: 100%;
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    opacity:0.6;
}




/**
 * Button
 */
.btn-transparent {
  background: transparent;
  color: #fff;
  border: 2px solid #fff;
}
.btn-transparent:hover {
  background-color: #fff;
}

.btn-rounded {
  border-radius: 70px;
}

.btn-large {
  padding: 11px 45px;
  font-size: 18px;
}

/**
 * Change animation duration
 */
.animated {
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
}

@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100px, 0, 0);
    transform: translate3d(100px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100px, 0, 0);
    transform: translate3d(100px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}

.carousel-indicators li{
width:90px !important;
margin:5px !important;
border-radius:0 !important;
}


/*** end carousel ***/




/*** begin vertical tab component ***/



:root {
    --white: #FFF;
  --black
    --gray: #F3F3F3;
    --gray-mid: #9D9D9D;
    --gray-dark: #3e3e3e;
    --gray-hover: #F7F7F7;
    --body-background: grey;
}



.tabs-container {
	padding: 30px 30px 0 30px ;
    width: 100%;
    /*max-width: 480px;*/
   /* min-width: 320px;*/
    display: flex;
	/*margin: 10px;*/
	border-radius: 16px;
    background-color: var(--white);
	box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;	
}



.tab-content-wrapper {
    overflow-y: hidden;
    overflow-x: auto;
    height: 260px;
    transition: all 0.45s ease-in-out;
    padding: 30px 0 0 30px;
    /*padding: 0 16px;*/
}

.tab-content h2 {
    color: var(--gray-dark);
    font-size: 1.2rem;
    font-weight: 600;
    margin-top: 0px;
    margin-bottom: 8px;
}

.tab-content {
    font-size: 0.8rem;
    min-height: 300px;
    min-width: 240px;
    overflow-x: auto;
    transition: all 0.45s ease-in-out;
}

.tabs {
    position: relative;
    display: flex;
    flex-direction: column;
    border-right: 1px solid #F0F0F0;
    list-style-type: none;
    padding-right: 50px;
    gap: 8px;
}

.tabs a {
    position: relative;
    display: flex;
    text-decoration: none;
    width: 100%;
    font-size: 14px;
    font-weight: 600;
    color: var(--black);
    text-align: left;
    border-radius: 8px;
    justify-content: start;
    padding: 12px;
    align-items: center;
    gap: 8px;
    transition: all 0.3s ease-in-out;
}

.tabs a img {
    height: 20px;
    width: 20px;
}

.tabs .active, .tabs a:hover {
    font-weight: 700;
    outline: none;
    color: white;
    background-color: var(--gray-dark);
    max-height: 30px;
}


.tabs a svg {
    stroke: var(--black;
}

.tabs .active svg {
    stroke: var(--black);
}

.tabs a:hover svg {
    stroke: var(--black);
}

.vertical-tab-list{
padding: 10px 0 10px 0;
}


/*** End vertical tab component ***/







