<html>
<head> 
<title> Mizuiro Stat </title>
<link rel="shortcut icon" href="imágenes/icon.jpeg">
</head>

<style type="text/css">
   #fondo {
  position:fixed;
    margin-top:-150px;
    margin-left:950px;
  
}
#leftside {

        
        margin-top:120px;
        margin-left:230px;
        padding:20px;
        width:370px;
        height:900px;
        z-index:9999;
        text-align:center;
        background:#F8BDB3;
}

.icoe {
    vertical-align:middle;
    margin-top:20px;
    width:140px;
    height:140px;
    padding:1px;
    background-color:#fff;
    border:1px solid #f5f5f5;
}

.cl {
    margin-top:50px;
     font:20px Karla,Italic, calibri, sans-serif;
     font-weight: bold;
}

.cl a {
    display:inline-block;
    margin-bottom:8px;
    width:calc(100% - 20px - 2px);
    padding:4px 8px;
    background-color:#fcfcfc;
    border:1px solid #f2f2f2;
    color:#222;
    -webkit-transition: all 0.7s ease-in-out;
    -moz-transition: all 0.7s ease-in-out;
    -o-transition: all 0.7s ease-in-out;
}

.cl a:last-child {margin-bottom:0px;}

.cl a:hover {
    background-color:#222;
    border:1px solid #222;
    color:#eee;
}
 #title { 
        font-weight:bold;
        font-size:40px;
        color:"black";
    }
   
    #subtitle {
        text-transform:uppercase;
        margin-left:-4px;
        margin-top:50px;
        font:10px Karla,Italic, calibri, sans-serif;
        font-size:16px;
        font-weight: bold;
        letter-spacing:4px;
    }    
     #final {
   color: rgb(0, 0, 0);
   bottom: 0px;
   position:fixed;
   line-height:30px;
   vertical-align:text-bottom;
   font:16px Karla,Italic, calibri, sans-serif;
   border: 1px solid gray;
   border-radius: 5px;
   padding:8px;
}
   
</style>

<body>
<div id="fondo">
<img src="imágenes/mujipic.jpg" align="right">
</div>
<div id="leftside">

   <div id="title">Mizuiro (水色) Curls</div>
           

    <img class="icoe" src="imágenes/icon.jpeg">

    
    <div class="cl">
       <a href="info.html"><img width="100px" height="100px"src="imágenes/hair.png"></a> Nosotros 
       <a href="productos.html"><img width="100px" height="100px" src="imágenes/product.png"></a>Productos 
       <a href="formulario.html"><img width="100px" height="100px" src="imágenes/contactenos.png"></a>Contáctenos 
       <a href="https://www.unicartagena.edu.co/" target="_blank"><img width="100px" height="100px" src="imágenes/uni.png"></a>Unicartagena
        
    </div>

 <div id="subtitle">Buy it. Use it. Love it.</div>
        </div>

</div>
 


    </div>
</body>
<div id="final"> Página Web: Sharon Díaz (7271720004) y Sofía Acosta (7271720001). © </div>
</html>