@import url('https://fonts.googleapis.com/css2?family=Comfortaa:wght@700&family=Jost&family=Rubik+Iso&display=swap');
*{
    margin:0;
    padding:0;
}

   
body{
    background-color: #bcdfa5;
}



.hero1{
    background: url(/IMAGE/shinchanbg.jpg) no-repeat center center;
    max-width:100vw;
    min-height:100vh;
    display: flex;
    justify-content: center;
}

header{
    display: flex;
    justify-content:baseline;
    flex-direction:column;
    align-items:last baseline;
    margin: 100px;
    gap:20px;
    
}







header h2{
    font-family: 'Comfortaa', cursive;
    
    color:rgb(61, 161, 197)

}


header h2:hover{
    color: rgb(211, 181, 60);
 
}




p{
    font-size:25px;
    max-width: 100vw;
    margin:50px;
    color:rgb(102, 95, 95);
    font-family:Verdana, Geneva, Tahoma, sans-serif
}


body::-webkit-scrollbar , body::-webkit-scrollbar-track-piece{
   display:none;

}

span{
    font-size:30px
}

#span1{
    color:rgb(224, 137, 137);
    font-family: 'Comfortaa', cursive;
    font-weight: bolder;
}

#span1:hover{
    color:rgb(178, 59, 242);
    
}



#span2{
    font-family: 'Comfortaa', cursive;
    font-weight: bolder;
    color:gray
}

#span2:hover{
    color:rgb(255, 217, 0)
}


img{
    max-width:100%;
    border-top-right-radius:3%;
    border-top-left-radius: 3%;
    border-bottom-left-radius: 3%;
    border-bottom-right-radius:3%;
}



.abt{
    display:grid;
    place-items:center;
}


a{
    text-decoration: none;
    color:rgb(224, 137, 137);
}

a:hover{
    color:rgb(205, 121, 61)
}

span#frnd{
    font-size: 40px;
}


.hero2{
    
    background-color:rgb(149, 178, 244);
    display:flex;
    flex-direction: column;
    place-items:center;
    max-width: 100vw;
    min-height: 200vh;
    font-family: 'Jost', sans-serif;
    gap:100px
    

}



.card{
    
    
    display:flex;
    flex-direction: column;
    justify-content: center;
    gap:30px;
    max-width: 50vw;
   
    padding:100px;
    background-color: rgb(127, 130, 213);
   
    border-top-left-radius: 300px;
    border-top-right-radius:300px;
    border-bottom-left-radius: 300px;
    border-bottom-right-radius:300px;
}


.card img{
    border-top-right-radius: 30px;  
    border-top-left-radius: 30px; 
    border-bottom-right-radius: 30px; 
    border-bottom-left-radius: 30px; 
    max-width:100%
      

}





p.about{
    font-size:20px;
    color:rgb(19, 19, 19)
}

button{
    width: 100px;
    min-height:50px;
    background-color:rgb(244, 198, 205);
    color:black;
    font-size:20px;
    font-weight:bold;
}


button:hover{
    background-color:black;
    color:rgb(244, 198, 205);
}



span{
    color:#fab9b9

}


@media all and (min-width: 1080px) {
    .hero1 {
      background:url(/IMAGE/shinchan-big-screen.jpg)
    }

    body{
        background-color: #f7f2b5;
    }
    
  }