@charset "UTF-8";
* { -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-tap-highlight-color: transparent; }
@-moz-keyframes spin{0%{-moz-transform:rotate(0)}100%{-moz-transform:rotate(360deg)}}
@-webkit-keyframes spin{0%{-webkit-transform:rotate(0)}100%{-webkit-transform:rotate(360deg)}}
@-ms-keyframes spin{0%{-ms-transform:rotate(0)}100%{-ms-transform:rotate(360deg)}}
@-o-keyframes spin{0%{-o-transform:rotate(0)}100%{-o-transform:rotate(360deg)}}
@keyframes blink{0%{opacity:1;}50%{opacity:0.6;}100%{opacity:1;}}
html { -ms-touch-action: manipulation; touch-action: manipulation; }
input[type="submit"] { -webkit-appearance: none; -moz-appearance: none; }
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
textarea { -webkit-appearance: none; -moz-appearance: none; padding:0; margin:0; border:none; border-radius:0; font-family: -apple-system, BlinkMacSystemFont, "HelveticaNeue-Light", "Helvetica Neue Light", Arial, sans-serif; }
input[type="radio"] { -webkit-appearance: none; -moz-appearance: none; }
input[type="radio"],
input[type="checkbox"] { -webkit-appearance: none; -moz-appearance: none; position:relative; display:inline-block; width:17px; height:17px; margin:0 5px 0 4px; top:3px;border-radius: 2px; border: 1px #CCC solid; background:#E9E9E9; -box-shadow: inset 0 0 3px #D6D6D6; color:#555; transition: background 0.3s linear, box-shadow 0.2s linear; cursor:pointer; }
input[type="radio"]:hover,
input[type="checkbox"]:hover {/* border: 1px #777 solid;*/ box-shadow: inset 0 0 3px #20bf6b; }
input[type="radio"]:checked,
input[type="checkbox"]:checked { background:#20bf6b; box-shadow:none; }
input:focus { outline:none; }
select { -webkit-appearance: none; -moz-appearance: none; }
img { border:none; }
select { width:150px; height:40px; font-size:14px; border:1px #EEE solid; padding:0 10px 0 10px; color:#555; background-color: transparent; }
::-webkit-input-placeholder, :-moz-placeholder, ::-moz-placeholder, :-ms-input-placeholder { color: #888; }
body { font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Lato", Arial, sans-serif; font-size: 14px; padding:0; margin:0; text-size-adjust:none; -ms-text-size-adjust:none; -moz-text-size-adjust:none; -webkit-text-size-adjust:none; background:#FCFCFC; }
p, h1, h2, h3, h4, h5, h6, section { position:relative; display:inline; margin:0; padding:0; font-weight: normal; }
a { color:#555; }
a:link, a:visited { text-decoration: none; color:#555; }
a:hover, a:active { text-decoration: none; color:#333; }
.au:hover { cursor:pointer; text-decoration:underline; }
.center { position:relative; width:970px; margin:0 auto; }
.centered_text { text-align: center; }
.session_data_ct { display: none; }

/* Header */
header { position:relative; width:100%; height:55px; top:0; left:0; margin: 0 0 10px 0; background:#FFFFFF; z-index:4; color:#333333; box-shadow: 0 0 20px rgba(40,40,40,0.1); overflow:hidden; }
.main_body.displayed header { position:fixed;  }
header .logo { display: inline-block; width: 300px; height: 30px; margin-top: 10px; background-size: auto 100%; background-position: left center; background-repeat: no-repeat; }
nav { position:absolute; top: 0; right:0; width:auto; }
nav li { list-style:none; padding:0 10px 0 10px; line-height:58px; font-size:15px; color:#888; cursor:pointer; display:inline; text-shadow:0 1px 1px #FFF; }
nav li:hover { color:#444; }
nav li.selected { color:#444; }
nav li.current { color:#444; }
nav a { text-shadow:none; }

/* Animations */
@keyframes fade_in { 0%{ opacity:0; } 100%{ opacity:1; } }
@keyframes fade_out { 0%{ opacity:1; } 100%{ opacity:0; } }
@keyframes scale_in { 0%{ opacity:0; transform:scale(0.97); } 100%{ opacity:1; transform:scale(1); } }
@keyframes slide_from_right { 0%{ opacity:0; transform:translate3d(50px,0,0); } 100%{ opacity:1; transform:translate3d(0,0,0); } }
@keyframes slide_in_up { 0%{ opacity:0; transform:translate3d(0,100px,0); } 100%{ opacity:1; transform:translate3d(0,0,0); } }
@keyframes shake {
				
	0%{ transform:translate3d(0,0,0); }
	10%{ transform:translate3d(100px,0,0); }
	25%{ transform:translate3d(-100px,0,0); }
	40%{ transform:translate3d(50px,0,0); }
	55%{ transform:translate3d(-50px,0,0); }
	70%{ transform:translate3d(20px,0,0); }
	85%{ transform:translate3d(-20px,0,0); }
	100%{ transform:translate3d(0,0,0); }
				
}
@keyframes bounce_in { 0%{ opacity:0; transform:scale(0.3); } 70% { opacity:1; transform:scale(1.1); } 100%{ transform:scale(1); } }

@keyframes show_in { 0% { transform-origin: 50% 0; opacity:0; transform: scale(0.95); } 100% { transform-origin: 50% 0; opacity:1; transform: scale(1.0); } }
@-webkit-keyframes show_in { 0% { transform-origin: 50% 0; opacity:0; -webkit-transform: scale(0.95); } 100% { transform-origin: 50% 0; opacity:1; -webkit-transform: scale(1.0); } }
@keyframes show_back { 0% { transform-origin: 50% 0; opacity:0; transform: scale(1.05); } 100% { transform-origin: 50% 0; opacity:1; transform: scale(1.0); } }
@-webkit-keyframes show_back { 0% { transform-origin: 50% 0; opacity:0; -webkit-transform: scale(1.05); } 100% { transform-origin: 50% 0; opacity:1; -webkit-transform: scale(1.0); } }

.fade_in { animation: fade_in 300ms 1 ease; }
.fade_out { animation: fade_out 200ms 1 ease; }
.fade_in_long { animation: fade_in 500ms 1; }
.scale_in { animation: scale_in 200ms 1; }
.slide_from_right { animation: slide_from_right 200ms 1; }
.shake { animation: shake 800ms 1; }
.show_back { animation: show_back 0.3s cubic-bezier(0.4, 0, 0.2, 1); -webkit-animation: show_back 0.3s cubic-bezier(0.4, 0, 0.2, 1); }
.show_in { animation: show_in 0.3s cubic-bezier(0.4, 0, 0.2, 1); -webkit-animation: show_in 0.3s cubic-bezier(0.4, 0, 0.2, 1); }

/* Element statuses */
.hidden { display:none !important; }
.unselectable { -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; -o-user-select: none; -ms-user-select: none; }
.disabled { pointer-events: none; cursor: default; }
.clickable { transition: opacity 0.2s ease; }
.clickable:active { opacity: .6; transition: none; }

footer { display:block; margin:40px 0 40px 0; font-size:13px; font-family: "HelveticaNeue-UltraLight", "Helvetica Neue Ultra Light", "Lato", Arial, sans-serif; color:#999; text-shadow: 0 1px 1px #FFF; }

/* Cards */
.card { display: inline-block; vertical-align: top; padding:15px; background:#FFF; box-sizing:border-box; box-shadow: 0 5px 15px #EFEFEF; min-height: 95px; border-radius: 5px; }
.card.clickable { cursor: pointer; }
.card.main_title { font-size:18px; color:#666; margin-bottom:10px; }
.card.pure_html pre { color:#333; line-height:1.4; }
.clickable { transition: opacity 0.2s linear, box-shadow 0.2s linear, background 0.2s linear; }
.clickable:active { opacity: .6; transition: none; }
.card.clickable:not(.new):hover { background:#FFF; box-shadow: 0 5px 15px #E0E0E0; }
.auto_width { width:auto !important; }
h1.clickable:hover { color:#444; cursor:pointer; }
.card .disabled { opacity:.6; pointer-events:none; cursor:not-allowed; }

.card.client_card { width: 178px; height: 230px; margin-right: 20px; margin-bottom: 20px; }
.card.client_card:nth-child(5n) { margin-right: 0; }
.card.client_card > .image { width: 60px; height: 60px; border-radius: 50%; background-color: #CCC; margin: 10px auto 0 auto; background-size: cover; }
.card.client_card > .name { margin-top: 10px; font-size: 16px; color: #333; text-align: center; }
.card.client_card.placeholder > .name { width: 120px; height: 16px; background-color: #CCC; margin-left: auto; margin-right: auto; }
.card.client_card > .info_line { margin-top: 10px; text-align: center; }
.card.client_card > .info_line > .metric { display: inline-block; margin: 0 2px 0 2px; height: 14px; line-height: 14px; padding: 2px 5px 2px 5px; background-color: #F0F0F0; border-radius: 3px; font-size: 12px; color: #333; }
.card.client_card.placeholder > .info_line > .metric { min-width: 30px; }

.card.subscription_card { width: 310px; height: 200px; margin-right: 20px; margin-bottom: 20px; }
.card.subscription_card:nth-child(3n) { margin-right: 0; }
.card.subscription_card > .name { font-size: 22px; color: #333; }
.card.subscription_card.placeholder > .name { width: 120px; height: 22px; background-color: #CCC; }
.card.subscription_card > .url { margin-top: 2px; font-size: 14px; color: #666; }
.card.subscription_card.placeholder > .url { width: 90px; height: 14px; background-color: #CCC; }
.card.subscription_card > .progress_info { margin-top: 30px; font-size: 22px; color: #333; }
.card.subscription_card > .progress_info > .red { color: #c43232; }
.card.subscription_card.placeholder > .progress_info { width: 50px; height: 22px; background-color: #CCC; }
.card.subscription_card > .progress_line { margin-top: 2px; height: 4px; border-radius: 2px; background-color: #EEE; overflow: hidden; }
.card.subscription_card > .progress_line > .progress { width: 0; height: 100%; border-radius: 2px; background-color: #20bf6b; }
.card.subscription_card > .progress_line.soon > .progress { background-color: #ff6348; }
.card.subscription_card > .cost { margin-top: 35px; font-size: 22px; color: #20bf6b; }
.card.subscription_card.placeholder > .cost { width: 90px; height: 22px; background-color: #CCC; }

.card.creation { text-align: center; cursor: pointer; }
.card.creation > .ico { display: inline-block; width: 20px; height: 20px; margin-bottom: 5px; margin-top: calc(50% - 10px); border-radius: 50%; border: 1px #ff6348 solid; }
.card.subscription_card.creation > .ico { margin-top: 65px; }
.card.creation > .ico > svg { width: 14px; height: 14px; margin-top: 3px; fill: #ff6348; stroke: #ff6348; }
.card.creation > .text { font-size: 16px; color: #ff6348; }

/* Loaders */
@keyframes blink_load_block { 0%{ opacity:0; transform:scale(1.1); } 40%{ opacity:1; transform:scale(1); } 90%{ opacity:0; transform:scale(0.97); } 100% { opacity:0; } }
.loader { position:absolute; width:50px; height:50px; top:50%; left:50%; margin-top:-25px; margin-left:-25px; line-height:0; }
.loader > .block { display:inline-block; width:23px; height:23px; border:2px #ff6348 solid;/* border:2px #ff9a00 solid;*/ box-sizing:border-box; opacity:0; animation: blink_load_block 1000ms infinite; border-radius: 5px; }
.loader.small { width:30px; height:30px; margin-top:-15px; margin-left:-15px; }
.loader.small > .block { width:13px; height:13px; }
.loader.ultrasmall { width:20px; height:20px; margin-top:-10px; margin-left:-10px; }
.loader.ultrasmall > .block { width:8px; height:8px; }
.loader > .block:nth-child(1),
.loader > .block:nth-child(3) { margin-right:4px; }
.loader > .block:nth-child(3),
.loader > .block:nth-child(4) { margin-top:4px; }
.loader > .block:nth-child(1) { animation-delay:0ms; }
.loader > .block:nth-child(2) { animation-delay:250ms; }
.loader > .block:nth-child(4) { animation-delay:500ms; }
.loader > .block:nth-child(3) { animation-delay:750ms; }
.load_result { position:relative; display:inline-block; font-size:15px; color:#777; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Lato", Arial, sans-serif; }
.load_result .red { color:#A00; }
.load_result .green { color:#5D954D; }
.box > .loader_ct { position:absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; background-color:rgba(255, 255, 255, 0.85); transition: opacity 0.2s ease; z-index: 3; pointer-events: none; }
.box > .loader_ct.visible { opacity: 1; pointer-events: auto; }

/* Boxes */
.box_background { position:fixed; z-index:4; background-color:rgba(255,255,255,0.95); top:0; left:0; width:100%; height:100%; opacity:0; visibility:hidden; transition: visibility 0s linear 0.4s, opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1); pointer-events:none; }
.box { position:fixed; z-index:4; top:80px; bottom:-80px; width:700px; left:50%; margin-left:-350px; background-color:#FFF; border-radius:20px; box-shadow:0 0 40px #E5E5E5; opacity:0; visibility:hidden; transition: visibility 0s linear 0.4s, opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1), transform 0.4s ease; transform:translate3d(0,100vh,0); }
.box_background.visible,
.box.visible { opacity:1; visibility:visible; -webkit-transition-delay: 0s; -moz-transition-delay: 0s; transition-delay: 0s; pointer-events:auto; }
.box.visible { transform:translate3d(0,0,0); }
.box > .header { position:absolute; top:0; left:0; width:100%; height:80px; line-height:80px; padding-left:25px; padding-right:25px; background-color:rgba(255,255,255,0.95); z-index:3; border-top-left-radius:20px; border-top-right-radius:20px; box-sizing: border-box; }
.box > .header > .title { display:inline-block; font-size:27px; color:#111; max-width: calc(100% - 120px); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.box > .header > .close_bt { float:right; padding-left:15px; padding-right:15px; font-size:22px; color:#3A97D4; transition: opacity 0.2s ease, color 0.2s ease; cursor:pointer; }
.box > .header > .title,
.box > .header > .close_bt { height: 60px; }
.desktop .box > .header > .close_bt:hover { color:#40A8ED; }
.box > .header > .close_bt.grey { color:#555; }
.desktop .box > .header > .close_bt.grey:hover { color:#333; }
.box > .data { position:absolute; top:0; left:0; bottom:80px; width:100%; box-sizing:border-box; padding:80px 25px 40px 25px; overflow-y: scroll; overflow-x: hidden; -webkit-overflow-scrolling: touch; }
.box > .data .input_ct > .title > .mandatory_check,
.box > .data .section_title > .mandatory_check,
.box > .data .mandatory_fields_desc,
.flat_button > .mandatory_check { color:#E74C3C; }
.box > .data .input_ct { margin-top:25px; }
.box > .data form > .input_ct:first-child { margin-top:10px; }
.box > .data .input_ct > .title { font-size:13px; color:#555; }
.box > .data .input_ct > .title > .mandatory_check,
.box > .data .section_title > .mandatory_check { margin-left: 3px; }
.box > .data .input_ct > .title.subsection { margin-top: 40px; }
.box > .data .input_ct.expiration > select { margin-top: 5px; }
.box > .data .input_ct.expiration > .separator { margin: 0 5px 0 5px; }
.box > .data .input_ct > input[type="text"],
.box > .data .input_ct > input[type="password"],
.box > .data .input_ct > input[type="email"],
.box > .data .input_ct > input[type="number"] { height:25px; padding-top:10px; padding-bottom:5px; border-bottom:1px #E5E5E5 solid; width:100%; font-size:18px; color:#333; }
.box > .data .input_ct > input[type="email"]:disabled { color: #666; }
.box > .data .input_ct > input:focus { border-color:#3A97D4; }
.box > .data input[type="submit"].hidden_visibility { visibility: hidden; }
.box > .data .input_ct > textarea { height:60px; line-height:18px; padding-top:10px; padding-bottom:5px; border-bottom:1px #E5E5E5 solid; width:100%; font-size:16px; color:#333; }
.box > .data .input_ct > textarea:focus { border-color:#3A97D4; }
.box > .data .input_ct > .radio_input,
.box > .data .input_ct > .checkbox_input { display:inline-block; width:200px; margin-top:10px; margin-right:10px; min-height:30px; line-height:30px; }
.box > .data .input_ct > .radio_input > input,
.box > .data .input_ct > .checkbox_input > input { -webkit-appearance: none; display:inline-block; width:18px; height:18px; margin-top:6px; border-radius:2px; border:1px #E5E5E5 solid; background:#EEE; transition: background 0.2s ease; cursor:pointer; vertical-align: top; }
.box > .data .input_ct > .radio_input > input:checked,
.box > .data .input_ct > .checkbox_input > input:checked { background-color:#5cd973; }
.box > .data .input_ct > .radio_input > .title,
.box > .data .input_ct > .checkbox_input > .title { display:inline-block; margin-left:10px; margin-top: 3px; line-height: 24px; color:#333; font-size:16px; vertical-align:top; max-width: calc(100% - 40px); }
.box > .data .input_ct.renewals { }
.box > .data .input_ct.renewals > .list { }
.box > .data .input_ct.renewals > .list > .renewal { height: 30px; line-height: 30px; font-size: 16px; color: #333; }
.box > .data .input_ct.renewals > .list > .renewal > input[type="checkbox"] { top: 2px; margin-left: 0; margin-right: 7px; }
.box > .data > .empty_notice,
.box > .data > .data > .empty_notice { font-size:20px; color:#666; cursor:default; }

.box > .data > .step { display: none; }
.box > .data > .step.visible { display: block; }
.box > .data > .step > .action_ico { width: 40px; height: 40px; background-size: contain; background-position: center; background-repeat: no-repeat; margin-bottom: 10px; }
.box > .data > .step > .action_ico.done { margin-left: auto; margin-right: auto; margin-top: calc(50% - 60px); }
.box > .data > .step > .action_title { font-size: 22px; color: #333; font-family:"HelveticaNeue-Light", "Helvetica Neue Light", Arial, sans-serif; margin-bottom: 2px; }
.box > .data > .step > .action_description { font-size: 16px; color: #555; font-family:"HelveticaNeue-Light", "Helvetica Neue Light", Arial, sans-serif; line-height: 1.2; margin-bottom: 30px; }
.box > .data > .step > .renewal_options { font-size: 0; margin-top: 20px; }
.box > .data > .step > .renewal_options > .option { display: inline-block; width: calc(50% - 10px); margin: 0 5px 0 5px; padding: 20px 0 20px 0; cursor: pointer; }
.box > .data > .step > .renewal_options > .option:hover { background-color: #F4F4F4; border-radius: 5px; }
.box > .data > .step > .renewal_options > .option > .ico { width: 60px; height: 60px; margin: 0 auto 10px auto; background-size: contain; background-position: center; background-repeat: no-repeat; }
.box > .data > .step > .renewal_options > .option > .text { font-size: 18px; color: #333; font-family:"HelveticaNeue-Light", "Helvetica Neue Light", Arial, sans-serif; text-align: center; }
.box > .data > .step > .back_transfer_details { border: 1px #CCC dashed; padding: 20px; }
.box > .data > .step > .back_transfer_details > .title { font-size: 13px; color: #333; font-family:"HelveticaNeue-Light", "Helvetica Neue Light", Arial, sans-serif; text-transform: uppercase; margin-top: 20px; margin-bottom: 5px; }
.box > .data > .step > .back_transfer_details > .title:first-child { margin-top: 0; }
.box > .data > .step > .back_transfer_details > .detail { font-size: 18px; color: #555; font-family:"HelveticaNeue-Light", "Helvetica Neue Light", Arial, sans-serif; margin-bottom: 3px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }

/* Inputs */
textarea { width:700px; height:200px; line-height:1.4; }
.inline_input.with_bottom_margin { margin-bottom:5px; }
.column_one .inline_input { width:411px; margin-right:5px; }
.column_two .inline_input { width:205px; margin-right:5px; }

/* Buttons */
.button { position:relative; color:#36739f; color:#F5F5F5; line-height:37px; font-size:18px; font-weight:100; text-align:center; border-radius:2px; -moz-border-radius:2px; cursor: pointer; display: none; }
.button.visible { display:inline-block; }
.button:hover { color:#347aac; }
.button:active { color:#2e6e97; }
.button.disabled { opacity:.6; pointer-events: none; }
.button.disabled:hover,
.button.disabled:active { color:#36739f; }
.button.red { color:#c43232; }
.button.red:hover { color:#db4c4c; }
.button.red:active { color:#a32b2b; }
form > .button { margin-top: 20px; }

/* Confirmation dialogue */
.confirmation_box { position:fixed; z-index:20; top:0; left:0; width:100%; height:100%; background-color:rgba(255,255,255,.95); opacity:0; cursor:default; visibility: hidden; transition: visibility 0s linear 0.4s, opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1); transform: translateZ(0); -webkit-backdrop-filter: blur(3px); }
.confirmation_box.visible { opacity: 1; visibility: visible; transition-delay: 0s; }
.no_animations.confirmation_box.visible { display:block; }
.confirmation_box > .title { position:absolute; width:600px; left:50%; bottom:50%; margin-bottom:40px; margin-left:-300px; font-size:34px; font-family:"HelveticaNeue-Light","HelveticaNeue-Light", "Helvetica Neue Light", 'Roboto', Arial, sans-serif; color:#444; text-align:center; line-height: 1.5; }
.confirmation_box > .ac_button.decline,
.confirmation_box > .ac_button.accept { position:absolute; width:155px; height:45px; line-height:45px; text-align:center; left:50%; margin-left:-167px; top: 50%; border-radius:3px; -moz-border-radius:3px; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", 'Roboto', Arial, sans-serif; font-size:22px; border:1px #999 solid; color:#666; -webkit-transition:opacity 0.2s ease, border 0.2s ease, color 0.2s ease; -moz-transition:opacity 0.2s ease, border 0.2s ease, color 0.2s ease; transition:opacity 0.2s ease, border 0.2s ease, color 0.2s ease; box-sizing:border-box; -moz-box-sizing:border-box; cursor:pointer; }
.confirmation_box > .ac_button.accept { border-color:#459d87; color:#459d87; margin-left:12px; }
.desktop .confirmation_box > .ac_button.decline:hover { border-color:#666; color:#333; }
.desktop .confirmation_box > .ac_button.accept:hover { border-color:#4db69c; color:#4db69c; }
.confirmation_box > .ac_button.accept:active,
.confirmation_box > .ac_button.accept.clicked,
.confirmation_box > .ac_button.decline:active,
.confirmation_box > .ac_button.decline.clicked { opacity:.6; transition:none; }

/* Index */
body h1 { display:block; margin:20px 0 20px 0; font-size:24px; font-family: "HelveticaNeue-UltraLight", "Helvetica Neue Ultra Light", "Lato", Arial, sans-serif; color:#777; }
body h1 a { color:#777 !important; }
body h1 a:hover { text-decoration:underline; }
body h1 > .clickable { cursor: pointer; }
body h1 > .clickable:hover { border-bottom: 1px #CCC solid; }
body h1 > .total_view_box { float: right; color: #999; }
.generic_data { position:relative; width:calc((100% / 3) - 7px); margin-bottom:10px; margin-right: 10px; }
.card.new,
.card.placeholder { opacity: .6; cursor: progress; }
.generic_data:nth-child(3n) { margin-right: 0; }
.generic_data .name { font-size:22px; display:block; margin-right:20px; color:#444; margin-bottom:10px; }
.generic_data.creation .name { color: #2980b9; }
.card.generic_data.placeholder .name { width: 130px; height: 22px; background-color: #CCC; animation: blink 2s ease infinite; }
.generic_data .description { font-size:16px; display:block; color:#666; }
.card.generic_data.placeholder .description { width: 90px; height: 16px; background-color: #CCC; }

/* Notification banner */
.notification_banner { position:fixed; top:0; left:0; width:100%; min-height: 60px; height: auto; background:rgba(240,240,240,.95); -webkit-backdrop-filter:blur(5px); transform:translate3d(0,-60px,0); transition: visibility 0s linear 0.2s, transform 0.2s cubic-bezier(0.165, 0.84, 0.44, 1); cursor:default; z-index:6; visibility:hidden; }
.notification_banner.no_transitions { -webkit-transition: none !important; -moz-transition: none !important; -ms-transition: none !important; transition: none !important; }
.notification_banner.clickable { cursor:pointer; }
.notification_banner.visible,
.mobile.app.ios .notification_banner.visible { transform:translate3d(0,0,0); visibility:visible; -webkit-transition-delay: 0s; -moz-transition-delay: 0s; transition-delay: 0s; }

.notification_banner .text { position:relative; left:50%; margin:17px 10px 16px -250px; width:500px; line-height: 1.4; font-family: Arial, sans-serif; font-size:16px; color:#444; text-align:center; overflow:hidden; }
.notification_banner.highlight.red_hl .text { color:#a44644; }
.notification_banner.highlight.green_hl .text { color:#459d87; }

.notification_banner .bottom_close { position:absolute; bottom:0; left:0; right:0; height:15px; line-height:15px; text-align:center; transition: opacity 0.2s ease; -webkit-transition: opacity 0.2s ease; -moz-transition: opacity 0.2s ease; -ms-transition: opacity 0.2s ease; cursor:pointer; }
.notification_banner .bottom_close svg { width:30px; height:7px; fill:#888; stroke:#888; }
.desktop .notification_banner .bottom_close:hover { background:rgba(230,230,230,.95); }
.notification_banner .bottom_close:active { opacity:.6; -webkit-transition: none; -moz-transition: none; -o-transition: none; transition: none; }

/* Main body */
.main_body { transition: transform 0.5s ease, opacity 0.5s ease; }
.main_body.displayed { margin-top: 75px; }
.main_body.pending_show { opacity: 0; transform: scale(.9); }

/* Login panel */
.login_panel { position:fixed; top:0; bottom:0; left:0; right:0; background:#FFFFFF; font-size: 0; z-index:5; transition: transform 0.3s ease, opacity 0.3s ease; }
.login_panel.zoom_out { opacity: 0; transform: scale(1.1); }
.login_panel > .column .logo { position: absolute; top: 15px; left: 0; width: 150px; height: 35px; background-size: auto 100%; background-repeat: no-repeat; }
/*.login_panel > .header_ct { position:relative; }
.login_panel > .header_ct > .conference_info_box { position:absolute; top:10px; left:0; }
.login_panel > .header_ct > .conference_info_box > .conf_logo { width:48px; height:48px; margin-top:15px; }
.login_panel > .header_ct > .conference_info_box > .conf_info > .conf_name { font-size:20px; }
.login_panel > .header_ct > .conference_info_box > .conf_info > .conf_date { font-size:14px; }*/

.login_panel > .column { display: inline-block; height: 100%; vertical-align: top; }
.login_panel > .column.left { width: 52%; }
.login_panel > .column.right { width: 48%; }

.login_panel > .column > .center { margin: 0 0 0 calc(45vw - 440px); height: 100%; }

.login_panel > .column > .featured_image { width: 100%; height: 100%; background-size: cover; background-position: left center; background-color: #CCC; }

.login_panel > .column .copyright { position: absolute; bottom: 10px; height: 15px; line-height: 15px; font-size: 12px; color: #888; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Lato", Arial, sans-serif; }

.login_panel .steps_ct { height: 100%; display: flex; justify-content: center; flex-direction: column; }
.login_panel .steps_ct > .step { width:520px;/* margin-top:calc(50% - 120px);*/ /* > fallback for Android 4.4 */ /*margin-top: calc(50vh - 90px);*/ }
.login_panel .steps_ct > .step > .title { font-size:26px; color:#111; margin-bottom:10px; max-width: calc(100% - 100px); }
.login_panel .steps_ct > .step > .title.extended_description { font-size: 14px; color: #222; margin-bottom: 95px; line-height: 1.4; }
.login_panel .steps_ct > .step > .title.extended_description > .heading { font-size:36px; color:#111; margin: 0; padding: 0; }
.login_panel .steps_ct > .step > .input_ct { position:relative; width:calc(100% - 100px); }
.login_panel .steps_ct > .step > .input_ct > input { padding: 12px 100px 13px 15px; box-sizing: border-box; border:2px #E5E5E5 solid; width:100%; font-size:26px; line-height: 30px; color:#555; border-radius: 5px; transition: border 0.2s ease; color: #333; }
.login_panel .steps_ct > .step > .input_ct > input:focus { border-color:#E0E0E0; }
.login_panel .steps_ct > .step > .input_ct > .continue_bt { position:absolute; top:0; right:0; margin-top:0; padding-left:15px; padding-right:15px; }

.login_panel .steps_ct > .step > .sign_up_button { display: inline-block; height: 40px; line-height: 40px; border-radius: 2px; transition: opacity 0.2s ease; margin-top: 15px; cursor: pointer; }
.login_panel .steps_ct > .step > .sign_up_button:active { opacity: .6; transition: none; }
.login_panel .steps_ct > .step > .sign_up_button.disabled { opacity: 0.6; pointer-events: none; cursor: not-allowed; }
.login_panel .steps_ct > .step > .sign_up_button > .logo { display: inline-block; width: 40px; height: 40px; background-size: 25px auto; background-repeat: no-repeat; background-position: center; }
.login_panel .steps_ct > .step > .sign_up_button > .text { display: inline-block; font-size: 16px; color: #FFF; padding: 0 15px 0 10px; line-height: 40px; vertical-align: top; }

.login_panel .steps_ct > .step > .input_info { font-size: 18px; color: #666; margin-top: 20px; }
.login_panel .steps_ct > .step > .input_info.clickable { cursor: pointer; }
.login_panel .steps_ct > .step > .input_info.clickable:hover { color: #444; }
.login_panel .steps_ct > .step > .input_info > input[type="checkbox"] { top: 2px; }

.login_panel .steps_ct > .step .continue_bt { margin-top:10px; height:58px; line-height:58px; font-size: 24px; color:#3A97D4; transition: opacity 0.2s ease, color 0.2s ease; cursor:pointer; }
.login_panel .steps_ct > .step .continue_bt.disabled { color:#888; pointer-events:none; }
.login_panel .steps_ct > .step .continue_bt.ico_only.disabled { opacity: 0; }
.login_panel .steps_ct > .step .continue_bt > svg { width: 22px; height: 22px; margin-top: 19px; fill: #666; stroke: #666; vertical-align: top; }
.desktop .login_panel .steps_ct > .step .continue_bt:hover { color:#40A8ED; }
.login_panel .steps_ct > .step > .terms_bt { margin-top:10px; margin-bottom: 20px; }
.login_panel .steps_ct > .step > .terms_bt > a { font-size:18px; color:#444; text-decoration:none; transition: color 0.2s ease; }
.desktop .login_panel .steps_ct > .step > .terms_bt > a:hover { text-decoration:none; color:#111; }
.login_panel .steps_ct > .step .loader_ct { position:absolute; top: 2px; right:-70px; width:50px; height:50px; opacity:0; transition: opacity 0.2s ease; }
.login_panel .steps_ct > .step .loader_ct.visible { opacity:1; transition-delay:1s; }
.login_panel .steps_ct > .step > .loader_ct.inline { position: relative; display: inline-block; top: 5px; right: auto; margin-left: 15px; }
.desktop .login_panel .steps_ct > .step > .terms_continue_bt_ct { position:relative; display:inline-block; }
.login_panel .steps_ct > .step > .terms_continue_bt_ct .loader_ct { top:10px; }

@media all and (max-width: 700px) {

    select { width: 100px; }
	
    .center { width:calc(100% - 30px); }
    .login_panel > .column > .center { margin: auto; }
    .login_panel > .column.left { display: block; width: auto; }
    .login_panel > .column.right { display: none; }
    .login_panel .steps_ct > .step > .input_ct,
    .login_panel .steps_ct > .step { width: auto; }
    .card.client_card { width: calc(50% - 7px); }
    .card.client_card,
    .card.client_card:nth-child(5n) { margin-right: 13px; margin-bottom: 13px; }
    .card.client_card:nth-child(2n) { margin-right: 0; }

    .card.subscription_card { display:block; width: auto; margin-bottom: 13px; margin-right: 0; }

    .box { width:auto; top:30px; left:15px; right:15px; margin-left:auto; }
	.box > .header > .close_bt { font-size:18px; padding-right:5px; }
    .box > .header > .title { font-size:20px; }
    
    .confirmation_box > .title { width:100%; left:0; margin-left:0; font-size:28px; box-sizing:border-box; -moz-box-sizing:border-box; padding-left:25px; padding-right:25px; margin-bottom:20px; }
    .confirmation_box > .ac_button.decline,
    .confirmation_box > .ac_button.accept { width:120px; height:42px; line-height:42px; }
    .confirmation_box > .ac_button.decline { margin-left:-130px; }
    .confirmation_box > .ac_button.accept { margin-left:10px; }

    .notification_banner .text { left: 0; width: auto; margin-left: 15px; margin-right: 15px; }

    .box > .data > .step > .renewal_options > .option { display: block; width: auto; margin-bottom: 15px; }
	
}