/*MI PAGINA*/
body{
    margin:0px;
    }

/* Rótulo con imagen de la cátedra */
header#header1{
            display:flex;
            background-color: black;
            justify-content: space-between;
            font-family: 'Lora', serif;
            font-size: 0.5em;
            color: white;
            }
figure {
    margin: 5px;
    float:left;
    } 
figcaption{
    float:right;
    margin:5px;
}

/* Barra de navegación */
header#header2{ 
            display: flex;               
            background-color: deepskyblue; 
            font-family: 'Josefin Sans', sans-serif;
            font-size: 15px; 
            color: black;
            margin:0px
            }

ul#ul1{
    margin: .5em;
    display: flex; 
    list-style-type: none;
    justify-content:;
    padding: 0em;
    }

a#nav{
  padding: 1em;
  text-decoration: none; 
  font-size: 15px; 
  color: black;
 }


main{
    height: 7em;
    background-color: rgb(76, 190, 181);
    background-size: contain;
    font-family: 'Josefin Sans', sans-serif;
    font-size: 15px; 
    color:white;
    margin: auto; 
    padding: 2em 2em 20em 0em;
    }

h1{
    font-size:30px;
}

figure#img3{
        margin-left: 50px;
        width: 300 px;
        height: 300 px;
        border-radius: 50%;
        overflow: hidden;
        float:left;
        }

p1{
    width:35%;
    padding: 0em;
    margin-left:2.7em;
    float:left;
    font-size: 15px;
    color:white;
    
}

#a2{
    text-decoration: none;
    width:35%;
    padding: 0em;
    margin:2em 0em 1em 2.7em;
    float:left;
    font-size: 15px;
    color:white;
}

p3{
    width:35%;
    padding: 0em;
    margin-left:1.4em;
    float:left;
    font-size: 2em;
    color:white;
}

footer{
    background-color: grey;
    background-size: contain;
    margin-bottom: 0px;
    padding: 5px 10px 5px 10px;
    font-family: 'Lora', serif;
    font-size: 0.5em;
    color:white;
    }

/*SESION*/ 
#mainsesion{
    height: 25em;
    background-color: rgb(59, 171, 208);
}

#logo{
    padding-top:0em;
    margin-left:1.3em;
    width:100%;
    display:flex;
    justify-content: center;
}

#navsesion{
    display: flex;
    justify-content: center;
    width:100%;
}

.lisesion{
    background-color: white;
    font-size: 1em;
    margin-top: 1em;
    margin bottom: 0em;
    border-radius: 3em;
    list-style-type: none;
}

.psesion{
    color:rgb(132, 132, 132);
    padding: .5em 12em .5em 2em;
}

#litexto1{
    list-style-type: none;
    float:left;
    width:37%;
    padding-left:.5em;
    margin:0em;
}

#litexto2{
    list-style-type: none;
    width:30%;
    float:right;
    padding-left:1em;
    margin:0em;
}

#liboton1{
    width:50%;
    background-color: rgb(132, 132, 132);
    font-size: 1em;
    margin:7em 0em 0em 4.5em;
    border-radius: 3em;
    list-style-type: none;
}

#liboton2{
    width:50%;
    background-color: rgb(132, 132, 132);
    font-size: 1em;
    margin:1em 0em 0em 4.5em;
    border-radius: 3em;
    list-style-type: none;
}

.aboton{
    text-decoration: none;
    display: flex;
    justify-content: center;
    color:rgb(255, 255, 255);
    padding: .5em 1em .5em 1em;
}

/*REGISTRO*/
#mainregistro{
    height:25em;
    background-color: rgb(59, 171, 208);
}

h2{
    margin-top:0em;
    padding-left:1em;
    font-size:2.5em;
    display: flex;
    justify-content: center;
    margin-bottom: 0em;
}

#navregistro{
    display: flex;
    justify-content: center;
    
}

.liregistro{
    background-color: white;
    font-size: 1em;
    margin-top: 1em;
    margin bottom: 0em;
    border-radius: 3em;
    list-style-type: none;
}

.pregistro{
    color:rgb(132, 132, 132);
    padding: .5em 10em .5em 1.5em;
}

h3{
    margin-top: 2em;
    font-size:1.5em;
    display: flex;
    justify-content: center;
}

#liboton3{
    width:50%;
    background-color: rgb(132, 132, 132);
    font-size: 1em;
    margin:2em 0em 0em 4.5em;
    border-radius: 3em;
    list-style-type: none;
}

/*INICIO*/
#maininicio{
    padding:0em;
    height:45em;
    background-color: rgb(59, 171, 208);
}

#ubicacion{
    display: flex;
    justify-content: center;
    margin:10em 0em 0em 0em;
    float:left;
    width:50%;
}

#clima{
    display: flex;
    justify-content: center;
    margin:10em 0em 0em 0em;
    float:right;
    width:50%;
}


#transito{
    display: flex;
    justify-content: center;
    margin:4em 0em 0em 0em;
    float:left;
    width:50%;
}

#evento{
    display: flex;
    justify-content: center;
    margin:4em 0em 0em 0em;
    float:right;
    width:50%;
}

#ulgo{
    margin-left:0em;
    padding:3em 0em 3em .5em;
    display: flex;
    justify-content: center;
    width:90%;
}

#ligo{
    width:10%;
    list-style-type: none;
    
}

#go2{
    text-decoration: none;
    color:rgb(59, 171, 208);
    background-color: white;
    padding:1em;
    border-radius:50%;
    margin-right:15em;
    
}

/*RELOJ*/
#mainreloj{
    height:20em;
    background-color: rgb(59, 171, 208);
}

#ulreloj{
    display: flex;
    justify-content: center;
    width:100%;
    margin-left:-2em;
    margin-bottom:0em;
}

#lireloj{
    list-style-type: none;
    margin-bottom:-4em;
}

#preloj{
    color: white;
    font-family: 'Roboto Slab', serif;
    font-size:8em;
    display: flex;
    justify-content: center;
    width: .5em;
    background-color:#de5f5f;
    padding:.6em 1em .6em 1em;
    border-radius:50%;
    margin-top:.5em;
}

h5{
    display: flex;
    justify-content: center;
    font-size: 3em;
    margin:0em;
    width:100%;
    padding-left:0em;
}

#go1{
    text-decoration: none;
    color:white;
    background-color: rgb(132, 132, 132);
    padding:1em;
    border-radius:50%;
    margin-right:15em;
}

#falarma{
    margin-top: -1.55em;
}

/*ALARMA*/
#mainalarma{
    height:20em;
    background-color: rgb(59, 171, 208);
}
#palarma{
    color: rgb(132, 132, 132);
    font-family: 'Roboto Slab', serif;
    font-size:4em;
    display: flex;
    justify-content: center;
    width: .5em;
    background-color:white;
    padding:.6em 1em .6em 1em;
    border-radius:50%;
    margin-top:1em;
}

h6{
    margin-top:1em;
    font-size: 2em;
    display: flex;
    justify-content: center;
}