/* 121112- Responsive design adjustment*/
/* 190613 - level status */
/* MEGG stylesheet engagement.css - generated from meggmaker.pl */
/* Main css tailored by individual colour schemes*/
/*Unless you are proficent with stylesheets only change the values with  EDIT alongside*/
/* gold distractors */

body,table {                 /*EDIT */
            font-family:verdana,arial,sans-serif;font-size:10pt;
            text-align:center;margin-left:auto;margin-right:auto;}

body   {background-color:#000000;color:#FFFFFF;
        text-shadow: black 0.1em 0.1em 0.2em;
        margin:0;}

table  {color:#FFFFFF;}    /*EDIT */
   
#messagediv {text-align:left;width:97%;margin:auto;}  /* new message style */

#messagediv select {font-size:8pt;
                    border:1px solid #ffffff;}

/* combine elements sharing same border */
h1, #halltableobjective, #hoftext, .title, #halltableobjective, #hoftext,
.menudiv, .menutitle,.maindiv, .cell,.skillcolour,.skillcolourlow,
 #objectivetable td, #rankingtable td, #interactiontable td, #skillstable td,#techtable td, 
 #halltable td, #spytable td, #battletable td
   {border-style:ridge;border-color:#ffd68c;border-radius:5px;}

/* style of playerstatus bar table cells */
#statusbar {width:98%;}

#statusbar td {font-size:8pt;white-space:nowrap;border:solid 1px #ffd68c;}

.greenstatus {background-color:green;} /* level status complete */
.orangestatus {background-color:#ff9000;} /* level status incomplete */

.inlineblock {display: inline-block;}  

#objectivetable td {font-size:8pt;}

.title    {color:#000000;background:url('images/goldbar.jpg');padding:2px 0px 2px 0px;
           font-weight:bold;font-size:10pt;
           margin:auto;margin-top:2px;
           width:98%;
           text-shadow: none;}

.maindiv {background-color:transparent;
          width:715px;
          margin:auto;
          padding-bottom:5px;
}

/*Game Title and top row of reports*/
h1   {color:black;background:url('images/goldbar.jpg');width:98%;
      background-color:transparent;  /*#000044;  EDIT */
      font-size:10pt;
      padding:0px;margin:0px;
      margin-left:auto;margin-right:auto; /* ns center */
      text-shadow: none;
      }

#alertboxtext h1 {/*width:250px;color:white;background:none;*/
                  border:none;}

.highlight  { font-size:10pt;font-weight:bold;
              padding:2px;margin:2px;
              margin-left:auto;margin-right:auto; /* ns center */
             }

 .memohead {text-align:left; /* align memo head in background.pl  */
            margin:auto;
            width:600px;
 } 
/* input text box style*/
.textbox {/* border-style:inset; */
          border:1px solid #ffffff;
          font-size:8pt;
          padding:3px;margin:2px;
          margin:auto;
          color:white;
}

#newgold {width:30px;} /* adjust width of newgold textbox on quiz page */

/* Quiz questions controls css bank yes no next etc*/
#quizcontrols {text-align:center;margin-left:auto;margin-right:auto;
               background:transparent;border:none;
              }

/*menu top buttons */
.topbutton {
            text-align:center;
            width:140px;    
            font-size:9pt;font-weight:bold;
            border-width:1px;
            border-style:solid; 
            padding:1px;margin:0px;
            margin:auto; /* ns center */
            border-radius:5px;
            text-shadow: black 0.1em 0.1em 0.2em;
           }
/* glow on hover*/
.topbutton:hover {box-shadow:rgba(255, 180, 2, 0.8) 0px 0px 3px 3px;}

.sendclearbutton {width:60px;}
           
/*make sure sections under top buttons are display:none on start to make menus expand and contract*/
#bm, #gather, #reports, #upgrades, #exit {display:none;}

/*submenu buttons */
.button {
         border-width:1px;
         border-style:solid;
         font-size:9pt;font-weight:bold;
         width:140px;    
         padding:1px;margin:0px;
         margin:auto;
         border-radius:5px;
               }

#stem {font-size:11pt;overflow: auto;padding:5px;}

/*distractor class added to button class */
.distractor {font-size:10pt;
             width:auto; 
             text-shadow: none;
             background:url("images/goldbar.jpg") repeat;
             color:#000000;
            }
.distractor:hover{color:green;}

#faultyq {width:200px;}

/* scrollable ranking table */
.scrolltable 
    { text-align:center;margin:auto;
      width:95%;height:450px;overflow:auto;}

/* added to remove css.js file but allow rollover highlight */
.submitbutton
    {display:block;width:100%;
     font-size:8pt;  
     font-weight:bold;
     text-decoration:none;

     border-width:1px;
     border-style:solid;

 /*    height:15px;  */
}

.submitbutton:hover
    {background-color:#008800;      /*EDIT */
     color:#FFFFFF;       /*EDIT */
     /* border-color:#00FF00;*/
     border-color:#000000 #00ff00 #00ff00 #000000;
     font-weight:bold;
}

/* Hall of fame and News cells*/
.cell {text-align:left;font-size:8pt; padding:2px;}

#battletable td {text-align:center;font-size:8pt; padding:2px;}

#rankingtable td, #interactiontable td, 
#skillstable td,#techtable td, 
#halltable td, #halltableobjective {font-size:8pt; padding:2px;}

/*menu buttons and distractors in questions.pl*/
a {display:block;width:100%;  
     text-decoration:none;
}

/* color upgradetable rows */
#upgraderow1 {background-color:#ff0000;}
#upgraderow2 {background-color:#ff3000;}
#upgraderow3 {background-color:#ff6000;}
#upgraderow4 {background-color:#ff9000;}
#upgraderow5 {background-color:#ffc000;}

a:hover {font-weight:bold;}

#certaintydiv {margin:5px;}

#certaintydiv a {
     display:inline;
     text-decoration:none;
     font-weight:bold;
     padding:2px;
     border-width:1px;
     border-style:solid;
}
#certaintydiv a:hover {box-shadow:0 0px 6px rgba(255,180,2,0.8);}

/*megg menu requirements */
#menudiv a:hover {width:97%;}

#sndplayer {visibility:hidden;}
#avatardiv {height:110px;width:105px;margin:auto;}

/* Add alertbox styles to main */
/* Alert Box css */
#alertboxcontainer {position:absolute;top:0px;left:0px;z-index:200;
                    background-image:url(images/transparent.gif);
                       /*  filter:alpha(opacity=50%);   ie
                           -moz-opacity: 5.0;         firefox
                           opacity: 5.0;              w3c*/
                   }
#aboxtitle {color:#ffffff;background-color:#333333;
            margin:2px;font-size:12pt;text-align:center;font-weight:bold;
            /* 181012 - adjust title width to allow for rounded corners*/
            margin:2px 10px 2px 10px;
            }

#alertbox {position:absolute;top:0px;left:0px;
           border:solid 2px;border-color:#888888 #222222 #222222 #888888;
           display:none;height:275px;width:300px;
           background-color:#333333;
           text-align:center;
           /* 181012 - rounded corners*/
  	   -webkit-border-radius: 10px;
  	   -khtml-border-radius: 10px;
           border-radius: 10px; /* ff13 and  ie9 suported*/
           
          }

#alertboxtext {height:210px;margin:0px 10px  10px 10px;padding:3px;overflow:auto;
               font-size:10pt;font-weight:bold;
               border:solid 1px #000000;
               background-color:#222222;
             /*  background-image:url('images/menu.png');  */
               background-repeat:no-repeat;
               background-position:center;
}
#alertbutton {font-weight:bold;font-size:8pt;padding:1px 15px 1px 15px;
              text-decoration:none;
              width:30px; margin:auto;text-align:center; /* line added 230308 */
              border-radius:5px;
}
#banknow {color:yellow;border:1px red solid;}

#qdiv {display:none;} /* 210510 - jquery addition - allows initial hiding of question div jquery slide */
#answerletter {font-size:16pt;color:#ff8000;} /* 120610 - enhance incorrect answer letter*/

.floatleft {float:left;}
.floatright {float:right;}

/* used on background page to display upgrade path in a table */
.skillcolour {background-color:green;}
.skillcolourlow {background-color:#ff9000;}
.briefing {border-style:ridge;border-color:#ffd68c;width:130px;text-align:center;} 

#hoftext {background-color:green;}
#messageframe {display:none;}

 #myscroller {position:relative;overflow:hidden;  /* mandatory */
                width:98%; height:250px;background-color:#000000;       
                margin:auto;                     
              }
 /* styling for new internal menu*/   
 
  /* 180610 - position for the slidemenu effects    */      
 #menucontainer {position:absolute;left:-300px;top:2px;}
 
 .menudiv {padding:0px;font-size:8pt;
           margin:auto;width:125px;
 }
 #hamburger {font-size:14pt;}

#menutitle {box-shadow:0 0px 6px rgba(255,180,2,0.8);
            margin:5px 5px 5px 0;}

#menubody {display:none;position:absolute;z-index:100;}
 
 #newmenu {display:none;
           width:140px;
           margin:auto;

          } 

/* responsive design for smaller screens*/
@media screen and (max-width: 715px) /* screens less than 715px*/
  {
   .maindiv {width:95%;}
   #statusbar td {font-size:8pt;white-space:normal;}
/*   img {max-width: 100%} */
  }