* {margin:0;padding:0;}
html {width:100%;height:100%;}

body {font-size:16px;color:#333;font-family:arial;cursor:default;background:#eee;}

a {color:#0ab;text-decoration:uderline;transition: all 0.5s ease;}
a:hover {color:#f44;}

.cl {clear:both;}
.hrr {clear:both;width:80%;height:1px;background:#7ff;margin:10px auto;}
.h10 {clear:both;width:100%;height:10px;}
.h20 {clear:both;width:100%;height:20px;}
.h30 {clear:both;width:100%;height:30px;}
.h40 {clear:both;width:100%;height:40px;}
.h50 {clear:both;width:100%;height:50px;}
.fl {float:left;}
.fr {float:right;}
p {margin:10px 0;}
input[type="text"]:focus, textarea:focus, input[type="password"]:focus, select:focus {outline:none;}

h1 {font-size:20px;margin-bottom:20px;}


.nc-field, .tpl-field {margin:20px 0;}

.nc-field input[type="text"], 
.tpl-field input[type="text"], 
.block input[type="text"], 
.block input[type="password"], 
.nc-field textarea {padding:10px 20px;border:1px solid #dcebf1;border-radius:25px;background:#fff;}

.nc-field-type-datetime input[type="text"] {padding:10px 20px;border:1px solid #dcebf1;border-radius:25px;background:#fff;}

.nc-field-type-string input[type="text"], 
.tpl-field input[type="password"], 
.nc-field-type-text textarea {padding:10px 20px;border:1px solid #dcebf1;border-radius:25px;width:100%;background:#fff;box-sizing:border-box;}

.nc-field  select, 
.tpl-field select {padding:10px 20px;border:1px solid #dcebf1;border-radius:25px;width:100%;background:#fff;box-sizing:border-box;}

.nc-field-caption, 
.tpl-field label,
.block label {display:block;margin-bottom:5px;font-size:12px;padding-left:25px;}

input[type="submit"], 
button {text-align:center;color:#fff;background:#0ab;font-size:18px;text-decoration:none;padding:10px 20px;margin-bottom:0px;border-radius:25px;border:0px;cursor:pointer;}

.header {position:relative;float:left;width:25%;height:100vh;margin:0 auto;padding:20px;background:#0ab;box-sizing: border-box;color:#fff;}
.mobi {display:none;}
.menu {display:block;}
.menu a {display:block;padding:10px;text-decoration:none;font-weight:700;color:#fff;}
.menu i {margin-right:5px;color:#7ff;}

.wrap {position:relative;float:left;width:75%;height:100vh;overflow-y:auto;margin:0 auto;padding:20px;box-sizing: border-box;}
h4 {margin:10px 0 5px 0;}
.wrap i {margin:0 5px 0 0px;color:#0ab;}
.down, .up, .params, .cont {margin:5px 0;}
/*.down b, .up b, .params b, .cont b {font-size:12px;}*/

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

.header {position:relative;float:none;width:100%;height:auto;margin:0 auto;padding:20px;background:#0ab;box-sizing: border-box;}
.mobi {display:block;}
.logo {float:left;width:50%;font-size:20px;font-weight:700;}
.nav {float:left;width:50%;font-size:20px;font-weight:700;text-align:right;}
.nav i {cursor:pointer;}
.menu {display:none;}
.wrap {position:relative;float:none;width:100%;margin:0 auto;padding:20px;box-sizing: border-box;}

}