/*---------------------------------------------------------------------------------------------------------------------------*/
.wallp{
position: absolute;
top: 0;
left: 0;
margin: 0;
padding: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 255, 255, 0.185);
z-index: 2;}

#backgr{
position: absolute;
top: 0;
left: 0;
margin: 0;
padding: 0;
width: 100%;
height: 100%;
background: linear-gradient(to bottom, #292929, #272727);
z-index: 1;}

.grid-links{
display: grid;
grid-template-columns: 1fr;
grid-template-rows: 1fr;
width: 100%;
height: 100%;
place-items: center;
justify-content: center;}
/*---------------------------------------------------------------------------------------------------------------------------*/
#links{
width: 520px;
z-index: 2;
margin: 0;/*
padding-top: 57px;*/}
/*---------------------------------------------------------------------------------------------------------------------------*/
.grid-a{
display: grid;
grid-template-columns: 10% 80% 10%;
grid-template-rows: 1fr;
text-align: center;
font-size: 17px;
font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;}
/*---------------------------------------------------------------------------------------------------------------------------*/
.grid-a img{
padding: 9px;}

#scaleA{
width: 24px;
}
/*---------------------------------------------------------------------------------------------------------------------------*/
#m-links-logo{
width: 100%;
text-align: center;}
/*---------------------------------------------------------------------------------------------------------------------------*/
#m3ddjpg{
width: 110px;
border-radius: 60px;/*
box-shadow: 0 0 20px 15px #48abe0;*/}
/*---------------------------------------------------------------------------------------------------------------------------*/
.home-hr{
border: none;
width: 100%;
border-bottom: 2px solid #0000006e;
box-shadow: 0 4px 4px -4px #000000;}
/*---------------------------------------------------------------------------------------------------------------------------*/
#links{/*
width: 100%;*/
z-index: 2;
margin: 0;}
/*---------------------------------------------------------------------------------------------------------------------------*/
.u2{
padding-top: 20px;
padding-bottom: 30px;}
.lk-u2{
padding-top: 40px;
padding-bottom: 200px;}
/*---------------------------------------------------------------------------------------------------------------------------*/
.u3{
padding-top: 0px;
padding-bottom: 30px;}
.lk-u3{
padding-top: 38px;
padding-bottom: 150px;}
/*---------------------------------------------------------------------------------------------------------------------------*/
.li{
margin: 6px 0px 6px 0px;
background-color: #50505094;
border-radius: 12px;
height: 42px;
/*border: 1px solid rgb(29, 29, 29);*/
box-shadow: 0 6px 6px -5px #02020263;
text-shadow: 1px 1px rgba(0, 0, 0, 0.623);
cursor: pointer;
z-index: 8;}
/*---------------------------------------------------------------------------------------------------------------------------*/
.li a span{
line-height: 42px;}
/*---------------------------------------------------------------------------------------------------------------------------*/
.hr{
margin: 10px 0px 10px 0px;}
/*---------------------------------------------------------------------------------------------------------------------------*/
.star-hr{
width: 100%;
position: relative;}
/*---------------------------------------------------------------------------------------------------------------------------*/
.div-mini-star{
width: 100%; 
text-align: center; 
margin: 0;
padding: 0;}
/*---------------------------------------------------------------------------------------------------------------------------*/
.star-top1,
.star-top2{
position: absolute; 
right: 49.1%;
color: rgb(22, 22, 22);
font-size: 18px;
cursor: default;}
/*---------------------------------------------------------------------------------------------------------------------------*/
.star-top1{
display: inline-block;
top: -12px;}
/*---------------------------------------------------------------------------------------------------------------------------*/
.star-top2{
display: none;
top: -10px;}
/*---------------------------------------------------------------------------------------------------------------------------*/
.grid-a:hover{
background-color: #9b9b9b73;
border-radius: 12px;
height: 42px;
box-shadow: 0 8px 8px -5px #0000002f;
font-size: 18px;/*
transform: translateX(5px);*/}
/*---------------------------------------------------------------------------------------------------------------------------*/
.go{
font-size: 24px;
line-height: 37px;
margin-left: 14px;}
/*---------------------------------------------------------------------------------------------------------------------------*/
.move{
scale: 1.2;
animation: move 0.2s forwards;}
/*---------------------------------------------------------------------------------------------------------------------------*/
.scale{
scale: 1.15;}

/*---------------------------------------------------------------------------------------------------------------------------*/
/*#page-content{
grid-column-start: 2;
height: 100%;
background-color: #363636;
margin-top: 2px;
overflow: hidden;
box-shadow: rgba(0, 0, 0, 0.3) 0px 19px 38px;
z-index: 1;}*/
    
    
/* AVEC ANIMATION 
.classic{
background-image:
url("/Img/Gif/Characters/sheep.gif"),
url("/Img/Backgrounds/Statiques/wall-min.jpg");
background-position: 100% 115%, center;  
background-size: 600px 350px, cover;
background-repeat: no-repeat, repeat;
animation: fade 1s forwards;}*/

.classic,
.classic2{
background-image:
url("/Img/Backgrounds/Statiques/wall-min.jpg");
background-position: 100% 57%;  
background-size: cover;
background-repeat: repeat;}
   
.admin{
background: linear-gradient(to bottom, #292929, #272727);
background-image: 
url("/Img/Backgrounds/Dynamiques/admin2.gif");
background-position: center; /* Center the image */
background-size: cover;
background-repeat: no-repeat;
animation: fade 1s forwards;}

.devkit{
background-image: 
url("/Img/Backgrounds/Dynamiques/download.gif");
background-position: center;/*
background-position: center;  Center the image */
background-size: cover;
background-repeat: repeat;
animation: fade 1s forwards;}

.news{
background: linear-gradient(to bottom, #292929, #272727);
background-image: 
url("/Img/Backgrounds/Dynamiques/news.gif");
background-position: center; /* Center the image */
background-size: cover;
background-repeat: no-repeat;
animation: fade 1s forwards;}

.store{
background: linear-gradient(to bottom, #292929, #272727);
background-image: 
url("/Img/Backgrounds/Dynamiques/store.gif");
background-position: center; /* Center the image */
background-size: cover;
background-repeat: no-repeat;
animation: fade 1s forwards;}

.insl{
background: linear-gradient(to bottom, #292929, #272727);
background-image: 
url("/Img/Backgrounds/Dynamiques/castle.webp");
background-position: center; /* Center the image */
background-size: cover;
background-repeat: no-repeat;
animation: fade 1s forwards;}

.slstore1{
background: linear-gradient(to bottom, #292929, #272727);
background-image: 
url("/Img/Backgrounds/Dynamiques/shopnow1.gif"),
url("/Img/Backgrounds/Dynamiques/slstore12.gif");
background-position: 66% -5%, center;
background-size: 460px 260px, cover;
background-repeat: no-repeat, no-repeat;
animation: fade 1s forwards;}

.slstore2{
background: linear-gradient(to bottom, #292929, #272727);
background-image: 
url("/Img/Backgrounds/Dynamiques/shopnow2.gif"),
url("/Img/Backgrounds/Dynamiques/slstore12.gif");
background-position: 66% -5%, center;
background-size: 460px 260px, cover;
background-repeat: no-repeat, no-repeat;
animation: fade 1s forwards;}

.slmarket{
background: linear-gradient(to bottom, #292929, #272727);
background-image: /*url("/Img/Gif/online-store.png"),*/
url("/Img/Backgrounds/Dynamiques/market.gif");
background-position: 1/*00px 100px,*/ center; /* Center the image */
background-size: /*200px 200px,*/ cover;
background-repeat: no-repeat;
animation: fade 1s forwards;}

.primfeed{
background-image: 
url("/Img/Backgrounds/Dynamiques/network.gif");
background-position: center; /* Center the image */
background-size: cover;
background-repeat: no-repeat;
animation: fade 1s forwards;}

.tiktok{
background-image: 
url("/Img/Backgrounds/Dynamiques/tiktok.gif");
background-position: 590px;/*
background-position: center;  Center the image */
background-size: cover;
background-repeat: repeat;
animation: fade 1s forwards;}

.youtube{
background-image: 
url("/Img/Backgrounds/Dynamiques/youtube.gif");
background-position: center; /* Center the image */
background-size: cover;
background-repeat: no-repeat;
animation: fade 1s forwards;}

.instagram{
background-image: 
url("/Img/Backgrounds/Dynamiques/instagram.gif");
background-position: center; /* Center the image */
background-size: cover;
background-repeat: no-repeat;
animation: fade 1s forwards;}

.flickr{/*
opacity: 0.9;*/
background-image: 
url("/Img/Backgrounds/Dynamiques/flickr3.gif");
background-position: center 28%; /* Center the image */
background-size: cover;
background-repeat: no-repeat;
animation: fade 1s forwards;}

.contact{
background-image: 
url("/Img/Backgrounds/Dynamiques/contact.gif");
background-position: center; /* Center the image */
background-size: cover;
background-repeat: no-repeat;
animation: fade 1s forwards;}


.ressources{
background-image: 
url("/Img/Backgrounds/Dynamiques/ressources4.gif");
background-position: center; /* Center the image */
background-size: cover;
background-repeat: no-repeat;
animation: fade 1s forwards;}





/* MOBILES en mode portrait */
@media (max-width: 600px) and (orientation: portrait) 
{
    #wallp{
    display: none;}

    #body{
    top: 0;
    min-height: 960px;
    overflow-x: auto;
    overflow-y: hidden;}
    
    header,
    #header-login,
    #page-content{ 
    display: none;}

    .classic,
    .classic2{
    background-image:
    url("/Img/Backgrounds/Statiques/wall-min.jpg");
    background-position: 630% 0%;  
    background-size: 200% 120%;
    background-repeat: repeat;}

}

/* MOBILES en mode paysage */
@media (max-width: 1000px) and (orientation: landscape) 
{
    #wallp{
    display: none;}

    #body{
    top: 0;
    min-height: 880px;
    overflow-x: auto;
    overflow-y: hidden;}

    header,
    #header-login,
    #page-content{ 
    display: none;}
    
    .classic,
    .classic2{
    background-image:
    url("/Img/Backgrounds/Statiques/wall-min.jpg");
    background-position: 630% 0%;  
    background-size: 200% 120%;
    background-repeat: repeat;}

}