/* Global Styles */
body {
    background-position: center center;
    background-repeat: repeat;
    background-attachment: fixed;
    background-color: white;
    padding: 0;
    margin: 0;
    text-align: center;
    font-family: Arial, sans-serif;
    font-weight: bold;
    font-size: 12px;
    direction: rtl;
    cursor: url('mouse.png'), auto;
    color: #005000;
}

/* Anchor Styles */
body a {
    text-decoration: none;
    color: #000000;
    outline: none;
}

body a:focus {
    color: darkgreen;
}

body a:hover {
    color: #FF0000;
}

/* Header Styles */
.head, .cen, .cen1, .fot {
    border-style: none;
    background-color: #FFFFFF;
    color: #006000;
    text-align: center;
    font-size: 12px;
    font-family: Arial, sans-serif;
    font-weight: bold;
}

/* Centered Container */
.cen {
    /* Additional styles can be added here */
}

.cen1 {
    color: #007000;
}

/* Footer Styles */
.fot {
    background-position: left bottom;
}

/* Form Input Styles */
input[type='text'], .passtext {
    background-position: bottom;
    border: 0.5px solid #999999;
    padding: 0 5px;
    font-family: Arial, Helvetica, sans-serif;
    color: #007000;
    background: #ffffff url('../img/Buttonfacer.png') repeat-x;
    outline: none;
}

input[type='text']:hover, .passtext:hover {
    border-color: #475B7E;
}

input[type='text']:focus, .passtext:focus {
    border-color: #700000;
    color: #700000;
    background: #fff;
}

/* Button Styles */
.but {
    border-style: none;
    border-color: #2C3E5B #2C3E5B #CC0000 #2C3D5B;
    background-image: url('img/Buttonface.png');
    background-repeat: repeat-x;
    background-color: #FFFFFF;
    font-size: small;
}

/* Fieldset and Legend Styles */
fieldset {
    border-top: medium dotted #007000;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: bold;
    background-color: #FDFDFD;
    text-align: right;
    border-left: none;
    border-right: none;
    border-bottom: none;
}

legend {
    background: #fff url('img/Gheader.jpg') repeat-x;
    border: 0.5px solid #001000;
    border-top: 3px groove #000;
    border-radius: 0 0 1em 1em;
    padding: 0 20px;
    color: #007000;
    box-shadow: 0px 8px 10px -5px rgba(0, 128, 0, 0.5);
    animation: mylegend 4s infinite;
}

@keyframes mylegend {
    25% { box-shadow: 0px 8px 10px -5px rgba(0, 128, 0, 0.5); }
    50% { box-shadow: 0px 8px 10px -5px rgba(128, 0, 0, 0.5); }
    75% { box-shadow: 0px 8px 10px -5px rgba(128, 0, 0, 0.5); }
    100% { box-shadow: 0px 8px 10px -5px rgba(0, 128, 0, 0.5); }
}

/* Modal Styles */
.mgmg {
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(80, 80, 80, 0.2);
    overflow: auto;
}

/* Error Messages */
.ErrorMessages, .ErrorMessages1, .ErrorMessages2 {
    border-color: #007000;
    border-style: ridge;
    background-color: #FFFFFF;
    color: #007000;
    animation-duration: 2s;
}

.ErrorMessages {
    width: 65%;
    animation-name: animatetopsa;
}

@keyframes animatetopsa {
    from { top: -300px; opacity: 0; }
    to { top: 220px; opacity: 1; }
}

.ErrorMessages1, .ErrorMessages2 {
    width: 100%;
    border-radius: 2em;
    animation-name: asa;
}

@keyframes asa, aass {
    from { top: -300px; opacity: 0; }
    to { top: 220px; opacity: 1; }
}

.ErrorMessages2 {
    border-radius: 2em;
}

/* Autocomplete Styles */
.autocomplete_completionListElement, .autocomplete_listItem {
    padding: 0 20px;
    border: none;
    color: #007000;
    font-family: Arial, sans-serif;
    font-weight: bold;
    list-style-type: none;
    text-align: right;
    background-color: #FFFFFF;
}

.autocomplete_completionListElement {
    height: 200px;
    overflow: auto;
    border-radius: 0 0 1em 1em;
}

.autocomplete_highlightedListItem {
    color: #ffffff;
    background-color: #007000;
}

.tran {
    margin: 5px;
    border: 2pt groove #FF0000;
    opacity: 0.7;
    background-color: #FF6600;
}

.pags {
    border: 1px solid transparent;
}

.alls {
    width: 98%;
}

body a
{
    text-decoration: none;
    color: #000000;
}
body a:hover
{
    text-decoration: none;
    color: #FF0000;
}
.passtext
{
    background-position: bottom;
    border: 0.5px solid #999999;
 
    outline: none;
    padding-right: 5px;
    padding-left: 5px;
    font-family: Arial, Helvetica, sans-serif;
    text-decoration: none;
    color: #007000;
    background: #ffffff url( 'img/Buttonface.png' ) repeat-x;
    outline: none;
    /*  text-shadow:  Simulating Text Stroke  -0.3px -0.3px 0 #FF8000, 0.3px -0.3px 0 #FF8000, -0.3px 0.2px 0 #FF8000, 0.4px 0.4px 0.6px #fff;*/  
   
}
    .passtext:hover
    {
 border-color: #475B7E;
    outline: none;
    padding-right: 5px;
    padding-left: 5px;
        }
        .passtext:focus
{
  border: 0.5px solid #700000;
   
    outline: none;
    padding-right: 5px;
    padding-left: 5px;
    font-family: Arial, Helvetica, sans-serif;
    text-decoration: none;
    color: #700000;
    background: #fff;
    outline: none;

}
input[type='text'] {
    background-position: bottom;
    border: 0.5px solid #999999;
    outline: none;
    padding-right: 5px;
    padding-left: 5px;
    font-family: Arial, Helvetica, sans-serif;
    text-decoration: none;
    color: #007000;
 background: #ffffff url( '../img/Buttonfacer.png' ) repeat-x;
    outline: none;
    /*  text-shadow:  Simulating Text Stroke  -0.3px -0.3px 0 #FF8000, 0.3px -0.3px 0 #FF8000, -0.3px 0.2px 0 #FF8000, 0.4px 0.4px 0.6px #fff;*/
}
input[type='text']:hover
{
    border-color: #475B7E;
    outline: none;
    padding-right: 5px;
    padding-left: 5px;
}
    input[type='text']:focus
{
     border: 0.5px solid #700000;
   
    outline: none;
    padding-right: 5px;
    padding-left: 5px;
    font-family: Arial, Helvetica, sans-serif;
    text-decoration: none;
    color: #700000;
    background: #fff;
    outline: none;

}



.tran
{
    margin: 5px;
    border: 2pt groove #FF0000;
    opacity: 0.7;
    background-color: #FF6600;

}
.but
{
    border-style: none;
    border-color: #2C3E5B #2C3E5B #CC0000 #2C3D5B;
    background-position: bottom;
    font-size: small;
    background-image: url('img/Buttonface.png');
    background-repeat: repeat-x;

    background-color: #FFFFFF;

}

fieldset
{
    border-top: medium dotted #007000;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: bold;
    text-decoration: none;
    background-color: #FDFDFD;
    text-align: right;
    border-left-style: none;
    border-right-style: none;
    border-bottom-style: none;
}
     legend
{

   background: #fff url( 'img/Gheader.jpg' ) repeat-x;
    border: 0.5px solid #001000;
    border-top: 3px groove  #000; 
    border-radius:0em 0em 1em 1em; 
    padding-right: 20px;
    padding-left: 20px;
    color: #007000;
 box-shadow:0px 8px 10px -5px rgba(0, 128, 0, 0.5);
    animation: mylegend 4s infinite;
}

    @keyframes mylegend {


     25% { box-shadow:0px 8px 10px -5px rgba(0, 128, 0, 0.5);}
    50% { box-shadow:0px 8px 10px -5px rgba(128, 0, 0, 0.5);}
  75% { box-shadow:0px 8px 10px -5px rgba(128, 0, 0, 0.5);}
 100% { box-shadow:0px 8px 10px -5px rgba(0, 128, 0, 0.5);}
}
.mgmg
{
    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: rgba(80,80,80,0.2); /* Black w/ 
    /* background-color: #293955;*/

 
}
.ErrorMessages2
{
    border-color: #007000;
    border-style: ridge;
    border-radius: 2em 2em 2em 2em;

    filter: alpha(opacity=50);
    background-color: #FFFFFF;
    -webkit-animation-name: aass;
    -webkit-animation-duration: 2s;
    animation-name: aass;
    animation-duration: 2s;
}

/* Add Animation */
@-webkit-keyframes aass {
    from {top:-300px; opacity:0} 
    to {top:220; opacity:1}

}
@keyframes aass {
    from {top:-300px; opacity:0}
    to {top:220; opacity:1}
}

.ErrorMessages1
{
    border-color: #007000;
    border-style: ridge;
   
    filter: alpha(opacity=50);
    width: 100%;
    background-color: #FFFFFF;
    -webkit-animation-name: asa;
    -webkit-animation-duration: 2s;
    animation-name: asa;
    animation-duration: 2s;
}

/* Add Animation */
@-webkit-keyframes asa {
    from {top:-300px; opacity:0} 
    to {top:220; opacity:1}

}
@keyframes asa {
    from {top:-300px; opacity:0}
    to {top:220; opacity:1}
}
.ErrorMessages
{
    border-color: #007000;
    border-style: ridge;

    filter: alpha(opacity=50);
    width: 65%;
    background-color: #FFFFFF;
    color: #007000;
  -webkit-animation-name: animatetopsa;
    -webkit-animation-duration: 4s;
    animation-name: animatetopsa;
    animation-duration: 2s
    
}

/* Add Animation */
@-webkit-keyframes animatetopsa {
    from {top:-300px; opacity:0} 
    to {top:220px; opacity:1}

}
@keyframes animatetopsa {
    from {top:-300px; opacity:0}
    to {top:220px; opacity:1}
}
.autocomplete_completionListElement
{
    padding: 0px 20px 0px 0px;
    border-style: none;
    border-width: 0.5px;
    margin: 0px !important;
    color: #007000;
    cursor: pointer;
    height: 200px;
    text-align: right;
    overflow: auto;
    font-family: Arial;
    font-weight: bold;
    list-style-type: none;
       background-color: #FFFFFF;
    width: auto;
    border-radius: 0em 0em 1em 1em;
}


.autocomplete_highlightedListItem
{

    color: #ffffff;
    font-weight: bold;
    background-color: #007000;

    font-family: Arial;
    font-weight: bold;
    list-style-type: none;
    list-style-image: url('0.png');
    list-style-position: outside;
}

.autocomplete_listItem
{
    background-color: window;
    color: #007000;
    background-color: #FFFFFF;
    background-image: url('Buttonface.png');
    font-family: Arial;
    font-weight: bold;
    list-style-type: none;
    list-style-image: url('0.png');
    list-style-position: outside;
}
.titles
{
    border: 1px ridge #FFFFFF;
    text-align: center;
    background-color: #506985;
    color: #FFFFFF;
    text-decoration: none;
    font-weight: bold;
    -moz-border-radius: 2em 2em 2em 2em;
    border-radius: 2em 2em 2em 2em;

}
.titles:hover
{
    text-decoration: none;
    color: #FFCC66;
}

     .MyTabStyle .ajax__tab_header
        {
            font-family: "Arial" , Arial, Arial;
            font-size: 14px;
            font-weight:bold;
            display: block;

        }
        .MyTabStyle .ajax__tab_header .ajax__tab_outer
        {
            border-color: #007000;
            color: #007000;
            padding-left: 10px;
            margin-right: 3px;
            border:solid 1px #007000;
             background-image: url('img/Buttonface.png');
        }
        .MyTabStyle .ajax__tab_header .ajax__tab_inner
{
    
    border-color: #666;
    color: #000000;
    padding: 3px 10px 2px 0px;

    
}
        .MyTabStyle .ajax__tab_hover .ajax__tab_outer
{
   
    background-color: #336699;
    cursor: pointer;
 
}
        .MyTabStyle .ajax__tab_hover .ajax__tab_inner
        {
           
            color: #fff;
        }
        .MyTabStyle .ajax__tab_active .ajax__tab_outer
{
    
    background-color: #003366;
    color: #FFFFFF;
    text-decoration: none;
           border-top-style: solid;
     border-color: #FF6600;
     border-bottom-color: #ffffff;
      border-left-color: #ffffff;
       border-right-color: #ffffff;
}
        .MyTabStyle .ajax__tab_active .ajax__tab_inner
{
    color: #DF5900;
    border-color: #333;
}
        .MyTabStyle .ajax__tab_body
        {
            font-family: Arial,Arial,Arial;
            font-size: 10pt;
            background-color: #fff;
            border-top-width: 0;
            border: solid 1px #d7d7d7;
           /* border-top-color: #ffffff;*/
        }
   .details
{
    cursor: pointer;
}
.Tabs tr
{
	font-size: 18px;
	font-weight: 500;
	border: 1px double #CCCC00;
	background-image: url(         'img/grids.JPG' );
	text-decoration: none;
	color: #FF6500;
	font-family: arial, Helvetica, sans-serif;
}
.Tabs th
{
	background-image: url(      'img/Gheader.jpg' );
	font-size: 18px;
	font-weight: 500;
	text-decoration: none;
	color: #3399FF;
	font-family: arial, Helvetica, sans-serif;
}

.Tabs td
{
	font-size: 18px;
	font-weight: 500;
	border: 1px double #CCCC00;
	background-image: url(          'img/grids.JPG' );
	text-decoration: none;
	color: #800000;
	font-family: arial, Helvetica, sans-serif;
}
select
{

    background: #fff;
    color: #007000;
    margin-right: 0px;
    background: #FFFFFF url('img/Buttonface.png');
    text-decoration: none;
    font-weight: bold;
    font-size: 14px;
     outline:none;
    }

select option
{

    color: #008000;
    background: #eee repeat url( 'img/Buttonface.png ' );
    font-weight: bold;
    text-decoration:none ;
     outline:none;
}

#sup
{
    background-position: center;
    border-top: 1px solid #000;
    position: fixed;
    bottom: 0px;
    z-index: auto;
    background-repeat: no-repeat;
    border-style: none;
    float: right;
    clear: left;
    cursor: pointer;
    width: 40px;
    height: 40px;
    background-image: url('../img/rowup.png');
    display: none;
}
.divpop
{
    padding: 5px 5px 15px 5px;
    border: medium groove #3399FF;
    border-radius: 1em 1em 1em 1em; /*background-color: #FFFFFF;*/
    background-color: rgba(255,255,255,0.7);
}
.divpop Table 
{
    border: thin solid #3399FF;
    border-radius: 1em 1em 1em 1em; 
    background-color: rgba(125,125,200,0.7);
}
.divpop Table
{
    border-style: 0px;
    padding: 0px;
    margin: 0px;
    border-radius: 1em 1em 1em 1em;
    background-color: rgba(255,255,255,0.1);
    }
   
   .AjaxToolkitStyle .ajax__combobox_inputcontainer .ajax__combobox_textboxcontainer input
{

}
.AjaxToolkitStyle .ajax__combobox_inputcontainer .ajax__combobox_buttoncontainer button
{
    background-position: top;
    border-style: solid;
    border-width: 0.5px;
    border-color: inherit;
    border-radius: 1em 1em 1em 1em;
    background-image: url('Buttonface.png');
    outline: none;
    background-repeat: repeat;
    background-color: #6699FF;
    cursor: pointer;
}
.AjaxToolkitStyle .ajax__combobox_itemlist
{
    border-color: #0F2543;
    background-color: #FFFFFF;
    color: #006600;
    height: 100%;
}
.AjaxToolkitStyle .ajax__combobox_itemlist li
{
    list-style-image: url('0.gif');
    border-color: #0F2543 #0F2543 #6699FF #0F2543;
    background-color: #FFFFFF;
    color: #CC0000;
    background-image: url('Buttonface.png');
    border-bottom-style: solid;
    border-bottom-width: 0.5px;
    text-align: right;
    list-style-type: disc;
    list-style-position: inside;
}
.AjaxToolkitStyle .ajax__combobox_itemlist li:hover
{
    border-color: #0F2543 #0F2543 #CC0000 #0F2543;
    background-color: #FFFFFF;
    color: #6699FF;
    background-image: url('Buttonface.png');
    border-bottom-style: solid;
    border-bottom-width: 0.5px;
}
.cal_Theme1 .ajax__calendar_container   {
background-color: #DEF1F4;
border:solid 1px #77D5F7;
}

.cal_Theme1 .ajax__calendar_header  {
background-color: #ffffff;
margin-bottom: 4px;
}

.cal_Theme1 .ajax__calendar_title,
.cal_Theme1 .ajax__calendar_next,
.cal_Theme1 .ajax__calendar_prev    {
color: #004080;
padding-top: 3px;
}

.cal_Theme1 .ajax__calendar_body    {
background-color: #ffffff;
border: solid 1px #77D5F7;
}

.cal_Theme1 .ajax__calendar_dayname {
text-align:center;
font-weight:bold;
margin-bottom: 4px;
margin-top: 2px;
color: #004080;
}

.cal_Theme1 .ajax__calendar_day {
color: #004080;
text-align:center;
}

.cal_Theme1 .ajax__calendar_hover .ajax__calendar_day, .cal_Theme1 .ajax__calendar_hover .ajax__calendar_month, .cal_Theme1 .ajax__calendar_hover .ajax__calendar_year, .cal_Theme1 .ajax__calendar_active
{
    color: #FF0000;
    font-weight: bold;
    background-color: #DEF1F4;
}


 

.cal_Theme1 .ajax__calendar_today
{
    font-weight: bold;
    color: #FF0000;
}

.cal_Theme1 .ajax__calendar_other,
.cal_Theme1 .ajax__calendar_hover .ajax__calendar_today,
.cal_Theme1 .ajax__calendar_hover .ajax__calendar_title {
color: #bbbbbb;
}
#ctl00_ContentPlaceHolder1_WebReport1
{
    padding: 5px 2px 15px 2px;
    border: medium groove #007000;
    border-radius: 1em 1em 1em 1em;
    background-color: rgba(255,255,255,0.7);
}
    #ctl00_ContentPlaceHolder1_WebReport1 Table
{
    margin: 0px;
    border: 0.2px groove #007000;
    border-radius: 1em 1em 1em 1em; /*background-color: #FFFFFF;*/
    background-color: rgba(0, 180, 0,0.4);
      
}
/* 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,128,0,0.2); /* Black w/ opacity */
}

/* Modal Content */
.modal-content 
{
    border-radius:1em 1em 1em 1em;
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    border: 1px solid #888;
    width: 80%;

    -webkit-animation-name: animatetop;
    -webkit-animation-duration: 4s;
    animation-name: animatetop;
    animation-duration: 2s
    
}

/* Add Animation */
@-webkit-keyframes animatetop {
    from {top:-300px; opacity:0} 
    to {top:0; opacity:1}
}

@keyframes animatetop {
    from {top:-300px; opacity:0}
    to {top:0; opacity:1}
}

/* The Close Button */
.close
{
    color: white;
    float: left;
    font-size: 28px;
    font-weight: bold;
    display:block;
}
.closes
{
    color: #FF0000;
    float: left;
    font-size: 28px;
    font-weight: bold;
    display: block;
    cursor: pointer;
}
.close:hover, .close:focus
{
    color: #CC0099;
    text-decoration: none;
    cursor: pointer;
}

.modal-header
{
    padding: 2px 16px;
    background-color: #009900;
    color: white;
    text-align: right;
    border-radius:1em 1em 0em 0em;
}

.modal-body
{
    padding: 2px 16px;
    text-align: right;
    background-color: #FFFFFF;
}

.modal-footer
{
    padding: 2px 16px;
    background-color: #00ef00;
    color: white;
    text-align: left;
    border-radius:0em 0em 1em 1em;
}
/******************************** */
.modalBackground
{
    
    background-color: Black;
    filter: alpha(opacity=40);
    background-color: rgba(0,120,0,0.5);
}
    .modalPopup
{
    background-color: #FFFFFF;
    width: 300px;
    border: 3px solid #007500;
    border-radius:1em;

    -webkit-animation-name: animatetops;
    -webkit-animation-duration: 4s;
    animation-name: animatetops;
    animation-duration: 2s
    
}

/* Add Animation */
@-webkit-keyframes animatetops {
    from {top:-300px; opacity:0} 
    to {top:220; opacity:1}
}

@keyframes animatetops {
    from {top:-300px; opacity:0}
    to {top:220; opacity:1}
}
    .modalPopup .header
{
    background-color: #009900;
    height: 30px;
    color: White;
    line-height: 30px;
    text-align: center;
    font-weight: bold;
    font-family: Arial;
    border-radius:1em 0em 0 em 1em;
}
    .modalPopup .body
{
    border-color: #FF0066;
    min-height: 50px;
    line-height: 30px;
    text-align: center;
    font-weight: bold;
}
    .modalPopup .footer
    {
        padding: 0px;
    }
    .modalPopup .yes, .modalPopup .no
    {
        height: 23px;
        color: White;
        line-height: 23px;
        text-align: center;
        font-weight: bold;
        cursor: pointer;
    }
    .modalPopup .yes
{
    background-color: #006600;
    border: 1px solid #0DA9D0;
    color: #FFFFFF;
    font-family: Arial;
    font-weight: bold;
}
    .modalPopup .no
{
    background-color: #FF0066;
    border: 1px solid #5C5C5C;
    color: #FFFFFF;
    font-family: Arial;
    font-weight: bold;
    float: left;
}

 
  .elog
{
    border: thin solid #2D3E5B;
    padding: 12px;
    border-radius: 1em;

    background-color: #FFFFFF;
    animation: mymovesa 16s infinite;
}
@keyframes mymovesa 
{
     25% {box-shadow:inset 5px 10px 15px black;}
    50% {box-shadow:inset 5px 10px 15px pink;}
     75% {box-shadow:inset 5px 10px 15px lightgreen;}
     100% {box-shadow:inset 5px 10px 15px lightblue;}
}

  /*Abu Omar : Marsowl Omar*/
.sidenav
{
   
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 1;
    top: 0;
    right: 0;
    background-color: rgba(0,60,0,0.89);
     /* background: linear-gradient(rgba(141, 157, 184,0.8) 0%,rgba(0, 20, 40,0.9) 100%);*/
 
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 60px;
    padding-right: 5px;
  
}

.sidenav a
{
    padding: 8px 8px 8px 32px;
    text-decoration: none;
    font-size: 20px;
    color: #FFFFFF;
    display: block;
    transition: 0.3s;
}

.sidenav a:hover {
    color: #f1f1f1;
}

.sidenav .closebtns {
  
   
    right: 25px;
    font-size: 20px;
    margin-left: 50px;
}

.sidenav .closebtn {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 20px;
    margin-left: 50px;
}

@media screen and (max-height: 225px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}
}
input[type='submit']
{
   
   margin:0.25px;
  padding:2px; 
       border : 1px solid   #009000;
    outline: none;
    cursor: pointer;
    color: #ffffff;
   border-radius :3px 3px 3px 3px;
    font-family: Arial;
    text-decoration: none;
      font-weight: bold;
    background: #f7f7f7;
   text-shadow: -0.2px -0.2px 0 #000, 0.2px -0.2px 0 #000, -0.3px 0.2px 0 #000, 0.4px 0.2px 0.6px #000;
 background :linear-gradient(#009900 0%,#001000 100%);

}
input[type='submit']:hover
{
    cursor: pointer;
 color: #ffffff;
    font-weight: bold;
    opacity: 1;
     border : 1px solid   #e6e6e6;
 background :linear-gradient(#001000 0%,#009900 100%);
     animation: mysub 4s infinite;
}
input[type='submit']:active
{
    cursor: pointer;
    color: orange;
    font-weight: bold;
}
@keyframes mysub 
{
        10% {color:white;}
    30% {color:#e6e6e6 ;}
  60% {color:white;}
 90% {color:#e6e6e6 ;}
     25% {border-bottom-color:darkorange ;}
    50% {border-bottom-color:red;}
  75% {border-bottom-color:red;}
 100% {border-bottom-color:yellowgreen ;}
}
.sidenav input[type='submit']
{
    border-style: none none solid none;
    outline: none;
    cursor: pointer;
    color: #ffffff;
    font-weight: bold;
    font-family: Arial;
    text-decoration: none;
    font-size: 16px;
 background:rgba(0,128,0,0.1) ;
    text-align: right;
    padding-right: 20px;
    border-bottom-width: 1px;
    border-bottom-color: #999999;
}

.sidenav input[type='submit']:hover
{
    cursor: pointer;
 color: greenyellow;
    font-weight: bold;
    border-bottom-width: 1px;
    border-bottom-color: #FFFF00;
    animation: mymovesa 4s infinite;
}
@keyframes mymovesa 
{
     25% {border-bottom-color:#f7f7f7;}
    50% {border-bottom-color:#FFFF00;}
  75% {border-bottom-color:#f7f7f7;}
 100% {border-bottom-color:#FFFF00;}
}

.sidenav input[type='submit']:active
{
    cursor: pointer;
    color: #FF0066;
    font-weight: bold; 

}
#cssmenu, #cssmenu ul, #cssmenu li, #cssmenu a
{
    margin: 25 0 0 0;
    padding: 0;
    border: 0;
    list-style: none;
    font-weight: bold;
    text-decoration: none;
    font-family: Arial;
    font-size: 14px;
    position: relative;
}

#cssmenu a {
  line-height: 1.3;
}
#cssmenu
{
    border-style: none;
    width: 250px;
 
    padding: 0px;

}

}
#cssmenu > ul > li {
  margin: 0 0 2px 0;
}
#cssmenu > ul > li:last-child {
  margin: 0;
}
#cssmenu > ul > li > a
{
    border: 1px none #000;
    font-size: 14px;
    display: block;
    color: #FFFFFF;
    font-family: Arial;
    text-decoration: none;
    font-weight: bold;
    padding-top: 5px;
}
#cssmenu > ul > li > a > span
{
    border: 1px none #666666;
    display: block;
    font-weight: bold;
    color: #99CCFF;
    padding-right: 45px;
}
#cssmenu > ul > li > a:hover {
  text-decoration: none;
}
#cssmenu > ul > li.active {
  border-bottom: none;
}
#cssmenu > ul > li.active > a
{
    border-width: 1px;
    border-color: #79980d;
    color: #fff;
    text-shadow: 0 1px 1px #000;
}
#cssmenu > ul > li.active > a span
{
    border: 1px none #97be10;
}
#cssmenu > ul > li.has-sub > a span
{
     
  
    font-family: Arial;
    font-size: 18px;
    font-weight: bold;
    text-decoration: none;
    color: #FFFFFF;
}
#cssmenu > ul > li.has-sub > span a
{

  margin-right: 10px;
    color: #FFFF99;
    margin-top: 5px;
    color: #FFFFFF;
}
#cssmenu > ul > li.has-sub > span a:hover
{
 
    margin-right: 10px;
    color: #FFFF99;
    margin-top: 5px;
}
#cssmenu > ul > li.has-sub > a span
{
    background: url(images/icon_plus.png) 98% center no-repeat;
    margin-right: 10px;
}
#cssmenu > ul > li.has-sub > a span:hover
{

    color: #FFFF99;
}
#cssmenu > ul > li.has-sub.active > a span
{
    background: url(images/icon_minus.png) 98% center no-repeat;
    color: #FFFF99;
}
/* Sub menu */
#cssmenu ul ul {
  padding: 5px 6px;
  display: none;
}
#cssmenu ul ul li {
  padding: 3px 0;
}
#cssmenu ul ul a {
  display: block;
  color: #595959;
  font-size: 13px;
  font-weight: bold;
}
#cssmenu ul ul a:hover {
  color: #79980d;
}
 /* Check and Radio */
   input[type="checkbox"]
{
    border: 1px solid #FF5050;
    width: 10px;
    height: 10px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none; /* Styling checkbox */
    background-color: #CCCCCC;
    border-radius: 2em;
    cursor :pointer ;
}

input[type="checkbox"]:checked
{   
     border: 1px solid #CCFF99;
    width: 10px;
    height: 10px;
    background-color: #00CC66;

}
input[type=radio]
{
	display: none;
}
 
input[type=radio] + label
{
	border-left: 1px solid #e6e6e6;
	border-right: 1px solid #e6e6e6;
	border-top: 1px solid #e6e6e6;
	border-bottom: 1px solid #b3b3b3;
	display: inline-block;
	padding: 4px 12px;
	margin-bottom: 0;
	line-height: 10px;
	text-align: center;
	text-shadow: 0 1px 1px rgba(255,255,255,0.75);
	vertical-align: middle;
	cursor: pointer;
	background-color: #f5f5f5;
	background-repeat: repeat-x;

	background-image: linear-gradient(to bottom,#fff,#e6e6e6);
	margin-left: -2px;
	margin-right: -2px;
	margin-top: -2px;
	font-size: 14px;
	color: #003300;
  border-radius: 1em 1em 1em 1em;
}
 
input[type=radio]:checked + label
{
    background-image: none;
    outline: 0;

    background-color: #FFFF9B;
    font-size: 14px;
    color: #800000;
    font-weight: bold;
    border-radius: 1em 1em 1em 1em;
    background: -webkit-gradient(linear, left top, left bottom, from(#FFCF6F), to(#FFFFFF));
}
.mintab
{
    cursor: pointer;
    padding: 4px;
    margin: 4px;
    border-radius: 25%;
    border: 1px solid #333333;
    width: 40px;
    height: 40px;
    outline: none; 
      -webkit-animation: spina 0.9s linear 0;
    /*
   -webkit-animation: spina 0.9s linear infinite;
*/
}
@keyframes spina {
  0% {  transform: rotate(0deg); }
  99% { transform: rotate(360deg); }
}
.mintab:hover
{
    cursor:pointer;
    padding: 4px;
    margin: 4px;
    border-radius: 25%;
     border: 1px solid #333333;

    width: 40px;
    height: 40px;
    outline: none; 
}
.mintab:active
{
    cursor:pointer;
    padding: 4px;
    margin: 4px;
    border-radius: 25%;
  border: 1px solid #333333;

    width: 40px;
    height: 40px;
    outline: none; 
}
.BR
{
    border: 1px solid #000000;
    z-index: 0;
    padding: 5px 10px 5px 5px;
    margin: -2.5em 5px 5px 0px;
    border-radius: 0em 1em 1em 0em;
    position: fixed;
    left: 0; /*  top: 50%;*/
    top: 15%;
    width: 100px;
    font-family: Arial;
    font-size: 16px;
    text-decoration: none;
    height: auto;
    display: block;
    color: #FFFFFF;
 /*   background: linear-gradient(rgba(0, 255, 0,0.7) 0%,rgba(255, 255, 255,0.9) 100%);*/
     background: linear-gradient(rgba(255, 0, 0,0.7) 0%,rgba(128, 170, 255,0.9) 100%);


}



.BR a
{
    color: #CCCCCC;
    font-weight: bold;
}
    .BR a:hover
{
    color: #fff;
}
.showhide:hover
{
    color: #2B3B58;
    text-shadow: 1px 1px 2px #ffdddd;
}
.showhide
{
    border: thin solid #333333;
    cursor: pointer;
    width: 100%;
    background: linear-gradient(#FFF 0%,#eee 100%);
    text-decoration: none;
    color: #2B3B58;
    font-family: Arial;
    font-size: 14px;
    font-weight: bold;
    text-align: right;
    padding-left: -10px;
    padding-right: 10px;
}
.fg th
{
      background: linear-gradient(#7070FF 0%,#fff 100%);  
    
    }
.fg tr
{
      background: linear-gradient(#eee 0%,#fff 100%);  
    
    }
    .fg tr:first-child
{
    background: linear-gradient(#7070FF 5%,#FFF 100%);
    color: #2D3E5B;
  /*  text-shadow: 2px 2px 5px orange;*/
  
}
  .fg tr:first-child td
  {
      border-radius:2em;
      }
.fg tr:first-child a
{ 
  padding: 5px;
    margin: 5px;
    background: linear-gradient( 5%,#FFF 100%);
    color: #ffffff;
    text-shadow: 2px 2px 5px yellow;
    font-family: Arial;
    font-size: 10px;
    text-decoration: none;
    font-weight: bold;}

 .fg tr:last-child
{
   background: linear-gradient(#007000 0%, #003000 100%);
   color:white;
     text-shadow: 2px 2px 3px black;
}
.fg tr:last-child a
{
  
    padding: 5px;
    margin: 5px;
    background: linear-gradient( 5%,#FFF 100%);
    color: #ffffff;
    text-shadow: 2px 2px 5px yellow;
    font-family: Arial;
    font-size: 10px;
    text-decoration: none;
    font-weight: bold;
}
.datatable th
{
    background: linear-gradient(#007000 0%, #003000 100%);
    color:white;
    
    }
.datatable tr
{
      background: linear-gradient(#eee 0%,#fff 100%);  
    
    }
 .datatable tr:last-child
{
   background: linear-gradient(#007000 0%, #003000 100%);
   color:white;
     text-shadow: 2px 2px 3px black;
}
.datatable tr:last-child a
{
    padding: 5px;
    margin: 5px;
    background: linear-gradient( 5%,#FFF 100%);
    color: #ffffff;
    text-shadow: 2px 2px 5px yellow;
    font-family: Arial;
    font-size: 10px;
    text-decoration: none;
    font-weight: bold;
}
.togo{ display:none;}