*, html {
    margin: 0px;
    padding: 0px;
}

body {
    background: #FFF;
    min-height:90vh;
    font-family: sans-serif;
    font-size:18px;
    line-height: 20px;
    color:#202124;
}

h1 {
    font-size: 25px;
    text-align: center;
    margin-top: 0px;
    margin-bottom: 61px;
    border-bottom: 1px solid #CCCCCC;
    padding: 17px 0px;
    line-height: 27px;
}

p {
    line-height: 22px;
}

.clear {
    clear:both;
    line-height: 0px;
    height: 0px;
}

.blueButton {
    background:#3c8dbc;
    border-radius: 3px;
    cursor:pointer;
    color:#FFFFFF;
    border:1px solid #367fa9;
    padding:11px 25px;
    box-shadow: 4px 4px 7px 1px #eeeeee;
}

.blueButton:hover {
    background: #367fa9;
    box-shadow: none;
}

.greenButton {
    background:#00a65a;
    border-radius: 3px;
    cursor:pointer;
    color:#FFFFFF;
    border:1px solid #367fa9;
    padding:11px 25px;
}

.greenButton:hover {
    background: #008d4c;
}

.paddedContent {
    padding: 0px 20px;
}

button#backTD {
    margin-top: -57px;
    float: left;
}

div#loginBox {
    margin:0 auto; 
    max-width: 420px; 
    margin-top:7vh; 
    text-align: center;
    border:2px solid #CCCCCC;
    box-sizing: border-box;
    border-radius: 25px;
    padding:55px 26px;
    box-shadow: 4px 4px 7px 1px #eeeeee;
}

div#loginBox .logoImage {
    max-width: 50%;
    margin-bottom: 45px;
}

div#loginBox label {
    display:inline-block;
    width:28%;
    text-align: left;
    box-sizing: border-box;
    vertical-align: middle;
}

div#loginBox input.textInput {
    display:inline-block;
    width:70%;
    box-sizing: border-box;
    border-radius: 5px;
    border:1px solid #CCCCCC;
    padding: 6px 8px;
    margin: 5px 0px;
}

div#loginBox .loginBox {
    text-align: right;
}

div#loginBox .loginButton {
    padding: 10px 19px;
    font-size: 16px;
    font-weight: bold;
    margin-top: 14px;
    cursor: pointer;
}

div#mainContent {
    max-width: 800px;
    margin: 0 auto;
    padding: 0px 0px 46px 0px;
    border: 1px solid #EEEEEE;
    margin-top: 33px;
    border-radius:30px;
    border-top: 3px solid #3c8dbc;
    border-bottom: 3px solid #3c8dbc;
    background: #FEFEFE;
}

div#mainContent p {
    text-align: center;
}

div#mainContent div.boxLink {
    width:31%;
    display:inline-block;
    margin: 0px 1%;
    box-sizing: border-box;
    box-sizing: border-box;
    border-radius: 25px;
    padding:55px 26px;
    box-shadow: 4px 4px 7px 1px #eeeeee;
    border:1px solid #DDDDDD;
    cursor:pointer;
    text-align: center;
    float:left;
}

div#mainContent div.boxLink:hover {
    background: #F3F3F3;
    color:#3c8dbc;
    box-shadow: none;
}

div#mainContent div.boxLink:hover img {
    filter: invert(51%) sepia(32%) saturate(799%) hue-rotate(158deg) brightness(91%) contrast(96%);
}

div#mainContent div.boxLink img {
    max-width: 60%;
    margin-bottom: 42px;
}

div#mainContent .uploadButton1 {
    text-align: center;
    margin: 0 auto;
    margin-top: 20px;
    margin-bottom: 11px;
    display: block;
    max-width: 57px;
}

div#mainContent .uploadButton1 img {
    max-width: 100%;
}

#fileListTable {
    width:100%;
    margin: 30px 0px 10px 0px;
    border-collapse: collapse;
}

#fileListTable .deleteButton {
    color:#FF0000;
    font-weight: bold;
    text-decoration: none;
}

#fileListTable .deleteButton:hover {
    color:#333333;
}

#fileListTable .centerText {
    text-align: center;
}

#fileListTable thead tr td {
    border: 1px solid #f4f4f4;
    padding: 9px 20px;
    font-weight: bold;
    font-size: 0.7em;
}

#fileListTable tbody tr td {
    border: 1px solid #f4f4f4;
    padding: 3px 15px;
    font-size: 0.8em;
}

#fileListTable tbody tr:nth-child(odd) td {
    background-color: #f9f9f9;
}

#fileListTable tbody tr:hover td {
    background-color: #f5f5f5;
}

#actionBar .rightSide .blueButton {
    margin: 0 auto;
    display: block;
    margin-top:25px;
}

#uploadSelectButton img {
    filter: invert(39%) sepia(75%) saturate(982%) hue-rotate(116deg) brightness(97%) contrast(101%);
}

#uploadSelectButton img:hover {
    filter: invert(51%) sepia(32%) saturate(799%) hue-rotate(158deg) brightness(91%) contrast(96%);
}

.dataTables_wrapper {
    font-size:11px;
}

table.dataTable tbody tr td {
    border:1px solid #f4f4f4;
}

table.dataTable tbody tr:nth-child(odd) td {
    background-color: #f9f9f9;
}

table.dataTable tbody tr:hover td {
    background: #f5f5f5;
}

.resultsBox {
    width: 100%;
    text-align: center;
}

.resultsBox img {
    width: 100%;
    max-width: 200px;
    display: block;
    margin: 0 auto;
    margin-top: 20px;
}

.rbOk {
    color:#008d4c;
}

.rbError {
    color:#d73925;
}

#footerAds {
    position: fixed;
    color:#CCCCCC;
    text-align: right;
    bottom:20px;
    right:20px;
}

#resultsTable {
    width:100%;
    margin: 30px 0px 10px 0px;
    border-collapse: collapse;
}

#resultsTable .centerText {
    text-align: center;
}

#resultsTable thead tr td {
    border: 1px solid #f4f4f4;
    padding: 9px 20px;
    font-weight: bold;
    font-size: 0.7em;
}

#resultsTable tbody tr td {
    border: 1px solid #f4f4f4;
    padding: 3px 15px;
    font-size: 0.8em;
}

#resultsTable tbody tr:nth-child(odd) td {
    background-color: #f9f9f9;
}

#resultsTable tbody tr:hover td {
    background-color: #f5f5f5;
}

#resultsTable .okFile {
    color:#00a65a;
}

#resultsTable .errorFile {
    color:#dd4b39;
}

#loader {
    width:100%;
    height:100%;
    z-index:100;
    position:fixed;
    left:0;
    top:0;
    background: #FFFFFF;
    opacity: 0.95;
    display:none;
}

#loader .centerImage {
    position: relative;
    width: 100%;
    height: 100%;
}

#loader .centerImage div {
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width:210px;
    height: 115px;
}

#loader .centerImage img {
    margin-bottom: 20px;
}

#linkCheck {
    width:100%;
    font-size:18px;
    padding:5px 10px;
    box-sizing: border-box;
}

@media screen and (max-width: 860px) {
    div#mainContent {
        margin-left: 35px;
        margin-right: 35px;
    }
}

@media screen and (max-width: 520px) {
    #footerAds {
        position: inherit;
        margin-top:20px;
        margin-top: 30px;
    }
}

@media screen and (max-width: 520px) {
    div#mainContent div.boxLink {
        width: 92%;
        margin-bottom:30px;
    }
}