/* V2 Styles */

/* overall structure */
td.first_col { width: 20%; }
td.first_col td.sm_col { width: 40%; }
td.first_col td.gb_col { width: 60%; }
td.second_col { width: 2%; }
td.third_col { width: 68%; }
td.fourth_col { width: 10%; }
.dpg-backend-menu-2.gb_col {
	padding-left: 25px;
}

#container { padding: 35px 0px; }

@media (max-width: 1200px) {
    td.first_col { width: 10%; }
    td.first_col td.sm_col { width: 1%; }
    td.first_col td.gb_col { width: 99%; }

    td.second_col { width: 1%; }

    td.fourth_col { width: 1%; }
    #horizontal_menu div.menu_buttons { width: 30% !important; }
}

/* login */
#dynpg_login {
    width: 360px;
    height: 220px;
    box-shadow: 1px 1px 10px #333;
    border: 2px solid #00ABFB;
    border-radius: 20px;
}

#dynpg_login tr:last-child { background-color: #E9F8FF; }

#dynpg_login table {
    width: 100%;
    padding: 10px;
}

#dynpg_login #title {
    text-align: center;
    color: #00ABFB;
}

#dynpg_login #message {
    text-align: center;
    color: #00ABFB;
}
#dynpg_login #message > p { padding-left: 10px; }

#dynpg_support {
    width: 20%;
    float: right;
}
#dynpg_support a { padding: 0px 5px; }
#dynpg_news {
    width: 80%;
    float: left;
}

/* font */
body {
	font-family: 'Muli', sans-serif;
}

/* icons */
img.dynpg_icon {
    width: 18px;
    height: 18px;
    vertical-align: middle;
    margin-bottom: 2px;
}
img.dynpg_icon.small {
    width: 12px;
    height: 12px;
}
img.dynpg_icon + b { vertical-align: middle; }
a.middle_align,
img.middle_align,
span.middle_align { vertical-align: middle; }

#upload_data_config {
    float: right;
    margin: 0;
    background-color: #00ABFB;
    border-radius: 5px;
    box-shadow: 1px 1px 4px #666;
}
#upload_data_config img {
    width: 30px;
    height: 30px;
    cursor: pointer;
    vertical-align: middle;
}

/* header & menu */
#horizontal_menu {
    font-size: 0px;
    min-width: 620px;
}

#horizontal_menu div.fast_access img {
    cursor: pointer;
    -webkit-transition: all 0.3s ease-in 0s;
    -moz-transition: all 0.3s ease-in 0s;
    -ms-transition: all 0.3s ease-in 0s;
    -o-transition: all 0.3s ease-in 0s;
    transition: all 0.3s ease-in 0s;
}

#horizontal_menu div.fast_access img + span { cursor: pointer; }

#horizontal_menu div.fast_access.active img {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg);
}

#horizontal_menu div.fast_access .dropdown {
    /* Size & position */
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;

    /* Styles */
    font-size: 12px;
    background: #fff;
    margin-top: 9px;
    border-radius: 0 0 5px 5px;
    border: 1px solid rgba(0,0,0,0.2);
    border-top: none;
    border-bottom: none;
    list-style: none;
    box-shadow: 0px 5px 5px #333333;
    -webkit-transition: all 0.5s ease-in;
    -moz-transition: all 0.5s ease-in;
    -ms-transition: all 0.5s ease-in;
    -o-transition: all 0.5s ease-in;
    transition: all 0.5s ease-in;

    /* Hiding */
    max-height: 0;
    overflow: hidden;
}

#horizontal_menu div.fast_access .dropdown li {
    padding: 0 10px ;
}

#horizontal_menu div.fast_access .dropdown li a {
    display: block;
    text-decoration: none;
    color: #333;
    padding: 10px 0;
    font-size: 12px;
    transition: all 0.3s ease-in;
    border-bottom: 1px solid #e6e8ea;
}

#horizontal_menu div.fast_access .dropdown li:last-of-type a {
    border: none;
}

#horizontal_menu div.fast_access .dropdown li i {
    margin-right: 5px;
    color: inherit;
    vertical-align: middle;
}

/* Hover state */
#horizontal_menu div.fast_access .dropdown li:hover a {
    color: #00ABFB;
}

/* Active state */
#horizontal_menu div.fast_access.active .dropdown {
    border-bottom: 1px solid rgba(0,0,0,0.2);
    max-height: 400px;
}

#horizontal_menu div.menu_buttons div {
    display: inline-block;
    margin-right: 5%;
    float: right;
}

#horizontal_menu > div {
    display: inline-block;
    margin-bottom: 5px;
    margin-top: 5px;
}

#horizontal_menu img { vertical-align: middle; }

#horizontal_menu img + span {
    margin-left: 5px;
    color: white;
    font-size: 14px;
    vertical-align: middle;
}

#horizontal_menu div.fast_access {
    width: 20%;
    position: relative;
}
#horizontal_menu div.faq { width: 15%; }
#horizontal_menu div.search {
    width: 25%;
    min-width: 166px;
}
#horizontal_menu div.menu_buttons {
    width: 40%;
    vertical-align: middle;
}

#horizontal_menu div.search > div { display: inline-block; }
#horizontal_menu div.search > div:hover,
#horizontal_menu div.search input:focus,
#horizontal_menu div.search input:focus + img {
    box-shadow: 2px 2px 2px #666;
    outline: none;
}

#horizontal_menu div.search img {
    background-color: white;
    border-color: white;
    border-width: 1px;
    cursor: pointer;
}

#horizontal_menu div.search input {
    height: 14px;
    vertical-align: middle;
    border: 2px;
    padding: 2px;
}

#vertical_menu td.header_menu { min-width: 90px; }

#vertical_menu td.header_menu {
    border: 1px #00ABFB solid;
}

#vertical_menu td.header_menu > p {
    color: #00ABFB;
    margin: 5% 0 5% 5%;
    font-size: 14px;
}

#vertical_menu span.TinyWhite a {
    color: #00ABFB;
    font-size: 12px;
    /*font-family:Verdana;*/
    font-weight: normal;
}

#vertical_menu .dpg-backend-menu-active {
    background-color: #E9F8FF;
}

table#vertical_menu {
    border-spacing: 3px;
    border-collapse: separate;
}

#vertical_menu td.dpg-backend-menu {
    padding: 2% 5%;
    cursor: pointer;
}

#vertical_menu td.dpg-backend-menu:hover {
    background-color: #E9F8FF;
}
#vertical_menu .dpg-backend-menu-active {
    background-color: #E9F8FF;
}

/* dynpg content */
#content_table td.dynpg_content {
    padding: 0px;
    min-width: 738px;
}
hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #00ABFB;
    margin: 1em 0;
    padding: 0;
}
div.dynpg_footer {
    height: 30px;
    background-color: #00ABFB;
    position: fixed;
    right: 0;
    left: 0;
    bottom: 0;
    color: #fff;
}
div.dynpg_footer > p {
    text-align: center;
    vertical-align: middle;
}
tr.empty_row { background-color: #FFFFFF !important; }

/* content - table header options */
#table_header {
    background-color: #00ABFB;
    min-width: 757px;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    z-index: 1;
}
#table_header > table > tbody > tr:first-child { box-shadow: 0px 0px 10px #333333; }
#table_header > table > tbody > tr:first-child > td { border-bottom: 1px solid rgba(0,0,0,0.2); }
#table_header_options {
    border-bottom: 1px solid #00ABFB;
    padding-bottom: 4px;
}
#table_header_options div,
div.footer > div {
    display: inline-block;
    vertical-align: middle;
    font-size: 0px;
}
#table_header_options > div.title {
    width: 20%;
    min-width: 155px;
}
#table_header_options > div.expand { width: 20%; }
#table_header_options > div.paging { width: 60%; }
#table_header_options div > a > img {
    /*margin-right: 8px;*/
    vertical-align: middle;
}#table_header_options div.paging > div:first-child {
    margin-right: 3%;
    float: right;
 }
.Pagination { margin-bottom: 5px; }
.Pagination td.active { border-bottom: 1px black solid; }
.Pagination.sub td.active { border-bottom: 1px #00ABFB solid; }

/* common styling */
#dynamic-container {
    filter: alpha(opacity=10);
    -moz-opacity: 0.1;
    opacity: 0.1;
    width: 100%;
    position: absolute;
    z-index: 100;
    background-color: #3c3c3c;
    display: none;"
}
span.text {
    color: #00ABFB;
    font-size: 12px;
    margin: 0 3px;
    vertical-align: middle;
}
input.dynpg_button {
    vertical-align: middle;
    border: 1px solid #00ABFB;
    background-color: transparent;
    color: #00ABFB;
    margin:0 10px;
    padding:2px 6px;
}
input.dynpg_button.small { padding:2px 6px !important; }
input.dynpg_button.btn_alt {
    background-color: white;
    padding: 5px;
}
input.dynpg_button:hover,
input.dynpg_button:focus {
     color: #ffffff;
     background-color: #00ABFB;
     text-decoration: none;
     background-position: 0 -15px;
     -webkit-transition: background-position 0.1s linear;
     -moz-transition: background-position 0.1s linear;
     -o-transition: background-position 0.1s linear;
     transition: background-position 0.1s linear;
}
input.dynpg_button:active { background-color: #0044cc; }
input.dynpg_button.btn_big {
    padding: 10px;
    font-size: 14px;
}
input[type="password"],
input[type="text"] {
    border: 1px #00ABFB solid;
    outline: none;
}
textarea.TextFieldStyleWhite { border-color: #00ABFB; }
.TextFieldStyleWhite:focus,
.TextFieldStyleWhite:active,
input[type="password"]:focus,
input[type="password"]:active,
input[type="text"]:focus,
input[type="text"]:active { border: 1px black solid; }
table.dynpg_table { width: 100%; }
.dynpg_error {
    color: #b94a48;
    background-color: #f2dede;
    border: 1px solid #eed3d7;
    border-radius: 4px;
}
.dynpg_alert {
    color: #c09853;
    background-color: #fcf8e3;
    border: 1px solid #fbeed5;
    border-radius: 4px;
}
.dynpg_success {
    color: #468847;
    background-color: #dff0d8;
    border: 1px solid #d6e9c6;
    border-radius: 4px;
}
span.header_text {   /* table header */
    color: #333333 !important;
    font-weight:bold !important;
}
table.dynpg_data_table { width: 100%; }
table.dynpg_data_table td.mce_editor { width: 98%; }
table.dynpg_data_table th {
    padding: 5px 5px;
    cursor: pointer;
}
table.dynpg_data_table > tbody > tr > td {
    padding: 5px 5px;
    white-space: normal;
    font-size: 12px;
}
table.dynpg_data_table.formular > tbody > tr > td {
    clear: both;
    display: inline;
    float: left;
    font-size: 12px;
    padding-left: 1%;
    padding-top: 2px;
    white-space: normal;
}
table.dynpg_data_table hr {
    border-top: 1px solid #3336;
    margin: 3px;
}
table.dynpg_data_table.tbl_half { width: 50%; }
table.dynpg_data_table.tbl_half_quarter { width: 75%; }
table.dynpg_data_table > tbody > tr:nth-of-type(2n),
table.dynpg_data_table.tbl_alt > tbody > tr:nth-of-type(2n-1){ background-color: #E9F8FF; }
table.dynpg_data_table.tbl_alt > tbody > tr:nth-of-type(2n) { background-color: #E9F8FF; }
table.dynpg_data_table.tbl_full > tbody > tr { background-color: #E9F8FF; }
table.dynpg_data_table td.centered { text-align: center; }
table.dynpg_data_table td.left { text-align: left; }
table.dynpg_data_table td.right { text-align: right; }
select.dynpg_select {
    height: 23px;
    color: #00ABFB;
    padding: 2px 20px 2px 8px;
    background-size: 15px 23px;
    vertical-align: middle;
    border: 1px solid #00ABFB;
    background-position: 100%;
    background-repeat: no-repeat;
    background-image: url('../pictures/dynpg_down_arrow.png'), linear-gradient(to right, #00ABFB, #00ABFB);

    /* reset browser styling */
    border-radius: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-appearance: none;
    -moz-appearance: none;
}
select.dynpg_select.st_margin { margin: 0 2px; }
select.dynpg_select.st_large { width: 288px; }
select.dynpg_select:hover,
select.dynpg_select:active {
    color: #00ABFB;
    /* reset browser styling */
    outline: none;
}
table .format > tbody > tr { height: 40px; } /* was 50px */
table .format > tbody > tr > td:first-child { width: 12%; }
table .format.formular > tbody > tr > td:first-child {
    padding-top: 1%;
    width: 98%;
}

/* Edit Article view */
div.footer {
    width: 100%;
    margin: 15px 0;
    padding: 15px 0;
    color: #00ABFB;
    background-color: #E9F8FF;
}
div.footer > div { text-align: center; }
div.footer > div.title {
    text-align: left;
    width: 30%;
}
div.footer > div.title > h3 { margin-left: 15px; }
div.footer > div.mark_all {
    width: 10%;
    border-right: 1px #00ABFB solid;
}
div.footer > div.un_mark_all { width: 10%; }
div.footer > div.marked { width: 30%; }
div.footer > div.butons { width: 20%; }

div.dynpg_popup {
    background-color: white;
    border: 1px #00ABFB solid;
    padding: 5px;
    /*width: 400px;*/
    position: absolute;
    z-index: 100;
    display: none;
    box-shadow: 10px 10px 10px black;
}
td.has_extra > a span::before,
tr.has_extra > td:first-child span::before  {
    content: '';
    width: 12px;
    height: 12px;
    background-image: url("../pictures/dynpg_plus.png");
    background-size: 12px 12px;
    display: inline-block;
}

td.has_extra.open > a span::before,
tr.has_extra.open > td:first-child span::before  {
    background-image: url("../pictures/dynpg_minus.png");
}

#dynpg_group_tree td {
    padding: 5px 5px;
    white-space: normal;
    font-size: 12px;
}
fieldset.dynpg_fieldset {
    margin: 1px 1px 10px 1px;
    padding: 5px 5px 10px 5px; border: 1px #00ABFB solid;
}
fieldset.dynpg_fieldset legend { color: #00ABFB; }