html {
  
  background-color: #45412B;
  margin:0px;
  padding:0px;
}

body {
  margin:0px;
  padding:0px;
  
}

#bodyDiv {
  
  position:relative;
  
  width:700px;
  background-color: #024996;
  color:#C0F4FA;
  
  margin-top:0px;
  margin-left:auto;
  margin-right:auto;
  
  padding-top:1px;
  
  padding-left:5px;
  padding-right:5px;
  padding-bottom:10px;
  font-family:"futura", "helvetica";
  
  
  /*border-left:1px solid white;
  border-right:1px solid white;*/
  
  box-shadow: -5px 0px 15px 1px #292407, 5px 0px 15px 1px #292407;
  /*outline-style: solid;
  outline-width:1px;
  outline-color:#003875;*/
  
  text-align:center;
  
  overflow:hidden;
  
}

@media only screen
and (min-device-width: 320px)
and (max-device-width: 480px)
and (-webkit-min-device-pixel-ratio: 2)
and (orientation: portrait) {

 #bodyDiv {
   /*background-color: lightgreen;*/
   width:400px;
 }
 
}

a {
  color:#56CEDB;
  text-decoration:none;
}

#mMenuCont {
  position:absolute;
  text-align:center;
  top:0px;
  left:50%;
  width:100px;
  height:35px;
  overflow:hidden;
  margin-left:-50px;
  z-index:500;
  
}

#mMenu {
  
  margin:0px;
  padding:5px;
  list-style-type: none;
  
  /*background-color:black;*/
  
  border-radius:0px 0px 10px 10px;
  
  
}

#mMenu>li {
  /*color:#ffffff;*/
  border-radius:5px;
  /*border:2px solid #6EECFF;*/
  border:2px solid #FFCC00;
  padding:5px;
  margin:5px;
  
  /*background-color:rgba(0, 113, 184, 1);*/
  background-color: #8C5C01;
  
}

#mMenu>li:first-child {
  /*color:#00ff00;*/
  background-color:rgba(0, 113, 184, 0.5);
  border:2px solid #6EECFF;
  padding:0px;
  margin:0px;
}

#mMenu>li.mMenuHead {
  color:yellow;
  font-size:1.2em;
  font-family:"futura", "helvetica";
  border-radius:0px;
  border:0px;
  padding:-5px;
  margin:-5px;
  margin-bottom:80px;
  background-color:transparent;
}

#mMenu>li>a {
  text-decoration:none;
  font-size:1.15em;
  display:inline-block;
  width:100%;
  color:#FFDD00;
}

h2.loaHdrFont {
  margin-top:-15px;
  line-height:80px;
}

.lBtn {
  
  display: inline-block;
  margin: 5px;
  padding: 10px;
  border-radius:10px;
  border:2px solid #6EECFF;
  width:200px;
  text-decoration:none;
  
  
}

.lBtn2 {
  
  display: inline-block;
  margin: 5px;
  width:200px;
  
  background: #0395de;
  background-image: -webkit-linear-gradient(top, #0395de, #005285);
  background-image: -moz-linear-gradient(top, #0395de, #005285);
  background-image: -ms-linear-gradient(top, #0395de, #005285);
  background-image: -o-linear-gradient(top, #0395de, #005285);
  background-image: linear-gradient(to bottom, #0395de, #005285);
  
  border-radius: 10px;
  
  border:2px solid #6EECFF;
  
  color:#DCF2FC;
  
  font-size:1.3em;
  
  padding: 10px 10px 10px 10px;
  text-decoration: none;
}

.copyRight {
  
  font-size:10px;
  color:#F5E569;
  
}

/* =========================================== */
/* HEADER */

#hdrBanner {
  position:relative;
  height:250px;
  overflow:hidden;
  text-align:center;
  background:url('/loa/resources/images/BB_j.jpg');
  background-size: cover;
  background-repeat: no-repeat;
  margin:-5px;
  box-shadow: 0px 2px 5px #134378;
  border-bottom:1px solid #08BBCF;
  padding:5px;
}

@-webkit-keyframes glyphSpin{
  0% { transform: rotate(0deg) scale(0,0); }
  20% { transform: rotate(45deg) scale(1,1);}
  90% { transform: rotate(360deg) scale(1,1);}
  100% { transform: rotate(-360deg) scale(0,0);}
}


#gSet0, #gSet1 {
  position:relative;
  /*top:20px;*/
  /*top:0px;*/
  z-index:50;
  /*height:50px;*/
  /*left:50%;*/
  height:150px;
  width:400px;
  margin:-240px auto 0px auto;
  overflow:hidden;
  /*border:1px solid white;*/
}

/*
#gSet0 {
   margin-left:-205px;
}

#gSet1 {
  margin-left:43px;
}*/

.glha, .glhb, .glhc {
  /*display:inline-block;*/
  display:block;
  position:absolute;
  transform: scale(0,0);
}

.glha {
  opacity:0.3;
  width:20px;
  height:20px;
  /*margin-bottom:10px;*/
  -webkit-animation:glyphSpin 5s infinite;
  -webkit-animation-delay:5s;
}

.glhb {
  opacity:0.4;
  width:30px;
  height:30px;
  /*margin-bottom:5px;*/
  -webkit-animation:glyphSpin 10s infinite;
  -webkit-animation-delay:5s;
}

.glhc {
  opacity:0.5;
  width:40px;
  height:40px;
  -webkit-animation:glyphSpin 15s infinite;
  animation-direction: alternate;
}


@-webkit-keyframes bIntro1 {
  0% { transform: rotate(0deg) scale(0,0); top:50px; margin-left:-200px;opacity:0;}
  30% { transform: rotate(360deg) scale(1,1);top:150px; margin-left:-100px;opacity:1;}
  50% { transform: rotate(420deg) scale(1,1);top:150px; margin-left:-100px;opacity:1;}
  60% { transform: rotate(0deg) scale(0,0);top:50px; margin-left:10px;opacity:0;}
  100% { transform: rotate(0deg) scale(0,0); top:50px; margin-left:-200px;opacity:0;}
}

@-webkit-keyframes bIntro2 {
  0% { transform: rotate(0deg) scale(0,0); top:50px; margin-left:10px; opacity:0;}
  30% { transform: rotate(360deg) scale(1,1);top:150px; margin-left:-100px;opacity:1;}
  50% { transform: rotate(420deg) scale(1,1);top:150px; margin-left:-100px;opacity:1;}
  60% { transform: rotate(0deg) scale(0,0);top:50px; margin-left:-200px;opacity:1;}
  100% { transform: rotate(0deg) scale(0,0); top:50px; margin-left:10px; opacity:0;}
}

#lock0, #lock1 {
  position:absolute;
  z-index:50;
  width:200px;
  height:200px;
  top:150px;
  left:50%;
  transform: scale(0,0);
}

#lock0 {
  margin-left:-100px;
  -webkit-animation:bIntro1 20s infinite;
}

#lock1 {
  margin-left:100px;
  -webkit-animation:bIntro2 20s infinite;
  -webkit-animation-delay:10s;
}

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

/* footer */
#ftrBanner {
  font-size:12px;
  width:95%;
  border-top:1px solid #65ABD6;
  margin:10px auto;
}

/* =========================================== */
/* carousel */
@-webkit-keyframes fade-in{
  0% { opacity:0; }
  5% { opacity:1; }
  45% { opacity:1; }
  50% { opacity:0; }
  
}

@-webkit-keyframes cMoveNext{
  0% { opacity:0; left:300px; }
  20% { opacity:1; left:0px; }
  40% { opacity:1; left:0px; }
  80% { opacity:0; left:-300px; }
}

@-webkit-keyframes cMoveOff{
  0% { opacity:0; left:0px; }
  5% { opacity:1; left:0px; }
  95% { opacity:1; left:0px; }
  100% { opacity:0; left:-300px; }
}

#crsl0, #crsl1 {
  border:0px;
  margin:0px;
  padding:0px;
  position:absolute;
  top:0px;
  opacity:0;
  z-index:400;
  left:300px;
  -webkit-animation:cMoveNext 10s infinite;
}

#crsl1 {
  -webkit-animation-delay:5s;
}

#cPrev, #cNext {
  display:block;
  width:40px;
  height:40px;
  position:absolute;
  left:50%;
  /*border-radius:25px;border:1px solid white;*/
  background:url('/loa/resources/images/playBtn.png');
  background-size: cover;
  background-repeat: no-repeat;
}

#cPrev {
  -moz-transform: scaleX(-1);
  -o-transform: scaleX(-1);
  -webkit-transform: scaleX(-1);
  transform: scaleX(-1);
  filter: FlipH;
  -ms-filter: "FlipH";
}

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


/* details */
summary {
  color:#56CEDB;
  font-size:1.2em;
  outline:0px;
}

details {
  margin:5px;
  outline:0px;
}

details>div {
  padding:10px;
  border-bottom:1px solid #557FAD;
  margin-bottom:10px;
}