html {
    background: #fff;
}

body {font-family: sans-serif;color: #3d3536; margin: 0; /*'Open Sans'*/
      -webkit-touch-callout: none; /*Prevent iOS long click menu on links*/
      -webkit-tap-highlight-color: rgba(0,0,0,0); /*iOS remove click highlight*/
}

h1, h2, h3, h4{font-weight: normal;}

/*Mobiscroll Custom*/
.mbsc-wdg .mbsc-wdg-c {font-size: 16px;}
.mbsc-fr-overlay {background: rgba(0,0,0,.7) !important;}
.mbsc-ios.mbsc-fr-top .mbsc-fr-popup {max-width: 800px; margin: 0 auto 50px auto; position:relative;}
.mbsc-ios.mbsc-fr-center .mbsc-fr-popup {max-width: 400px;}
.mbsc-fr-btn-c .mbsc-fr-btn{color: #ff0000;}

.top_logo{vertical-align: middle;width: 42px;}

.nav_bar {
    background: #fff;
    border-bottom: 3px solid #2196F3;
    position:fixed; top: 0;left: 0;z-index: 1000;width: 100%;
    box-shadow: 0 1px 8px rgba(0,0,0,.3);
}
.nav_box{font-size:1.2em;margin: 0 auto;width: 85%;padding:5px 0 5px 0;display:flex;justify-content:space-between;}
.nav_box_l{display:flex; align-items:center; min-width:0;}
.nav_box_r{display:flex; align-items:center; min-width:150px; justify-content:right;}
.nav_group{overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.nav_link{margin-left: 14px; color:#000;}

.page_bar {display: grid;grid-template-columns: 25% 50% 25%;}
.page_bar_left {grid-column: 1;justify-self: start;max-width: 100%;}
.page_bar_center {grid-column: 2;justify-self: center;}
.page_bar_right {grid-column: 3;justify-self: end;}

.page_title{font-size: 1.5em; margin: 0; padding: 0; line-height: 1.5em;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.page_body {margin: 75px auto 100px;width: 85%;min-width: 1000px;min-height: 700px;}
.page_content{padding-top:20px;}

.modal_body input, textarea{font-family: sans-serif;font-size: 1.1em; border-radius: 3px; background: #fff; width: 100%; padding: .25em .67em; border: 0; min-height: 2.5em; box-sizing: border-box;}
.modal_simple_text{font-size: 1.1em; text-align: center; margin: 20px 0 20px 0;}
.modal_label{font-size: .8em; margin: 10px 0 0 0; color: #007aff;}
.modal_label_error{background: #fd4444; padding: 5px; border-radius: 5px 5px 0 0; color: #ffffff;}
.modal_box{background: #fff; border-radius: 3px;border: 1px solid #cccccc;padding: 5px;margin: 10px 0;}
.modal_input_m_b{margin-bottom: 5px;}
.modal_input_w_extra{overflow: hidden; padding-right: .5em;}
.modal_color_picker input{height: 2.5em; cursor: pointer; width: 40px; display: block; padding: 0;}
.modal_duplicate_p{font-size:1.2em; text-align: center; color:#ff0000;background-color: #ffe5e5;padding: 10px 5px;}
.modal_search_p{margin-top: 5px; color: #ff6d00;}

.masonry_holder {column-count: 2;column-gap: 0px;}
.masonry_item {break-inside: avoid;padding: 1px 0 1px 0; /*Prevent margin collapse*/}

.main_box{margin: 0px 10px 20px 10px; border-radius: 5px;padding: 20px; box-shadow: 0 1px 4px rgba(0,0,0,.3); word-break: break-word;}
.main_box_item_h{float:left; width:50%; margin: 10px 0px;}

.generic_box{border-radius: 5px; margin-bottom: 20px; scroll-margin-top: 55px; box-shadow: 0 1px 4px rgba(0,0,0,.3);}
.generic_box_simple{padding: 5px 10px;}
.generic_banner {padding: 5px 10px;display:flex; justify-content: space-between; box-sizing: border-box;cursor:pointer;}
.generic_banner_titles {display:flex; flex-wrap: wrap;align-items: center;min-width:0;}
.generic_banner_icons {display:flex; align-items: center;}
.generic_banner_email{color: #F89406;}
.generic_body {border-top: 1px dashed #BBBBBB; padding: 10px;}
.generic_title {margin: 10px 0px;}
.generic_margin{margin: 0 5px 20px 5px;}
.generic_modal_row{margin: 10px 0 10px 0;}
.generic_field_drag{border: 1px solid #ff0000;margin: 10px 0 10px 0;}
.generic_footer {padding: 5px 10px 5px 10px; border-top: 1px solid #cecece;background-color: #fafafa;display:flex; justify-content: space-between;box-sizing: border-box;}
.generic_footer_items {display:flex; flex-wrap: wrap;align-items: center;min-width:0;}

.page_f_l{float:left;}
.page_f_r{float:right;}
.page_f_l_q{float:left; width:25%;}
.page_f_r_q{float:right; width:25%;}
.page_f_l_h{float:left; width:50%;}
.page_f_r_h{float:right; width:50%;}
.page_input_l{float:left; width:50%;text-align: right;}
.page_input_m{margin-right: 20px;}
.page_input_r{width: 70%;}
.page_input_r_extra{overflow: hidden; padding-right: .5em;}
.page_input_r_extra_f{width: 100%;}

.page_input_holder{width: 30%; margin: 0 auto 30px auto;}
.page_input{width: 100%;}
.info_field{color: #9E9E9E;font-size: .9em;margin-bottom: 5px;box-sizing: border-box;}
.info_value{word-break: break-word;margin-bottom: 5px;white-space: pre-wrap;}
.info_value_p{margin: 0 10px 5px 5px;}

.clear{clear:both;}
.f_l{float:left;}
.f_r{float:right;}
.f_r_f{float:right; width: 20%;}
.f_l_q{float:left; width: 25%;}
.f_r_q{float:right; width: 25%;}
.f_l_t{float:left; width: 33%;}
.f_r_t{float:right; width: 33%;}
.f_l_h{float:left; width: 50%;}
.f_r_h{float:right; width: 50%;}
.a_r{text-align:right;}
.t_a_l{text-align:left;}
.t_a_c{text-align:center;}
.t_a_r{text-align:right;}
.pad_ten{padding: 10px; box-sizing: border-box;}
.pad_ten_r{padding-right: 10px; box-sizing: border-box;}
.d_n{display:none;}
.overflow {overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}

.node_button{text-align:right; margin-top:30px;}
.show_password {cursor: pointer; font-style:italic; text-align:right;}

.title_t{margin-top: 0;}
.title_s{font-size: 1.2em; padding: 0; display:inline}
.paragraph {margin-bottom: 40px;line-height:2em;}
.t_s{font-size:.8em;}
.t_b{font-weight:bold;}
.t_u{text-decoration:underline;}
.indent_holder{margin: 15px 0 0 25px;}
.danger_holder{padding: 10px; border: 1px solid #c0392b;}
.error_border{border: 1px solid #F03434 !important;}

.edit{border-radius: 3px;padding: 0.25em 0.67em;min-height: 80px;background: #fff; border: 1px solid;}
.icon {cursor:pointer;vertical-align: middle;}
.icon_l {margin-left: 14px;}
.icon_25 {width: 25px;}

.loader {border: 8px solid #fff; border-top: 8px solid #2196f3; border-bottom: 8px solid #2196f3; border-radius: 50%; width: 50px; height: 50px; -webkit-animation: spin 2s linear infinite; animation: spin 2s linear infinite;display: inline-block;}
.loader_top {position: fixed; top: 0px; left: 50%; margin: -40px 0 0-25px; z-index: 999999;}
.message_popup {position: fixed;z-index: 100000;margin: auto;top: 0;right: 0;left: 0;width: 7em;background: white;bottom: auto;text-align: center;font-size: 1.2em;padding: 5px;border-radius: 0 0 5px 5px; -moz-border-radius: 0 0 5px 5px; -webkit-border-radius: 0 0 5px 5px;box-shadow: 0 0 1em rgba(0, 0, 0, 0.1);}

a{text-decoration:none; color: #2196F3;}
a.button{color: #2196F3; border: 1px solid #2196F3;background:#fff;border-radius: 3px;text-transform: uppercase;letter-spacing: 0.1em;font-size: .8em;font-weight:bold; line-height: 1em;padding: 0.75em 2em;display: inline-block;}
a.button:hover{opacity: .8;}
a.button_b_arrow{content: ""; display: inline-block; width: 0.6em; height: 0.6em; border-right: 0.2em solid #2196F3; border-top: 0.2em solid #2196F3; -webkit-transform: rotate(225deg); transform: rotate(225deg); margin-right: 0.5em;} /*em scale with font */
a.button_page_input{margin: 10px;}

a.button_modal{border: 1px solid #d9d9d9;background:#fff;border-radius: 3px;margin: 8px;width: 90%;box-sizing: border-box;line-height: 1em;padding: 0.5em 2em;display: inline-block;}
a.button_modal_r {background:#F03434; color: #fff;}
a.button_modal_g {background:#27bf0a; color: #fff;}

.simple_check_mark::before{content: "\2713";font-size: 1.2em; line-height: 1.5;}
.simple_empty_box::before{content: "\02610";font-size: 1.2em; line-height: 1.5;}

.chk_box input[type=checkbox]{display: none;}
.chk_box label{display: inline-block;text-align: center;cursor: pointer;}
.chk_box input[type=checkbox] + label{width: 2em;height: 2em;border: solid 1px #888888;border-radius: 10px;background: #fff;vertical-align: middle;margin-right:10px;}
.chk_box input[type=checkbox]:checked + label::before{content: "\2713";color: #2196F3;font-size: 24px;}

.radio_box input[type=radio]{display: none;}
.radio_box label{display: inline-block;text-align: center;cursor: pointer;}
.radio_box input[type=radio] + label{width: 2em;height: 2em;border: solid 1px #888888;border-radius: 20px;background: #fff;vertical-align: middle;margin-right:10px;}
.radio_box input[type=radio]:checked + label::before{content: "\2713";color: #2196F3;font-size: 24px;}

.switch_holder{margin:10px 15px 10px 10px;}
.switch_text {float:left; font-size: 1.1em;margin: 8px 10px 0 0;}
.switch_text_selected{color: Green;}
.switch {position: relative;display: inline-block;width: 60px;height: 34px;}
.switch_slider {position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0;background: #ccc;transition: .4s;border-radius: 34px;}
.switch_slider:before {position: absolute;content: "";height: 26px;width: 26px;left: 4px;bottom: 4px;background: white;transition: .4s;border-radius: 50%;}
.switch_input:checked + .switch_slider {background: #2196F3;}
.switch_input:checked + .switch_slider:before {-webkit-transform: translateX(26px);transform: translateX(26px);}

.box_round{font-size:1.0em; background: #fff; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border: solid 1px #888888; padding: 5px; box-sizing:border-box;min-height: 2.5em;}
.box_round:focus{box-shadow: inset 0 1px 1px rgba(0,0,0,0.075), 0 0 8px rgba(102,175,233,0.6);}
.box_round_modal{font-size:1.1em; margin: 0 0 0.25em; border-color: #fff; width: 100%;}
.box_round_form{margin: 0 0 0.75em;}
select.box_round, select.box_round_modal{-webkit-appearance:none; -moz-appearance: none; background: #fff url(/images/down-arrow.svg) no-repeat 100% 50%;}

input[type=text], input[type=password] {-webkit-appearance: none; -moz-appearance: none; appearance: none;}

.footer{margin:60px 0 40px 0; text-align:center;word-wrap: break-word;}
.footer_items{margin-bottom:30px;}
.footer_icon{margin: 0 5px 0 5px;}
.footer_link{display:inline; padding: 0 10px 0 10px;}

.downtime{margin-bottom: 10px;}

.c_error{color:#F03434;}
.c_success{color:#27bf0a;}
.c_svg_success{fill:#27bf0a;stroke:none;}
.c_svg_error{fill:#F03434;stroke:none;}

.c_w{color:#FFF;}
.c_blue {color: #2196F3;}
.c_gray {color: #bbbbbb;}

@-webkit-keyframes spin {
    0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}

@keyframes spin {
    0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}

@media (max-width: 1300px) {
    .page_bar {grid-template-columns: minmax(0, 1fr) auto auto;grid-template-rows: auto auto;}
    .page_bar_left {grid-column: 1;grid-row: 1;justify-self: start;}
    .page_bar_center {grid-column: 1 / -1; /* span both columns */grid-row: 2;justify-self: center;}
    .page_bar_center:has(*) {margin-top: 20px;}
    .page_bar_right {grid-column: 2;grid-row: 1;justify-self: end;}
}

@media screen and (max-width: 1000px) {
    .nav_box{width: auto;padding: 5px 10px 5px 10px;}
    .nav_pages{display:none;}

    .page_body {width: auto;min-width: initial;padding: 0 10px;}

    .masonry_holder {column-count: 1;}

    .main_box{margin: 0px 5px 20px 5px;}
    .main_box_item_h{width:100%;}

    .page_f_l{float:none;}
    .page_f_r{float:none;}
    .page_f_l_q{float:none;width: auto;}
    .page_f_r_q{float:none;width: auto;}
    .page_f_l_h{float:none;width: auto;}
    .page_f_r_h{float:none;width: auto;}
    .page_input_l{float:none; width:auto;text-align: left;}
    .page_input_r{width: 100%;}

    .page_input_holder{width: 50%;}

    .button_page_input {text-align:center; display: block;}

    .footer_items{margin-bottom:0;}
    .footer_link{display:block;padding: 10px 0 10px 0; border-top: 1px solid #bbb}
}

@media screen and (max-width: 600px) {
    .page_input_holder{width: 100%;}

    .desktop_img {display:none;}
    .mobile_img {display:initial;width: 80%; padding: 60px 0 20px 0;}
}

@media screen and (max-width: 350px) {
    .page_title{display:none;}
}