//SITE DUO

@font-face{
	font-family: 'Montserrat'; 
	scr: url(fonts/Montserrat-Regular.ttf);
	}

body{
	margin: 0px;
	padding: 0px;
font-family: "Montserrat", sans-serif;
	//display: block;

}


.main{
	display:flex;
	height: 100vh;
	width: 100vw;
	position: absolute;
	top: 0;
	left: 0;
	OVERFLOW: HIDDEN;
	justify-content: space-between;

}

.col1{
	width: 33vw;
	//background-color:blue;
	display: block;
	//padding-top: 10vh;
	visibility : hidden;
	overflow-y: scroll;
	direction: rtl;
}

.col1content{
	padding-left: 3vw;
	padding-top: 3VW;
    direction:ltr;
}

.col3content{
	padding-right: 3vw;
	padding-top: 3VW;
}

.xp{
	height: 8vh;
	//margin-top: 2vh;
	overflow: hidden;
	-ms-overflow-style: none;
   	//object-position: top;
   	top: 0;
   	display: block;
   	width: 18vw;
   	//z-index: 7;
   	position: relative;
   	transition-duration: 0.01s;
   	
}

.xp33{
	height: 8vh;
	//margin-top: 2vh;
	overflow: scroll;
	//transition: height 0.4s linear;
	-ms-overflow-style: none;
   	//object-position: top;
   	top: 0;
   	display: block;
   	width: 30vw;
   	//z-index: 7;
}


.xp::-webkit-scrollbar{
	//display: none;
	
}

.xp:hover{
	height: 100%;
	//transition: height 0.5s linear;

}

.xp33:hover{
	height: 100%;
	//transition: height 0.5s linear;
}

.xpt {
	position: sticky;
	top: 0px;
	background-color: white;
	margin: 0;
	//transition: height 0.4s linear;
	height: 6vh;
	align-content: center;
	//height: 50px;
	border-top: 3vh solid white;

  }
 
 
 .col2{
	width: 33vw;
	//background-color: RED;
	//display: block;
	//position: relative;
	justify-content: space-between;
	padding-top: 30px;
	z-index: 10;

}

.duobox{
	display:flex;
	//background-color: pink;
	width: 33vw;
	position: absolute;
	margin-top: 12vh;
	//JUSTIFY-CONTENT: space-around;
	//JUSTIFY-CONTENT: space-between;
	
}

.logo{
	//display: flex;
	//justify-content: center;
	margin-left: auto;
	position: absolute;
	top:0;
	left: 0;
	margin-left: 62vw;
	margin-top: 2vh;
	//background-color: blue;
}

.logo2{
	display: flex;
	//justify-content: center;
	margin-left: 35vw;
	position: absolute;
	top:0;
	left: 0;
	margin-top: 2vh;
	//z-index :9999;
}

.duobox img{
	width: 15vw;
	
}

.milostatic {
  position:absolute;
  top: 0;
  cursor: pointer;
  margin-top: 3.5vh;
  
}

//.milostatic:hover{
  opacity:0;
  display: block;
  cursor: pointer;
}

.miloactif{
  //position:absolute;
  cursor: pointer;
  right
	
}

.miloactif: hover{
  position:absolute;
  cursor: pointer;
	
}



.romainstatic {
  position:absolute;
  cursor: pointer;
}

//.romainstatic:hover{
  opacity:0;
  display: block;
  cursor: pointer;
}

.romainactif{
  position:absolute;
  cursor: pointer;
	
}

.romainactif: hover{
  position:absolute;
  cursor: pointer;
	
}

.col3{
	width: 33vw;
	//background-color:green;
	text-align: end;
	justify-content: end;
	//padding-top: 10vh;
	visibility: hidden;
	//padding-right: 10px;
		overflow-y: scroll;
		

}

.textcol3{
	
}

.xp2{
	height: 8vh;
	//margin-top: 2vh;
	overflow: hidden;
	//transition: height 1s linear;
	-ms-overflow-style: none;
   	//object-position: top;
   	top: 0;
   	display: block;
   	width: 18vw;
   	//z-index: 7;
   	position: relative;
   	margin-left: auto;
}

.xp4{
		height: 8vh;
	//margin-top: 2vh;
	overflow: hidden;
	//background-color: blue;
	//transition: height 0.4s linear;
	-ms-overflow-style: none;
	//object-position: top;
	top: 0;
	display: block;
	width: 20vw;
	margin-left: auto;
}



.xp2:hover{
	height: 100%;
	//transition: height 0.5s linear;

}

.xp4:hover{
	height: 85vh;
	//transition: height 0.5s linear;

}

.imgmilo: hover{
	cursor: pointer;
}

.imgmilo{
	cursor: pointer;
	margin-top: 3.5vh;
	
}

.imgromain{
	cursor: pointer;
	margin-left: 4vw;
	
}

.imgromain:hover {
	cursor: pointer;
}


.contactro{
	//width: 200px;
	//overflow-wrap: break-word;
	margin-left: auto;
}

.page{
	position: relative;
	display: block;
}

.tagsmilo{
	top: 0;
	//left: 0;
	display: flex;
	//visibility : hidden;
	//background-color:red;
	//pointer-events: none;
	width: 10vw
}

.tagsmilo img{
	width: 10vw;
}

#tags1{
	//background-color:red;
	position:absolute;
	left:32vw;
	top:12vh;
	width: 2vw;
	//z-index:100000;
}

#tags2{
	//background-color:red;
	position:absolute;
	left:32vw;
	top:12vh;
	//z-index:100000;
}

.textcol1{
	//Z-INDEX: 7;
}

.card{
	display: block;
	width: 80vw;
	//background-color: red;
	//margin: auto;
	//top: 50%;
  //left: 50%;
   // position: absolute;
   font-size: 2.5vh;

}

.milocard{
	display: flex;
	margin-bottom: 10vh;
	justify-content: top;
}

.romaincard{
	display: flex;
	margin-bottom: 10vh;
}

.textecard{
	display: flex;
}

.bottompage{
	//margin-top: 100vh;
	//background-color: blue;
	width: 100vw;
	//justify-content: center;
	 // position: relative;
	 display: flex;
	 justify-content: center;
	 align-items: center;

}

#tete{
	margin-right: 3vw;
	width: 15vh;
	margin-bottom: 1vh;
}

.tetes{
	display: block;
	align-content: center;
}

.contactro img{
	width: 10vw;
}

.imgmilo img{
	width: 13vw;
	//left: 0;
}

.imgromain img{
	width: 14.5vw;
	//margin-left: auto;
	position: absolute;
	margin-top: 1vh;
	//left: 0;
}

.col2mere{
	position: relative;
}

.duobox img{
	
}

#logo{
	width: 27vw;
	position: absolute;
	//margin-right: 2vw;
	//padding-top: 10vh;
	
}






.xp img{
	height:3vh;
	position: absolute;
	z-index: 1;
	margin-left: 4.5vw;
	margin-top: 22.5vw;
	top: 0;
}

a{
	text-decoration: none;
	color: black;
}



  * {
	scrollbar-width: thin;
	scrollbar-height: 200px;
	scrollbar-color: #000000 #ffffff;
  }

  *::-webkit-scrollbar {
	width: 5px;
	height:
  }

  *::-webkit-scrollbar-track {
	background: #ffffff;
  }

  *::-webkit-scrollbar-thumb {
	background-color: #000000;
	border-radius: 0px;
	border: 0px none #000000;
  }
  
  
  .image120{
	align-items:center;
	width: 3%;
	position: absolute;
	bottom:0;
	left: 0;
	margin-left: 35.26vw;
	margin-bottom: 2vh;
}