body {
    margin: 0;
    padding: 0;
    background-color:#f6f6f6 !important;
    overflow: hidden;
}
/* beheko letrak horizontalean mugitzeko*/
/*
@keyframes marquee { 
    0% {
      transform: translateX(100%);
    }
    100% {
      transform: translateX(-100%);
    }
  }
*/
.container {
    position: relative;
}
.aldatu,.div-webcam{
    position:relative;
}
.texto-1 { /* izenburua  */
    position: absolute;
    top: 15px;
    left: 100px; 
    font-size: 55px; 
    font-family: Arial, sans-serif; 
    font-weight: bold;
}
/*
.imagen-4 {  
    position: absolute;
    top: 890px; 
    left: 1700px; 
    width: 100px;
    z-index: 1;
}
.noticia {  
    position: fixed;
    bottom: 0;
    left:350px;
    height: 78px;
    background-color:  #d3d3d3  ;
    text-align: center;    
}
.naizirratia{
    position:absolute;
    right: 50px;
    top:40px;
    z-index: 1;
}

.mover {
    white-space: nowrap;
    font-family: Arial, sans-serif;
    font-weight: bold;
    font-size: 25px;
    animation: marquee 20s linear infinite;
    
  }
*/  
.cuadrado{ /* beheko 11 logoa */
    position: fixed;
    bottom: 0;
    left:0;
    z-index: 1;
    
}
.data {
    position: absolute;
    top: 930px;
    left: 100px;
    font-size: 30px; 
    font-family: Arial, sans-serif; 
    font-weight: bold;
    z-index: 1;
}
.video {
    position: absolute;
    top: 160px; 
    left: 0px; 
    width: 1300px;
    height: 800px;
    animation: fadeInUpBig 1s;
}
.texto-11{
    position: absolute;
    top: 850px; 
    left: 600px; 
    background-color: #f6f6f6;
    width: 160px;
    height: 40px;
    font-size: 30px;
    font-family: Arial, sans-serif; 
    font-weight: bold;
    border-radius: 10px;
    z-index: 1;
    display: flex; 
    align-items: center; 
    justify-content: center; 
}





.ciudades {
    position: absolute;
    top: 350px;
    left: 1300px;
    width: 500px;
    height: 500px;
    font-size: 30px;
    font-family: Arial, sans-serif;
    background-color: #f6f6f6;
    padding: 15px;
    border-radius: 10px;
    display: grid;
    justify-content: center;
    align-content: center;
    /*intelsat-2024*/ 
    /*gap: 40px;*/
    gap: 20px; 
    overflow-y: auto;
    /*intelsat-2024*/
    /*OHARRA::::Komentatu egin da*/ 
    /*animation: fadeIn 3s;*/
}
/*intelsat-2024*/
.ciudades,.text1,.text2,.imagen-5,.text6,.text7,.mapa,.contenedorCiudades{

    animation: fadeIn 3s;
}
/*
.custom-video-streaming{
    animation: fadeIn 3s;
}*/

.ciudad {
    display: grid;
    grid-template-columns: 6fr 1fr 1fr; /* Tres columnas: Nombre, Máxima, Mínima */
    gap: 10px;
    max-height: 100px;
    align-items: center; /* Centrar los elementos horizontalmente en la ciudad */
}

.nombre {
    font-weight: bold;
}

.text1{ /*   probintzia*/ 
    position: absolute;
    top: 120px; 
    left: 1355px; 
    font-size: 40px;
    font-family: Arial, sans-serif; 
    font-weight: bold;
}

.text2{ /*   eguna*/ 
    position: absolute;
    top: 190px; 
    left: 1355px; 
    font-size: 30px;
    font-family: Arial, sans-serif; 
    font-weight: bold;
}
.text6{ /*   probintzia*/ 
    position: absolute;
    top: 120px; 
    left: 1400px; 
    font-size: 40px;
    font-family: Arial, sans-serif; 
    font-weight: bold;
}

.text7{ /*   eguna*/ 
    position: absolute;
    top: 190px; 
    left: 1400px; 
    font-size: 30px;
    font-family: Arial, sans-serif; 
    font-weight: bold;
}
.text6,.text7{
    z-index: 1000;
}
.imagen-5 {  /* lainoa */
    position: absolute;
    top: 190px; 
    left: 1600px; 
    z-index: 1;
    width: 156px;
}

.fade-out {
    opacity: 0;
    transition: opacity 0.5s ease-out;
  }


/*lehendabiziko mapa*/
.mapa {
    position: absolute;
    top: 240px; 
    left: 80px; 
    height: 600px;
    width: 800px;
}
.div-webcam{
    top: 120px; 
    width: 1280px;
}
.ciudades1 {
    position: absolute;
    /*intelsat-2024*/
    /*top: 110px;*/
    top: 70px;
    left: 870px;
    width: 500px;
    height: 800px;
    font-size: 26px;
    font-family: Arial, sans-serif;
    background-color: #f6f6f6;
    padding: 15px;
    border-radius: 10px;
    display: grid;
    justify-content: center; 
    align-content: center; 
    /*intelsat-2024*/
    /*gap: 40px;*/ 
    gap: 20px;
    overflow-y: auto;
    animation: fadeIn 3s; 
}

.ciudad2     {
    display: grid;
    grid-template-columns: 6fr 1fr 1fr; 
    gap: 10px;
    max-height: 100px;
    align-items: center; 
}



.ciudades2 {
    position: absolute;
    /*intelsat-2024*/
    /*top: 260px;*/
    top: 240px;
    left: 1300px;
    width: 500px;
    height: 500px;
    font-size: 26px;
    font-family: Arial, sans-serif;
    background-color: #f6f6f6;
    padding: 15px;
    border-radius: 10px;
    display: grid;
    justify-content: center; 
    align-content: center; 
    /*intelsat-2024*/
    /*gap: 40px;*/ 
    gap: 20px;
    overflow-y: auto;
    animation: fadeIn 3s; 
}






/* karratu berdeak */
.donostia {
    position: relative;
    background-color: #34b233;    
    width: 140px; 
    height: 20px;
    display: flex; 
    justify-content: space-around; 
    align-items: center; 
    top:270px;
    left: 420px;
    font-family: Arial, sans-serif;
}

.baiona {
    position: relative;
    background-color: #34b233;    
    width: 140px; 
    height: 20px;
    display: flex; 
    justify-content: space-around; 
    align-items: center; 
    top:230px;
    left: 550px;
    font-family: Arial, sans-serif;
}


.hazparne {
    position: relative;
    background-color: #34b233;    
    width: 140px; 
    height: 20px;
    display: flex; 
    justify-content: space-around; 
    align-items: center; 
    top:240px;
    left: 590px;
    font-family: Arial, sans-serif;
}
.garazi {
    position: relative;
    background-color: #34b233;    
    width: 140px; 
    height: 20px;
    display: flex; 
    justify-content: space-around; 
    align-items: center; 
    top:300px;
    left: 650px;
    font-family: Arial, sans-serif;
}

.maule {
    position: relative;
    background-color: #34b233;    
    width: 140px; 
    height: 20px;
    display: flex; 
    justify-content: space-around; 
    align-items: center; 
    top:250px;
    left: 730px;
    font-family: Arial, sans-serif;
}

.izaba {
    position: relative;
    background-color: #34b233;    
    width: 140px; 
    height: 20px;
    display: flex; 
    justify-content: space-around; 
    align-items: center; 
    top:360px;
    left: 730px;
    font-family: Arial, sans-serif;
}

.iruñea {
    position: relative;
    background-color: #34b233;    
    width: 140px; 
    height: 20px;
    display: flex; 
    justify-content: space-around; 
    align-items: center; 
    top:390px;
    left: 540px;
    font-family: Arial, sans-serif;
}

.leitza {
    position: relative;
    background-color: #34b233;    
    width: 140px; 
    height: 20px;
    display: flex; 
    justify-content: space-around; 
    align-items: center; 
    top:280px;
    left: 430px;
    font-family: Arial, sans-serif;
}

.lizarra {
    position: relative;
    background-color: #34b233;    
    width: 140px; 
    height: 20px;
    display: flex; 
    justify-content: space-around; 
    align-items: center; 
    top:420px;
    left: 430px;
    font-family: Arial, sans-serif;
}

.tafalla {
    position: relative;
    background-color: #34b233;    
    width: 140px; 
    height: 20px;
    display: flex; 
    justify-content: space-around; 
    align-items: center; 
    top:440px;
    left: 540px;
    font-family: Arial, sans-serif;
}

.tutera {
    position: relative;
    background-color: #34b233;    
    width: 140px; 
    height: 20px;
    display: flex; 
    justify-content: space-around; 
    align-items: center; 
    top:510px;
    left: 540px;
    font-family: Arial, sans-serif;
}
.guardia {
    position: relative;
    background-color: #34b233;    
    width: 140px; 
    height: 20px;
    display: flex; 
    justify-content: space-around; 
    align-items: center; 
    top: 350px;
    left: 240px;
    font-family: Arial, sans-serif;
}

.gasteiz {
    position: relative;
    background-color: #34b233;    
    width: 140px; 
    height: 20px;
    display: flex; 
    justify-content: space-around; 
    align-items: center; 
    top: 250px;
    left: 230px;
    font-family: Arial, sans-serif;
}

.arrasate {
    position: relative;
    background-color: #34b233;    
    width: 140px; 
    height: 20px;
    display: flex; 
    justify-content: space-around; 
    align-items: center; 
    top: 115px;
    left: 290px;
    font-family: Arial, sans-serif;
}

.urduña {
    position: relative;
    background-color: #34b233;    
    width: 140px; 
    height: 20px;
    display: flex; 
    justify-content: space-around; 
    align-items: center; 
    top: 120px;
    left: 160px;
    font-family: Arial, sans-serif;
}

.bilbo {
    position: relative;
    background-color: #34b233;    
    width: 140px; 
    height: 20px;
    display: flex; 
    justify-content: space-around; 
    align-items: center; 
    top:30px;
    left: 170px;
    font-family: Arial, sans-serif;
}
.lekeitio {
    position: relative;
    background-color: #34b233;    
    width: 140px; 
    height: 20px;
    display: flex; 
    justify-content: space-around; 
    align-items: center; 
    top:-50px;
    left: 250px;
    font-family: Arial, sans-serif;
}
.argazkia {
    width: 15px; 
    height: 15px;
    display: block;
    /*intelsat-2024*/
    /*margin: 0 auto;*/
}

.izena {
    color: black; 
    display: block;
    font-size: 15px;
    text-align: center; 
    margin: 5px 5px; 
    font-weight: bold;
}

.tenperatura {
    color: white;
    display: block;
    font-size: 15px;
    text-align: center; 
    margin: 5px 5px;
    font-weight: bold; 
}