* { margin:0; }
  
  body    
  {
	  background:url(img/88.jpg) no-repeat;
	  background-size:cover;
	  font-size: 12px;
	  width:100%;
	  font-family: "Helvetica Neue", "Lucida Grande", "Segoe UI", Arial, Helvetica, Verdana, sans-serif;
	  margin: 0px;
	  padding: 0px;
	  color:  #696969;
	  
  }
  #main {
	  width: 1260px;
	  float:inherit;
	 min-height:720px;
	  margin: 0px auto 0px auto;
  }
  
  #wheat-image {
	  width: 100%;
	  height:relative;
	  min-height: 800px;
	  margin:auto;
	  margin-top:0px;
	  background-position:center;
	  background-size:880px 800px;
	  background-repeat:no-repeat;
	  background-image:url("img/final2.png");
  }
  
  
  .sidebar_left{
			  float: left; 
			  width: 410px;
			
			  margin-top:0px;
			  min-height: 500px;
			  
		  }
		  .sidebar_left .nav{
			  padding: 10px;
		  }
		  .nav ul{
			  list-style: none; 
			  padding: 0px; 
			  margin: 0px;
		  }
		  .nav ul li{
			  margin-bottom: 5px; 
		  }
		  .nav ul li a{
			  color: #3d677e;
		  }
		  .nav ul li a:hover{
			  text-decoration: none;
		  }
		  
		  
		  
		  .content{
			  float: left;
			  width: 420px;
			  padding:10px;
			  min-height: 500px;
		  }
		  .content .section{
			  padding: 10px;
		  }
		  .content h2{
			  font-size: 16px; 
			  margin: 0px;
		  }
		  
		  
		  
		  .clearfix{
			  clear: both;
		  }
		  
		  
		  
		  .footer{
			  background-color: transparent; 
			  color:black;
			  background-size:cover;
			  width:100%;;
			  margin-top:100px;
			  padding: 10px 0;
			  clear:both;
		  }
		  .footer p{
			  text-align: center; 
			  margin: 5px;
		  }
		  .sidebar_right{
			  float: right; 
			  width: 410px;
			  margin-top:0px;
			 
			  min-height: 170px;
			  
		  }
		  .sidebar_right .nav{
			  padding: 10px;
		  }
		  .nav ul{
			  list-style: none; 
			  padding: 0px; 
			  margin: 0px;
		  }
		  .nav ul li{
			  margin-bottom: 5px; 
		  }
		  .nav ul li a{
			  color: #3d677e;
		  }
		  .nav ul li a:hover{
			  text-decoration: none;
		  }
		  
  #sub ul{
	  background-color:#f9f9f9;
	   min-width: 160px; 
	   box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
	  float: left;
	  margin: 0;
	  padding: 0;
	  position: absoulte;
	  min-width: 15%;
	  background:#F0F0FF;
	  border-radius: 25px 25px 25px 25px;
	  border: 2px solid #004D40;
	  border-right-color: #006600;
	  border-bottom-color: #006600;
	  transition: border-radius .2s;
  }
  
  #sub li {
	  float: left;
	  margin: 0;
	  padding: 0;
	  position: relative;
	  list-style:none;
	  min-width: 15%;
	  background:#F0F0FF;
	  box-shadow: 0 0 8px rgba(0,0,0,.2);
	  transition: border-radius .2s;
  }
  
  #sub li a {
	  
	  color: #444;
	  font: bold 11px/25px sans-serif;
	  padding: 0 10px;
	  list-style:none;
	  text-align: center;
	  text-decoration: none;
	  -webkit-transition: all .25s ease;
		 -moz-transition: all .25s ease;
		  -ms-transition: all .25s ease;
		   -o-transition: all .25s ease;
			  transition: all .25s ease;
  }
  #sub li a:hover {
	  
	  
  }
  
  
		  
		  
 
  
  /* Clearfix */
  
  .cf:after, .cf:before {
	  content:"";
	  display:table;
  }
  .cf:after {
	  clear:both;
  }
  
  .central-content {
  
  width:230px;
  height:200px;
  margin-left:13px;
  background:url(img/trans.png);
  padding:2px 2px 2px 2px;
  border-radius:12px 12px 12px 12px;
  border: 2px solid #006600;
  overflow:scroll;
  overflow-x:hidden;
  overflow-y:hidden;

  
  
  }
  
  .connected-counter {
	  width:relative;
	  margin-top:75px;
	  height:relative;
	  background:url(img/trans.png);
	  background-color:transparent;
	  border-radius:20px 20px 20px 20px;
	  border:2px solid #006600;
  }
  
  
  
  .login {
	  margin-left:160px;
  width: 240px;
  
  }
  .login-screen {
  background:url(img/trans.png);
  border:2px solid #006600;
  border-radius:10px;
  height:200px;
  padding: 2px 2px 2px 2px;
  }
  
  .login-form {
  text-align: center;
  }
  .control-group {
  margin-bottom: 5px;
  }
  
  .ddl_dist {
  text-align: center;
  background-color: white;
  margin:5px;
  border: 2px solid transparent;
  border-radius: 3px;
  font-size: 14px;
  height:30px;
  font-weight: 150;
  width: 40px;
  transition: border .5s;
  }
	  
  
  input {
  text-align: center;
  background-color:white;
  color:black;
  border: 2px solid transparent;
  border-radius: 3px;
  font-size: 13px;
  font-weight: 200;
  padding: 5px 0;
  margin-left:5px;
  margin-right:5px;
  width: 200px;
  transition: border .5s;
  }
  .login-title {
  text-align: center;
  color: black;
  margin-top:3px;
  margin-bottom:3px;
  font:Verdana, Geneva, sans-serif;
  -webkit-font-smoothing:antialiased;
  font:bold;
  }
  
  input:focus {
  border: 2px solid #3498DB;
  box-shadow: none;
  }
  
  .btn-login {
	border: 2px solid transparent;
	background: #006600;
	color: #ffffff;
	height:15px;
	font-size: 14px;
	text-align:center;
	line-height: 15px;
	padding: 5px 0;
  margin-left:15px;
  margin-right:5px;
  width: 200px;
	text-decoration: none;
	text-shadow: none;
	border-radius: 3px;
	box-shadow: none;
	transition: 0.25s;
	display: block;
	
  }
  
  .btn-login:hover {
	background-color: #029a02;
  }
  
  .login-link {
	font-size: 14px;
	color: #006600;
	  margin-top: 3px;
	  margin-left:2px;
	  margin-bottom:3px;
  }
  .login-link:hover {
   color:black;
  }
  
  .right-bottom-info {
   margin-left:0px;
   width:300px;
   color:white;
  
  }
  
  
  .dropbtn {
	  margin: 0;
	  font: bold 17px/35px sans-serif;
	  padding: 0 10px;
	  text-align: center;
	  text-decoration: none;
	  position: relative;
	  cursor:pointer;
	  min-width: 15%;
	  background:#F0F0FF;
	  border-radius: 25px 25px 25px 25px;
	  border: 2px solid #004D40;
	  box-shadow: 0 0 8px rgba(0,0,0,.2);
	  border-right-color: #006600;
	  border-bottom-color: #006600;
	  transition: border-radius .2s;
	  
  }
  
  .dropdown {
	  position:relative;
	  display:inline-block;
  }
  
  .dropdown-content {
	  display:none;
	  
	  position:absolute;
	  font: bold 16px;
	  text-align:center;
	  top:100%;
	  background-color:#ffffff;
	  left:0;
	  min-width:150px;
	  border-radius:25px 25px 25px 25px;
	  border:2px solid #006600;
	  box-shadow:0 0 8px rbga(0,0,0,.2);
	  z-index: 99999;
	  -webkit-transition: all .25s ease;
		 -moz-transition: all .25s ease;
		  -ms-transition: all .25s ease;
		   -o-transition: all .25s ease;
			  transition: all .25s ease;
	  
	  
  }
  
  .dropdown-content a {
	  color:black;
	  padding:5px 5px;
	  display:block;
	  text-decoration:none;
	  
	  
  }
  
  .dropdown-content a:hover {
	  color:#006600;
  }
  .dropdown:hover .dropdown-content {
	  display:block;
	  z-index:9999;
	  transform:translateX(260px);
	  transition-delay:0s;
	  visibility:visible;
	  opacity:1;
	  
  }
  
  .dropdown: hover .dropbtn {
	  
	  background-color:white;
	  border-radius: 25px 25px 25px 0px;
  }
  .dropbtn: hover {
	  background-color:white;
	  border-radius: 25px 25px 25px 0px;
  }
  
  
  
  .dropdown-content-right {
	  display:none;
	  
	  position:absolute;
	  font: bold 16px;
	  text-align:center;
	  top:100%;
	  background-color:#ffffff;
	  left:0;
	  min-width:150px;
	  border-radius:25px 25px 25px 25px;
	  border:2px solid #006600;
	  box-shadow:0 0 8px rbga(0,0,0,.2);
	  z-index: 99999;
	  -webkit-transition: all .25s ease;
		 -moz-transition: all .25s ease;
		  -ms-transition: all .25s ease;
		   -o-transition: all .25s ease;
			  transition: all .25s ease;
	  
	  
  }
  
  .dropdown-content-right a {
	  color:black;
	  padding:5px 5px;
	  display:block;
	  text-decoration:none;
	  
	  
  }
  
  .dropdown-content-right a:hover {
	  color:#006600;
  }
  .dropdown:hover .dropdown-content-right {
	  display:block;
	  z-index:9999;
	  transform:translateX(50px);
	  transition-delay:0s;
	  visibility:visible;
	  opacity:1;
	  
  }
  
  .dropdown: hover .dropbtn {
	  
	  background-color:white;
	  border-radius: 25px 25px 25px 0px;
  }
  .dropbtn: hover {
	  background-color:white;
	  border-radius: 25px 25px 25px 0px;
  }
  
  .blink_me {
	  -webkit-animation-name: blinker;
	  -webkit-animation-duration: 1s;
	  -webkit-animation-timing-function: linear;
	  -webkit-animation-iteration-count: infinite;
  
	  -moz-animation-name: blinker;
	  -moz-animation-duration: 1s;
	  -moz-animation-timing-function: linear;
	  -moz-animation-iteration-count: infinite;
  
	  animation-name: blinker;
	  animation-duration: 1s;
	  animation-timing-function: linear;
	  animation-iteration-count: infinite;
  }
  
  .blink_me:hover {
	  color:black;
	  animation-name:none;
	  cursor:pointer;
  }
  
  @-moz-keyframes blinker {  
	  0% { opacity: 1.0; color: #006600;}
	  50% { opacity: 1.0; }
	  100% { opacity: 1.0; color:#F00; }
  }
  
  @-webkit-keyframes blinker {  
	  0% { opacity: 1.0; color: #006600; }
	  50% { opacity: 1.0; }
	  100% { opacity: 1.0; color:#F00;}
  }
  
  @keyframes blinker {  
	  0% { opacity: 1.0; color:black; }
	  20% { opacity: 1.0; color:blue; }
	  40% { opacity: 1.0; color:#006600; }
	  60% { opacity: 1.0; color:brown; }
	  80% { opacity: 1.0; color:red; }
	  100% { opacity: 1.0; color:brown;}
  }
  
  
  a.button {
	  background-color:white;
	  color:black;
	  border-radius:25px;
	  border:2px solid #006600;
	  padding:8px 20px;
	  text-align:center;
	  text-decoration:none;
	  display:inline-block;
	  font-size:14px;
	  -webkit-transition-duration:0.4s;
	  transition-duration:0.4s;
	  cursor:pointer;
  }
  
  a.button:hover {
	  background-color:#006600;
	  color:white;
	  box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
  }
  
  .moving_text {
	  margin-top:25px;
	  margin-bottom:25px;
	  margin-left:50px;
	  margin-right:50px;
	  font-size:18px;
	  cursor:pointer;
	  color:black;
	  background-color:transparent;
	  
  }
  
  /* Silder css code start */
  
  #sliderFrame, #sliderFrame div {
	  box-sizing: content-box;
  }
  #sliderFrame 
  {
	  width:250px;
	  margin:0 auto;
	  border-radius:15px;
	  border:2px solid #006600;
	  background-size:cover !important;
	  background-position:center center !important;
	  margin-left:0px; /*center-aligned*/
  }
  
  #slider, #slider .sliderInner {
	  width:250px;height:200px;/* Must be the same size as the slider images */
	  border-radius:15px;
	  background-size:cover !important;
	  background-position:center center !important;
  }
  #imagesize {
	  width:250px;
	  height:auto;
	  min-width:200px;
	  border-radius:15px;
  }
  
  #slider {
	   background-size:cover !important;
	  background-position:center center !important;
	  background-color:white;
	  position:relative;
	  border-radius:15px;
	  margin:0 auto; /*center-aligned*/
	  transform: translate3d(0,0,0);
	  box-shadow: 0px 1px 5px #999999;
  }
  
  /* the link style (if an image is wrapped by a link) */
  #slider a.imgLink, #slider .video {
	  z-index:2;
	  cursor:pointer;
	  position:absolute;
	  top:0px;left:0px;border:0;padding:0;margin:0;
	  width:100%;height:100%;
  }
  #slider .video {
	  background:transparent url(video.png) no-repeat 50% 50%;
  }
  
  /* Caption styles */
  #slider .mc-caption {
	  position:absolute;
	  width:100%;
	  height:auto;
	  padding:10px 0;/* 10px will increase the height.*/
	  left:0px;
	  bottom:0px;top:auto;
	  overflow:hidden;
	  font: bold 14px/20px Arial;
	  color:#EEE;
	  text-align:center;
	  background:rgba(0,0,0,0.3);
  }
  #slider .mc-caption a {
	  color:#FB0;
  }
  #slider .mc-caption a:hover {
	  color:#DA0;
  }
  
  
  /* ------ built-in navigation bullets wrapper ------*/
  #slider .navBulletsWrapper  {
	  top:187px;
	  text-align:center;
	  background:none;
	  position:relative;
	  z-index:3;
  }
  
  /* each bullet */
  #slider .navBulletsWrapper div 
  {
	  width:11px; height:11px;
	  font-size:0;color:White;/*hide the index number in the bullet element*/
	  background:transparent url(bullet.png) no-repeat 0 0;
	  display:inline-block; *display:inline; zoom:1;
	  overflow:hidden;cursor:pointer;
	  margin:0 6px;/* set distance between each bullet*/
  }
  
  #slider .navBulletsWrapper .active {background-position:0 -11px;}
  
  
  /* --------- Others ------- */
  
  #slider img, #slider>b, #slider a>b {
	  position:absolute; border:none; display:none;
  }
  
  #slider .sliderInner {
	  overflow:hidden;
	  position:absolute; top:0; left:0;
  }
  
  #slider>a, #slider video, #slider audio {display:none;}
  #slider div {-webkit-transform: translate3d(0,0,0);transform: translate3d(0,0,0);}
  
  
  /* Slider css code end here */
  
  
  .subpage-central {
	  width:960px;
	  margin-left:auto;
	  margin-right:auto;
	  alignment-adjust:central;
	  position:center;
	  border-radius:12px;
	  border:3px solid #006600;
	  background:url(img/trans.png);
	  background-position:inherit;
	  color:black;
	  margin-top:20px;
	  
  }
  
  .subpage-central ul a{
	  font-size:18px;
	  color:#006600;
	  text-align:center;
	  cursor:pointer;
	  margin-top:auto;
	  list-style-type:none;
	  text-decoration:none;
	  
  }
  
  .subpage-central ul a:hover {
	  color:black;
	  
  }
  
    table tr a{
	  font-size:16px;
	  color:#006600;
	  text-align:center;
	  cursor:pointer;
	  list-style-type:disc;
	  text-decoration:none;
	  
  }
  
  table tr a:hover {
	  color:black;

	  
  }

  
  /* Slideshow container */
.slideshow-container {
  max-width: 640px;
  position: relative;
  margin: auto;
}

/* Caption text */
.text {
  color: #ffffff;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
  color: white;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot {
  height: 8px;
  width: 8px;
  margin: 0 1px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active {
  background-color: #717171;
}

/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}

@-webkit-keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}
.tooltip {
    position: relative;
    display: inline-block;
    
}

.tooltip .tooltiptext {
    visibility: hidden;	
	background: #333;
    background: rgba(0,0,0,.9);
    content: attr(title);
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 15px 15px 15px 15px;
    position: absolute;
    z-index: 1;
    top: 100%;
    left: 38%;
    margin-left: -60px;
}


.tooltip .tooltiptext::after {
    content: "";
    position: absolute;
	content: attr(title);
    bottom: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent black transparent;
}

.tooltip:hover .tooltiptext {
    visibility: visible;
	
}