my_header {
	font-size: 18pt;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	/* background-color: red;  */
	color: white;
	text-align: left;
}


my_footer {
	font-size: 18pt;
	position: fixed;
	left: 0;
	bottom: 0;
	width: 100%;
	/* background-color: red;  */
	color: white;
	text-align: left;
}


my_middle {
    position:absolute;
    top: 50px;
    left:0px;
    right:0px;
    bottom:60px;
    overflow-y:auto;  
}



/* Style the buttons that are used to open and close the accordion panel */
accordion {
  /* background-color: #eee; */
  color: #FFF;
  cursor: pointer;
  /* padding: 18px; */
  width: 100%;
  text-align: left;
  border: none;
  outline: none;
  transition: 0.4s;
}

/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.active, .accordion:hover {
  /* background-color: #F00; */
}

/* Style the accordion panel. Note: hidden by default */
.panel {
  display: none;
  overflow: hidden;

}


        ul, #myUL
        {
            list-style-type: none;
        }
         
        #myUL
        {
            margin: 0;
            padding: 0;
        }
         
        .box
        {
            cursor: pointer;
			font-size: 18pt;
            -webkit-user-select: none; /* Safari 3.1+ */
            -moz-user-select: none; /* Firefox 2+ */
            -ms-user-select: none; /* IE 10+ */
            user-select: none;
        }
         
        .box::before
        {
            color: #FFFFFF;
            content: '\25B8';
            /* content: '\25B8'; right pointing carat */

            display: inline-block;
            margin-right: 6px;
        }
         
        .check-box::before
        {
            content: '\25BE';
            
            /* content: '\25BE'; down pointing carat */

            color: #FFFFFF;

			margin-right: 5px;
        }
         
        .nested
        {
            display: none;
        }
         
        .active
        {
            display: block;
        }

hr.rounded {
  border-top: 8px solid #bbb;
  border-radius: 5px;
}

gallaryset {
	font-size: 35pt;
	color: #F0F;
	text-decoration: none;
    text-transform: none;
	font-weight: none;
	text-shadow:
    	-1px -1px 0 #000,
		1px 1px 0 #000, 
    	-1px 1px 0 #000,
		1px -1px 0 #000, 
  	-1px 0px 0 #000,
		1px 0px 0 #000, 
    	0px 1px 0 #000,
		0px -1px 0 #000;  

}

img.badge:hover {
	-webkit-filter: drop-shadow(1px 1px 1px #000) brightness(1.2);
	filter: drop-shadow(1px 1px 1px #000) brightness(1.2);

}

img.badge {
   -webkit-filter:  drop-shadow(1px 1px 1px #000);
	filter:         drop-shadow(1px 1px 1px #000); 
}


subgallery {
	font-size: 12pt;
	line-height: 100%;
	color: #00F;
	text-decoration: none;
	font-weight: none;
}


gallery {
	font-size: 12pt;
	line-height: 100%;
	color: #00F;


   	text-shadow:
    	-1px -1px 0 #000,
		1px 1px 0 #000, 
    	-1px 1px 0 #000,
		1px -1px 0 #000;  
	font-weight: none;
}


gallery_new {
	font-size: 14pt;
	line-height: 150%;
	color: #DDDDDD;
	background:none;
	border:0;
	text-decoration:none;
	font-family: "Gill Sans", sans-serif;
	font-weight: none;
	transition: color 0.5s;

   	/* text-shadow:    	-1px 1px 0 #000,		1px -1px 0 #000;  */
}

:a {
	text-decoration: none;
	color: #DDDDDD;
}

:link {
	text-decoration: none;
	color: #DDDDDD;
}

:visited {
	text-decoration: none;
 	color: #DDDDDD;
}

:hover {
	text-decoration: none;
	color: #FFFF00;
}

:active {
	text-decoration: none;
}


gallerydate {
	font-size: 8pt;
	color: #ccc;
	text-shadow: 1px 1px 2px #000000;
	text-decoration: none;
    font-style: italic;
    font-weight: none;
}

mainheader {
	font-size: 24pt;
	line-height: 80%;
	color: #FFF;
	text-decoration: none;
    font-style: none;
	font-weight: none;
}

hiddentext { 
	display: none;
}



body {
	background-image:url(/misc/cape_florida.jpg);
	background-size: cover;
    background-attachment: fixed;
	font-family: "Gill Sans", sans-serif;
	/*background-color: #8DC7BB;*/
	color: #FFF;
	font-size: 14pt;
}

.class1 a:link {
	color: #CCC;
	text-decoration: none;
}
.class1 a:visited {
	text-decoration: none;
	color: #CCC;
}
.class1 a:hover {
	/*text-decoration: underline;*/
	/*background-color: rgba(32,32,128,.75); */
	color: #FFF;
}
.class1 a:active {
	text-decoration: none;
}

.class2 a:link {
	color: #ccc;
	text-decoration: none;
}
.class2 a:visited {
	text-decoration: none;
	color: #ccc;
}
.class2 a:hover {
	/*text-decoration: underline;*/
	/*background-color: rgba(32,32,128,.75); */
	color: #FFF;
}
.class2 a:active {
	text-decoration: none;
}


div.ex
{
width:400px;
padding:0px;
border:1px dotted #444444;
/* background-color: rgba(255,255,255,.4); */
/* background-color: rgba(0,0,0,.1); <--use for darker background */
margin:0px;
}

	#hyperlink-style-button-main{
	    background:none;
		border:0;
		text-decoration:none;
		color: #DDDDDD;
		font-size: 18pt;
		font-family: "Gill Sans", sans-serif;
		font-weight: none;
		transition: color 0.5s;

    }

    #hyperlink-style-button-main:hover{
		background:none;
		background-color: none;
		/* text-decoration-line: underline; */
		/* text-decoration-style: wavy; */
		border:0;
		/* text-decoration:none; */
		color: #FFFF00;
		font-size: 18pt; /*increasing this makes it swell*/
		font-family: "Gill Sans", sans-serif;
		font-weight: none;
		/* text-shadow: 1px 1px 0 #FF8000; */
		/* cursor:pointer; */
		cursor:hand;
    }

	#badgebutton{
		-webkit-filter:  drop-shadow(1px 1px 1px #000);
		filter:         drop-shadow(1px 1px 1px #000); 

    }

    #badgebutton:hover{
		-webkit-filter: drop-shadow(1px 1px 1px #000) brightness(1.2);
		-webkit-transform: scale(1.1);
		filter: drop-shadow(1px 1px 1px #000) brightness(1.2);
		transform: scale(1.1);
		cursor:pointer;
		cursor:hand;
    }