/* a.back-to-beginning{

    position: absolute;
    bottom: 350px;
    right:1000px ;
    font-family: Arial, Helvetica, sans-serif;
    color: rgb(239, 95, 12);
    stroke: none;
    z-index: 10;
  }
    */


   /*divi
   .container1{
   padding: 1rem;
   margin-top: 1rem;
   }
*/
   
  /* taustakuva*/
   .kuva_ekka{
 
    position: fixed;
    top: 0px;
    left: 0;

   }

    /*tällä hetkellä kaikille*/

   .kuva_ekka_osa1{
    position: fixed;
    top: 52px;
    left: 419px;
    cursor: pointer;
    transition: opacity 0.3s ease;
   }

   .tekstikangas1{

    position: fixed;
    top: -15px;
    left: 1400px;
    width: 450px;
    height:1000px;
    margin: 0;
       
    

   }


   div.eka_linkkiooo{

   position: fixed;
   width:200px;
   height:auto;
   top:266px;
   left: 65px;
   z-index: 10;

   }



   
   img.kassi_kuva{

   width: 1700px;
   height:1300px;
   margin: 0;
   }

  img.kahhestoista_kuva{

   width: 1700px;
   height:1000px;
    margin: 0;
   }


  


   img.kuues_kuva{

   width: 1700px;
   height:1300px;
   margin: 0;
   }



   img.kymmenes_kuva{

   width: 1700px;
   height:1300px;
   margin: 0;
   }



   img.seittemäs_kuva{

    width: 1700px;
    height:1800px;
    margin: 0;
    }


   .kuva_tokka{

    position: fixed;
    top: 0px;
    left: 0;
   
   }

   .kuva_tokka_osa1{
   position: fixed;
   top: 191px;
   left: 397px;
   cursor: pointer;
   transition: opacity 0.3s ease;
  
   }

   div.toka_linkkiooo{

    position: fixed;
    width:200px;
    height:auto;
    top:7px;
    left: 415px;
    z-index: 10;
 
    }
 
 
 
    
    .kuva_kolmas{

      position: fixed;
      top: 0px;
      left: 0;
     
     }
  
     .kuva_kolmas_osa1{
     position: fixed;
     top: 404px;
     left: 247px;
     cursor: pointer;
     transition: opacity 0.3s ease;
    
     }
  
     div.kolmas_linkkiooo{
  
      position: fixed;
      width:200px;
      height:auto;
      top:395px;
      left: 570px;
      z-index: 10;
     }
 
    
 
 
    

     .kuva_neljäs{

      position: fixed;
      top: 0px;
      left: 0;
     
     }
  
     .kuva_neljäs_osa1{
     position: fixed;
     top: 308px;
     left: 468px;
     cursor: pointer;
     transition: opacity 0.3s ease;
    
     }
  
     .neljäs_linkkiooo{
  
      position: fixed;
      width:200px;
      height:auto;
      top:164px;
      left: 262px;
      z-index: 10;
     }
 




     .kuva_viides{

      position: fixed;
      top: 0px;
      left: 0;
     
     }
  
     .kuva_viides_osa1{
     position: fixed;
     top: 216px;
     left: 0px;
     cursor: pointer;
     transition: opacity 0.3s ease;
    
     }
  
     .viides_linkkiooo{
  
      position: fixed;
      width:200px;
      height:auto;
      top:715px;
      left: 190px;
      z-index: 10;
     }



     .kuva_kuudes{

      position: fixed;
      top: 0px;
      left: 0;
     
     }
  
     .kuva_kuudes_osa1{
     position: fixed;
     top: 719px;
     left: 1098px;
     cursor: pointer;
     transition: opacity 0.3s ease;
    
     }
  
     .kuudes_linkkiooo{
  
      position: fixed;
      width:200px;
      height:auto;
      top:835px;
      left: 183px;
      z-index: 10;
     }


      .kuva_kuudes{

      position: fixed;
      top: 0px;
      left: 0;
     
     }
  
     .kuva_kuudes_osa1{
     position: fixed;
     top: 719px;
     left: 1098px;
     cursor: pointer;
     transition: opacity 0.3s ease;
    
     }
  
     .kuudes_linkkiooo{
  
      position: fixed;
      width:200px;
      height:auto;
      top:835px;
      left: 183px;
      z-index: 10;
     }

     .kuva_seitsemäs{

      position: fixed;
      top: -50px;
      left: 0;
     
     }
  
     .kuva_seitsemäs_osa1{
     position: fixed;
     top: -50px;
     left: 0px;
     cursor: pointer;
     transition: opacity 0.3s ease;
    
     }
  
     .seitsemäs_linkkiooo{
  
      position: fixed;
      width:200px;
      height:auto;
      top:17px;
      left: 640px;
      z-index: 10;
     }

     .kuva_kahdeksas{

      position: fixed;
      top: -50px;
      left: 0;
     
     }
  
     .kuva_kahdeksas_osa1{
     position: fixed;
     top: 113px;
     left: 87px;
     cursor: pointer;
     transition: opacity 0.3s ease;
    
     }
  
     .kahdeksas_linkkiooo{
  
      position: fixed;
      width:200px;
      height:auto;
      top:328px;
      left: 858px;
      z-index: 10;
     }



     .kuva_yhdeksäs{

      position: fixed;
      top: -50px;
      left: 0;
     
     }
  
     .kuva_yhdeksäs_osa1{
     position: fixed;
     top: 355px;
     left: 8550px;
     cursor: pointer;
     transition: opacity 0.3s ease;
    
     }
  
     .yhdeksäs_linkkiooo{
  
      position: fixed;
      width:200px;
      height:auto;
      top:138px;
      left: 979px;
      z-index: 10;
     }

   img.viies_kuva{

    width: 1700px;
    height:1300px;
    margin: 0;
    }

   img.yheksäs_kuva{

   width: 1700px;
   height:1300px;
   margin: 0;
   }


   img.yhestoista_kuva{

    width: 1700px;
    height:1300px;
    margin: 0;
    }






















  



  body{

    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    margin: 0;
    background-color: rgb(250, 237, 203);
   
   
    }
  
  
   div.keskikuva_container{
   position: relative;
   width: 400px;
   height: 400px;
  
   }
  
  
  
   img.keskikuva{
  
   position:absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%,-50%);
   width: 450px;
   height: 650px;
   border-radius: 50%;
   border: 3px;
  
   } 
  
  
   div.tähdet_jou{
  
   width: 600px;
   height: 600px;
   position: absolute;
   top:32%;
   left:45%;
   transform: translate(-50%, -50%);
   } 
  
  
  
   img.tähdet{
   top: 50%;
   left: 50%;
   width: 250px;
   height: 350px;
   transform-origin: 150px;
   position:absolute;
   border:2px;
   border-radius: 50%;
   }
  
  
  
  
  
  
   .tähdet:nth-child(1) {transform:rotate(0deg)translate(150px)rotate(-0deg);}
   .tähdet:nth-child(2) {transform:rotate(30deg)translate(150px)rotate(-30deg);}
   .tähdet:nth-child(3) {transform:rotate(60deg)translate(150px)rotate(-60deg);}
   .tähdet:nth-child(4) {transform:rotate(90deg)translate(150px)rotate(-90deg);}
   .tädhet:nth-child(5) {transform:rotate(120deg)translate(150px)rotate(-120deg);}
   .tähdet:nth-child(6) {transform:rotate(150deg)translate(150px)rotate(-150deg);}
   .tähdet:nth-child(7) {transform:rotate(180deg)translate(150px)rotate(-180deg);}
   .tähdet:nth-child(8) {transform:rotate(210deg)translate(150px)rotate(-210deg);}
   .tähdet:nth-child(9) {transform:rotate(240deg)translate(150px)rotate(-240deg);}
   .tähdet:nth-child(10) {transform:rotate(270deg)translate(150px)rotate(-270deg);}
   .tähdet:nth-child(11) {transform:rotate(300deg)translate(150px)rotate(-300deg);}
   .tähdet:nth-child(12) {transform:rotate(330deg)translate(150px)rotate(-330deg);}