/* REGISTRATION FORM - com_user_data_center */

.regist-form h1, .step2 h1 {margin-bottom: 30px;}
.regist-form h1 i {margin: 0px 0px 0px 2px; display: block; font-size: 12px; font-style: normal; color: red; line-height: 14px;}

.faq-table thead .F {background: #0eab61 !important;}
.faq-table thead .B {background: #d29333 !important;}
.faq-table thead .E {background: #b17a27 !important;}
.faq-table thead .P {background: #a07534 !important;}
.faq-table thead .A {background: #ae6800 !important;}

.faq-table tbody .F {background: #0eab61 !important;}
.faq-table tbody .B {background: #e6c18a !important;}
.faq-table tbody .E {background: #e1b879 !important;}
.faq-table tbody .P {background: #d5b07b !important;}
.faq-table tbody .A {background: #fdac40 !important;}
.faq-table tbody .F, .faq-table tbody .B, .faq-table tbody .E, .faq-table tbody .P, .faq-table tbody .A {color: #000 !important;}


/* REGISTRATION BAR */
.process_reg {float: right; margin: 0px auto 0px 25px; border-collapse: collapse; table-layout: fixed;}
.process_reg svg {max-height: 32px; max-width: 32px; margin: auto; display: block;}
.process_reg td, .process_reg th {padding: 4px 7px; text-align: center;}
.process_reg th svg {fill: #009d00;}
.process_reg td svg {fill: rgba(0,0,0,0.25);}

@media screen and (max-width: 899px) {
.regist-form h1, .step2 h1 {text-align: center;}
.process_reg {float: none; margin: 22px auto; }
}





.demo {background: rgba(0,0,0,0.05); box-shadow: 2px 3px 4px rgba(0,0,0,0.17); border-radius: 7px; margin: 0px 0px 0px 50px; font-size: 17px; padding: 35px 20px; color: rgba(0,0,0,0.5);}
.demo h4 {display: block; margin: 3px auto 5px auto; font-size: 36px; color: rgba(0,0,0,0.4);}
.demo a {display: block; margin: 20px auto 0px auto; font-size: 16px; border-radius: 38px; border-width: 1.5px ; border-style: solid; padding: 10px; text-transform: uppercase; max-width: 80%;}
.demo a svg {display: inline-block; margin: -3px 0px 0px 5px; max-width: 14px; max-height: 14px;}

.user-program div {font-size: 17px; vertical-align: bottom; white-space: nowrap;}
.user-program div b {font-size: 18px;}
.user-program div h5 {font-size: 19px; font-weight: normal; color: #777;}
.step2 {display: none;}



.regist-button {padding: 16px 46px; max-width: 800px; white-space: normal; margin: 25px auto 35px auto; font-size: 18px;}
.gdpr_label {font-size: 16px; margin: 35px auto 35px auto; position: relative; max-width: 800px; display: block;}
#gdpr_checkbox {width: 24px; height: 24px; margin: -2px 5px 0px 0px; display: inline-block;}
#gdpr_alert {display: none; background: red; padding: 10px; min-width: 125px; font-size: 14px; line-height: 20px; color: #fff; position: absolute; right: calc(100% + 25px); top: -20px;}
#gdpr_alert svg {display: block; position: absolute; fill: red; width: 30px; height: 30px; right: -30px; top: 17px;}

 @media screen and (max-width: 1023px) {
.gdpr_label {margin: 35px auto 35px auto; max-width: 600px;}
#gdpr_alert {right: calc(100% - 100px); top: 102%;}
#gdpr_alert svg {display: none;}
}



.tab-prg {text-align: center;}
.tab-prg-notice {float: right; color: #777; font-size: 14px; margin-bottom: -40px; font-weight: normal;}
.tab-prg ul {margin: auto;}
.tab-prg ul li {display: block; width: auto; box-sizing: border-box; text-align: left; list-style: none; padding: 0px 0px 8px 6px;}
.tab-prg ul li label {font-size: 17px; display: block; padding: 5px 6px 7px 10px; margin-left: 10px; border-bottom: 1px dotted transparent; color: #aaa; white-space: nowrap;}
.tab-prg ul li label:hover {border-bottom: 1px dotted #bbb; color: #444; text-decoration:none;}
.tab-prg input[type="radio"]:checked + label {color: #bb0000; text-decoration: underline; font-weight: bold;}
.tab-prg input[type="radio"] {float: left; height: 16px; width: 16px; margin: 7px 7px 0px 0px !important; display: inline-block;}
.tab-prg ul li span {font-size: 17px; width: auto; text-align: right; float: right; font-weight: normal;}
.tab-prg ul li span {display: none;}
.tab-prg ul li span.show_sk,.tab-prg ul li span.show_cz, .tab-prg ul li span.show_other, .tab-prg ul li span.sk-sk, .tab-prg ul li span.cs-cs, .tab-prg ul li span.en-en {display: inline-block;}
.tab-prg ul li span a {display: inline-block;}
.tab-prg ul li span a img {vertical-align: top; margin: 0px 0px 10px 3px; max-height: 22px;}
.tab-prg ul li small {color: #888; float: right;}

.hereby {font-size: 14px; color: #999; text-align: center;}
.hereby-sk, .hereby-cz , .hereby-en {display: none;}


/* ACTIVATION */

.activation-buttons {text-align: center;}
.activation-buttons a.equal-height {margin: 22px 12px 25px 12px; display: inline-block; border-width: 1px; border-style: solid; max-width: 300px; width: 100%; border-radius: 6px; padding: 20px 4px; box-sizing: border-box;transition:.9s; -o-transition:.9s; -ms-transition:.9s; -moz-transition:.9s; -webkit-transition:.9s; position: relative; vertical-align: top; color: #656565; min-height: 92px; font-size: 15px;}
.activation-buttons a.equal-height:hover {text-decoration: none;}
.activation-buttons b {font-size: 20px; margin: 8px auto 2px auto; display: block;}

.activation-buttons .iconx {position: absolute; top: -24px; left:0px; right: 0px; text-align: center;}
.activation-buttons a.equal-height svg {height: 38px; width: 38px;  margin: auto; padding: 0px 12px; background: #fff;}



/* REGISTRATION */

.main-activity {text-align: left; max-width: 700px; margin: 0px auto 30px auto;}
.main-activity h6 {text-align: center; display: block; margin: 0px auto 30px auto; color: red; font-size: 17px;}
.main-activity input[type="radio"] {display: none;}
.main-activity label {display: block; margin: 0px 0px 5px 0px; border: 1px solid transparent; padding: 18px 24px; border-radius: 46px;}
.main-activity label b {display: block; margin: 0px 0px 1px 0px; font-size: 19px;}
.main-activity label p {display: block; font-size: 16px; color: #777; margin: 0px 0px 0px 35px;}
.main-activity label img {display: inline-block; margin: 0px 10px 0px 0px; float: left; opacity: 0.0; -o-transition:.6s; -ms-transition:.6s; -moz-transition:.6s; -webkit-transition:.6s; transition:.6s;}
.main-activity label:hover img {opacity: 0.3;}
.main-activity label:hover {border: 1px solid #91e393; text-decoration: none; color: #008c00}
.main-activity input[type="radio"]:checked + label img {opacity: 1;}
.main-activity input[type="radio"]:checked + label b {color: #008c00}
.form .main-activity input[type="radio"]:checked + label {border: 1px solid #008c00 !important; border-width: 1px; border-style: solid; color: #ff0000; text-decoration: none;}



.notification {margin: 45px auto 35px auto; text-align: center;}

.notification h3, .notification h6 {font-size: 24px; color: white; background: red; font-weight: bold; margin: 0px auto 15px auto; padding: 18px 50px; text-align: center; display: table; border-radius: 100px;}


.notification h3 {background: red;}
.notification h3 img {max-height: 30px; display: inline-block; margin-right: 12px; vertical-align: middle;}
.notification p {display: block; font-size: 17px; margin-top: 3px; color: #fff;}
.notification h4 {font-size: 19px; color: red; margin: 20px auto;}

.notification h6 {background: #009900;}
.notification h6 img {max-height: 30px; display: inline-block; margin-right: 12px; vertical-align: middle;}
.notification h2 {font-size: 20px; color: #009900; margin: 20px auto;}

.notification h5 {font-size: 18px; margin: 10px auto; font-weight: normal;}

.warn-li {margin: 35px auto 15px auto; display: inline-block;}
.warn-li li {list-style: disc; text-align: left; padding: 3px 0px 3px 0px; margin-left: 30px;}
.warn-li li, .warn-li li a {font-size: 16px;}
.warn-li li:first-child {list-style: none; margin-left: 10px;}
.warn-li li b {font-size: 18px;}



/* COUPON */
img.coupon-logo {max-width: 64px; max-height: 16px;}



/* PAYMENT SECTION */

.payment {text-align: center; margin: 20px auto; text-align: center; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-flow: row wrap; justify-content: space-around; padding-left: 20px;}

.payment a, .payment form.paypal {margin: 0px 7px 20px 7px; padding: 12px 5px 20px 5px; text-align: center; vertical-align: top; border-radius: 12px; border: 3px solid rgba(255,255,255,0); font-size: 19px; line-height: 23px; -o-transition:.4s; -ms-transition:.4s; -moz-transition:.4s; -webkit-transition:.4s; transition:.4s; color: #FFF; word-break: break-word; flex: 1 0 140px;}
.payment a:hover {box-shadow: 1px 4px 8px rgba(0,0,0,0.2); border: 3px solid rgba(255,255,255,0.7);}

.payment .tatra {background: #b85514;}
.payment .tatra:hover {background: #e76b18;}
.payment .csob {background: #72b371;}
.payment .csob:hover {background: #92c491;}
.payment .cardpay {background: #d58917;}
.payment .cardpay:hover {background: #e79823;}
.payment .paypal {background: #507fb5;}
.payment .paypal:hover {background: #6892bf;}

.payment a img {display: block; margin: 10px auto; max-height: 40px;}

.payment a {display: none;}
.payment a.show_sk, .payment a.show_cz, .payment a.show_other {display: inline-block;}
.payment a .payment-flag {display: none;}
.payment a .payment-flag.show_sk, .payment a .payment-flag.show_cz {display: block !important;}
.payment form.paypal {display: table; width: auto; margin: 15px auto;}


.passive-account-links {display: table; margin: 70px auto 20px auto; border-top: 1px solid #EEDABF; padding: 30px;}
.passive-account-links a {display: block; padding: 10px; font-size: 18px;}
.passive-account-links a img {vertical-align: -7px; margin-right: 7px; max-height: 24px;}


.payment-options .site-label2 {margin: 20px 30px 0px 10px; padding: 25px 0px 10px 10px; font-size: 22px;}
.payment-options .div-cell-half {margin: 0px 0px 55px 0px;}

.price-program .user_programs ul {margin: 0px 0px 0px 10px;}
.price-program .user_programs ul li {list-style: none;}
.price-program .user_programs ul li label, .price-program .user_programs ul li input[type="radio"] {display: inline-block; width: auto; border: none; margin: 0px;}
.price-program .user_programs ul li label,.price-program .user_programs ul li label span {font-size: 15px;}
.price-program .user_programs ul li input[type="radio"]:checked + label b {color: #ff0000; text-decoration: underline; font-weight: bold;}
.price-program .user_programs ul li span, .price-program  .user_programs ul li span.sk-, .price-program  .user_programs ul li span.en- {display: none;}
.price-program  .user_programs ul li span.sk-sk, .price-program  .user_programs ul li span.en-cs, .price-program  .user_programs li span.en-en {display: inline-block;}


.price-program .program {display: none;}
.price-program .show_sk, .price-program .show_cz, .price-program .show_other, .price-program .auto_renewal {display: block;}

.price-program .program.show-sk {display: block !important;}

.price-program button {padding: 12px 6px; font-size: 20px;}


.price-program .fader {position: relative; display: inline-block;}
.price-program .free_blocked {position: absolute; top: -25px; font-size: 19px; background: red; padding: 14px 24px; color: #fff; width: 170px; text-align: center; right: 20px;}
.price-program .free_blocked .arrow-up {position: absolute; top: 100%; left: 18px; max-height: 10px;}

.validity {font-size: 21px; color: #ff0000; font-weight: normal;}




/* COUPON USER - Waiting ... - com_user_status56 */
.partner_part {text-align: center; margin: 35px auto; font-size: 18px; color: rgba(0,0,0,0.45);}
.partner_part img {display: block; margin: 20px auto 15px auto; max-height: 100px; max-width: 250px;}
.partner_part p {font-size: 21px; color: rgba(0,0,0,0.79); font-weight: 300;}



/* COUPON USER - Expired ... - com_user_status57 */
.partner_lg {float: right; font-size: 18px; color: rgba(0,0,0,0.74);}
.partner_lg img {max-height: 80px; max-width: 150px; margin-left: 7px;}

@media screen and (max-width: 1023px) {
.partner_lg {float: none; margin: 14px auto; display: block; text-align: center;}
}

.user_programs2 ul {margin: 5px 0px; clear: both;}
.user_programs2 ul li {list-style: none; padding: 5px 0px;}
.user_programs2 ul li label {display: inline-block; width: 94%; border-bottom: 1px solid rgba(0,0,0,0.2); margin: 0px !important; padding: 8px 4px !important;}
.user_programs2 ul li input[type="radio"] {display: inline-block; margin: -4px 0px 0px 0px;}
.user_programs2 ul li label, .user_programs2 ul li label span {font-size: 15px;}
.user_programs2 ul li input[type="radio"]:checked + label b {color: #ff0000; text-decoration: underline; font-weight: bold;}
.user_programs2 .hide-cs, .user_programs2 .hide-en {display: none;}



/* ACCOUNT - TABS */
.account-tab-nav {white-space: nowrap;}
.account-tab h1 {margin-left: 25px;}
.account-tab .r-tabs-accordion-title {display: none !important;}
.account-tab-nav ul {padding: 0px; margin: 0px; white-space: nowrap;}
.account-tab-nav li {padding: 0px; margin: 0px; /* height: 62px; */ display: inline-block;}
.account-tab-nav li a {display: block; font-size: 18px; padding: 18px 25px;}
.account-tab-nav li a svg {display: inline-block; height: 28px; width: 28px; margin: 0px 12px 0px 0px;}
.account-tab-nav li.right {font-size: 18px; text-align: center; opacity: 0.8; padding: 10px 0px 0px 0px; text-align: right;}
.account-tab-nav .r-tabs-state-active a {font-weight: normal;}

@media screen and (max-width: 767px) {
.account-tab-nav li.right, .account-tab-nav li a svg {display: none;}
.account-tab-nav li a {display: block; font-size: 16px; padding: 18px 15px;}
.account-tab-nav li svg.hm {display: inline-block;}
}


#home, #features, #registration {padding: 0px 10px;}





/* ===== ACCOUNT  - HOME ===== */
/* =========================== */


/* MESSAGES */

.messages {text-align: center;}
.messages a, .messages div {display: block; padding: 15px 30px 15px 75px; margin: 0px auto 15px auto; max-width: 800px; position: relative; border-radius: 4px; min-height: 50px; text-align: left; color: #fff; font-size: 15px;}
.messages a {background: url(/ico/ArrowRight.svg) no-repeat right 7px center; background-size: 32px 32px;}
.messages a:hover {box-shadow: 0px 3px 6px rgba(0,0,0,0.25); text-decoration: none; color: #fff;}

.messages a svg, .messages div svg {display: block; width: 38px; height: 38px; fill: #fff; position: absolute; top: calc(50% - 18px); left: 20px;}
.messages a b, .messages div b {display: block; margin: 0px; text-align: left; color: #fff; font-size: 17px;}

.messages a.warning, .messages div.warning {background-color: #ff3e3e;}
.messages a.warning:hover {background-color: #ea0000;}
.messages a.invoice, .messages div.invoice {background-color: #ff9326;}
.messages a.invoice:hover {background-color: #f07800;}
.messages a.message, .messages div.message {background-color: #00b36b;}
.messages a.message:hover {background-color: #009d5f;}

.messages > div > a {float: right; display: table; padding: 8px 28px 8px 18px; margin: 2px -10px 0px 15px; height: auto; min-height: 0; width: auto; border-radius: 8px; text-align: left; color: #fff; font-size: 15px; background-color: rgba(255,255,255,0.07); border: 1.5px solid rgba(255,255,255,0.68); background-size: 12px 12px;}



/* CMS */
.cms_messages {margin: 30px auto 15px auto;}






/* ICON BOX - TOOLTIP - HIDDEN SUBMENU  */

div.toggle {display: none; margin: 0px auto 33px auto; /* max-width: 1330px;  */padding: 25px 20px 25px 0px; text-align: center; background: rgba(0,0,0,0.05);}
div.toggle .div-table div {display: table-cell; padding: 0px 10px 0px 30px; text-align: left; max-width: none; color: rgba(0,0,0,0.5); width: auto; vertical-align: middle;}
div.toggle div.bttns {width: auto; border-right: 1px solid rgba(0,0,0,0.1); text-align: center; font-size: 21px;}
div.toggle a {display: inline-block; width: auto; padding: 3px 5px; margin: 0px 12px; font-size: 16px;}
div.toggle a.ghost {border-width: 1.5px; border-style: solid; border-radius: 60px; width: auto; padding: 10px 15px; margin: 5px 25px 5px 0px; font-size: 16px; min-width: 200px; text-align: center;}
div.toggle div.remains {max-width: 160px; font-size: 14px; line-height: 20px; border-right: 1px solid rgba(0,0,0,0.1); white-space: nowrap;}
div.toggle div.remains span, div.toggle .div-table div.remains b {font-size: 14px; display: inline-block;}
div.toggle div.inf {width: 370px; font-size: 15px;}


@media screen and (max-width: 1023px) {
div.toggle .div-table div {display: block; text-align: center;}
div.toggle .div-table div.inf {display: none;}
div.toggle a {width: auto; padding: 3px 5px; margin: 10px 12px;}
div.toggle .div-table div.remains {display: none;}
}
@media screen and (max-width: 767px) {
div.toggle a {display: block; width: auto;}
}


.account-tab h3 {font-size: 24px; line-height: 30px; margin: 25px 0px 0px 5px; font-weight: 300;}



.feature_divs {margin: 0px auto 0px auto; display: flex; display: -webkit-flex; display: -moz-flex;justify-content: space-around; -webkit-justify-content: space-around; -moz-justify-content: space-around; flex-flow: row wrap; -webkit-flex-flow: row wrap; -moz-flex-flow: row wrap;}


.feature_divs > div {font-size: 15px; margin: 0px; padding: 0px 12px 17px 12px; text-align: left; vertical-align: top; border-radius: 4px; border: 1px solid rgba(255,255,255,0); line-height: 22px; position: relative; flex: 1 0 50%; min-width: 650px;}
 
.feature_divs div.full_width_flex {width: 100%; display: block; flex: 0 1 100%;}
.feature_divs div.full_width_flex:empty {padding: 0px; margin: 0px;}

.feature_divs .flag {margin: -4px 5px 0px 0px; vertical-align: middle;}

@media screen and (max-width: 1023px) {
}



/* TRIAL */

.trial_teaser {margin: 5px auto 0px auto; padding: 20px 30px; background: #d96c00; border: 1px solid rgba(0,0,0,0.1); box-shadow: 1px 2px 6px rgba(0,0,0,0.14); border-radius: 4px; color: #fff; text-align: center; position: relative;}

.bttn_cls {position: absolute; top: -14px; right: -14px; max-height: 26px; max-width: 26px; cursor: pointer;}

.trial_teaser_header {display: block; float: none; clear: both; border-bottom: 1.5px solid rgba(255,255,255,0.5); padding: 0px 0px 15px 0px; margin: 0px 0px 15px 0px;}

.trial_teaser h2 {display: block; margin: 0px 0px 0px 0px; text-align: left; font-size: 34px; font-weight: 300;}

.trial_teaser h2 div {display: block; margin: 0px 0px 0px 2px; text-align: left; font-size: 15px; font-weight: 400; color: rgba(255,255,255,0.7)}


/* TOP RIGHT VALIDATION PART + ORDER BUTTON */

.trial_teaser .valid {float: right; font-size: 27px; font-weight: normal; text-shadow: none; line-height: 28px; margin: 5px 0px 0px 0px; text-align: right; color: rgba(255,255,255,0.8); vertical-align: top;}
.trial_teaser .valid b {color: #fff; font-size: 27px;}
.trial_teaser .valid p {color: rgba(255,255,255,0.8); font-size: 15px; margin: 0; padding:0;}


.trial_teaser h3 {display: block; margin: 20px auto; text-align: center; font-size: 21px; font-weight: 600;color: #fff; letter-spacing: 1px;}

.trial_teaser_footer {display: block; float: none; clear: both; margin: 5px 0px 0px 0px; font-size: 15px; text-align: center;}

.trial_teaser_footer a {color: rgba(255,255,255,0.8);}
.trial_teaser_footer a:hover {color: #fff;text-decoration: underline;}


/* PAYMENT BUTTON*/

.trial_payment_buttons {margin: auto;}
.trial_payment_buttons a {text-align: center; padding: 18px 20px; white-space: nowrap; border: 1.5px solid rgba(255,255,255,0.4); vertical-align: middle; margin: 0px 5px 8px 5px; border-radius: 4px; display: inline-block; color: #fff;}
.trial_payment_buttons a:hover {border: 1.5px solid rgba(255,255,255,0.8); text-decoration: none;}
.trial_payment_buttons .program {color: rgba(255,255,255,0.9); font-size: 30px; margin: 0px 5px 0px 0px; line-height: 0px;}
.trial_payment_buttons div {display: inline-block; vertical-align: middle;}
.trial_payment_buttons .program-price {color: rgba(255,255,255,0.7); font-size: 30px; font-weight: bold; line-height: 0px;}
.trial_payment_buttons .program-currency {color: rgba(255,255,255,0.7); font-size: 13px; line-height: 12px; text-align: left;}
.trial_payment_buttons .program-currency span {display: block; font-size: 13px; color: rgba(255,255,255,0.7);}
.trial_payment_buttons .program-currency span:empty {display: none;}
.trial_payment_buttons a:hover div, .trial_payment_buttons a:hover .program-price, .trial_payment_buttons a:hover .program-currency , .trial_payment_buttons a:hover .program-currency span {color: rgba(255,255,255,1);}



@media screen and (max-width: 960px) {
.trial_teaser .valid {display: none;}
.trial_payment_buttons a {display: block; margin: 0px auto 8px auto;}
}














/* TABLES - WELCOME - FIRST SCREEN OF THE FEATURE */

.feature_table_scroll {padding: 0px 2px 5px 2px;}

.feature_divs a.add {min-width: 220px; font-size: 16px; margin-bottom: 0px;}
.feature_divs a.add svg {height: 12px; width: 12px;}
.feature_table_scroll div.notice-empty {padding: 18px 0px 0px 0px; font-size: 16px;}


.feature_table {box-shadow: 1px 2px 2px 0px rgba(0,0,0,0.05);}
.feature_table:hover {box-shadow: 2px 2px 2px 0px rgba(0,0,0,0.1);}
.feature_table thead tr th, .feature_table thead tr td {padding: 11px 0px 11px 11px; font-size: 14px;}
.feature_table tbody tr th, .feature_table tbody tr td {padding: 8px 10px;}
.feature_table .date {width: 140px;}
.feature_table .date-small {width: 100px;}
.feature_table .price {width: 140px;}
.feature_table .date, .feature_table .date-small, 
.feature_table .price {white-space: nowrap; max-width: none;}
.feature_table .date-small, .feature_table tr:hover .date-small {border-right: none;}


.feature_table .unread a, .feature_table .unread th {font-weight: bold;}
.feature_table.ui_table thead tr th a, .ui_table thead tr td a {background-image: none; width:calc(100% - 30px); float: left;}
.feature_table.ui_table thead tr th a.right, .ui_table thead tr td a.right {width: 20px; text-align: right; padding: 0px;}
.feature_table.ui_table thead tr th a.right svg, .ui_table thead tr td a.right svg {width: 17px; height: 17px; fill: rgba(0,0,0,0.15);}
.feature_table.ui_table thead tr th a.right:hover svg, .ui_table thead tr td a.right:hover svg {fill: rgba(0,0,0,0.3);}

.out_stock, .in_stock, .off_stock {display: none;}
.out_stock.stock-1, .in_stock.stock1, .off_stock.stock0 {display: block;}




/* REGISTRATION / CONTACT DATA */

.contact-flex {margin: 0px auto 0px auto; display: flex; display: -webkit-flex; display: -moz-flex;justify-content: space-around; -webkit-justify-content: space-around; -moz-justify-content: space-around; flex-flow: row wrap; -webkit-flex-flow: row wrap; -moz-flex-flow: row wrap;}

.contact-flex > div {font-size: 15px; width: 440px; margin: 0px 0px 15px 0px; padding: 25px 30px; text-align: left; vertical-align: top; border-radius: 7px; border: 1px solid rgba(255,255,255,0); line-height: 22px; min-height: 112px; -o-transition:.3s; -ms-transition:.3s; -moz-transition:.3s; -webkit-transition:.3s; position: relative; flex: 1 0 440px;}

.contact-flex > div:hover {border: 1px solid rgba(0,0,0,0.17);}

.contact-flex > div > h4 {display: block; margin: 0px 0px 0px -4px; text-align: left; font-size: 18px; font-weight: 400;}

.contact-flex > div > h4 > a {display: block; float: right; margin: 0px 0px 0px -8px; text-align: left; font-size: 14px; font-weight: 400;}
.contact-flex svg {display: inline-block; margin: -3px 1px 0px 5px; max-width: 12px; max-height: 12px;}

.contact-flex > div > h4 > img {display: inline-block; margin: 0px 0px 0px 7px;}

.contact-flex > div > span {display: block; margin: 8px 0px 0px 0px; text-align: left; font-size: 14px; font-weight: 400; color: rgba(0,0,0,0.6);}





/* ACCOUNT - TAB - FEATURES */

#nav-menu {margin: 30px auto 0px auto; text-align: center;display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;-webkit-flex-flow: row wrap; justify-content: center;}

#nav-menu > div, .hidden-features > div {width: 300px; margin: 0px 11px 30px 11px; padding: 35px 5px 25px 5px; text-align: center; vertical-align: top; color: #fff; border-radius: 7px; border: 0px solid rgba(255,255,255,0.01); font-size: 14px; line-height: 22px; min-height: 112px; -o-transition:.3s; -ms-transition:.3s; -moz-transition:.3s; -webkit-transition:.3s; position: relative;}

#nav-menu > div:hover {box-shadow: 0px 3px 6px rgba(0,0,0,0.25); text-decoration: none; border: 0px solid rgba(255,255,255,0.7);}

#nav-menu > div a, .hidden-features > div a {color: #fff; display: block; font-size: 16px;}

#nav-menu > div a.ghost, .hidden-features > div a.ghost {border: 1.5px solid rgba(255,255,255,0.6); border-radius: 60px; display: table; width: auto; padding: 10px 10px; margin: 15px auto 12px auto; font-size: 16px; min-width: 220px; color: rgba(255,255,255,0.9);}

#nav-menu > div a.ghost:hover, .hidden-features > div a.ghost:hover {border: 1.5px solid #fff; text-decoration: none; color: #fff;}

#nav-menu > div > .remains {margin: 12px auto 0px auto; font-size: 15px; line-height: 18px; color: rgba(255,255,255,0.8);}
#nav-menu > div > .remains span {}

#nav-menu > div h3, .hidden-features > div h3 {font-size: 21px; font-weight: 300; line-height: 30px; padding: 0px 0px 4px 0px; word-break: break-word; display: block;}

#nav-menu > div h3, #nav-menu > div h3 span, .hidden-features > div h3 {font-size: 21px; font-weight: 300; line-height: 30px; margin: 0px auto;}

#nav-menu > div h3 span {display: inline; color: #fff; font-size: 24px;}
#nav-menu > div h3 span:hover {text-decoration: none;}
#nav-menu > div h3 span.en {display: none;}

#nav-menu > div h3::first-line, .hidden-features > div h3::first-line {font-size: 26px;}

#nav-menu > div svg {max-height: 56px; max-width: 56px; margin: 0px auto 20px auto; fill: #fff;}

#nav-menu > div:hover h3, .hidden-features > div:hover  h3 {opacity: 1.0;}

#nav-menu div.passiv {background-color: rgba(0,0,0,0.20); background-position> 15px 15px; -webkit-transition-property: none; -moz-transition-property: none;
-o-transition-property: none;
transition-property: none;}
#nav-menu div.passiv:hover {box-shadow: none; text-decoration: none; cursor: default; background: rgba(0,0,0,0.27) url(/ico/ui_no.svg) no-repeat 15px 15px; background-size: 42px 42px;}


#nav-menu span.colorTip {width: 250px; white-space: normal; text-align: center; bottom: -15px;}

#nav-menu div.shw0, #icon-box div.shw0, .hidden-features div.shw0 {display: none;}
#nav-menu div.sk, #nav-menu div.cs, #icon-box div.sk, #icon-box div.cs, .hidden-features div.sk, .hidden-features div.cs {display: inline-block !important;} 


@media screen and (max-width: 1023px) {
#nav-menu > div span, #nav-menu > div b {font-size: 18px; line-height: 26px;}
#nav-menu > div a, #nav-menu > div a.ghost  {font-size: 20px; line-height: 26px;}
#nav-menu > div h3, #nav-menu > div h3::first-line {font-size: 30px; line-height: 34px;}
#nav-menu > div a.ghost, .hidden-features > div a.ghost {border: 2px solid rgba(255,255,255,0.6); padding: 12px 20px; margin: 15px auto 20px auto; min-width: 0px;}
}

@media screen and (max-width: 767px) {
#nav-menu > div {width: 100%; margin: 0px 20px 30px 20px; display: block;}
}









/* NOT PREPAID - MORE FEATURES - HIDDEN */

.hidden-features {margin: 0px auto 60px auto; text-align: center;}
a.more-features {border-radius: 100px; padding: 12px 62px 12px 22px; margin: 0px 88px 0px auto; background: url(/ico/arrow-more1.png) no-repeat right center; background-size: 28%; color: #bb0000;  font-size: 18px; border: 1px solid #fff; -webkit-transition: all 0.22s linear; -moz-transition: all 0.22s linear; -o-transition: all 0.22s linear; -ms-transition: all 0.22s linear; transition: all 0.22s linear; display: inline-block;}
a.more-features:hover {background: url(/ico/arrow-more-red2.png) no-repeat right center; color: #ff0000; text-decoration: none; border-top: 1px solid #ff0000; border-left: 1px solid #ff0000; border-bottom: 1px solid #ff0000; background-size: 28%;}

.items-block .more-features {opacity: 0.4;}
.items-block .more-features span {visibility: hidden;}
.items-block:hover  .more-features span {visibility: visible;}
.items-block .more-features:hover  {opacity: 1.0;}

.hidden-features .fader-div {margin: 20px auto 80px auto; text-align: center;}
.hidden-features > div {background: rgba(0,0,0,0.22) !important;}

.hidden-features .fader-div h4 {margin: 40px auto 80px auto; text-align: center; display: block;}

.hidden-features > div:hover {box-shadow: none; text-decoration: none; cursor: default;}

.hidden-features .colorTip {max-width: 280px; white-space: normal; text-align: center;}

.hidden-features h6 a {font-size: 19px; color: red; text-align: center; font-weight: normal; line-height: 27px;}

















/* RECOMMENDED ITEM - CHOOSEN */

.choosen-item {z-index: 12;}




/* INFO ABOUT FEATURE */

.tabs-wrap-trial #nav-menu > div .info-item {position: absolute; left: -10px; right: -10px; bottom: 110%; display: none; text-align: center; padding: 12px 14px; border-radius: 5px; color: #fff; margin: auto; width: auto; background: inherit; z-index: 22; font-size: 15px; line-height: 20px; box-shadow: 0px 0px 12px #fff;}
.tabs-wrap-trial #nav-menu > div:hover .info-item {display: block;}












/* WELCOME DIVS */
#welcome h2 {color: #FFE391; font-size: 45px; text-align: center;}
#welcome h4 {font-weight: normal; color: rgba(255, 255, 255, 0.7); font-size: 25px; text-align: center;}

#welcome-home, #welcome-close {z-index: 915; position: absolute; top: 15px; font-size: 17px; vertical-align: middle; color: #fff;}
#welcome-home {left: 15px; position: fixed;}
#welcome-home img {max-height: 32px; vertical-align: middle;}
#welcome-close {right: 15px; position: fixed;}
#welcome-close img {max-height: 24px; vertical-align: middle; margin-right: 4px;}

#welcome-content {z-index: 910; position: absolute; top: 30px; text-align: center; width: 100%;}
#welcome-buttons {padding-top: 25px;}


.welcome-box {width: 17%; margin: 15px 12px; background: #FFD24C; display: inline-block; border-radius: 10px; position: relative !important; vertical-align: top; border: 3px solid white; color: #fff; line-height: 27px; overflow: hidden;}

.welcome-box:hover {color: #fff; -webkit-box-shadow: 0px 0px 24px 0px rgba(0,0,0,0.85);
-moz-box-shadow: 0px 0px 24px 0px rgba(0,0,0,0.85);
box-shadow: 0px 0px 24px 0px rgba(0,0,0,0.85); text-decoration: none;}

.welcome-box:hover .box-text {background: rgba(0, 0, 0, 0.5);}


.welcome-box h3 {color: white; font-size: 24px; text-align: center; margin-bottom: 10px;}

#open {display: table; margin: auto; max-width: 1300px}

.open-box {margin: 35px 45px; background: rgba(0, 0, 0, 0.2); display: block; border-radius: 10px; position: relative !important; vertical-align: top; border: 3px solid white; font-size: 19px; color: #fff; line-height: 26px; overflow: hidden; padding: 30px 40px; text-align: left;}

.open-box:hover {color: #fff; background: rgba(0, 0, 0, 0.4); -webkit-box-shadow: 0px 0px 27px 0px rgba(255,255,255,1);
-moz-box-shadow: 0px 0px 27px 0px rgba(255,255,255,1);
box-shadow: 0px 0px 27px 0px rgba(255,255,255,1); text-decoration: none; -webkit-filter: saturate(0.3);
 filter: saturate(0.3);}

.open-box b {color: white; font-size: 27px; margin-bottom: 8px; display: block; line-height: 32px;}

.open-box img {max-height: 80px; margin-left: 10px; float: right;}


.box1 {}
.box2 {-webkit-animation-delay: 0.3s; animation-delay: 0.3s}
.box3 {-webkit-animation-delay: 0.6s; animation-delay: 0.6s}
.box4 {-webkit-animation-delay: 0.9s; animation-delay: 0.9s}
.box5 {-webkit-animation-delay: 1.2s; animation-delay: 1.2s}
.box6 {-webkit-animation-delay: 1.2s; animation-delay: 1.5s}
.box7 {-webkit-animation-delay: 1.2s; animation-delay: 1.8s}
.box8 {-webkit-animation-delay: 1.2s; animation-delay: 2.1s}
.box9 {-webkit-animation-delay: 1.2s; animation-delay: 2.4s}


#welcome-buttons .box1  {background: rgba(0, 0, 0, 0.2) url('/images/login_event-box1.jpg') no-repeat;}
#welcome-buttons .box2  {background: rgba(0, 0, 0, 0.2) url('/images/login_event-box2.jpg') no-repeat;}
#welcome-buttons .box3  {background: rgba(0, 0, 0, 0.2) url('/images/login_event-box3.jpg') no-repeat;}
#welcome-buttons .box4  {background: rgba(0, 0, 0, 0.2) url('/images/login_event-box5.jpg') no-repeat;}
#welcome-buttons .box5 {background: rgba(0, 0, 0, 0.2) url('/images/login_event-box4.jpg') no-repeat;}


#welcome-buttons .box1, #welcome-buttons .box2, #welcome-buttons  .box3, #welcome-buttons .box4, #welcome-buttons .box5, #welcome-buttons .box6, #welcome-buttons .box7, #welcome-buttons .box8, #welcome-buttons .box9 {background-size: cover; background-position: middle;}


.box-img  {min-height: 250px;}

.box-text {background: rgba(0, 0, 0, 0.3); font-size: 16px; padding: 27px 10px 20px 10px;}



.more {margin: 45px auto; background: #fff; border-radius: 30px; position: relative !important; font-size: 23px; color: #3a6dc1; overflow: hidden; padding: 16px 32px; text-align: left; text-align: center; display: table;}
.more:hover {background: #3a6dc1; color: #fff; text-decoration: none;}


#welcome-mask {background: #3a6dc1 url('/images/login_event1.jpg') no-repeat; background-size: cover; position: fixed; left: 0; top: 0; z-index: 10; width: 100%; height: 100%; opacity: 1.0; z-index: 900;}




@media screen and (max-width: 1023px) {
.welcome-box {width: 42%; min-width: 300px; margin: 15px; display: inline-block;}
.welcome-box:last-child {width: auto; display: block; margin: 15px 5.5%;}
#welcome-buttons .box1, #welcome-buttons .box2, #welcome-buttons  .box3, #welcome-buttons .box4, #welcome-buttons .box5, #welcome-buttons .box6, #welcome-buttons .box7, #welcome-buttons .box8, #welcome-buttons .box9 {background-position: left; background-size: 150px 100%;}
.box-img  {display: none;}
.box-text {background: none; padding: 27px 10px 20px 160px;}
}



@media screen and (max-width: 767px) {
.welcome-box, .welcome-box:last-child {width: auto; margin: 15px; display: block;}
#welcome-buttons .box1, #welcome-buttons .box2, #welcome-buttons  .box3, #welcome-buttons .box4, #welcome-buttons .box5, #welcome-buttons .box6, #welcome-buttons .box7, #welcome-buttons .box8, #welcome-buttons .box9 {background-position: left; background-size: 150px 100%;}
.box-img  {display: none;}
.box-text {background: none; padding: 27px 10px 20px 160px;}

.open-box {text-align:center}
.open-box img {max-height: 80px; margin-bottom: 10px; float: none;}
}





/* RADIO BUTTONS - LABEL PART - SHOWROOM, EVENTS, FLYERS */
.label-part {display: block; margin: 10px auto 30px auto; text-align: center;}
.label-part div {display: inline-block; margin: 25px 0px 0px 0px;}
.label-part input[type="radio"] {display: none;}
.label-part a label {color: #bb0000; font-size: 17px; padding: 12px 28px; border: 1.5px solid transparent; border-radius: 30px; -webkit-transition: all 0.6s linear; -moz-transition: all 0.6s linear; -o-transition: all 0.6s linear; -ms-transition: all 0.6s linear; transition: all 0.6s linear;}
.label-part a:hover {text-decoration: none;}
.label-part a label:hover {color: #ff0000; border: 1.5px solid #ff0000; text-decoration: none;}
.label-part input[type="radio"]:checked + a label {color: #fff; text-decoration: none;}


@media screen and (max-width: 767px) {
.label-part div {white-space: nowrap; display: block;}
.label-part a label {margin: 5px 20px; display: block;}
}


#cms {display: table; width: 100%; overflow: hidden; padding: 0px 20px 0px 100px; min-height: 780px;}

#cms_submenu {width: 100%; display: table; margin: 0px; vertical-align: middle; overflow: hidden; font-weight: 300; letter-spacing: 0.5px; padding: 0px 15px 0px 100px; min-height: 62px; text-align: right;}


#sidebar {background-color: #efe7dc; height: auto; padding: 0; position: absolute; left: 0; top: 0px; width: 85px; z-index: 0; -webkit-transition: width 0.4s; transition: width 0.4s;}
#sidebar-nav {text-align: left; font-size: 30px; margin-top: 0px; padding: 3px 10px 10px 10px;}
#sidebar a {color: white; white-space: nowrap; overflow: hidden; vertical-align: middle; display: block;}
#sidebar .link-text {visibility: hidden; vertical-align: middle; display: inline-block; width: 210px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; border-bottom: 1px solid rgba(0,0,0,0.1); padding: 21px 0px 21px 15px; font-size: 15px; text-transform: uppercase; color: rgba(0,0,0,0.6);}
#sidebar:hover .link-text {visibility: visible;}
#sidebar a:hover .link-text {border-bottom: 1px solid rgba(0,0,0,0.2); font-weight: bold;}
#sidebar:hover {width: 300px;}
#sidebar a div {display: inline-flex; vertical-align: middle;}
#sidebar div.icon {width: 62px; height: 62px; margin: 10px 0px 5px 0px;}
#sidebar div.icon svg {max-width: 35px; max-height: 35px;}





/* ===== DEMO ===== */

/* DEMO WELCOME LIGHTBOX + ACTIVITIES */

.demo_welcome {width: 100%; height: 100vh; left: 0px; top: 0px; position: absolute;}

.demo_welcome_lightbox {text-align: center; border: 1px solid white; padding: 16px 20px; z-index: 99999; box-shadow: #000 0px 0px 42px; border-radius: 7px; background: rgba(255,255,255,0.97); position: fixed; width: 100%; max-width: 600px; height: auto; left: 50%; top: 50%; transform: translate(-50%, -50%);}

.demo_welcome_headline .txt1 {font-size: 64px; font-weight: 300; text-align: center; margin: 10px auto 0px auto; color: rgba(0,0,0,0.4);}
.demo_welcome_headline .txt2 {font-size: 24px; font-weight: 500; text-align: center; border-bottom: 1.5px solid rgba(0,0,0,0.12); padding: 0px 0px 18px 0px; color: rgba(0,0,0,0.8);}
.demo_welcome_lightbox .txt4 {font-size: 16px; font-weight: bold; text-align: center; margin: 22px auto 0px auto; color: red;}

.demo_welcome_activity a {font-size: 15px; font-weight: normal; text-align: left; margin: 1px auto 1px auto; display: block; border-bottom: 1px solid rgba(0,0,0,0.12); padding: 20px 40px 20px 15px; color: rgba(0,0,0,0.8); background-position: right center; background-repeat: no-repeat; background-size: 42px 42px;}
.demo_welcome_activity a:last-child {border-bottom: 1px solid transparent;}
.demo_welcome_activity a:hover {background-image: url(/ico/ArrowRight2.svg);}

.demo_welcome_activity a b {font-size: 18px; font-weight: bold; margin: 0px 0px 2px -2px; display: block;}

.demo_welcome_activity a div {font-size: 15px; display: block; color: rgba(0,0,0,0.7); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.demo_welcome_activity a:hover div {color: rgba(0,0,0,1);}
.demo_welcome_activity a:hover, .demo_welcome_activity a:hover div {text-decoration: none;}
.demo_welcome_activity a:hover b {text-decoration: underline;}


@media screen and (max-width: 767px), screen and (max-height: 700px) {
.demo_welcome_headline .txt2 {display: none;}
.demo_welcome_lightbox .txt4 {margin: 5px auto 0px auto;}
}


.demo-div {background: red; color: white; line-height: 24px; padding: 25px 10px 20px 10px; font-size: 20px;}
.demo-div b {display: block; color: white; font-size: 31px; margin-bottom: 10px;}
.demo-div small {display: block; color: white; font-size: 14px; margin-top: 15px; border-top: 1px solid rgba(255,255,255,0.5); padding-top: 15px; line-height: 18px;}
.demo-div a {display: block; color: white; font-size: 17px; margin: 0px;}