/*::-webkit-scrollbar {
  -webkit-appearance: none;
  width: 5px;
  height: 5px;
  opacity:0.7;
} 

::-webkit-scrollbar-thumb {
  border-radius: 4px;
  background-color: #F7B980;
  box-shadow: 0 0 1px rgba(255, 255, 255, .5);
} */


body{
  color: black;
  font-family: Roboto Condensed;
  overflow-y: auto !important;
  overflow: overlay;
}

body.granadas{
  background-image: url('/imagenes/BG.jpg');
  background-size: 1960px 1080px;
  background-attachment: fixed;
  scrollbar-color: #F7B980 #F7B980;
}

body.grid{
  background-color: #F9F8F6;
  background-image: repeating-linear-gradient(#dbdbdb, transparent 1px, transparent 25px), repeating-linear-gradient(-90deg, #dbdbdb, transparent 1px, transparent 25px);
  /*scrollbar-color: #93BD57 #93BD57; */
}

body.grid mark{
  background-color: #F1F3E0;
}

body.grid2{
  
  background-color: #e6e6e6;
background-image: url("data:image/svg+xml,%3Csvg width='84' height='16' viewBox='0 0 84 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M78 7V4h-2v3h-3v2h3v3h2V9h3V7h-3zM30 7V4h-2v3h-3v2h3v3h2V9h3V7h-3zM10 0h2v16h-2V0zm6 0h4v16h-4V0zM2 0h4v16H2V0zm50 0h2v16h-2V0zM38 0h2v16h-2V0zm28 0h2v16h-2V0zm-8 0h6v16h-6V0zM42 0h6v16h-6V0z' fill='%23aa2b1d' fill-opacity='0.6' fill-rule='evenodd'/%3E%3C/svg%3E");
}
  
a{
  color: inherit;
  text-decoration: none;
}

.lista-navegacion{
  list-style-type: none;
  padding: 0;
  margin: 0;
}

ul{
  margin:0;
}

body.granadas mark{
  background-color: #F7B980;
}


#me{
  margin:auto;
  display: block;
  width: 100%;
}

#sfcb8wryn7dk3nbyj783awqbyqk4hka73y4{
  margin-top: 3px;
  margin-left: 15px;
}

#currently-list{
  display:flex;
  flex-direction: row;
  justify-content: space-around;
  list-style: none;
  padding: 0;
}

#header{
  margin-top: 5px;
  margin-bottom:0px;
}

#clock1{
margin-top: 10px;
margin-bottom: 10px;

}

.header{
  display: flex;
  justify-content: space-between;
}

.box{
  background-color: rgb(255,255,255, 0.95);
  padding: 10px;
  border:1px solid;
  margin-bottom: 25px;
  position: relative;
}

.box-white{
  background-color: rgb(255,255,255);
  padding: 10px;
  border:1px solid;
  margin-bottom: 25px;
  position: relative;
}

.box-standard{
  margin-top: 5px;
  padding: 10px;
  background-color: white;
  border: 1px solid;
}

.box-standard-transparent{
  margin-top: 5px;
  padding: 10px;
  background-color: rgb(255,255,255,0);

}

.main{

  display:flex;
  flex-direction: row;
  padding-top: 30px;
  padding-left: 120px;
  padding-right: 120px;
  padding-bottom: 30px;
}

.left-sidebar{
  margin-right: 20px;
  max-width: 200px;
  min-width: 200px;
}

.center-sidebar{
  margin-right: 10px;
  width: 100%;
  display: flex;
  flex-direction: column;
}

.center-boxes{
  min-height: 649px;
  max-height: 649px;
  display: block;
  overflow-y: auto;
  overflow-x: hidden;
  background-color: rgb(255,255,255,0.5);

}

.center-titles{
  padding-left:10px;
  top:-10px;
  border-bottom:1px solid;
  position: relative;
}

.post-it{
  padding:10px;
  font-family: "Homemade Apple";
  font-size: 13.5px;
  background-color: #D2DCB6;
  box-shadow: 0 3px 1px -1px gray;
}

.to-do-list-box{
  background-color: rgb(255,255,255, 0.95);
  padding: 10px;
  border:1px solid;
  margin-bottom: 25px;
  position: relative;
  max-height: 133px;
  overflow:auto;
  scrollbar-color: #F7B980 #F7B980;
}

.quotes{
  border:1px solid;
  background-color: white;
  padding-top:10px;
}

.quotes hr{
  border:1px dotted gray;
  
}

.quotes-box{
  display: block;
  min-height: 150px;
  overflow: auto;
  max-height: 150px;
  scrollbar-color: #F7B980 #F7B980;
}

.quotes-box::-webkit-scrollbar{
  background: white;
  width: 5px;
  height: 5px;
}

.quotes-box::-webkit-scrollbar-thumb {
  border-radius: 4px;
  background-color: #F7B980;
  box-shadow: 0 0 1px rgba(255, 255, 255, .5);
}

.quote-titles{
  display:flex;
  justify-content: flex-start;
  padding: 10px;
}


.quote-titles1{
  min-width: 90px;
  margin-right: 30px;
}
.quote-titles1{
  width: 90px;
}

.avatar{
  margin-left: 8px;
  max-width: 280px;
  min-width: 280px;
  min-height: 250px;
  max-height: 250px;
}

#avatar{
  margin-left: 35px;
  margin-bottom: 30px;
  height: 200px;
}

.spoty-currently{
  display: flex;
  flex-flow: row wrap;
}

.spotify{
  max-width: 440px;
  min-width: 440px;
  max-height: 250px;
  min-height: 250px;
  display: flex;
  flex-direction: column;
}

.currently{
  display: flex;
  flex-direction: column;
}

.currently-box{
  display: flex;
  flex-direction: column;
  overflow:auto;
  scrollbar-color: #F7B980 #F7B980;
}

.movies-books-box{
  display: flex;
  flex-direction: column;
}

.movies-books-img{
  display: flex;
  flex-direction: column;
}

.currently-img{
  display: flex;
  flex-flow: row wrap;
}

.img-text{
  margin-right: 50px;
  display: block;
  max-width: 100px;
  margin-bottom: 20px;
}

.currently-title{
  font-size:12px;
  margin:0;
}

.currently-photos{
  width: 100px;
  margin: 0;
  padding:0;
}

.right-sidebar{
  margin-left: 10px;
  width: 250px;
}

.music-player{
  width: 100%;
}

.titulo{
  position: absolute;
  top: -20px;
  left: 0px;
}

.enlace-granadas:hover{
  background-color: #F7B980;
}

.activo-granadas{
  background-color: #F7B980;
}

.enlace-grid a:hover{
  background-color: #ECEDB0;
}

.activo-grid{
  background-color: #BBC863;
}