body {
    font-family: "Nunito", sans-serif;
    font-size:16px;
    height:100vh;
    margin:0px;
    padding:0px;
    width:100%;
}

img {
    margin: 0 10px;
    transition: transform 0.3s ease-in-out;
}

img:hover {
    cursor: pointer;
}

main .separator {
    border-left: 1px solid #5d5a5a;
    height: 15em;
    margin: 0 10px;
}

.card {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Buradaki değerleri istediğiniz gibi ayarlayabilirsiniz */
    transition: box-shadow 0.3s ease-in-out;
}
  
.card:hover {
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2); /* Kartın üzerine gelindiğinde gölgeyi biraz daha belirginleştirmek için */
}

.img-fluid {
    border-radius: 20px;
    transition: transform 0.3s ease-in-out;
}

.img-fluid:hover {
    transform: scale(1.1);
 }

.hoverbutton{
    transition: transform 0.3s ease-in-out;
}

.hoverbutton:hover{
    transform: scale(1.05);
}

.card{
    border-radius: 20px;
}

.card-body {
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
  }
.card-body:hover {
    cursor: pointer;
}

.gifImage{
    width: 100%;
    height: auto;
}

.nav-link{
    font-size: 1.1rem;
    color: #535C91;
}

.edu-text{
    color: wheat;
}

.logo{
    width: 10%;
    height: auto;
}

#myTabContent{
    background-color: white;
}

.navbar-shadow {
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.blocklogo{
    content: url('../Frontpage/img/logo1.png');
    width: 100%;
    height: auto;
    margin-top: 4rem;
    visibility: visible;
    border-style: none;
    border-width: 0px;
    z-index: 101;
    cursor: pointer;
    padding: 1vh;
  }

.simulatorbutton{
    content: url('../Frontpage/img/img1.png');
    width: 100%;
    height: auto;
    visibility: visible;
    border-style: none;
    border-width: 0px;
    z-index: 101;
    cursor: pointer;
    padding: 1vh;
  }

  .iotbutton{
    content: url('../Frontpage/img/img7.png');
    width: 100%;
    height: auto;
    visibility: visible;
    border-style: none;
    border-width: 0px;
    z-index: 101;
    cursor: pointer;
    padding: 1vh;
  }

  .remotecontrolbutton
  {
    content: url('../Frontpage/img/remotecontrol.png');
    width: 100%;
    height: auto;
    visibility: visible;
    border-style: none;
    border-width: 0px;
    z-index: 101;
    cursor: pointer;
    padding: 2.5vh;
  }

  .iotmodebutton{
    content: url('../Frontpage/img/iotmode.png');
    width: 100%;
    height: auto;
    visibility: visible;
    border-style: none;
    border-width: 0px;
    z-index: 101;
    cursor: pointer;
    padding: 2.5vh;
  }

  .iotbotbutton{
    content: url('../Frontpage/img/iotbot.png');
    width: 100%;
    height: auto;
    visibility: visible;
    border-style: none;
    border-width: 0px;
    z-index: 101;
    cursor: pointer;
    padding: 1vh;
  }
  .rolebotbutton{
    content: url('../Frontpage/img/rolebot.png');
    width: 100%;
    height: auto;
    visibility: visible;
    border-style: none;
    border-width: 0px;
    z-index: 101;
    cursor: pointer;
    padding: 1vh;
  }
  .minibotbutton{
    content: url('../Frontpage/img/minibot.png');
    width: 100%;
    height: auto;
    visibility: visible;
    border-style: none;
    border-width: 0px;
    z-index: 101;
    cursor: pointer;
    padding: 1vh;
  }
  .armbotbutton{
    content: url('../Frontpage/img/armbot.png');
    width: 100%;
    height: auto;
    visibility: visible;
    border-style: none;
    border-width: 0px;
    z-index: 101;
    cursor: pointer;
    padding: 1vh;
  }
  .carbotbutton{
    content: url('../Frontpage/img/carbot.png');
    width: 100%;
    height: auto;
    visibility: visible;
    border-style: none;
    border-width: 0px;
    z-index: 101;
    cursor: pointer;
    padding: 1vh;
  }
  .dronebutton{
    content: url('../Frontpage/img/drone.png');
    width: 100%;
    height: auto;
    visibility: visible;
    border-style: none;
    border-width: 0px;
    z-index: 101;
    cursor: pointer;
    padding: 1vh;
  }
  
  .blocklivebutton{
    content: url('../Frontpage/img/img6.png');
    width: 100%;
    height: auto;
    visibility: visible;
    border-style: none;
    border-width: 0px;
    z-index: 101;
    cursor: pointer;
    padding: 1vh;
  }
  
  
  .blockloadbutton{
    content: url('../Frontpage/img/img1.png');
    width: 100%;
    height: auto;
    visibility: visible;
    border-style: none;
    border-width: 0px;
    z-index: 101;
    cursor: pointer;
    padding: 1vh;
  }
  
  
  .boardsbutton{
    content: url('../Frontpage/img/img3.png');
    width: 100%;
    height: auto;
    visibility: visible;
    border-style: none;
    border-width: 0px;
    z-index: 101;
    cursor: pointer;
    padding: 1vh;
  }
  
  .webbutton{
    content: url('../Frontpage/img/img8.png');
    width: 100%;
    height: auto;
    visibility: visible;
    border-style: none;
    border-width: 0px;
    z-index: 101;
    cursor: pointer;
    padding: 1vh;
  }
  
  
  .simulatorbutton{
    content: url('../Frontpage/img/img2.png');
    width: 100%;
    height: auto;
    visibility: visible;
    border-style: none;
    border-width: 0px;
    z-index: 101;
    cursor: pointer;
    padding: 1vh;
  }
  
  .educationbutton{
    content: url('../Frontpage/img/img5.png');
    width: 100%;
    height: auto;
    visibility: visible;
    border-style: none;
    border-width: 0px;
    z-index: 101;
    cursor: pointer;
    padding: 1vh;
  }
  
  .text {
    position: absolute;
    left: 2rem;
    bottom: 2rem;
    font-size: 1.2rem;
    font-weight: bold;
    color: #2b3d55ff;
    text-align: center;
}

@media (max-width: 1280px) {
    .text {
        position: absolute;
        left: 3rem;
        bottom: 2rem;
        font-size: 1.5rem;
        font-weight: bold;
        color: #2b3d55ff;
    }
}
@media (max-width: 1000px) {
    .text {
        position: absolute;
        left: 3rem;
        bottom: 2rem;
        font-size: 1rem;
        font-weight: bold;
        color: #2b3d55ff;
    }
}