body, html { height:100%;}
BODY { margin-top: 0; margin-left: 0; margin-right: 0; margin-bottom: 0; background-color: #2F2F2F; font-family: Arial; font-size: 12px; }

H2
{
	font-size:25px;
	font-weight:normal;	
}

H3
{
	font-size:16px;
	font-weight:600;
	color:#F5FF00;	
}

H4
{
	font-size:12px;
	font-weight:600;	
	}

img {
    max-width: 100%;
    height: auto;
    border:0px;
}

.main { 
width:100%;height:100%; position:relative;
}

.title { float: left; margin-top: 20px; margin-left: 15px; vertical-align: middle; width:100%; }
    .title > .right-title { line-height:unset; }
    .left-title { font-size: 22px; color: #F5FF00; float: left; width:100%; text-align: center; }
.right-title {  line-height: 39px; margin-top: 5px; }
    .right-title a { font-size: 15px; color: #F5FF00; }
.mobile-menu { display:none; }
#nav-toggle { font-size: 24px;}

.left-pane { float: left; max-width: 330px; background-color: #2F2F2F; height: 100%; display:block;}
.left-content { 
    width:100%;
    float:left;
    margin-top:28px;
}
    .left-content .menuitem { margin-left: 15px; margin-right: 15px; }

    .menuitem { float: left; width: 100%; margin-bottom: 5px; margin-top: 5px; font-size:9px; }
        .level0 { font-size: 12px; }

        .left-content-item { width: 100%; float: left; }

.right-pane { 
    height:100%;
   float:none;
   background-color: #000000;
   width:auto;
    overflow: hidden;
    overflow-y:auto;
}
.right-content { float: left; margin: 25px; margin-top: 10px; }

    .right-content div { 
        float:left;
        width:100%;
        margin-bottom:15px;
        color:#fff;
    }
    .right-content div img {
        border:solid 0px #fff;
        width:900px;
    }

.leftmenu TD, TABLE 
{
	background-color:#2F2F2F;
	font-family:Arial;
	font-weight:normal;
	font-size:14px;
	color:#FFFFFF;	
}

ul {
	position: relative;
	list-style: none;
	margin-left: 0;
	padding-left: 1.2em;
}
ul li:before {
	content: "-";
	position: absolute;
	left: 0;
}

A
{
	color:#FFFFFF;
	text-decoration:none;
	font-family:Arial;
	font-weight:600;
}

A:active
{
	text-decoration:none;
	font-family:Arial;
	font-weight:600;
}
.menuitem .menu-active a{ font-size: 9px!important;}

.menu-active { color: #F5FF00; text-decoration: none; font-family: Arial; font-weight: 600; margin-left: 25px; }
.level0 > .menu-active { margin-left: 14px; }
.level0 > a { margin-left: 14px; }
.level1 > a { margin-left: 25px; }

.linkMenuRed { color: #F5FF00; text-decoration: none; font-family: Arial; font-weight: 600; margin-left: 25px; }

.linkMenuBlue
{
	color:#7C7EB9;
	text-decoration:none;
	font-family:Arial;
	font-weight:600;
	font-size:14px;

}


.content TD, TABLE
{
	background-color:#000000;
	font-family:Arial;
	color:#FFFFFF;
	padding-top:0px;
	padding-left:0px;
	padding-right:0px;
	font-size:12px;
}

#text
{
  width:90%;
}


.content-copyright { 
    background-color:transparent;
    left:17px;bottom:4px;
    position:absolute;
}
.slick-slide > div > div { display:unset !important;}

.header, .footer { float:left; background-color: #2F2F2F; margin: 0 auto; height: 40px; margin-top: 15px;  text-align: center; }
.footer {  margin-top: 5px; background-color: #2F2F2F; }
.header-right { float: right; width: 111px; height: 40px; margin-top: 15px; padding-top: 13px; text-align: center; color: #F5FF00; font-size: 13px; border-left: solid 2px #F5FF00; }
    .header-right a { color: #F5FF00; font-weight: normal;}

.header-left { float: left; color:#F5FF00; width: 111px; height: 40px; margin-top: 15px; padding-top: 13px; text-align: center; font-size: 13px; border-right: solid 2px #F5FF00; }

   

.desktop-header { float: left; width: 100%; position: relative; padding-bottom: 5px; border-bottom: solid 2px black; }
.mobile-header { display:none;}
.footer-left { float: left; border-right: solid 2px #F5FF00; text-align:center; }
.footer-right { float: right; border-left: solid 2px #F5FF00; height:40px;}


 /* Style the Image Used to Trigger the Modal */
.imgdetail {
  border-radius: 5px;
  cursor: pointer;
  transition: 0.3s;
}

.imgdetail:hover {opacity: 0.8;}

/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
   /* padding-top: 100px; Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
}

/* Modal Content (Image) */
.modal-content {
  margin: auto;
  display: block;
  width: 100%;
  
}

/* Caption of Modal Image (Image Text) - Same Width as the Image */
#caption {
  margin: auto;
  display: block;
  width: 80%;
  max-width: 700px;
  text-align: center;
  color: #ccc;
  padding: 10px 0;
  height: 150px;
}

/* Add Animation - Zoom in the Modal */
.modal-content, #caption {
  animation-name: zoom;
  animation-duration: 0.6s;
}

@keyframes zoom {
  from {transform:scale(0)}
  to {transform:scale(1)}
}

/* The Close Button */
.close {
  position: absolute;
  top: 15px;
  right: 35px;
  color: #f1f1f1;
  font-size: 40px;
  font-weight: bold;
  transition: 0.3s;
}

.close:hover,
.close:focus {
  color: #bbb;
  text-decoration: none;
  cursor: pointer;
}

/* 100% Image Width on Smaller Screens */
@media only screen and (max-width: 700px){
  .modal-content {
    width: 100%;
  }
} 

/* MOBILE VERSION */
@media only screen and (max-width:900px) {
    .mobile-header { float: left; width: 100%; position: relative; display: block; background-color: #2F2F2F; margin-top:5px; border-bottom: solid 2px #000;}
    .mobile-left { float: left; font-size: 22px; color: #F5FF00; margin-right: 10px; margin-left: 10px; padding-right: 10px; border-right: solid 2px #F5FF00; }
        .mobile-left a { color: #F5FF00; font-weight: normal; }
        .mobile-right { float:left; height:30px;}
            .mobile-right a { color: #F5FF00; line-height: 30px; font-weight: normal; }
    .mobile-bottom { float: left; width: 100%; padding-right: 10px; padding-left: 10px; margin-top:10px; margin-bottom:10px;}
        .mobile-bottom a { color: #F5FF00; font-weight: normal; }
    .footer-right { display: none; }
    .footer { border-left: unset; border-right: unset; width: 100% !important; }
    .footer-left { border-right: unset; float:left; width:100% !important; }
    .desktop-header { display: none; }
        .left-pane { min-height: 60px; height: unset; width: 100%; }
        .left-content { display: none; }
        .right-pane { float: left; }
        .mobile-menu { float: right; top: 15px; right: 31px; display: block; position:absolute;}
        .content-copyright { background-color: transparent; left: unset; bottom: unset; position: unset; float:left;width:100%; height:25px; }
    }