/*#main-content {
	width: auto
}*/
	#loginProviders{
		max-width:100%;
	}

@media only screen and (min-width: 800px) {
        #content {
                animation: fadein 0.9s;
        }
	#loginProviders{
		max-width:30%;
	}
/*	#loginProviders{
		display: flex;
		align-items: center;
		max-width: 350px;
	}*/
}
#content {
        opacity: 0.92;
}

#serviceui {
	display:none
}
@keyframes fadein {
  from {
    opacity: 0; }

  to {
    opacity: 0.92; }
}


body {
        background: url(/cas/images/fond-c290e86deca3ffb50edcf86971996595.jpg);
/*        backdrop-filter: blur(8px);*/
        background-size:cover;
/*        display: flex;*/
/*        align-items: center;*/
}
body, .mdc-typography {
	font-family: "Open Sans", Arial, sans-serif;
}
.mdc-card {
        backdrop-filter: blur(2px);
        background-color: none;
	/*max-width: 530px;*/
}

/*
.mdc-drawer-app-content {
        flex: initial;
        padding-top:0;
}*/
#formFranceConnect:before {
	content:          "FranceConnect est la solution proposée par l’État pour sécuriser et simplifier la connexion à vos services en ligne";
	display:          block;
	max-width:        400px;
	text-align:       center;
	margin-bottom:    12px;
	margin-top:       15px;
	border-top-style: inset;
	border-top-width: 1px;
	padding-top:      19px;
}
#formFranceConnect a {
	margin-top:  12px;
	font-weight: 400;
	color:       #000091;
	text-align:  center;
	display:     block;
}

button#FranceConnect {
	background: none;
	transition: none;
        background-color: transparent;
        box-shadow: none !important;
        height: auto
}
button#FranceConnect:hover {
	transform: none;
}
button#FranceConnect span{
    display: none
}
button#FranceConnect:before {
        content:url(/cas/images/fc/01-Principal/svg/franceconnect-btn-principal-92142f0566ac38a8f2fca3b7fdae1bec.svg) ;
        position:static;
        display:block;
}
button#FranceConnect:hover::before {
	content:url(/cas/images/fc/01-Principal/svg/franceconnect-btn-principal-hover-58153abbd396deb8d966f54308967d61.svg) ;
}

/*
#loginForm{
    max-width: 640px;
}*/
#loginForm:before {
        content:url(/cas/images/logo-insa-bab367f2354c4513d87b4d134886cef7.jpg) ;
        position:static;
        display:block;
        margin-bottom:16px;
        text-align:center;
}
/*
.login-section {
    padding: 2rem 2.5rem !important;
}*/

.hr-text {
  line-height: 1em;
  position: relative;
  outline: 0;
  border: 0;
  color: black;
  text-align: center;
  height: 1.5em;
  opacity: .5;
}
.hr-text:before {
    content: '';
    // use the linear-gradient for the fading effect
    // use a solid background color for a solid bar
    background: linear-gradient(to right, transparent, #818078, transparent);
    position: absolute;
    left: 0;
    top: 50%;
    width: 100%;
    height: 1px;
}
.hr-text:after {
    content: attr(data-content);
    position: relative;
    display: inline-block;
    color: black;

    padding: 0 .5em;
    line-height: 1.5em;
    // this is really the only tricky part, you need to specify the background color of the container element...
    color: #818078;
    background-color: #fcfcfa;
}

input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  -webkit-text-fill-color: #FF5722;
  -webkit-box-shadow: 0 0 0px 1000px #FFF inset;
}
.cas-footer {
	background: none;
}
#copyright {
	font-size: 13px;
}

#login-form-controls button[name="submitBtn"]{
	background-color: #374eed;
}