@charset "utf-8";

/* CSS Document */



*{box-sizing:border-box}

body,html,p, div,a,img,header,footer,span{

	margin: 0;

	padding: 0;

	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";

	font-size: 16px;

}

h1 {

	text-shadow: 3px 0px #000000;

}

html {background:#343434;

}

/* ~~ Styling for your site's links must remain in this order - including the group of selectors that create the hover effect. ~~ */

a:link {

	font-family: Arial, Helvetica, sans-serif;

	font-weight: normal;

	font-size: 16px;

	color: #003399;

	text-decoration: none;

}

a:visited {

	font-family: Arial, Helvetica, sans-serif;

	font-weight: normal;

	font-size: 16px;

	color: #003399;

	text-decoration: none;

}

a:hover {

    font-family: Arial, Helvetica, sans-serif;

    font-weight: normal;

    font-size: 16px;

    color: #FFFFFF;

    text-decoration: none;

    background-color: #003C60;

}



/* ~~ Element/tag selectors ~~ */

.topnav {

    overflow: hidden;

    background-color: #003C60;

    min-width: 200PX;

}



.topnav a {

  float: left;

  display: block;

  color: #f2f2f2;

  text-align: center;

  padding: 14px 16px;

  text-decoration: none;

  font-size: 16px;

}



.active {

	background-color: #014366;

	color: white;

}



.topnav .icon {

  display: none;

}



.dropdown {

  float: left;

  overflow: hidden;

}



.dropdown .dropbtn {

    font-size: 16px;

    border: none;

    outline: none;

    color: white;

    padding: 14px 16px;

    background-color: #014366;

    font-family: inherit;

    margin: 0;

}



.dropdown-content {

    display: none;

    position: absolute;

    background-color: #003C60;

    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);

    z-index: 1;

}



.dropdown-content a {

  float: none;

  color: #ffffff;

  padding: 12px 16px;

  text-decoration: none;

  display: block;

  text-align: left;

}



.topnav a:hover, .dropdown:hover .dropbtn {

  background-color: #5c7d9e;

  color: white;
}



.dropdown-content a:hover {

  background-color: #5c7d9e;

  color: #ffffff;

}



.dropdown:hover .dropdown-content {

  display: block;

}



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

  .topnav a:not(:first-child), .dropdown .dropbtn {

    display: none;

  }

  .topnav a.icon {

    float: right;

    display: block;

  }

}



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

  .topnav.responsive {position: relative;}

  .topnav.responsive .icon {

    position: absolute;

    right: 0;

    top: 0;

  }

  .topnav.responsive a {

    float: none;

    display: block;

    text-align: left;

  }

  .topnav.responsive .dropdown {float: none;}

  .topnav.responsive .dropdown-content {position: relative;}

  .topnav.responsive .dropdown .dropbtn {

    display: block;

    width: 100%;

    text-align: left;

  }

}



body{

	background-color: #FEFEFF;

	text-align: center;

}

.responsive {

  max-width: 100%;

  height: auto;

} 

p.header {

	color: #000000;

	-webkit-box-shadow: 0px 0px;

	box-shadow: 0px 0px;

}

main{

  width:94.75%;

  margin: 0 auto;

  overflow: hidden;

}

.center {

  display: block;

  margin-left: auto;

  margin-right: auto;

}

nav {

	min-width: 1400px;

	width: auto;

	text-align: left;

	background-color: #003459

}



html{

	background:#343434;}

header {

    color: #FFFFFF;

    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;

    text-align: center;

    padding-right: 0;

    padding-left: 0;

    font-style: normal;

    font-weight: bold;

    background-image: -webkit-linear-gradient(270deg,rgba(0,51,102,1.00) 0%,rgba(255,255,255,1.00) 95.85%,rgba(254,254,255,1.00) 100%), url(url);

    background-image: -moz-linear-gradient(270deg,rgba(0,51,102,1.00) 0%,rgba(255,255,255,1.00) 95.85%,rgba(254,254,255,1.00) 100%), url(url);

    background-image: -o-linear-gradient(270deg,rgba(0,51,102,1.00) 0%,rgba(255,255,255,1.00) 95.85%,rgba(254,254,255,1.00) 100%), url(url);

    background-image: linear-gradient(180deg,rgba(0,51,102,1.00) 0.00%,rgba(255,255,255,1.00) 95.85%,rgba(254,254,255,1.00) 100%), url(url);

}





footer

{

    color: #FFFFFF;

    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;

    text-align: center;

    padding: 2em 0;

    font-style: normal;

    font-weight: bold;

    background-image: -webkit-linear-gradient(270deg,rgba(0,51,102,1.00) 0%,rgba(255,255,255,1.00) 95.85%,rgba(254,254,255,1.00) 100%), url(url);

    background-image: -moz-linear-gradient(270deg,rgba(0,51,102,1.00) 0%,rgba(255,255,255,1.00) 95.85%,rgba(254,254,255,1.00) 100%), url(url);

    background-image: -o-linear-gradient(270deg,rgba(0,51,102,1.00) 0%,rgba(255,255,255,1.00) 95.85%,rgba(254,254,255,1.00) 100%), url(url);

    background-image: linear-gradient(180deg,rgba(0,51,102,1.00) 0%,rgba(255,255,255,1.00) 95.85%,rgba(254,254,255,1.00) 100%), url(url);

    background-color: undefined;

}





footer{

	clear: both;

	color: #ffffff;

	background-image: -webkit-linear-gradient(270deg,rgba(254,254,255,1.00) 0%,rgba(0,51,102,1.00) 100%);

	background-image: -moz-linear-gradient(270deg,rgba(254,254,255,1.00) 0%,rgba(0,51,102,1.00) 100%);

	background-image: -o-linear-gradient(270deg,rgba(254,254,255,1.00) 0%,rgba(0,51,102,1.00) 100%);

	background-image: linear-gradient(180deg,rgba(254,254,255,1.00) 0%,rgba(0,51,102,1.00) 100%);

	

}

section{

    padding: 10px;

}

.acrosspage{

    display: table;

    width: 100%;

    background-color: #becbd8;

    text-align: left;

    background-image: inherit;

}

    .google-maps {

    position: relative;

    padding-bottom: 75%;

    height: 0;

    overflow: hidden;

    background-color: undefined;

    }

    .google-maps iframe {

        position: absolute;

        top: 0;

        left: 0;

        width: 100% !important;

        height: 100% !important;

}
.responsive-calendar {
    position: relative;
    width: 100%;
    max-width: 800px; /* Adjust max width as needed */
    margin: auto; /* Centers the calendar */
}

.responsive-calendar iframe {
    width: 100%;
    height: 425px; /* Default height */
    border: none;
}

/* Adjust height for different screen sizes */
@media (max-width: 1536px) {
    .responsive-calendar iframe {
        height: 425px;
    }
}

@media (max-width: 768px) {
    .responsive-calendar iframe {
        height: 400px;
    }
}

@media (max-width: 480px) {
    .responsive-calendar iframe {
        height: 350px;
    }
}


h2 {

	text-align: left;

}

nav {

	min-width: 1400px;

	width: auto;

	text-align: center;

}

* {box-sizing:border-box}

/* Slideshow container */
.slideshow-container {
  max-width: 1000px;
  position: relative;
  margin: auto;
}

/* Hide the images by default */
.mySlides {
  display: none;
}

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  margin-top: -22px;
  padding: 16px;
  color: white;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: rgba(0,0,0,0.8);
}

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #717171;
}

/* Fading animation */
.fade {
  animation-name: fade;
  animation-duration: 1.5s;
}

@keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}

.col {

  display: table-cell;

  width: 33.333%;
	
  padding-top: 5px;
	
  padding-right: 5px;
	
  padding-bottom: 5px;
	
  padding-left: 5px;
		
  text-align: left

}


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

  table {

    border: 0;

  }



  table caption {

    font-size: normal;

  }

  

  table thead {

    border: none;

    clip: rect(0 0 0 0);

    height: 1px;

    margin: -1px;

    overflow: hidden;

    padding: 0;

    position: absolute;

    width: 1px;

  }

  

  table tr {

    border-bottom: 3px solid #ddd;

    display: block;

    margin-bottom: .625em;

  }

  

  table td {

    border-bottom: 1px solid #ddd;

    display: block;

    font-size:normal;

    text-align: center;

  }

  

  table td::before {

    /*

    * aria-label has no advantage, it won't be read inside a table

    content: attr(aria-label);

    */

    content: attr(data-label);

    float: left;

    font-weight: bold;

   

  }

  

  table td:last-child {

    border-bottom: 0;

  }

}

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

  .topnav a:not(:first-child), .dropdown .dropbtn {

    display: none;

  }

  .topnav a.icon {

    float: right;

    display: block;

  }

}



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

  .topnav.responsive {position: relative;}

  .topnav.responsive .icon {

    position: absolute;

    right: 0;

    top: 0;

  }

  .topnav.responsive a {

    float: none;

    display: block;

    text-align: left;

  }

  .topnav.responsive .dropdown {float: none;}

  .topnav.responsive .dropdown-content {position: relative;}

  .topnav.responsive .dropdown .dropbtn {

    display: block;

    width: 100%;

    text-align: left;

  }

}







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

  .col { 

    display: block;

    width: 100%;

	      }

}

