body {
	background-color:#e8e8e8;
	display: flex;       
	flex-direction: row; 
	align-items: center; 				
	justify-content: space-evenly; 
	min-height:100vh;
	width:100%;
	margin:0px;
	padding:0px;
}

*{	
	box-sizing:border-box;
	font-family: "Please write me a song";
}

.actif:enabled{
	cursor:pointer;
}

.actif:disabled{
	cursor:not-allowed;
}

.bgimg{
	background-color:transparent;
	background-image:url("../../img/vegas/101.jpg");
	background-size:cover;
	background-repeat:no-repeat;
	background-position:center;
}

.bold {
    font-weight: bold;
}

.col{
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:space-evenly;
}

.coltop{
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:flex-start;	
}

.colleft{
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	justify-content:flex-start;	
}

.custombutton{
    padding: 12px 20px;
	font-family: "Please write me a song";
    background-color: rgba(0,0,0,0.5);
    color: #ffffff;
    border: 1px solid #ffffff;
}

.custombutton:hover{
    background-color: #ffffff;
    color: #000000;
    font-weight: bolder;
    border: 1px solid #000000;
}

.custombutton:disabled {
    background-color: rgba(150,150,150,0.1); /* plus pâle */
    color: #F8F8F8;                          /* texte grisé */
    border: 1px solid #ffffff;               /* bordure grise */
    cursor: not-allowed;                     /* curseur interdit */
    font-weight: normal;
}

/* Désactiver l’effet hover quand disabled */
.custombutton:disabled:hover {
    background-color: rgba(150,150,150,0.1);
    color: #F8F8F8;
    border: 1px solid #ffffff;
    font-weight: normal;
}

div, form{
	/*border:1px solid grey;*/ /* pour depannage */
}

h1, h2{
	margin:0px;
}

.hbg{
	border:none;
	width:12vw;
}


#imageCible{
	width:20vw; 
	min-height:20vw; 
}

input[type="radio"] {
	transform: scale(1.6);   /* Ajustez la valeur */
	margin-right: 10px;      /* Espacement avec le texte */
	position: relative;
	top:-5px;
}

.menu {
    position: fixed;
    top: 0.5vw;
    left: 0;
    width: 100%;
    z-index: 30000;
}

.menu nav.menu {
    width: 80%;
    margin: 0 auto; 
}

nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: center;
}

nav ul li {
	margin:0.5vw;
}

nav ul li a {
    text-decoration: none;
}

.radiobox{
	display:flex;
	flex-direction:column;
	justify-content:left:
}

.uploadform{
	height:50vh;
}

.ran{
	display:flex;
	flex-direction:row;
	align-items:center;
	justify-content:space-evenly;
}

.rancen{
	display:flex;
	flex-direction:row;
	align-items:center;
	justify-content:center;
}

.rantop{
	display:flex;
	flex-direction:row;
	align-items:flex-start;
	justify-content:space-evenly;
}

	td { 
		padding:5px;
	}	

@media (orientation: portrait) {

	*{
		font-size:6vw;
	}
	
	.menu{
		top:2vw;
	}

	.menubutton{
		display:none;
		width:100%;
	}
	
	.hbg{
		display:inline;
	}

	h1{
		font-size:10vw;
		text-align:center;
	}

	h2{
		font-size:9vw;
	}

	nav ul {
		display: flex;
		flex-direction:column;
		justify-content: left;
	}

	table, table th, table td { 
		font-size: 1vw; 
	}	
}

@media (orientation: landscape) {

	*{
		font-size:2vw;
	}

	.menubutton{
		width:auto;
		display:inline;
	}
	
	.hbg{
		display:none;
	}

	h1{
		font-size:3vw;
	}

	h2{
		font-size:2vw;
	}

	nav ul {
		display: flex;
		justify-content: center;
	}
	table, table th, table td { 
		font-size: 1.5vw; 
	}		
}

@media (min-width: 601px) {
	.nanogallery2{
		width:80%;
		left:10%;
	}
} 

@media (max-width: 600px) {
	.nanogallery2{
		width:94%;
		left:2%;
	}
} 
