@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700&subset=latin,latin-ext');

.mb-head {
    background: #fff;
    padding: 20px;
    margin-bottom: 20px;
    border-bottom: 3px solid #2eacce;
    overflow: hidden;
}
.mb-head-left { float: left; }
.mb-head-left h1 { margin: 0 0 5px; font-size: 24px; color: #333; font-weight: 600; }
.mb-head-left h2 { margin: 0; font-size: 14px; color: #666; font-weight: normal; }
.mb-head-right { float: right; }
.mb-menu { list-style: none; margin: 0; padding: 0; }
.mb-menu li { display: inline-block; margin-left: 10px; }
.mb-menu li a { display: inline-block; padding: 8px 15px; background: #f5f5f5; border-radius: 4px; text-decoration: none; color: #333; font-size: 13px; }
.mb-menu li a:hover { background: #2eacce; color: #fff; }
.mb-menu li a i { margin-right: 5px; }
.mb-body { padding: 0 20px; }
.mb-box { background: #fff; margin-bottom: 20px; border-radius: 4px; overflow: hidden; }
.mb-head { background: #f9f9f9; padding: 12px 15px; border-bottom: 1px solid #e5e5e5; margin: 0; }
.mb-head i { margin-right: 8px; color: #2eacce; }
.mb-inside { padding: 20px; }
.mb-minify { padding: 0; }
.mb-row { padding: 15px 20px; border-bottom: 1px solid #f0f0f0; overflow: hidden; }
.mb-row label { float: left; width: 200px; font-weight: 600; color: #333; margin-top: 5px; }
.mb-row label span { display: block; }
.mb-row input[type="text"], .mb-row input[type="number"] { float: left; padding: 6px 10px; border: 1px solid #ddd; border-radius: 4px; width: 150px; }
.mb-input-desc { float: left; margin-left: 10px; margin-top: 6px; color: #666; }
.mb-explain { clear: both; padding-top: 8px; color: #888; font-size: 12px; margin-left: 200px; }
.mb-line { padding: 5px 0; color: #555; }
.mb-line strong { color: #333; }
.mb-foot { padding: 15px 20px; background: #f9f9f9; overflow: hidden; }
.mb-button { display: inline-block; padding: 8px 20px; background: #2eacce; color: #fff; border: none; border-radius: 4px; cursor: pointer; text-decoration: none; font-size: 13px; }
.mb-button:hover { background: #2696b4; color: #fff; }
.mb-button-red { background: #d9534f; }
.mb-button-red:hover { background: #c9302c; }
.element-slide { float: left; width: 50px; height: 24px; position: relative; appearance: none; -webkit-appearance: none; background: #ddd; border-radius: 12px; outline: none; cursor: pointer; }
.element-slide:checked { background: #2eacce; }
.element-slide:before { content: ''; position: absolute; width: 20px; height: 20px; background: #fff; border-radius: 50%; top: 2px; left: 3px; transition: 0.2s; }
.element-slide:checked:before { left: 27px; }
.mb-footer { margin-top: 30px; padding: 15px 20px; background: #fff; border-top: 1px solid #e5e5e5; text-align: right; color: #888; font-size: 12px; }