/* ADD YOUR CUSTOM CSS TO THIS FILE BELOW */
/* ADD YOUR CUSTOM CSS TO THIS FILE BELOW */

html, body {
	
  overflow-x: hidden;
   height: 100%;
/*  overscroll-behavior: none;*/
           }

body {
	height: 100%;
	background-color: #233959;
/*	background: linear-gradient(to top, #233959, #3A547F);*/
/*	background-color: #2d466f;*/
	  font-family: "TASA Orbiter", "Helvetica", sans-serif;
	  color: white;
	margin: 0;
     }

h1, h2, h3,h4 {font-family: "Radley", "Times New Roman", serif;}

h1{
text-shadow: 2px 2px 4px rgba(0,0,0,0.4), 4px 4px 8px rgba(0,0,0,0.2);
	    margin-top: -8px;
       }

h1 {font-size: clamp(3rem, 4vw, 4vw);}

@media (max-width: 992px){ .hero h1{line-height: 44px;}}

h2 {font-size: clamp(2rem, 2.5vw, 2.5vw);}

h3 {color: white;}

#shop h3 {color: black;}

.navbar {padding-top: 20px;
         padding-bottom: 20px;
        }


.navbar-dark {--bs-navbar-hover-color: #dbcdb2 !important;}

.dropdown-toggle .nav-link.active, .navbar-nav .nav-link.show {color: #dbcdb2 !important;}



.navbar-dark .dropdown-item {
  --bs-dropdown-link-active-bg: transparent;
  --bs-dropdown-link-active-color: black;
}
.offcanvas .dropdown-item{
  --bs-dropdown-link-active-bg: transparent;
  --bs-dropdown-link-active-color: black;
}


.navbar a,
.navbar button {
  -webkit-tap-highlight-color: transparent;
}

.navbar .nav-link:focus {
  outline: none;
  box-shadow: none;
  background-color: transparent;
}




.navbar-toggler {border-radius: 0;}

.offcanvas .btn-close {filter: invert(1);}

.bg-dark {background-color: #2d466f !important;}

.bg-light {background-color: white !important;}


/*center logo*/
.center-logo {
  height: clamp(7rem, 8.75vw, 8.75vw);
  width: auto;
  transform: translateY(14%);
			 }
.navbar-brand {z-index: 10;}


.offcanvas {background-color: #233959;}


.hero {
  background-image: url("newbackgroundtools.jpg");
  width: 100%;
  height: 46vw;               
  min-height: 500px;       
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
    margin-top: 60px;
}


.hero-btn {font-size: 16px;}

.hero .btn, #collections-preview .btn {padding:4px 8px;}

.hero .btn:hover {box-shadow: 0 5px 10px rgba(0,0,0,0.3);}

.custom-border {
	border: 2px solid white;
	margin: 18px;
			   }

.gradient-bg {
	background: linear-gradient(to top, #233959, #3A547F);}
/*	background: linear-gradient(to top, #233959, #23395900);}*/

#collections-preview {padding-top: 2.2rem;}


#collections-preview .container, #about {
	padding-top: 2.5rem;
	padding-bottom: 2.5rem;
										}

#collections-preview .btn, .hero-btn {
	border-radius: 0;
	border-width: 2px;
                         			 }


.big-icon {font-size: 2.5vw;}

.tab-left-col {padding-right: 1.5vw;}

.tab-right-col {padding-left: 1.5vw;}

.tab-right-btm-img {margin-top: 1vw; }


@media (max-width: 767.98px) {
    .tab-left-col {margin-bottom: 2rem;}
	.tab-right-col {gap: 1.5rem;}
	.tab-left-col, .tab-right-col {
        justify-content: center !important;
        align-items: center !important;
        text-align: center;
    							  }
							 }


/*offset outline*/
.offset-outline {
    position: relative;
    display: inline-block;
                }

.offset-outline img {
    position: relative;
    z-index: 2;
                    }

.offset-outline::after {
    content: "";
    position: absolute;
    top: -14px;
    left: -14px;
    width: 100%;
    height: 100%;
    border: 2px solid white;
    z-index: 1;
                       }

.img-border{border: 6px solid #dbcdb2;
  transition: box-shadow 0.3s ease;}


/*hover and text*/
.img-hover-wrapper {
  position: relative;
  display: inline-block;
  overflow: visible;
  z-index: 3;
				   }

.img-hover-wrapper:hover .img-hover-text {opacity: 1;}

.img-hover-wrapper a {
  display: block;
                     }

.img-border:hover{
	 border: 6px solid #dbcdb2;
	 box-shadow: 0 10px 10px rgba(0,0,0,0.45);
	 content: "";
     z-index: 5; 
                 }

.img-border-no-hover {border: 6px solid #dbcdb2;}

.collections-preview-header {background-color: white;}
.collections-preview-header h2{
	margin-top: 0;
	color: black;
							  }

.bg-secondary{background-color: #233959 !important;}



#about img {
	height: 18rem;
		   }

#about-text {color: black;}


#about-text .container {padding: 0;}


#about-text .scroll-wrapper {
  position: relative;
  max-height: 16rem; 
  overflow-y: auto;  
}

.fade-bottom {
  position: sticky;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 5rem;  
  pointer-events: none;
  background: linear-gradient(
    to bottom,
    rgba(248, 249, 250, 0), 
    white  
  );
  z-index: 1;
}


#about-text h2{margin-top: -6px;}



@media (min-width: 768px) {
  #about-text {padding-right: 4vw;}
						  }

/* stacked layout */
@media (max-width: 767px) {
  #about {text-align: center;}
  .scroll-wrapper {
	margin-left: 1rem;
	margin-right: 1rem;
	              }
  #about-text h2{margin-top: 16px;}
						  }


footer p{
	margin: 0;
	font-size: 12px;
		}



/*collections below*/
.collections-wrapper {
  width: 1000px;
  margin: clamp(4rem, 6vw, 6rem) auto 0;
					 }


@media (max-width: 992px) {
  .collections-wrapper { width: 80%; }
						  }

.tab-nav {
  overflow-x: auto;               
  -webkit-overflow-scrolling: touch;
  scroll-behavior: smooth;
		}

.tab-nav ul.nav {
  display: flex;
  flex-wrap: nowrap;              
  margin-left: 0;
  padding-left: 0;
  justify-content: center;        
  gap: 4vw;                       
			    }

.tab-nav .nav-link {
  flex: 0 0 auto;                 
  white-space: nowrap;             
  color: white;
  font-weight: 500;
				  }

.tab-nav .nav-link.active {
  color: #dbcdb2;
  border-radius: 0;
						  }

.tab-nav .nav-link:hover {
  color: #dbcdb2;
						 }


@media (max-width: 767px) {
  .tab-nav ul.nav {
    justify-content: flex-start;  
	gap: 2vw; 
  				  }
						  }

#collections {
  min-height: 100vh;
  display: block;
 padding-top: clamp(5rem, 5vw, 6rem);
	
	
			 }
#collections img.img-fixed {
  width: 300px;
  height: 300px;
  object-fit: cover;
						   }


.tab-content .collections-wrapper {margin-top: 20px !important;}


.collections-text {
  max-width: 250px;
  word-wrap: break-word;
  text-align: center;  
  margin: 0 auto 1rem;   
}






/*collection-items below*/

#contentTabs {
  position: absolute;
  visibility: hidden;
  height: 0;
  overflow: hidden;
}

#collection-items h2,
#collection-items h4,
#collection-items p {color: black;}
#collection-items h5 {font-size: 18px;}

#collection-items h4, #collection-items h5 {font-family: "TASA Orbiter", "Helvetica", sans-serif;}


#collection-items h2 {
font-size: clamp(1.8rem, 2.4vw, 2.4rem);
text-shadow: none;
					 }

#collection-items{  padding-top: clamp(10rem, 10vw, 12rem);}

.back-btn, .next-btn {margin-top: 8px;}

@media (min-width: 1200px) { 
.item-title {margin-left: -20px !important;}
						   }


.btn {
  font-weight: 600;
  letter-spacing: 0.02em;
     }

.items-nav-btn {padding: 4px 6px;}


.items-nav-btn i {
  text-shadow: 
    0 0 0 currentColor,
    0.5px 0 currentColor,
    -0.5px 0 currentColor;
				 }

.btn-outline-dark { border-radius: 1px;}

.page-back-link{
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  width: fit-content; 
  text-decoration: none;
  color: white;
  border: 1px solid white;
  margin-left: 12px;
  margin-bottom: 12px;
  padding-top: 6px;
  padding-left: 6px;
				}

.page-back-link i {
  position: relative;
  top: -4px;   
  display: inline-flex;    
  align-items: center;
  justify-content: center;
  line-height: 1;           
  padding: 0.15em 0.15em;  
}

.page-back-link i {
  text-shadow: 
    0 0 0 currentColor,
    0.5px 0 currentColor,
    -0.5px 0 currentColor;
				  }

.page-back-link:hover {
  color: #dbcdb2;             
  text-decoration: none;    
  border: 1px solid #dbcdb2;
}


.breadcrumb-css {
	text-decoration: none !important;
    color: black;
			    }
.breadcrumb-css:hover {color: dimgray;}
.breadcrumb .active {color: dimgray;}

@media (min-width: 1400px) { 
	   .right-btn-col {padding-left: 30px;}
                          }
@media (max-width: 992px) { 
	   .right-btn-col {padding-left: 0px;}
                          }

#servingtray .right-btn-col{text-align: right;}

#servingtray .back-btn {width: 3.5vw;}

#servingtray .item-title {width: auto;}


@media (min-width: 1200px) {#servingtray .col-1 {padding-right: 10px;}} 
@media (max-width: 1400px) { 
	#servingtray .item-title {margin-left: 8px!important;}}



@media (max-width: 767px) {.breadcrumb {padding-top: 1rem;}
	.collections-item-img { 
		display: block;
  		margin: 0 auto;}
					     }
@media (max-width: 992px) {.breadcrumb-lg-bp {padding-top: 1rem;}}

.breadcrumb-xxl-bp {padding-top: 1rem;}


#collection-items .accordion {
	--bs-accordion-bg: white;
	--bs-accordion-btn-bg: #dbcdb2;
	--bs-accordion-color: black;
	--bs-accordion-btn-color: black;
    --bs-accordion-active-color: white;
    --bs-accordion-active-bg: black;
		   					  }
#collection-items .accordion-item {
  border: 1px solid black !important;
								  }	

#collection-items .accordion-button:not(.collapsed)::after {
	filter: brightness(100);
    opacity: 1;
														   }

.accordion-item, .accordion-button, .accordion-button:not(.collapsed), .accordion-body { box-shadow: none !important;}
	
#collection-items .accordion-button {
    display: flex;
    justify-content: space-between; 
    align-items: center;            
									}
	
#collection-items .accordion-button::after {display: none;}
	
.custom-chevron {         
    font-weight: bold;          
	text-shadow: 
    0 0 0 currentColor,
    0.5px 0 currentColor,
    -0.5px 0 currentColor;
    color: black;             
    transition: transform 0.3s; 
				}

#collection-items .accordion-button:not(.collapsed) .custom-chevron {
    transform: rotate(180deg);
	color: white;  
}
																					   

.carousel-fade .carousel-item {
  transition-property: opacity;
  transition-duration: .5s; 
							  }










/*shop below*/

#shop .container{
  padding-top: clamp(10rem, 10vw, 12rem);
/*  margin: clamp(4rem, 6vw, 6rem) auto 0;*/
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  min-height: 100vh;
										}


.outer-wrapper {
  padding-left: 80px;
  padding-right: 80px;
			   }


.shop-img {
  height: 100%;
  width: 100%;
  object-fit: cover;         
  object-position: center;
		  }

#shop-fish .shop-img {height: 450px;
width: auto;}

.price {
  font-weight: 600;
  font-size: 20px;
	   }

.shop-row {
  height: 600px;
  padding-bottom: 40px;  
		  }

.bottom-shop-text-row {margin-top: auto;}

#shop-fish .shop-row, #shop-charcuterie .shop-row {height: 450px;}



@media (min-width: 992px){
#shop-fish .img-border-no-hover { border-right: none;}
#shop-charcuterie .img-border-no-hover, #shop-musicstand .img-border-no-hover { border-left: none;}
#shop-fish, #shop-charcuterie {padding-bottom: 40px;}}

@media (max-width: 992px) {
  .shop-row, #shop-fish .shop-row, #shop-charcuterie .shop-row { height: auto; } 
	#shop-fish .shop-img, #shop-charcuterie .shop-img {height: auto;
	width:100%;}
	
						  }

.clickable-title {
  margin: 0;                  
  color: inherit;             
  text-decoration: none;      
  cursor: pointer;           
  transition: color 0.3s ease;
  display: inline-block;      
}

.clickable-title:hover {
  color: black;               
}

 .btn-secondary {   
--bs-btn-color: black;
--bs-btn-bg: #dbcdb2;
--bs-btn-hover-bg: black;
--bs-btn-hover-color: white;
  border-radius: 0;
				}
.shop-text-bg {background-color: white;}




@media(min-width: 992px){
	.border-box {border-top: 6px solid #dbcdb2;
	border-bottom: 6px solid #dbcdb2;
	border-left: 6px solid #dbcdb2;
    display: flex;
    flex-direction: column;
	justify-content: center;
	height: 450px;
	z-index: 4;
	position: relative;	
    margin-left: 0px;
    margin-right: 0px;
	margin-top: 0;
	margin-bottom: 0;
	padding-top: 0;
	padding-bottom: 0;
	}}



@media(min-width: 1400px){
	.border-box {margin-right: -56px;}}
	

.shop-text-wrapper {
  border: 1px solid black;
  background-color: white;
  color: black;
  height: 400px;
  display: flex;
  flex-direction: column;
  margin-left: -65px;
  margin-right: 54px;
  padding: 1rem 1.5rem;}

#shop-fish .shop-text-wrapper {
	height: 300px;
  	margin-left: 54px;
  	margin-right: -54px;
  	z-index: 2;
	position: relative;	
							  }

#shop-fish img {z-index: 1;
	object-position:right;
 	position: relative;}

#shop-fish .col-lg-6{background-color: white;}


#shop-charcuterie .shop-text-wrapper {height: 300px;}


@media (max-width: 992px) {
  .shop-text-wrapper { margin-left: 10px;
	  margin-right: 10px;
	border: 0;
	height: auto;} 
#shop-fish .shop-text-wrapper {  margin-left: inherit;
	margin-right: inherit;
	border: 6px solid #dbcdb2;
	}}

.shop-text-wrapper h3 {font-size: 3rem;}

@media (max-width: 992px) {.shop-text-wrapper h3{font-size: 2.2rem;}}

.shop-text-wrapper h4 {font-family: "TASA Orbiter", "Helvetica", sans-serif;
	color: dimgray;
font-size: 1.4rem;}


.price {
  font-weight: 600;
	   }

.modal-content {border-radius: 0;
 border: 1px solid black;}

.form-select {border-radius: 0;}

#contact-form .dropdown-toggle {
	border: 1px solid black;
	color: dimgray;
							   }

.dropdown-toggle, .dropdown-menu {border-radius: 0 !important;}

.dropdown-menu .dropdown-item {border-radius: 0 !important;}


.form-control { border: 1px solid black;}

.modal-message-wrapper {position: relative;}

.modal-message-box {
  min-height: 180px;
  resize: vertical;
  border: 1px solid black;
  border-radius: 0;
  padding: 1rem;
  padding-bottom: 3.5rem;
				   }

.modal-send-btn {
  position: absolute;
  bottom: 0.75rem;
  right: 0.75rem;
  padding: 0.2rem 0.45rem;
  border: 1px solid black;
  background-color: black;
  color: white;
  cursor: pointer;
  font-size: 0.9rem;
				}


.modal-send-btn:hover {
  background-color: white;
  color: black;
					  }


#contact-form h4 {
	margin-bottom: 2px;
	font-family: "TASA Orbiter", "Helvetica", sans-serif;
	font-size: 1.2rem;
	font-weight: 450;
				 }

#contact-form .dropdown .dropdown-toggle {font-weight: 450!important;}

#shop .modal-header h3, #shop-items .modal-header h3 {
	font-size: 1.5rem!important;
	font-family: "TASA Orbiter", "Helvetica", sans-serif;
													 }
.modal-header {padding: 4px 16px;}

.apostrophe {font-size: .8rem;}

.modal-message-wrapper {position: relative;}

.spinner-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(174,174,174,0.50);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
				  }



#stateDropdown + .dropdown-menu {
  max-height: 350px;
  overflow-y: auto;
								}

#stateDropdown + .dropdown-menu {
  -webkit-overflow-scrolling: touch;
								}




/*shop-items below*/


#shop-items, #shop-items h3 {color: black;}
#shop-items h3 {font-size: clamp(1.4rem, 1.5vw, 1.5vw);
font-family: "TASA Orbiter", "Helvetica", sans-serif;}
#shop-items h4 {font-size: 1.2rem;
font-family: "TASA Orbiter", "Helvetica", sans-serif ;
margin-bottom: 0;}
#shop-items h2 {
	font-size: 2rem;
	margin-bottom: 0;}



#shop-items .breadcrumb {padding-top: 0;}
.breadcrumb {margin-bottom: 0px;}

.shop-items-text-wrapper {
  background-color: white;
  color: black;
  display: flex;
  flex-direction: column;
						 }

@media (min-width:768px) {.shop-items-text-wrapper {min-height: 400px;}
.collections-item-img {
  width: 100%;
  height: 100%;
  min-height: 400px;
  object-fit: cover;
  object-position: center;
  display: block;
	}}
#shop-items .container   {  padding-top: clamp(10rem, 10vw, 12rem);
  padding-left: 1.5rem;
  padding-right: 1.5rem;
	min-height: 100vh;}

.shop-items-text-wrapper p{
	margin-top: 5px;
    margin-bottom: 6px;
						   }

.shop-items-text-bottom {margin-top: auto;}

@media (max-width:768px) {.shop-items-text-bottom {margin-top: 0;}}


.other-items-wrapper {
	background-color: white;
	height: 340px;
					 }

.other-items-wrapper img {
	height: 240px;
	width: 240px;
						 }


@media (max-height:992px){
	.other-items-wrapper img {
		height: 180px;
		width: 180px;
							 }
	.other-items-wrapper {height: 280px;}
						  }





/*classes below*/


#classestop {  padding-top: clamp(10rem, 10vw, 12rem);}



.classes-hero-img {
  height: 600px;
  background-image: url("routingtablehero.jpg");
  background-repeat: no-repeat;
  background-size: cover;          
  background-position: right center; 
				  }

.classes-hero-txt-wrapper ul, .classes-info-wrapper ul  {
	list-style-type: none;
  	margin: 0;
  	padding: 0;
													    }

.classes-hero-txt-wrapper {
	background-color: white;
	color: black;
	height: 450px;
	margin-left: -65px;
	margin-right: 54px;
	padding: 1rem 40px;
						  }


@media (max-width: 1200px) {
  .classes-hero-txt-wrapper { margin-left: -200px; }
						   }

@media (max-width: 992px) {
  .classes-hero-txt-wrapper { margin-left: -260px; }
						  }

.classes-hero-txt-wrapper .scroll-wrapper {
  max-height: 21rem;
  overflow-y: auto; 
}

@media (max-width: 767px) {.classes-hero-txt-wrapper   .scroll-wrapper {
	margin-left: 0;
	margin-right: 0;
	              }}
.classes-hero-txt-wrapper h2 {font-size: 3rem;}

.classes-info-wrapper {
color: black;
background-color: #dbcdb2;
padding: 40px 60px;}


.classes-row {height: 500px;}

.classes-row > [class^="col"] {
  height: 100%;
}


.classes-img {
  height: 100%;
  width: 100%;
  object-fit: cover;       
}

.classes-row .col-md-3,
#kumikocarousel,
#kumikocarousel .carousel-inner,
#kumikocarousel .carousel-item,
#kumikocarousel img, #tigerbandsawbox,
#tigerbandsawbox .carousel-inner,
#tigerbandsawbox .carousel-item,
#tigerbandsawbox img  {height: 100%;}



@media (max-width: 767px) {#kumikocarousel {height: 750px;}}

.classes-img-tiger {object-position: 20% center;}

.classes-img-tigeropen {object-position: right;}

.classes-img-kumiko {object-position: center;}

.classes-img-kumikoopen {object-position: center 35%;}

.classes-text-wrapper {
	background-color: white;
	color: black;
	height: 100%;
	padding: 1rem 40px;
					   }


@media (max-width: 767px) {
  .classes-row { height: auto; }
						  }

@media (max-width: 767px) {.classes-text-wrapper{height: auto;}}



.classes-text-wrapper h3, .tools-text-wrapper h3 {color: black;
font-size: 2rem;
margin-bottom: 4px;}
.classes-text-wrapper h4 {color: dimgray;
font-size: 1rem;
font-family: "TASA Orbiter", "Helvetica", sans-serif;}
.tools-text-wrapper h4 {margin-bottom: 4px;}
.classes-text-wrapper h5 {color: dimgray;
font-size: 1.3rem;}
.classes-text-wrapper h5 i {
  font-size: 0.9em;
}


.tools-link {
  text-decoration: none;
  color: inherit;           
}

.tools-link:hover h5,
.tools-link:hover i {color: black;}

#tools {
  background-image: url("toolshanging.jpg");
  background-size: cover;      
  background-repeat: no-repeat;  
  background-position: bottom;  
  width: 100vw;   
  height: 800px;  
  margin-top: 120px;
	  }



.tools-text-wrapper {margin: -65px 24px 0 24px;
background-color: white;
color: black;
padding: 1rem 40px;}



/*contact below*/
#contact, #collection-items, #shop-items {min-height: 100vh;}

#contact {padding-top: clamp(10rem, 10vw, 12rem);}
#contact {padding-top: 11rem;}


@media (max-width: 991px) {
	#contact {margin: 0;}}

@media (max-width: 991px){#contact{padding-top: 2rem;}}

#contact-form .form-control,
#contact-form input {
  border-radius: 0;
					}

.message-box {
  max-width: 100%;
  min-height: 180px;
  resize: vertical; 
  border: 2px solid black;
			  }

input,
textarea {
  border: 1.5px solid black;
  color: black;
  appearance: none;
  -webkit-appearance: none;
		 }

#contact img {  
	height: 90%;
  	width: 90%;
  	object-fit: cover;  
			 }

#contact h2{
	font-size: 3rem;
	margin: 0;
	color: black;
		   }

#contact p {
	color: black;
	margin-top: -8px;
		   }

.label-wrap {
  background-color: white;
  padding: 0.25rem 0.75rem;
			}

.field-wrap  {
  background-color: #dbcdb2;
  display: inline-block;
  padding: 0.75rem;
  width: 278px;
			}

.input-wrap {
	padding-left: .25rem;
	padding-right: .25rem;
			}


.message-col {height: 300px;}

.message-wrapper {
	background-color: #dbcdb2;
  	padding: 0.75rem;
  	display: inline-block;
				 }

#contact h3{
	font-family: "TASA Orbiter", "Helvetica", sans-serif;
	font-size: 1.5rem;
	display: inline-block;
	color: black;
		  }

.contact-hero-img { min-height: 60vh;
  background-image: url("croppedlightpaintingtools.jpg");
  background-repeat: no-repeat;
  background-size: cover;          
  background-position: left;}

#contact .col-5 {position: relative;}

.contact-hero-img-text {
  	position: absolute;
  	bottom: 500px;
  	left: 36vw;
  	padding-top: 8px;
	padding-bottom: 8px;
 	max-width: 500px;
 	background-color: #dbcdb2;
  	display: inline-block;
						}

.contact-hero-img-text h3 {
	font-size: 2rem !important;
	color: black;
	margin: 0
						  }

@media (max-width: 991px) {
  .contact-hero-img  {
  background-image: url("croppedlightpaintingtools.jpg");
  background-repeat: no-repeat;
  background-size: cover;       
  background-position: center; 
  height: 500px;
  					 }
	.contact-hero-img-text {  
	bottom: 315.75px;
  	left: 55.5vw; 
	padding-top: 6px;
	padding-bottom: 6px;
						   }
						  }


.message-box {
  min-height: 180px;
  resize: vertical;
  border: 1.5px solid black;
  border-radius: 0;
  padding: .5rem;
  padding-bottom: 3.5rem; /* space for button */
}


#contact-form input[type="text"]:focus,
#contact-form input[type="email"]:focus,
#contact-form input[type="text"]:focus-visible,
#contact-form input[type="email"]:focus-visible {
     border-radius: 0 !important; 
    box-shadow: none !important;
    border-color: #86b7fe;
    outline: 0;
												}



.send-btn {
  position: absolute;
  bottom: 0.75rem;
  right: 0.75rem;
  padding: 0.2rem 0.45rem;
  border: 2px solid black;
  background-color: white;
  color: black;
  cursor: pointer;
  font-size: 0.9rem;
  margin-right: .8rem;
  margin-bottom: .8em;
		 }

.send-btn:hover {
  background-color: black;
  color: white;
}

.textarea-wrapper {
  position: relative;
}

.textarea-wrapper .spinner-overlay .spinner-border {
  width: 2.5rem;
  height: 2.5rem;
}



/*img labels for index*/
.img-overlay-container {
  position: relative;
  overflow: hidden;
					   }


.overlay-bar {
  position: absolute;
  bottom: 10%;
  width: 80%;
  height: 70px;
  background: white;
  color: black;
  transition: transform 0.45s ease-out;
  z-index: 5;
			 }

/* LEFT */
.img-overlay-container:not(.slide-right) .overlay-bar {
  left: 0;
  transform: translateX(-100%);
													  }

.img-overlay-container:not(.slide-right):hover .overlay-bar {transform: translateX(0);}

/* RIGHT */
.img-overlay-container.slide-right .overlay-bar {right: 0;transform: translateX(100%);}

.img-overlay-container.slide-right:hover .overlay-bar {transform: translateX(0);}

.overlay-text h5 {font-size: 20px;}

.overlay-text p {
  font-size: 0.9rem;
  color: dimgray;
			    }






/* Wrap for all page content*/
#page-wrapper {
  opacity: 0;              
  transition: opacity 0.5s ease;
  position: relative;
			  }

#page-wrapper.fade-in {
  opacity: 1;
}

#page-wrapper.fade-out {
  opacity: 0;
}

/*.sub-page-wrap {padding-top: 40px;}*/

