/* Root / Reset */
* {
    box-sizing: border-box;
}

input::-ms-reveal {
    display: none;
}


@font-face {
    font-family: RoobertCEZ;
    src: url('/cas/themes/CPR_mujcez/fonts/RoobertCEZ-Regular-c77543acba4d773424fe97f1a8962a51.ttf');
    font-style: normal;
    font-weight: normal;
}
@font-face {
    font-family: RoobertCEZ;
    src: url('/cas/themes/CPR_mujcez/fonts/RoobertCEZ-SemiBold-96748e8f06b96babfff98576f82ef3ec.ttf');
    font-style: normal;
    font-weight: 600;
}
@font-face {
    font-family: RoobertCEZ;
    src: url('/cas/themes/CPR_mujcez/fonts/RoobertCEZ-Bold-4b09278853b6c76258516702ca3e8373.ttf');
    font-style: normal;
    font-weight: bold;
}
@font-face {
    font-family: RoobertCEZ;
    src: url('/cas/themes/CPR_mujcez/fonts/RoobertCEZ-Light-eafe92c0955ee6370a37eaf7e918cdeb.ttf');
    font-style: italic;
    font-weight: normal;
}



html {
    font-size: 62.5%;
}

:root {
    --cas-theme-primary:var(--primaryColor);
    --cas-theme-primary-bg: rgba(21, 62, 80, 0.2);
    --cas-theme-primary-light: #006d85;
    --cas-theme-secondary: #74C163;
    --cas-theme-success: var(--cas-theme-secondary);
    --cas-theme-danger: var(--mdc-theme-error);
    --cas-theme-warning: #e6a210;
    --cas-theme-border-light: 1px solid rgba(0, 0, 0, .2);
    --cas-theme-twitter-color: #55acee;
    --cas-theme-vimeo-color: #1ab7ea;
    --cas-theme-vk-color: #587ea3;
    --cas-theme-yahoo-color: #720e9e;
    --cas-theme-google-color: #CC5445;
    --cas-theme-facebook-color: #3B5998;
    --atlassian-theme-primary: #0747a6;
    --mdc-theme-primary: var(--cas-theme-primary, #153e50);
}

.atlassian {
    --mdc-theme-primary: var(--atlassian-theme-primary, #0747a6);
}


/*variables  ------------------------------------------------------------------------------*/
:root {
    --panelInSpacing: 24px;
    --sectionSpacing: 40px;
    --panelOutSpacing: 32px 8px;
    --panelOutSpacingHor: 8px;
    --containerHorSpacing: 32px;
    --containerTopSpacing: 40px;
    --panelBannerSpacing: 24px;
    --headHeight: 72px;
    --headMainMenu: 60px;
    --headElementBackground: rgba(30, 30, 64, 0.75);
    --headHeight: 72px;
    --headMainMenu: 60px;
    --headSubMenuHeight: 0px;
    --headElementBackground: rgba(30, 30, 64, 0.75);
    --widgetHeaderTopSpacing: 32px;



    --primaryColor: #F24F00;
    --darkPrimaryColor:  #BB3D00 ;
    --lightPrimaryColor:  #FA6900 ;
    --darkBlue: #1E1F2E;
}


.minMd {
    --panelInSpacing: 40px;
    --sectionSpacing: 56px;
    --panelOutSpacing: 32px;
    --panelOutSpacingHor: 32px;
    --containerTopSpacing: 56px;
    --widgetHeaderTopSpacing: 40px;
}

.minLg {
    --panelOutSpacing: 56px;
    --panelOutSpacingHor: 56px;
    --containerHorSpacing: 56px;
    --containerTopSpacing: 80px;
    --panelBannerSpacing: 56px
}





/* Main layout  ------------------------------------------------------------------------------*/
html body {
    font-size: 1.6rem;
    margin: 0;
    font-family: RoobertCEZ,-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    background: #28293d;
    line-height: initial;
}

.root {
    background: #28293d;
    position: relative;
    display: flex;
    flex-direction: column;
}
.minLg  .root:before {
    top: 0;
    right: 0;
    width: 100vw;
    height: 100%;
    max-height: 1200px;
    content: "";
    display: block;
    opacity: 0;
    position: absolute;
    animation: showGlow 1400ms cubic-bezier(0.4, 0, 0.2, 1) 500ms forwards;
    background: linear-gradient(144deg, rgba(101, 104, 154, 0.75) 0%, rgba(101, 104, 154, 0) 45.81%);
    transform-origin: top right;
}



@keyframes showGlow {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

#main-content, #content {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    position: relative;
}



.header {
    width: 100%;
    display: flex;
    z-index: 1100;
    box-sizing: border-box;
    flex-shrink: 0;
    flex-direction: column;
    height: var(--headHeight);
    margin: 0;
    padding: 0;
    background: transparent;
    position: sticky;
    top: 0;
    transition: background linear 500ms, min-height cubic-bezier(0.4, 0, 0.2, 1) 400ms;
}

.header.scrolled {
    background: rgba(30, 31, 46, 0.9);
    backdrop-filter: blur(13px);
}
.header .gridContainer {
    padding: 0 1.6rem;
    max-width: 1440px;
}

.mainHeader {
    height: var(--headHeight);
    display: flex;
    align-items: center;
}

.mainHeaderToolbar {
    display: flex;
    align-items: center;
    margin-left: auto;
    min-width: 0;
}
.mainHeaderToolbar .mui-btn  {
    padding-left: 1.6rem!important;
    padding-right: 1.6rem!important;
}


.cas-logo {
    height: 3.2rem;
    margin-left: 1.6rem;
}

.minMd .cas-logo {
    height: 40px;
    margin-left: 0rem;
}


.mainContent {
    width: 100%;
    margin: 0 auto;
    margin-top: 0;
    padding-top: 32px;
}
.mainContentIn {
    display: flex;
    position: relative;
    flex-grow: 1;
    min-height: 50vh;
    flex-direction: column;
    width: 100%;
    margin: 0 auto;
    margin-top: 0;
    max-width: 1440px;
    z-index: 1;
}

.columns {
    display: flex;
    flex-wrap: wrap;

    width: calc(100% + 0.8rem);
    margin: -0.4rem;
}
.columns_col {
    padding: 0.4rem;
    width: 100%;
}

.minLg .columns {
    width: calc(100% + 1.6rem);
    margin: -0.8rem;
}

.minLg .columns_col {
    padding: 0.8rem;
}

.minLg .columns_col-6 {
    flex-grow: 0;
    max-width: 50%;
    flex-basis: 50%;
}



.loginGrid.loginGrid {
    margin: 0;
}
.mainClaim {
    color: #fff;
}
.mainClaim h3 {
    margin-bottom: 0.8rem;
    font-size: 2rem;
    line-height: 2.4rem;
}

.mainClaim p {
    margin-bottom: var(--sectionSpacing);
}


.minMd .mainClaim h3 {
    margin-bottom: 0;
    font-size: 2.4rem;
    line-height: 3.2rem;
}


.minLg .loginGrid.loginGrid {
    margin-top: var(--sectionSpacing);
}

.minLg .mainClaim {
    max-width: 360px;
    margin-top: 14rem;
}

body.minLg .mainClaim h3 {
    font-size: 4.8rem;
    line-height: 5.6rem;
    margin-bottom: 2.4rem;
    font-family: RoobertCEZ;
    font-weight: 600;
    text-transform: uppercase;
}

body.minLg .mainClaim p.large {
    font-family: RoobertCEZ;
    font-weight: 600;
    line-height: 2.4rem;
    letter-spacing: 0.015em;
    text-transform: uppercase;
    font-size: 1.8rem;
    margin: 0;
}


/*grid container ------------------------------------------------------------------------------*/

.gridContainer {
    width: 100%;
    margin: var(--containerTopSpacing) auto 0 auto;
    display: grid;
    padding: 0 var(--containerHorSpacing);
    grid-gap: 1.6rem;
    flex-grow: 1;
    grid-template-columns: repeat( 12, [col] 1fr );
}

.gridContainer .gridContainerItem {
    grid-column:  col 1/ span 12 ;
    min-width: 0;
}


.gridContainer {
    width: 100%;
    margin: var(--containerTopSpacing) auto 0 auto;
    display: grid;
    padding: 0 var(--containerHorSpacing);
    grid-gap: 1.6rem;
    flex-grow: 1;
    grid-template-columns: repeat(12, [col] 1fr);
}
.gridContainer .gridContainerItem {
    grid-column: col 1 / span 12;
    min-width: 0;
}

.gridContainer.noSpacing{
    margin-top: 0;
}

.minMd .gridContainer.form .gridContainerItem {
    grid-column: col 2 / span 10;
}

.minMd .gridContainer.form .panelOut {
    margin-left: 0;
    margin-right: 0;
}

.minMd .gridContainer.form .panelTransparent {
    padding: 0;
}


.minLg .gridContainer.small .gridContainerItem {
    grid-column: col 2 / span 10;
}

.minLg .gridContainer.small .panelOut {
    margin-left: 0;
    margin-right: 0;
}

.minLg .gridContainer.small .panelTransparent {
    padding: 0;
}

.minLg .gridContainer.medium .panelOut {
    margin-left: 0;
    margin-right: 0;
}

.minLg .gridContainer.medium .panelTransparent {
    padding: 0;
}

.minLg .gridContainer.loginGrid .gridContainerItem {
    grid-column: col 1/ span 12;
}

.minLg .gridContainer.loginGrid .panelOut {
    padding: 0;
}

.minLg .gridContainer.loginGrid .panelIn.noVerticalSpacing {
    padding-top: var(--panelInSpacing);
    padding-bottom: var(--panelInSpacing);
}


.minXl .gridContainer.form .gridContainerItem {
    grid-column: col 4 / span 6;
}

.minXl .gridContainer.small .gridContainerItem {
    grid-column: col 3 / span 8;
}

.minXl .gridContainer.medium .gridContainerItem {
    grid-column: col 2 / span 10;
}

.minXl .gridContainer.loginGrid .gridContainerItem {
    grid-column: col 2/ span 10;
}



/*panels ------------------------------------------------------------------------------*/

.panel {
    box-shadow: none;
    margin-bottom: 0;
    position: relative;
    border-radius: 16px;
}

.panel.panelOut {
    padding: var(--panelOutSpacing);
    margin-left: calc(var(--containerHorSpacing)*-1);
    margin-right: calc(var(--containerHorSpacing)*-1);
}
.panel.panelOut.noVerticalSpacing {
    padding-top: 0;
    padding-bottom: 0;
}

.panel.panelIn {
    padding: var(--panelInSpacing);
    margin: 0;
}
.panel.panelIn.noVerticalSpacing {
    padding-top: 0;
    padding-bottom: 0;
}
.panel.panelIn.negativeSpacing {
    margin-left: calc(var(--panelInSpacing)*-1);
    margin-right: calc(var(--panelInSpacing)*-1);
}

.panel .panelIcon {
    position: absolute;
    top: 0.8rem;
    right: 0.8rem;
    color: #737373;
    width: 24px;
    height: 24px;
}

.panel.panelTransparent {
    background: none;
    color: inherit;
}
.panel.panelWhite {
    background: white;
    color: black;
}
.panel.panelDark {
    background: #1E1F2E;
    color: #fff;
}

.panel.panelLight {
    background: #f4f4f4;
    color: rgba(0, 0, 0, 0.87);
}
.panel.panelLight .table > tbody > tr > td {
    background: transparent;
}
.panel.radiusnone {
    border-radius: 0;
}
.panel.radiussmall {
    border-radius: 8px;
}
.panel.radiusmedium {
    border-radius: 16px;
}
.panel.radiuslarge {
    border-radius: 24px;
}



/*mui override*/

body .mui-btn {
    padding: 2.1rem 3.2rem 1.9rem 3.2rem;
    font-size: 1.6rem;
    box-sizing: border-box;
    text-align: center;
    transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    font-family: RoobertCEZ;
    font-weight: 600;
    line-height: 1.6rem;
    border-radius: 0.4rem;
    letter-spacing: 0.015em;
    text-transform: uppercase;
    outline: 0;
    height: auto;
}

body .mui-btn--raised, .mui-btn--raised:focus {
    box-shadow: 0px 16px 32px rgba(0, 0, 0, 0.08), 0px 8px 16px rgba(0, 0, 0, 0.08), 0px 4px 8px rgba(0, 0, 0, 0.08), 0px 2px 4px rgba(0, 0, 0, 0.08), 0px 1px 2px rgba(0, 0, 0, 0.08);
}

body .mui-btn--raised:hover, body .mui-btn--raised:active, body .mui-btn--raised:active:hover {
    z-index: 1;
    box-shadow: 0px 16px 32px rgba(0, 0, 0, 0.12), 0px 8px 16px rgba(0, 0, 0, 0.12), 0px 4px 8px rgba(0, 0, 0, 0.08), 0px 2px 4px rgba(0, 0, 0, 0.08), 0px 1px 2px rgba(0, 0, 0, 0.08);
}

body .mui-btn--primary.mui-btn--raised {
    background: linear-gradient(125deg, var(--lightPrimaryColor) 0%, var(--primaryColor) 100%);
    box-shadow: 0px 16px 32px rgba(242, 79, 0, 0.12), 0px 8px 16px rgba(242, 79, 0, 0.12), 0px 4px 8px rgba(242, 79, 0, 0.12), 0px 2px 4px rgba(242, 79, 0, 0.12), 0px 1px 2px rgba(242, 79, 0, 0.12);
    background-color: var(--primaryColor);
}


body .mui-btn--primary.mui-btn--raised:hover {
    background: linear-gradient(0deg, rgba(187, 61, 0, 0.25), rgba(187, 61, 0, 0.25)), linear-gradient(125deg, var(--lightPrimaryColor) 0%, var(--primaryColor) 100%);
    box-shadow: 0px 32px 64px rgba(242, 79, 0, 0.12), 0px 16px 32px rgba(242, 79, 0, 0.12), 0px 8px 16px rgba(242, 79, 0, 0.12), 0px 4px 8px rgba(242, 79, 0, 0.12), 0px 2px 4px rgba(242, 79, 0, 0.12), 0px 1px 2px rgba(242, 79, 0, 0.12);
    background-color: var(--primaryColor);
    outline: 0;
}

body .mui-btn--primary.mui-btn--raised:active {
    background: linear-gradient( 0deg, rgba(187, 61, 0, 0.5), rgba(187, 61, 0, 0.5)), linear-gradient(125deg, var(--lightPrimaryColor) 0%, var(--primaryColor) 100%);
    box-shadow: 0px 4px 8px rgba(242, 79, 0, 0.24), 0px 2px 4px rgba(242, 79, 0, 0.24), 0px 1px 2px rgba(242, 79, 0, 0.24);
}

body .mui-btn--primary.mui-btn--raised:focus {
    background: linear-gradient( 0deg, rgba(187, 61, 0, 0.5), rgba(187, 61, 0, 0.5)), linear-gradient(125deg, var(--lightPrimaryColor) 0%, var(--primaryColor) 100%);
    box-shadow: 0px 4px 8px rgba(242, 79, 0, 0.24), 0px 2px 4px rgba(242, 79, 0, 0.24), 0px 1px 2px rgba(242, 79, 0, 0.24);
}

/*flat*/

body .mui-btn--primary.mui-btn--flat {
    color: var(--primaryColor);
}
body .mui-btn--primary.mui-btn--flat:active, body .mui-btn--primary.mui-btn--flat:focus, body .mui-btn--primary.mui-btn--flat:hover{
    color: var(--primaryColor);
    background-color: rgba(242, 79, 0, 0.12);
}

body .mui-btn--primary.mui-btn--flat .mui-ripple {
    background-color: var(--primaryColor);
}


/*outlined*/

body .mui-btn--primary.mui-btn--outlined {
    padding: 2rem 3.1rem 1.8rem 3.1rem;
    color: #fff;
    border: 0.1rem solid var(--primaryColor);
    background: rgba(0, 0, 0, 0);
}
.mui-btn--primary.mui-btn--outlined.primaryColor {
    color: var(--primaryColor);
}
body .mui-btn--primary.mui-btn--outlined:active, body .mui-btn--primary.mui-btn--outlined:focus, body .mui-btn--primary.mui-btn--outlined:hover{
    background-color: rgba(242, 79, 0, 0.12);
    box-shadow: none;
}

body .mui-btn.mui-btn--outlined.mui-btn--small {
    padding: 1.1rem 2.3rem;
    font-size: 1.4rem;
}

body .mui-ripple.mui--is-animating {
    transition: transform 0.6s cubic-bezier(0,0,.2,1),width 0.6s cubic-bezier(0,0,.2,1),height 0.6s cubic-bezier(0,0,.2,1),opacity 0.6s cubic-bezier(0,0,.2,1),-webkit-transform 0.6s cubic-bezier(0,0,.2,1);}

body .mui-ripple.mui--is-visible {
    opacity: 0.24;
}



/*tabmenu*/

.tab-menu {
    margin: 0;
    padding: 0.4rem;
    background: #28293d;
    border-radius: 0.8rem;
    display: flex;
    min-height: 48px;
    overflow-x: auto;
}
@media (hover: none) and (pointer: coarse) {
    .tab-menu {
        scrollbar-width: none;
    }
    .tab-menu::-webkit-scrollbar {
        display: none;
    }
}

.tab-menu li {
    background: transparent;
    border-radius: 0.4rem;
    display: flex;
    vertical-align: middle;
    font-family: RoobertCEZ, 'Arial';
    font-style: normal;
    font-weight: 600;
    font-size: 14px;
    line-height: 16px;
    text-transform: uppercase;
    flex-grow: 1;
    letter-spacing: 0.015em;
}
.tab-menu li h2 {
    flex-grow: 1;
    color: #fff;
    border-radius: 0.4rem;
    padding: 0.4rem 2.4rem;
    display: inline-flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    text-decoration: none;
    cursor: pointer;
    font-weight: 600;
    font-size: 14px;
    line-height: 16px;
}
.tab-menu li.selected  h2 {
    background: #fff;
    border: 1px solid #FFFFFF;
    color: #2C3464;
}


.loginTab {
    margin-left: -0.8rem;
    margin-right: -0.8rem;
    margin-bottom: 3.2rem;
}



/*form --------------------------------------*/

form {
    margin: 0;
}

body .mui-textfield {
    display: flex;
    padding-top: 16px;
    margin-bottom: 32px;
    position: relative;
}

body .mui-textfieldAddon  > input{

    padding-right: 40px;
}
body .mui-textfieldAddon .addon {
    position: absolute;
    right: 0;
}

.mui-textfield.mui-textfield--float-label > label {
    color: #737373;
}





#eyeSlash{
    display: none;
}

#eye{
    display: flex;
    cursor: pointer;
}
.cursor-pointer {
    cursor: pointer;
}
#eye, #eyeSlash {
    background: transparent;
    border: none;
    outline: none;
}


body .mui-textfield--float-label > input:not(:focus).mui--is-not-empty ~ label, body .mui-textfield--float-label > input:not(:focus):not(:empty):not(.mui--is-empty):not(.mui--is-not-empty) ~ label, body .mui-textfield--float-label > input:not(:focus)[value]:not([value=""]):not(.mui--is-empty):not(.mui--is-not-empty) ~ label, body .mui-textfield--float-label > textarea:not(:focus).mui--is-not-empty ~ label, body .mui-textfield--float-label > textarea:not(:focus):not(:empty):not(.mui--is-empty):not(.mui--is-not-empty) ~ label, body .mui-textfield--float-label > textarea:not(:focus)[value]:not([value=""]):not(.mui--is-empty):not(.mui--is-not-empty) ~ label {
    font-size: 13px;
    color: #737373;
}

body .mui-textfield--float-label>input:focus~label, body .mui-textfield--float-label>textarea:focus~label {
    font-size: 13px;

}



#loginErrorsPanel {
    position: fixed;
    max-width: 572px;
    padding: 0.8rem 1.6rem;
    width: 100%;
    left: 50%;
    transform: translateX(-50%);
    top: calc(var(--headHeight) + var(--headMainMenu) + 1.6rem);
    transition: top cubic-bezier(0.4, 0, 0.2, 1) 300ms;
    z-index: 500;
}

.alert-info {
    background: #fff;
    color: #333;
    font-size: 14px;
    margin-top: 0;
    margin-bottom: 0;
    box-shadow: 0px 32px 64px rgba(0, 0, 0, 0.08), 0px 16px 32px rgba(0, 0, 0, 0.08), 0px 8px 16px rgba(0, 0, 0, 0.08), 0px 4px 8px rgba(0, 0, 0, 0.08), 0px 2px 4px rgba(0, 0, 0, 0.08), 0px 1px 2px rgba(0, 0, 0, 0.08);
    border-radius: 8px;
    padding: 1.6rem 1.6rem 1.6rem 2.4rem;
    position: relative;
    text-align: left;
    max-width: 560px;
    animation: zoom cubic-bezier(0.4, 0, 0.2, 1) 240ms;
    display: flex;
    align-items: center;
}

.alert-danger {
    background: #E50000;
    color: #fff;
    font-size: 14px;
    margin-top: 0;
    margin-bottom: 0;
    box-shadow: 0px 32px 64px rgba(0, 0, 0, 0.08), 0px 16px 32px rgba(0, 0, 0, 0.08), 0px 8px 16px rgba(0, 0, 0, 0.08), 0px 4px 8px rgba(0, 0, 0, 0.08), 0px 2px 4px rgba(0, 0, 0, 0.08), 0px 1px 2px rgba(0, 0, 0, 0.08);
    border-radius: 8px;
    padding: 1.6rem 1.6rem 1.6rem 2.4rem;
    position: relative;
    text-align: left;
    max-width: 560px;
    animation: zoom cubic-bezier(0.4, 0, 0.2, 1) 300ms;
    display: flex;
    align-items: center;
}
.alert-danger p {
    margin: 0;
}
.alert-danger .alertList {
    margin-right: 1.6rem;
    flex-grow: 1;
}

@-webkit-keyframes zoom {
    0% {
        opacity: 0;
        transform: scale(0.8);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}
@keyframes zoom {
    0% {
        opacity: 0;
        transform: scale(0.8);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}

.closeMessage {
    flex-shrink: 0;
    box-sizing: border-box;
    transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;

    font-weight: 600;
    line-height: 1.6rem;
    border-radius: 0.4rem;
    letter-spacing: 0.015em;
    color: #fff;
    width: 4rem;
    height: 4rem;
    padding: 0rem;
    border: 0.1rem solid #fff;
    background: rgba(0, 0, 0, 0);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: none;
    position: relative;

}

.closeMessage svg {
    width: 24px;
    height: 24px;
    vertical-align: middle;
}

.formError {
    position: absolute;
    top: 100%;
    color: #E50000;
    font-size: 1.4rem;
    margin: 0;
    margin-top: 0.7rem;
    text-align: left;
    font-weight: 400;
    line-height: 1.6rem;
    letter-spacing: 0;
    text-transform: none;
    display: none;
}

body .mui-textfield>input:focus, body  .mui-textfield>textarea:focus {
    border-color: var(--cas-theme-primary);
}



body .mui-textfield>input:invalid:focus:required.mui--is-empty.mui--is-touched.mui--is-dirty,
body .mui-textfield>textarea:invalid:focus:required.mui--is-empty.mui--is-touched.mui--is-dirty,
body .formSubmitted .mui-textfield>input:invalid:focus:required.mui--is-empty,
body .formSubmitted .mui-textfield>textarea:invalid:focus:required.mui--is-empty {
    border-color: #E50000;
}

body .mui-textfield>input:focus~label, body .mui-textfield>textarea:focus~label {
    color: var(--cas-theme-primary);
}

.formSubmitted .mui-textfield>input:invalid:required.mui--is-empty ~ .formError,
.formSubmitted .mui-textfield>input.mui--is-invalid:required.mui--is-empty  ~ .formError,
.formSubmitted .mui-textfield>textarea:invalid:required.mui--is-empty ~ .formError,
.formSubmitted .mui-textfield>textarea.mui--is-invalid:required.mui--is-empty  ~ .formError {
    display: block;
}
.formSubmitted .mui-textfield>input:invalid:required.mui--is-empty ~ label,
.formSubmitted .mui-textfield>input.mui--is-invalid:required.mui--is-empty  ~ label,
.formSubmitted .mui-textfield>textarea:invalid:required.mui--is-empty ~ label,
.formSubmitted .mui-textfield>textarea.mui--is-invalid:required.mui--is-empty  ~ label {
    color: #E50000;
}


.formSubmitted .mui-textfield > input:invalid:not(:focus):not(:required),
.formSubmitted .mui-textfield > input:invalid:not(:focus):required.mui--is-empty,
.formSubmitted .mui-textfield > input:invalid:not(:focus):required.mui--is-not-empty,
.formSubmitted .mui-textfield > input:invalid:not(:focus):required:not(:empty):not(.mui--is-empty):not(.mui--is-not-empty),
.formSubmitted .mui-textfield > input:invalid:not(:focus):required[value]:not([value=""]):not(.mui--is-empty):not(.mui--is-not-empty),
.formSubmitted .mui-textfield > input:not(:focus).mui--is-invalid:not(:required),
.formSubmitted .mui-textfield > input:not(:focus).mui--is-invalid:required.mui--is-empty,
.formSubmitted .mui-textfield > input:not(:focus).mui--is-invalid:required.mui--is-not-empty,
.formSubmitted .mui-textfield > input:not(:focus).mui--is-invalid:required:not(:empty):not(.mui--is-empty):not(.mui--is-not-empty),
.formSubmitted .mui-textfield > input:not(:focus).mui--is-invalid:required[value]:not([value=""]):not(.mui--is-empty):not(.mui--is-not-empty),
.formSubmitted .mui-textfield > textarea:invalid:not(:focus):not(:required),
.formSubmitted .mui-textfield > textarea:invalid:not(:focus):required.mui--is-empty,
.formSubmitted .mui-textfield > textarea:invalid:not(:focus):required.mui--is-not-empty,
.formSubmitted .mui-textfield > textarea:invalid:not(:focus):required:not(:empty):not(.mui--is-empty):not(.mui--is-not-empty),
.formSubmitted .mui-textfield > textarea:invalid:not(:focus):required[value]:not([value=""]):not(.mui--is-empty):not(.mui--is-not-empty),
.formSubmitted .mui-textfield > textarea:not(:focus).mui--is-invalid:not(:required),
.formSubmitted .mui-textfield > textarea:not(:focus).mui--is-invalid:required.mui--is-empty,
.formSubmitted .mui-textfield > textarea:not(:focus).mui--is-invalid:required.mui--is-not-empty,
.formSubmitted .mui-textfield > textarea:not(:focus).mui--is-invalid:required:not(:empty):not(.mui--is-empty):not(.mui--is-not-empty),
.formSubmitted .mui-textfield > textarea:not(:focus).mui--is-invalid:required[value]:not([value=""]):not(.mui--is-empty):not(.mui--is-not-empty) {
    border-color: #F44336;
    border-width: 2px
}

.formSubmitted .mui-textfield > input:invalid:not(:focus):not(:required),
.formSubmitted .mui-textfield > input:invalid:not(:focus):required.mui--is-empty,
.formSubmitted .mui-textfield > input:invalid:not(:focus):required.mui--is-not-empty,
.formSubmitted .mui-textfield > input:invalid:not(:focus):required:not(:empty):not(.mui--is-empty):not(.mui--is-not-empty),
.formSubmitted .mui-textfield > input:invalid:not(:focus):required[value]:not([value=""]):not(.mui--is-empty):not(.mui--is-not-empty),
.formSubmitted .mui-textfield > input:not(:focus).mui--is-invalid:not(:required),
.formSubmitted .mui-textfield > input:not(:focus).mui--is-invalid:required.mui--is-empty,
.formSubmitted .mui-textfield > input:not(:focus).mui--is-invalid:required.mui--is-not-empty,
.formSubmitted .mui-textfield > input:not(:focus).mui--is-invalid:required:not(:empty):not(.mui--is-empty):not(.mui--is-not-empty),
.formSubmitted .mui-textfield > input:not(:focus).mui--is-invalid:required[value]:not([value=""]):not(.mui--is-empty):not(.mui--is-not-empty) {
    height: calc(32px + 1px);
    margin-bottom: -1px
}


.mui-textfield>input:invalid:required.mui--is-empty.mui--is-touched.mui--is-dirty ~ .formError,
.mui-textfield>input.mui--is-invalid:required.mui--is-empty.mui--is-touched.mui--is-dirty  ~ .formError,
.mui-textfield>textarea:invalid:required.mui--is-empty.mui--is-touched.mui--is-dirty ~ .formError,
.mui-textfield>textarea.mui--is-invalid:required.mui--is-empty.mui--is-touched.mui--is-dirty  ~ .formError {
    display: block;
}

.mui-textfield>input:invalid:required.mui--is-empty.mui--is-touched.mui--is-dirty ~ label,
.mui-textfield>input.mui--is-invalid:required.mui--is-empty.mui--is-touched.mui--is-dirty  ~ label,
.mui-textfield>textarea:invalid:required.mui--is-empty.mui--is-touched.mui--is-dirty ~ label,
.mui-textfield>textarea.mui--is-invalid:required.mui--is-empty.mui--is-touched.mui--is-dirty  ~ label {
    color: #E50000;
}

.formGroup {
    min-height: 8rem;
}

/* Hide the default checkbox */
input[type=checkbox] {
    visibility: hidden;
}

.styledCheckbox {
    position: relative;
    min-height: 28px;
    display: flex;
    align-items: center;
    padding-left: 40px;
    cursor: pointer;
}

/* Creating a custom checkbox
    based on demand */
.geekmark {
    position: absolute;
    top: 0;
    left: 0;
    background-color: white;
    color: #fff;
    width: 2.4rem;
    border: 0;
    height: 2.4rem;
    margin: 0.2rem;
    padding: 0;
    border-radius: 0.4rem;
    box-shadow: 0px 0px 0px 1px #959595;
    cursor: pointer;
    transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
}

.styledCheckbox input:hover~.geekmark {
    box-shadow: 0px 0px 0px 2px var(--lightPrimaryColor);
    background-color: rgb(254 248 245);
}


.styledCheckbox input:checked~.geekmark {
    background-color: var(--lightPrimaryColor);
    box-shadow: 0px 0px 0px 2px var(--lightPrimaryColor);
}
.styledCheckbox input:checked:hover~.geekmark {
    background-color: var(--primaryColor);
    box-shadow: 0px 0px 0px 2px var(--primaryColor);
}



.geekmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Display checkmark when checked */
.styledCheckbox input:checked~.geekmark:after {
    display: block;
}

/* Styling the checkmark using webkit */
/* Rotated the rectangle by 45 degree and
    showing only two border to make it look
    like a tickmark */
.styledCheckbox .geekmark:after {
    left: 10px;
    top: 6px;
    color: white;
    bottom: 6px;
    width: 5px;
    height: 10px;
    border: 1px solid;
    border-width: 0 1px 1px 0;
    transform: rotate(45deg);
}


/* actionFooter */


.actionFooter {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex-grow: 1;
    margin-top: var(--widgetHeaderTopSpacing);
    align-items: center;
    margin-bottom: 0.8rem;
}
.actionFooter > * {
    text-align: center;
    width: 100%;
    max-width: 380px;
    padding: 0;
    justify-content: center;
}
.actionFooter > *:last-child {
    margin-bottom: 0;
}

.actionFooter .mui-btn+.mui-btn {
    margin: 0;
}
.actionFooter button,
.actionFooter .mui-btn {
    width: 100%;
    flex-grow: 1;
    white-space: normal;
}
.actionFooter a {
    letter-spacing: 0.015em;
    text-transform: uppercase;
    text-align: center;
    flex-grow: 1;
    width: 100%;
    white-space: normal;
}
.actionFooter .mui-btn--flat:last-child {
    margin-bottom: -8px;
}




body.minMd .actionFooter {
    margin: 0;
    margin-top: var(--widgetHeaderTopSpacing);
    flex-direction: row;
    justify-content: center;
}
body.minMd .actionFooter > * {
    padding-left: 16px;
    padding-right: 16px;
    margin: 0;
}
body.minMd .actionFooter .mui-btn + .mui-btn {
    margin-left: 0.8rem;
}
body.minMd .actionFooter .mui-btn:first-child {
    order: initial;
}
body.minMd .actionFooter .mui-btn:first-child:last-child {
    margin-bottom: 0;
}


body.minMd .actionFooter .mui-btn--flat:last-child {
    margin-bottom: 0;
}

.minMd .lostPassBtn.lostPassBtn {
    min-width: 220px;
}


/* typography --------------------------------------------------*/

body h1 {
    margin-top: 0;
    font-family: RoobertCEZ, 'Arial';
    font-size: 4.8rem;
    font-weight: 600;
    line-height: 5.6rem;
    text-transform: uppercase;
    margin: 0;
    letter-spacing: 0.02em;
}
body h1.gutterBottom {
    margin-bottom: 2.4rem;
}
body h2 {
    font-family: RoobertCEZ, 'Arial';
    font-size: 3.2rem;
    font-weight: 600;
    line-height: 4rem;
    text-transform: uppercase;
    margin: 0;
    letter-spacing: 0.02em;
}
body h2.gutterBottom  {
    margin-bottom: 2.4rem;
}
body h3 {
    font-size: 2.4rem;
    font-family: RoobertCEZ, 'Arial';
    font-weight: 600;
    line-height: 3.2rem;
    text-transform: uppercase;
    margin: 0;
    letter-spacing: 0.02em;
}
body h3.gutterBottom {
    margin-bottom: 2.4rem;
}

body h4  {
    font-size: 1.8rem;
    font-family: RoobertCEZ, 'Arial';
    font-weight: 600;
    line-height: 2.4rem;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    margin: 0;
}
body h4.gutterBottom  {
    margin-bottom: 1.6rem;
}

body h5 {
    font-size: 1.6rem;
    font-family: RoobertCEZ, 'Arial';
    font-weight: 600;
    line-height: 2.2rem;
    text-transform: uppercase;
    margin: 0;
    letter-spacing: 0.02em;
}
body h5.gutterBottom {
    margin-bottom: 1.6rem;
}

body h6 {
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 2.4rem;
    margin: 0;
    letter-spacing: 0.01em;
}
body h6.gutterBottom  {
    margin-bottom: 1.6rem;
}

body caption,
body .newCaption {
    font-size: 1.2rem;
    font-family: RoobertCEZ, 'Arial';
    font-weight: 600;
    line-height: 1.6rem;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

body p {
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 2rem;
}
body p.gutterBottom {
    margin-bottom: 2.4rem;
}
body p.small {
    font-size: 1.2rem;
    line-height: 1.6rem;
}
body p.small.gutterBottom {
    margin-bottom: 1.6rem;
}
body p.large {
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 2.4rem;
}
body p.large.gutterBottom {
    margin-bottom: 2.4rem;
}


@media (max-width: 768px) {
    body h1 {
        font-size: 3.2rem;
        line-height: 4rem;
    }
    body h2  {
        font-size: 2.4rem;
        line-height: 3.2rem;
    }
    body h3 {
        font-size: 2rem;
        line-height: 2.4rem;
    }
    body h4  {
        font-size: 1.6rem;
        line-height: 2.4rem;
    }
    body h5  {
        font-size: 1.4rem;
        line-height: 2rem;
    }
    body h6 {
        font-size: 1.6rem;
        line-height: 2.4rem;
    }
}



/*helpers --------------------------------------------------*/
.noWrap {
    white-space: nowrap!important;
}

/*spacing --------------------------------------------------*/

.mt-0 {
    margin-top: 0px!important;
}
.mt-1 {
    margin-top: 8px!important;
}
.mt-2 {
    margin-top: 16px!important;
}
.mt-3 {
    margin-top: 24px!important;
}
.mt-4 {
    margin-top: 32px!important;
}
.mt-5 {
    margin-top: 40px!important;
}


.mb-0 {
    margin-bottom: 0px!important;
}
.mb-1 {
    margin-bottom: 8px!important;
}
.mb-2 {
    margin-bottom: 16px!important;
}
.mb-3 {
    margin-bottom: 24px!important;
}
.mb-4 {
    margin-bottom: 32px!important;
}
.mb-5 {
    margin-bottom: 40px!important;
}


.mt-small  {
    margin-top: 1.6rem;
}

.mt-medium  {
    margin-top: 2.4rem;
}

.mt-large  {
    margin-top: 3.2rem;
}


/*authlist*/

.authList {
    display: flex;
    flex-direction: column;
    list-style: none;
    margin: 0;
    padding: 0;
}
.authList li {
    margin-bottom: 0.8rem;
    display: flex;

}
.authList li  .mui-btn {
    display: flex;
    align-items: center;
    margin: 0;
    flex-grow: 1;
    padding: 1.6rem 2.4rem;
    font-family: RoobertCEZ;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    text-transform: none;
    color: black;
    border-radius: 8px;
}

.authList li  .mui-btn .icon {
    width: 24px;
    height: 24px;
    margin-right: 2.4rem;
    flex-shrink: 0;
}

.orBlock {
    font-family: RoobertCEZ;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    text-align: center;
    color: #737373;
    text-transform: uppercase;
    margin-top: 1.6rem;
    margin-bottom: 0.8rem;
}

.appHeader {
    color: #fff;
    min-height: 60px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.iconList {
    margin: 0;
    padding: 0;
}

.iconList.iconList--Dash li:before {
    content: '';
    display: flex;
    width: 8px;
    height: 1px;
    background: var(--primaryColor);
    margin-right: 8px;
    flex-shrink: 0;
    margin-top: 10px;
}

.iconList li {
    padding: 2px 0;
    display: flex;
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 2rem;
}


.footer {
    width: 100%;
    margin: 0 auto;
    margin-top: 0;
    max-width: 1440px;
}
.footer .footerInfoIcon {
    width: 48px;
    height: 48px;
    margin-top: -0.8rem;
    margin-left: 0.8rem;
    margin-right: -0.8rem;
    color: #959595;
}
.footer p {
    margin-bottom: 0;
}
.footer ul {
    padding: 0;
    display: flex;
    margin-top: 3.2rem;
    align-items: center;
    margin-bottom: 4rem;
    flex-direction: column;
    list-style: none;
}
.footer ul li {
    padding: 0 0 16px 0;
}
.footer ul li a {
    color: #B8B3AD;
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 2rem;
    cursor: pointer;
}

.footer .panelGrid {
    display: flex;
    flex-direction: column;
    margin: 0 -8px;
}
.footer .panelGrid > .panel {
    margin: 0 8px;
    margin-bottom: 8px;
}

.minLg .footer .panelGrid {
 flex-direction: row;
}


.minSm .footer .footerInfoIcon {
    margin-top: -1.6rem;
    margin-right: -1.6rem;
}

.minMd .footer .footerInfoIcon {
    margin-top: -2.4rem;
    margin-right: -2.4rem;
}

.minLg .footer ul {
    flex-direction: row;
}

.minLg .footer ul li {
    margin-left: 40px;
}

.minLg .footer ul li:first-child {
    margin-left: 0;
}

.minLg .footer ul li:nth-child(3) {
    margin-left: auto;
}

#content.login-error-wrapper {
    justify-content: center;
    align-items: center;
    display: grid;
}
.login-error-wrapper .card {
    background: #fff;
    border-radius: 24px;
    padding: 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.login-error-wrapper .card .card-header {
    display: flex;
    align-items: center;
    gap: 16px;
}
.login-error-wrapper h1 {
    font-size: 20px;
    font-weight: 600;
    line-height: 1.1;
}
.login-error-wrapper .card-content {
    margin-top: 16px;
    display: flex;
}
.login-error-wrapper .card-footer {
    display: flex;
    justify-content: center;
    margin-top: 16px;
}
.login-error-wrapper .card-footer button {
    padding-inline: 62px;
}
@media screen and (min-width: 640px) {
    .login-error-wrapper .card {
        width: 656px;
        padding: 56px;
    }
    .login-error-wrapper .card .card-header {
        gap: 24px;
    }
    .login-error-wrapper h1 {
        font-size: 24px;
        font-weight: 600;
        line-height: 1.1;
    }
    .login-error-wrapper .card-content {
        margin-top: 24px;
    }
    .login-error-wrapper .card-footer {
        margin-top: 24px;
    }
}
