body 
{
  background-color : #FFFFFF;
  font-family      : arial, helvetica, sans-serif, tahoma;
  color            : #504D48;
  font-size        : 10pt;
}

h2
{
  border-bottom    : 1px solid #504D48;
  padding-bottom   : 10px;
  margin-bottom    : 20px;
}

big
{
  font-weight : bold;
  font-size   : 2em;
}

a
{
  color           : #466;
  text-decoration : underline;

}

a:visited
{
  color : #4D7D90;
}

a:active
{
  color : red;
}

a.Butt
{
  font-size: 14px;
  line-height: 24px;
  font-family: sans-serif;
  font-weight: bold;
  text-decoration: none;
  color: white;
  background: url(infoimages/cssbutt0.gif) #000066;
  text-align: center;
  display: block;
  width: 146px; height: 24px
}

a:hover.Butt
{
  font-size: 14px;
  line-height: 24px;
  font-family: sans-serif;
  font-weight: bold;
  text-decoration: none;
  color: white;
  background: url(infoimages/cssbutt1.gif) #000099;
  text-align: center;
  display: block;
  width: 146px;
  height: 24px
}
  
.bold
{
  font-weight : bold;
}

.indent,
.footer
{
  margin-left : 20px;
}

.indent-right
{
  margin-right : 10px;
}

.margin-bottom
{
  margin-bottom : 10px;
}

.margin-top
{
  margin-top : 20px;
}

.margin-middle
{
  margin : 10px 0px 10px 0px;
}

.page
{
  position      : relative;
  margin-top    : -15px;
  margin-left   : 12px;
  margin-bottom : 40px;
  padding       : 20px;
  width         : 900px;
  border        : 10px inset #760000;
  background    : #F4ECE2  0px 0 repeat-y fixed;
}
.admin-menu
{
  position      : absolute;
  margin-top    : -15px;
  margin-left   : -15px;
  margin-bottom : 40px;
  padding       : 20px;
  width         : 180px;
  border        : 10px inset #760000;
  background    : #F4ECE2 url("http://republicfortheunitedstates.us/images/gradien.jpg") 0px 0 repeat-y fixed;
}
.admin-page
{
  position      : relative;
  margin-top    : -15px;
  margin-left   : 235px;
  margin-bottom : 40px;
  padding       : 20px;
  width         : 900px;
  border        : 10px inset #760000;
  background    : #F4ECE2 url("http://republicfortheunitedstates.us/images/gradien.jpg") 0px 0 repeat-y fixed;
}
.content
{
  margin-right : 5px;
  text-align   : justify;
  padding: 20px;
}

.right-justify
{
  text-align : right;
}

.no-justify
{
  text-align : left;
}

.pdf-icon
{
  list-style-image : url(/images/pdf_icon_small.gif);
}

.doc-icon
{
  list-style-image : url(/images/word_icon_small.gif);
}

.none
{
  list-style-type : none;
  margin          : 10px 0px 10px 0px;
  font-weight     : bold;
}
.push_down_page
{
  margin-top    : 40px;
  margin-left   : 400px;
  margin-bottom : 40px;
  margin-right  : 40px;
}
.continue_page
{
  position      : absolute;
  margin-top    : -15px;
  margin-left   : 150px;
  margin-bottom : 40px;
  padding       : 20px;
  width         : 750px;
  border        : 10px inset #760000;
  background    : #F4ECE2 url("http://republicfortheunitedstates.us/images/gradien.jpg") 870px 0 repeat-y fixed;
}

#the-people
{
  margin-right : 20px;
  font-style: italic;
}

#header
{
  width       : 810px;
  height      : 777px;
  background  : url(/images/Flying_Forever_Glory.jpg) no-repeat;
  margin-left : 25px;
  border      : 1px solid #95B3D7;
}

#menu
{
  width       : 140px;
  height      : 400px;
  margin-top  : -635px;
  margin-left : 20px;
}

#continue_menu
{
  width       : 140px;
  height      : 400px;
  margin-top  : 20px;
  margin-left : 20px;
}

#facebook
{
  width       : 140px;
  height      : 400px;
  margin-top  : -635px;
  margin-left : 20px;
}
p#socialicons img{ /* 1st set of icons. Rotate them 360deg onmouseover and out */
-moz-transition: all 0.8s ease-in-out;
-webkit-transition: all 0.8s ease-in-out;
-o-transition: all 0.8s ease-in-out;
-ms-transition: all 0.8s ease-in-out;
transition: all 0.8s ease-in-out;
}

p#socialicons img:hover{
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
-ms-transform: rotate(360deg);
transform: rotate(360deg);
}

p#socialicons2 img{ /* 2nd set of icons. Rotate them 60deg onmouseover and out */
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
-ms-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}

p#socialicons2 img:hover{
-moz-transform: rotate(70deg);
-webkit-transform: rotate(70deg);
-o-transform: rotate(70deg);
-ms-transform: rotate(70deg);
transform: rotate(70deg);
}

p#socialicons3 img{ /* 3rd set of icons. Rotate them -360deg onmouseover ONLY. Note where the "transition prop is added */
}

p#socialicons3 img:hover{ 
-moz-transition: all 0.5s ease-in-out;
-webkit-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
-moz-transform: rotate(-360deg);
-webkit-transform: rotate(-360deg);
-o-transform: rotate(-360deg);
-ms-transform: rotate(-360deg);
transform: rotate(-360deg);
}
.expstickybar{
position:fixed;
color: white;
padding: 5px;
right:0; /*horizontally center bar in window*/
left:0; /*horizontally center bar in window*/
visibility:hidden;
background: #e43a3d;
z-index: 10000;
width:auto; /*set width of bar to width of entire window*/
font-weight:bold;
}

.expstickybar a{
color: white;
}
  
#cssmenu{ height:37px; display:block; padding:0; margin:20px auto;  border:1px solid; border-radius:5px; } 
#cssmenu > ul {list-style:inside none; padding:0; margin:0;} 
#cssmenu > ul > li {list-style:inside none; padding:0; margin:0; float:left; display:block; position:relative;} 
#cssmenu > ul > li > a{ outline:none; display:block; position:relative; padding:12px 20px; font:bold 13px/100% Arial, Helvetica, sans-serif; text-align:center; text-decoration:none; text-shadow:1px 1px 0 rgba(0,0,0, 0.4); } 
#cssmenu > ul > li:first-child > a{border-radius:5px 0 0 5px;} 
#cssmenu > ul > li > a:after{ content:''; position:absolute; border-right:1px solid; top:-1px; bottom:-1px; right:-2px; z-index:99; } 
#cssmenu ul li.has-sub:hover > a:after{top:0; bottom:0;} 
#cssmenu > ul > li.has-sub > a:before{ content:''; position:absolute; top:18px; right:6px; border:5px solid transparent; border-top:5px solid #fff; } 
#cssmenu > ul > li.has-sub:hover > a:before{top:19px;} 
#cssmenu ul li.has-sub:hover > a{ background:#3f3f3f; border-color:#3f3f3f; padding-bottom:13px; padding-top:13px; top:-1px; z-index:999; } 
#cssmenu ul li.has-sub:hover > ul, #cssmenu ul li.has-sub:hover > div{display:block;} 
#cssmenu ul li.has-sub > a:hover{background:#3f3f3f; border-color:#3f3f3f;} 
#cssmenu ul li > ul, #cssmenu ul li > div{ display:none; width:auto; position:absolute; top:38px; padding:10px 0; background:#3f3f3f; border-radius:0 0 5px 5px; z-index:999; } 
#cssmenu ul li > ul{width:200px;} 
#cssmenu ul li > ul li{display:block; list-style:inside none; padding:0; margin:0; position:relative;} 
#cssmenu ul li > ul li a{ outline:none; display:block; position:relative; margin:0; padding:8px 20px; font:10pt Arial, Helvetica, sans-serif; color:#fff; text-decoration:none; text-shadow:1px 1px 0 rgba(0,0,0, 0.5); } 

#cssmenu, #cssmenu > ul > li > ul > li a:hover{ background:#bf4143; background:-moz-linear-gradient(top,  #bf4143 0%, #a13742 100%); background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#bf4143), color-stop(100%,#a13742)); background:-webkit-linear-gradient(top,  #bf4143 0%,#a13742 100%); background:-o-linear-gradient(top,  #bf4143 0%,#a13742 100%); background:-ms-linear-gradient(top,  #bf4143 0%,#a13742 100%); background:linear-gradient(top,  #bf4143 0%,#a13742 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#bf4143', endColorstr='#a13742',GradientType=0 ); } 
#cssmenu{border-color:#712730;} 
#cssmenu > ul > li > a{border-right:1px solid #712730; color:#fff;} 
#cssmenu > ul > li > a:after{border-color:#f0696c;} 
#cssmenu > ul > li > a:hover{background:#8f2f34;} 

div.css3droppanel { /* Main wrapper for push down panel */
		position: relative;
		top: 0px;
		margin: 0;
		margin-bottom: 1em; /* margin with rest of content on page */
		}

div.css3droppanel > div { /* Content DIV DIV inside wrapper */
                height: 10px; /* initial height of content when hidden. Should be same height as bottom bar (see div.css3droppanel:after) */
		-moz-box-sizing: border-box; /* ensure any padding and border declared inside content DIV doesn't increase DIV's declared dimensions */
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		overflow: hidden;
		color: #FFFFFF; /* text color */
		background: #800000; /* background of content DIV */
		position: relative;
		top: 0px;
		opacity: 0;
    -moz-transition: all 0.2s ease-in-out 0.1s;  /* CSS3 transition of UL state. Last 0.1s specifies delay before animation */
    -o-transition: all 0.2s ease-in-out 0.1s; /* instead of ease-in-out, also try cubic-bezier(0.25, 0.1, 0.25, 1.4) instead */
    -webkit-transition: all 0.2s ease-in-out 0.1s;
    transition: all 0.2s ease-in-out 0.1s;
		}

div.css3droppanel:after { /* Add bottom bar beneath wrapper */
		content: '';
		display: block;
		bottom: -10px;
		position: absolute;
		width: 94%;
		height: 10px;
		box-shadow: 0 3px 8px gray, 3px 3px 4px brown inset;
		background: #5a1619; /* dark redish background and its gradient versions */
		background: -moz-linear-gradient(top,  rgba(118,36,41,1) 0%, rgba(117,5,11,1) 50%, rgba(56,38,39,0.72) 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(118,36,41,1)), color-stop(50%,rgba(117,5,11,1)), color-stop(100%,rgba(56,38,39,0.72)));
		background: -webkit-linear-gradient(top,  rgba(118,36,41,1) 0%,rgba(117,5,11,1) 50%,rgba(56,38,39,0.72) 100%);
		background: -o-linear-gradient(top,  rgba(118,36,41,1) 0%,rgba(117,5,11,1) 50%,rgba(56,38,39,0.72) 100%);
		background: -ms-linear-gradient(top,  rgba(118,36,41,1) 0%,rgba(117,5,11,1) 50%,rgba(56,38,39,0.72) 100%);
		background: linear-gradient(to bottom,  rgba(118,36,41,1) 0%,rgba(117,5,11,1) 50%,rgba(56,38,39,0.72) 100%);
		}


div.css3droppanel input[type="checkbox"] { /* style invisible checkbox element used to toggle state of push down panel */
		position: absolute;
		right: 50px; /* right position of checkbox */
		width: 60px; /* width of checkbox */
		height: 42px; /* height of checkbox */
		bottom: -10px; /* bottom offset of checkbox */
		z-index: 10;
		cursor: pointer;
		opacity: 0;
		}

div.css3droppanel input[type="checkbox"]:checked ~ div { /* when checkbox is checked, expand content within wrapper */
		height: 400px; /* height of content to expand to. Scrollbar will be shown if content overflows this height */
		opacity: 1;
		overflow: auto;
		}

div.css3droppanel label { /* style label that's positioned below wrapper's bottom bar, and will toggle checkbox when interacted with */ 
		position: absolute;
		right: 100px; /* right position of label */
		width: 60px; /* width of label */
		height: 42px; /* height of label */
		bottom: -40px; /* bottom offset of label */
		border-bottom-left-radius: 30px;
		border-bottom-right-radius: 30px;
		cursor: pointer;
		z-index: 5;
		background: #5a1619; /* dark redish background and its gradient versions */
		background: -moz-linear-gradient(top,  rgba(118,36,41,1) 0%, rgba(117,5,11,1) 50%, rgba(124,31,32,0.72) 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(118,36,41,1)), color-stop(50%,rgba(117,5,11,1)), color-stop(100%,rgba(124,31,32,0.72)));
		background: -webkit-linear-gradient(top,  rgba(118,36,41,1) 0%,rgba(117,5,11,1) 50%,rgba(124,31,32,0.72) 100%);
		background: -o-linear-gradient(top,  rgba(118,36,41,1) 0%,rgba(117,5,11,1) 50%,rgba(124,31,32,0.72) 100%);
		background: -ms-linear-gradient(top,  rgba(118,36,41,1) 0%,rgba(117,5,11,1) 50%,rgba(124,31,32,0.72) 100%);
		background: linear-gradient(to bottom,  rgba(118,36,41,1) 0%,rgba(117,5,11,1) 50%,rgba(124,31,32,0.72) 100%);
		box-shadow: 0 3px 8px black, 5px 5px 6px brown inset, 0 -3px 3px rgba(152,41,47,0.7) inset, 0 5px 0 rgba(255,255,255,0.7) inset;
		}
                
div.css3droppanel input[type="radio"] { /* style invisible radio element used to toggle state of push down panel */
		position: absolute;
		right: 50px; /* right position of radio */
		width: 60px; /* width of radio */
		height: 42px; /* height of radio */
		bottom: -10px; /* bottom offset of radio */
		z-index: 10;
		cursor: pointer;
		opacity: 0;
		}

div.css3droppanel input[type="radio"]:checked ~ div { /* when radio is checked, expand content within wrapper */
		height: 400px; /* height of content to expand to. Scrollbar will be shown if content overflows this height */
		opacity: 1;
		overflow: auto;
		}

div.css3droppanel label:hover { /* style of label when mouse rolls over it */
		box-shadow: 0 3px 8px black, 5px 5px 6px brown inset, 0 -3px 3px rgba(152,41,47,0.7) inset, 0 5px 0 rgba(255,255,255,0.7) inset, 0 0 15px rgba(255,255,255,0.8) inset;
		}

div.css3droppanel label:after { /* generated down arrow */
		content: '';
		position: absolute;
		display: block;
		width: 0;
		height: 0;
		border: 12px solid transparent;
		border-color: white transparent transparent transparent;
		top: 18px;
		left: 18px;
		box-shadow: 0 0 7px gray inset;
		}
#top {
	margin: 0 auto 0 auto;
	background:url('../images/top-bg.jpg') repeat-x;
	width:100%;
	height:112px;
}

#logo {
	margin: 0 auto 0 auto;
	background:url('../images/republicHeader4.png');
	width: 555px;
	height: 112px;
}

#content {
	margin: 0 auto 0 auto;
	width: 95%;
}

#content #left-nav {
	width:15%;
	float:left;
	font-size:95%;
}

#content #left-nav ul {
	padding:0 0 50px 0;
	margin:0;
}

#content #left-nav ul li {
	padding:0;
	margin:0;
	list-style:none;
}

#content #left-nav ul li a {
	text-decoration:none;
}

#content #left-nav ul li a:hover {
	color:#ff0505;
	text-decoration:underline;
}

#content #main {
	float:left;
	width:85%;
	font-size:90%;
}

#content #main #regbox {
	padding: 0 0 0 0;
}

#content #main #regbox label {
	width:100px;
	float:left;
}

table.admin td {
	vertical-align: top;	
}

#error {
	display:block;
	margin:5px;
	color:#4d4948;
	background-color:#fffebe;
	border: 1px solid #cbcbcb;
	font-size:90%;
}

#success {
	margin:5px;
	color:#4d4948;
	background-color:#bce9b5;
	border: 1px solid #7ace6c;
	font-size:90%;
}
.reveal-if-active {
  opacity: 0;
  max-height: 0;
  overflow: hidden;
  font-size: 16px;
  -webkit-transform: scale(0.8);
      -ms-transform: scale(0.8);
          transform: scale(0.8);
  -webkit-transition: 0.5s;
          transition: 0.5s;
}
.reveal-if-active label {
  display: block;
  margin: 0 0 3px 0;
}
.reveal-if-active input[type=text] {
  width: 100%;
}
input[type="radio"]:checked ~ .reveal-if-active, input[type="checkbox"]:checked ~ .reveal-if-active {
  opacity: 1;
  max-height: 600px;
  padding: 10px 20px;
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1);
  overflow: visible;
}

form {
  max-width: 1000px;
  margin: 20px auto;
}
form > div {
  margin: 0 0 20px 0;
}
form > div label {
  font-weight: bold;
}
form > div > div {
  padding: 5px;
}
form > h4 {
  color: green;
  font-size: 24px;
  margin: 0 0 10px 0;
  border-bottom: 2px solid green;
}

body {
  font-size: 20px;
}

* {
  box-sizing: border-box;
}