html.css.default.css Maven / Gradle / Ivy

Go to download
@font-face {
    font-family: "Roboto Bold";
    src: url("../fonts/Roboto-Bold.ttf");
}

body {
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    background-color: #333333;
}

.individual-in-global {
    background-color: white;
}

.preview-image {
    max-width: 100%;
    max-height: 200px;
    width: auto;
    height: auto;
}

img {
    width: 100%;
}

.chart {
    display: table;
    width: auto;
    vertical-align: middle;
}

.chart-center {
    display: table;
    width: auto;
    margin: 0 auto;
    vertical-align: middle;
}

.pie-info {
    display: table-cell;
    vertical-align: inherit;
    text-align: left;
}

.pie {
    display: table-cell;
    width: 120px;
    margin-right: 20px;
    float: left;
}

/*
 * Tables
 */

/* Table */
.CustomTable {
    padding: 0px;
    color: #AAAAAA;
    border-collapse: collapse;
    display: table;
    width: 100%;
}
.CustomTable td {
    border-bottom: 1px solid #AAAAAA;
}
.CustomTable td {
    padding: 5px;
    padding-right: 15px;
    text-align: left;
}
.CustomTable p {
    margin: 0px;
}

/* Table 2*/
.CustomTable2 {
    text-align: left;
    margin-bottom: 10px;
    padding: 0px;
}
.CustomTable2 th {
    border-bottom: 1px solid #CCCCCC;
    text-align: left;
    font-weight: normal;
    padding: 5px;
}
.CustomTable2 td {
    padding: 5px 15px 5px 5px;
    font-family: Roboto Bold, sans-serif;
}
.CustomTable2 .c1 {

}
.CustomTable2 .c2 {
    white-space: nowrap;
}
.CustomTable2 .nowrap {
    white-space: nowrap;
}
.CustomTable2 p {
    margin: 0px;
}

.header-img{
    max-width: 293px;
}

/* Resize */
@media (max-width: 991px) {
    .text-center-sm {
        text-align: center !important;
    }

    .text-left-sm {
        text-align: left !important;
    }

    table {
        width: 100%;
    }

    img {
        margin-left: 20%;
        margin-right: 20%;
        width: 60%;
    }

    .center-table {
        margin-left: 20%;
        margin-right: 20%;
        width: 60%;
    }
}

@media (max-width: 767px) {
    .container {
        margin-left: 4%;
        margin-right: 4%;
    }

    .center-table {
        margin-left: 5%;
        margin-right: 5%;
        width: 90%;
    }

    img {
        margin-left: 10%;
        margin-right: 10%;
        width: 80%;
    }
}

/*
 *	Background colors 
 */

.header {
    background-color: #333333;
}

.main {
    background-color: #F2F2F2;
}

.footer {
    background-color: #333333;
}

/* Button css */
.button {
    margin: 5px;
    background-color: #00cdff;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    display: inline-block;
    cursor: pointer;
    color: #ffffff;
    font-family: Roboto Bold, sans-serif;
    font-size: 15px;
    padding: 6px 24px;
    text-decoration: none;
}

.button:hover {
    background-color: #0688fa;
    text-decoration: none;
}

.button:active {
    position: relative;
    top: 1px;
}

.button:focus {
    text-decoration: none;
    color: #ffffff;
}

/* File Structure list */
div > ul {
    border-radius: 5px;
    border: 1px solid #CCCCCC;
    padding: 15px;
    padding-left: 25px;
}

ul {
    list-style-type: none;
    padding: 0px;
    margin: 0px;
    padding-left: 25px;
}

li {
    padding-top: 5px;
}

/* Table 3*/
.CustomTable3 {
    margin-bottom: 10px;
    text-align: left;
    padding: 0px;
    border-collapse: collapse;
    table-layout: fixed;
    width: 100%;
    background-color: white;
}

.CustomTable3 th {
    text-align: left;
    background-color: #333333;
    padding: 5px;
    color: lightgray;
}

.CustomTable3 th:first-child {
    padding-left: 15px;
}

.CustomTable3 td {
    padding: 5px;
    padding-right: 10px;
    word-wrap: break-word;
}

.CustomTable3 td:first-child {
    padding-left: 15px;
}

.line-top {
    border-top: 1px solid #888888;
}

/* 
 * Titles css
 */
h1 {
    color: #CDCDCD;
    font-family: 'Roboto', sans-serif;
    font-weight: 300;
    font-size: 30px;

    position: relative;
    text-align: center;

    border-bottom: 1px solid;
    padding-bottom: 10px;
}

h1:after {
    content: '';
    position: absolute;
    width: 150px;
    height: 4px;
    background: #A6A6A6;
    bottom: -4px;
    left: 0;
    right: 0;
    margin: auto;
}

h2 {
    color: #AAAAAA;
    font-size: 30px;
    font-family: Roboto Bold, sans-serif;
}

h3 {
    color: #00CDFF;
    font-size: 35px;
    font-family: Roboto Bold, sans-serif;

    text-align: center;
}

h4 {
    margin-bottom: 10px;
}

h4 i {
    color: #33CCFF;
    font-size: 20px !important;
}

h5 {
    font-size: 15px;
    margin-bottom: 10px;
}

h5 i {
    font-size: 18px !important;
}

.color-grey {
    color: #AAAAAA;
}

/*
 * Margins
 */

.top10 {
    margin-top: 10px;
}

.top20 {
    margin-top: 20px;
}

.top30 {
    margin-top: 30px;
}

.top40 {
    margin-top: 40px;
}

.top50 {
    margin-top: 50px;
}

.top60 {
    margin-top: 60px;
}

.top70 {
    margin-top: 70px;
}

.top80 {
    margin-top: 80px;
}

.top90 {
    margin-top: 90px;
}

.top100 {
    margin-top: 100px;
}

.bot10 {
    margin-bottom: 10px;
}

.bot20 {
    margin-bottom: 20px;
}

.bot30 {
    margin-bottom: 30px;
}

.bot40 {
    margin-bottom: 40px;
}

.bot50 {
    margin-bottom: 50px;
}

.bot60 {
    margin-bottom: 60px;
}

.bot70 {
    margin-bottom: 70px;
}

.bot80 {
    margin-bottom: 80px;
}

.bot90 {
    margin-bottom: 90px;
}

.bot100 {
    margin-bottom: 100px;
}

.left20 {
    margin-left: 20px;
}

.left15 {
    margin-left: 15px;
}

.fullw {
    width: 100%;
}

@media (max-width: 991px) {
    .top10-sm {
        margin-top: 10px;
    }

    .top20-sm {
        margin-top: 20px;
    }

    .top30-sm {
        margin-top: 30px;
    }

    .top40-sm {
        margin-top: 40px;
    }

    .top50-sm {
        margin-top: 50px;
    }

    .top60-sm {
        margin-top: 60px;
    }

    .top70-sm {
        margin-top: 70px;
    }

    .top80-sm {
        margin-top: 80px;
    }

    .top90-sm {
        margin-top: 90px;
    }

    .top100-sm {
        margin-top: 100px;
    }

    .bot10-sm {
        margin-bottom: 10px;
    }

    .bot20-sm {
        margin-bottom: 20px;
    }

    .bot30-sm {
        margin-bottom: 30px;
    }

    .bot40-sm {
        margin-bottom: 40px;
    }

    .bot50-sm {
        margin-bottom: 50px;
    }

    .bot60-sm {
        margin-bottom: 60px;
    }

    .bot70-sm {
        margin-bottom: 70px;
    }

    .bot80-sm {
        margin-bottom: 80px;
    }

    .bot90-sm {
        margin-bottom: 90px;
    }

    .bot100-sm {
        margin-bottom: 100px;
    }
}

/*
 * Colors
 */
.info {
    color: #CDCDCD;
}

.info-white {
    color: #FFFFFF;
}

.info-dark {
    color: #777777;
}

.bold {
    font-family: Roboto Bold, sans-serif;
}

.warning {
    color: #FF9900;
}

.error {
    color: red;
}

.success {
    color: #66CC66;
}

.hover-row:hover {
    background-color: rgba(0, 106, 255, 0.08);;
}

.hide {
    display: none;
}

.show {
    display: block;
}

.popover {
    max-width: 100%;
}

.popover-title {
    color: black;
}

.popover-content i {
    float: right;
    margin: 5px 0px 10px 0px;
}

.expert {
    display: none;
}

.fa-times-circle {
    color: red;
}

.fa-exclamation-circle {
    color: #FF9900;
}

.fa-check-circle {
    color: #66CC66;
}

.fa-info-circle,
.fa-minus-circle {
    color: #7c7c7c;
}

@media (min-width: 991px){
    .vcenter,
    .vcenter-xs {
        display: inline-block;
        vertical-align: middle;
        float: none;
    }
}
@media (max-width: 991px){
    .vcenter-xs {
        display: inline-block;
        vertical-align: middle;
        float: none;
    }
}

.hcenter {
    text-align: center!important;
}
.tcenter {
    text-align: center !important;
    padding-left: 0px !important;
}

/**
 * Checkbox
 */
.clexpert {
    float: right;
    margin-top: 15px;
}

input[type="checkbox"] {
    display: none;
}

input[type="checkbox"] + label {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
}

input[type="checkbox"] + label span {
    display: inline-block;
    width: 19px;
    height: 19px;
    margin: -1px 0px 0 0;
    vertical-align: middle;
    background: url(../img/check_radio_sheet.png) left top no-repeat;
    cursor: pointer;
}

input[type="checkbox"]:checked + label span {
    background: url(../img/check_radio_sheet.png) -19px top no-repeat;
}

.noselect {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Chrome/Safari/Opera */
    -khtml-user-select: none; /* Konqueror */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none;
    /* Non-prefixed version, currently
                           not supported by any browser */
}