html,body{width:100%;height:100%;padding:0;background:#fff;margin:0;font-family:verdana}
a { text-decoration:none;color:#000; }
.container { width:100%; margin:0 auto; padding-top:4%; }

#bar { width:100%; height:4%; padding:15px 0; background:url(../imagemap/bar.png) repeat-x;background-size: contain; }
#agribar { width:100%; height:4%; padding:1px 0; background:url(../imagemap/bar.png) repeat-x;background-size: contain; }
#container { margin:0 auto;text-align: center; }

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

/*-------LOGIN STARTS HERE -------*/

/* Login Container (default to float:right) */
#loginContainer {
   
    font-size:16px;
	
}

/* Login Button */
#loginButton { 
    display:inline-block;  
    background:#d2e0ea url(../imagemap/buttonbgmenu.png) repeat-x; 
    border:1px solid #899caa; 
    border-radius:3px;
    -moz-border-radius:3px;
    position:relative;
    z-index:30;
    cursor:pointer;
}

/* Login Button Text */
#loginButton span {
    color:#445058; 
    font-size:12px; 
    font-weight:bold; 
    text-shadow:1px 1px #fff; 
    padding:7px 38px 9px 10px;
    background:url(../imagemap/loginArrow.png) no-repeat 178px 11px;
    display:block
}

#loginButton:hover {
    background:url(../imagemap/buttonbgHover.png) repeat-x;
}

/* Login Box */
#loginBox {
    position:absolute;
   /* top:34px;*/
    right:0;
    display:none;
    z-index:29;
	width:100%;
	height:50%;
}

/* If the Login Button has been clicked */    
#loginButton.active {
    border-radius:3px 3px 0 0;
}

#loginButton.active span {
    background-position:178px -72px;
}

/* A Line added to overlap the border */
#loginButton.active em {
    position:absolute;
    width:100%;
    height:1px;
    background:#d2e0ea;
    bottom:-1px;
}

/* Login Form */
#loginForm {
    /*width:248px; */
   
    padding:6px;
	margin: 0 auto;
    width: 40%;
	
}

#loginForm fieldset {
    margin:0 0 12px 0;
    display:block;
    border:0;
    padding:0;
}

fieldset#body {
    background:#fff;
    border-radius:3px;
    -moz-border-radius:3px;
    padding:10px 13px;
    margin:0;
}

#loginForm #checkbox {
    width:auto;
    margin:1px 9px 0 0;
    float:left;
    padding:0;
    border:0;
    *margin:-3px 9px 0 0; /* IE7 Fix */
}

#body label {
    color:#3a454d;
    margin:9px 0 0 0;
    display:block;
    float:left;
}

#loginForm #body fieldset label {
    display:block;
    float:none;
    margin:0 0 6px 0;
}

/* Default Input */
#loginForm input {
    width:92%;
    border:1px solid #899caa;
    border-radius:3px;
    -moz-border-radius:3px;
    color:#3a454d;
    font-weight:bold;
    padding:8px 8px;

    font-size:12px;
}

/* Sign In Button */
#loginForm #login {
    width:auto;
    float:left;
    background:#339cdf url(../imagemap/loginbuttonbg.png) repeat-x;
    color:#fff;
    padding:7px 10px 8px 10px;
    text-shadow:0px -1px #278db8;
    border:1px solid #339cdf;
    box-shadow:none;
    -moz-box-shadow:none;
    -webkit-box-shadow:none;
    margin:0 12px 0 0;
    cursor:pointer;
    *padding:7px 2px 8px 2px; /* IE7 Fix */
}

/* Forgot your password */
#loginForm span {
    text-align:center;
    display:block;
    padding:7px 0 4px 0;
}

#loginForm span a {
    color:#3a454d;
    text-shadow:1px 1px #fff;
    font-size:12px;
}

input:focus {
    outline:none;
}

#loginForm ul li{border-top: 1px solid #ABBECC;
    float: left;
	font-weight: normal;
    list-style: none outside none;
    padding: 10px 0;
    width: 50%;
	font-size: 14px;}
	
	.border_none{border:none!important}

#loginForm ul{
    background: none repeat scroll 0 0 #D2E0EA;
    border: 1px solid #899CAA;
    border-radius: 3px 0 3px 3px;
	float: left;
	margin-top: -7px;
    padding: 20px;}
	
	#loginForm ul.sub {
    background: none repeat scroll 0 0 transparent !important;
    border: medium none !important;
    border-radius: 0 0 0 0 !important;
    float: left !important;    
    margin-top: -7px;
    padding: 10px 0 6px;
    width: 47%;
}

.margn_40{margin-right:17px;width: 47%!important;}
.margn_47{width: 47%!important}

    #loginForm ul.sub.margn{margin-right: 17px;}

	.sub li{ float: none!important;width: 100% !important;}
	
	.padng_no{padding: 8px 0 0!important}

@media only screen and (max-width: 768px){
	
	#interactiveForm {   
    margin: 0;
    width: 100%;
}

	.hide{display:none}

	#loginForm ul li{width:100% !important}

	#loginForm ul.sub {width:100%;padding: 20px 0 6px;}

}

@media only screen and (max-width:480px){
	#loginForm ul {margin-left: -14px;width: 166px !important;}

	#loginForm ul.sub {margin-left:0px}

	}

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


    #loginForm ul{margin-left:-47px;width: 166px !important;}
	
	#loginForm ul.sub {margin-left:0px}
}
 /* Giving a font-family and Size to give good look */
    body{
    font-family: Verdana,Brushstroke, fantasy;
    font-size:14px;
    }

    .labels {
       color: Gold ;
       font-family: "Lucida Grande", "Arial", sans-serif;
       font-weight: bold;
       text-align: center;
       width: 60px;
       white-space: nowrap;
     }
     #table1 {
     border:1px solid #999;
            background-color:black;
      }
      #table1 td {
            width:999px;
        height:10px;
        border:1px solid #000;
       text-align:center;
     }
    #table1 label {
       width:999px;
        line-height:10px;
        display:inline block;
     }
     .cssClass {
               color: #8B0000;
                   font-size:20px;
                   }


/* Login Button */
#loginButton { 
    display:inline-block;  
    background:#d2e0ea url(../imagemap/buttonbgmenu.png) repeat-x; 
    border:1px solid #899caa; 
    border-radius:3px;
    -moz-border-radius:3px;
    position:relative;
    z-index:30;
    cursor:pointer;
}

/* Login Button Text */
#loginButton span {
    color:#445058; 
    font-size:12px; 
    font-weight:bold; 
    text-shadow:1px 1px #fff; 
    padding:7px 38px 9px 10px;
    background:url(../imagemap/loginArrow.png) no-repeat 178px 11px;
    display:block
}

#loginButton:hover {
    background:url(../imagemap/buttonbgHover.png) repeat-x;
}

/* Login Box */
#loginBox {
    position:absolute;
    top:34px;
    right:0;
    display:none;
    z-index:29;
	width:100%;
	height:50%;
}

/* If the Login Button has been clicked */    
#loginButton.active {
    border-radius:3px 3px 0 0;
}

#loginButton.active span {
    background-position:178px -72px;
}

/* A Line added to overlap the border */
#loginButton.active em {
    position:absolute;
    width:100%;
    height:1px;
    background:#d2e0ea;
    bottom:-1px;
}

/* Login Form */
#loginForm {
    /*width:248px; */
   
    padding:6px;
	margin: 0 auto;
    width: 40%;
	
}

#loginForm fieldset {
    margin:0 0 12px 0;
    display:block;
    border:0;
    padding:0;
}

fieldset#body {
    background:#fff;
    border-radius:3px;
    -moz-border-radius:3px;
    padding:10px 13px;
    margin:0;
}

#loginForm #checkbox {
    width:auto;
    margin:1px 9px 0 0;
    float:left;
    padding:0;
    border:0;
    *margin:-3px 9px 0 0; /* IE7 Fix */
}

#body label {
    color:#3a454d;
    margin:9px 0 0 0;
    display:block;
    float:left;
}

#loginForm #body fieldset label {
    display:block;
    float:none;
    margin:0 0 6px 0;
}

/* Default Input */
#loginForm input {
    width:92%;
    border:1px solid #899caa;
    border-radius:3px;
    -moz-border-radius:3px;
    color:#3a454d;
    font-weight:bold;
    padding:8px 8px;

    font-size:12px;
}

/* Sign In Button */
#loginForm #login {
    width:auto;
    float:left;
    background:#339cdf url(../imagemap/loginbuttonbg.png) repeat-x;
    color:#fff;
    padding:7px 10px 8px 10px;
    text-shadow:0px -1px #278db8;
    border:1px solid #339cdf;
    box-shadow:none;
    -moz-box-shadow:none;
    -webkit-box-shadow:none;
    margin:0 12px 0 0;
    cursor:pointer;
    *padding:7px 2px 8px 2px; /* IE7 Fix */
}

/* Forgot your password */
#loginForm span {
    text-align:center;
    display:block;
    padding:7px 0 4px 0;
}

#loginForm span a {
    color:#3a454d;
    text-shadow:1px 1px #fff;
    font-size:12px;
}

input:focus {
    outline:none;
}

#loginForm ul li{border-top: 1px solid #ABBECC;
    float: left;
	font-weight: normal;
    list-style: none outside none;
    padding: 10px 0;
    width: 50%;
	font-size: 14px;}
	
	.border_none{border:none!important}

#loginForm ul{
    background: none repeat scroll 0 0 #D2E0EA;
    border: 1px solid #899CAA;
    border-radius: 3px 0 3px 3px;
	float: left;
	margin-top: -7px;
    padding: 20px;}
	
	#loginForm ul.sub {
    background: none repeat scroll 0 0 transparent !important;
    border: medium none !important;
    border-radius: 0 0 0 0 !important;
    float: left !important;    
    margin-top: -7px;
    padding: 10px 0 6px;
    width: 47%;
}

.margn_40{margin-right:17px;width: 47%!important;}
.margn_47{width: 47%!important}

    #loginForm ul.sub.margn{margin-right: 17px;}

	.sub li{ float: none!important;width: 100% !important;}
	
	.padng_no{padding: 8px 0 0!important}

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

	.hide{display:none}

	#loginForm ul li{width:100% !important}

	#loginForm ul.sub {width:100%;padding: 20px 0 6px;}

}

@media only screen and (max-width:480px){
	#loginForm ul {margin-left: 0;
width: 100% !important;padding:8px}

	#loginForm ul.sub {margin-left:0px}

	}

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


    #loginForm ul{margin-left:0;width: 100% !important;}
	
	#loginForm ul.sub {margin-left:0px}
}
 /* Giving a font-family and Size to give good look */
    body{
    font-family: Verdana,Brushstroke, fantasy;
    font-size:14px;
    }

    .labels {
       color: Gold ;
       font-family: "Lucida Grande", "Arial", sans-serif;
       font-weight: bold;
       text-align: center;
       width: 60px;
       white-space: nowrap;
     }
     #table1 {
     border:1px solid #999;
            background-color:black;
      }
      #table1 td {
            width:999px;
        height:10px;
        border:1px solid #000;
       text-align:center;
     }
    #table1 label {
       width:999px;
        line-height:10px;
        display:inline block;
     }
     .cssClass {
               color: #8B0000;
                   font-size:20px;
                   }


/* Login Button */
#interactiveButton { 
    display:inline-block;  
    background:#d2e0ea url(../imagemap/buttonbgmenu.png) repeat-x; 
    border:1px solid #899caa; 
    border-radius:3px;
    -moz-border-radius:3px;
    position:relative;
    z-index:30;
    cursor:pointer;
}

/* Login Button Text */
#interactiveButton span {
    color:#445058; 
    font-size:12px; 
    font-weight:bold; 
    text-shadow:1px 1px #fff; 
    padding:7px 38px 9px 10px;
    background:url(../imagemap/loginArrow.png) no-repeat 178px 11px;
    display:block
}

#interactiveButton:hover {
    background:url(../imagemap/buttonbgHover.png) repeat-x;
}

/* Login Box */
#interactiveBox {
    position:absolute;
  top:34px;
    right:0;
    display:none;
    z-index:29;
	width:100%;
	height:50%;
}

/* If the Login Button has been clicked */    
#interactiveButton.active {
    border-radius:3px 3px 0 0;
}

#interactiveButton.active span {
    background-position:178px -72px;
}

/* A Line added to overlap the border */
#interactiveButton.active em {
    position:absolute;
    width:100%;
    height:1px;
    background:#d2e0ea;
    bottom:-1px;
}

/* Login Form */
#interactiveForm {
    /*width:248px; */
   
    padding:6px;
	margin: 0 auto;
    width: 40%;
	
}

#interactiveForm fieldset {
    margin:0 0 12px 0;
    display:block;
    border:0;
    padding:0;
}



#interaForm #checkbox {
    width:auto;
    margin:1px 9px 0 0;
    float:left;
    padding:0;
    border:0;
    *margin:-3px 9px 0 0; /* IE7 Fix */
}

#interactiveForm #body fieldset label {
    display:block;
    float:none;
    margin:0 0 6px 0;
}

/* Default Input */
#interactiveForm input {
    width:92%;
    border:1px solid #899caa;
    border-radius:3px;
    -moz-border-radius:3px;
    color:#3a454d;
    font-weight:bold;
    padding:8px 8px;

    font-size:12px;
}

/* Sign In Button */
#interactiveForm #login {
    width:auto;
    float:left;
    background:#339cdf url(../imagemap/loginbuttonbg.png) repeat-x;
    color:#fff;
    padding:7px 10px 8px 10px;
    text-shadow:0px -1px #278db8;
    border:1px solid #339cdf;
    box-shadow:none;
    -moz-box-shadow:none;
    -webkit-box-shadow:none;
    margin:0 12px 0 0;
    cursor:pointer;
    *padding:7px 2px 8px 2px; /* IE7 Fix */
}

/* Forgot your password */
#interactiveForm span {
    text-align:center;
    display:block;
    padding:7px 0 4px 0;
}

#interactiveForm span a {
    color:#3a454d;
    text-shadow:1px 1px #fff;
    font-size:12px;
}



#interactiveForm ul li{border-top: 1px solid #ABBECC;
    float: left;
	font-weight: normal;
    list-style: none outside none;
    padding: 10px 0;
    width: 50%;
	font-size: 14px;}
	
	.border_none{border:none!important}

#interactiveForm ul{
    background: none repeat scroll 0 0 #D2E0EA;
    border: 1px solid #899CAA;
    border-radius: 3px 0 3px 3px;
	float: left;
	margin-top: -7px;
    padding: 20px;}
	
	#interactiveForm ul.sub {
    background: none repeat scroll 0 0 transparent !important;
    border: medium none !important;
    border-radius: 0 0 0 0 !important;
    float: left !important;    
    margin-top: -7px;
    padding: 10px 0 6px;
    width: 47%;
}



#interactiveForm ul.sub.margn{margin-right: 17px;}

	

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

	.hide{display:none}

	#interactiveForm ul li{width:100% !important}

	#interactiveForm ul.sub {width:100%;padding: 20px 0 6px;}

}

@media only screen and (max-width:480px){
	#interactiveForm ul {margin-left:0;width: 100% !important;}

	#interactiveForm ul.sub {margin-left:0px}

	}

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


    #interactiveForm ul{margin-left:0;width: 100% !important;}
	
	#interactiveForm ul.sub {margin-left:0px}
}

 #table2 {
 border:1px solid #999;
		background-color:black;
  }
  #table2 td {
		width:999px;
	height:10px;
	border:1px solid #000;
   text-align:center;
 }
#table2 label {
   width:999px;
	line-height:10px;
	display:inline block;
 }
 
 
/* Login Button */
#layerButton { 
    display:inline-block;  
    background:#d2e0ea url(../imagemap/buttonbgmenu.png) repeat-x; 
    border:1px solid #899caa; 
    border-radius:3px;
    -moz-border-radius:3px;
    position:relative;
    z-index:30;
    cursor:pointer;
}

/* Login Button Text */
#layerButton span {
    color:#445058; 
    font-size:12px; 
    font-weight:bold; 
    text-shadow:1px 1px #fff; 
    padding:7px 38px 9px 10px;
    background:url(../imagemap/loginArrow.png) no-repeat 178px 11px;
    display:block
}

#layerButton:hover {
    background:url(../imagemap/buttonbgHover.png) repeat-x;
}

/* Login Box */
#layerBox {
    position:absolute;
   top:34px;
    right:0;
    display:none;
    z-index:29;
	width:100%;
	height:50%;
}

/* If the Login Button has been clicked */    
#layerButton.active {
    border-radius:3px 3px 0 0;
}

#layerButton.active span {
    background-position:178px -72px;
}

/* A Line added to overlap the border */
#layerButton.active em {
    position:absolute;
    width:100%;
    height:1px;
    background:#d2e0ea;
    bottom:-1px;
}

/* Login Form */
#layerForm {
    /*width:248px; */
   
    padding:6px;
	margin: 0 auto;
    width: 40%;
	
}

#layerForm fieldset {
    margin:0 0 12px 0;
    display:block;
    border:0;
    padding:0;
}



#layerForm #checkbox {
    width:auto;
    margin:1px 9px 0 0;
    float:left;
    padding:0;
    border:0;
    *margin:-3px 9px 0 0; /* IE7 Fix */
}

#layerForm #body fieldset label {
    display:block;
    float:none;
    margin:0 0 6px 0;
}

/* Default Input */
#layerForm input {
    width:92%;
    border:1px solid #899caa;
    border-radius:3px;
    -moz-border-radius:3px;
    color:#3a454d;
    font-weight:bold;
    padding:8px 8px;

    font-size:12px;
}

/* Sign In Button */
#layerForm #login {
    width:auto;
    float:left;
    background:#339cdf url(../imagemap/loginbuttonbg.png) repeat-x;
    color:#fff;
    padding:7px 10px 8px 10px;
    text-shadow:0px -1px #278db8;
    border:1px solid #339cdf;
    box-shadow:none;
    -moz-box-shadow:none;
    -webkit-box-shadow:none;
    margin:0 12px 0 0;
    cursor:pointer;
    *padding:7px 2px 8px 2px; /* IE7 Fix */
}

/* Forgot your password */
#layerForm span {
    text-align:center;
    display:block;
    padding:7px 0 4px 0;
}

#layerForm span a {
    color:#3a454d;
    text-shadow:1px 1px #fff;
    font-size:12px;
}



#layerForm ul li{border-top: 1px solid #ABBECC;
    float: left;
	font-weight: normal;
    list-style: none outside none;
    padding: 10px 0;
    width: 50%;
	font-size: 14px;}
	
	.border_none{border:none!important}

#layerForm ul{
    background: none repeat scroll 0 0 #D2E0EA;
    border: 1px solid #899CAA;
    border-radius: 3px 0 3px 3px;
	float: left;
	margin-top: -7px;
    padding: 20px;}
	
	#layerForm ul.sub {
    background: none repeat scroll 0 0 transparent !important;
    border: medium none !important;
    border-radius: 0 0 0 0 !important;
    float: left !important;    
    margin-top: -7px;
    padding: 10px 0 6px;
    width: 47%;
}



#layerForm ul.sub.margn{margin-right: 17px;}

	

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

	.hide{display:none}

	#layerForm ul li{width:100% !important}

	#layerForm ul.sub {width:100%;padding: 20px 0 6px;}

}

@media only screen and (max-width:480px){
	#layerForm ul {margin-left: 0px;width: 100% !important;}

	#layerForm ul.sub {margin-left:0px}

	}

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


    #layerForm ul{margin-left: 0px;width: 100% !important;}
	
	#layerForm ul.sub {margin-left:0px}
}

 #table3 {
 border:1px solid #999;
		background-color:black;
  }
  #table3 td {
		width:999px;
	height:10px;
	border:1px solid #000;
   text-align:center;
 }
#table3 label {
   width:999px;
	line-height:10px;
	display:inline block;
 }
 
 
 /* Login Button */
#raindropButton { 
    display:inline-block;  
    background:#d2e0ea url(../imagemap/buttonbgmenu.png) repeat-x; 
    border:1px solid #899caa; 
    border-radius:3px;
    -moz-border-radius:3px;
    position:relative;
    z-index:30;
    cursor:pointer;
}

/* Login Button Text */
#raindropButton span {
    color:#445058; 
    font-size:12px; 
    font-weight:bold; 
    text-shadow:1px 1px #fff; 
    padding:7px 38px 9px 10px;
    background:url(../imagemap/loginArrow.png) no-repeat 178px 11px;
    display:block
}

#raindropButton:hover {
    background:url(../imagemap/buttonbgHover.png) repeat-x;
}

/* Login Box */
#raindropBox {
    position:absolute;
   top:34px;
    right:0;
    display:none;
    z-index:29;
	width:100%;
	height:50%;
}

/* If the Login Button has been clicked */    
#raindropButton.active {
    border-radius:3px 3px 0 0;
}

#raindropButton.active span {
    background-position:178px -72px;
}

/* A Line added to overlap the border */
#raindropButton.active em {
    position:absolute;
    width:100%;
    height:1px;
    background:#d2e0ea;
    bottom:-1px;
}

/* Login Form */
#raindropForm {
    /*width:248px; */
   
    padding:6px;
	margin: 0 auto;
    width: 40%;
	
}

#raindropForm fieldset {
    margin:0 0 12px 0;
    display:block;
    border:0;
    padding:0;
}



#raindropForm #checkbox {
    width:auto;
    margin:1px 9px 0 0;
    float:left;
    padding:0;
    border:0;
    *margin:-3px 9px 0 0; /* IE7 Fix */
}

#raindropForm #body fieldset label {
    display:block;
    float:none;
    margin:0 0 6px 0;
}

/* Default Input */
#raindropForm input {
    width:92%;
    border:1px solid #899caa;
    border-radius:3px;
    -moz-border-radius:3px;
    color:#3a454d;
    font-weight:bold;
    padding:8px 8px;

    font-size:12px;
}

/* Sign In Button */
#raindropForm #login {
    width:auto;
    float:left;
    background:#339cdf url(../imagemap/loginbuttonbg.png) repeat-x;
    color:#fff;
    padding:7px 10px 8px 10px;
    text-shadow:0px -1px #278db8;
    border:1px solid #339cdf;
    box-shadow:none;
    -moz-box-shadow:none;
    -webkit-box-shadow:none;
    margin:0 12px 0 0;
    cursor:pointer;
    *padding:7px 2px 8px 2px; /* IE7 Fix */
}

/* Forgot your password */
#raindropForm span {
    text-align:center;
    display:block;
    padding:7px 0 4px 0;
}

#raindropForm span a {
    color:#3a454d;
    text-shadow:1px 1px #fff;
    font-size:12px;
}



#raindropForm ul li{border-top: 1px solid #ABBECC;
    float: left;
	font-weight: normal;
    list-style: none outside none;
    padding: 10px 0;
    width: 50%;
	font-size: 14px;}
	
	.border_none{border:none!important}

#raindropForm ul{
    background: none repeat scroll 0 0 #D2E0EA;
    border: 1px solid #899CAA;
    border-radius: 3px 0 3px 3px;
	float: left;
	margin-top: -7px;
    padding: 20px;}
	
	#raindropForm ul.sub {
    background: none repeat scroll 0 0 transparent !important;
    border: medium none !important;
    border-radius: 0 0 0 0 !important;
    float: left !important;    
    margin-top: -7px;
    padding: 10px 0 6px;
    width: 47%;
}



#raindropForm ul.sub.margn{margin-right: 17px;}

	

@media only screen and (max-width: 768px){
	
	#layerForm, #interactiveForm, #raindropForm, #rainForm {   
    margin: 0!important;
    width: 100%!important;
}

	.hide{display:none}

	#raindropForm ul li{width:100% !important}

	#raindropForm ul.sub {width:100%;padding: 20px 0 6px;}

}

@media only screen and (max-width:480px){
	#raindropForm ul {margin-left: 0px;width: 100% !important;}

	#raindropForm ul.sub {margin-left:0px}

	}

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


    
	
	#raindropForm ul.sub {margin-left:0px}
}

 #table4 {
 border:1px solid #999;
		background-color:black;
  }
  #table4 td {
		width:999px;
	height:10px;
	border:1px solid #000;
   text-align:center;
 }
#table4 label {
   width:999px;
	line-height:10px;
	display:inline block;
 }
 
 
 
  
 /* Login Button */
#rainButton { 
    display:inline-block;  
    background:#d2e0ea url(../imagemap/buttonbgmenu.png) repeat-x; 
    border:1px solid #899caa; 
    border-radius:3px;
    -moz-border-radius:3px;
    position:relative;
    z-index:30;
    cursor:pointer;
}

/* Login Button Text */
#rainButton span {
    color:#445058; 
    font-size:12px; 
    font-weight:bold; 
    text-shadow:1px 1px #fff; 
    padding:7px 38px 9px 10px;
    background:url(../imagemap/loginArrow.png) no-repeat 178px 11px;
    display:block
}

#rainButton:hover {
    background:url(../imagemap/buttonbgHover.png) repeat-x;
}

/* Login Box */
#rainBox {
    position:absolute;
  top:34px;
    right:0;
    display:none;
    z-index:29;
	width:100%;
	height:50%;
}

/* If the Login Button has been clicked */    
#rainButton.active {
    border-radius:3px 3px 0 0;
}

#rainButton.active span {
    background-position:178px -72px;
}

/* A Line added to overlap the border */
#rainButton.active em {
    position:absolute;
    width:100%;
    height:1px;
    background:#d2e0ea;
    bottom:-1px;
}

/* Login Form */
#rainForm {
    /*width:248px; */
   
    padding:6px;
	margin: 0 auto;
    width: 40%;
	
}

#rainForm fieldset {
    margin:0 0 12px 0;
    display:block;
    border:0;
    padding:0;
}



#rainForm #checkbox {
    width:auto;
    margin:1px 9px 0 0;
    float:left;
    padding:0;
    border:0;
    *margin:-3px 9px 0 0; /* IE7 Fix */
}

#rainForm #body fieldset label {
    display:block;
    float:none;
    margin:0 0 6px 0;
}

/* Default Input */
#rainForm input {
    width:92%;
    border:1px solid #899caa;
    border-radius:3px;
    -moz-border-radius:3px;
    color:#3a454d;
    font-weight:bold;
    padding:8px 8px;

    font-size:12px;
}

/* Sign In Button */
#rainForm #login {
    width:auto;
    float:left;
    background:#339cdf url(../imagemap/loginbuttonbg.png) repeat-x;
    color:#fff;
    padding:7px 10px 8px 10px;
    text-shadow:0px -1px #278db8;
    border:1px solid #339cdf;
    box-shadow:none;
    -moz-box-shadow:none;
    -webkit-box-shadow:none;
    margin:0 12px 0 0;
    cursor:pointer;
    *padding:7px 2px 8px 2px; /* IE7 Fix */
}

/* Forgot your password */
#rainForm span {
    text-align:center;
    display:block;
    padding:7px 0 4px 0;
}

#rainForm span a {
    color:#3a454d;
    text-shadow:1px 1px #fff;
    font-size:12px;
}



#rainForm ul li{border-top: 1px solid #ABBECC;
    float: left;
	font-weight: normal;
    list-style: none outside none;
    padding: 10px 0;
    width: 50%;
	font-size: 14px;}
	
	.border_none{border:none!important}

#rainForm ul{
    background: none repeat scroll 0 0 #D2E0EA;
    border: 1px solid #899CAA;
    border-radius: 3px 0 3px 3px;
	float: left;
	margin-top: -7px;
    padding: 20px;}
	
	#rainForm ul.sub {
    background: none repeat scroll 0 0 transparent !important;
    border: medium none !important;
    border-radius: 0 0 0 0 !important;
    float: left !important;    
    margin-top: -7px;
    padding: 10px 0 6px;
    width: 47%;
}



#rainForm ul.sub.margn{margin-right: 17px;}


@media only screen and (max-width:1500px){
	#loginForm{width:60%}

	}

	

@media only screen and (max-width: 768px){
	
	#loginForm{width:100%}

	.hide{display:none}

	#rainForm ul li{width:100% !important}

	#rainForm ul.sub {width:100%;padding: 20px 0 6px;}

}

@media only screen and (max-width:480px){
	#rainForm ul {margin-left: 0px;width: 100% !important;}

	#rainForm ul.sub {margin-left:0px}

	}

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


   
	
	#rainForm ul.sub {margin-left:0px}
}

 #table5 {
 border:1px solid #999;
		background-color:black;
  }
  #table5 td {
		width:999px;
	height:10px;
	border:1px solid #000;
   text-align:center;
 }
#table5 label {
   width:999px;
	line-height:10px;
	display:inline block;
 .weather-control-group {
    margin: 8px 0;
    font-size: 13px;
}

.weather-header {
    margin-bottom: 4px;
    padding: 0 4px;
    white-space: nowrap;
}

.weather-header img {
    height: 18px;
    margin-right: 6px;
}

/* Modern Button Group */
.btn-group {
    display: flex;
    flex-wrap: nowrap;
    border: 1px solid #ccc;
    border-radius: 6px;
    overflow: hidden;
    background: #f8f8f8;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

.btn-weather {
    flex: 1;
    margin: 0;
    padding: 0;
    background: #fff;
    border: none;
    border-right: 1px solid #ddd;
    cursor: pointer;
    text-align: center;
    transition: all 0.2s;
    font-size: 12px;
    line-height: 1.4;
    min-width: 45px;           /* Makes it compact */
}

.btn-weather:last-child {
    border-right: none;
}

.btn-weather span {
    display: block;
    padding: 6px 8px;
}

.btn-weather input[type="radio"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

/* Hover and Active States */
.btn-weather:hover {
    background: #f0f7ff;
}

.btn-weather.active,
.btn-weather input[type="radio"]:checked + span {
    background: #007bff;
    color: white;
    font-weight: bold;
}

/* Remove the ugly default radio button */
.btn-weather input[type="radio"] {
    display: none;
}


}