@charset "utf-8";
/* CSS Document */
body {
    background-color: Black;
	
}
/*=========================================================*/
.Login{
	text-align:center;
	width:100%;
	vertical-align: central;
	}
fieldset { 
	vertical-align: central;
    display: block;
	text-align:center;
	width:20%;
	margin: 0 auto;
    /*margin-left: 30%;
    margin-right: 30%;*/
    padding-top: 0.35em;
    padding-bottom: 0.625em;
    padding-left: 0.75em;
    padding-right: 0.75em;
    border: 1px groove (internal value);
	}

/*==========================4Bang css======================*/
/*=========================================================*/
.col1,.col2,.col3,.col4,.col5{
	width:19.8%;
	float:left;
	height:20px;	
	}
/* DivTable.com */

.divTable,.divTable1,.divTable2,.divTable3,.divTable4,.divTable6,.divTable8,.divTable7{
	width:100%;
	display: table;	
	max-height:200px;
	min-height:5px
	/*font-size:11px;*/
}
.divTable5{
	width:100%;
	display: table;	
	max-height:200px;
	min-height:5px
	/*font-size:11px;*/
}
.divTableRow {
	display: table-row;
	font-size:11px;
	vertical-align: middle;
	font-family:Open Sans, Arial, Helvetica, sans-serif;
}
.divTableHeading {
	background-color: #EEE;
	display: table-header-group;
}
.divTableCell, .divTableHead {
	/*border: 1px solid #999999;*/
	display: table-cell;
	padding: 3px 10px;
	font-size:11px;
}
.divTableHeading {
	background-color: #EEE;
	display: table-header-group;
	font-weight: bold;
}
.divTableFoot {
	background-color: gray;
	display: table-footer-group;
	font-weight: bold;
}
.divTableBody {
	display: table-row-group;
}
.divTableHeader {
	background-color: gray;
	display: table-cell;
	padding: 3px 10px;	
	vertical-align: middle;
	font-family:Open Sans, Arial, Helvetica, sans-serif;
}
.divTableFooter {
	background-color: gray;
	display: table-cell;
	padding: 3px 10px;	
	vertical-align: middle;
	font-family:Open Sans, Arial, Helvetica, sans-serif;
}
.divTableFooterC1 {
	background-color: gray;
	display: table-cell;
	padding: 3px 10px;	
	vertical-align: middle;
	text-align:right;
	font-family:Open Sans, Arial, Helvetica, sans-serif;
}
.So{
	display: table-cell;
	padding: 3px 10px;	
	vertical-align: middle;
	font-family:Open Sans, Arial, Helvetica, sans-serif;
}
.Ten{	
	display: table-cell;
	padding: 3px 10px;
	vertical-align: middle;	
	font-family:Open Sans, Arial, Helvetica, sans-serif;
}


/* Landscape */
@media only screen
  and (min-device-width: 900px) {
   .divTable1,.divTable3{
    display:table;
	float: left;
	width: 49%;
	}
  .divTable2,.divTable4{
    display:table;
	float: right;
	width: 49%;
	}
  .divTable6,.divTable8{
	float: clear;
	height:5px;
	width: 100%;
	display:table;
	color:black;
	}
	.divTable5,.divTable7{
	float: left;
	height:5px;
	width: 1%;
	display:table;
	color:black;
	} 
}

@media only screen
  and (max-device-width: 899px) {
	  .divTable1,.divTable3{
    display:table;
	float: left;
	width: 100%;
	}
  .divTable2,.divTable4{
    display:table;
	float: right;
	width: 100%;
	}
  .divTable6,.divTable8{
	float: clear;
	height:5px;
	width: 100%;
	display:table;
	color:black;
	}
	.divTable5,.divTable7{
	float: clear;
	height:5px;
	width: 1%;
	display:table;
	color:black;
	} 
}

/*===================CalendarN css========================*/
table.calendar    { height:100%;}
td{height:2%; font-size:11px; vertical-align:middle;}/*td{height:30px;vertical-align: top;}*/
tr.calendar-row  {  }
td.calendar-title  { font-size:11px; position:relative; } * html div.calendar-day {}
td.calendar-day-head-title {  background-color: black; font-family: Arial, Helvetica, sans-serif; font-size:11px;   padding: none; } 
td.calendar-day-head-title-nam { font-family: Arial, Helvetica, sans-serif; font-size:11px;   color: #ffffff; }
td.calendar-day-head-title-donvi {  font-family: Arial, Helvetica, sans-serif; font-size:11px;   color: #ffffff;}
/*td.calendar-day  { min-height:80px; font-size:11px; position:relative; } * html div.calendar-day { height:80px; }*/
td.calendar-day-head-title-2 { background-color: black; color: #ffffff; }
td.calendar-day  {  height:10%; font-size:11px; position:relative;   } * html div.calendar-day { height:10%; }
td.calendar-day:hover  {  } /*#eceff5*/
td.calendar-day-np  {height:10%;} * html div.calendar-day-np { height:10%; }
td.calendar-day-head {     color: #ffffff; } /*#6897c3*/
div.day-number    { color:white; font-weight:normal; float:right;   text-align: center; }
/*div.day-number    { background:#6897c3; padding:5px; color:#fff;  float:right; margin:-5px -5px 0 0;   ; }*/
/* shared */
td.calendar-day, td.calendar-day-np {   }
td.calendar-day-cu {   color: #1dfa0c; text-align: center;}
td.calendar-day-htai {    text-align: center; color:#1dfa0c; }
/*td.calendar-day-thtr {    padding:5px; color: #538ed5; text-align: center;}*/
td.calendar-day-th3 {    color: #ff0000; text-align: center;padding: 3px 10px;}
td.calendar-day-th2 {    color: #538ed5; text-align: center;padding: 3px 10px;}
td.calendar-day-th1 {    color: #1dfa0c; text-align: center;padding: 3px 10px;}
td.calendar-day-th 	{    color: #1dfa0c; text-align: center;padding: 3px 10px;}
td.calendar-day-thtrnua {   color: white;text-align: center;}
/*==============button css===================*/
#wrapper {
  width: 100%;
  height: 28px; 
  display: flex;
  align-items: center;
  justify-content: center;
}
.button {
	height: 24px;
	width: 80px;
  	border-radius: 25px;
    background-color: #404040;/*#228C3A;  /*Green */   
	border: 1px solid white;
    color: white;
   /* padding: 10px 15px;*/
   /* text-align: center;*/
/*    text-decoration: none;*/
/*    display: inline-block;*/
    font-size: 11px;
    margin: 4px 2px;
    cursor: pointer;
    -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
    /*box-shadow: 0 3px 3px 0 rgba(0,0,0,0.1), 0 3px 3px 0 rgba(0,0,0,0.2);*/
}

.buttonlogin {
	height: 24px;
	width: 99%;
  	border-radius: 25px;
    background-color: #404040;/*#228C3A;  /*Green */   
	border: 1px solid white;
    color: white;
   /* padding: 10px 15px;*/
   /* text-align: center;*/
/*    text-decoration: none;*/
/*    display: inline-block;*/
    font-size: 11px;
    margin: 4px 2px;
    cursor: pointer;
    -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
    /*box-shadow: 0 3px 3px 0 rgba(0,0,0,0.1), 0 3px 3px 0 rgba(0,0,0,0.2);*/
}

.button:hover {
	height:24px;
	width: 80px;
    border-radius: 25px;
    background-color: #404040;/*#4CAF50; /* Green */
    border: 1px solid #1dfa0c;
    color: #1dfa0c;/*white;*/
     padding: 1px 1px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 11px;
    margin: 4px 2px;
    cursor: pointer;
    -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
    box-shadow: 0 3px 3px 0 rgba(0,0,0,0.24),0 8px 8px 0 rgba(0,0,0,0.4);
}

.btActive{
	height: 24px;
	width: 80px;
    border-radius: 25px;
    background-color: #404040;/* #4CAF50;  /*Green */
    border: 1px solid #1dfa0c;
    color: #1dfa0c;
    padding: 1px 1px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 11px;
    margin: 4px 2px;
    cursor: pointer;
    -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
    box-shadow: 0 3px 3px 0 rgba(0,0,0,0.24),0 8px 8px 0 rgba(0,0,0,0.4);
}
.btNew {
	height: 28px;
	width: 108px;
  	border-radius: 25px;
    background-color:  #0000ff;  /*Green */   
	border: 1px solid #228C3A;
    color: white;
   /* padding: 10px 15px;*/
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 12px;
    margin: 4px 2px;
    cursor: pointer;
   
    transition-duration: 0.4s;
    /*box-shadow: 0 3px 3px 0 rgba(0,0,0,0.1), 0 3px 3px 0 rgba(0,0,0,0.2);*/
	
	/**/
	-webkit-animation-name: example; /* Safari 4.0 - 8.0 */
    -webkit-animation-duration: 5s; /* Safari 4.0 - 8.0 */
    animation-name: example;
    animation-duration: 5s;
	animation-iteration-count: infinite;
}

/* Safari 4.0 - 8.0 */
@-webkit-keyframes example {
    0%   {background-color:red;}
    33%  {background-color:#5a5a5a; }
    66%  {background-color:blue; }
    100% {background-color:red;}
}

/* Standard syntax  from {background-color:red;}
    to {background-color: #0000ff;}*/
@keyframes example {
    0%   {background-color:red;}
    33%  {background-color:#5a5a5a; }
    66%  {background-color:blue; }    
    100% {background-color:red;}
}
/*=================================*/

	.left, .right{
		height: 400px;
	}
	.left{
		background: blue;
		float: left;
		width: 70%;
	}
	.right{
		background: red;
		float: right;
		width: 30%;
	}

@media only screen and (max-width: 768px){
	.left, .right{
	float: none;
	width: 100%;
	}
}


/*==========*****************============*/
/*==============A css===============*/
/*==========*****************============*/


	.Top, .Bottom{	
		width: 100%;
		float:clear;	
	}
	.Top{
		height: 1px;		
	}
	.LA0,.LA1,.LA2,.LA3{
		display: table;
		float: left;
		width: 1%;
		height: 43%;
		color:Black;
		/*font-size:11px;*/
	}
	.RA1,.RA2,.RA3{
		display: table;
		float: right;
		width: 1%;
		height: 43%;
		color:Black;
		/*font-size:11px;*/
	}
	.CA1,.CA5{
		display:table;
		float:left;
		width:48.5%;
		height: 43%;
	}
	.CA3,.CA7{
		display:table;
		float:left;
		width:48.5%;
		height: 43%;
	}
	.CA2,.CA6{
		display:table;
		float:left;
		width:10px;
		height: 43%;
		color:Black;
	}
	.CA4{
		display:table;
		float:clear;	
		width: 100%;
		height:5px;
		color:Black;
	}
	.CA8{
		display:table;
		float:clear;	
		width: 100%;
		height:5px;
		color:Black;
	}
	
	.CA9{
		display:table;
		float:left;	
		width: 32%;
		height:1%;
		color:Black;
	}
	.CA10,.CA11{
		display:table;
		float:left;	
		width: 32%;
		height:1%;
		color:Black;
	}

/* ----------- iPhone 5 and 5S ----------- */
 
/* Portrait and Landscape */
@media only screen
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2) {
 
}
 
/* Portrait */
@media only screen
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) {
	.col1,.col3{
		width:20%;
	}
	.col2{
	width:60%;
	}
	  
	  /*button*/
	.button {			
	height: 20px;
	width: 100%;
  	
	}

	.button:hover {
		height: 20px;
		width: 100%;
		
	}
	
	.btActive{
		height: 20px;
		width: 100%;
	   
	}
	/*======*/
	
	 /*====*/
	.LA0,.LA1,.LA2,.LA3{
		display: none;
		float: clear;
		width: 100%;
		height: 5px;
		/*font-size:11px;*/
	}
	.RA1,.RA2,.RA3{
		display: none;
		float: right;
		width: 1%;
		height: 43%;
		/*font-size:11px;*/
	}
	.CA1,.CA5{
		display:table;
		float:left;
		width:100%;
		height: 43%;
	}
	.CA3,.CA7{
		display:table;
		float:left;
		width:100%;
		height: 43%;
	}
	.CA2,.CA6{
		display:table;
		float:clear;
		width:100%;
		height: 5px;
	}
	.CA4{
		display:table;
		float:clear;	
		width: 100%;
		height:5px;
	}
	.CA8{
		display:table;
		float:clear;	
		width: 100%;
		height:5px;
	}
	
	.CA9{
		display:none;
		float:clear;	
		width: 100%;
		height:5px;
	}
	.CA10,.CA11{
		display:table;
		float:left;	
		width: 32%;
		height:1%;
	}
}
 
/* Landscape */
@media only screen
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) {
	td{height:10%; font-size:9px; valign:middle;}
	td.calendar-title  { font-size:9;}
	td.calendar-day-head-title { font-size:9px;}
	td.calendar-day { font-size:9px;}
		  
	.LA0,.LA1,.LA2,.LA3{
		display: none;
		float: clear;
		width: 100%;
		height: 5px;
		/*font-size:11px;*/
	}
	.RA1,.RA2,.RA3{
		display: none;
		float: right;
		width: 1%;
		height: 43%;
		/*font-size:11px;*/
	}
	.CA1,.CA5{
		display:table;
		float:left;
		width:100%;
		height: 43%;
	}
	.CA3,.CA7{
		display:table;
		float:left;
		width:100%;
		height: 43%;
	}
	.CA2,.CA6{
		display:table;
		float:clear;
		width:100%;
		height: 5px;
	}
	.CA4{
		display:table;
		float:clear;	
		width: 100%;
		height:5px;
	}
	.CA8{
		display:table;
		float:clear;	
		width: 100%;
		height:5px;
	}
	
	.CA9{
		display:none;
		float:clear;	
		width: 100%;
		height:5px;
	}
	.CA10,.CA11{
		display:table;
		float:left;	
		width: 32%;
		height:1%;
	}
 
}

/* ----------- iPhone 6 ----------- */
 
/* Portrait and Landscape */
@media only screen
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2) { 
 
}
 
/* Portrait */
@media only screen
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) { 
	.LA0,.LA1,.LA2,.LA3{
		display: none;
		float: clear;
		width: 100%;
		height: 5px;
		/*font-size:11px;*/
	}
	.RA1,.RA2,.RA3{
		display: none;
		float: right;
		width: 1%;
		height: 43%;
		/*font-size:11px;*/
	}
	.CA1,.CA5{
		display:table;
		float:left;
		width:100%;
		height: 43%;
	}
	.CA3,.CA7{
		display:table;
		float:left;
		width:100%;
		height: 43%;
	}
	.CA2,.CA6{
		display:table;
		float:clear;
		width:100%;
		height: 5px;
	}
	.CA4{
		display:table;
		float:clear;	
		width: 100%;
		height:5px;
	}
	.CA8{
		display:table;
		float:clear;	
		width: 100%;
		height:5px;
	}
	
	.CA9{
		display:none;
		float:clear;	
		width: 100%;
		height:5px;
	}
	.CA10,.CA11{
		display:table;
		float:left;	
		width: 32%;
		height:1%;
	}
 
}
 
/* Landscape */
@media only screen
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) { 
	td{font-size:10px; }
	td.calendar-title  { font-size:10px;}
	td.calendar-day-head-title { font-size:10px;}
	td.calendar-day { font-size:10px;}
	  
	.LA0,.LA1,.LA2,.LA3{
		display: table;
		float: left;
		width: 1%;
		height: 43%;
		/*font-size:11px;*/
	}
	.RA1,.RA2,.RA3{
		display: table;
		float: right;
		width: 1%;
		height: 43%;
		/*font-size:11px;*/
	}
	.CA1,.CA5{
		display:table;
		float:left;
		width:48.5%;
		height: 43%;
	}
	.CA3,.CA7{
		display:table;
		float:left;
		width:48.5%;
		height: 43%;
	}
	.CA2,.CA6{
		display:table;
		float:left;
		width:5px;
		height: 43%;
	}
	.CA4{
		display:table;
		float:clear;	
		width: 100%;
		height:5px;
	}
	.CA8{
		display:table;
		float:clear;	
		width: 100%;
		height:5px;
	}
	
	.CA9{
		display:table;
		float:left;	
		width: 32%;
		height:1%;
	}
	.CA10,.CA11{
		display:table;
		float:left;	
		width: 32%;
		height:1%;
	}
 
}
 
/* ----------- iPhone 6+ ----------- */
 
/* Portrait and Landscape */
@media only screen
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3) { 
 
}
 
/* Portrait */
@media only screen
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: portrait) { 
  .LA0,.LA1,.LA2,.LA3{
	display: none;
	float: clear;
	width: 100%;
	height: 5px;
	/*font-size:11px;*/
}
.RA1,.RA2,.RA3{
	display: none;
	float: right;
	width: 1%;
	height: 43%;
	/*font-size:11px;*/
}
.CA1,.CA5{
	display:table;
	float:left;
	width:100%;
	height: 43%;
}
.CA3,.CA7{
	display:table;
	float:left;
	width:100%;
	height: 43%;
}
.CA2,.CA6{
	display:table;
	float:clear;
	width:100%;
	height: 5px;
}
.CA4{
	display:table;
	float:clear;	
	width: 100%;
	height:5px;
}
.CA8{
	display:table;
	float:clear;	
	width: 100%;
	height:5px;
}

.CA9{
	display:none;
	float:clear;	
	width: 100%;
	height:5px;
}
.CA10,.CA11{
	display:table;
	float:left;	
	width: 32%;
	height:1%;
}
 
}
 
/* Landscape */
@media only screen
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: landscape) { 
  
	td{font-size:10px; }
	td.calendar-title  { font-size:10px;}
	td.calendar-day-head-title { font-size:10px;}
	td.calendar-day { font-size:10px;}

  .CA1,.CA5{
	display:table;
	float:left;
	width:48%;
	height: 43%;
  }
  .CA3,.CA7{
	display:table;
	float:left;
	width:48%;
	height: 43%;
  }
 
}
/*==========*****************============*/
/*==============B css===============*/
/*==========*****************============*/


.Top, .Bottom{	
	width: 100%;
	float:clear;	
}
.Top{
	height: 1px;		
}
.LB0,.LB1,.LB2,.LB3{
	display: table;
	float: left;
	width: 0%;
	height: 43%;
	color:Black;
	/*font-size:11px;*/
}
.RB1,.RB2,.RB3{
	color:Black;
	display: none;
	float: right;
	width: 1%;
	height: 43%;
	/*font-size:11px;*/
}
.CB1,.CB5{
	display:table;
	float:left;
	width:49.5%;
	height: 43%;
}
.CB3,.CB7{
	display:table;
	float:left;
	width:49.5%;
	height: 43%;
}
.CB2,.CB6{
	color:Black;
	display:table;
	float:left;
	width:1%;
	height: 43%;
}
.CB4{
	color:Black;
	display:table;
	float:clear;	
	width:100%;
	height:0.1em;
}
.CB8{
	color:Black;
	display:table;
	float:clear;	
	width: 100%;
	height:0.1em;
}

.CB9{
	color:Black;
	display:table;
	float:left;	
	width: 32%;
	height:1%;
}
.CB10,.CB11{
	color:Black;
	display:table;
	float:left;	
	width: 32%;
	height:1%;
}

/* ----------- iPhone 5 and 5S ----------- */
 
/* Portrait and Landscape */
@media only screen
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2) {
 
}
 
/* Portrait */
@media only screen
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) {
	  .divTableHeader,.divTableFooter,.divTableRow,.Ten,.So {	
		font-size:6px;
		vertical-align: middle; 
	}
	  .LB0,.LB1,.LB2,.LB3{
		display: none;	
	}
	.CB1,.CB5{
		display:table;
		float:clear;
		width:100%;
		height: 22%;
	}
	.CB3,.CB7{
		display:table;
		float:clear;
		width:100%;
		height: 22%;
	}
	.CB2,.CB6{
		display:table;
		float:clear;
		width:100%;
		height: 2px;
	}
	.RB1,.RB2,.RB3{
		display: none;
		/*font-size:11px;*/
	}
}
 
/* Landscape */
@media only screen
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) {
	  .LB0,.LB1,.LB2,.LB3{
		display: none;	
	}
	.CB1,.CB5{
		display:table;
		float:clear;
		width:100%;
		height: 43%;
	}
	.CB3,.CB7{
		display:table;
		float:clear;
		width:100%;
		height: 43%;
	}
	.CB2,.CB6{
		display:table;
		float:clear;
		width:100%;
		height: 5px;
	}
	.RB1,.RB2,.RB3{
		display: none;
		/*font-size:11px;*/
	}
 
}
 
/* ----------- iPhone 6 ----------- */
 
/* Portrait and Landscape */
@media only screen
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2) { 
 
}
 
/* Portrait */
@media only screen
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) { 
.divTableHeader,.divTableFooter,.divTableRow,.Ten,.So {	
	font-size:8px;
	vertical-align: middle;
}
  
 .LB0,.LB1,.LB2,.LB3{
		display: none;	
	}
	.CB1,.CB5{
		display:table;
		float:clear;
		width:375px;
		height: 30%;
	}
	.CB3,.CB7{
		display:table;
		float:clear;
		width:375px;
		height: 30%;
	}
	.CB2,.CB6{
		display:table;
		float:clear;
		width:100%;
		height: 5px;
	}
	.RB1,.RB2,.RB3{
		display: none;
		/*font-size:11px;*/
	}
}
 
/* Landscape */
@media only screen
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) { 
 	.LB0,.LB1,.LB2,.LB3{
		display: none;	
	}
	.CB1,.CB5{
		display:table;
		float:clear;
		width:100%;
		height: 43%;
	}
	.CB3,.CB7{
		display:table;
		float:clear;
		width:100%;
		height: 43%;
	}
	.CB2,.CB6{
		display:table;
		float:clear;
		width:100%;
		height: 5px;
	}
	.RB1,.RB2,.RB3{
		display: none;
		/*font-size:11px;*/
	}
}
 
/* ----------- iPhone 6+ ----------- */
 
/* Portrait and Landscape */
@media only screen
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3) { 
 
}
 
/* Portrait */
@media only screen
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: portrait) { 
  .divTableHeader,.divTableFooter,.divTableRow,.Ten,.So {	
		font-size:10px;
		vertical-align: middle;
	}
	.LB0,.LB1,.LB2,.LB3{
		display: none;	
	}
	.CB1,.CB5{
		display:table;
		float:clear;
		width:414px;
		height: 43%;
	}
	.CB3,.CB7{
		display:table;
		float:clear;
		width:414px	;
		height: 43%;
	}
	.CB2,.CB6{
		display:table;
		float:clear;
		width:100%;
		height: 5px;
	}
	.RB1,.RB2,.RB3{
		display: none;
		/*font-size:11px;*/
	}
 
}
 
/* Landscape */
@media only screen
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: landscape) { 
  .LB0,.LB1,.LB2,.LB3{
		display: none;	
	}
	.CB1,.CB5{
		display:table;
		float:clear;
		width:100%;
		height: 43%;
	}
	.CB3,.CB7{
		display:table;
		float:clear;
		width:100%;
		height: 43%;
	}
	.CB2,.CB6{
		display:table;
		float:clear;
		width:100%;
		height: 5px;
	}
	.RB1,.RB2,.RB3{
		display: none;
		/*font-size:11px;*/
	}
 
}

/* ----------- iPhone X ----------- */
 
/* Portrait and Landscape */
@media only screen
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3) { 
 
}
 

 
/* Landscape */
@media only screen
  and (min-device-width: 810px) 
  and (max-device-width: 812px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: landscape) {
	  
  .divTableHeader {
	background-color: gray;
	display: table-cell;
	padding: 3px 10px;
	font-size: 0.4rem;
	vertical-align: middle;
	font-family:Open Sans, Arial, Helvetica, sans-serif;
	}
	.divTableFooter {
		background-color: gray;
		display: table-cell;
		padding: 3px 10px;	
		font-size: 0.5rem;
		vertical-align: middle;
		font-family:Open Sans, Arial, Helvetica, sans-serif;
	}
	.Ten {
		font-size: 0.5rem;	
	}
	.So {
		font-size: 0.5rem;		
	}
  .LB0,.LB1,.LB2,.LB3{
		display: none;	
	}
	.CB1,.CB5{
		display:table;
		float:clear;
		width:48%;
		height: 43%;
	}
	.CB3,.CB7{
		display:table;
		float:clear;
		width:48%;
		height: 43%;
	}
	.CB2,.CB6{
		display:table;
		float:clear;
		width:1%;
		height: 5px;
	}
	.RB1,.RB2,.RB3{
		display: none;
		/*font-size:11px;*/
	}
 
}



/*Ipad*/
@media only screen
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) { 
  .divTableHeader,.divTableFooter,.divTableRow,.Ten,.So {	
		font-size:18px;
		vertical-align: middle;
	}
 .LB0,.LB1,.LB2,.LB3{
		display: none;	
	}
	.CB1,.CB5{
		display:table;
		float:clear;
		width:100%;
		height: 43%;
	}
	.CB3,.CB7{
		display:table;
		float:clear;
		width:100%;
		height: 43%;
	}
	.CB2,.CB6{
		display:table;
		float:clear;
		width:100%;
		height: 5px;
	}
	.RB1,.RB2,.RB3{
		display: none;
		/*font-size:11px;*/
	}
}

@media only screen
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) { 
  .divTableHeader,.divTableFooter,.divTableRow,.Ten,.So {	
		font-size:0.7rem;
		vertical-align: middle;
	}
 .LB0,.LB1,.LB2,.LB3{
		display: none;	
	}
	.CB1,.CB5{
		display:table;
		float:clear;
		width:48%;
		height: 43%;
	}
	.CB3,.CB7{
		display:table;
		float:clear;
		width:48%;
		height: 43%;
	}
	.CB2,.CB6{
		display:table;
		float:clear;
		width:1%;
		height: 5px;
	}
	.RB1,.RB2,.RB3{
		display: none;
		/*font-size:11px;*/
	}
}
/*iPad Pro*/

@media only screen
  and (min-device-width: 1024px) 
  and (max-device-width: 1336px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) { 
  .divTableHeader,.divTableFooter,.divTableRow,.Ten,.So {	
		font-size:0.7rem;
		vertical-align: middle;
	}
 .LB0,.LB1,.LB2,.LB3{
		display: none;	
	}
	.CB1,.CB5{
		display:table;
		float:clear;
		width:48%;
		height: 43%;
	}
	.CB3,.CB7{
		display:table;
		float:clear;
		width:48%;
		height: 43%;
	}
	.CB2,.CB6{
		display:table;
		float:clear;
		width:1%;
		height: 5px;
	}
	.RB1,.RB2,.RB3{
		display: none;
		/*font-size:11px;*/
	}
}


@media only screen
  and (min-device-width: 1330px) 
  and (max-device-width: 1336px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) { 
  .divTableHeader,.divTableFooter,.divTableRow,.Ten,.So {	
		font-size:0.9rem;
		vertical-align: middle;
	}
 .LB0,.LB1,.LB2,.LB3{
		display: none;	
	}
	.CB1,.CB5{
		display:table;
		float:clear;
		width:48%;
		height: 43%;
	}
	.CB3,.CB7{
		display:table;
		float:clear;
		width:48%;
		height: 43%;
	}
	.CB2,.CB6{
		display:table;
		float:clear;
		width:1%;
		height: 5px;
	}
	.RB1,.RB2,.RB3{
		display: none;
		/*font-size:11px;*/
	}
}