/* this is the css for the mobile part of the site */

a:link { color: #0000cc; text-decoration: none; }
a:visited { color: #996699; text-decoration: none; }
a:hover { background: #a7daa8 center center;}
a:active { color: #ff0000; }

/* ================================================================================ */

body
{
margin: 0;
padding: 0;
line-height: 1.2em;
font-family: sans-serif;
font-size: medium; 
margin-top: 15px;
background-image: url(images/clouds.gif);
background-attachment: fixed;
}


li { list-style-position: inside; }

/* ================================================================================ */

#logo
{
padding-top: 10px;
padding-bottom: 10px;
/* background-color: #71c473; */
/* opacity: 0.9; */
margin-left: auto;
margin-right: auto;
/* border-radius: 10px; */
}

/* it's the "text-decoration" that got the hover color to go away */

#logo a:hover { background-color: transparent; text-decoration: none; }

/*.logo img
{
/*max-height: 450px;*/
/*margin: auto auto 500px auto;*/
border-radius: 10px;
}*/

/* ================================================================================ */

#full
{
background-image: url(images/clouds.gif);
margin-left: 10%;
padding-left: 1em;
padding-right: 1em;
width: 11em;
text-align: center;
border: 1px #0000bc solid;
}

/* ================================================================================ */

/*
#nav
{
float: left;
/* top: 160px; */
font-weight: bold;
padding-top: 20px;
}

#nav a
{
/* display: block; */
font-weight: bold;
text-align: center;
text-decoration: none;
height: 1.3em;
padding-left: 5px;
}

#nav ul
{
display: table;
position: relative;
left: 6.5%;
list-style: none;
margin: 0;
text-align: center;
}

#nav li
{
display: inline;
list-style: none;
text-align: center;
float: left;
padding-top: 0.5em;
padding-left: 0.5em;
padding-right: 1em;
width: 8.5em;
border-top-left-radius: 6px;
border-top-right-radius: 6px;
}
*/

/* ============================== */

/*
#nav li.boxit
{
background-image: url(images/clouds.gif); 
/*border-top: 2px #cccccc solid;
border-left: 2px #cccccc solid;
border-right: 2px #cccccc solid;*/
height: 1.5em;
position: relative;
}

#nav li.boxit:hover
{
/*border-top: 2px #cccccc solid;
border-left: 2px #cccccc solid;
border-right: 2px #cccccc solid;*/
background-color: #a7daa8;
background-image: url(images/green.jpg);
}

#nav li.boxit a:hover
{
text-decoration: none;
background-color: #a7daa8;
}

#nav li.current
{
background-color: #3daf35;
color: #ffffff;
height: 1.5em;
text-align: center;
}
*/

/* ============================== */

/* for separate social tabs across top */

#nav li.soc
{
background-image: url(images/clouds.gif);
/*color: #ffffff;*/
height: 1.5em;
text-align: center;
margin-left: 5px;
width: auto;
}

#nav li.soc:hover
{
/*border-top: 2px #cccccc solid;
border-left: 2px #cccccc solid;
border-right: 2px #cccccc solid;*/
background-color: #a7daa8;
background-image: url(images/green.jpg);
}

#nav li.soc a:hover
{
text-decoration: none;
background-color: #a7daa8;
}

/* ================================================================================ */

/* <span class="blink">text goes here</span> */

.blink
{ animation: blink 1.5s steps(1, end) infinite; }

@keyframes blink
{
0% { opacity: 1; }
50% {opacity: 0; }
100% { opacity: 1; }
}

/* ================================================================================ */

#content
{
background-image: url(images/clouds.gif);
/*background-color: #ffffff;*/
/*opacity: 0.85;*/
background-color: rgba(255,255,255,0.80);   /* rgb for hex above, with opacity, won't inherit */
/*width: 61.5em;*/
height: 35em;
/* margin-top: 2px; */
margin-left: 10%;
margin-right: 10%;
padding-top: 25px;
padding-left: 20px;
padding-right: 20px;
padding-bottom: 5px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
/*border-radius: 10px;*/
}
   #content a { text-decoration: none; }

#content .boxit { border: 3px #394dae outset; padding: 0.5em; }
#content .boxit1 { border: 2px #000000 outset; padding: 0.5em; }
#content .thinbox { border: 1px #0000bc solid; padding: 0.5em;}

/* yellow background */
#content .boxit2 { border: 3px #394dae outset; padding: 3px; background-color: #ffff48; }

/* next are for more than one line */
#content .boxit2blue { border: 3px #394dae outset; padding: 0.5em; padding-bottom: 1.5em; }
#content .boxit2grey { border: 3px #000000 outset; padding: 0.5em; padding-bottom: 1.5em; }

/* ================================================================================ */

#contenttall
{
background-image: url(images/clouds.gif);
/*background-color: #ffffff;*/
/*opacity: 0.85;*/
background-color: rgba(255,255,255,0.80);   /* rgb for hex above, with opacity, won't inherit */
/*width: 61.5em;*/
/*margin-top: 15px;*/
margin-left: 10%;
margin-right: 10%;
padding-top: 25px;
padding-left: 20px;
padding-right: 20px;
padding-bottom: 5px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
/*border-radius: 10px;*/
}
   #contenttall a { text-decoration: none; }

#contenttall .boxit { border: 3px #394dae outset; padding: 3px; }
#contenttall .boxit1 { border: 2px #000000 outset; padding: 3px; }
#contenttall .nohover a:hover { background-color: transparent; }
#contenttall .thinbox { border: 1px #0000bc solid; padding: 3px; text-align: center; }

/* yellow background */
#contenttall .boxit2 { border: 3px #394dae outset; padding: 3px; background-color: #ffff48; }

/* next are for more than one line */
#contenttall .boxit2blue { border: 3px #394dae outset; padding: 0.5em; padding-bottom: 1.5em; }
#contenttall .boxit2grey { border: 3px #000000 outset; padding: 0.5em; padding-bottom: 1.5em; }

/* ================================================================================ */

#tickets
{
/*position: fixed;*/
/*top: 30%;*/
/*right: 100;*/
/*transform-origin: 100% 0;*/
/*transform: rotate(45deg) translateX(50%);*/     /*adding the pulse took away the rotation, so commented out*/
width:12%;
z-index: 99999;
background-color: orange;
border-radius: 10px;
padding: 7px;
animation: pulse 1.5s infinite;
}

@keyframes pulse
{
  0% { transform: scale(1); }
  50% { transform: scale(1.10); }
  100% { transform: scale(1); }
}

#tickets a:hover
{
background: yellow center center;
border-radius: 10px;
padding: 5px;
  }

/* ================================================================================ */

/* this is for the costs-info page, because it's in the table with the costs, not at the top */

#tickets1
{
/*position: fixed;*/
/*top: 30%;*/
/*right: 100;*/
/*transform-origin: 100% 0;*/
/*transform: rotate(45deg) translateX(50%);*/     /*adding the pulse took away the rotation, so commented out*/
z-index: 99999;
background-color: orange;
border-radius: 10px;
padding: 7px;
animation: pulse 1.5s infinite;
}

@keyframes pulse
{
  0% { transform: scale(1); }
  50% { transform: scale(1.10); }
  100% { transform: scale(1); }
}

#tickets1 a:hover
{
background: yellow center center;
border-radius: 10px;
padding: 5px;
  }

/* ================================================================================ */

#ticketscal
{
position: fixed;
/*top: 30%;*/
/*right: 100;*/
/*transform-origin: 100% 0;*/
/*transform: rotate(45deg) translateX(50%);*/     /*adding the pulse took away the rotation, so commented out*/
z-index: 99999;
background-color: orange;
border-radius: 10px;
padding: 7px;
animation: pulse 1.5s infinite;
}

@keyframes pulse
{
  0% { transform: scale(1); }
  50% { transform: scale(1.10); }
  100% { transform: scale(1); }
}

#ticketscal a:hover
{
background: yellow center center;
border-radius: 10px;
padding: 5px;
  }

/* ================================================================================ */

/* not using this */

input { background-color: #eeeeee; }

textarea { background-color: #eeeeee; }

input.buttongo { background-color: #669966; color: #ffffff; }

input.buttonstop { background-color: #cc6666; color: #ffffff; }

/* ================================================================================ */

.picsreg img 
{
/*max-height: 450px;*/
/*margin: auto auto 500px auto;*/
border-radius: 10px;
box-shadow: 10px 10px 15px 0 #888;
}

/* ================================================================================ */

#footer
{
/*background-image: url(images/clouds.gif);*/
/*background-color: #ffffff;*/
/*opacity: 0.80;*/
background-color: rgba(255,255,255,0.80);   /* rgb for hex above, with opacity, won't inherit */
margin-left: 10%;
margin-right: 10%;
padding-top: 15px;
padding-left: 15px;
padding-right: 15px;
padding-bottom: 10px;
text-align: center;
font-size: small;
text-decoration: none;
font-weight: normal;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
}
   #footer a { text-decoration: none; }
   #footer a:hover { background-color: #d2ddff; }