@charset "utf-8";
/* CSS Document */

/*
Framework by Andy Shearouse
*/
html, body{
	margin:0px !important;
	padding:0px !important;
	font-family:"Poppins", Verdana, Geneva, sans-serif;
}

h1, h2, h3, h4{
    font-family:"Playfair Display", "Poppins", Verdana, Geneva, sans-serif;;
}

img{
	max-width:100% !important;	
}

.container{
	max-width:2800px;
	width:100%;
	margin:0 auto;
	position:relative;
	font-size:18px;
}

.header{
    
}

.top-grid{
    width:94%;
    padding:1% 3%;
}

.button{
    background-color:rgb(56 45 29);
    color:#fff;
    border-radius:50px;
    padding:15px 25px;
    border:1px solid #fff;
    text-decoration:none;
    display:inline-block;
}

.button:hover{
    background-color:#fff;
    color:rgb(56 45 29);
    border:1px solid rgb(56 45 29);
}

/*Use the following for top drop-down nav
Change the background-color in #nav to change the color of the navigation bar
Change the background-color in #nav ul li ul to change the background color of the dropdown menus
These values do also need to be changed further down, in the 600px, 400px, and 300px wide sections 
*/
/* -------------------- Start Navigation -------------------- */
#nav{
	background-color:rgb(97 86 74);
	width: 100%;
	z-index:10;
	position:relative;
	font-size:18px;
	padding:.5% 0;
}

#nav > a{
	display: none;
}

#nav li{
	position: relative;
	list-style-position:inside;
	list-style-type:none;
}
#nav li a{
	color: #fff;
	display: block;
	text-decoration:none;
}

/* first level */

#nav > ul{
	text-align:center;
	padding:0px !important;
	margin:0px !important;
}
#nav > ul > li{
	margin:0px 15px;
	padding:4px 8px;
	height: 100%;
	display:inline-block;
}
#nav > ul > li > a{
	height: 100%;
	text-align: center;
}
#nav > ul > li:not( :last-child ) > a{
	
}

#nav > ul > li:hover > a,
#nav > ul:not( :hover ) > li.active > a{
	
}

	/* second level */

#nav li ul{
	background-color:#ccc;
	display: none;
	position: absolute;
	top: 100%;
	margin-left:0 !important;
	padding-left:0 !important;
	width:170px;
	text-align:left;
	border-bottom-left-radius:10px;
	border-bottom-right-radius:10px;
}
#nav li:hover ul{
	display: block;
	left: 0;
	right: 0;
}
#nav li:not( :first-child ):hover ul{
	left: -1px;
}
#nav li ul a{
	color:#000;
	padding: 0.75em; /* 15 (20) */
}
#nav li ul li a:hover,
#nav li ul:not( :hover ) li.active a
{
}
/* -------------------- End Navigation -------------------- */

.banner{
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-image:url("images/banner-bg.webp");
    box-shadow: inset 0 0 0 1000px rgba(0,0,0,.3);
    color:#fff;
    min-height:960px;
    display:grid;
    align-items:center;
}

.banner-content{
    width:40%;
    margin-left:10%;
    font-size:22px;
}

.banner-content .button{
    font-size:17px;
}

h1{
    font-size:2.2em;
    font-weight:normal;
    font-family: "Playfair Display", "Poppins", Verdana, Geneva, sans-serif;
}

h2{
    font-size:1.7em;
}

.banner-content .disembiggen{
    font-size:20px !important;
    text-transform:uppercase;
    font-family:"Poppins", Verdana, Geneva, sans-serif;
}

main{
}

.four-box h3{
    font-size:36px;
}

.smaller-grid-gap{
    grid-gap:30px;
}

.grid-gap{
    grid-gap:45px;
}

.align-center{
    align-items:center;
}

.vertical-space{
    margin:2% 0;
}

.column-gap{
    column-gap:60px;
}

.pale-background{
    background-color:#fff9f0;
    padding:2%;
}

.gray-background{
    background-color:#6a6256;
    color:#fff;
}

.gray-background .button{
    color:rgb(56 45 29);
    background-color:#fff;
    border:1px solid #6a6256;
}

.gray-background .button:hover{
    background-color:rgb(56 45 29);
    color:#fff;
    border:1px solid #fff;
}

.brown{
    color:rgb(56 45 29);
}

.wide-content{
    width:80%;
    padding:2% 10%;
}

.content{
	width:90%;
	padding:0 5%;
}

.card-grid{
    background-color:#fff9f0;
    width:84%;
    padding:2% 8%;
}

.card-grid .grid-two-columns{
    grid-gap:25px;
}

.card-grid .card{
    border-radius:10px;
    background-color:#382d1d;
    color:#fff;
}

.card-text{
    padding:3% 3% 5% 3%;
}

.vertical-line{
    width:2px;
    height:100%;
    background-color:#ccc;
}

.features-container {
    background-color: #6a5e53; 
    padding: 30px;
    font-family: 'Montserrat', 'Segoe UI', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  }

  /* Each white row is set up as a CSS table */
  .feature-item {
    background-color: #ffffff;
    margin-bottom: 15px;
    display: table;
    width: 100%;
    box-sizing: border-box;
    padding: 25px 30px;
  }

  /* Remove the bottom gap on the very last row */
  .feature-item:last-child {
    margin-bottom: 0;
  }

  /* Table cell for the icon */
  .icon-cell {
    display: table-cell;
    vertical-align: middle;
    width: 45px; /* Fixed width prevents the text from crushing the icon */
  }

  /* Table cell for the text */
  .text-cell {
    display: table-cell;
    vertical-align: middle;
    padding-left: 25px;
    font-size: 19px;
    font-weight: 700; /* Bold text */
    color: #1a1a1a;
  }

  /* Scalable Vector Graphic icon styling */
  .badge-icon {
    width: 45px;
    height: 45px;
    fill: #3e332a; /* Dark brown/black color of the badge */
    display: block;
  }
details{
    margin:2px 10px;
}  
summary{
    background-color:#61564a;
    color:#fff;
    padding:10px 20px;
    font-size:25px;
    font-family:"Playfair Display", "Poppins", Verdana, Geneva, sans-serif;
}

.subpage-banner{
    color:#fff;
    padding:4% 0;
    background-color:#736c60;
}

.subpage-banner h1{
    font-weight:bold;
    font-size:58px;
}

.subpage-banner .disembiggen{
    font-size:34px;
    font-weight:normal;
    display:inline-block;
    padding-top:20px;
}

.brown-background{
    background-color:#382d1d;
    color:#fff;
    padding:25px 50px;
}
.border-grid{
    grid-gap:50px;
}
.border-grid div{
    padding:20px;
    border:1px solid #000;
    border-radius:32px;
}
.grid-two-thirds-one-third{
	display:-ms-grid;
	display:grid;
	-ms-grid-columns:2fr 1fr;
	grid-template-columns:2fr 1fr;
}

.grid-three-fourths-one-fourth{
	display:-ms-grid;
	display:grid;
	-ms-grid-columns:3fr 1fr;
	grid-template-columns:3fr 1fr;
}

.grid-one-fourth-three-fourths{
	display:-ms-grid;
	display:grid;
	-ms-grid-columns:1fr 3fr;
	grid-template-columns:1fr 3fr;
}

.grid-three-fifths-two-fifths{
	display:-ms-grid;
	display:grid;
	-ms-grid-columns:3fr 2fr;
	grid-template-columns:3fr 2fr;
}

.grid-two-fifths-three-fifths{
	display:-ms-grid;
	display:grid;
	-ms-grid-columns:2fr 3fr;
	grid-template-columns:2fr 3fr;
}

.grid-two-columns{
	display:-ms-grid;
	display:grid;
	-ms-grid-columns:1fr 1fr;
	grid-template-columns:1fr 1fr;
}

.grid-three-columns{
	display:-ms-grid;
	display:grid;
	-ms-grid-columns:1fr 1fr 1fr;
	grid-template-columns:1fr 1fr 1fr;	
}

.grid-four-columns{
	display:-ms-grid;
	display:grid;
	-ms-grid-columns:1fr 1fr 1fr 1fr;
	grid-template-columns:1fr 1fr 1fr 1fr;
}

.footer{
	
}

.footer-top{
    position:relative;
}

.footer-top-image{
    position:relative;
    z-index:1;
}

.footer-top-text{
    position:absolute;
    top:0;
    z-index:2;
    color:#fff;
    width:50%;
    text-align:center;
    margin:10% 25% 0 25%;
    font-size:19px;
}

.footer-top-text a{
    color:#fff;
}

.footer .pale-background a{
    color:#000;
}

.no-margin{
	margin:0px !important;
}

.no-padding{
	padding:0px !important;	
}

.no-bold{
	font-weight:normal !important;	
}

.no-border{
	border:none !important;
}

.white-border{
    border:8px solid #fff;
    border-radius:22px;
    -webkit-box-shadow: 0px 4px 8px -2px #000000; 
    box-shadow: 0px 4px 8px -2px #000000;
}

.center{
	text-align:center;	
}

.right{
    text-align:right;
}

.block{
	display:block !important;	
}

@media only screen and (max-width:2000px){
    .footer-top-text{
	    margin:6% 25% 0 25%;
	}
}

@media only screen and (max-width:1600px){
    .footer-top-text{
	    margin:3% 25% 0 25%;
	}
}

@media only screen and (max-width:1350px){
    .footer-top-text{
	    width:90%;
	    margin:1% 5% 0 5%;
	    font-size:18px;
	}
}

@media only screen and (max-width:1000px){
    .footer-top-text{
        position:relative;
        color:#000;
    }
    
    .footer-top-text a{
        color:#000;
    }
}

@media only screen and (max-width:960px){	
	.grid-four-columns{
		-ms-grid-columns:1fr;
		grid-template-columns:1fr 1fr;
	}
	
	.footer-top-text{

	}
}

@media only screen and (max-width:720px){
	/* -------------------- Start Navigation -------------------- */
	#nav{
        position: relative;
    }
    #nav img{
        vertical-align:middle;
    }
	#nav > a{
	}
	
	#nav:not( :target ) > a:first-of-type,
	#nav:target > a:last-of-type{
		display: block;
		width:100%;
		text-align:center;
		color:#000;
		font-size:20px;
		padding:5px 0px;
		text-decoration:none;
	}
	
	#nav a{
		font-size:18px;	
	}
 
    /* first level */
 
    #nav > ul{
        height: auto;
        display: none;
        position: absolute;
        left: 0;
        right: 0;
		background-color:#ccc;
		margin-top:8px !important;
		padding-bottom:10px;
    }
	#nav:target > ul{
		display: block;
	}
	#nav > ul > li{
		width: 100%;
		float: none;
		margin:0px !important;
		padding:4px 0px;
	}

    /* second level */
 
    #nav li ul{
        position: static;
		width:98%;
		margin:0 !important;
		text-align:center;
		padding:0 !important;
    }
	#nav li ul a{
		padding:0.5em 0;
		margin:0.25em 0;
	}
	/*End Navigation*/
	
	.grid-two-thirds-one-third{
		-ms-grid-columns:1fr;
		grid-template-columns:1fr;
	}
	
	.grid-one-fourth-three-fourths{
		-ms-grid-columns:1fr;
		grid-template-columns:1fr;
	}
	
	.grid-two-fifths-three-fifths{
		-ms-grid-columns:1fr;
		grid-template-columns:1fr;
	}
	
	.grid-three-fifths-two-fifths{
    	-ms-grid-columns:1fr;
		grid-template-columns:1fr;
    }
	
	.grid-two-columns{
		-ms-grid-columns:1fr;
		grid-template-columns:1fr;
	}
	
	.grid-three-columns{
		-ms-grid-columns:1fr;
		grid-template-columns:1fr;
	}
	
	.grid-four-columns{
		-ms-grid-columns:1fr;
		grid-template-columns:1fr;
	}
	
	.grid-three-fourths-one-fourth{
	    -ms-grid-columns:1fr;
		grid-template-columns:1fr;
	}
	
	.footer{
		text-align:center;
	}
	
	.hide-mobile{
	    display:none;
	}
	
}

@media only screen and (max-width:600px){
	
}

@media only screen and (max-width:480px){
	
}