@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,200;12..96,300;12..96,400;12..96,500;12..96,600;12..96,700;12..96,800&display=swap');

.trip-code{
    font-family: 'Bricolage Grotesque', sans-serif;
}

.tname-ft{
    font-family: 'Bricolage Grotesque', sans-serif;
    font-weight: 800;
}

.pickgradient {
  display:inline-block;
  background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.65) 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.65)), color-stop(100%,rgba(0,0,0,0))); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); /* IE10+ */
  background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=0 ); /* IE6-9 */
}

.img-trip{
  position:relative;
  z-index:-1;
  display:block;
  height:56.25%;
  width:100%;
}

.summa-ft{
    font-family: 'Bricolage Grotesque', sans-serif;
}

.price-ft{
    font-family: 'Bricolage Grotesque', sans-serif;
}

.bg-new{
    background: rgba( 255, 255, 255, 0.25 );
    backdrop-filter: blur( 4px );
    -webkit-backdrop-filter: blur( 4px );
}

.bg-btm-bar{
    background: rgba( 49, 131, 17, 0.8);
    backdrop-filter: blur( 4.5px );
    -webkit-backdrop-filter: blur( 4.5px );
}

.bg-warn{
    background: rgba( 248, 231, 28, 0.65 );
    backdrop-filter: blur( 8.5px );
    -webkit-backdrop-filter: blur( 8.5px );
}

.bg-modal{
    background: rgba( 255, 255, 255, 0.85 );
    backdrop-filter: blur( 4px );
    -webkit-backdrop-filter: blur( 4px );
}

.bg-fade{
    background: rgba( 0, 0, 0, 0.35 );
    backdrop-filter: blur( 8.5px );
    -webkit-backdrop-filter: blur( 8.5px );
}

.bg-paid{
    background: rgba( 65, 117, 5, 0.2 );
    backdrop-filter: blur( 2px );
    -webkit-backdrop-filter: blur( 2px );
}

@font-face{
    font-family: 'BFT';
    src: url('bft-sans/BFT-Sans-regular.woff2');
    font-weight: 100;
}

@font-face{
    font-family: 'BFT';
    src: url('bft-sans/BFT-Sans-medium.woff2');
    font-weight: 200;
}

@font-face{
    font-family: 'BFT';
    src: url('bft-sans/BFT-Sans-bold.woff2');
    font-weight: 300;
}

@font-face{
    font-family: 'BFT';
    src: url('bft-sans/BFT-Sans-extrabold.woff2');
    font-weight: 400;
}

.book-head{
    font-family: 'Bricolage Grotesque', sans-serif;
}

.price-head{
    font-family: 'Bricolage Grotesque', sans-serif;
}


.trip-head{
    font-family: 'Bricolage Grotesque', sans-serif;
}

.bg-pattern-2{
	background-image: url('https://barefootrekians.com/ktor/web-pattern.svg');
    background-repeat: repeat;
	background-color: #ffffff;
}

.bg-pattern{
	background-image: url('https://barefootrekians.com/ktor/bg-foot-pattern.svg');
    background-repeat: repeat;
	background-color: #ffffff;
}

.s-head{
	font-family: 'Bricolage Grotesque', sans-serif;
}

.ff-pd{
	font-family: 'Bricolage Grotesque', sans-serif;
}

.bft-pass{
	border-radius: 13px;
    box-shadow: inset 0 1px 2px 0 rgb(0 0 0 / 10%);
    background: -webkit-linear-gradient(top,#ececec,#ffffff);
}

.btn-explore{
	background-color: #e6e6e6;
	color: #4a4a4a;
}

.brand-alert-success{
    background-color: #e4ffd9;
	color: #0d2e00;
}

.btn-explore:hover{
	background-color: #e6e6e6;
	color: #000000;
}

.bg-brand{
    background-color: #318311;
    color: #ffffff;
}

.side-bar{
	box-shadow: inset 0 1px 2px 0 rgba(0,0,0,0.1);
	background: -webkit-linear-gradient(top,#ffffff,#ebebeb);
}

.fw-200{
	font-weight: 200;
}

.fw-300{
	font-weight: 300;
}

.fw-400{
	font-weight: 400;
}

.fw-500{
	font-weight: 500;
}

.fw-600{
	font-weight: 600;
}

.fw-700{
	font-weight: 700;
}

.light-green{
    color: #3bd200;
}

.text-brand{
    color: #318311;
}

.fbft{
	font-family: 'SF Pro';
	font-weight: 600;
}

.ff-bft{
	font-family: 'SF Pro';
	font-weight: 600;
	font-size: 12px;
}

.ff-bft2{
	font-family: 'SF Pro';
	font-weight: 600;
	font-size: 14px;
}

html, body{
	height: 100%;
    font-family: 'Bricolage Grotesque', sans-serif;
	letter-spacing: 0.3px;
	font-weight: 600;
	color: #318311;
}

.for-font{
    font-family: 'Bricolage Grotesque', sans-serif;
}

.contact-bg{
	background-image: url('https://barefootrekians.com/ktor/contact-Large.jpeg');
	background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.home-p-bg{
	background-image: url('../../home-slide/home-bg.png');
    background-repeat: no-repeat;
    background-position: center;
}

.img-trans{
	background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.5)), to(rgba(255, 255, 255, 0)));
	background-image: linear-gradient(to bottom, rgb(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
}

.brand-green{
	color: #318311;
}

.bg-home-top{
	background: linear-gradient(180deg, #489e2677 0%, #489e2626 100%);
}

.bg-booking{
	background: linear-gradient(90deg, #489e268c 0%, #489e2644 100%);
}

.bg-booking-2222{
	background: linear-gradient(90deg, #489e268c 0%, #489e2644 100%);
}

.bg-st-div-dark{
	background: rgb(0,139,35);
	background: linear-gradient(180deg, rgba(161, 161, 161, 0.61) 0%, rgba(0, 0, 0, 0) 100%);
}

.bg-st-div{
	background: rgb(0,139,35);
	background: linear-gradient(180deg, rgb(255, 255, 255) 0%, rgba(255,255,255,0) 100%);
}

.bg-st-div-btm{
	background: rgb(0,139,35);
	background: linear-gradient(0deg, rgba(255, 255, 255, 0.725) 0%, rgba(128, 95, 95, 0) 100%);
}


.bg-st-div-bottom-2{
	background: rgb(0,0,0);
	background: linear-gradient(180deg, rgb(0, 0, 0, 75%) 10%, rgba(255, 255, 255, 0) 90%);
}

.bg-st-div-bottom{
	background: rgb(0,139,35);
	background: linear-gradient(0deg, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0.575) 100%);
}

.dark-green{
	color: #006319;
}

.bg-green{
	background-color: #008b23;
}

.trip-nav{
	background-color: #008b23;
}

.top-bar-rounded{
	border-bottom-left-radius: 23px;
	border-bottom-right-radius: 23px;
}

.bottom-bar-rounded{
	border-top-left-radius: 23px;
	border-top-right-radius: 23px;
}

.top-logo-style{
	border-bottom-left-radius: 11px;
	border-bottom-right-radius: 11px;
}

.brand-green-dim{
	color: #b3d1a5;
}

.ff-ws{
	font-family: 'Bricolage Grotesque', sans-serif;
}

.fw-500{
	font-weight: 500;
}

.ff-bs{
	font-family: 'Bricolage Grotesque', sans-serif;
}

.btn-grad {background-image: linear-gradient(to right, #56ab2f 0%, #568a16  51%, #56ab2f  100%)}
.btn-grad {
   margin: 10px;
   padding: 15px 45px;
   text-align: center;
   text-transform: uppercase;
   transition: 0.5s;
   background-size: 200% auto;
   color: white;            
   box-shadow: 0 0 20px #eee;
   border-radius: 10px;
   display: block;
 }

 .btn-grad:hover {
   background-position: right center; /* change the direction of the change here */
   color: #fff;
   text-decoration: none;
 }
 
.bg-white-blur{
     background: rgb(255 255 255 / 72%);
    backdrop-filter: blur( 8.5px );
    -webkit-backdrop-filter: blur( 8.5px );
}


.link-home{
	font-family: 'BFT';
	font-weight: 300;
	color: #2c2c2c;
}

.link-home:hover{
	color: #1f1f1f;
	background-color: rgba(0, 109, 27, 0.1);
	border-radius: 11px;
}

.search-logo{
	color: rgb(0, 109, 27);
}

.link-active{
	font-family: 'BFT';
	font-weight: 300;
	border-radius: 11px;
	background-color: #008b23;
	color: #ffffff;
}

.link-active:hover{
	color: #ffffff;
	background-color: rgb(0, 109, 27)
}

.link-search{
	font-family: 'BFT';
	font-weight: 300;
	border-radius: 11px;
	color: #5f5f5f;
	background-color: #dbdbdb;
}

.link-search:hover{
	color: #3f3f3f;
	background-color: #d3d3d3;
	cursor: text;
}

.hfo{
	font-family: 'Oswald', sans-serif;
}

.btn-tc{
	background: #3ac73f;
	border-color: #3ac73f;
	color: white;
}

.dark-bg{
	background-color: #1a1a1a;
}

.btn-tc:hover{
	background: #318311;
}

.text-green{
	color: #3ac73f;
}

.bg-tc{
	background: #3ac73f;
	background: -webkit-linear-gradient(top left, #55D759, #318311);
	background: -moz-linear-gradient(top left, #55D759, #318311);
	background: linear-gradient(to bottom right, #55D759, #318311);
}

.shadow-hg{
	filter: drop-shadow(0 0 5px #187e1b);
}

#preloader{
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 9999;
	overflow: hidden;

	background: #55D759;
	background: -webkit-linear-gradient(top left, #55D759, #318311);
	background: -moz-linear-gradient(top left, #55D759, #318311);
	background: linear-gradient(to bottom right, #55D759, #318311);

	background-size: 400% 400%;
	animation: gradient 2s ease infinite;
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
}

#preloader:before{
	content: "";
	position: fixed;
	top: calc(50% - 30px);
	left: calc(50% - 30px);
	border: 10px solid #13a118;
	border-top-color: #19771c;
	border-radius: 50%;
	width: 60px;
	height: 60px;
	-webkit-animation: animate-preloader 1s linear infinite;
	animation: animate-preloader 1s linear infinite;
}

.fr{
	font-family: 'Bricolage Grotesque', sans-serif;
}

.b2{
	border-width: 2px;
}

.btn{
	border-width: 2px;
}

.btn-primary-alt{
	background-color: #0d6dfd2b;
}

.bg-green-brand{
	background-color: #517840;
}

.home-top-card{
	width: 260px;
	height: 260px;
}

.btm-link{
	color: #ffffff91;
}

.btm-link:hover{
	color: #ffffff;
}

.hover-grow{
	transition: transform .2s;
	cursor: pointer;
}

.hover-grow:hover{
	transform: scale(1.02);
	transition: transform .2s;
}

p{
	font-weight: 400;
}

.hover-grow-xl{
	transition: transform .2s;
	cursor: pointer;
}

.hover-grow-xl:hover{
	transform: scale(1.05);
	transition: transform .2s;
}

.hover-grow-xxl{
	transition: transform .2s;
	cursor: pointer;
}

.hover-grow-xxl:hover{
	transform: scale(1.08);
	transition: transform .2s;
}

.pro-img-br{
	border-radius: 7px solid rgb(255, 255, 255);
}

.bg-iti{
    background-size:cover;
    background-repeat: no-repeat;
    background-position: top;
}

.bg-center{
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.bg-home{
    background-size: cover;
    background-repeat: no-repeat;
    background-position: bottom;
}

.bg-fcs{
    background-size: cover;
    background-repeat: no-repeat;
    background-position: bottom;
}

.bg-fcs-md{
	background-size: cover;
    background-repeat: no-repeat;
    background-position: right;
}

.fu{
	text-transform: uppercase;
}

.link-brand, .link-secondary:hover{
	color: #517840;
}

.link-brand:hover{
	color: #035a27;
}

.ffh1{
	-webkit-backdrop-filter: blur(3px);
  	backdrop-filter: blur(3px);
	background-color: #ffffff57;
}

.btn-search{
	background-color: rgb(255, 255, 255);
	color: #c0c0c0;
	cursor: text;
	border: 2px solid #d6d6d6;
}

.btn-search:hover{
	color: #bdbdbd;
}

.btn-success{
	background-color: #369e0d;
	border-color: #369e0d;
}

.btn-success:hover{
	background-color: #318311;
	border-color: #318311;
}

.link-success{
	color: #318311;
}

.link-success:hover{
	color: #369e0d;
}


.btn-outline-success:hover{
	background-color: #035a27;
}

.fw-800{
	font-weight: 800;
}

.bg-light-alt{
	background-color: #ffffff79;
}

.shadow-brand{
	filter: drop-shadow(0 0 3px #ffffff);
}

.shadow-brand-dark{
	filter: drop-shadow(0 0 5px #ffffff38);
}

.shadow-brand-dark-3{
	filter: drop-shadow(0 0 5px #00000057);
}

.shadow-brand-dark-2{
	filter: drop-shadow(0 0 5px #d3d3d3);
}

.home-img{
	width: 100%;
	height: 100vh;
	padding-bottom: 50px;
}

.bgc{
	background-color: #FDFAF6;
}

textarea{
	resize: none;
}

.bg-light-dim{
	background-color: #ffffff28;
}

.modal-content{
	border-radius: 26px;
	border: 0;
}

a{
	text-decoration: none;
}

.rounded-13{
	border-radius: 13px;
}

.rounded-23{
	border-radius: 23px;
}

.about-front-cover{
	height: 100vh;
	background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
	background-image: url('../img/about/front.jpg');
}

.sm-btn{
	width: 31px;
	height: 31px;
	border-radius: 100%;
}

.pg-front-cover{
	height: 100vh;
	background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
	background-image: url('../img/home/4.jpg');
}

.bg-dark-dim{
	background-color: #00000071;
}

/*

.carousel { height: calc(100vh);}
.carousel-inner,.carousel-item { height: 100%;}
.carousel-item { background-color: #000;}
.carousel-item img { height: 100%; object-fit: cover; object-position: center;}

*/

.typewriter h1 {
	overflow: hidden; /* Ensures the content is not revealed until the animation */
	border-right: .15em solid orange; /* The typwriter cursor */
	white-space: nowrap; /* Keeps the content on a single line */
	margin: 0 auto; /* Gives that scrolling effect as the typing happens */
	letter-spacing: .15em; /* Adjust as needed */
	animation: 
	typing 3.5s steps(40, end),
	blink-caret .75s step-end infinite;
}
  
.type-div{
  	display: flex;
  	justify-content: center;
}  
  
@keyframes typing {
	from { width: 0 }
	to { width: 100% }
}

@keyframes blink-caret {
	from, to { border-color: transparent }
	50% { border-color: blue; }
}

.button{
	background-color: #318311;
	border: none;
	color: #FFFFFF;
	cursor: pointer;
	display: inline-block;
	text-align: center;
	text-decoration: none;
	-webkit-animation: glowing 1500ms infinite;
	-moz-animation: glowing 1500ms infinite;
	-o-animation: glowing 1500ms infinite;
	animation: glowing 1500ms infinite;
}

.button:hover{
	color: #FFFFFF;
}

@-webkit-keyframes glowing{
	0% { background-color: #318311; -webkit-box-shadow: 0 0 3px #318311; }
	50% { background-color: #369e0d; -webkit-box-shadow: 0 0 40px #369e0d; }
	100% { background-color: #318311; -webkit-box-shadow: 0 0 3px #318311; }
}
  
@-moz-keyframes glowing{
	0% { background-color: #318311; -moz-box-shadow: 0 0 3px #318311; }
	50% { background-color: #369e0d; -moz-box-shadow: 0 0 40px #369e0d; }
	100% { background-color: #318311; -moz-box-shadow: 0 0 3px #318311; }
}
  
@-o-keyframes glowing{
	0% { background-color: #318311; box-shadow: 0 0 3px #318311; }
	50% { background-color: #369e0d; box-shadow: 0 0 40px #369e0d; }
	100% { background-color: #318311; box-shadow: 0 0 3px #318311; }
}
  
@keyframes glowing{
	0% { background-color: #318311; box-shadow: 0 0 3px #318311; }
	50% { background-color: #369e0d; box-shadow: 0 0 40px #369e0d; }
	100% { background-color: #318311; box-shadow: 0 0 3px #318311; }
}

.lds-ripple {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
}
.lds-ripple div {
  position: absolute;
  border: 4px solid #318311;
  opacity: 1;
  border-radius: 50%;
  animation: lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;
}
.lds-ripple div:nth-child(2) {
  animation-delay: -0.5s;
}
@keyframes lds-ripple {
  0% {
    top: 36px;
    left: 36px;
    width: 0;
    height: 0;
    opacity: 0;
  }
  4.9% {
    top: 36px;
    left: 36px;
    width: 0;
    height: 0;
    opacity: 0;
  }
  5% {
    top: 36px;
    left: 36px;
    width: 0;
    height: 0;
    opacity: 1;
  }
  100% {
    top: 0px;
    left: 0px;
    width: 72px;
    height: 72px;
    opacity: 0;
  }
}
