.menu{
	position: relative;
	width:20rem;
	box-shadow:0.15rem 0 1.75rem 0 rgba(33, 40, 50, 0.15) !important;
	padding:15px;
	background-color:#08193e;
	color:#fff;
}
.version_text{
	position: absolute;
	bottom:0;
	left:25%
}
.menu h1{
	font-size:2.6rem;
	padding: 0px 10px 20px 10px;
	margin:0
}
.menu .title a,
.menu .title a:hover,
.menu .title a:visited,
.menu .title a:focus{
	color:#fff!important;
	text-decoration:none;
}
.header{
	position:relative;
	height:5rem;
	box-shadow:0.15rem 0 1.75rem 0 rgba(33, 40, 50, 0.15) !important;
	background-color:#08193e;
	color:#fff;
}
.header::before{
	content: "";
    position: absolute;
    background-color: transparent;
    bottom: -50px;
    height: 50px;
    width: 25px;
    border-top-left-radius: 25px;
    box-shadow: 0 -25px 0 0 #08193e;
    left: 0;
}
#account_discord{
	width:35%;
}
.btn-default{
	background-color:#08193e!important;
	border-radius: 15px!important;
    font-weight: 400!important;
    font-size: 18px!important;
    line-height: 22px!important;
    color: #fff!important;
    min-height: 50px!important;
    max-width: 270px!important;
    border: none!important;
}
.btn-red{
	background-color:#f91d1d!important;
	border-radius: 15px!important;
    font-weight: 400!important;
    font-size: 18px!important;
    line-height: 22px!important;
    color: #fff!important;
    min-height: 50px!important;
    max-width: 270px!important;
    border: none!important;
	margin:5px!important;

}
.btn-close{
	opacity: 1!important;
	font-weight: bold!important;
	font-size:25px!important
}
#text-result,
#text-prompt,
#text-resolution,
#text-algo,
#text-quality{
	font-weight:bold;
	color:#000;
}
#result-infos p{
	margin-bottom:0!important;
	padding-top:10px;
	padding-bottom:10px;
	font-size:1.2rem;
}
#result-infos a{
	line-height: 38px!important;
}
#image_content{
	display:none;
}
.header a,
.header a:hover,
.header a:visited
.header a:focus{
	color:#000!important;
	text-decoration:none!important
}
.documentation img{
	max-width:63%;
	height:auto
}
#body-prompt .add_prompt,
#body-prompt .add_prompt:hover,
#body-prompt .add_prompt:visited
#body-prompt .add_prompt:focus{
	color:#000!important;
	text-decoration:none!important
}
#body-prompt .text-underline,
#body-prompt .text-underline:hover,
#body-prompt .text-underline:visited
#body-prompt .text-underline:focus{
	color:#08193e!important;	
	text-decoration:underline!important
}

.item-prompt{
	position:relative;
}
.img-prompt:hover{
	background-color:#08193e!important;	
	border-radius:15px!important;
}
.remove-prompt:hover{
	color:#dc3545;
}
.remove-prompt{
	cursor:pointer;
	position:absolute;
	top:-7px;
	left:5px
}
.ratio-img-modal{
	display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(2, 1fr);
	grid-auto-flow: column;
}
.ratio-img-modal img{
	width:150px;
	height:auto!important;
}
.btn-ratio img{
	border-radius: 25px!important;
}
.btn-ratio:hover img{
	border: 3px solid #08193e;
	border-radius: 25px!important;
}
.active-ratio{
	border-color: 1px solid #000;
}
#display_image{
	position: relative;
}
#display_image .rec{
	max-width: 40%!important;
}
#display_image .car{
	max-width: 80%!important;
}
.loading{
	position:absolute;
	background-color:#000;
	opacity:0.7;
	height: 100%;
	overflow:hidden;
	z-index:1!important;
}
.loading-car{
	width:80%;
	left:10%
}
.loading-rec{
	width:40%;
	left:30%
}
.loading .spinner-border{
	position:absolute;
	top:50%;
	left:45%;
}
.car,
.rec{
	border-radius:15px!important;
}
.modal-content{
	border:3px solid #08193e!important;
}
.modal-header{
	border-bottom: 0!important;
}
.form-check-input:checked{
	background-color:#08193e!important;
    border-color: #08193e!important;
}
.form-check-input:focus {
    border-color:#08193e!important;
    outline: 0;
    box-shadow: 0 0 0 0.20rem #08193e!important;
}
.form-control:focus {

    border-color:#08193e!important;
    outline: 0;
    box-shadow: 0 0 0 0.25rem #08193e!important;
}
.toast-header{
	border-bottom:0!important;
}

/************* LOGO ANIMATION *******************/

.logo {
  -webkit-perspective: 250px;
  perspective: 250px;
  display: inline-block;
  font-family: 'Roboto'!important;
  font-size: 3em;
  font-weight: bold;
  text-decoration: none;
  letter-spacing: -.05em;
}
.logo span { display: inline-block; }
.m1 { color:#f91d1d !important; }
.m2 { color:#FFFFFF!important; }
.navbar {
	display:none;
}
/************* FIN LOGO ANIMATION *******************/
.navbar-toggler{
	background-color: #fff;
}
.bg-blue{
	background-color: #08193e!important;;
}
.logo-mobile{
	display: none;
}
.mobile-collapse{
	border-radius:15px;
	color:#fff;
}

/***********************Mobile***********************/

@media only screen and (max-width: 667px) {

	.menu{
		display:none!important;
	}
	.logo-mobile{
		display: block;
	}
	.logo-mobile h1{
		font-size: 19px;
	}
	.flex-column-mobile{
		flex-direction: column!important;
	}
	.flex-column-mobile .block1,
	.flex-column-mobile .block2{
		width:100%!important;
	}
	.p-mobile-3{
		padding:1rem!important;
	}
	.p-mobile-4{
		padding:1rem!important;
	}
	.pt-mobile-3{
		padding-top:1.5rem!important;
	}
	.mt-mobile-3{
		margin-top:1rem!important;
	}

	.form-control{
		margin-top:10px!important;
		margin-bottom:10px!important
	}
	.text-center-mobile{
		text-align: center!important;
	}
	.align-items-center-mobile{
		align-items:center!important
	}
	.navbar {
		display:block!important;
	}
	.account-text{
		display:none!important;
	}
	#account_discord{
		width:100%
	}
	.flag {
		margin:10px
	}
	.text-center-mobile{
		text-align:center;
	}
	#display_image .car,
	#display_image .rec{
		max-width:100%!important
	}
	.loading-car,.loading-rec{
		width:100%!important;
		left:0!important;
	}
	.btn-red{
		font-size:15px!important;
	}
}