/* IzaacWeb V3 - Portfolio */

html {background: radial-gradient(farthest-corner at right top,#000000,#000c30,#003208);
      background-repeat: no-repeat;
      background-color: #000c30;
      font-family:'Poppins', sans-serif;
      display: flex;
      font-size: 20px;}

body {margin: 0px; padding: 0px; width: 100%;}

li {font-size: 15px;}

strong {text-shadow: 0px 0px 3px blue;}

a {color: #e7e7e7e7; transition: color 0.3s;}

a:hover {color: lime; transition: color 0.3s;}

.Superior_Button {color: white;
                  border: outset 2px white;
                  box-shadow: 0px 0px 5px white;
                  height: 5%; width: 5%;
                  position: relative; top: 30px;
                  transition: box-shadow 0.3s;
                  margin: 10px;}

.Options {text-align: center;}

.Superior_Button:hover {box-shadow: 0px 0px 15px; transition: box-shadow 0.3s;}

.Title {color: lime; background-color: black;
        box-shadow: 0px 0px 15px lime;
        cursor: default;
        width: 100%; font-size: 25px;}

.Separation {color: #e7e7e7e7; box-shadow: 0px 0px 3px cyan;}

.List {font-size: 15px; text-align: left; padding: 10px;}

.Alura {font-size: 10px; text-decoration: none;}

.Emblem {float: right; height: 25px; width: 25px; padding-left: 50px; position: absolute;}

.Emblem2 {float: right; height: 25px; width: 25px; padding-left: 15px; position: absolute;}

#hours {color: white; width: 0px; text-shadow: 0px 0px 15px cyan; cursor: default;}
#minutes {color: white; width: 0px; text-shadow: 0px 0px 15px cyan; cursor: default;}
#seconds {color: white; width: 0px; text-shadow: 0px 0px 15px cyan; cursor: default;}
#period {color: white; width: 0px; text-shadow: 0px 0px 15px cyan; cursor: default;}
#separation {color: white; width: 0px; text-shadow: 0px 0px 15px cyan; cursor: default;}

/* T= Títles, I= Images, Te= Texts */

#T1 {color: lime; cursor: default; background-color: black; box-shadow: 0px 0px 15px lime; font-size: 20px;}

#I1 {width: 25%;
     box-shadow: 0px 0px 15px magenta;
     height: 25%; border: solid 2px grey; 
     border-radius: 100%;}

#Te1 {color: #e7e7e7e7; cursor: default; width: 90%;}

#Te2 {color: #e7e7e7e7; cursor: default;
      font-size: 10px; width: 90%;}

/* Extra Proportions */

@media screen and (min-width: 900px){
   .Superior_Button {height: 2%; width: 2%;}
   .Titulo {font-size: 30px;}
   .Alura {font-size: 15px;}
   #T1 {font-size: 25px;}
   li,#Te1 {font-size: 20px; text-align: center;}
   #I1,#I2 {height: 10%; width: 10%;}
   #Te2 {font-size: 15px;}
   #menu {font-weight: bold;}
}