@import url("https://fonts.googleapis.com/earlyaccess/lohitdevanagari.css");
html, body{
height:100%; min-height:100%;
}                                

body{ 
margin:0px; background:#FAF1E9; font-size:0.9em; font-family:calibri; word-wrap:break-word; border-top:5px solid #82AF67; 
}

#empossed:link, #empossed:visited {
     background-color: #2877bd;
    border-radius: 15px;
    color: white;
    font-weight: bold;
    padding: 15px 33px;
    position: relative;
    text-align: center;
    text-decoration: none;
    text-shadow: 0 1px 1px #444;
    font-size: 20px;
}

#empossed:before {
  content: "";
  display: block;
  background-color: #2877bd;
  position: absolute;
  top: -5px;
  left: -5px;
  bottom: -5px;
  right: -5px;
  z-index: -1;
  border-radius: 10px;
  background-image: linear-gradient(to bottom, #2877bd 0%, #2877bd 40%);
  box-shadow: 0px -1px 2px 0 #065881 inset,
              0px 1px 1px 1px #ccc,
              0 0 0 6px #fff,
              0 2px 12px 8px #ddd;
}

#empossed:active {
  background-color: #2877bd;
}

#empossed:active:before {
  background-color: #2877bd;
  background-image: none;
  box-shadow: 0px 1px 2px 0 #444 inset,
              0 0 0 6px #fff,
              0 2px 12px 8px #ddd;
}

#empossed:hover {
  background:#0b95d9;
}​

#empossed:hover:before {
  background-image: linear-gradient(to bottom, #2877bd 0%, #2877bd 40%);
}

.group {
 margin-bottom: 4em;
    margin-top: 40px;
  
}

.no-cssgradients #empossed:before {
  background-image: none;
}
.no-cssgradients #empossed:hover:before {
  background: #0b94d9;
}

#empossed.no-border:before {
  box-shadow: 0px -1px 2px 0 #065881 inset,
              0px 1px 1px 1px #ccc;
}


/* emposed 2*/

#empossed2:link, #empossed2:visited {
     background-color: #0b95d9;
    border-radius: 15px;
    color: white;
    font-weight: bold;
    padding: 15px 33px;
    position: relative;
    text-align: center;
    text-decoration: none;
    text-shadow: 0 1px 1px #444;
    font-size: 20px;
}

#empossed2:before {
  content: "";
  display: block;
  background-color:#0b95d9;
  position: absolute;
  top: -5px;
  left: -5px;
  bottom: -5px;
  right: -5px;
  z-index: -1;
  border-radius: 10px;
  background-image: linear-gradient(to bottom, #0b95d9 0%, #0b95d9 40%);
  box-shadow: 0px -1px 2px 0 #065881 inset,
              0px 1px 1px 1px #ccc,
              0 0 0 6px #fff,
              0 2px 12px 8px #ddd;
}

#empossed2:active {
  background-color: #0b95d9;
}

#empossed2:active:before {
  background-color: #0b95d9;
  background-image: none;
  box-shadow: 0px 1px 2px 0 #444 inset,
              0 0 0 6px #fff,
              0 2px 12px 8px #ddd;
}

#empossed2:hover {
  background: #8bc6ea;
}​

#empossed2:hover:before {
  background-image: linear-gradient(to bottom, #0b95d9 0%, #0b95d9 40%);
}

.group {
 margin-bottom: 4em;
    margin-top: 40px;
  
}

.no-cssgradients #empossed2:before {
  background-image: none;
}
.no-cssgradients #empossed2:hover:before {
  background: #0b94d9;
}

#empossed2.no-border:before {
  box-shadow: 0px -1px 2px 0 #065881 inset,
              0px 1px 1px 1px #ccc;
}


/*emposed 3 */

#empossed3:link, #empossed3:visited {
     background-color: #8bc6ea;
    border-radius: 15px;
    color: white;
    font-weight: bold;
    padding: 15px 33px;
    position: relative;
    text-align: center;
    text-decoration: none;
    text-shadow: 0 1px 1px #444;
    font-size: 20px;
}

#empossed3:before {
  content: "";
  display: block;
  background-color: #8bc6ea;
  position: absolute;
  top: -5px;
  left: -5px;
  bottom: -5px;
  right: -5px;
  z-index: -1;
  border-radius: 10px;
  background-image: linear-gradient(to bottom, #8bc6ea 0%, #8bc6ea 40%);
  box-shadow: 0px -1px 2px 0 #065881 inset,
              0px 1px 1px 1px #ccc,
              0 0 0 6px #fff,
              0 2px 12px 8px #ddd;
}

#empossed3:active {
  background-color: #82af67;
}

#empossed3:active:before {
  background-color: #8bc6ea;
  background-image: none;
  box-shadow: 0px 1px 2px 0 #444 inset,
              0 0 0 6px #fff,
              0 2px 12px 8px #ddd;
}

#empossed3:hover {
  background: #4ac9fa;
}​

#empossed3:hover:before {
  background-image: linear-gradient(to bottom, #8bc6ea 0%, #8bc6ea 40%);
}

.group {
 margin-bottom: 4em;
    margin-top: 40px;
  
}

.no-cssgradients #empossed3:before {
  background-image: none;
}
.no-cssgradients #empossed3:hover:before {
  background: #0b94d9;
}

#empossed3.no-border:before {
  box-shadow: 0px -1px 2px 0 #065881 inset,
              0px 1px 1px 1px #ccc;
}
 

#main-container{
 width:95%; height:auto; margin:0 auto; 
}

#container{
 width:100%; float:left; box-shadow:0 0 20px #333; background:#FFFFFF ;
}

#container-top{ 
width:100%; height:auto; float:left; background: url(../images/bg11_PC.gif) center right no-repeat; border-bottom:5px solid #82AF67;
}
/* style for logo */
#logo{
 width:59%; height:auto; float:left; margin:0.5% 0 0.5% 1%; font-size:1.7em; color:#690102;  font-weight:bold; max-width:65%; line-height:26pt; word-wrap:break-word;
}

.small{
font-size:0.7em; color:#666; font-weight:normal; word-wrap:break-word;
}

#logo img{
width:auto; height:auto; float:left; margin-right:0.8em; max-height:80px; max-width:80px;
}
#logo .logotext{ margin-top:10px; float:left; word-wrap:break-word;}
/* end */

/* style for top right div */
#top-right{
 width:40%; height:auto; float:right;
}
.top{
width:auto; float:right; height:10px;min-width:50%; margin-right:10px; line-height:12pt
}
.controlstyle{
margin-right:2%; float:right; width:auto;  padding-left:5%;
}
.controlstyle a{
color:#FFFFFF; text-decoration:none; float:right; margin-right:10px; font-size:0.8em; font-weight:bold; padding:5px;
}
.controlstyle a:hover{color:#690102; background:#FFFFFF;}
.top-down{
float:left; width:100%; height:auto; font-size:1.8em; color:#690102; margin-top:5px; text-align:right;
}
.top-down-right{ width:auto; float:right; margin-right:10px; min-width:30%;}
.top-down-left{ width:auto; float:right; text-decoration:none; color:#fff; font-weight:bold; padding:5px 10px; font-size:14px; margin:1px; border-left:1px solid #fff;}
.top-down-left:hover{ background:#690102; color:#ffffff; }
/* end */

/* style for mis strip div */
#mid-strip{
width:100%; height:auto; float:left;  background: -webkit-linear-gradient(#A2CE88, #83B069); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#A2CE88, #83B069); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#A2CE88, #83B069); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#A2CE88, #83B069); /* Standard syntax */ border-bottom:5px solid #82AF67;
}
}
#left-login{
width:100%; float:left; height:auto; background:#DCDCDC; border-radius:0 0 1em 1em; box-shadow:0 0 20px #333; margin-bottom:10px;
}
.login-cont{
width:80%; height:auto; float:right; margin-right:5%;
}
.login-cont-heading{
width:50%; height:29px; float:left; padding:5px 0px 0px 20px; font-size:1.2em; font-weight:bold; color:#fff; background:#666; border-radius:0 0.5em 0.5em 0; text-decoration:none; margin-top:5px;
}
.login-cont-heading:hover{
background:url(../images/log-head-hov.png) left no-repeat;
}
.login-cont-text{
 width:95%; height:auto; float:left; font-size:1.1em; color:#333; margin-top:5px;
}
#left-login img{
float:left; max-height:70px;
}
#right-content{
 width:73%; height:auto; float:right;
}
#right-content-menu{
 width:100%; height:auto; float:left;  min-height:110px; 
}
#right-content-menu img { width:auto; height:auto; float:left; max-width:98%; min-width:98%;  margin:5px 1%; border:none;}
#right-content-menu img:hover{ opacity: 0.9;
    filter: alpha(opacity=90);}
.menu-links{
 width:auto; height:auto; float:right; padding:10px 15px; color:#000; text-decoration:none; background:#BBBBBA; border:1px solid #999; margin-left:5px; font-size:1em; font-weight:bold;
}
.menu-links:hover{
color:#690102
}
#right-content-marquee{
width:96%; height:auto; float:left; background:#FAF1E9; padding:15px 2%; color:#333; font-size:1em; font-weight:bold; margin:5px 0 0px 0; line-height:16pt; font-family: 'Lohit Devanagari', serif;
}
/* end */

/* style for id body */
#body{
width:100%; height:auto;float:left;
}
/* style for body-left */
#body-left{
width:25%; height:auto; float:left; margin:0 0.5%;
}
#body-right-main{
width:25%; height:auto; float:right; margin:0.5%;
}
.body-left{
 width:100%; height:auto; float:left;  background:#fff; min-height:325px; box-sizing:border-box;
}

.body-left-content-scroll {
width: 100%;
height: 640px;
float: left;
overflow-y: auto;
}
.body-left-heading{
width:100%; height:auto; float:left; font-size:1.2em; color:#333; padding:1% 0; background: -webkit-linear-gradient(#D4E6C5, #A2CE88); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#D4E6C5, #A2CE88); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#D4E6C5, #A2CE88); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#D4E6C5, #A2CE88); /* Standard syntax */ font-weight:bold; text-align:center;
}
.body-left-links{
 width:95%; height:auto; float:left; color:#000; font-size:1em; text-decoration:none; padding:3% 0% 3% 5%; background:url(../images/link.jpg) left center no-repeat; line-height:14pt;
}
.body-left-links:hover{
color:#7F0000;
}
.body-left-linksalt{
 width:95%; height:auto; float:left; color:#000; font-size:1em; text-decoration:none; padding:3% 0% 3% 5%; background:#EEFDE6 url(../images/link.jpg) left center no-repeat;  line-height:15pt;
}
.body-left-linksalt:hover{
color:#7F0000;
}
.viewmore{
width:auto; height:auto; float:right; padding:5px 10px; color:#690102; font-size:0.5em; margin-top:10px; font-weight:bold;
}
.viewmore:hover{ text-decoration:none; color:#fff; background:#544A4A; font-weight:normal;}

/* end */

/* style for body mid */
#body-mid{
 width:46%; height:auto; float:left; margin:0.5% 0%;padding:0 1%; text-align: center;
}
.body-mid{
 width:100%; height:auto; float:left;  margin-top:5px;
}
.body-mid-text{
width:100%; height:auto; float:left; font-size:1.1em; color:#333; text-align:justify; 
}
.body-mid-text a{
 color:#690102; text-decoration:none; padding:5px;
}
.body-mid-text a:hover{
background:#544A4A; color:#ffffff;
}
.graph-box{
 border:1px solid #D4C4B6; color:#333; padding:1%; width:97%; font-size:0.9em; float:left;margin-top:5px; min-height:170px;
}
.box{
 background:#FAF1E9; border:1px solid #D4C4B6; color:#333; padding:1%; width:97%; font-size:0.9em; line-height:14pt; float:left; text-align:justify; margin-top:5px;
}/* end */

/* style for body left tabbed panel */
.body-left-heading-tab{
width:96%; height:auto; float:left; padding:0.5% 2%; border-bottom:3px solid #690102; min-height:30px; 
}
.body-left-tabs{ width:100%; height:auto; float:left;  border-bottom:2px solid #ccc; }
.active-blocks{
padding:7px 4.5%;  border-top:5px solid #690102; border-right:1px solid #690102; border-left:1px solid #690102; color:#690102; font-size:1em; font-weight:bold; width:auto; height:auto; float:left; line-height:18pt; text-decoration:none; text-align:center; border-radius: 1em 1em 0 0;
}
.blocks{
padding:7px 4.5%; border-top:5px solid #999; border-right:1px solid #999;  border-left:1px solid #999;  color:#333; font-size:1em; font-weight:bold; width:auto; height:auto; float:left; line-height:18pt; text-decoration:none; text-align:center
}
.blocks:hover{
color:#690102;
}

#linkbox1{
padding:0.5% 1.5%; height:250px; overflow:auto; width:97%; float:left; font-size:0.9em; 
}
#linkbox2{
padding:0.5% 1.5%; height:250px; overflow:auto; width:97%; float:left; font-size:0.9em; display:none; 
}/* end */

/* style for footer */
#footer{
 width:100%; height:auto; float:left;  background: -webkit-linear-gradient(#A2CE88, #83B069); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#A2CE88, #83B069); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#A2CE88, #83B069); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#A2CE88, #83B069); /* Standard syntax */ color:#333; padding:10px 0;
}
#footer a{
color:#fff; text-decoration:none; font-size:0.9em;
}
#footer a:hover{
text-decoration:underline;
}
.footer-left{
 width:45%; height:auto; float:left; text-align:left; margin-left:5%;
}
.footer-right{
 width:45%; height:auto; float:right; text-align:right; margin-right:5%;
}
@media screen and (max-width: 1200px) {
body{ font-size:80%;}
#logo{
 width:59%; height:auto; float:left; font-size:1.5em; color:#FFFFFF; font-weight:bold; max-width:65%;
}
#logo img{
width:auto; height:auto; float:left; margin-right:0.8em; max-height:80px; max-width:80px;
}
}


a#login_pop:hover, a#join_pop:hover {
    
}
.overlay {
    background-color: rgba(0, 0, 0, 0.5);
    bottom: 0;
    cursor: default;
    left: 0;
    opacity: 0;
    position: fixed;
    right: 0;
    top: 0;
    visibility: hidden;
    z-index: 1;

    -webkit-transition: opacity .5s;
    -moz-transition: opacity .5s;
    -ms-transition: opacity .5s;
    -o-transition: opacity .5s;
    transition: opacity .5s;
}
.overlay:target {
    visibility: visible;
    opacity: 1;
}
.popup h2{color:#07839f; line-height:1.8em}
.popup {
     background-color: #dddddd;
     max-width:260px;
     border:1px solid #333;
     border-top:1px solid #333;
   
    left: 50%; color:#666;
    opacity: 0;
    padding: 0px;
    position: fixed;
    text-align: justify;
    top: 40%;
    visibility: hidden;
    z-index: 10;

    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);

    -webkit-box-shadow: 0 0 30px #000 ;
    -moz-box-shadow: 0 0 30px #000 ;
    -ms-box-shadow: 0 0 30px #000 ;
    -o-box-shadow: 0 0 30px #000 ;
    box-shadow: 0 0 30px #000 ;

    -webkit-transition: opacity .5s, top .5s;
    -moz-transition: opacity .5s, top .5s;
    -ms-transition: opacity .5s, top .5s;
    -o-transition: opacity .5s, top .5s;
    transition: opacity .5s, top .5s;
}
.overlay:target+.popup {
    top: 50%;
    opacity: 1;
    visibility: visible;
}
.close {
    background-color: rgba(0, 0, 0, 0.8);
    height: 23px;
    line-height: 23px;
    position: absolute;
    right: 0;
    text-align: center;
    text-decoration: none;
    top: 0px;
    width: 23px;

    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    -ms-border-radius: 15px;
    -o-border-radius: 15px;
    border-radius: 15px;
}
.close:before {
    color: rgba(255, 255, 255, 0.9);
    content: "X";
    font-size: 18px;
    text-shadow: 0 -1px rgba(0, 0, 0, 0.9);
}
.close:hover {
    background-color: #544A4A;
}
.popup p, .popup div {
    margin-bottom: 3px;
}
.popup label {
    display: inline-block;
    text-align: left;
    width: 180px;
}

#login-box{ background-color: #f6f6f6; padding-top:10px;
 width:100%; height:auto; float:left;border: 1px solid #cccccc;border-radius:10px;
 }
.login-box-heading{
 margin-top:10px; width:80%; height:25px; float:left; color:#800000; font-weight:bold; font-size:1.2em; padding-left:15%; background:url(../images/log-icon.png) left 10px center no-repeat;
}
.login-box-row{
 width:80%; height:auto; float:left; margin:0px 10%;
}
.login-box-row a{
padding:5px; color:#800000; text-decoration:none;
}
.login-box-row a:hover{
color:#fff; background:#800000;
}
.login-box-text{
 width:95%; height:16px; font-size:1em; color:#333;
}
.login-input{
 width:95%; height:25px; float:left; padding:1%; max-height:20px;
}
.login-input img{
 max-height:20px; float:left; margin-right:10px;
}
.login-input-box{
 width:95%; height:20px; border:1px solid #ccc;padding-left: 10px;
}
.login-input-box:focus{
border:1px solid #C05602;
}

.login-note{
	background: #f6f6f6; color:#DF7401; width:98%; float:left; height:auto; border:1px solid #ccc;border-radius: 10px; text-align:center; padding:4px 2px 4px 2px;
}
.login-head{
	float:left; width:100%;height:24px;background: -webkit-linear-gradient(#A2CE88, #83B069); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#A2CE88, #83B069); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#A2CE88, #83B069); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#A2CE88, #83B069); /* Standard syntax */
}
.login-head-title{
	color:#ffffff; font-weight: bold;padding:2px 0px 0px 10px;
}

/* end */  

.submit{
 width:auto; min-width:90px; min-height:25px; height:auto; background:url(../images/menu.gif) repeat-x; border:1px solid #999; color:#333; margin:3px;
}
.submit:hover{
color:#fff; background:#800000;
}
.submit-active{
 width:auto; min-width:90px; min-height:25px; height:auto; background:#800000; border:1px solid #999; color:#fff; margin:3px;
}
.submit-disable{
 width:auto; min-width:90px; min-height:25px; height:auto; background:url(../images/menu.gif) repeat-x; border:1px solid #999; color:#666; margin:3px;
}
.submit-button{
width:auto; min-width:90px; min-height:25px; height:auto; background:#CB6E02; border:1px solid #C05602; color:#fff; margin:3px;
}
.submit-button:hover{
background:#800000; color:#fff;
}
 .centeralign{ text-align:center;}
/* end */


/* 
@-webkit-keyframes blinker {
  from {opacity: 1.0;}
  to {opacity: 0.0;}
}
.blink{
	text-decoration: blink;
	-webkit-animation-name: blinker;
	-webkit-animation-duration: 0.6s;
	-webkit-animation-iteration-count:infinite;
	-webkit-animation-timing-function:ease-in-out;
	-webkit-animation-direction: alternate;
} */

.flash {
   animation-name: flash;
    animation-duration: 0.2s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-play-state: running;
}

@keyframes flash {
    from {color: red;}
    to {color: black;}
}
.flashScroll {
   animation-name: flashScroll;
    animation-duration: 0.2s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-play-state: running;
}

@keyframes flashScroll {
    from {color: blue;}
    to {color: black;}
}