/*
	xs < 576px	
	sm ≥ 576px	
	md ≥ 768px	
	lg ≥ 992px
	xl ≥ 1300px
	xxl ≥ 1550px 
*/


:root { /* definice barev pro AEC */
		--extranet_primary_color: #3558a2;					/* ifp-blue */
    --extranet_primary_color_lighten: #4670C8;  /* lighter = hover v.*/
    --extranet_primary_color_darken: #282828;   /**/
    
    --ifp-blue-lt: #6AB1ED; /* nahradit #0088c5? */
 
}

.arc-en-ciel .dashboard, .kiosque-aec .dashboard,
.arc-en-ciel .montserrat, .kiosque-aec .montserrat,
.arc-en-ciel,.kiosque-aec {
  font-family: Marianne, sans-serif !important;
}

.arc-en-ciel body:not(.custom-template) h1,
.kiosque-aec body:not(.custom-template) h1,
.arc-en-ciel h2:not(.custom-template h2),
.kiosque-aec h2:not(.custom-template h2),
.arc-en-ciel h3:not(.custom-template h3),
.kiosque-aec h3:not(.custom-template h3),
.arc-en-ciel .classes-viewer,.kiosque-aec .classes-viewer,
.arc-en-ciel .classes-viewer .filter-box .classes-view-box h4,
.kiosque-aec .classes-viewer .filter-box .classes-view-box h4,
kiosque-aec .corporate-dashboard,
.arc-en-ciel .montserrat,.kiosque-aec .montserrat,
.arc-en-ciel body:not(.custom-template) .language-chooser > a,
.kiosque-aec body:not(.custom-template) .language-chooser > a, 
.arc-en-ciel .font-family-raleway,.kiosque-aec .font-family-raleway,
.arc-en-ciel .font-family-microsoft-sans-serif,.kiosque-aec .font-family-microsoft-sans-serif,
.widget-title
,body section.content-aec .widget {font-family: Marianne, sans-serif !important;}

.arc-en-ciel input,
.kiosque-aec input,
.arc-en-ciel button,
.kiosque-aec button,
.arc-en-ciel select,
.kiosque-aec select,
.arc-en-ciel textarea,
.kiosque-aec textarea,
.arc-en-ciel label,
.kiosque-aec label {font-family: Marianne, sans-serif !important;}  


.kiosque-aec body :not(i):not(.la):not(:before),
.kiosque-aec li :not(i):not(.la):not(:before),
.content-aec :not(i):not(.la):not(:before),
.arc-en-ciel .dashboard,
.kiosque-aec .dashboard { font-family: Marianne !important; font-weight: 400;}

.kiosque-aec li {font-weight: 300;}
.content-aec .container .container {padding: 0!important; margin: 0 auto !important;}

section.popover__container {box-shadow: 0px 4px 4px 0px #0000001A;}


.arc-en-ciel .container, .kiosque-aec .container {
    width: 100%; 
}


@media (min-width: 768px) {
    .arc-en-ciel .container, .kiosque-aec .container {
        width: 100%;
    }
}

@media (min-width: 992px) {
    .arc-en-ciel .container, .kiosque-aec .container {
        width: 100%;
    }
}

@media (min-width: 1200px) {
    .arc-en-ciel .container, .kiosque-aec .container {
        width: 100%; 
    }
}

.arc-en-ciel .button, .arc-en-ciel .button-list-primary .button-primary, .arc-en-ciel .button-list-primary a, .arc-en-ciel .button-list-primary button, .arc-en-ciel .button-primary, .arc-en-ciel .button-primary-container .button-primary, .arc-en-ciel .button-primary-container a, .arc-en-ciel .button-primary-container button, .kiosque-aec .button, .kiosque-aec .button-list-primary .button-primary, .kiosque-aec .button-list-primary a, .kiosque-aec .button-list-primary button, .kiosque-aec .button-primary, .kiosque-aec .button-primary-container .button-primary, .kiosque-aec .button-primary-container a, .kiosque-aec .button-primary-container button
	{border-radius: 2px; border-width: 2px; text-transform: none !important; font-size: 18px !important; font-weight: bold; line-height: 24px !important; padding: 10px 20px 10px !important; transition: 0.25s !important; width: auto!important;}

.arc-en-ciel .button--filled:hover:not(.button-primary--no-hover-bg), .arc-en-ciel .button-primary--filled:hover:not(.button-primary--no-hover-bg), .kiosque-aec .button--filled:hover:not(.button-primary--no-hover-bg), .kiosque-aec .button-primary--filled:hover:not(.button-primary--no-hover-bg) {
    background-color: var(--extranet_primary_color) !important;
    border-color: var(--extranet_primary_color_lighten) !important;
}	
.arc-en-ciel .button-list-primary .button-primary:hover, .arc-en-ciel .button-list-primary a:hover, .arc-en-ciel .button-list-primary button:hover, .arc-en-ciel .button-primary-container .button-primary:hover, .arc-en-ciel .button-primary-container a:hover, .arc-en-ciel .button-primary-container button:hover, .arc-en-ciel .button-primary:hover:not(.button-primary--no-hover-bg), .arc-en-ciel .button:hover:not(.button-primary--no-hover-bg), .kiosque-aec .button-list-primary .button-primary:hover, .kiosque-aec .button-list-primary a:hover, .kiosque-aec .button-list-primary button:hover, .kiosque-aec .button-primary-container .button-primary:hover, .kiosque-aec .button-primary-container a:hover, .kiosque-aec .button-primary-container button:hover, .kiosque-aec .button-primary:hover:not(.button-primary--no-hover-bg), .kiosque-aec .button:hover:not(.button-primary--no-hover-bg) 
	{box-shadow: inset 350px 0 0 0 var(--extranet_primary_color_lighten); border-color: var(--extranet_primary_color_lighten); }

.arc-en-ciel button.w-100, .kiosque-aec button.w-100 {width: auto !important;}	

/*
.arc-en-ciel .form-control,
.kiosque-aec .form-control {width: 300px !important;}

.ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input {max-width: 300px !important;}
*/

#student-login-matricule,
#student-login-password {max-width: 500px;}

student-login-form form {max-width: 500px; xmargin: auto !important;}

a.button-primary:first-letter {text-transform: uppercase;}

side-bar-filter {overflow-y: visible !important;}


/* fake loader + error */
.arc-en-ciel .loading:before, .kiosque-aec .loading:before {
    content: url(images-5/if-ellipsis-loader.svg);
}
.arc-en-ciel .loading:before, .kiosque-aec .loading:before {
    display: inline-block;
    font: normal normal normal 14px / 1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    width: 1.28571429em;
    text-align: center;
    width: 100%;
    color: var(--extranet_primary_color);
    margin-top: 10px;
}

.arc-en-ciel #register-now {text-decoration: underline; cursor: pointer;}

/* err */
.arc-en-ciel .ifp-msg, .kiosque-aec .ifp-msg {font-size: 18px; color: var(--ifp-blue); min-height: 43px; margin: 13px auto 0; width: 60%; xmin-width: 250px;}  
*/