Upload New File

evolucionTriple.css

+/*
+Diseño y Evaluación de Sistemas Interactivos - Curso 2021-2022
+David Fernandez Garcia
+--------------------------------------------------------------
+Archivo de estilos CSS del proyecto
+*/
+
+.bar { fill: rgba(235, 231, 16, 0.87); }
+
+.button {
+   overflow: hidden;
+    padding: 15px 25px;
+    font-size: 23px;
+    cursor: pointer;
+    text-align: center;	
+    text-decoration: none;
+    outline: none;
+    color: #fff;
+    background-color: #570b5a;
+    border: none;
+    border-radius: 15px;
+    box-shadow: 0 9px #999;
+    width: 90%;
+    height: 60%;
+    font-family: monaco;
+    font-size: 200%;
+    }
+
+    .button:hover {background-color: #000000}
+
+    .button:active {
+    background-color: #8e3e76;
+    box-shadow: 0 5px #666;
+    transform: translateY(4px);
+    }
+
+html,body{
+    padding: 0;
+    margin: 0;
+    background-color: rgb(226, 83, 83);
+    height: 100%;
+
+
+}
+
+.contenedor{
+
+    overflow: hidden;
+    height: 15%;
+}
+.contenedor2{
+    overflow: hidden;
+    height: 85%;
+}
+
+.item{
+    
+    height: 100%;
+    float: left;
+}
+
+.imagen{
+    margin: auto;
+    display: flex;
+    justify-content: center;
+    height: 90%;
+    border: 5px solid black;
+   
+}
+@font-face { font-family: monaco; 
+    src: url("./monaco.ttf"); } 
+.titulo{
+    margin: auto;
+    text-align: center;
+    border: 7px solid black;
+    background-color: white;
+    font-family: monaco;
+    font-size: 400%;
+}
+
+.item2{
+    overflow: hidden;
+    height: 100%;
+    float: left;    
+}
+
+.itemBoton{
+    height: 33%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.espacioVisualizacion{
+    width: 90%;
+    height: 90%;
+    border: 15px solid black;
+    background-color: white;
+    margin: auto;
+    margin-top: 1.5%;
+    
+}
+
+.itemVis{
+    float: left;
+    display: flex;
+    align-items: center;
+}
+
+.radio{
+
+    display: flex;
+    align-items:center;
+    font-size: 300%;
+    font-family: monaco;
+}
+
+.radio2{
+
+    display: flex;
+    align-items:center;
+    font-size: 200%;
+    font-family: monaco;
+}
+
+.vis{
+    overflow: hidden;
+    margin: auto;
+    width: 90%;
+    float: left;
+}
+
+.selector{
+    width: 100%;
+}
+
+#columna1{
+    width: 25%;
+}
+
+#columna2{
+    width: 50%;
+}
+
+#columna3{
+    width: 25%;
+}
+
+#botones{
+    width: 20%;
+}
+
+#visualizacion{
+    width: 80%;
+}
+
+#zonaVisualizacion{
+    width: 75%;
+    height: 100%;
+}
+
+#zonaBotones{
+    width: 25%;
+    height: 100%;
+    position: relative;
+}
+
+#zonaRadio{
+    
+    border: 5px solid black;
+    background-color: rgb(107, 245, 102);
+}
+
+#zonaSelector{
+    margin-top: 10%;
+    display: flex;
+    justify-content: center;
+    
+}
+
+#visualizacion1{
+    position: absolute;
+    visibility: hidden;
+    margin-left: 20px;
+
+}
+
+#visualizacion2{
+    position: absolute;
+    visibility: hidden;
+    margin-left: 20px;
+
+}
+
+#visualizacion3{
+    position: absolute;
+    visibility: hidden;
+    margin-left: 20px;
+
+}
+
+#etiquetaNBA{
+    color: red;
+    font-weight: bolder;
+}
+
+#etiquetaEU{
+    color: purple;
+    font-weight: bolder;
+}
+
+#leyendaBubble{
+    margin-top: 10px;
+    margin-left: 25px;
+    width: 80%;
+    height: 80%;
+    border: 3px solid black;
+}
+
+