.box
{
z-index: 1;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-direction: normal;
-webkit-box-orient: vertical;
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
background-color: #fff;
min-width: 20rem;
}
.modal .box
{
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
border: none;
border-top: 4px solid #0b86d2;
margin-bottom: 0;
width: 90vw;
max-height: 100vh;
}
.modal .box .icon-close
{
color: #9b9ea3;
}
.modal .box .icon-close:hover
{
color: #0b86d2;
}
@media only screen and (min-width:42.5em)
{
.modal .box
{
width: 40rem;
}
}
@media only screen and (min-width:42.5em)
{
.box
{
border: 1px solid #bbb;
border-top: 4px solid #bbb;
}
}
.box.fixed
{
margin-bottom: 0;
overflow: hidden;
min-height: 11.85714rem;
height: calc(100vh - 4.28571rem);
}
@media only screen and (min-width:65em)
{
.box.fixed
{
height: calc(100vh - 4.28571rem - (1rem * 2));
}
}
.modal .box.fixed
{
width: 100vw;
height: 100vh;
}
@media only screen and (min-width:42.5em)
{
.modal .box.fixed
{
width: 90vw;
height: 90vh;
}
.modal .box.fixed.medium
{
width: 40rem;
}
}
@media only screen and (min-width:65em)
{
.modal .box.fixed
{
width: 80vw;
height: 80vh;
}
}
.box[am-type="message"]
{
width: 30rem;
}
.box[am-type="message"].type_primary
{
border-color: #0b86d2;
}
.box[am-type="message"].type_primary .box-head-title
{
color: #0b86d2;
}
.box[am-type="message"].type_success
{
border-color: #0c6;
}
.box[am-type="message"].type_success .box-head-title
{
color: #0c6;
}
.box[am-type="message"].type_warning
{
border-color: #dda500;
}
.box[am-type="message"].type_warning .box-head-title
{
color: #dda500;
}
.box[am-type="message"].type_error
{
border-color: #c33;
}
.box[am-type="message"].type_error .box-head-title
{
color: #c33;
}
.box-head
{
border-bottom: 1px solid #bbb;
}
.modal .box-head
{
position: relative;
}
@media only screen and (min-width:42.5em)
{
.modal .box-head
{
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
-moz-justify-content: center;
justify-content: center;
}
}
.box-head-left, .box-head-right
{
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
-moz-align-items: center;
align-items: center;
white-space: nowrap;
padding: 1rem 0;
}
.box-head-left
{
-webkit-box-flex: auto;
-webkit-flex: auto;
-ms-flex: auto;
flex: auto;
padding-left: 1rem;
}
@media only screen and (min-width:42.5em)
{
.box-head-left
{
padding-left: 2rem;
}
}
.box-head-right
{
-webkit-box-flex: none;
-webkit-flex: none;
-ms-flex: none;
flex: none;
-webkit-box-pack: end;
-ms-flex-pack: end;
-webkit-justify-content: flex-end;
-moz-justify-content: flex-end;
justify-content: flex-end;
padding-right: 1rem;
text-align: right;
}
@media only screen and (min-width:42.5em)
{
.box-head-right
{
padding-right: 2rem;
}
}
@media only screen and (max-width: 42.4375em)
{
.box-head-right .button:not(.icon-close)
{
display: none !important;
}
}
.box-head-info
{
padding-left: 1rem;
}
.box-head-back
{
padding: 0 0.5rem 0 0.5rem;
margin-left: -0.75rem;
min-width: 2.5rem;
box-sizing: content-box;
}
@media only screen and (min-width:42.5em)
{
.box-head-back
{
padding: 0 0.75rem 0 0.5rem;
margin-left: -1rem;
}
}
.box-head-back + .box-head-info
{
padding-left: 0;
}
.box-head-back-anchor
{
color: #0b86d2;
cursor: pointer;
display: block;
padding: 0 0 0 1rem;
}
.box-head-title
{
font-weight: 600;
color: #0b86d2;
text-transform: uppercase;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
line-height: 3rem;
}
.box-body
{
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
overflow: hidden;
z-index: 2;
}
@media only screen and (max-width: 42.4375em)
{
.box-body
{
-webkit-box-direction: normal;
-webkit-box-orient: vertical;
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
}
}
.box.fixed .box-body
{
-webkit-box-flex: 1;
-webkit-flex: 1 1 0%;
-ms-flex: 1 1 0%;
flex: 1 1 0%;
}
.box-foot
{
border-top: 1px solid #bbb;
padding: 1rem 2rem;
}
.box-head, .box-foot
{
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-flex: none;
-webkit-flex: none;
-ms-flex: none;
flex: none;
height: 5rem;
background-color: #fff;
z-index: 3;
white-space: nowrap;
}
.box-action
{
-webkit-box-ordinal-group: 3;
-webkit-order: 2;
-moz-order: 2;
-ms-flex-order: 2;
order: 2;
z-index: 5;
box-shadow: 0 4rem 8rem 4rem rgba(0, 0, 0, 0.25);
}
@media only screen and (min-width:42.5em)
{
.box-action
{
display: none;
}
}
.box-menu
{
-webkit-box-flex: none;
-webkit-flex: none;
-ms-flex: none;
flex: none;
width: 16rem;
background-color: #f8f8f8;
overflow-y: auto;
overflow-x: hidden;
-webkit-overflow-scrolling: touch;
box-shadow: inset -1px 0 0 0 #bbb;
padding-bottom: 0;
}
@media only screen and (max-width: 42.4375em)
{
.box-menu
{
border-top: 1px solid #bbb;
width: 100%;
z-index: 5;
-webkit-box-ordinal-group: 4;
-webkit-order: 3;
-moz-order: 3;
-ms-flex-order: 3;
order: 3;
box-shadow: 0 4rem 8rem 4rem rgba(0, 0, 0, 0.25);
}
}
@media only screen and (min-width:42.5em) and (max-width:64.9375em)
{
.box-menu
{
width: 12rem;
}
}
@media only screen and (max-width: 42.4375em)
{
.box-action:not([is-hidden]) + .box-menu
{
box-shadow: none;
border-top: none;
}
}
.box-content
{
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-direction: normal;
-webkit-box-orient: vertical;
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-flex: 1;
-webkit-flex: 1 1 0%;
-ms-flex: 1 1 0%;
flex: 1 1 0%;
overflow-y: auto;
overflow-x: hidden;
-webkit-overflow-scrolling: touch;
padding: 1rem;
padding-bottom: 0;
min-height: 10rem;
}
@media only screen and (min-width:42.5em)
{
.box-content::-webkit-scrollbar
{
-webkit-appearance: none;
width: 11px;
}
.box-content::-webkit-scrollbar-thumb
{
background-color: rgba(39, 42, 45, 0.5);
box-shadow: 0 0 1px rgba(255, 255, 255, 0.5);
background-clip: padding-box;
border: 2px solid rgba(0, 0, 0, 0);
border-radius: 7px / 8px;
}
}
@media only screen and (max-width: 42.4375em)
{
.box-content
{
-webkit-box-ordinal-group: 2;
-webkit-order: 1;
-moz-order: 1;
-ms-flex-order: 1;
order: 1;
}
}
@media only screen and (min-width:42.5em)
{
.box-content
{
padding: 1.5rem 2rem 0 2rem;
}
}
.box-content-title
{
font-weight: 300;
font-size: 2.14286rem;
text-transform: uppercase;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.box-content-desc
{
padding: 0 0 1rem 0;
}
.box:not(.fixed) .box-content
{
padding-bottom: 1.5rem;
}
body:not(.no-animation) .box-content > div
{
-webkit-animation: reveal 0.4s ease-in-out backwards;
animation: reveal 0.4s ease-in-out backwards;
}
		
.header
{
height: 4.28571rem;
}
.frm_main
{
height: 100vh;
}
.content-main
{
background-color: #f5f6f7;
padding-top: 4.28571rem;
width: 100%;
height: auto;
padding: 0;
}
@media only screen and (min-width:65em)
{
.content-main
{
padding: 1rem;
}
}
.obj_userlist, .obj_domainlist, .obj_accountpicker, .obj_permissions, .obj_accountmobiledevices, .obj_mailinglistmembers, .obj_groupmembers, .obj_loadable
{
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-direction: normal;
-webkit-box-orient: vertical;
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-flex: 1;
-webkit-flex: 1 1 0%;
-ms-flex: 1 1 0%;
flex: 1 1 0%;
}
.main-menu
{
z-index: 100;
position: fixed;
top: 4.28571rem;
padding-bottom: 4.28571rem;
height: 100%;
overflow-y: auto;
background-color: #272a2d;
border-top: 1px solid #272a2d;
left: -100%;
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
width: 100%;
transition: transform 0.4s ease-in-out, left 0s 0.4s;
}
@media only screen and (min-width:42.5em)
{
.main-menu
{
left: -16rem;
-webkit-transform: translateX(-16rem);
transform: translateX(-16rem);
width: 16rem;
}
}
.main-menu::after
{
content: '\e60c';
font-family: icons;
position: absolute;
display: block;
width: 100%;
text-align: center;
left: 0;
bottom: 0;
transform: translateY(-100%);
height: 4rem;
line-height: 0;
font-size: 11.42857rem;
color: #1b1d1f;
}
.main-menu.menu-is-open
{
left: 0;
-webkit-transform: translateX(0);
transform: translateX(0);
transition: transform 0.4s ease-in-out;
}
		
.account
{
position: relative;
margin-top: 4rem;
}
.account-icon
{
margin-right: 0;
font-size: 5em;
line-height: 1;
width: 100%;
}
.account-state
{
position: absolute;
left: 50%;
bottom: 0;
margin-right: 0;
transform: translate(-50%, 50%);
width: auto;
}
.account-state:before
{
border-color: currentColor;
border-radius: 50%;
border: 3px solid;
background: #fff;
box-shadow: 0 0 0 5px #fff;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
-moz-align-items: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
-moz-justify-content: center;
justify-content: center;
box-sizing: content-box;
padding: 2px 1px 0 1px;
content: "\e626";
color: #bbb;
}
@media only screen and (max-width: 42.4375em)
{
.account-state:before
{
border-width: 2px;
}
}
@media only screen
{
.account-state:before
{
width: 19px;
height: 19px;
font-size: 19px;
}
}
@media only screen and (min-width:42.5em)
{
.account-state:before
{
width: 22px;
height: 22px;
font-size: 22px;
}
}
@media only screen and (min-width:65em)
{
.account-state:before
{
width: 24px;
height: 24px;
font-size: 24px;
}
}
.account-state.state_0:before
{
content: "\e624";
color: #0c6;
}
.account-state.state_1:before, .account-state.state_2:before
{
content: "\e625";
color: #c33;
}
.account-state.state_3:before
{
content: "\e626";
color: #bbb;
}
		

		

		

		

		

		

		

		

		

		

		

		
.selector
{
display: inline-block;
position: relative;
height: 2.75rem;
}
.selector.full
{
width: 100%;
}
		
.bar
{
position: relative;
color: #0b86d2;
border: 1px solid currentColor;
border-radius: 3px;
height: 2.75rem;
font-weight: 600;
text-align: center;
overflow: hidden;
text-overflow: ellipsis;
padding: 0 1rem;
}
.bar-fill
{
position: absolute;
left: 0;
top: 0;
height: 100%;
max-width: 100%;
min-width: 0%;
background-color: rgba(11, 134, 210, 0.1);
transition: width 0.4s ease;
}
.bar-text
{
font-size: 0.85714rem;
color: #0b86d2;
line-height: 2.75rem;
white-space: nowrap;
}
		
.bubble
{
font-weight: 400;
pointer-events: none;
padding: 0.5rem 1rem;
visibility: visible;
opacity: 1;
transition: visibility 0.1s, opacity 0.1s;
display: none;
}
.bubble
{
position: absolute;
text-align: left;
border: 1px solid #bbb;
border-width: 1px;
border-radius: 3px;
background: #fff;
z-index: 100;
}
.bubble::after, .bubble::before
{
content: '';
height: 0;
width: 0;
border: solid transparent;
border-color: currentColor;
border-left-color: transparent;
border-right-color: transparent;
position: absolute;
pointer-events: none;
}
.bubble::after
{
color: #fff;
border-width: 0.5rem;
}
.bubble::before
{
color: #bbb;
border-width: calc(0.5rem + 1px);
}
.bubble.bottom, .bubble
{
top: 100%;
margin-top: 2px;
bottom: auto;
margin-bottom: auto;
}
.bubble.bottom::after, .bubble::after, .bubble.bottom::before, .bubble::before
{
bottom: 100%;
border-top-color: transparent;
top: auto;
border-bottom-color: currentColor;
}
.bubble.top, .box-action .bubble
{
bottom: 100%;
margin-bottom: 2px;
top: auto;
margin-top: auto;
}
.bubble.top::after, .box-action .bubble::after, .bubble.top::before, .box-action .bubble::before
{
top: 100%;
border-bottom-color: transparent;
bottom: auto;
border-top-color: currentColor;
}
.bubble.left, .bubble
{
left: -1rem;
right: auto;
}
.bubble.left::after, .bubble::after
{
margin-right: -2rem;
left: 2rem;
margin-left: auto;
right: auto;
}
.bubble.left::before, .bubble::before
{
margin-right: calc(-2rem - 1px);
left: calc(2rem - 1px);
margin-left: auto;
right: auto;
}
.bubble.right
{
right: -1rem;
left: auto;
}
.bubble.right::after
{
margin-left: -2rem;
right: 2rem;
margin-right: auto;
left: auto;
}
.bubble.right::before
{
margin-left: calc(-2rem - 1px);
right: calc(2rem - 1px);
margin-right: auto;
left: auto;
}
.bubble.menu[am-type="selector"]
{
right: 0;
margin-top: 1rem;
left: auto;
margin-bottom: auto;
}
.bubble.menu[am-type="selector"]::after
{
margin-left: -2rem / 2;
right: 1rem;
margin-right: auto;
left: auto;
}
.bubble.menu[am-type="selector"]::before
{
margin-left: calc(-2rem / 2 - 1px);
right: calc(1rem - 1px);
margin-right: auto;
left: auto;
}
.bubble.primary
{
color: #0b86d2;
border-color: currentColor;
background-color: #e7f3fb;
}
.bubble.primary::after
{
color: #e7f3fb;
}
.bubble.primary::before
{
color: #0b86d2;
}
.bubble.success
{
color: #0c6;
border-color: currentColor;
background-color: #e6faf0;
}
.bubble.success::after
{
color: #e6faf0;
}
.bubble.success::before
{
color: #0c6;
}
.bubble.warning
{
color: #dda500;
border-color: currentColor;
background-color: #fcf6e6;
}
.bubble.warning::after
{
color: #fcf6e6;
}
.bubble.warning::before
{
color: #dda500;
}
.bubble.error
{
color: #c33;
border-color: currentColor;
background-color: #faebeb;
}
.bubble.error::after
{
color: #faebeb;
}
.bubble.error::before
{
color: #c33;
}
.bubble.is-visible, .has-error .bubble
{
display: block;
}
		
.button
{
-webkit-box-flex: none;
-webkit-flex: none;
-ms-flex: none;
flex: none;
font-size: 1rem;
height: inherit;
color: #0b86d2;
display: inline-block;
text-align: center;
width: auto;
-webkit-touch-callout: none;
transition: background-color 0.4s, color 0.4s;
}
[am-flex-grid~="group"] .button.group-left, [am-flex-grid*=" group"] .button.group-left
{
border-top-right-radius: 0;
border-bottom-right-radius: 0;
border-right: 0;
}
[am-flex-grid~="group"] .button.group-right, [am-flex-grid*=" group"] .button.group-right
{
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.button:hover, .button:focus
{
transition: none;
}
.button.icon
{
display: block;
position: relative;
height: inherit;
width: 100%;
font-size: 1.5rem;
}
.topbar .button.icon
{
width: 4.28571rem;
border-left: 1px solid;
border-right: 1px solid;
border-color: #bbb;
margin-left: -1px;
}
@media only screen and (max-width: 42.4375em)
{
.topbar[am-type="main"] .button.icon
{
width: 50%;
border: none;
margin: 0;
}
}
.button.icon.borderless
{
border-color: transparent;
}
.button.icon:hover, .button.icon:focus
{
background-color: #f8f8f8;
}
.button.icon[class*="-circle"], .button.icon.large
{
font-size: 2.5rem;
}
.button.icon.menu-is-open
{
background-color: #272a2d;
color: #fff;
transition: background-color 0.4s, color 0.4s;
}
.button.icon.menu-is-open:hover
{
background-color: #444;
transition: none;
}
.button.icon input, .button.icon a
{
padding: 0;
position: absolute;
height: 100%;
width: 100%;
left: 0;
top: 0;
}
.box-head .button.icon, .panel .button.icon
{
width: 2.5rem;
height: 2.5rem;
}
.button.text
{
border-radius: 3px;
height: 2.75rem;
font-weight: 600;
background-color: #0b86d2;
color: #fff;
vertical-align: top;
border-color: #0b86d2;
background-color: #0b86d2;
border-bottom: 3px solid #08649d;
padding-top: 1.5px;
}
.button.text:not(:last-of-type)
{
margin-right: 1rem;
}
@media only screen and (max-width: 42.4375em)
{
.box-content .button.text
{
width: 100%;
}
}
.button.text:hover, .button.text:active
{
background-color: #0a77ba;
border-color: #0a77ba;
border-bottom-color: #08649d;
}
.button.text:active
{
background-color: #0867a2;
border-color: #0867a2;
border-bottom-color: #075584;
}
.button.text.primary
{
border-color: #0b86d2;
background-color: #0b86d2;
border-bottom: 3px solid #08649d;
padding-top: 1.5px;
}
.button.text.primary:hover, .button.text.primary:active
{
background-color: #0a77ba;
border-color: #0a77ba;
border-bottom-color: #08649d;
}
.button.text.primary:active
{
background-color: #0867a2;
border-color: #0867a2;
border-bottom-color: #075584;
}
.button.text.secondary
{
border-color: #444;
background-color: #444;
border-bottom: 3px solid #282828;
padding-top: 1.5px;
}
.button.text.secondary:hover, .button.text.secondary:active
{
background-color: #373737;
border-color: #373737;
border-bottom-color: #282828;
}
.button.text.secondary:active
{
background-color: #2b2b2b;
border-color: #2b2b2b;
border-bottom-color: #1b1b1b;
}
.button.text.success
{
border-color: #0c6;
background-color: #0c6;
border-bottom: 3px solid #00944a;
padding-top: 1.5px;
}
.button.text.success:hover, .button.text.success:active
{
background-color: #00b359;
border-color: #00b359;
border-bottom-color: #00944a;
}
.button.text.success:active
{
background-color: #00994d;
border-color: #00994d;
border-bottom-color: #007a3d;
}
.button.text.warning
{
border-color: #dda500;
background-color: #dda500;
border-bottom: 3px solid #a57b00;
padding-top: 1.5px;
}
.button.text.warning:hover, .button.text.warning:active
{
background-color: #c49200;
border-color: #c49200;
border-bottom-color: #a57b00;
}
.button.text.warning:active
{
background-color: #aa7f00;
border-color: #aa7f00;
border-bottom-color: #8b6800;
}
.button.text.error
{
border-color: #c33;
background-color: #c33;
border-bottom: 3px solid #9f2828;
padding-top: 1.5px;
}
.button.text.error:hover, .button.text.error:active
{
background-color: #b82e2e;
border-color: #b82e2e;
border-bottom-color: #9f2828;
}
.button.text.error:active
{
background-color: #a32929;
border-color: #a32929;
border-bottom-color: #8b2323;
}
.button.text.grey
{
border-color: #cfd5db;
background-color: #cfd5db;
border-bottom: 3px solid #afb9c3;
padding-top: 1.5px;
}
.button.text.grey:hover, .button.text.grey:active
{
background-color: #c0c8d0;
border-color: #c0c8d0;
border-bottom-color: #afb9c3;
}
.button.text.grey:active
{
background-color: #b2bcc5;
border-color: #b2bcc5;
border-bottom-color: #a0acb8;
}
.button.text.disabled
{
border-color: #cfd5db;
background-color: #cfd5db;
border-bottom: 3px solid #afb9c3;
padding-top: 1.5px;
}
.button.text.disabled:hover, .button.text.disabled:active
{
background-color: #c0c8d0;
border-color: #c0c8d0;
border-bottom-color: #afb9c3;
}
.button.text.disabled:active
{
background-color: #b2bcc5;
border-color: #b2bcc5;
border-bottom-color: #a0acb8;
}
.button.text.borderless
{
color: #cfd5db;
border-color: transparent;
background-color: transparent;
}
.button.text.borderless:hover, .button.text.borderless:active
{
color: #0b86d2;
background-color: transparent;
}
.button.text.disabled, .button.text.is-disabled
{
border: 1px solid #9b9ea3;
color: #9b9ea3;
background-color: transparent;
transition: none;
}
.button.text.disabled input, .button.text.is-disabled input, .button.text.disabled a, .button.text.is-disabled a
{
cursor: default;
}
.button.text.disabled:hover, .button.text.is-disabled:hover, .button.text.disabled:active, .button.text.is-disabled:active
{
background-color: #fff;
border-color: #9b9ea3;
color: #9b9ea3;
}
.button.text.inner-button
{
background-color: #fff;
color: #0b86d2;
border: 1px solid #bbb;
border-left: 0;
padding: 0;
}
.button.text.inner-button input, .button.text.inner-button a
{
text-transform: none;
}
.button.text.inner-button input:hover, .button.text.inner-button a:hover
{
text-decoration: underline;
}
.button.text.inner-button:hover, .button.text.inner-button:focus, .button.text.inner-button:active
{
transition: none;
text-decoration: none;
}
.button.text.select
{
position: relative;
width: 100%;
}
.button.text.select::after
{
position: absolute;
line-height: 1;
top: 50%;
right: 1rem;
margin-top: -5px;
z-index: 2;
pointer-events: none;
font-family: 'icons';
content: "\e608";
}
@media only screen and (max-width: 42.4375em)
{
.box-action .button.text.select
{
position: relative;
}
.box-action .button.text.select::after
{
position: absolute;
line-height: 1;
top: 50%;
right: 1rem;
margin-top: -5px;
z-index: 2;
pointer-events: none;
font-family: 'icons';
content: "\e608";
-webkit-transform: rotate(0.5turn);
transform: rotate(0.5turn);
}
}
.button.text.select input, .button.text.select a
{
padding-right: 3rem;
}
.button.text:not(:only-of-type)
{
margin-bottom: 1rem;
}
.button.text input, .button.text a
{
padding: 0 1.5rem;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.topbar .button.text
{
margin: auto 1rem;
vertical-align: middle;
}
.box-head .button.text
{
margin-bottom: 0;
}
.button.full
{
width: 100%;
}
.button-group
{
margin-bottom: -1rem;
}
.button input, .button a
{
display: block;
height: 100%;
border: none;
text-transform: uppercase;
}
.button input:hover, .button a:hover, .button input:focus, .button a:focus
{
color: inherit;
text-decoration: none;
}
.button input::before, .button a::before
{
content: '';
display: inline-block;
height: 100%;
vertical-align: middle;
margin-top: 0.28571rem;
}
		
.checkbox
{
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
position: relative;
text-align: center;
width: 48px;
transition: opacity 0.4s;
}
.table .checkbox
{
height: 4rem;
width: 4rem;
}
.checkbox input[type="checkbox"]
{
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
opacity: 0;
z-index: 3;
transition: border 0.4s;
}
.checkbox input[type="checkbox"] + label
{
-webkit-align-self: center;
-moz-align-self: center;
-ms-flex-item-align: center;
align-self: center;
width: 20px;
height: 20px;
border: 1px solid #bbb;
background-color: #fff;
padding: 0;
vertical-align: middle;
margin: 0 auto;
border-radius: 3px;
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
transition: all 0.1s;
z-index: 2;
}
.checkbox input[type="checkbox"]:checked + label
{
background-color: transparent;
border-color: transparent #0b86d2 #0b86d2 transparent;
border-radius: 0;
border-width: 0 2px 2px 0;
width: 8px;
height: 18px;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
.checkbox input[type="checkbox"]:not([disabled]):hover
{
cursor: pointer;
}
.checkbox input[type="checkbox"]:not([disabled]):hover + label
{
border-color: #0b86d2;
}
		
.obj_connection
{
display: none;
}
		

		

		

		

		

		
.dropdown
{
position: relative;
}
.dropdown
{
background-color: #fff;
color: #272a2d;
border: 1px solid #bbb;
border-radius: 3px;
position: relative;
display: block;
padding: 0;
min-width: 5.14286rem;
transition: opacity 0.4s;
}
[am-flex-grid~="group"] .dropdown.group-left, [am-flex-grid*=" group"] .dropdown.group-left
{
border-top-right-radius: 0;
border-bottom-right-radius: 0;
border-right: 0;
}
[am-flex-grid~="group"] .dropdown.group-right, [am-flex-grid*=" group"] .dropdown.group-right
{
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.dropdown:not(.textarea)
{
height: 2.75rem;
}
.dropdown.is-disabled
{
background-color: #f8f8f8;
}
.dropdown.has-error
{
border-color: #c33;
transition: border-color 0.4s, color 0.4s;
}
.dropdown select, .dropdown input, .dropdown textarea
{
height: 100%;
margin: 0;
background: none;
border: none;
outline: none;
appearance: none;
-webkit-appearance: none;
padding: 0 1rem;
}
.dropdown select[readonly="readonly"], .dropdown input[readonly="readonly"], .dropdown textarea[readonly="readonly"]
{
background-color: #f8f8f8;
}
.dropdown select::-webkit-input-placeholder, .dropdown input::-webkit-input-placeholder, .dropdown textarea::-webkit-input-placeholder
{
color: #9b9ea3;
opacity: 1;
transition: opacity 0.1s;
}
.dropdown select:focus::-webkit-input-placeholder, .dropdown input:focus::-webkit-input-placeholder, .dropdown textarea:focus::-webkit-input-placeholder
{
opacity: 0.5;
}
.dropdown select::-moz-placeholder, .dropdown input::-moz-placeholder, .dropdown textarea::-moz-placeholder
{
color: #9b9ea3;
opacity: 1;
transition: opacity 0.1s;
}
.dropdown select:focus::-moz-placeholder, .dropdown input:focus::-moz-placeholder, .dropdown textarea:focus::-moz-placeholder
{
opacity: 0.5;
}
.dropdown select:-ms-input-placeholder, .dropdown input:-ms-input-placeholder, .dropdown textarea:-ms-input-placeholder
{
color: #9b9ea3;
opacity: 1;
transition: opacity 0.1s;
}
.dropdown select:focus:-ms-input-placeholder, .dropdown input:focus:-ms-input-placeholder, .dropdown textarea:focus:-ms-input-placeholder
{
opacity: 0.5;
}
.table-head .dropdown
{
color: #666;
}
.dropdown select
{
padding-right: 2rem;
white-space: normal;
line-height: 2.75rem;
}
.dropdown select:not([disabled])
{
cursor: pointer;
}
.table-head .dropdown select
{
text-transform: uppercase;
font-weight: 600;
}
.dropdown::after
{
position: absolute;
line-height: 1;
top: 50%;
right: 1rem;
margin-top: -5px;
z-index: 2;
pointer-events: none;
font-family: 'icons';
content: "\e608";
}
.dropdown select:focus
{
outline: none;
background-color: transparent;
}
.dropdown option
{
font-weight: normal;
}
.dropdown x:-o-prefocus, .dropdown .dropdown::after
{
display: none;
}
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none)
{
.dropdown select::-ms-expand
{
display: none;
}
.dropdown select:focus::-ms-value
{
background: transparent;
color: #222;
}
}
@-moz-document url-prefix()
{
.dropdown
{
overflow: hidden;
}
.dropdown select
{
width: 120%;
width: -moz-calc(100% + 3em);
width: calc(100% + em);
padding-right: 4rem;
}
}
.dropdown select:-moz-focusring
{
color: transparent;
text-shadow: 0 0 0 #000;
}
		
.folders > .folders-parent > .folders-child, .folders-root
{
border: 0;
padding: 0;
margin: 0;
font-weight: 600;
}
.folders > .folders-parent > .folders-child::after, .folders-root::after
{
display: none;
}
.folders > .folders-parent > .folders-child > .folders-parent > .folders-child, .folders-root, .folders-top
{
font-weight: 600;
}
.folders-child
{
position: relative;
padding-left: 1.4rem;
margin-left: 0.6rem;
border-left: 1px solid #666;
line-height: 2.2rem;
font-weight: 400;
white-space: nowrap;
}
.folders-child:hover
{
color: #0b86d2;
cursor: pointer;
}
.folders-child.open > .folders-parent
{
color: #444;
cursor: default;
}
.folders-child:not(:last-child)::after
{
background-color: transparent;
}
.folders-child::before
{
content: "\e60b";
font-family: 'icons';
margin-right: 0.66667rem;
font-weight: 400;
vertical-align: middle;
font-size: 1.3rem;
padding-bottom: 2px;
display: inline-block;
}
.folders-child.type_x::before
{
content: "\e619";
}
.folders-child.type_e::before
{
content: "\e60a";
}
.folders-child.type_t::before
{
content: "\e614";
}
.folders-child.type_j::before
{
content: "\e636";
}
.folders-child.type_n::before
{
content: "\e638";
}
.folders-child.type_c::before
{
content: "\e605";
}
.folders-child.type_f::before
{
content: "\e637";
}
.folders-child.type_a::before
{
content: "\e635";
}
.folders-child.type_i::before
{
content: "\e609";
}
.folders-child::after
{
content: '';
position: absolute;
top: 1.1rem;
left: -1px;
background-color: #fff;
border-top: 1px solid #666;
display: block;
width: 0.875rem;
height: 100%;
}
.folders-name
{
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
width: calc(100% - 2rem);
display: inline-block;
vertical-align: middle;
}
		
.form-block
{
margin-bottom: 5rem;
}
.form-label
{
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
-moz-align-items: center;
align-items: center;
white-space: nowrap;
height: 2.75rem;
margin-bottom: -0.33333rem;
}
.form-row
{
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
-moz-align-items: center;
align-items: center;
height: 2.75rem;
box-sizing: content-box;
padding-bottom: 1rem;
}
@media only screen and (min-width:42.5em)
{
.form-row
{
padding-bottom: 2rem;
}
}
@media only screen and (min-width:65em)
{
.form-row.margin
{
padding-top: 2.4rem;
}
}
.form-row.large
{
-webkit-box-align: start;
-ms-flex-align: start;
-webkit-align-items: flex-start;
-moz-align-items: flex-start;
align-items: flex-start;
height: auto;
}
@media only screen and (min-width:65em)
{
[am-flex-grid^="center"] .form-row, [am-flex-grid*=" center"] .form-row, [am-flex-grid^="center"] .form-label, [am-flex-grid*=" center"] .form-label
{
padding-bottom: 0;
margin-bottom: 1rem;
}
}
.form-label + .form-row
{
padding-top: 0;
}
.form-row + .form-desc
{
margin-top: -0.5rem;
}
@media only screen and (min-width:42.5em)
{
.form-row + .form-desc
{
margin-top: -1.5rem;
}
}
.form-desc
{
font-size: 0.92857rem;
color: #666;
padding: 0 0 1rem 0;
}
.form-image
{
border: 1px solid #bbb;
width: 100%;
max-width: 40.85714rem;
}
.form-error
{
color: #c33;
text-transform: uppercase;
font-weight: 600;
margin-top: -0.5rem;
padding-bottom: 1rem;
}
[debug] .form-block
{
position: relative;
}
[debug] .form-block::after
{
left: 0;
width: 100%;
height: 100%;
}
[debug] .form-block::before
{
right: 0;
}
[debug] .form-block::after, [debug] .form-block::before
{
content: '';
display: block;
position: absolute;
top: 0;
opacity: 0;
transition: opacity 0.4s 0.1s;
pointer-events: none;
}
[debug] .form-block:hover::after, [debug] .form-block:hover::before
{
opacity: 1;
transition: opacity 0.1s;
}
[debug] .form-block::after
{
z-index: 1001;
background-color: rgba(204, 51, 51, 0.1);
box-shadow: 0 0 0 2px #e69999;
}
[debug] .form-block::before
{
color: #444;
z-index: 1001;
content: 'block';
background-color: #e69999;
font-weight: 600;
text-align: right;
padding: 0 0.5rem 0 calc(0.5rem + 2px);
}
[debug] .form-item
{
position: relative;
}
[debug] .form-item::after
{
left: 0;
width: 100%;
height: 100%;
}
[debug] .form-item::before
{
right: 0;
}
[debug] .form-item::after, [debug] .form-item::before
{
content: '';
display: block;
position: absolute;
top: 0;
opacity: 0;
transition: opacity 0.4s 0.1s;
pointer-events: none;
}
[debug] .form-item:hover::after, [debug] .form-item:hover::before
{
opacity: 1;
transition: opacity 0.1s;
}
[debug] .form-item::after
{
z-index: 1002;
background-color: rgba(255, 255, 0, 0.1);
box-shadow: 0 0 0 2px #ffff80;
}
[debug] .form-item::before
{
color: #444;
z-index: 1002;
content: 'item';
background-color: #ffff80;
font-weight: 600;
text-align: right;
padding: 0 0.5rem 0 calc(0.5rem + 2px);
}
[debug] .form-row
{
position: relative;
}
[debug] .form-row::after
{
left: 0;
width: 100%;
height: 100%;
}
[debug] .form-row::before
{
right: 0;
}
[debug] .form-row::after, [debug] .form-row::before
{
content: '';
display: block;
position: absolute;
top: 0;
opacity: 0;
transition: opacity 0.4s 0.1s;
pointer-events: none;
}
[debug] .form-row:hover::after, [debug] .form-row:hover::before
{
opacity: 1;
transition: opacity 0.1s;
}
[debug] .form-row::after
{
z-index: 1003;
background-color: rgba(11, 134, 210, 0.1);
box-shadow: 0 0 0 2px #85c3e9;
}
[debug] .form-row::before
{
color: #444;
z-index: 1003;
content: 'row';
background-color: #85c3e9;
font-weight: 600;
text-align: right;
padding: 0 0.5rem 0 calc(0.5rem + 2px);
}
[debug] .form-label
{
position: relative;
}
[debug] .form-label::after
{
left: 0;
width: 100%;
height: 100%;
}
[debug] .form-label::before
{
right: 0;
}
[debug] .form-label::after, [debug] .form-label::before
{
content: '';
display: block;
position: absolute;
top: 0;
opacity: 0;
transition: opacity 0.4s 0.1s;
pointer-events: none;
}
[debug] .form-label:hover::after, [debug] .form-label:hover::before
{
opacity: 1;
transition: opacity 0.1s;
}
[debug] .form-label::after
{
z-index: 1004;
background-color: rgba(0, 204, 102, 0.1);
box-shadow: 0 0 0 2px #80e6b3;
}
[debug] .form-label::before
{
color: #444;
z-index: 1004;
content: 'label';
background-color: #80e6b3;
font-weight: 600;
text-align: right;
padding: 0 0.5rem 0 calc(0.5rem + 2px);
}
[debug] .form-desc
{
position: relative;
}
[debug] .form-desc::after
{
left: 0;
width: 100%;
height: 100%;
}
[debug] .form-desc::before
{
right: 0;
}
[debug] .form-desc::after, [debug] .form-desc::before
{
content: '';
display: block;
position: absolute;
top: 0;
opacity: 0;
transition: opacity 0.4s 0.1s;
pointer-events: none;
}
[debug] .form-desc:hover::after, [debug] .form-desc:hover::before
{
opacity: 1;
transition: opacity 0.1s;
}
[debug] .form-desc::after
{
z-index: 1005;
background-color: rgba(255, 20, 147, 0.1);
box-shadow: 0 0 0 2px #ff8ac9;
}
[debug] .form-desc::before
{
color: #444;
z-index: 1005;
content: 'desc';
background-color: #ff8ac9;
font-weight: 600;
text-align: right;
padding: 0 0.5rem 0 calc(0.5rem + 2px);
}
		
.datepicker
{
display: none;
z-index: 1000;
position: absolute;
left: -1px;
bottom: 1px;
-webkit-transform: translateY(100%);
transform: translateY(100%);
background-color: #fff;
border: 1px solid #bbb;
text-align: center;
cursor: default;
width: 20rem;
}
.datepicker.show
{
display: block;
}
.datepicker-month, .datepicker-year
{
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
align-items: center;
height: 2.75rem;
}
.datepicker-year
{
border-top: 1px solid #bbb;
}
.datepicker-select, .datepicker-arrow
{
font-weight: 600;
}
.datepicker-select
{
border: 0;
-webkit-box-flex: 1;
-webkit-flex: 1 1 0%;
-ms-flex: 1 1 0%;
flex: 1 1 0%;
}
.datepicker-arrow
{
width: 2.75rem;
cursor: pointer;
color: #444;
font-size: 1rem;
height: 100%;
line-height: 2.75rem;
transition: background-color 0.4s;
}
.datepicker-arrow:hover, .datepicker-arrow:focus
{
background-color: #f8f8f8;
transition: none;
}
.datepicker-calendar
{
table-layout: fixed;
border: 0;
border-top: 1px solid #bbb;
}
.datepicker-calendar td, .datepicker-calendar th
{
text-align: center;
border: 0;
}
.datepicker-calendar tbody th
{
cursor: pointer;
font-weight: 400;
}
.datepicker-dates th:not(.selected)
{
transition: background-color 0.4s;
}
.datepicker-dates th:not(.selected):hover, .datepicker-dates th:not(.selected):focus
{
background-color: #f8f8f8;
transition: none;
}
.datepicker-dates th.selected
{
background-color: #0b86d2;
color: #fff;
font-weight: 600;
}
		
.input
{
background-color: #fff;
color: #272a2d;
border: 1px solid #bbb;
border-radius: 3px;
position: relative;
display: block;
padding: 0;
min-width: 5.14286rem;
transition: opacity 0.4s;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
-moz-align-items: center;
align-items: center;
}
[am-flex-grid~="group"] .input.group-left, [am-flex-grid*=" group"] .input.group-left
{
border-top-right-radius: 0;
border-bottom-right-radius: 0;
border-right: 0;
}
[am-flex-grid~="group"] .input.group-right, [am-flex-grid*=" group"] .input.group-right
{
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.input:not(.textarea)
{
height: 2.75rem;
}
.input.is-disabled
{
background-color: #f8f8f8;
}
.input.has-error
{
border-color: #c33;
transition: border-color 0.4s, color 0.4s;
}
.input select, .input input, .input textarea
{
height: 100%;
margin: 0;
background: none;
border: none;
outline: none;
appearance: none;
-webkit-appearance: none;
padding: 0 1rem;
}
.input select[readonly="readonly"], .input input[readonly="readonly"], .input textarea[readonly="readonly"]
{
background-color: #f8f8f8;
}
.input select::-webkit-input-placeholder, .input input::-webkit-input-placeholder, .input textarea::-webkit-input-placeholder
{
color: #9b9ea3;
opacity: 1;
transition: opacity 0.1s;
}
.input select:focus::-webkit-input-placeholder, .input input:focus::-webkit-input-placeholder, .input textarea:focus::-webkit-input-placeholder
{
opacity: 0.5;
}
.input select::-moz-placeholder, .input input::-moz-placeholder, .input textarea::-moz-placeholder
{
color: #9b9ea3;
opacity: 1;
transition: opacity 0.1s;
}
.input select:focus::-moz-placeholder, .input input:focus::-moz-placeholder, .input textarea:focus::-moz-placeholder
{
opacity: 0.5;
}
.input select:-ms-input-placeholder, .input input:-ms-input-placeholder, .input textarea:-ms-input-placeholder
{
color: #9b9ea3;
opacity: 1;
transition: opacity 0.1s;
}
.input select:focus:-ms-input-placeholder, .input input:focus:-ms-input-placeholder, .input textarea:focus:-ms-input-placeholder
{
opacity: 0.5;
}
.input input ~ .label, .input .label + input
{
border-left: 1px solid #bbb;
}
.input.has-error
{
color: #c33;
}
.input.has-error input::-webkit-input-placeholder
{
color: #c33;
}
.input.has-error input::-moz-placeholder
{
color: #c33;
}
.input.has-error input:-ms-input-placeholder
{
color: #c33;
}
		
.label
{
color: #666;
font-weight: 600;
font-size: 0.85714rem;
text-transform: uppercase;
overflow: hidden;
text-overflow: ellipsis;
transition: opacity 0.4s;
}
.label.big
{
font-size: 1.42857rem;
}
.input .label
{
-webkit-box-flex: none;
-webkit-flex: none;
-ms-flex: none;
flex: none;
text-transform: none;
padding: 0 1rem;
background-color: #f8f8f8;
height: 100%;
line-height: 2.75rem;
transition: color 0.4s;
}
		

		
.loader
{
background: transparent center no-repeat;
background-image: url('../images/loading/loader.gif');
height: 0;
visibility: hidden;
opacity: 0;
margin: 0 auto;
text-align: center;
transition: opacity 0.4s, height 0.4s, visibility 0.4s;
}
.loader.is-visible
{
visibility: visible;
opacity: 1;
height: 4rem;
}
		
.menu
{
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-direction: normal;
-webkit-box-orient: horizontal;
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-flex: none;
-webkit-flex: none;
-ms-flex: none;
flex: none;
background-color: #f8f8f8;
}
@media only screen and (max-width: 42.4375em)
{
.menu
{
-webkit-box-flex: 1;
-webkit-flex: 1 1 0%;
-ms-flex: 1 1 0%;
flex: 1 1 0%;
}
}
.menu.vertical
{
-webkit-box-direction: normal;
-webkit-box-orient: vertical;
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
}
.menu.dark
{
background-color: #272a2d;
color: #fff;
}
@media only screen and (max-width: 42.4375em)
{
.menu.dark
{
border-top: none;
}
}
.topbar .menu
{
height: 100%;
background-color: #fff;
}
@media only screen and (max-width: 42.4375em)
{
.topbar[am-type="main"] .menu.left
{
-webkit-box-flex: 1;
-webkit-flex: 1 1 0%;
-ms-flex: 1 1 0%;
flex: 1 1 0%;
}
.topbar[am-type="main"] .menu.right
{
-webkit-box-flex: 1;
-webkit-flex: 1 1 0%;
-ms-flex: 1 1 0%;
flex: 1 1 0%;
}
}
.topbar[am-type="search"] .menu
{
-webkit-box-flex: none;
-webkit-flex: none;
-ms-flex: none;
flex: none;
}
.menu[am-type="selector"]
{
position: absolute;
text-align: left;
border: 1px solid #bbb;
border-width: 1px;
border-radius: 3px;
background: #fff;
z-index: 100;
}
.menu[am-type="selector"]::after, .menu[am-type="selector"]::before
{
content: '';
height: 0;
width: 0;
border: solid transparent;
border-color: currentColor;
border-left-color: transparent;
border-right-color: transparent;
position: absolute;
pointer-events: none;
}
.menu[am-type="selector"]::after
{
color: #fff;
border-width: 0.5rem;
}
.menu[am-type="selector"]::before
{
color: #bbb;
border-width: calc(0.5rem + 1px);
}
.menu[am-type="selector"].bottom, .menu[am-type="selector"]
{
top: 100%;
margin-top: 2px;
bottom: auto;
margin-bottom: auto;
}
.menu[am-type="selector"].bottom::after, .menu[am-type="selector"]::after, .menu[am-type="selector"].bottom::before, .menu[am-type="selector"]::before
{
bottom: 100%;
border-top-color: transparent;
top: auto;
border-bottom-color: currentColor;
}
.menu[am-type="selector"].top, .box-action .menu[am-type="selector"]
{
bottom: 100%;
margin-bottom: 2px;
top: auto;
margin-top: auto;
}
.menu[am-type="selector"].top::after, .box-action .menu[am-type="selector"]::after, .menu[am-type="selector"].top::before, .box-action .menu[am-type="selector"]::before
{
top: 100%;
border-bottom-color: transparent;
bottom: auto;
border-top-color: currentColor;
}
.menu[am-type="selector"].left, .menu[am-type="selector"]
{
left: -1rem;
right: auto;
}
.menu[am-type="selector"].left::after, .menu[am-type="selector"]::after
{
margin-right: -2rem;
left: 2rem;
margin-left: auto;
right: auto;
}
.menu[am-type="selector"].left::before, .menu[am-type="selector"]::before
{
margin-right: calc(-2rem - 1px);
left: calc(2rem - 1px);
margin-left: auto;
right: auto;
}
.menu[am-type="selector"].right
{
right: -1rem;
left: auto;
}
.menu[am-type="selector"].right::after
{
margin-left: -2rem;
right: 2rem;
margin-right: auto;
left: auto;
}
.menu[am-type="selector"].right::before
{
margin-left: calc(-2rem - 1px);
right: calc(2rem - 1px);
margin-right: auto;
left: auto;
}
.menu[am-type="selector"].menu[am-type="selector"]
{
right: 0;
margin-top: 1rem;
left: auto;
margin-bottom: auto;
}
.menu[am-type="selector"].menu[am-type="selector"]::after
{
margin-left: -2rem / 2;
right: 1rem;
margin-right: auto;
left: auto;
}
.menu[am-type="selector"].menu[am-type="selector"]::before
{
margin-left: calc(-2rem / 2 - 1px);
right: calc(1rem - 1px);
margin-right: auto;
left: auto;
}
.menu[am-type="selector"].primary
{
color: #0b86d2;
border-color: currentColor;
background-color: #e7f3fb;
}
.menu[am-type="selector"].primary::after
{
color: #e7f3fb;
}
.menu[am-type="selector"].primary::before
{
color: #0b86d2;
}
.menu[am-type="selector"].success
{
color: #0c6;
border-color: currentColor;
background-color: #e6faf0;
}
.menu[am-type="selector"].success::after
{
color: #e6faf0;
}
.menu[am-type="selector"].success::before
{
color: #0c6;
}
.menu[am-type="selector"].warning
{
color: #dda500;
border-color: currentColor;
background-color: #fcf6e6;
}
.menu[am-type="selector"].warning::after
{
color: #fcf6e6;
}
.menu[am-type="selector"].warning::before
{
color: #dda500;
}
.menu[am-type="selector"].error
{
color: #c33;
border-color: currentColor;
background-color: #faebeb;
}
.menu[am-type="selector"].error::after
{
color: #faebeb;
}
.menu[am-type="selector"].error::before
{
color: #c33;
}
.menu[am-type="selector"] .menu-wrap
{
overflow-y: auto;
overflow-x: hidden;
-webkit-overflow-scrolling: touch;
max-height: 20.78571rem;
}
.menu[am-type="selector"] .menu-item
{
font-size: 1rem;
color: #444;
display: block;
padding: 0 1.5rem;
text-transform: uppercase;
font-weight: 600;
white-space: nowrap;
line-height: 3rem;
}
.box-action .menu[am-type="selector"] .menu-item
{
line-height: 3rem !important;
height: 3rem !important;
border-top: 0 !important;
}
.menu[am-type="selector"] .menu-item:hover, .menu[am-type="selector"] .menu-item:focus
{
color: #0b86d2;
background-color: inherit;
}
.menu[am-type="selector"] .menu-item:not(:last-child)::after
{
display: block;
content: '';
height: 1px;
background-color: #bbb;
margin: 0 1.5rem;
}
@media only screen and (max-width: 42.4375em)
{
.menu[am-type="box"].vertical .menu-wrap
{
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-direction: normal;
-webkit-box-orient: vertical;
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
}
}
.menu-item
{
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
-moz-align-items: center;
align-items: center;
overflow: hidden;
font-size: 1.14286rem;
font-weight: 600;
text-decoration: none;
opacity: 1;
padding: 0 1.33333rem;
transition: background-color 0.1s;
}
@media only screen and (max-width: 42.4375em)
{
.menu[am-type="box"]:not([am-subtype="action"]) .menu-item:not(.active)
{
display: none;
}
.menu[am-type="box"]:not([am-subtype="action"]).is-open .menu-item
{
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
}
.menu[am-type="box"].vertical .menu-item
{
height: 4.28571rem;
line-height: 4.28571rem;
}
@media only screen and (max-width: 42.4375em)
{
.menu[am-type="box"].vertical .menu-item
{
border-top: 1px solid #bbb;
}
.menu[am-type="box"].vertical .menu-item.active
{
position: relative;
}
.menu[am-type="box"].vertical .menu-item.active::after
{
position: absolute;
line-height: 1;
top: 50%;
right: 2rem;
margin-top: -5px;
z-index: 2;
pointer-events: none;
font-family: 'icons';
content: "\e608";
-webkit-transform: rotate(0.5turn);
transform: rotate(0.5turn);
}
}
@media only screen and (min-width:42.5em)
{
.menu[am-type="box"].vertical .menu-item
{
border-bottom: 1px solid #bbb;
border-right: 1px solid #bbb;
}
.menu[am-type="box"].vertical .menu-item.active
{
margin-right: -1px;
}
}
.menu.dark .menu-item
{
height: 4.28571rem;
line-height: 4.28571rem;
border-bottom: 1px solid #444;
padding-left: 1.33333rem;
}
@media only screen and (min-width:42.5em)
{
.menu-item
{
padding: 0 2rem;
}
}
.menu-item:hover, .menu-item:focus
{
text-decoration: none;
transition: none;
color: inherit;
}
.menu-item:hover:not(.active), .menu-item:focus:not(.active)
{
background-color: #fff;
}
.menu.dark .menu-item:hover:not(.active), .menu.dark .menu-item:focus:not(.active)
{
background-color: #444;
}
.menu-item [class^="icon-"], .menu-item [class*=" icon-"]
{
-webkit-box-flex: none;
-webkit-flex: none;
-ms-flex: none;
flex: none;
font-size: 1.5rem;
}
@media only screen and (min-width:42.5em) and (max-width:64.9375em)
{
.menu-item [class^="icon-"], .menu-item [class*=" icon-"]
{
display: none;
}
}
.menu-item > span
{
pointer-events: none;
line-height: 1;
text-align: left;
}
.menu-item.active
{
color: #0b86d2;
background-color: #fff;
}
.menu.dark .menu-item.active
{
background-color: inherit;
}
@media only screen and (max-width: 42.4375em)
{
.menu-item.active
{
-webkit-box-ordinal-group: 2;
-webkit-order: 1;
-moz-order: 1;
-ms-flex-order: 1;
order: 1;
}
}
.box-action .menu-item
{
overflow: visible;
}
.topbar .menu-item
{
padding: 0;
}
.topbar .menu-item:hover, .topbar .menu-item:focus
{
text-decoration: none;
}
		

		

		
.panel
{
border: 1px solid #bbb;
margin-bottom: 1rem;
padding: 1rem;
}
.panel[am-type="block"]
{
padding: 1.5rem;
}
@media only screen and (min-width:42.5em)
{
.panel[am-type="block"]
{
padding: 2rem;
}
}
.panel[am-type="block"] .panel-title
{
font-size: 1rem;
text-transform: uppercase;
color: #444;
}
.panel[am-type="block"] .panel-icon
{
font-size: 6em;
line-height: 1;
margin-right: -1.5rem;
width: 100%;
}
.panel[am-type="full"]
{
margin-bottom: 3rem;
padding: 1rem;
border-width: 2px;
border-radius: 6px;
}
@media only screen and (min-width:42.5em)
{
.panel[am-type="full"]
{
padding: 1.5rem;
}
}
.panel[am-type="full"] .panel-title
{
font-size: 2rem;
line-height: 1;
}
.panel[am-type="full"] .panel-icon
{
font-size: 2.75rem;
width: 2.75rem;
line-height: 1;
}
.panel[am-type="full"] .icon-close
{
color: currentColor;
}
@media only screen and (max-width:64.9375em)
{
.panel[am-type="full"] .button-group
{
margin-top: 1rem;
}
}
.panel.error
{
border-color: #c33;
background-color: rgba(204, 51, 51, 0.1);
color: #c33;
}
		

		
.modal
{
position: fixed;
left: 0;
top: 0;
height: 100vh;
width: 100vw;
background-color: rgba(0, 0, 0, 0.8);
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
-moz-align-items: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
-moz-justify-content: center;
justify-content: center;
margin: 0 auto !important;
z-index: 200;
opacity: 1;
visibility: visible;
-webkit-animation-duration: 0.1s !important;
animation-duration: 0.1s !important;
}
body:not(.no-animation) .modal
{
-webkit-animation: reveal 0.4s ease-in-out backwards;
animation: reveal 0.4s ease-in-out backwards;
}
.modal-content
{
background-color: #fff;
display: block;
-webkit-box-flex: none;
-webkit-flex: none;
-ms-flex: none;
flex: none;
}
body:not(.no-animation) .modal-content
{
-webkit-animation: reveal 0.4s ease-in-out backwards;
animation: reveal 0.4s ease-in-out backwards;
}
.modal-close
{
position: absolute;
display: inline-block;
overflow: hidden;
text-align: center;
vertical-align: middle;
line-height: 80%;
font-weight: 300;
width: 3rem;
height: 3rem;
font-size: 3rem;
color: #9b9ea3;
background-color: #fff;
right: 1rem;
}
.modal-close:hover, .modal-close:focus
{
text-decoration: none;
}
		
.table
{
table-layout: fixed;
width: 100%;
margin-top: -0.5rem;
}
.table, .table-wrap
{
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-direction: normal;
-webkit-box-orient: vertical;
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-flex: 1;
-webkit-flex: 1 1 0%;
-ms-flex: 1 1 0%;
flex: 1 1 0%;
}
.modal .table
{
margin-top: 0;
}
.table li
{
display: table-cell;
vertical-align: middle;
max-width: 20rem;
overflow: hidden;
text-overflow: ellipsis;
padding: 0 1rem;
}
.table-head
{
display: table-header-group;
}
.table-body
{
-webkit-box-flex: 1;
-webkit-flex: 1 1;
-ms-flex: 1 1;
flex: 1 1;
flex-basis: 0;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
display: block;
}
.table-row
{
height: 4rem;
width: 100%;
display: table;
table-layout: fixed;
}
@media only screen and (min-width:65em)
{
.table-row
{
white-space: nowrap;
}
}
.table-row:hover
{
color: #0b86d2;
transition: none;
}
.table-row:not(:last-child)
{
border-bottom: 1px solid #bbb;
}
.table-body .table-row
{
cursor: pointer;
}
.table-body .table-row:last-child li
{
border-bottom: none;
}
.table-head .table-row
{
font-size: 0.85714rem;
font-weight: 600;
text-transform: uppercase;
color: #666;
border-bottom: 1px solid #bbb;
}
@media only screen and (min-width:65em)
{
.table-row.sub li.table-select-row
{
padding-left: 2.66667rem;
width: 6.66667rem;
}
}
.table-row.is-selected
{
background-color: rgba(11, 134, 210, 0.1);
transition: background 0.1s;
}
.table-row.is-selected li:first-child
{
box-shadow: inset 5px 0 0 0 #0b86d2;
transition: box-shadow 0.1s;
}
.table-controls
{
padding: 1rem 0;
border-top: 1px solid #bbb;
}
.table-dropdown-label
{
padding-right: 1rem;
}
.table [class*="table-select-"]
{
padding: 0;
width: 4rem;
min-width: 4rem;
}
.table [class*="table-select-"] + li
{
padding-left: 0;
}
@media only screen and (max-width: 42.4375em)
{
.box-content .table
{
width: calc(100% + 1rem * 2);
margin-left: -1rem;
}
}
		

		
.textarea
{
background-color: #fff;
color: #272a2d;
border: 1px solid #bbb;
border-radius: 3px;
position: relative;
display: block;
padding: 0;
min-width: 5.14286rem;
transition: opacity 0.4s;
}
[am-flex-grid~="group"] .textarea.group-left, [am-flex-grid*=" group"] .textarea.group-left
{
border-top-right-radius: 0;
border-bottom-right-radius: 0;
border-right: 0;
}
[am-flex-grid~="group"] .textarea.group-right, [am-flex-grid*=" group"] .textarea.group-right
{
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.textarea:not(.textarea)
{
height: 2.75rem;
}
.textarea.is-disabled
{
background-color: #f8f8f8;
}
.textarea.has-error
{
border-color: #c33;
transition: border-color 0.4s, color 0.4s;
}
.textarea select, .textarea input, .textarea textarea
{
height: 100%;
margin: 0;
background: none;
border: none;
outline: none;
appearance: none;
-webkit-appearance: none;
padding: 0 1rem;
}
.textarea select[readonly="readonly"], .textarea input[readonly="readonly"], .textarea textarea[readonly="readonly"]
{
background-color: #f8f8f8;
}
.textarea select::-webkit-input-placeholder, .textarea input::-webkit-input-placeholder, .textarea textarea::-webkit-input-placeholder
{
color: #9b9ea3;
opacity: 1;
transition: opacity 0.1s;
}
.textarea select:focus::-webkit-input-placeholder, .textarea input:focus::-webkit-input-placeholder, .textarea textarea:focus::-webkit-input-placeholder
{
opacity: 0.5;
}
.textarea select::-moz-placeholder, .textarea input::-moz-placeholder, .textarea textarea::-moz-placeholder
{
color: #9b9ea3;
opacity: 1;
transition: opacity 0.1s;
}
.textarea select:focus::-moz-placeholder, .textarea input:focus::-moz-placeholder, .textarea textarea:focus::-moz-placeholder
{
opacity: 0.5;
}
.textarea select:-ms-input-placeholder, .textarea input:-ms-input-placeholder, .textarea textarea:-ms-input-placeholder
{
color: #9b9ea3;
opacity: 1;
transition: opacity 0.1s;
}
.textarea select:focus:-ms-input-placeholder, .textarea input:focus:-ms-input-placeholder, .textarea textarea:focus:-ms-input-placeholder
{
opacity: 0.5;
}
.textarea.is-disabled
{
opacity: 1;
}
.textarea textarea
{
height: 7.5rem;
margin-bottom: -0.5rem;
padding-bottom: 0;
}
		
.toast
{
position: fixed;
left: 0;
bottom: 0;
width: 100%;
z-index: 2000;
text-align: center;
background-color: rgba(39, 42, 45, 0.9);
color: #fff;
cursor: default;
font-size: 2.14286rem;
padding: 2rem 4rem;
opacity: 0;
visibility: hidden;
-webkit-transform: translateY(3.5rem);
transform: translateY(3.5rem);
transition: transform 0.4s ease-in-out, visibility 0.4s, opacity 0.4s;
}
@media medium-up
{
.toast
{
padding: 2rem 10rem;
}
}
.toast.active
{
opacity: 1;
visibility: visible;
-webkit-transform: translateY(0);
transform: translateY(0);
}
.toast-close
{
position: absolute;
font-weight: 300;
top: 0;
right: 1rem;
}
.toast-close:hover, .toast-close:focus
{
text-decoration: none;
}
@media medium-up
{
.toast-close
{
right: 2rem;
}
}
		
.toggle
{
position: relative;
width: 36px;
border-radius: 9999px;
max-width: 36px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
transition: opacity 0.4s;
}
.toggle-label
{
overflow: hidden;
display: block;
border: 1px solid #bbb;
border-radius: 9999px;
padding: 0;
transition: border-color 0.4s;
}
.toggle-inner
{
display: block;
width: 200%;
margin-left: -100%;
transition: margin 0.1s ease-in-out;
}
.toggle-inner::before, .toggle-inner::after
{
display: block;
float: left;
width: 50%;
height: 18px;
padding: 0;
color: #fff;
}
.toggle-inner::before
{
content: '';
padding-left: 1rem;
background-color: rgba(11, 134, 210, 0.14);
color: #0b86d2;
}
.toggle-inner::after
{
content: '';
padding-right: 1rem;
color: #444;
text-align: right;
background-color: #fff;
}
.toggle.is-disabled .toggle-inner::after
{
background-color: #f8f8f8;
cursor: default;
}
.toggle-switch
{
display: block;
width: 12px;
height: 12px;
margin: 4px;
background: #fff;
border: 1px solid #bbb;
border-radius: 9999px;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: auto;
transition: all 0.1s ease-in-out;
}
.toggle-checkbox
{
display: none;
}
.toggle-checkbox:checked + .toggle-label
{
border-color: #0b86d2;
}
.toggle.is-disabled .toggle-checkbox:checked + .toggle-label
{
opacity: 0.5;
}
.toggle-checkbox:checked + .toggle-label .toggle-inner
{
margin-left: 0;
}
.toggle-checkbox:checked + .toggle-label .toggle-switch
{
-webkit-transform: translateX(16px);
transform: translateX(16px);
border-color: #0b86d2;
}
.toggle-checkbox:not([disabled]) + .toggle-label:hover, .toggle-checkbox:not([disabled]) + .toggle-label:hover .toggle-switch
{
border-color: #0b86d2;
cursor: pointer;
}
		
.topbar
{
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
-moz-align-items: center;
align-items: center;
z-index: 100;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 4.28571rem;
line-height: 4.28571rem;
background-color: #fff;
border-bottom: 1px solid #bbb;
box-sizing: content-box;
}
.topbar-center
{
-webkit-box-flex: 1;
-webkit-flex: 1 1 0%;
-ms-flex: 1 1 0%;
flex: 1 1 0%;
}
.topbar[am-type="connection"]
{
z-index: 200;
}
.topbar[am-type="search"]
{
z-index: 101;
top: -100%;
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
transition: transform 0.4s ease-in-out, top 0s 0.4s;
}
.topbar[am-type="search"].active
{
top: 0;
-webkit-transform: translateX(0);
transform: translateX(0);
transition: transform 0.4s ease-in-out;
}
.topbar[am-type="search"] .topbar-search
{
position: relative;
}
.topbar[am-type="search"] .topbar-search-input, .topbar[am-type="search"] .topbar-search-result
{
border: none;
font-size: 1.5rem;
}
.topbar[am-type="search"] .topbar-search-input
{
height: 4.28571rem;
background-color: transparent;
}
.topbar[am-type="search"] .topbar-search-input input
{
padding-left: 0;
background-color: #fff;
opacity: 0;
transition: opacity 0.4s;
}
.topbar[am-type="search"] .topbar-search-input input:focus, .topbar[am-type="search"] .topbar-search-input input.is-empty, .topbar[am-type="search"] .topbar-search-input input:not(.has-info)
{
opacity: 1;
}
.topbar[am-type="search"] .topbar-search-result
{
font-weight: 300;
position: absolute;
left: 0;
top: 0;
width: 100%;
color: #0b86d2;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.topbar[am-type="search"] .topbar-search-close
{
color: #9b9ea3;
}
.topbar[am-type="search"] .topbar-search-close:hover, .topbar[am-type="search"] .topbar-search-close:focus
{
color: #0b86d2;
}
.topbar-server
{
margin: 0 0 0 2rem;
}
.topbar-server span:last-child
{
vertical-align: middle;
}
		
.userhead
{
display: inline-block;
position: relative;
overflow: hidden;
text-align: center;
border: 1px solid currentColor;
opacity: 1;
visibility: visible;
}
@media only screen
{
.userhead
{
width: 32px;
height: 32px;
font-size: 32px;
line-height: 32px;
}
}
@media only screen and (min-width:42.5em)
{
.userhead
{
width: 36px;
height: 36px;
font-size: 36px;
line-height: 36px;
}
}
@media only screen and (min-width:65em)
{
.userhead
{
width: 40px;
height: 40px;
font-size: 40px;
line-height: 40px;
}
}
body:not(.no-animation) .userhead
{
-webkit-animation: reveal 0.4s ease-in-out backwards;
animation: reveal 0.4s ease-in-out backwards;
}
.userhead, .userhead + span
{
vertical-align: middle;
white-space: nowrap;
}
.userhead-image
{
background: transparent no-repeat center;
background-size: cover;
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
border-radius: 50%;
}
.userhead.text
{
background-color: #bbb;
color: #fff;
font-size: 1.2rem;
}
.userhead.large
{
line-height: 1;
}
@media only screen
{
.userhead.large
{
width: 70px;
height: 70px;
font-size: 70px;
}
}
@media only screen and (min-width:42.5em)
{
.userhead.large
{
width: 78px;
height: 78px;
font-size: 78px;
}
}
@media only screen and (min-width:65em)
{
.userhead.large
{
width: 87px;
height: 87px;
font-size: 87px;
}
}