/*.hoverme{
	outline: 0;
	cursor: pointer;
	transition: all .3s ease;
}
*/

/*######################*/
/*#    INFORMATIQUE    #*/
/*######################*/

.pop_informatique {
	position: absolute;
	top: 200px;
	opacity: 0%;
	width: 0px;
	height: 0px;
	right: 10000px;
	background: rgba(0, 0, 0);
	border-radius: 25px;
	border: solid;
	border-width: 1px; 
	border-color: #fff;
	cursor: default;
	display: block;
	transition: all .4s ease;
	transition-delay: 1ms ,.4s, .4s, .4s;
	transition-property: opacity, width, height;
	
}


#informatique_pop1 { text-align: center; opacity: 0%; width: 500px; height: 600px; }
#informatique_pop2 { text-align: center; opacity: 0%; width: 500px; height: 590px; }
#informatique_pop3 { text-align: center; opacity: 0%; width: 500px; height: 540px; }
#informatique_pop4 { text-align: center; opacity: 0%; width: 500px; height: 375px; }
#informatique_pop5 { text-align: center; opacity: 0%; width: 500px; height: 360px; }
#informatique_pop6 { text-align: center; opacity: 0%; width: 500px; height: 350px; }

/* POP 1 Adjust */
@media screen and (max-width: 1200px) {
	#informatique_pop1 {
		right: 0%;
		max-width: 100%;
		height: auto;
} }

/* POP 2 Adjust */
@media screen and (max-width: 1200px) {
	#informatique_pop2 {
		right: 0%;
		max-width: 100%;
		height: auto;
} }

/* POP 3 Adjust */
@media screen and (max-width: 1200px) {
	#informatique_pop3 {
		right: 0%;
		max-width: 100%;
		height: auto;
} }

/* POP 4 Adjust */
@media screen and (max-width: 1200px) {
	#informatique_pop4 {
		right: 0%;
		max-width: 100%;
		height: auto;
} }

/* POP 5 Adjust */
@media screen and (max-width: 1200px) {
	#informatique_pop5 {
		right: 0%;
		max-width: 100%;
		height: auto;
} }

/* POP 6 Adjust */
@media screen and (max-width: 1200px) {
	#informatique_pop6 {
		right: 0%;
		max-width: 100%;
		height: auto;
} }

/*
.informatique_hover1{&:hover{background: rgba(#f6f6f6, .3); & > .pop_informatique{ opacity: 1; right: 0px; width: 500px; height: 600px; transition-duration: .4s; transition-property: opacity; }}}
.informatique_hover2{&:hover{background: rgba(#f6f6f6, .3); & > .pop_informatique{ opacity: 1; right: 0px; width: 500px; height: 590px; transition-duration: .4s; transition-property: opacity; }}}
.informatique_hover3{&:hover{background: rgba(#f6f6f6, .3); & > .pop_informatique{ opacity: 1; right: 0px; width: 500px; height: 540px; transition-duration: .4s; transition-property: opacity; }}}
.informatique_hover4{&:hover{background: rgba(#f6f6f6, .3); & > .pop_informatique{ opacity: 1; right: 0px; width: 500px; height: 375px; transition-duration: .4s; transition-property: opacity; }}}
.informatique_hover5{&:hover{background: rgba(#f6f6f6, .3); & > .pop_informatique{ opacity: 1; right: 0px; width: 500px; height: 360px; transition-duration: .4s; transition-property: opacity; }}}
.informatique_hover6{&:hover{background: rgba(#f6f6f6, .3); & > .pop_informatique{ opacity: 1; right: 0px; width: 500px; height: 350px; transition-duration: .4s; transition-property: opacity; }}}*/

/*######################*/
/*#       RESEAUX      #*/
/*######################*/

.pop_reseau {
	position: absolute;
	top: 200px;
	opacity: 0;
	width: 0px;
	height: 0px;
	right: 10000px;
	background: rgba(0, 0, 0);
	border-radius: 25px;
	border: solid;
	border-width: 1px; 
	border-color: #fff;
	cursor: default;
	display: block;
	transition: all .4s ease;
	transition-delay: 1ms ,.4s, .4s, .4s;
	transition-property: opacity, width, height;
}

#reseau_pop1 { text-align: center; opacity: 0%; width: 350px; height: 385px; }
#reseau_pop2 { text-align: center; opacity: 0%; width: 450px; height: 550px; }
#reseau_pop3 { text-align: center; opacity: 0%; width: 450px; height: 180px; }
#reseau_pop4 { text-align: center; opacity: 0%; width: 500px; height: 285px; }

/* POP 1 Adjust */
/*
@media screen and (max-width: 10000px) {
	#reseau_pop1 {
		right: 15%;
} }
*/
@media screen and (max-width: 1200px) {
	#reseau_pop1 {
		right: 0%;
		max-width: 100%;
		height: auto;
} }

/* POP 2 Adjust *//*
@media screen and (max-width: 10000px) {
	#reseau_pop2 {
		right: 5%;
} }
*/
@media screen and (max-width: 1200px) {
	#reseau_pop2 {
		right: 0%;
		max-width: 100%;
		height: auto;
} }

/* POP 3 Adjust *//*

@media screen and (max-width: 10000px) {
	#reseau_pop3 {
		right: 5%;
} }
*/
@media screen and (max-width: 1200px) {
	#reseau_pop3 {
		right: 0%;
		max-width: 100%;
		height: auto;
} }

/* POP 4 Adjust */
@media screen and (max-width: 1200px) {
	#reseau_pop4 {
		right: 0%;
		max-width: 100%;
		height: auto;
} }
/*
.reseau_hover1{&:hover{background: rgba(#f6f6f6, .3); & > .pop_reseau{ opacity: 1; right: 15%; width: 350px; height: 385px; transition-duration: .4s; transition-property: opacity; }}}
.reseau_hover2{&:hover{background: rgba(#f6f6f6, .3); & > .pop_reseau{ opacity: 1; right: 5%; width: 450px; height: 550px; transition-duration: .4s; transition-property: opacity; }}}
.reseau_hover3{&:hover{background: rgba(#f6f6f6, .3); & > .pop_reseau{ opacity: 1; right: 5%; width: 450px; height: 180px; transition-duration: .4s; transition-property: opacity; }}}
.reseau_hover4{&:hover{background: rgba(#f6f6f6, .3); & > .pop_reseau{ opacity: 1; right: 0px; width: 500px; height: 285px; transition-duration: .4s; transition-property: opacity; }}}*/

/*######################*/
/*#       LUMIERE      #*/
/*######################*/

.pop_lumière {
	position: absolute;
	top: 200px;
	opacity: 0;
	width: 0px;
	height: 0px;
	right: 10000px;
	background: rgba(0, 0, 0);
	border-radius: 25px;
	border: solid;
	border-width: 1px; 
	border-color: #fff;
	cursor: default;
	display: block;
	transition: all .4s ease;
	transition-delay: 1ms ,.4s, .4s, .4s;
	transition-property: opacity, width, height;
}

#lumière_pop1 { text-align: center; opacity: 0%; width: 450px; height: 535px; }
#lumière_pop2 { text-align: center; opacity: 0%; width: 500px; height: 355px; }
#lumière_pop3 { text-align: center; opacity: 0%; width: 500px; height: 390px; }
#lumière_pop4 { text-align: center; opacity: 0%; width: 450px; height: 575px; }
#lumière_pop5 { text-align: center; opacity: 0%; width: 450px; height: 600px; }
#lumière_pop6 { text-align: center; opacity: 0%; width: 535px; height: 365px; }

/* POP 1 Adjust */
@media screen and (max-width: 1200px) {
	#lumière_pop1 {
		right: 0%;
		max-width: 100%;
		height: auto;
} }

/* POP 2 Adjust *//*
@media screen and (max-width: 10000px) {
	#lumière_pop2 {
		right: 7%;
} }
*/
@media screen and (max-width: 1200px) {
	#lumière_pop2 {
		right: 0%;
		max-width: 100%;
		height: auto;
} }

/* POP 3 Adjust *//*
@media screen and (max-width: 10000px) {
	#lumière_pop3 {
		right: 10%;
} }
*/
@media screen and (max-width: 1200px) {
	#lumière_pop3 {
		right: 0%;
		max-width: 100%;
		height: auto;
} }

/* POP 4 Adjust *//*
@media screen and (max-width: 10000px) {
	#lumière_pop4 {
		right: 15%;
} }
*/
@media screen and (max-width: 1200px) {
	#lumière_pop4 {
		right: 0%;
		max-width: 100%;
		height: auto;
} }

/* POP 3 Adjust *//*
@media screen and (max-width: 10000px) {
	#lumière_pop5 {
		right: 15%;
} }
*/
@media screen and (max-width: 1200px) {
	#lumière_pop5 {
		right: 0%;
		max-width: 100%;
		height: auto;
} }

/* POP 6 Adjust */
@media screen and (max-width: 1200px) {
	#lumière_pop6 {
		right: 0%;
		max-width: 100%;
		height: auto;
} }
/*
.lumière_hover1{&:hover{background: rgba(#f6f6f6, .3); & > .pop_lumière{ opacity: 1; right: 5%; width: 450px; height: 535px; transition-duration: .4s; transition-property: opacity; }}}
.lumière_hover2{&:hover{background: rgba(#f6f6f6, .3); & > .pop_lumière{ opacity: 1; right: 0%; width: 500px; height: 355px; transition-duration: .4s; transition-property: opacity; }}}
.lumière_hover3{&:hover{background: rgba(#f6f6f6, .3); & > .pop_lumière{ opacity: 1; right: 0%; width: 500px; height: 390px; transition-duration: .4s; transition-property: opacity; }}}
.lumière_hover4{&:hover{background: rgba(#f6f6f6, .3); & > .pop_lumière{ opacity: 1; right: 5%; width: 450px; height: 575px; transition-duration: .4s; transition-property: opacity; }}}
.lumière_hover5{&:hover{background: rgba(#f6f6f6, .3); & > .pop_lumière{ opacity: 1; right: 5%; width: 450px; height: 600px; transition-duration: .4s; transition-property: opacity; }}}
.lumière_hover6{&:hover{background: rgba(#f6f6f6, .3); & > .pop_lumière{ opacity: 1; right: -4%; width: 535px; height: 365px; transition-duration: .4s; transition-property: opacity; }}}*/

/*######################*/
/*#        VIDEO       #*/
/*######################*/

.pop_vidéo {
	position: absolute;
	top: 200px;
	opacity: 0;
	width: 0px;
	height: 0px;
	right: 10000px;
	background: rgba(0, 0, 0);
	border-radius: 25px;
	border: solid;
	border-width: 1px; 
	border-color: #fff;
	cursor: default;
	display: block;
	z-index: 1;
	transition: all .4s ease;
	transition-delay: 1ms ,.4s, .4s ,.4s;
	transition-property: opacity, width, height;
}

#vidéo_pop1 { text-align: center; opacity: 0%; width: 525px; height: 560px; }
#vidéo_pop2 { text-align: center; opacity: 0%; width: 425px; height: 360px; }
#vidéo_pop3 { text-align: center; opacity: 0%; width: 425px; height: 465px; }
#vidéo_pop4 { text-align: center; opacity: 0%; width: 525px; height: 585px; }
#vidéo_pop5 { text-align: center; opacity: 0%; width: 525px; height: 590px; }
#vidéo_pop6 { text-align: center; opacity: 0%; width: 525px; height: 335px; }

/* POP 1 Adjust *//*
@media screen and (max-width: 10000px) {
	#vidéo_pop1 {
		right: -6%;
} }
*/
@media screen and (max-width: 1200px) {
	#vidéo_pop1 {
		right: 0%;
		max-width: 100%;
		height: auto;
} }

/* POP 2 Adjust *//*
@media screen and (max-width: 10000px) {
	#vidéo_pop2 {
		right: 7.5%;
} }
*/
@media screen and (max-width: 1200px) {
	#vidéo_pop2 {
		right: 0%;
		max-width: 100%;
		height: auto;
} }

/* POP 3 Adjust *//*
@media screen and (max-width: 10000px) {
	#vidéo_pop3 {
		right: 7.5%;
} }
*/
@media screen and (max-width: 1200px) {
	#vidéo_pop3 {
		right: 0%;
		max-width: 100%;
		height: auto;
} }

/* POP 4 Adjust */
@media screen and (max-width: 1200px) {
	#vidéo_pop4 {
		right: 0%;
		max-width: 100%;
		height: auto;
} }

/* POP 5 Adjust *//*
@media screen and (max-width: 10000px) {
	#vidéo_pop5 {
		right: -6%;
} }
*/
@media screen and (max-width: 1200px) {
	#vidéo_pop5 {
		right: 0%;
		max-width: 100%;
		height: auto;
} }

/* POP 6 Adjust *//*
@media screen and (max-width: 10000px) {
	#vidéo_pop6 {
		right: -6%;
} }
*/
@media screen and (max-width: 1200px) {
	#vidéo_pop6 {
		right: 0%;
		max-width: 100%;
		height: auto;
} }
/*
.vidéo_hover1{&:hover{background: rgba(#f6f6f6, .3); & > .pop_vidéo{ opacity: 1; right: -3%; width: 525px; height: 560px; transition-duration: .4s; transition-property: opacity; }}}
.vidéo_hover2{&:hover{background: rgba(#f6f6f6, .3); & > .pop_vidéo{ opacity: 1; right: 7.5%; width: 425px; height: 360px; transition-duration: .4s; transition-property: opacity; }}}
.vidéo_hover3{&:hover{background: rgba(#f6f6f6, .3); & > .pop_vidéo{ opacity: 1; right: 7.5%; width: 425px; height: 465px; transition-duration: .4s; transition-property: opacity; }}}
.vidéo_hover4{&:hover{background: rgba(#f6f6f6, .3); & > .pop_vidéo{ opacity: 1; right: -4%; width: 525px; height: 585px; transition-duration: .4s; transition-property: opacity; }}}
.vidéo_hover5{&:hover{background: rgba(#f6f6f6, .3); & > .pop_vidéo{ opacity: 1; right: -4%; width: 525px; height: 590px; transition-duration: .4s; transition-property: opacity; }}}
.vidéo_hover6{&:hover{background: rgba(#f6f6f6, .3); & > .pop_vidéo{ opacity: 1; right: -4%; width: 525px; height: 335px; transition-duration: .4s; transition-property: opacity; }}}*/

.pop_son {
	position: absolute;
	top: 200px;
	opacity: 0;
	width: 0px;
	height: 0px;
	right: 10000px;
	background: rgba(0, 0, 0);
	border-radius: 25px;
	border: solid;
	border-width: 1px; 
	border-color: #fff;
	cursor: default;
	display: block;
	z-index: 1;
	transition: all .4s ease;
	transition-delay: 1ms ,.4s, .4s ,.4s;
	transition-property: opacity, width, height;
}

#son_pop1 { text-align: center; opacity: 0%; width: 425px; height: 550px; }
#son_pop2 { text-align: center; opacity: 0%; width: 500px; height: 285px; }
#son_pop3 { text-align: center; opacity: 0%; width: 525px; height: 575px; }
#son_pop4 { text-align: center; opacity: 0%; width: 500px; height: 265px; }

@media screen and (max-width: 1200px) {
	#son_pop1 {
		right: 0%;
		max-width: 100%;
		height: auto;
} }

@media screen and (max-width: 1200px) {
	#son_pop2 {
		right: 0%;
		max-width: 100%;
		height: auto;
} }

@media screen and (max-width: 1200px) {
	#son_pop3 {
		right: 0%;
		max-width: 100%;
		height: auto;
} }

@media screen and (max-width: 1200px) {
	#son_pop4 {
		right: 0%;
		max-width: 100%;
		height: auto;
} }
/*
.son_hover1{&:hover{background: rgba(#f6f6f6, .3); & > .pop_son{ opacity: 1; right: 7.5%; width: 425px; height: 550px; transition-duration: .4s; transition-property: opacity; }}}
.son_hover2{&:hover{background: rgba(#f6f6f6, .3); & > .pop_son{ opacity: 1; right: 0px; width: 500px; height: 285px; transition-duration: .4s; transition-property: opacity; }}}
.son_hover3{&:hover{background: rgba(#f6f6f6, .3); & > .pop_son{ opacity: 1; right: -4%; width: 525px; height: 575px; transition-duration: .4s; transition-property: opacity; }}}
.son_hover4{&:hover{background: rgba(#f6f6f6, .3); & > .pop_son{ opacity: 1; right: 0px; width: 500px; height: 265px; transition-duration: .4s; transition-property: opacity; }}}*/

.tooltip {
	margin-left: 3em;
	margin-right: 2.5em;
	margin-top: 0.75em;
	position: relative;
	display: inline-block;
	color: white;
	opacity: 100%;
	cursor: pointer;
}

 .tooltiptext {
	visibility: hidden;
	opacity: 0%;
	transition: all .3s ease;
	transition-delay: 1ms , .3s;
	transition-property: opacity, visibility;
	width: 250%;
	background-color: black;
	color: #fff;
	background: rgba(0, 0, 0);
	border-radius: 25px;
	border: solid;
	border-width: 1px; 
	border-color: #fff;
	text-align: center;
	border-radius: 6px;
	padding: 5px 0;
	display: block;
	box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 1);

	/* Position the tooltip */
	position: absolute;
	bottom: 70%;
	margin-left: -70%;
}

.tooltip:hover .tooltiptext {
	transition-duration: .3s; 
	transition-property: opacity;
	visibility: visible;
	opacity: 100%;
}

.tooltip .tooltiptext::after {
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -7.5px;
	border-width: 7.5px;
	border-style: solid;
	border-color: white transparent transparent transparent;
}

@media screen and (max-width: 1200px) {
	.tooltip {
		margin-left: auto;
		margin-right: 2.5em;
	}
	.left .tooltiptext { margin-left: -25%; }
	.right .tooltiptext { margin-left: -125%; }
	.left .tooltiptext::after { left: 30%; }
	.right .tooltiptext::after { left: 72.5%; }
}

@media screen and (max-width: 460px) {
	.tooltip {
		margin-left: 1.5em;
		margin-right: 0.75em;
} }

@media screen and (max-width: 445px) {
	.tooltip {
		margin-left: 1em;
		margin-right: 1em;
} }
@media screen and (max-width: 430px) {
	.tooltip {
		margin-left: 0.5em;
		margin-right: auto;
} }

.new { border-radius: 10px; border: solid; border-width: 2.5px; border-color: #26C6DA; left: -5px; margin-top: 20px; box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 1); }
@media screen and (max-width: 770px) {.new { left: 0px; } }
.tendance { border-radius: 10px; border: solid; border-width: 2.5px; border-color: red; right: -5px; margin-top: 20px; box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 1); }
@media screen and (max-width: 770px) { .tendance { right: 0px; } }
.new_logo { display: inline-block; color: #000; text-decoration: none; font-size: 15px; font-weight: 600; text-transform: uppercase; padding: 5px 10px; border-radius: 10px; box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 1); background-color: #26C6DA; position: absolute; bottom: -22.5px; left: 42.5%; }
@media screen and (max-width: 1000px) { .new_logo { left: 40%; } }
@media screen and (max-width: 770px) { .new_logo { left: 41%; } }
.tendance_logo { display: inline-block; color: #000; text-decoration: none; font-size: 15px; font-weight: 600; text-transform: uppercase; padding: 5px 10px; border-radius: 10px; box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 1); background-color: red; position: absolute; bottom: -22.5px; left: 42.5%; }
@media screen and (max-width: 1000px) { .tendance_logo { left: 40%; } }
@media screen and (max-width: 770px) { .tendance_logo { left: 41%; } }

.matériels_banner {
	backdrop-filter: blur(2px);
	background-color: rgba(0,0,0,.5);
	bottom: 0;
	left: 0;
	opacity: 1;
	margin: 0;
	padding: 0.5em;
	position: absolute;
	right: 0;
	text-align: center;
	font-size: 14.5px;
	font-weight: 600;
	color: #fff;
	border-bottom: solid;
	border-left: solid;
	border-right: solid;
	border-bottom-left-radius: 10px; 
	border-bottom-right-radius: 10px; 
	border-width: 1px;
	border-color: #fff;
}

#owl_1 { margin: 1em; height: 600px; }
@media screen and (max-width: 1200px) { #owl_1 { margin: 0em; height: 600px; }}
@media screen and (max-width: 500px) { #owl_1 { overflow-y: scroll; overflow-x: hidden; height: 475px; }}

#owl_2 { margin: 1em; height: 600px; }
@media screen and (max-width: 1200px) { #owl_2 { margin: 0em; height: 600px; }}
@media screen and (max-width: 500px) { #owl_2 { overflow-y: scroll; overflow-x: hidden; height: 475px; }}

#owl_3 { margin: 1em; height: 600px; }
@media screen and (max-width: 1200px) { #owl_3 { margin: 0em; height: 600px; }}
@media screen and (max-width: 500px) { #owl_3 { overflow-y: scroll; overflow-x: hidden; height: 475px; }}

#owl_4 { margin: 1em; height: 600px; }
@media screen and (max-width: 1200px) { #owl_4 { margin: 0em; height: 600px; }}
@media screen and (max-width: 500px) { #owl_4 { overflow-y: scroll; overflow-x: hidden; height: 475px; }}

#owl_5 { margin: 1em; height: 600px;  }
@media screen and (max-width: 1200px) { #owl_5 { margin: 0em; height: 600px; }}
@media screen and (max-width: 500px) { #owl_5 { overflow-y: scroll; overflow-x: hidden; height: 475px; }}

#owl_6 { margin: 1em; height: 600px; width: 1000px; }
@media screen and (max-width: 1200px) {
	#owl_6 {
		margin: 0em;
		width: auto;
		height: 600px;
		overflow: scroll;
		overflow-x: hidden;
} }
@media screen and (max-width: 475px) { #owl_6 { height: 475px; } }

.owl-carousel .owl-stage-outer { overflow: visible;  /*overflow-x: clip;*/ }
.owl-dots { margin-top: 1.5em; }
.owl-theme .owl-dots .owl-dot span { background: #fff; box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 1); }
.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span { transition: background .4s; background: #26C6DA; }

.margin_pop_adapt { margin: 20px 0px 0px; }
@media screen and (max-width: 500px) { .margin_pop_adapt { margin: 20px 0px 10px; } }

/* INFORMATIQUES */
#pc_fixe { font-size: 30px; } 
#svg_pc { width: 60px; } 
#informatique_arrow1 { width: 40px; }
@media screen and (max-width: 500px) { #pc_fixe { font-size: 17px; } }
@media screen and (max-width: 500px) { #svg_pc  { width: 40px; } }
@media screen and (max-width: 500px) { #informatique_arrow1 { width: 35px; } }
#pc_portable_1 { font-size: 30px; } 
#svg_laptop { width: 60px; } 
#informatique_arrow2 { width: 40px; }
@media screen and (max-width: 500px) { #pc_portable_1 { font-size: 17px; } }
@media screen and (max-width: 500px) { #svg_laptop { width: 40px; } }
@media screen and (max-width: 500px) { #informatique_arrow2 { width: 35px; } }
#pc_portable_2 { font-size: 30px; } 
#svg_laptop_2 { width: 60px; } 
#informatique_arrow3 { width: 40px; }
@media screen and (max-width: 500px) { #pc_portable_2 { font-size: 17px; } }
@media screen and (max-width: 500px) { #svg_laptop_2 { width: 40px; } }
@media screen and (max-width: 500px) { #informatique_arrow3 { width: 35px; } }
#ecran_portable { font-size: 30px; } 
#svg_ecran_portable { width: 60px; } 
#informatique_arrow4 { width: 40px; }
@media screen and (max-width: 500px) { #ecran_portable { font-size: 17px; } }
@media screen and (max-width: 500px) { #svg_ecran_portable { width: 40px; } }
@media screen and (max-width: 500px) { #informatique_arrow4 { width: 35px; } }
#ipad { font-size: 30px; } 
#svg_ipad { width: 60px; } 
#informatique_arrow5 { width: 40px; }
@media screen and (max-width: 500px) { #ipad { font-size: 17px; } }
@media screen and (max-width: 500px) { #svg_ipad { width: 40px; } }
@media screen and (max-width: 500px) { #informatique_arrow5 { width: 35px; } }
#accessoires { font-size: 30px; } 
#svg_accessoires { width: 60px; } 
#informatique_arrow6 { width: 40px; }
@media screen and (max-width: 500px) { #accessoires { font-size: 17px; } }
@media screen and (max-width: 500px) { #svg_accessoires { width: 40px; } }
@media screen and (max-width: 500px) { #informatique_arrow6 { width: 35px; } }

#pc_fixe_hover { font-size: 20px; } 
#svg_pc_hover { width: 25px; }
@media screen and (max-width: 500px) { #pc_fixe_hover { font-size: 15px; } } 
@media screen and (max-width: 500px) { #svg_pc_hover { width: 20px; } } 
#pc_portable_1_hover { font-size: 20px; } 
#svg_laptop_1_hover { width: 25px;; }
@media screen and (max-width: 500px) { #pc_portable_1_hover { font-size: 15px; } } 
@media screen and (max-width: 500px) { #svg_laptop_1_hover { width: 20px; } } 
#pc_portable_2_hover { font-size: 20px; } 
#svg_laptop_2_hover { width: 25px; }
@media screen and (max-width: 500px) { #pc_portable_2_hover { font-size: 15px; } } 
@media screen and (max-width: 500px) { #svg_laptop_2_hover { width: 20px; } }
#ecran_portable_hover { font-size: 20px; } 
#svg_ecran_portable_hover { width: 25px; } 
@media screen and (max-width: 500px) { #ecran_portable_hover { font-size: 15px; } }
@media screen and (max-width: 500px) { #svg_ecran_portable_hover { width: 20px; } }
#ipad_hover { font-size: 20px; } 
#svg_ipad_hover { width: 25px; } 
@media screen and (max-width: 500px) { #ipad_hover { font-size: 15px; } }
@media screen and (max-width: 500px) { #svg_ipad_hover { width: 20px; } }
#accessoires_hover { font-size: 20px; } 
#svg_accessoires_hover { width: 25px; } 
@media screen and (max-width: 500px) { #accessoires_hover { font-size: 15px; } }
@media screen and (max-width: 500px) { #svg_accessoires_hover { width: 20px; } }


/* RESEAUX */
#nas { font-size: 30px; margin: 60px 0px 20px; } 
#svg_nas { width: 50px; } 
#reseau_arrow1 { width: 40px; }
@media screen and (max-width: 500px) { #nas { font-size: 20px; margin: 50px 0px 10px; } }
@media screen and (max-width: 500px) { #svg_nas  { width: 40px; } }
@media screen and (max-width: 500px) { #reseau_arrow1 { width: 35px; } }
#routeur { font-size: 30px; margin: 30px 0px 20px; } 
#svg_routeur { width: 50px; } 
#reseau_arrow2 { width: 40px; }
@media screen and (max-width: 500px) { #routeur { font-size: 20px; margin: 15px 0px 10px; } }
@media screen and (max-width: 500px) { #svg_routeur { width: 40px; } }
@media screen and (max-width: 500px) { #reseau_arrow2 { width: 35px; } }
#switch { font-size: 30px; margin: 30px 0px 20px; } 
#svg_switch { width: 50px; } 
#reseau_arrow3 { width: 40px; }
@media screen and (max-width: 500px) { #switch { font-size: 20px; margin: 15px 0px 10px; } }
@media screen and (max-width: 500px) { #svg_switch { width: 40px; } }
@media screen and (max-width: 500px) { #reseau_arrow3 { width: 35px; } }
#cables { font-size: 30px; margin: 30px 0px 20px; } 
#svg_cables { width: 50px; } 
#reseau_arrow4 { width: 40px; }
@media screen and (max-width: 500px) { #cables { font-size: 20px; margin: 15px 0px 10px; } }
@media screen and (max-width: 500px) { #svg_cables { width: 40px; } }
@media screen and (max-width: 500px) { #reseau_arrow4 { width: 35px; } }

#nas_hover { font-size: 20px; } 
#svg_nas_hover { width: 25px; } 
@media screen and (max-width: 500px) { #nas_hover { font-size: 15px; } }
@media screen and (max-width: 500px) { #svg_nas_hover  { width: 20px; } }
#routeur_hover { font-size: 20px; } 
#svg_routeur_hover { width: 25px; } 
@media screen and (max-width: 500px) { #routeur_hover { font-size: 15px; } }
@media screen and (max-width: 500px) { #svg_routeur_hover  { width: 20px; } }
#switch_hover { font-size: 20px; } 
#svg_switch_hover { width: 25px; } 
@media screen and (max-width: 500px) { #switch_hover { font-size: 15px; } }
@media screen and (max-width: 500px) { #svg_switch_hover  { width: 20px; } }
#cables_hover { font-size: 20px; } 
#svg_cables_hover { width: 25px; } 
@media screen and (max-width: 500px) { #cables_hover { font-size: 15px; } }
@media screen and (max-width: 500px) { #svg_cables_hover  { width: 20px; } }

/* LUMIRERES */
#controller { font-size: 30px; margin: 25px 0px 0px; } 
#svg_controller { width: 50px; } 
#lumière_arrow1 { width: 40px; }
@media screen and (max-width: 500px) { #controller { font-size: 17px; margin: 15px 0px 0px; } }
@media screen and (max-width: 500px) { #svg_controller  { width: 35px; } }
@media screen and (max-width: 500px) { #lumière_arrow1 { width: 35px; } }
#par_led { font-size: 30px; margin: 10px 0px 0px; } 
#svg_par_led { width: 60px; } 
#lumière_arrow2 { width: 40px; }
@media screen and (max-width: 500px) { #par_led { font-size: 17px; margin: 5px 0px 0px; } }
@media screen and (max-width: 500px) { #svg_par_led { width: 45px; } }
@media screen and (max-width: 500px) { #lumière_arrow2 { width: 35px; } }
#spot { font-size: 30px; margin: 15px 0px 0px; } 
#svg_spot { width: 50px; } 
#lumière_arrow3 { width: 40px; }
@media screen and (max-width: 500px) { #spot { font-size: 15px; margin: 10px 0px 0px; } }
@media screen and (max-width: 500px) { #svg_spot { width: 35px; } }
@media screen and (max-width: 500px) { #lumière_arrow3 { width: 35px; } }
#fumé { font-size: 30px; margin: 15px 0px 0px; } 
#svg_fumé { width: 50px; } 
#lumière_arrow4 { width: 40px; }
@media screen and (max-width: 500px) { #fumé { font-size: 17px; margin: 10px 0px 0px; } }
@media screen and (max-width: 500px) { #svg_fumé { width: 35px; } }
@media screen and (max-width: 500px) { #lumière_arrow4 { width: 35px; } }
#uv { font-size: 30px; margin: 15px 0px 0px; } 
#svg_uv { width: 100px; } 
#lumière_arrow5 { width: 40px; }
@media screen and (max-width: 500px) { #uv { font-size: 17px; margin: 10px 0px 0px; } }
@media screen and (max-width: 500px) { #svg_uv { width: 75px; } }
@media screen and (max-width: 500px) { #lumière_arrow5 { width: 35px; } }
#dmx { font-size: 30px; margin: 15px 0px 0px; } 
#svg_dmx { width: 60px; } 
#lumière_arrow6 { width: 40px; }
@media screen and (max-width: 500px) { #dmx { font-size: 17px; } }
@media screen and (max-width: 500px) { #svg_dmx { width: 35px; } }
@media screen and (max-width: 500px) { #lumière_arrow6 { width: 35px; } }

#controller_hover { font-size: 20px; } 
#svg_controller_hover { width: 25px; } 
@media screen and (max-width: 500px) { #controller_hover { font-size: 15px; } }
@media screen and (max-width: 500px) { #svg_controller_hover { width: 20px; } }
#par_led_hover { font-size: 20px; } 
#svg_par_led_hover { width: 25px; } 
@media screen and (max-width: 500px) { #par_led_hover { font-size: 15px; } }
@media screen and (max-width: 500px) { #svg_par_led_hover { width: 20px; } }
#spot_hover { font-size: 20px; } 
#svg_spot_hover { width: 25px; } 
@media screen and (max-width: 500px) { #spot_hover { font-size: 13px; } }
@media screen and (max-width: 500px) { #svg_spot_hover { width: 15px; } }
#fumé_hover { font-size: 20px; } 
#svg_fumé_hover { width: 25px; } 
@media screen and (max-width: 500px) { #fumé_hover { font-size: 15px; } }
@media screen and (max-width: 500px) { #svg_fumé_hover { width: 20px; } }
#uv_hover { font-size: 20px; } 
#svg_uv_hover { width: 50px; } 
@media screen and (max-width: 500px) { #uv_hover { font-size: 15px; } }
@media screen and (max-width: 500px) { #svg_uv_hover { width: 45px; } }
#dmx_hover { font-size: 20px; } 
#svg_dmx_hover { width: 25px; } 
@media screen and (max-width: 500px) { #dmx_hover { font-size: 15px; } }
@media screen and (max-width: 500px) { #svg_dmx_hover { width: 20px; } }

/* VIDEOS */
#caméra { font-size: 30px; margin: 20px 0px 0px; } 
#svg_caméra { width: 50px; } 
#vidéo_arrow1 { width: 40px; }
@media screen and (max-width: 500px) { #caméra { font-size: 17px; margin: 5px 0px 0px; } }
@media screen and (max-width: 500px) { #svg_caméra  { width: 35px; } }
@media screen and (max-width: 500px) { #vidéo_arrow1 { width: 35px; } }
#drone { font-size: 30px; margin: 15px 0px 0px; } 
#svg_drone { width: 50px; } 
#vidéo_arrow2 { width: 40px; }
@media screen and (max-width: 500px) { #drone { font-size: 17px; margin: 5px 0px 0px; } }
@media screen and (max-width: 500px) { #svg_drone { width: 35px; } }
@media screen and (max-width: 500px) { #vidéo_arrow2 { width: 35px; } }
#aquisition { font-size: 30px; margin: 15px 0px 5px; } 
#svg_aquisition { width: 55px; } 
#vidéo_arrow3 { width: 40px; }
@media screen and (max-width: 500px) { #aquisition { font-size: 17px; margin: 10px 0px 5px; } }
@media screen and (max-width: 500px) { #svg_aquisition { width: 40px; } }
@media screen and (max-width: 500px) { #vidéo_arrow3 { width: 35px; } }
#diffusion { font-size: 30px; margin: 20px 0px 5px; } 
#svg_diffusion { width: 60px; } 
#vidéo_arrow4 { width: 40px; }
@media screen and (max-width: 500px) { #diffusion { font-size: 17px; margin: 10px 0px 5px; } }
@media screen and (max-width: 500px) { #svg_diffusion { width: 45px; } }
@media screen and (max-width: 500px) { #vidéo_arrow4 { width: 35px; } }
#hdmi { font-size: 30px; margin: 15px 0px 15px; } 
#svg_hdmi { width: 55px; } 
#vidéo_arrow5 { width: 40px; }
@media screen and (max-width: 500px) { #hdmi { font-size: 17px; margin: 10px 0px 10px; } }
@media screen and (max-width: 500px) { #svg_hdmi { width: 40px; } }
@media screen and (max-width: 500px) { #vidéo_arrow5 { width: 35px; } }
#tibo { font-size: 30px; margin: -25px 0px 0px; } 
#svg_tibo { width: 60px; } 
#vidéo_arrow6 { width: 40px; }
@media screen and (max-width: 500px) { #tibo { font-size: 17px; } }
@media screen and (max-width: 500px) { #svg_tibo { width: 50px; } }
@media screen and (max-width: 500px) { #vidéo_arrow6 { width: 35px; } }

#caméra_hover { font-size: 20px; } 
#svg_caméra_hover { width: 25px; } 
@media screen and (max-width: 500px) { #caméra_hover { font-size: 15px; } }
@media screen and (max-width: 500px) { #svg_caméra_hover { width: 20px; } }
#drone_hover { font-size: 20px; } 
#svg_drone_hover { width: 25px; } 
@media screen and (max-width: 500px) { #drone_hover { font-size: 15px; } }
@media screen and (max-width: 500px) { #svg_drone_hover { width: 20px; } }
#aquisition_hover { font-size: 20px; } 
#svg_aquisition_hover { width: 25px; } 
@media screen and (max-width: 500px) { #aquisition_hover { font-size: 15px; } }
@media screen and (max-width: 500px) { #svg_aquisition_hover { width: 20px; } }
#diffusion_hover { font-size: 20px; } 
#svg_diffusion_hover { width: 25px; } 
@media screen and (max-width: 500px) { #diffusion_hover { font-size: 15px; } }
@media screen and (max-width: 500px) { #svg_diffusion_hover { width: 20px; } }
#hdmi_hover { font-size: 20px; } 
#svg_hdmi_hover { width: 25px; } 
@media screen and (max-width: 500px) { #hdmi_hover { font-size: 15px; } }
@media screen and (max-width: 500px) { #svg_hdmi_hover { width: 20px; } }
#tibo_hover { font-size: 20px; } 
#svg_tibo_hover { width: 25px; } 
@media screen and (max-width: 500px) { #tibo_hover { font-size: 15px; } }
@media screen and (max-width: 500px) { #svg_tibo_hover { width: 20px; } }

/* SON */
#micro { font-size: 30px; margin: 45px 0px 20px; } 
#svg_micro { width: 55px; } 
#son_arrow1 { width: 40px; }
@media screen and (max-width: 500px) { #micro { font-size: 20px; margin: 40px 0px 10px; } }
@media screen and (max-width: 500px) { #svg_micro  { width: 35px; } }
@media screen and (max-width: 500px) { #son_arrow1 { width: 35px; } }
#mixage { font-size: 30px; margin: 30px 0px 0px; } 
#svg_mixage { width: 50px; } 
#son_arrow2 { width: 40px; }
@media screen and (max-width: 500px) { #mixage { font-size: 20px; margin: 15px 0px 0px; } }
@media screen and (max-width: 500px) { #svg_mixage { width: 35px; } }
@media screen and (max-width: 500px) { #son_arrow2 { width: 35px; } }
#casque { font-size: 30px; margin: 30px 0px 15px; } 
#svg_casque { width: 45px; } 
#son_arrow3 { width: 40px; }
@media screen and (max-width: 500px) { #casque { font-size: 20px; margin: 15px 0px 5px; } }
@media screen and (max-width: 500px) { #svg_casque { width: 40px; } }
@media screen and (max-width: 500px) { #son_arrow3 { width: 35px; } }
#xlr { font-size: 30px; margin: 30px 0px 0px; } 
#svg_xlr { width: 45px; } 
#son_arrow4 { width: 40px; }
@media screen and (max-width: 500px) { #xlr { font-size: 20px; margin: 15px 0px 0px; } }
@media screen and (max-width: 500px) { #svg_xlr { width: 45px; } }
@media screen and (max-width: 500px) { #son_arrow4 { width: 35px; } }

#micro_hover { font-size: 20px; } 
#svg_micro_hover { width: 25px; } 
@media screen and (max-width: 500px) { #micro_hover { font-size: 15px; } }
@media screen and (max-width: 500px) { #svg_micro_hover  { width: 20px; } }
#mixage_hover { font-size: 20px; } 
#svg_mixage_hover { width: 25px; } 
@media screen and (max-width: 500px) { #mixage_hover { font-size: 15px; } }
@media screen and (max-width: 500px) { #svg_mixage_hover  { width: 20px; } }
#casque_hover { font-size: 20px; } 
#svg_casque_hover { width: 25px; } 
@media screen and (max-width: 500px) { #casque_hover { font-size: 15px; } }
@media screen and (max-width: 500px) { #svg_casque_hover  { width: 20px; } }
#xlr_hover { font-size: 20px; } 
#svg_xlr_hover { width: 25px; } 
@media screen and (max-width: 500px) { #xlr_hover { font-size: 15px; } }
@media screen and (max-width: 500px) { #svg_xlr_hover  { width: 20px; } }