html {

}

body {
	background-color:white;
}


     .title {
      font:0.85em Open Sans, arial, sans-serif;
      text-align:center;
      margin-top: 0em;
      margin-bottom: .5em;
      margin-left: 5px;
      margin-right: 5px;
      }

    .hr {
      display: block;
      margin-top: 0em;
      margin-bottom: 0.5em;
      margin-left: 15px;
      margin-right: 15px;
      border-style: solid;
      border-width: 1px;
      border-color: #144e8c;
      }

    .NavButtons {
      background:white;
      font-family:Open Sans, arial, sans-serif;
      font:.95em Open Sans, arial, sans-serif;
      text-align:left;
      padding:10px 10px 10px 10px;
      color:#144e8c;
      margin-bottom: 20px;
      }

    .Headers {
      background:white;
      font-family:Open Sans, arial, sans-serif;
      font:2em Open Sans, arial, sans-serif;
      text-align:center;
      padding:0px 0px 0px 0px
      color:#144e8c;
      margin-bottom: 20px;
      }

    .Subheads {
      background:white;
      font-family:Open Sans, arial, sans-serif;
      Font: .0125em Open Sans, arial, sans-serif;
      text-align:center;
      padding:0px 0px 0px 0px
      color:#144e8c;
      margin-bottom: 20px;
      }

    .MenuItems {
      background:white;
      font-family:Open Sans, arial, sans-serif;
      font:.65em Open Sans, arial, sans-serif;
      text-align:center;
      padding:0px 0px 0px 0px
      color:#144e8c;
      margin-bottom: 10px;
      }

     .Print {
      background:white;
      height:200px;
      position:left:220px;
      }

     .Broadcast {
      background:white;
      width:200px;
      position:left:220px;
      align:top
      }

     .Literature {
      background:white;
      width:200px;
      position:left:220px;
      }

     .Training {
      background:white;
      width:200px;
      position:left:220px;
      }

     .Event {
      background:white;
      height:200px;
      position:left:220px;
      border:1px solid black;
      }

     .Headings {
      font:0.85em Open Sans, arial, sans-serif;
      text-align:left;
      margin-top: 50px;
      margin-bottom: .5em;
      margin-left: 0px;
      margin-right: 50px;
      }

     .Posters {
      background:white;
      height:150px;
      position:left:220px;
      }

     .POP {
      background:white;
      width:200px;
      position:left:220px;
      }

     .Logos {
      background:white;
      width:200px;
      position:left:220px;
      }

      .Video {
      font:0.85em Open Sans, arial, sans-serif;
      text-align:center;
      margin-top: 50px;
      margin-bottom: .5em;
      margin-left: 0px;
      margin-right: 50px;
      background:white;
      width:100%;
      }

     .VideoThumbnail {
      background:white;
      width:200px;
      position:left:220px;
      }


		/*  Slideshow */
			* {
			  box-sizing: border-box;
			}

			/* Position the image container (needed to position the left and right arrows) */
		.container {
	   position: relative;
		 align: center;
	   max-width: 800px;
	   margin: auto;
	}

	.mySlides img {
	  width: 100%;
	  display: flex;
	}

	.prev, .next {
	  cursor: pointer;
	  position: absolute;
	  top: 50%;
	  transform: translateY(-50%);
	  padding: 16px;
	  color: white;
	  font-weight: bold;
	  font-size: 24px;
	  user-select: none;
	  background-color: rgba(0,0,0,0.5);
			}

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

			/* Position the "previous button" to the leftt */
			.prev {
				left: 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);
			}

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

			/* Container for image text */
			/*
			.caption-container {
			  text-align: center;
			  background-color: #222;
			  padding: 2px 16px;
			  color: white;
			}
			*/
			.row {
				display: flex;
			  flex-wrap: wrap;      /* allows wrapping to next line */
			  justify-content: center;
			  gap: 8px;             /* space between thumbnails */
			  margin-top: 15px;
			}

			/* Twelve columns side by side */
			.column {
			  flex: 0 0 auto;
				margin: 4px;
			}

			.column img {
       width: 90px;   /* change size here */
       height: auto;
       opacity: 0.6;
       cursor: pointer;
			 border-radius: 4px;
			 transition: 0.3s;
      }

			.column img:hover,
			.column img.active {
			  opacity: 1;
			}

			/* Add a transparency effect for thumnbail images */
			.demo {
			  opacity: 0.6;
			}

			.active,
			.demo:hover {
			  opacity: 1;
			}
