to 80px */
@media screen and (min-width: 601px) {
th.font-size {
font-size: 35px;
}
td.font-size {
font-size: 20px;
}
h1.font-size {
font-size: 40px;
}
h2.font-size {
font-size: 30px;
}
h3.font-size {
font-size: 30px;
}
p.font-size {
font-size: 20px;
}
li.font-size {
font-size: 20px;
}
footer.font-size {
font-size: 17px;
}
}
/* If the screen size is 600px wide or less, set the font-size of
to 30px */
@media screen and (max-width: 600px) {
th.font-size {
font-size: 20px;
}
td.font-size {
font-size: 15px;
}
h1.font-size {
font-size: 30px;
}
h2.font-size {
font-size: 20px;
}
h3.font-size {
font-size: 20px;
}
p.font-size {
font-size: 14px;
}
li.font-size {
font-size: 14px;
}
footer.font-size {
font-size: 14px;
}
}
/* Standard div element */
#standarddiv {
background-color: #ffffff;
overflow-y: auto;
margin: 0 auto;
border: 3px solid black;
border-radius: 10px;
height: auto;
width: 100%;
max-width: 1200px;
box-shadow: 0px 0px 10px #190C26;
font-family: Arial;
font-size: 1vw;
padding: 20px 10px 20px 10px;
}
/* ul div element */
#uldiv {
margin: 0px auto;
height: auto;
width: 100%;
max-width: 1200px;
font-family: Arial;
}
/* Spacer */
#spacer {
margin: 10px auto;
}
/* Transformicon */
.container {
display: inline-block;
cursor: pointer;
position: relative;
}
.bar1, .bar2, .bar3 {
width: 35px;
height: 5px;
background-color: #333;
margin: 6px 0;
transition: 0.8s;
}
.change .bar1 {
-ms-transform: rotate(-45deg) translate(-9px, 6px);
-webkit-transform: rotate(-45deg) translate(-9px, 6px);
transform: rotate(-45deg) translate(-9px, 6px);
background-color: #ffffff;
z-index: 1001;
}
.change .bar2 {opacity: 0;}
.change .bar3 {
-ms-transform: rotate(-45deg) translate(-9px, 6px);
-webkit-transform: rotate(45deg) translate(-8px, -8px);
transform: rotate(45deg) translate(-8px, -8px);
background-color: #ffffff;
z-index: 1001;
}
/* Slider Menu */
.slider-menu {
background: #000000;
position: fixed;
}
.slider-menu h1 {
color: #FFFFFF;
font-size: 30px;
padding: 20px;
margin: 0;
font-weight: bold;
background: #000000;
font-family: arial;
}
.slider-menu a {
display: block;
padding-top: 15px;
padding-bottom: 15px;
text-decoration: none;
}
.slider-menu ul ul li a {
display: block;
padding-top: 5px;
padding-bottom: 5px;
text-decoration: none;
}
.slider-menu a:hover, .dropdown-button:hover {
background: #4CAF50;
transition: 0.3s;
}
.slider-menu a:active {
background: #4CAF50;
}
.slider-menu-vertical {
width: 250px;
height: 100%;
top: 0;
z-index: 1000;
transition: 0.8s;
box-shadow: 0px 0px 10px #190C26;
overflow-y: auto;
}
.slider-menu-left {
left: -260px;
}
.slider-menu-left.slider-menu-open {
left: 0px;
}
/* Arrow Icon Style */
/* Still a work in progress. */
#arrow {
position: absolute;
left: 25px;
width: 20px;
height: 20px;
opacity: 0;
}
/* Submenus */
nav ul {
margin: 0 auto;
list-style: none;
padding: 0;
}
nav ul li {
font-size: 20px;
}
nav ul li a {
font-family: arial;
color: #FFFFFF;
}
nav ul li a:hover {
background: #4CAF50;
transition: 0.3s;
}
nav ul ul li a {
text-align: left;
padding-left: 55px;
font-size: 10px;
font-family: arial;
color: #FFFFFF;
}
nav ul ul li a:hover {
font-size: 18px;
background: #4CAF50;
transition: 0.3s;
}
nav ul ul li a:hover + #arrow, #arrow:hover {
transition: 0.2s;
opacity: 1;
}
/* In Page Navigation Buttons */
.navbtn {
-moz-box-shadow: 0px 10px 14px -7px #3dc21b;
-webkit-box-shadow: 0px 10px 14px -7px #3dc21b;
box-shadow: 0px 10px 14px -7px #3dc21b;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #44c767), color-stop(1, #5cbf2a));
background: -moz-linear-gradient(top, #44c767 5%, #5cbf2a 100%);
background: -webkit-linear-gradient(top, #44c767 5%, #5cbf2a 100%);
background: -o-linear-gradient(top, #44c767 5%, #5cbf2a 100%);
background: -ms-linear-gradient(top, #44c767 5%, #5cbf2a 100%);
background: linear-gradient(to bottom, #44c767 5%, #5cbf2a 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#44c767', endColorstr='#5cbf2a',GradientType=0);
background-color: #44c767;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
border-radius: 8px;
display: inline-block;
cursor: pointer;
color: #ffffff;
font-family: Arial;
font-size: 13px;
font-weight: bold;
padding: 13px 32px;
text-decoration: none;
text-shadow: 0px 1px 0px #2f6627;
width: 120px;
height: 50px;
margin: 10px;
vertical-align: middle;
line-height: 50px;
}
.navbtn:hover {
background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #5cbf2a), color-stop(1, #44c767));
background: -moz-linear-gradient(top, #5cbf2a 5%, #44c767 100%);
background: -webkit-linear-gradient(top, #5cbf2a 5%, #44c767 100%);
background: -o-linear-gradient(top, #5cbf2a 5%, #44c767 100%);
background: -ms-linear-gradient(top, #5cbf2a 5%, #44c767 100%);
background: linear-gradient(to bottom, #5cbf2a 5%, #44c767 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5cbf2a', endColorstr='#44c767',GradientType=0);
background-color: #5cbf2a;
}
.navbtn:active {
position: relative;
top: 1px;
}
/* Google Maps Widget */
#map {
margin-top: 20px;
margin: 0px auto;
background-color: white;
max-width: 1186px;
width: 100%;
max-height: 340px;
height: 100%;
border: 3px solid #000;
box-shadow: 0px 0px 10px #190C26;
border-radius: 10px;
padding: 7px;
}
/* Website Footer Style */
#footer {
width: 100%;
height: auto;
margin: 20px auto;
bottom: 0%;
border-top: 3px solid #000;
border-right: 3px solid #000;
border-left: 3px solid #000;
border-radius: 10px;
background: #000000;
box-shadow: 0px 0px 10px #190C26;
}
#footertext {
font-weight: bold;
font-family: Arial;
color: white;
text-align: center;
margin: 0px auto;
line-height: 97px;
}