@font-face {
    font-family: 'Unbounded-Regular';
    src: url('../fonts/Unbounded-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'Unbounded-ExtraBold';
    src: url('../fonts/Unbounded-ExtraBold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'Unbounded-Bold';
    src: url('../fonts/Unbounded-Bold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}

html, body {
    font-family: 'Unbounded-Regular', sans-serif;	

}

.inner {
	max-width: 1512px;
	margin: 0 auto	
}

html, body {
		background-image: url(../img/botani_bg.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}

.bold {
    font-family: 'Unbounded-Bold';	
}

.extrabold {
    font-family: 'Unbounded-ExtraBold';	
}


.bg-primary {
	background: rgba(203, 82, 28, 1)!important
}

.bg-secondary {
	background: rgba(0, 80, 32, 1)!important
}

.text-primary {
	color: rgba(203, 82, 28, 1)!important
}

.text-secondary {
	color: rgba(0, 80, 32, 1)!important
}

.border-primary {
	border-color: rgba(203, 82, 28, 1)!important
}

.border-secondary {
	border-color: rgba(0, 80, 32, 1)!important
}

#chat-wrapper {
	background-image: url(../img/bottom.png);
	background-repeat: no-repeat;
	background-position: top center;
	background-size: cover;
	/* min-height: 85vh; */
}

@media (min-width:1200px) {
	html, body {
		font-size: 1.35rem
	}
	
	.h1, h1 {
		font-size: 3rem
	}
	
	.small {
		font-size: 1rem
	}
	
	.btn {
		width: fit-content;
		min-height: 70px;
		display: flex;
		align-items: center;
		justify-content: center
	}
	
	.btn {
		min-width: 320px
	}
	
	.btn-lg {
		min-width: 420px
	}
	
	#chat-wrapper {
	background-image: url(../img/bottom.png);
	background-repeat: no-repeat;
	background-position: center right;
	background-size: cover;
	height: 1600px;
}

}



.header-block {
	width: 100%;
	display: grid;
grid-template-columns: repeat(4, 25%);
grid-template-rows: repeat(5, 20%);
}

.header-img {
grid-column: 1 / 5;
grid-row: 1 / 4;
}

.header-text {
grid-column: 1 / 3;
grid-row: 2 / 6;
display: flex;
align-items: flex-end;
}

.header-btn {
grid-column: 2 / 5;
grid-row: 5 / 6;
display: flex;
align-items: flex-end;
justify-content: flex-end;
padding-top: 2rem
}

@media (min-width:1430px) {
	.container {
		max-width: 1426px
	}
}

@media (max-width: 1023px) {
.h1, h1 {
font-size: calc(1.375rem + .9vw);
}	
}

@media (max-width: 768px) {
	.header-block {
	width: 100%;
	display: grid;
grid-template-columns: repeat(1, 50%);
grid-template-rows: repeat(5, 20%);
}

.header-img {
grid-column: 1 / 3;
grid-row: 1 / 4;
}

.header-text {
grid-column: 1 / 2;
grid-row: 2 / 5;
display: flex;
align-items: flex-end;
}

.header-btn {
grid-column: 1 / 3;
grid-row: 5 / 6;
display: flex;
align-items: center;
justify-content: center;
padding-top: 2rem
}

.btn1 {
	font-size: .8rem;
}	

.h1, h1 {
font-size: calc(1.375rem + .5vw);
}
}


#chat::-webkit-scrollbar {
  display: none;
}


#chat {
  -ms-overflow-style: none;  
  scrollbar-width: none; 
}

small {
	font-size: .7rem;
	line-height: 1.2
}


input {
  color: #005020;
}

input::placeholder {
  color: #005020;
}

input:placeholder-shown {
  color:  #005020;
}

.btn-outline-light:hover {
	color: rgba(203, 82, 28, 1)!important
}

.btn-form {
	width: 48px; min-width: 48px;  
}

@media (max-width:768px) {
	.form-control {
		font-size: .8rem
	}
	
	.btn-form {
	width: 32px; min-width: 32px;  
}
}

.smaller {
	font-size: .6rem
}

.btn {
	border-width: 1.5px
}