html, body {
  font-family: Arial,Helvetica,Helv,Verdana,sans-serif;
  /*font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;*/
  font-size: 10pt;
  font-color: #000000;
  background-color: #ffffff;
  width: 100%;
  height: 100%;
  padding: 0px;
  margin: 0px;
}

table {
  margin-left: auto;
  margin-right: auto;
}

.infotable {
  margin: 0;
  font-weight: normal;
  font-size: 8pt;
  text-align: left;
}

.alignRight {
  text-align: right;
}

.loginInput {
  width: 200px;
}

.loginButton {
  width: 150px;
}


    
.AddGroupDialogTD_L {
  text-align: right;
  padding: 6px;
  width: 180px;
  vertical-align: top;
  font-size: 10pt;
}

.AddGroupDialogTD_R {
  text-align: left;
  padding: 6px;
  width: 380px;
  vertical-align: top;
  font-size: 10pt;
}

.pwText {
  font-size: 7pt;
}

div {
  margin-left: auto;
  margin-right: auto;
}

.center {
  text-align: center;
}
/*
div.mainWrapperDIV {
/*  width: 95%;
  height: 100%;
  background-color: #cccccc;
  border-radius: 10px;
  padding: 20px;
  min-width: 340px;
  min-height: 460px;
}
*/
#mainWrapperDIV {
    width: 100%;
    height: 99%;
}

#headerTD {
/*  background-color: #dddddd;*/
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  padding: 4px;
}

#footerTD {
  background-color: #dddddd;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
  padding: 4px;
}

#mainWrapperDIV>table {
    width: 100%;
    height: 100%;
}
#mainWrapperDIV>table>tbody>tr>td {
    border: 1px solid #cccccc;
}

div.headerDIV {
  height: 90px;
  background-color: #dddddd;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  padding: 10px;
}

.PanelDIV-Header, .PanelDIV-Footer {
  background-color: #dddddd;
  padding: 4px;
}

.PanelDIV {
      height: 100%;
    }

div.leftPanelDIV {
 /* width: 49%;*/
  background-color: #dddddd;
  padding: 20px;
  float: left;
}

div.textareaLeftTXT {
  background-color: #ffffff;
  height: 100%;
  width: 100%;
  overflow: auto;
}

div.rightPanelDIV {
 /* width: 49%;*/
  background-color: #dddddd;
  padding: 20px;
  float: right;
}

div.textareaRightTXT {
  background-color: #ffffff;
  height: 100%;
  width: 100%;
  overflow: auto;
}

div.footerDIV {
  background-color: #dddddd;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  padding: 0px;
}

.mainHeadingTXT {
  font-family: Arial,Helvetica,Helv,Verdana,sans-serif;
  font-size: 48pt;
  margin: 0;
}

.panelHeadingP {
  margin: 0;
}

.panelHeadingSPAN {
  font-size: 12pt;
  font-weight: bold;
}

.categorySelectSEL {
  font-size: 10pt;
  font-weight: bold;
  width: auto;
}

a.addA {
  font-size: 10pt;
  color: #999999;
  text-decoration: none;
  cursor: pointer;
}

a.addA:hover {
  color: #666666;
}

.categoryHeadingTXT {
  font-size: 10pt;
  font-weight: bold;
}



a.download {
  font-size: 10pt;
  color: #ff0000;
  text-decoration: none;
  cursor: pointer;
}

a.download:hover {
  color: #009900;
}



.FileOpenLink {
  font-size: 10pt;
  padding-left: 20px;
  color: #006600;
  width: 100%;
  text-decoration: none;
  font-weight: normal;
  cursor: pointer;
}

.FileOpenLink:hover {
  font-size: 10pt;
  padding-left: 20px;
  color: #003300;
  width: 100%;
  text-decoration: underline;
}

.zipfileBTN {
  font-size: 10pt;
  color: #006600;
  background: transparent;
  border: solid 0px #999999;
  border-radius: 2px;
  font-weight: bold;
  padding: 2px;
}

.zipfileBTN:hover {
  color: #003300;
  border: solid 1px #999999;
  padding: 1px;
}


.menu {
  font-size: 10pt;
/*  color: #666666;
  background-color: #fcfcff;*/
  color: #dddddd;
  background-color: #333333;
  text-decoration: none;
  cursor: pointer;
  width: 150px;
  height: 100%;
  border: 0;
  font-weight: normal;
}

.menu:hover {
  color: #ffffff;
  background-color: #999999;
  font-weight: bold;
}



.topicResponseDIV {
   padding: 0px;
  /* cursor: pointer;*/
   border-bottom: solid 0px #cccccc;
 }
 /*
 .selectedTopicDIV {
   border: solid 4px #00ff00;
   boxShadow: 0px 0px 20px #00ff00;
   borderRadius: 8px;
 }
 
 .selectedTopicDIV {
   box-shadow: 5px 5px 15px; #cccccc;
   border-radius: 5px;
   border: 10px solid #00ff00;
 }
 */
 .topicRatingSPAN {
   font-size: 8pt;
 }
 
 .postCommentSPAN {
   font-size: 8pt;
   padding-left: 20px;
   color: #339933;
   width: 100%;
 }
 
 .showHideCommentSPAN {
   font-size: 8pt;
   padding-left: 20px;
   color: #339933;
   cursor: pointer;
 }
  
 .commentWrapperDIV {
   font-size: 8pt;
   padding: 4px;
   padding-left: 20px; 
   margin-left: 20px;
  /* background-color: #eeeeee;*/
   border: solid 1px #dddddd;
   border-radius: 4px;
   /*display: none;*/
 }
 
 .commentDIV {
   margin: 8px;
   margin-left: 0px;
 }

.editBTN {
  font-size: 7pt;
}


.responseBTN {
  float: right;
  margin-top: -2px;
  font-weight: bold;
  width: 110px;
  font-size: 8pt;
}

.responseBTN-ADD {
  color: #006600;
}

.responseBTN-SHOW {
  color: #333333;
}

.responseBTN:hover {
  background: #cccccc;
  color: #000033
}



/**************************************************/
/* **************** TOOLTIP HELP **************** */
/**************************************************/

.helpContainer {
  position: relative;
  display: inline-block;
}

.helpContainer .helpText {
  visibility: hidden;
  width: 300px;
  background-color: #dddddd;
  color: #000000;
  text-align: left;
  border: solid 1px #999999;
  border-radius: 4px;
  padding: 5px;
  position: absolute;
  z-index: 1;
  bottom: 100%;
  /*left: 50%;*/
  margin-left: -150px;
}
/*
.helpContainer .helpText::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #cccccc transparent transparent transparent;
}
*/

.helpContainer:hover .helpText {
  visibility: visible;
}

#TopicDraftInfoBTN {
  margin-top: -5px;
}

/**************************************************/
/**************************************************/
/**************************************************/




/* RATING 

.slider-section {
  float: left;
  width: 30px;
  height: 24px;
  font-size: 10pt;
  text-align: center;
  border: solid 1px #666666;
  border-radius: 2px;
  cursor: pointer;
  padding-top: 2px;
  cursor: pointer;
}
.slider-selected {
  float: left;
  width: 30px;
  height: 24px;
  font-size: 12pt;
  font-weight: bold;
  background-color: #ffffff;
  border: solid 0px #ffffff;
  text-align: center;
  cursor: pointer;
}
.col0 {background-color: #ff0000;}
.col1 {background-color: #ff3300;}
.col2 {background-color: #ff6600;}
.col3 {background-color: #ff9900;}
.col4 {background-color: #ffcc00;}
.col5 {background-color: #ffff00;}
.col6 {background-color: #ccff00;}
.col7 {background-color: #99ff00;}
.col8 {background-color: #66ff00;}
.col9 {background-color: #33ff00;}
.col10 {background-color: #00ff00;}

*/

/***** RATING SLIDER *****/

#RateDialog .td-center {
  text-align: center;
  width: 21px;
  cursor: pointer;
}

#SliderDIV .ui-slider {
  height: 16px;
  cursor: pointer;
}

#SliderDIV .ui-slider-handle {
  background: #999999;
   background-image: url("../graphics/dn_arr_dark.gif");
   background-repeat: no-repeat;
  background-position: center;
  width: 20px;
  margin-left: -12px;
  border: solid 2px #000000;
  height: 20px;
  cursor: pointer;
}

/************************/
/* GLOBAL SEARCH STYLES */
/************************/
  
.SearchResultsTABLE {
  width: 100%;
}

.searchHeaderResultsTD {
  font-weight: bold;
}

.searchResultsTD {
  vertical-align: top;
}

.searchSubjectA {
  color: #000099;
  text-decoration: none;
}

/************************/



.results {
  margin-left: auto;
  margin-right: auto;
  margin-top: 10px;
  width: 490px;
  text-align: center;
}

.responseDIV {
  margin-left: auto;
  margin-right: auto;
  border: solid 1px #999999;
  padding: 10px;
  border-radius: 5px;
  height: 220px;
  width: 780px
}

#mainPageWrapperDIV {
  width: 100%;
  height: 100%;
}

#main-page-div {
  text-align: left;
}

.switchBTN {
  width: 200px;
  border-radius: 3px;
  background: #cccccc;
  font-weight: normal;
  border: solid 1px #aaaaaa;
}

.switchBTN:hover {
  background: #aaaaaa;
  font-weight: bold;
  border: solid 1px #888888;
}



.tabBTN {
  width: 200px;
  height: 24px;
  color: #ffffff;
  border-radius:  4px;
  background: #333333;
  font-weight: normal;
  border: solid 1px #666666;
  font-size: 11pt;
  margin-bottom: 2px;
  margin-left: 10px;
  background: linear-gradient(#333333, #444444, #333333);
}

.tabBTN:hover {
  background: #999999;
  color: #000000;
  font-weight: bold;
  border: solid 1px #888888;
  background: linear-gradient(#999999, #aaaaaa, #999999);
}

.menuBG {
  background: #000000;
  background: linear-gradient(#333333, #aaaaaa);
   padding-top: 5px;
}


      
.cpBTN {
  font-size: 8pt;
  font-weight: bold;
  color: #666666;
  cursor: pointer;
  margin-top: 10px;
}

.cpBTN:hover {
  color: #000000;
}




/**********************************************/
/*                                            */
/*          Flag Dropdown Styling             */
/*                                            */
/**********************************************/

.is-dropbtn {
    background-color: transparent;
    color: white;
    padding-left: 10px;
    padding-right: 10px;
    font-size: 16px;
    border: none;
    cursor: pointer;
}

.is-dropdown {
    position: relative;
    display: inline-block;
}

.is-dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 0px;
    box-shadow: 0px 8px 16px 
        0px rgba(0, 0, 0, 0.2);
    z-index: 1;
    border: solid 1px #999999;
}

.is-dropdown-content a {
    color: black;
    /*padding: 12px 16px;*/
    padding: 8px 10px;
    text-decoration: none;
    display: block;
}

.is-dropdown-content a:hover {
    background-color: #ffffff;
    cursor: pointer;
}

.is-dropdown:hover .is-dropdown-content {
    display: block;
}

.is-dropdown:hover .is-dropbtn {
  /* background-color: #ffffff;*/
}

/**********************************************/



/**********************************************/
/*                                            */
/*            Checkbox Styling                */
/*                                            */
/**********************************************/

.switch {
  position: relative;
  display: inline-block;
  width: 50px;
  height: 16px;
}

.switch input { 
  opacity: 0;
  width: 0px;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0px;
  right: 0px;
  bottom: 0;
/*  background-color: #ccc;*/
  background-color: #990000;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 12px;
  width: 12px;
  left: 4px;
  bottom: 2px;
  background-color: white;
  -webkit-transition: .2s;
  transition: .2s;
}

input:checked + .slider {
  background-color: #006600;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(30px);
  -ms-transform: translateX(30px);
  transform: translateX(30px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}

.cbON-YES {
  color: #006600;
  font-weight: bold;
  cursor: pointer;
}

.cbON-NO {
  color: #990000;
  font-weight: bold;
  cursor: pointer;
}

.cbOFF {
  color: #cccccc;
  font-weight: bold;
  cursor: pointer;
}

.cbSPAN {
  cursor: pointer;
}



.responseDIV_TopicID {
  margin-left: 100px;
  margin-top: 4px;
  margin-bottom: 20px;
  display: none;
}

.ViewResponsesBTN_TopicID, .AddResponseBTN_TopicID {
  float: right;
}


/**********************************************/





/**********************************************/
/*                                            */
/*             Menu Navigation                */
/*                                            */
/**********************************************/

   .navDIV {
       margin: 0;
       padding: 0;
       padding-right: 0px;
       float: right;
       width: 150px;
    }
    .navMenuUL {
      list-style-type: none;
      margin: 0;
      padding: 0;
    }
    #navID ul {
      list-style:none;
      position:relative;
      float:left;
      margin:0;
      padding:0;
      z-index: 9999;
    }
    #navID ul a {
      display:block;
      text-decoration:none;
    }
    #navID ul li {
      position:relative;
      background:#effafe;
      float:left;
      margin:0;
      padding:0;
      text-align: center;
    }
    #navID ul ul li {
      border: solid 1px #cccccc;
      width: 100%;
      text-align: center;
      padding: 0px;
      padding-left: 0px;
      padding-right: 0px;
      margin-left: 0;
    }
    #navID ul ul li a {
      text-align: center;
    }
    #navID ul li.navLI_this {
      font-weight: bold;
      padding: 0px;
      padding-left: 0px;
      padding-right: 0px;
    }
    #navID ul li:hover {
      background: effafe;
    }
    #navID ul ul {
      display:none;
      position:absolute;
      top:100%;
      left:0;
      padding:0;
      padding-top: 6px;
    }
    #navID ul li:hover {
    }
    #navID ul li:hover > ul {
      display:block;
    }
    
    #navID ul li a:hover {
      background: transparent;
    }
    
    #LogoutConfirmDIV {
      display: none;
      float: right;
      background-color: #333333;
      color: #cccccc;
      border: solid 1px #000000;
      padding: 4px;
    }



/**********************************************/
/*                                            */
/*              Media Controls                */
/*                                            */
/**********************************************/

@media only screen and (min-width: 850px) {

  #main-page-div {
    width: 800px;
  }

}

@media only screen and (max-width: 849px) and (min-width: 650px) {

  #main-page-div {
    width: 600px;
  }

}

@media only screen and (max-width: 649px) and (min-width: 450px) {

  #main-page-div {
    width: 400px;
  }

}

@media only screen and (max-width: 449px) {

  #main-page-div {
    width: 300px;
  }

}