/*------------------------------------------------------------------------------
FONTS
------------------------------------------------------------------------------*/

@import url('https://fonts.googleapis.com/css2?family=Maven+Pro:wght@400;500;600&family=Roboto:wght@400;500;700');
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;600;700');

/*------------------------------------------------------------------------------
HTML
------------------------------------------------------------------------------*/

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    font-family: Roboto, sans-serif;
    font-size: 16px;
    line-height: 22px;
}

html {
    height: 100%;
}

body {
    position: relative;
    margin: 0;
    padding: 0;
    background-color: #bac0cf;
    height: 100%;
}

a {
    text-decoration: none;
    color: #1a90d9;
    font-weight: 400;
}

h1 {
    font-family: "Maven Pro", sans-serif;
    font-size: 21px;
    font-weight: 500;
    color: black;
    text-transform: uppercase;
    margin: 0 0 20px 0;
}

h2 {
    font-family: "Maven Pro", sans-serif;
    font-size: 21px;
    font-weight: 500;
    color: #005c94;
    margin: 0 0 20px 0;
}

p {
    font-family: Roboto, sans-serif;
    font-size: 16px;
    line-height: 22px;
}

ul, ol {
    padding-left: 15px;
}

/*------------------------------------------------------------------------------
PAGE TEXT
------------------------------------------------------------------------------*/

.page_text {
    max-width: 800px;
}

/*------------------------------------------------------------------------------
ICONS
------------------------------------------------------------------------------*/

.td_icon {
    padding-left: 45px;
    background-image: url(../images/icon_missing.png);
    background-size: 28px 28px;
    background-position: left 8px center;
    background-repeat: no-repeat;
}

.td_icon.source     { background-image: url(../images/icon_source.png); }
.td_icon.function   { background-image: url(../images/icon_function.png); }
.td_icon.cluster    { background-image: url(../images/icon_cluster.png); }
.td_icon.fml_section{ background-image: url(../images/icon_fml_section.png); }
.td_icon.fml_comp   { background-image: url(../images/icon_fml_comp.png); }
.td_icon.fml_option { background-image: url(../images/icon_fml_option.png); }

.link_icon {
    display: inline-block;
    height: 24px;
    line-height: 24px;
    padding-left: 30px;
    background-image: url(../images/icon_missing.png);
    background-size: 24px 24px;
    background-position: left center;
    background-repeat: no-repeat;
}

.link_icon:hover {
    color: #005c94;
}

.link_icon.recovery   { background-image: url(../images/icon_recovery.png); }
.link_icon.registrate { background-image: url(../images/icon_registrate.png); }
.link_icon.source     { background-image: url(../images/icon_source.png); }


/*------------------------------------------------------------------------------
LOGIN INFO
------------------------------------------------------------------------------*/

.login_info {
    position: absolute;
    right: 0;
    top: 28px;
    width: 240px;
    height: 64px;
    line-height: 20px;
    color: #005c94;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.login_info label {
    display: inline-block;
    width: 58px;
    margin-right: 4px;
    color: black;
}

/*------------------------------------------------------------------------------
CONTROLS
------------------------------------------------------------------------------*/

/* Standard input styling */
input {
    font-family: Roboto, sans-serif;
    font-size: 15px;
    color: black;
}

/* Hide focus outline */
input:focus,
textarea:focus {
    outline: none;
}

/* Input placeholder styling */
input::-webkit-input-placeholder { font-style: italic; color: #a3a3a3; }
input::-moz-placeholder          { font-style: italic; color: #a3a3a3; }
input:-ms-input-placeholder      { font-style: italic; color: #a3a3a3; }
input:-moz-placeholder           { font-style: italic; color: #a3a3a3; }

/* Hide autofill color */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active  {
    -webkit-box-shadow: 0 0 0 30px white inset !important;
}

/* Textarea placeholder styling */
textarea::-webkit-input-placeholder { font-style: italic; color: #a3a3a3; }
textarea::-moz-placeholder          { font-style: italic; color: #a3a3a3; }
textarea:-ms-input-placeholder      { font-style: italic; color: #a3a3a3; }
textarea:-moz-placeholder           { font-style: italic; color: #a3a3a3; }

/* Hide autofill color */
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
textarea:-webkit-autofill:active  {
    -webkit-box-shadow: 0 0 0 30px white inset !important;
}

/*------------------------------------------------------------------------------
TABLE
------------------------------------------------------------------------------*/

table {
    width: 100%;
    table-layout: fixed;
    border-collapse: separate;
    border: 1px solid #aac7dd;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    border-spacing: 0;
    margin-bottom: 10px;
}

table th,
table td {
    position: relative;
    border-left: 1px solid #aac7dd;
    border-top: 1px solid #aac7dd;
    height: 40px;
    padding: 0 8px 0 8px;
    font-size: 15px;
}

table th {
    background-color: #e5e4f5;
    /*border-top-left-radius: 10px;*/
    /*border-top-right-radius: 10px;*/
    /*-moz-border-radius-topleft: 10px;*/
    /*-moz-border-radius-topright: 10px;*/
    /*-webkit-border-top-left-radius: 10px;*/
    /*-webkit-border-top-right-radius: 10px;*/
    font-weight: 400;
    text-align: left;
    color: #362f6e;
    font-family: "Maven Pro", sans-serif;
}

table tr:first-child th,
table tr:first-child td {
    border-top: none;
}

table tr:last-child td:first-child {
    border-bottom-left-radius: 10px;
    -moz-border-radius-bottomleft: 10px;
    -webkit-border-bottom-left-radius: 10px;
}

table tr:first-child td:last-child {
    border-top-right-radius: 10px;
    -moz-border-radius-topright: 10px;
    -webkit-border-top-right-radius: 10px;
}

table tr:last-child td:last-child {
    border-bottom-right-radius: 10px;
    -moz-border-radius-bottomright: 10px;
    -webkit-border-bottom-right-radius: 10px;
}

table th:first-child {
    border-top-left-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -webkit-border-top-left-radius: 10px;
}

table th:last-child {
    border-top-right-radius: 10px;
    -moz-border-radius-topright: 10px;
    -webkit-border-top-right-radius: 10px;
}

table td:first-child, th:first-child {
    border-left: none;
}

/* Label when in form mode (login) */
table td.label {
    background-color: #e5e4f5;
    font-family: "Maven Pro", sans-serif;
    font-size: 16px;
    color: #362f6e;
    font-weight: 400;
    text-align: left;
    /*border-top-left-radius: 10px;*/
    /*border-bottom-left-radius: 10px;*/
    /*-moz-border-radius-topleft: 10px;*/
    /*-moz-border-radius-bottomleft: 10px;*/
    /*-webkit-border-top-left-radius: 10px;*/
    /*-webkit-border-bottom-left-radius: 10px;*/
}

table tr:first-child td.label {
    border-top-left-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -webkit-border-top-left-radius: 10px;
}

table tr:last-child td.label {
    border-bottom-left-radius: 10px;
    -moz-border-radius-bottomleft: 10px;
    -webkit-border-bottom-left-radius: 10px;
}

/* Nothing message */
table td .nothing {
    font-size: 15px;
    font-style: italic;
    color: #a3a3a3;
}

table.disabled td { background-color: #f0f0f0; color: #606060; cursor: default; }
table td.disabled { background-color: #f0f0f0; color: #606060; cursor: default; }

/*------------------------------------------------------------------------------
BUTTONS
------------------------------------------------------------------------------*/

.button {
    display: inline-block;
    height: 40px;
    line-height: 38px;
    font-size: 15px;
    font-family: "Maven Pro", sans-serif;
    color: white;
    background-color: #1a90d9;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    text-transform: uppercase;
    padding: 0 10px 0 10px;
    font-weight: 500;
    background-size: 30px 30px;
    background-repeat: no-repeat;
    cursor: pointer;
}

.button.medium {
    height: 30px;
    line-height: 28px;
}

.button.right {
    float: right;
}

.button.disabled {
    background-color: #dee7ed;
    cursor: default;
}

.button.blue {
    background-color: #1a90d9;
}

.button.blue.disabled {
    background-color: #dee7ed;
}

.button.purple {
    background-color: #824a99;
}

.button.gray {
    background-color: #bfcce5;
}

.button.purple.disabled {
    background-color: #d7d0da;
}

.button.red {
    background-color: #a04356; /* #d55393; */
}

.button.red.disabled {
    background-color: #eedde1;
}

.button.green {
    background-color: #4a997b;
}

.button.green.disabled {
    background-color: #dbebe5;
}

.button.forward {
    background-image: url(../images/btn_forward.png);
    background-position: right 5px center;
    padding-right: 28px;
    padding-left: 15px;
}

.button.backward,
.button.back {
    background-image: url(../images/btn_backward.png);
    background-position: left 5px center;
    padding-left: 28px;
    padding-right: 15px;
}

.button.login {
    background-image: url(../images/btn_login.png);
    background-position: left 7px center;
    padding-left: 42px;
    padding-right: 15px;
}

.button.save {
    background-image: url(../images/btn_save.png);
    background-position: left 5px center;
    padding-left: 34px;
    padding-right: 15px;
}

.button.cancel {
    background-image: url(../images/btn_cancel.png);
    background-position: left 5px center;
    padding-left: 36px;
    padding-right: 15px;
}

.button.edit {
    background-image: url(../images/btn_edit.png);
    background-position: left 5px center;
    padding-left: 36px;
    padding-right: 15px;
}

.button.delete {
    background-image: url(../images/btn_delete.png);
    background-position: left 5px center;
    padding-left: 12px;
    padding-right: 12px;
}

.button.info {
    background-image: url(../images/btn_info.png);
    background-position: left 5px center;
    padding-left: 12px;
    padding-right: 10px;
}

.button.small.edit {

    background-image: url(../images/btn_edit.png);
    background-position: left center;
    background-size: 24px 24px;
    padding-left: 24px;
    padding-right: 10px;
    height: 24px;
    line-height: 22px;
    border-radius: 6px;
    text-transform: none;
}

/*------------------------------------------------------------------------------
LAYOUT
------------------------------------------------------------------------------*/

/* Main page */
.page {
    position: relative;
    width: 90%;
    max-width: 1600px;
    /*width: 100%;*/
    min-height: 100%;
    background-color: white;
    margin: 0 auto;
    border-left: 1px solid #818c93;
    border-right: 1px solid #818c93;
    -moz-box-shadow: 0px 0px 43px 0px #737f9e;
    -webkit-box-shadow: 0px 0px 43px 0px #737f9e;
    box-shadow: 0px 0px 43px 0px #737f9e;
    padding-bottom: 20px;
}

/* Header */
.header {
    height: 120px;
    border-bottom: 8px solid #ebeff7;
}

/* Logo */
.logo {
    position: absolute;
    top: 25px;
    left: 40px;
    width: 635px;
    height: 40px;
    background-image: url(../images/logo.png);
    background-position: center center;
    background-size: 635px 40px;
}

.content {
    padding: 30px 40px 40px 40px;
}

.footer {
    position: absolute;
    display: table-cell;
    left: 0;
    right: 0;
    bottom: 0;
    height: 40px;
    line-height: 40px;
    background-color: #ebeff7;
    /*width: 100%;*/
    max-width: 1600px;
    z-index: 100;
    margin-left: auto;
    margin-right: auto;
    margin-top: -40px;
    text-align: center;
    font-size: 12px;
    /*border-left: 1px solid #818c93;*/
    /*border-right: 1px solid #818c93;*/
}

/*------------------------------------------------------------------------------
RESPONSIVE
------------------------------------------------------------------------------*/

/* Responsive */
@media(max-width: 1050px) {
    .header { height: 80px; }
    .logo   { width: 317px; height: 20px; top: 15px; background-size: 317px 20px; }
    nav     { top: 35px; }
    .page   { width: 100%; }
    .footer { width: 100%; }
    .login_info { top: 18px; line-height: 13px; font-size: 12px; }
    .login_info * { font-size: 12px; line-height: 13px;}
}

/* Responsive */
@media(max-width: 740px) {
    .login_info { visibility: hidden; }
}

/*------------------------------------------------------------------------------
CKEDITOR
------------------------------------------------------------------------------*/

.cke_toolgroup {
    margin: 0 2px 2px 0 !important;
}

.cke_bottom {
    padding: 0 !important;
}

.cke_path {
    display: none !important;
}

/*------------------------------------------------------------------------------
VFORM
------------------------------------------------------------------------------*/

table.vform                     { border: none; width: auto; }
table.vform td                  { border: none; padding: 0 10px 0 0; position: relative; padding-bottom: 20px; }
table.vform label               { display: block; color: #1a90d9; font-size: 14px; margin-bottom: 5px; }
table.vform input               { border: 1px solid #aac7dd; border-radius: 10px; height: 40px; line-height: 40px; padding: 0 8px 0 8px; width: 100%; }
table.vform input:disabled      { color: #606060; background-color: #f0f0f0; }
table.vform td .state           { display: none; position: absolute; right: 14px; top: 30px; width: 14px; height: 14px; background-image: url(../images/required.png); background-size: 14px 14px; }
table.vform td.required .state  { display: block; background-image: url(../images/required.png); }
table.vform td.passed   .state  { display: block; background-image: url(../images/passed.png); }
table.vform td.required input   { background-color: #f8fcff; }
table.vform td h2               { margin: 0; }
.vform_error                    { font-size: 13px; color: #be0000; margin-bottom: 25px; width: 100%; background-color: #feebeb; border: 1px solid #be0000; padding: 10px; max-width: 800px;}

/*------------------------------------------------------------------------------
SOURCESTATE COLORS
------------------------------------------------------------------------------*/

.sourcestate1 { color: #df0000; }
.sourcestate2 { color: #a18e27; }
.sourcestate3 { color: #298b75; }