html,body {
    font-family: 'Roboto', sans-serif;
}

body {
    background-color: #F5F5F5;
}

.container {
    margin: 20px auto;
    padding: 20px;
    background-color: #fff;
    max-width: 960px;
}

.control {
    border: 2px solid #DCDCDC;
    padding: 5px 15px;
    margin: 15px 0px;
}


.control h3 {
 margin: 5px 0px;
 padding: 1px;
 border-bottom: 3px solid #008000;
}

.control table {
    border-collapse: collapse;
    border: 1px solid #bababa;
}

.control table tr td {
    border: 1px solid #bababa;
    padding: 5px;
}

.control div {
    border: 1px solid #FFFACD;
    padding: 5px;
    margin-top: 10px;
    padding-bottom: 10px;
}

a {
 display:inline-block;
 padding:0.2em 1.45em;
 margin:0.1em;
 border:0.15em solid #CCCCCC;
 box-sizing: border-box;
 text-decoration:none;
 font-family:'Segoe UI','Roboto',sans-serif;
 font-weight:400;
 color:#000000;
 background-color:#CCCCCC;
 text-align:center;
 position:relative;

}

a:hover {
 border-color:#7a7a7a;
}

a:active {
 background-color:#999999;
}

a.linkInfo {

}

a.linkAction {
    background-color: #1E90FF;
    color: #fff;
    border-color: #0075EB;
    display: block;
}

a.linkAction:hover {
    background-color: #3399FF;
    color: #fff;
    border-color: #006BD6;
    display: block;
}

.ajax_response {
    margin: 10px 0px;
    background-color: #F5F5F5;
    padding: 10px;
    font-family: "Courier New", Courier, monospace;
    color: #3B3B3B;
    font-size:13px;
    display: none;
}

.ajax_response.response-success {
 border: 1ppx solid #008000;
 background-color: #C2FFC2;
}

.ajax_response.response-error {
 border: 1px solid #FF0000;
 background-color: #FFC7C7;
}

#loadingDiv {
    width: 128px;
    height: 128px;
    position: fixed;
    top: 45%;
    left: 50%;
    z-index: 999999999999999999!important;
}

span.minmax {
    display: block;
    font-family: "Courier New", Courier, monospace;
    color: #696969;
    font-size:12px;
}

input#custom_command {
    display: block;
    width: 95%;
    padding: 5px;
    background-color: #FFFACD;
    border: 1px solid #FFD700;
}

.imagePreview {
    margin-top: 15px;
    border: 1px solid #bababa;
    clear: both;
    position:relative;
}

.imagePreview img {
 width: 100%;
}

.videoPreview {
    position: relative;
    border: 2px solid #FF0000;
    margin-top: 15px;
}

.videoPreview img {
 width: 100%;
}


.span33 {
    position: absolute;
    right: 10px;
    top: 10px;
    background-color: #000;
    color: #fff;
    text-align: center;
    width: 100px;
    height: 25px;
    line-height: 25px;
}



span.badge-danger {
    background-color: #FF0000;
    color:#fff;
    padding: 5px;
    display:inline-block;
}

span.badge-info {
    background-color: #148AFF;
    color:#fff;
    padding: 5px;
    display:inline-block;
}

input[type="number"] {
    width: 70px;
}

small {
    font-weight: 400;
    font-size: 11px;
    color: #696969;
}

#twitch-embed {
    clear: both;
    margin: 20px 5px;
    border: 2px solid #1E90FF;
    width: 950px;
    height: 480px;
    position: relative;
}

input[type="number"] {
    height: 40px;
    font-size: large;
    line-height: 14px;
}

@media (max-width: 800px) {
    input[type="number"] {
        height: 10vh;
        font-size: large;
        line-height: 40px;
    }
}