html{height: 100%; background: #fff;}
h2 {color:#fff; font-size:24px; text-align:justify;}
.topt {width:500px; margin:0 auto;}
body {font-family: Calibri, "Helvetica Neue", Helvetica, Arial, sans-serif; 
font-size:10px;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,207ce5+100 */
background: #ffffff; /* Old browsers */
/height: 100%;}


.leftdiv {float:left; margin:5px; background:#fff; width:15%;padding:5px; border-radius:5px;}
.rightdiv {display:none; float:right; background:#fff; width:15%;padding:5px; border-radius:5px;}

.centerdiv {margin:0 auto; width:80%; display:table; float:left; background:#9bc3e8;padding:5px; border-radius:5px;}

.lefttdc {background:none; border:0px;}
@media screen and (max-width: 995px) {
    .leftdiv {display:none;}
.rightdiv {display:none;}
.centerdiv  {margin:0 auto; width:99%; float:left; background:#9bc3e8;padding:5px; border-radius:5px;}

}
   
   
.forma2 {font-size:12px; color:#fff;}
.maintable {margin:auto; width:310px; border:1px solid #ddd; background:#fff; padding:15px; border-radius:10px;  font-size:12px;}
.maintable span {line-height:25px;}
.xls {float:left; margin-right:15px; height:30px;}
a.axls {text-decoration:none; color:#207ce5;}
a.axls:hover{text-decoration:none; color:#9bc3e8;}
table {border:0px solid #006dcc; 
margin:0 !important;
 padding:0 !important;}
td {background:#E0FFFF; color:#111; border:1px solid #006dcc; padding:1px; margin:0 !important; white-space:nowrap; text-align:center;}
a.link  {display:block;float:left; font-size:14px;
padding:10px;  margin:5px; background:#006dcc; color:#fff; border-radius:3px; text-decoration:none;}
a.link:hover {color:#e0ffff; cursor: pointer;}

.formanom {margin:0 auto; 
text-align:left;}
hr {
	 width: 100%; /* ширина линии */
    height: 4px; /* высота / толщина линии */
    background: #fff; /* фон / цвет линии */
    border: 0; /* рамка вокруг разделительной линии (уберем ее) */
    margin: 5px 0 5px 0; /* отступ над и под линией 5 пикселей */
}
.dataitog {font-weight:bold; padding:15px;}
.sum {font-weight:bold; padding:15px; border-bottom:1px solid #006dcc; }
.taritog {font-weight:bold; padding:5px; border-bottom:1px solid #006dcc;}
.forminp { margin-top:5px; width:300px;
border-radius:3px; padding:5px; font-size:14px; border:1px solid #006dcc; background:#E0FFFF;}
.forminp2 {margin:5px; display:none;
border-radius:3px; padding:5px; font-size:34px; border:1px solid #006dcc; background:#E0FFFF;}
.forminp22 {margin:5px; width:100px;
border-radius:3px; padding:5px; font-size:14px; border:1px solid #006dcc; background:#E0FFFF;}
.forminp3 {margin:5px; display:none;
border-radius:3px; padding:5px; font-size:34px; border:1px solid #006dcc; background:#E0FFFF;}
.forminp33 {margin:5px; width:100px;
border-radius:3px; padding:5px; font-size:14px; border:1px solid #006dcc; background:#E0FFFF;}
button {display:inline-block; border:1px solid #006dcc; font-size:12px; margin-top:5px;
padding: 5px 15px 5px 15px; background:#006dcc; color:#fff; border-radius:5px; text-decoration:none;}
button:hover {background:#e0ffff; color:#111; border:1 px solid:#006dcc; cursor: pointer;}
.result {margin: auto;
    width: 90%;
    line-height: 25px;
    border: 1px solid #ddd;
    background: #fff;
    border-radius: 10px;
    padding: 15px;
    font-size: 12px; margin-top:10px;}
.button2 {display:inline-block; border:1px solid #006dcc; font-size:14px;
padding: 5px 15px 5px 15px; background:#006dcc; color:#fff; border-radius:5px; text-decoration:none;}
.button2:hover {background:#e0ffff; color:#111; border:1 px solid:#006dcc; cursor: pointer;}


.tarif {display:none;
padding:5px;  margin:5px; background:#006dcc; color:#fff; border-radius:5px; text-decoration:none;}
.tarif:hover {background:#e0ffff; color:#111;}
.tarif option {padding:5px; margin:5px; line-height:20px;}

.tarif2 {display:inline-block; font-size:12px;
padding:5px;  margin-right:5px; background:#006dcc; color:#fff; border-radius:5px; text-decoration:none;}
.tarif2:hover {background:#e0ffff; color:#111;}
.tarif2 option {padding:5px; margin:5px; line-height:20px;}

.filter {margin: auto;
    width: 90%;
    line-height: 25px;
    border: 1px solid #ddd;
    background: #fff;
    border-radius: 10px;
    padding: 15px;
    font-size: 12px;
	height:170px;}
.tabl1 {float:left;  text-align:left;}
.tabl2 {float:left;  text-align:left}
.tabl3 {float:left;  text-align:left}
.toptable1 { border:1px solid #eee; padding:5px; border-radius:5px;}

.topbuttons {padding-top:1px;}
.tbl1 { float:left; margin-right:0; overflow-x: scroll; overflow-x:hidden;  width:100%; padding-right:8px; height:500px; background:none;}
.tbl2 {}
.r2 {padding-left:10px !important; border:none; background:none;}
.blue {
  transition: .1s;
}
#devnames:checked + label {
  background: #006dcc;
}
.blue:hover {background:#006dcc; color#fff;}


.fixed (position:fixed; top:150px; left:400px}

/* все что ниже, для мобильников */
@media (max-width: 480px) {
	html{height: 100%; background: #9bc3e8;}
	.topt {width:90%; margin:10px;}
	h2 {font-size:15px;}
body {font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; 
width:90%;
padding-left:5px;
height: 100%;}

.forma2 {font-size:12px; color:#fff;}
.maintable {margin:auto; width:90%; line-height:25px; border:1px solid #ddd; background:#fff; padding:0px; border-radius:10px;  font-size:12px;}
.maintable span {line-height:25px;}
.xls {float:left; margin-right:15px;}
a.axls {text-decoration:none; color:#207ce5;}
a.axls:hover{text-decoration:none; color:#9bc3e8;}
table {border:0px solid #006dcc; 
margin:0 !important;
 padding:0 !important;}
td {background:#E0FFFF; color:#111; border:1px solid #006dcc; padding:1px; margin:0 !important; text-align:center;}
a.link  {display:block;float:left; 
padding:15px;  margin:5px; background:#006dcc; color:#fff; border-radius:5px; text-decoration:none;}
a.link:hover {color:#e0ffff; cursor: pointer;}
.formanom {margin:10px; 
text-align:left;}
hr {
	 width: 100%; /* ширина линии */
    height: 4px; /* высота / толщина линии */
    background: #fff; /* фон / цвет линии */
    border: 0; /* рамка вокруг разделительной линии (уберем ее) */
    margin: 5px 0 5px 0; /* отступ над и под линией 5 пикселей */
}
.dataitog {font-weight:bold; padding:15px; border-bottom:3px solid #006dcc;}
.sum {font-weight:bold; padding:15px; border-bottom:3px solid #006dcc; }
.taritog {font-weight:bold; padding:15px; border-bottom:3px solid #006dcc;}
.forminp { margin-top:5px; width:90%;
border-radius:3px; padding:5px; font-size:14px; border:1px solid #006dcc; background:#E0FFFF;}
.forminp2 {margin:5px; display:none;
border-radius:3px; padding:5px; font-size:34px; border:1px solid #006dcc; background:#E0FFFF;}
.forminp22 {margin:5px; 
border-radius:3px; padding:5px; font-size:14px; border:1px solid #006dcc; background:#E0FFFF;}
.forminp3 {margin:5px; display:none;
border-radius:3px; padding:5px; font-size:34px; border:1px solid #006dcc; background:#E0FFFF;}
.forminp33 {margin:5px; 
border-radius:3px; padding:5px; font-size:14px; border:1px solid #006dcc; background:#E0FFFF;}
button {display:inline-block; border:1px solid #006dcc; font-size:12px; margin-top:5px;
padding: 5px 15px 5px 15px; background:#006dcc; color:#fff; border-radius:5px; text-decoration:none;}
button:hover {background:#e0ffff; color:#111; border:1 px solid:#006dcc; cursor: pointer;}
.result {margin: auto;
    width: 90%;
    line-height: 25px;
    border: 1px solid #ddd;
    background: #fff;
    border-radius: 10px;
    padding: 15px;
    font-size: 12px;}
.button2 {display:inline-block; border:1px solid #006dcc; font-size:12px;
padding: 5px 15px 5px 15px; background:#006dcc; color:#fff; border-radius:5px; text-decoration:none;}
.button2:hover {background:#e0ffff; color:#111; border:1 px solid:#006dcc; cursor: pointer;}


.tarif {display:none;
padding:5px;  margin:5px; background:#006dcc; color:#fff; border-radius:5px; text-decoration:none;}
.tarif:hover {background:#e0ffff; color:#111;}
.tarif option {padding:5px; margin:5px; line-height:20px;}

.tarif2 {display:inline-block; font-size:12px;
padding:5px;  margin:5px; background:#006dcc; color:#fff; border-radius:5px; text-decoration:none;}
.tarif2:hover {background:#e0ffff; color:#111;}
.tarif2 option {padding:5px; margin:5px; line-height:20px;}