/* Extra small devices (phones, less than 768px) */
/* No media query since this is the default in Bootstrap */
/* Small devices (tablets, 768px and up) */
/* Medium devices (desktops, 992px and up) */
/* Large devices (large desktops, 1200px and up) */

/*
@media (min-width: 768px) {

}
*/

@media (min-width: 992px) {
  .title-goos-bar{
  /* margin-top: 50%;*/
   }
   body{
    margin:0;
    padding: 0;
   }
}
/*
@media (min-width: 1200px) {
 }
*/


body{
  margin:0;
  padding: 0;
  /*background-image: radial-gradient(circle at center,white,#ec8700 );*/
  /*background-color:#ec8700; Orange:#ec8700  Rouge Sang: #850606 */
  /*background-color: #FF6633;*/
  /*background:linear-gradient(to left,grey 33.33%, white 33.33%, white 66.66%, grey 66.66%);
  background: url("../img/png/relief.png");
  background-repeat: repeat-y;*/
  /*  background:linear-gradient(to left,white 35%,#a73b3c 10%,white 10%,#a73b3c 10%,white 35%;)*/
  /*background-image: url(../img/png/bforb.png);*/
  background-color:#ec8700;   
 }

@font-face{
font-family:  "ethnocentric";
src: url('../fonts/Ethnocentric/ethnocentricrg.ttf')  ;
src: url('../fonts/Ethnocentric/ethnocentricrgit.ttf') ;
}

ul li {
text-align: center; 
display: block; 
}
::-moz-placeholder {  /* Firefox 19+ */
   
}
/*****************************************************************************/
/*******************************Tous les blocs********************************/
/*****************************************************************************/
#master{
  width: 100%;
  
 
}
#master-block1{
  width: 100%;
  height: 50px;
  display: flex;
  flex-wrap:wrap;
 
}

.title-goos-bar{
  width: 100%;
  display: flex;
  justify-content: center;
  margin-top: 2%;
  font-family: "ethnocentric","sans-serif";
 }
#master-block1{
  width: 100%;
  display: flex;
  flex-wrap:wrap;
  justify-content:center;
  padding-bottom: 10px;
  padding-top: 10px;
  background-color:#5b5b5b;
  border-top:2px solid black;
  border-bottom:1px solid black;
}
#master-block2 {
  width: 100%;
  height: 100px;
  display: flex;
  flex-wrap:wrap;
  justify-content:center;
  padding-bottom: 20px;
  padding-top: 10px;
 /* background-color:#ec8700;*/
  border-top:white;
  margin-top: 0.3%;
}
#master-block3 {
  width: 100%;
  height: 100px;
  display: flex;
  flex-wrap:wrap;
  justify-content:center;
  padding-bottom: 20px;
  padding-top: 10px;
 /* background-color:#ec8700;*/
  border-top:white;
}
#master-block4 {
  width: 100%;
  height: 100px;
  display: flex;
  flex-wrap:wrap;
  justify-content:center;
  padding-bottom: 20px;
  padding-top: 10px;
 /* background-color:#ec8700;*/
  border-top:white;
  margin-bottom: 0.3%;
}
/*********************************/
/*********************************/
#master-bloc-5{
  width: 100%;
  display: flex;
  background-color:#5b5b5b;
  padding-top: 10px;
  padding-bottom: 10px;
  border-top:1px solid black;
  border-bottom:1px solid black;
 /* border:2px solid red;*/
 }

#bloc-goos{
  width: 80%;
  display: flex;
 /* border:2px solid green;*/
  margin-left:180px;
  margin-top: 13px;
}
#logoblinks{
  width:20%;
  display: flex;
/*  border:2px solid yellow;*/
}
/***********************************/
/***********************************/

#master-block6{
  width: 100%;
  height: 100px;
  display: flex;
  flex-wrap:wrap;
  justify-content:center;
  padding-bottom: 10px;
  padding-top: 10px;
 /* background-color:#ec8700;*/
  border-top:white;
  margin-top: 0.3%;
/*  border-bottom:2px solid white;*/
}
#master-block7{
  width: 100%;
  height: 100px;
  display: flex;
  flex-wrap:wrap;
  justify-content:center;
  padding-bottom: 10px;
  padding-top: 10px;
 /* background-color:#ec8700;*/
  border-top:white;
  
}
#master-block8{
  width: 100%;
  height: 100px;
  display: flex;
  flex-wrap:wrap;
  justify-content:center;
  padding-bottom: 10px;
  padding-top: 10px;
  /*background-color:#ec8700;*/
  border-top:white;
  margin-bottom: 0.3%;
}
#master-block9{
  width: 100%;
  display: flex;
  flex-wrap:wrap;
  justify-content:center;
  padding-bottom: 10px;
  padding-top: 10px;
  background-color:#5b5b5b;
  border-top:1px solid black;
  border-bottom:2px solid black;
}
.second-tools{
  display: flex;
  justify-content: center;
  padding-top: 15px;
   width:100%;
   height:100%;
   font-size: 1em;
   text-decoration: none;
   color: white;
}
.nav-tools {
  display: flex;
  justify-content: center;
  width: 300px;
  height: 50px;
  background-color:#5b5b5b;
  border-right:1px solid #f4f3f3;
  border-left:1px solid #f4f3f3 ;
  margin-right: 2px;
}
.nav-tools:hover{
   opacity: 0.5;
  /* background-color: #ec8700;*/
   border-right:1px solid #f4f3f3;
   border-left:1px solid #f4f3f3;
 }
 .nav-tools-mid {
  display: flex;
  justify-content: center;
  width: 300px;
  height: 50px;
  background-color:#5b5b5b;
  margin-right: 2px;
}
.nav-tools-mid:hover{
   opacity: 0.5;
   background-color: #ec8700;

 }
.goos{
  width: 800px;
  height: 35px;
  border-radius:10px;
  border:1px solid #666666;
}
#invisible{
  display: none;
}

/***********************************************************/
/************************BOUTTON***************************/
/*********************************************************/
.btnstarttb{
  width: 15px;
  height: 100px;
  border-radius: 20px;
  background-color:grey;
  box-shadow: 0px 0px 8px black;
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
}
.btn{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
}
.btn:hover{
    border:1px solid black;
    opacity: 0.3;
 }
#youtube{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../../img/png/youtube.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
}
#youtube:hover{
    border:1px solid black;
    opacity: 0.3;
 }
/**********************************************************/
#gmail{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/gmail.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
}
#gmail:hover{
    border:1px solid black;
    opacity: 0.3;
 }
 /**********************************************************/
#agenda{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/agenda.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
}
#agenda:hover{
    border:1px solid black;
    opacity: 0.3;
 }
/**********************************************************/
#amazon{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/amazon.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
}
#amazon:hover{
  border:1px solid black;
  opacity: 0.3;  
}
/**********************************************************/
#leboncoin{
   width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/leboncoin.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
}
#leboncoin:hover{
  border:1px solid black;
  opacity: 0.3;
}
/**********************************************************/
#ebay{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/ebay.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
}
#ebay:hover{
   border:1px solid black;
   opacity: 0.3;  
}
/**********************************************************/
#openclassrooms{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/openclassrooms.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
}
#openclassrooms:hover{
   border:1px solid black;
   opacity: 0.3;
}
/**********************************************************/
#synlvm{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/synlvm.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
}
#synlvm:hover{
   border:1px solid black;
   opacity: 0.3;
}
/**********************************************************/
#synafao{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/synafao.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
}
#synafao:hover{
   border:1px solid black;
   opacity: 0.3;
}
/**********************************************************/
                        /*EMPTY*/
/**********************************************************/
.empty{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-color: black;
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
}
.empty:hover{
   border:1px solid black;
   opacity: 0.3;
}
/**********************************************************/
/**********************************************************/
#mailtester{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/mailtester.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
}
#mailtester:hover{
   border:1px solid black;
   opacity: 0.3;
} 
/**********************************************************/
#mx{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/mx.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
 #mx:hover{
   border:1px solid black;
   opacity: 0.3;
} 
/**********************************************************/
#speedtest{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/speedtest.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#speedtest:hover{
  border:1px solid black;
   opacity: 0.3;
}
/**********************************************************/
#alldebrid{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/alldebrid.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#alldebrid:hover{
  border:1px solid black;
   opacity: 0.3;
}
/**********************************************************/
#uptobox{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/uptobox.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#uptobox:hover{
  border:1px solid black;
   opacity: 0.3;
}
/**********************************************************/
#photopea{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/photopea.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#photopea:hover{
  border:1px solid black;
   opacity: 0.3;
}
/**********************************************************/
#virustotal{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/virustotal.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#virustotal:hover{
  border:1px solid black;
   opacity: 0.3;
}
/**********************************************************/
#flvto{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/flvto.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#flvto:hover{
  border:1px solid black;
   opacity: 0.3;
}
/**********************************************************/
#audiocutter{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/audiocutter.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#audiocutter:hover{
  border:1px solid black;
   opacity: 0.3;
}
/**********************************************************/
#onlineconvert{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/onlineconvert.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#onlineconvert:hover{
  border:1px solid black;
   opacity: 0.3;
}
/**********************************************************/
#drive{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/drive.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#drive:hover{
  border:1px solid black;
   opacity: 0.3;
}/**********************************************************/
#scribens{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/scribens.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#scribens:hover{
  border:1px solid black;
   opacity: 0.3;
 }
/**********************************************************/
 #deepl{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/deepl.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#deepl:hover{
  border:1px solid black;
   opacity: 0.3;
 }
/**********************************************************/ 
#cx{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/cx.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#cx:hover{
  border:1px solid black;
   opacity: 0.3;
 }
/**********************************************************/ 
#cxext{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/cxext.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#cxext:hover{
  border:1px solid black;
   opacity: 0.3;
 }
/**********************************************************/ 
#milestonelicence{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/milestonelicence.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#milestonelicence:hover{
  border:1px solid black;
   opacity: 0.3;
 }
 /**********************************************************/
#nperf{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/nperf.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#nperf:hover{
  border:1px solid black;
   opacity: 0.3;
 }
/**********************************************************/
#ruckus{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/ruckus.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#ruckus:hover{
  border:1px solid black;
   opacity: 0.3;
 }
#gtrad{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/gtrad.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#gtrad:hover{
  border:1px solid black;
   opacity: 0.3;
 }
 #gmap{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/gmap.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#gmap:hover{
  border:1px solid black;
   opacity: 0.3;
 }
#whatsmyip{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/whatsmyip.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#whatsmyip:hover{
  border:1px solid black;
   opacity: 0.3;
 }
 #chatgpt{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/chatgpt.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#chatgpt:hover{
  border:1px solid black;
   opacity: 0.3;
 }
#du{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/du.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#du:hover{
  border:1px solid black;
   opacity: 0.3;
 }
 #ilovepdf{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/ilovepdf.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#ilovepdf:hover{
  border:1px solid black;
   opacity: 0.3;
 }
  #pdfcompressor{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/pdfcompressor.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#pdfcompressor:hover{
  border:1px solid black;
   opacity: 0.3;
 }
  }
  #spamhaus{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/spamhaus.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#spamhaus:hover{
  border:1px solid black;
   opacity: 0.3;
 }
#axisfirmware{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/axisfirmware.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#axisfirmware:hover{
  border:1px solid black;
   opacity: 0.3;
 }
#axislicencekey{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/axislicencekey.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#axislicencekey:hover{
  border:1px solid black;
   opacity: 0.3;
 }
#axissupport{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/axissupport.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#axissupport:hover{
  border:1px solid black;
   opacity: 0.3;
 }
#morphean{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/morphean.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#morphean:hover{
  border:1px solid black;
   opacity: 0.3;
 }
#github{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/github.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#github:hover{
  border:1px solid black;
   opacity: 0.3;
 }
#audiotrimmer{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/audiotrimmer.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#audiotrimmer:hover{
  border:1px solid black;
   opacity: 0.3;
 }
#rollmyfile{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/rollmyfile.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#rollmyfile:hover{
  border:1px solid black;
   opacity: 0.3;
 }
#picture{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/picture.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#picture:hover{
  border:1px solid black;
   opacity: 0.3;
 }
 #portchecker{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/portchecker.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#portchecker:hover{
  border:1px solid black;
   opacity: 0.3;
 }
 #cartoradio{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/cartoradio.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#cartoradio:hover{
  border:1px solid black;
   opacity: 0.3;
 }
#ubiquiti{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  box-shadow: 0px 0px 8px black;
  background-image: url(../img/png/ubiquiti.png);
  margin-right: 5px;
  margin-bottom: 5px;
  border:1px solid white;
  z-index: 1;
} 
#ubiquiti:hover{
  border:1px solid black;
   opacity: 0.3;
 }
/**********************************************************/
.casevide{
  width: 100px;
  height: 100px;
  border-radius: 20px;
  background-image: url(../img/png/space.png);
  margin-right: 5px;
  margin-bottom: 5px;
  z-index: 1;
}