@charset "utf-8";
/* CSS Document */

html{
	scroll-behavior: smooth;
}

body{
	margin:0;
	padding:0;
	background-image: url("Backgrounds/Main_Bkgrnd2.jpg");
	background-position:top, left;
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-size: cover;	 
}

.phone{
	position:absolute;
	top:6px;
	right:1%;
	width:8%; 
	z-index: 9999;
}

.phone h2{
	font-family: 'Noto Serif', serif;
	font-size: 1.3em;
	color:#222222;
	text-shadow: none;
}


.logo{
	position:absolute;
	top:5px;
	left:2%;
	width:8%;
	z-index: 999;
}

.header{
	position:relative;
	margin:0 auto;
	width:100%;
	height:110px;
	background-color: #FFFFFF;
	z-index: 998;
	box-shadow: 1px 1px 2px #222222;
}

nav{
	position:absolute;
	top:45px;
	left:32%;
	width:40%;
	border:none;
}

.menu{display: flex; text-align:center;}

.menu a{
	font-family: 'Open Sans', sans-serif;
	font-size: 1.2em;
	color:#222222;
	flex-grow: 1;
	text-decoration:none;
	border: .25px solid black;
	margin: 0 5px 0 5px;
	transition: all .4s ease-in-out;
}

.menu a:hover{
	background:#222222;
	color:#FFFFFF;
}

.background{
	position:relative;
	margin:0 auto;
	width:100%;
}

.tagline{
	position:absolute;
	top:150px;
	left:18%;
	width:45%;
}

.tagline h2{
	font-family: 'Noto Serif', serif;
	font-size: 2.5em;
	color:#FFFFFF;
	text-shadow: 2px 2px 3px #000000;
}

.tagbtn{
	position:absolute;
	top:255px;
	left:28%;
	width:15%;
	padding:10px;
	background-color:red;
	border:.25px solid red;
	text-align:center;
	font-family: 'Open Sans', sans-serif;
	font-weight: 800;
	color:#FFFFFF;
	transition: all .4s ease-in-out;
}

.tagbtn:hover{
	background:#FFFFFF;
	color:#222222;
}

.content{
	position:relative;
	margin:25px auto;
	width:80%;
	text-align:center;
	padding-bottom:100px;
}

.content h1{
	font-family: 'Noto Serif', serif;
	font-size: 2.7em;
	color:#222222;
	text-shadow: none;
}

.content h2{
	font-family: 'Noto Serif', serif;
	font-size: 2.2em;
	color:#222222;
	text-shadow: none;
}


.content p{
	font-family: 'Open Sans', sans-serif;
	font-size: 1.1em;
}

.contentflex{
	position:relative;
	margin:75px auto;
	width:90%;
	display: flex;
	justify-content: space-between;
	gap:40px;
	align-items: center;
}

.contentflex img{border-radius:50%;}

.box{flex-basis: 50%;}


.footer{
	 
	width:100%;
	height:150px;
	background-color: #5e4c02;
	text-align: center;
}

.footertext{
	position:relative;
	margin:40px auto;
	width:90%;
}

.footertext a:link{color:#999999; text-decoration:none;}
.footertext a:visited{color:#999999; text-decoration:none;}

.footertext h4{
	font-family: 'Noto Serif', serif;
	font-size: 1.2em;
	color:#FFFFFF;
	text-shadow: none;
}


.footertext p{
	font-family: 'Open Sans', sans-serif;
	font-size: 1em;
	color: #FFFFFF;
}

#sidebar{display: none;}
.mobbkgrnd{display: none;}

@media screen and (max-width:1680px){
	
.phone{	 
	top:6px;
	right:1%;
	width:8%; 
}

.phone h2{font-size: 1.1em;}


.logo{	 
	top:5px;
	left:2%;
	width:9%;	 
}
	
.tagline{ 
	top:150px;
	left:16%;
	width:45%;
}


.tagbtn{ 
	top:255px;
	left:28%;
	width:15%;
	padding:10px;
	background-color:red;
	border:.25px solid red; 
}
	
	
}

@media screen and (max-width:1600px){
	
.logo{	 
	top:5px;
	left:2%;
	width:10%;	 
}
	
.tagbtn{ 
	top:255px;
	left:29%;
	width:15%;
	padding:10px;
	background-color:red;
	border:.25px solid red; 
}

	
}


@media screen and (max-width:1440px){
.logo{	 
	top:5px;
	left:2%;
	width:10.5%;	 
}
	
.phone{	 
	top:6px;
	right:1%;
	width:9%; 
}

.phone h2{font-size: 1.1em;}

.tagline{ 
	top:105px;
	left:14%;
	width:45%;
}
	
.tagline h2{font-size: 2.2em;}


.tagbtn{ 
	top:205px;
	left:27%;
	width:15%;
	padding:10px;
	background-color:red;
	border:.25px solid red; 
}
	
.content h2{font-size: 1.8em;}
.content p{font-size: 1em;}
	
	
}

@media screen and (max-width:1366px){
.logo{	 
	top:5px;
	left:2%;
	width:11%;	 
}
	
	
.tagline{ 
	top:85px;
	left:13%;
	width:45%;
}
	
.tagline h2{font-size: 2.2em;}


.tagbtn{ 
	top:185px;
	left:27%;
	width:15%;
	padding:10px;
	background-color:red;
	border:.25px solid red; 
}
	
.footertext h4{font-size:  1.1em;}
	
	
	
}

@media screen and (max-width:1280px){
.logo{	 
	top:5px;
	left:2%;
	width:11.5%;	 
}
	
.phone h2{font-size: 1em;}
	
	
.tagline{ 
	top:85px;
	left:13%;
	width:45%;
}
	
.tagline h2{font-size: 2em;}


.tagbtn{ 
	top:175px;
	left:27%;
	width:15%;
	padding:10px;
	background-color:red;
	border:.25px solid red; 
}
	
.content h1{font-size: 2.4em;}
.content h2{font-size: 1.4em;}
.content p{font-size: .95em;}
	
.footertext h4{font-size:  1.1em;}
	
	
	
}


@media screen and (max-width:1024px){
.logo{	 
	top:5px;
	left:2%;
	width:15%;	 
}
	
	.phone{width:12%;}
	
.phone h2{font-size: 1em;}
	
	
.tagline{ 
	top:85px;
	left:13%;
	width:50%;
}
	
.tagline h2{font-size: 1.8em;}


.tagbtn{ 
	top:175px;
	left:30%;
	width:15%;
	padding:10px;
	background-color:red;
	border:.25px solid red; 
}
	
	.contentflex{
		flex-direction: column;
		width:90%;
	}
	
.content h1{font-size: 2.4em;}
.content h2{font-size: 1.4em;}
.content p{font-size: .95em;}
	
.footertext h4{font-size:  .9em;}
	
	
	
}

@media screen and (max-width:960px){
	
.background{display: none;}	
.mobbkgrnd{
	position:relative;
	margin:0 auto;
	background-image: url("Backgrounds/Hm_Mob.jpg");
	background-position: top,left;
	background-attachment: scroll;
	background-repeat: no-repeat;
	background-size:cover;
	display: flex;
}
	
.mobtag{
	position:relative;
	margin:50px, 1%;
	width:50%;
}
	
.mobtag h2{
	font-family: 'Noto Serif', serif;
	font-size: 1.1em;
	color: #FFFFFF;
	text-shadow: 1px 1px 2px #000000;
}
	
.mobbtn{
	position:relative;
	margin:100px 5%;
	font-family: 'Open Sans', sans-serif;
	color:#FFFFFF;
	padding:8px;
	background:red;
	text-decoration:none;
    text-align: center;
}
	
	
	
#sidebar{
	background:rgba(20,31,239,1.00);
	width:200px;
	height:60%;
	display:block;
	position:fixed;
	right:-200px;
	top:0;	
	transition: right 0.3s linear;
	z-index: 99999;
	opacity:.90;
}
			
#sidebar.visible{
		right:0px;
		transition: right 0.3s linear;
	}
			
#sidebar-btn{
	display:inline-block;
		vertical-align:center;
		width:40px;
		height:15px;
		cursor:pointer;
		margin:35px;
		position:absolute;
		top:20px;
		right:205px;
		text-shadow: 1px 1px 1px #333333;
		background:transparent;
		z-index: 9999999999;
}
			
#sidebar-btn span{
	background:rgba(20,31,239,1.00);
	height:3px;
	background:;
	margin-bottom:5px;
	display: block;
}
			
#sidebar-btn span:nth-child(2){width:75%;}
#sidebar-btn span:nth-child(3){width:60%;}
		
ul{
	margin:0;
    padding:0;				
}
			
ul li{list-style:none; padding-top:10px;}

ul li a{
   font-family: 'Open Sans', sans-serif;
   font-size:1em;
   color:#FFFFFF;
   border-bottom:.25px solid #FFFFFF;
   display:block;
   width:152px;
   padding:15px 0 15px 10px;
   text-decoration:none;				
}
	
	
	
	
}






















