.modal
{

   background-color: rgba(0, 0, 0, 0.55);

    backdrop-filter: blur(3px);  
    -webkit-backdrop-filter: blur(3px);
}
.box {
  background-color: rgba(16, 16, 16, 0.55);
  line-height: 1;
  backdrop-filter: blur(9px);  
    -webkit-backdrop-filter: blur(3px);


    height: 15.5rem;
    overflow: hidden;
    -webkit-transition-property: background-color;
    transition-property: background-color;
    width: 100%;
  }

@-webkit-keyframes AnimationName {
  0%{background-position:0% 50%}
  50%{background-position:100% 50%}
  100%{background-position:0% 50%}
}
@-moz-keyframes AnimationName {
  0%{background-position:0% 50%}
  50%{background-position:100% 50%}
  100%{background-position:0% 50%}
}
@keyframes AnimationName { 
  0%{background-position:0% 50%}
  50%{background-position:100% 50%}
  100%{background-position:0% 50%}
}
  .box2 {
      background: linear-gradient(307deg, #0043ff, #b90000);
  background-size: 400% 400%;
  
  -webkit-animation: AnimationName 10s ease infinite;
  -moz-animation: AnimationName 10s ease infinite;
  animation: AnimationName 10s ease infinite;
    line-height: 1;
    backdrop-filter: blur(9px); 
    -webkit-backdrop-filter: blur(10px);


    height: 60px;
    overflow: hidden;
    -webkit-transition-property: background-color;
    transition-property: background-color;
    width: 100%;
  }
  
  body{

  }
  .caja2{


    height: 12.5rem;
    margin-top: 5.8rem;
    overflow: hidden;
    position: relative;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-transition: top 0.2s ease-out;
    transition: top 0.2s ease-out;
    width: 100%;
  }
  .caja {
    background-image: url('img/logo.png');
background-position: center 38%;
background-repeat: no-repeat;
    background-size: cover;
    background-size: 147%;
    -webkit-box-shadow: 0px 13px 18px -9px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 13px 18px -9px rgba(0,0,0,0.75);
    box-shadow: 0px 13px 18px -9px rgba(0,0,0,0.75);



    background-color: #000000;
    height: 15.5rem;
    overflow: hidden;
    -webkit-transition-property: background-color;
    transition-property: background-color;
    width: 100%;
  }
  

  .fondo2 {
    background-image: url('img/logo.png');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    background-size: 65%;




    background-color: #333333;
    height: 60px;
    overflow: hidden;
    -webkit-transition-property: background-color;
    transition-property: background-color;
    width: 100%;
  }



  .noseve{

    display: none;
  }

@media (min-width: 768px){

    .holaa{
        
      display: none!important; 
    }


 }
@media (max-width: 768px){
  .maxe{

    height: 286.5px!important; 
  }
    .abajos{
        
       bottom: 0px!important; 
    }
    .tama{
        
       font-size: 1.50rem!important; 
    }
    .adioos{
        
      display: none!important; 
    }

    .abajote{

        margin-bottom: 30px;
    }
    
    .adios{
         display: none;
   
        
    }
    
    .letrapeque{
            font-size: 20px!important; 
        
    }
    
     .letrapeque2{
            font-size: 16px!important; 
        
    }
    
    .modal-body3333 {
        
            align-items: end!important; 
    }
    
    .mefui{
       display: inline!important; 
        
    }
    .modal-content {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    background-clip: padding-box;
    border: 0px solid rgba(0,0,0,.2);
    border-radius: .3rem;
    outline: 0;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    max-width: none !important;
    
    




    background-color: #33333300;

}
    
    .pequeno{
        
    margin-left: 12px;
    }
    
    .pequeno2{
        
         width: 150px;
      white-space: nowrap;
      text-overflow: ellipsis;
      overflow: hidden;
    }
    
    
    .pequeno3{
        
            font-size: 18px;
    text-align: center!important;
    margin-top: 29px;
    padding-left: 15px!important;
    }
    
    
.responlogo{
    width: 120px;
    
}

.responlogo3{
    width: 120px;
    display: inline!important;
    
}

.responlogo2{
    width: 272px;
    
}


  .caja {
    background-image: url('img/logo.png');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    background-size: 300%;
    height: 9.5rem;

  }
  

.playerabajo{

display: inline!important;

}
.plays{

    display: none;
}

.responletra1{

font-size: 23px!important;
margin-bottom: 0px;
position: relative;

}
.noestaa{
      display: none;
  
    
}
.aparece{

    display: inline!important;
}
.box {
  background-color: rgba(16, 16, 16, 0.55);
  line-height: 1;
  backdrop-filter: blur(9px);
    -webkit-backdrop-filter: blur(5px);
    height: 9.5rem;
    overflow: hidden;
    -webkit-transition-property: background-color;
    transition-property: background-color;
    width: 100%;
}
.plays2
{
    display: inline!important;
}

}

.css-1o15yeo {
       background-color: #fc2d2c !important;
    border: none !important;
    margin: 0;
    padding: 0px !important;
    position: absolute !important;
    right: -0.5rem;
    z-index: 1;
    top: 170px;
    width: 53px;
}

.css-1o15yeo {
    position: relative;
    border: 1px solid #D7D7D7;
    border-radius: 100%;
    padding: 0;
    -webkit-transition: border-color 0.1s ease-in-out;
    transition: border-color 0.1s ease-in-out;
    -webkit-transition-timing-function: cubic-bezier(0.7,0,0.3,1);
    transition-timing-function: cubic-bezier(0.7,0,0.3,1);
    background-color: transparent;
    fill: #FFFFFF;
    margin: 1.5rem 1.5rem 1.5rem 0;
}


 .modal-dialog-full-width {
        width: 100% !important;
        height: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        max-width:none !important;
        
 }
 
 
 
 
.modal-content {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    background-clip: padding-box;
    border: 0px solid rgba(0,0,0,.2);
    border-radius: .3rem;
    outline: 0;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    max-width: none !important;
    
    
    
    




    background-color: #33333300;

}


    .modal-dialog-full-width {
        width: 100% !important;
        height: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        max-width:none !important;
        
    }
    
    .modal-footer {

    padding: 0rem;

    background: #000;
}

.pronto{
    
    background-image: url(img/post.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    background-size: 100%;
}

.btn-danger {
    color: #fff;
    background-color: #fc2d2c;
    border-color: #fc2d2c;
}

.close {
    float: right;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    color: #214598;
    text-shadow: 0 1px 0 #fff;
    opacity: .5;
}

.modal-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1040;
    width: 100vw;
    height: 100vh;
    background-color: #0000;
}



.site-section {
    padding: 2.5em 0; }

    .site-section.site-section-sm {
      padding: 4em 0; }


      .retro-layout-2 .h-entry.gradient {
        position: relative; }
        .retro-layout-2 .h-entry.gradient:before {
          z-index: 1;
          content: '';
          position: absolute;
          top: 0;
          right: 0;
          bottom: 0;
          left: 0;
          background: -moz-linear-gradient(top, transparent 0%, transparent 18%, rgba(0, 0, 0, 0.8) 99%, rgba(0, 0, 0, 0.8) 100%);
          background: -webkit-linear-gradient(top, transparent 0%, transparent 18%, rgba(0, 0, 0, 0.8) 99%, rgba(0, 0, 0, 0.8) 100%);
          background: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(18%, transparent), color-stop(99%, rgba(0, 0, 0, 0.8)), to(rgba(0, 0, 0, 0.8)));
          background: -o-linear-gradient(top, transparent 0%, transparent 18%, rgba(0, 0, 0, 0.8) 99%, rgba(0, 0, 0, 0.8) 100%);
          background: linear-gradient(to bottom, transparent 0%, transparent 18%, rgba(0, 0, 0, 0.8) 99%, rgba(0, 0, 0, 0.8) 100%);
          filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#cc000000',GradientType=0 ); }




          .retro-layout-2 .text {
            position: absolute;
            bottom: 0;
            z-index: 10;
            padding: 20px;
            max-width: 350px; }
            .retro-layout-2 .text h2 {
              color: #fff;
              font-size: 18px;
              line-height: 1.5;
              margin-bottom: 0; }
            .retro-layout-2 .text span {
              color: rgba(255, 255, 255, 0.5); }
            .retro-layout-2 .text.text-sm h2 {
              font-size: 18px;
              line-height: 1.5; }


              .retro-layout-2 .h-entry {
                display: block;
                position: relative;
                border-radius: 4px;
                overflow: hidden;
                background-size: cover;
                background-position: center center; }
                .retro-layout-2 .h-entry .post-category {
                  color: #fff; }
                .retro-layout-2 .h-entry.mb-30 {
                  margin-bottom: 30px; }
                .retro-layout-2 .h-entry .date {
                  font-size: 15px; }
                .retro-layout-2 .h-entry.gradient {
                  position: relative; }
                  .retro-layout-2 .h-entry.gradient:before {
                    z-index: 1;
                    content: '';
                    position: absolute;
                    top: 0;
                    right: 0;
                    bottom: 0;
                    left: 0;
                    background: -moz-linear-gradient(top, transparent 0%, transparent 18%, rgba(0, 0, 0, 0.8) 99%, rgba(0, 0, 0, 0.8) 100%);
                    background: -webkit-linear-gradient(top, transparent 0%, transparent 18%, rgba(0, 0, 0, 0.8) 99%, rgba(0, 0, 0, 0.8) 100%);
                    background: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(18%, transparent), color-stop(99%, rgba(0, 0, 0, 0.8)), to(rgba(0, 0, 0, 0.8)));
                    background: -o-linear-gradient(top, transparent 0%, transparent 18%, rgba(0, 0, 0, 0.8) 99%, rgba(0, 0, 0, 0.8) 100%);
                    background: linear-gradient(to bottom, transparent 0%, transparent 18%, rgba(0, 0, 0, 0.8) 99%, rgba(0, 0, 0, 0.8) 100%);
                    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#cc000000',GradientType=0 ); }

                    .retro-layout-2 .v-height {
                        height: 207px; }

                        .retro-layout-2 .h-entry .post-category {
                            color: #fff; }

                            .retro-layout-2 .text span {
                                color: rgba(255, 255, 255, 0.5); }

                                .post-category {
                                    display: inline-block;
                                    padding: 2px 10px;
                                    border-radius: 4px;
                                    letter-spacing: .2em;
                                    font-weight: 700;
                                    font-size: .6rem;
                                    text-transform: uppercase; }

                                    .retro-layout .post-category {
                                        margin-left: 20px;
                                        margin-top: 10px; }

                                        .retro-layout-2 .h-entry .post-category {
                                            color: #fff; }

                                            .bg-danger {
                                                background-color: #cc0a08!important;
                                            }

                                            .navbar-light .navbar-nav .nav-link {
                                              color: #fff;
                                          }
                                          .negro {
                                            background-color: #000!important;
                                        }



                                        .navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show>.nav-link {
                                          color: #fff;
                                      }


                                      .blog-listing-one-like-bookmark {
                                        padding-top: 10px;
                                    }
                                    
                                    .blog-listing-one-like-bookmark ul {
                                        margin-left: 0!important; 
                                        padding-left: 0!important;
                                    }
                                    .blog-listing-one-like-bookmark ul li i {
                                         color: #22263c;
                                        font-size: 18px;
                                    }
                                    .blog-listing-one-like-bookmark ul li span {
                                        color: #22263c;
                                       font-size: 16px;
                                    }
                                    .blog-listing-one-like-bookmark ul li {
                                        list-style-type: none;
                                        display: inline-block;
                                        font-size: 12px;
                                        color: rgb(142, 139, 139);
                                    }
                                    
                                    .blog-listing-one-like-bookmark ul li a {
                                        font-size: 14px;
                                        color: rgba(0, 0, 0, 0.4);
                                    }
                                    
                                    .blog-listing-one-like-bookmark ul li a i {
                                        font-size: 16px;
                                        color: #f4a51e;
                                        position: relative;
                                        margin-bottom: -70px !important;
                                        margin-right: 4px;
                                    }
                                    
                                    .blog-listing-one-like-bookmark ul li:nth-child(2n) {
                                        float: right;
                                    }




                                    .pagination {
                                      clear: both;
                                      padding-bottom: 10px;
                                      padding-top: 10px;
                                  }
                                  .pagination a {
                                      border: 1px solid #D5D5D5;
                                      border-radius: 4px;
                                      color: #22263c;
                                      font-size: 11px;
                                      font-weight: bold;
                                      height: 25px;
                                      padding: 5px 10px;
                                      text-decoration: none;
                                      margin: 2px;
                                  }
                                  .pagination a:hover, .pagination a:active {
                                      background:#efefef;
                                  }
                                  .pagination span.current {
                                      background-color: #22263c;
                                      border-radius: 4px;
                                      border: 1px solid #D5D5D5;
                                      color: #ffffff;
                                      font-size: 13px;
                                      font-weight: bold;
                                      height: 32px;
                                      padding: 5px 10px;
                                      text-decoration: none;
                                      margin: 2px;
                                  }
                                  .pagination span.disabled {
                                      border: 1px solid #EEEEEE;
                                      color: #DDDDDD;
                                      margin: 2px;
                                      padding: 2px 5px;
                                  }

                                  .sidebar .well {
                                    padding: 5px !important;
                                }

                                .sidebar .well {
                                  margin-bottom: 5px !important;
                               }

                               /* side bar */
.sidebar .media-object {
  width: 85px !important;
  height: 85px !important;
  object-fit: cover;
}
.sidebar .blog-listing-one p {
  color: rgba(0, 0, 0, 0.7);
  font-family: 'Roboto Slab', serif;
  font-size: 14px;
  padding-top: 0px;
  padding-bottom: 5px;
  margin-bottom: 0;
}
.sidebar .well {
  padding: 5px !important;
}
.sidebar-hr {
  border-top: 1px solid #e8e8e8;
  padding-top: 10px;
}
.list-inline.list-unstyled span {
  font-size: 12px;
  color: rgb(142, 139, 139);
}
.sidebar .well {
  margin-bottom: 5px !important;
}
.sidebar .head:after {
  border-bottom: 2px solid #e81110;
  z-index: 9999;
  position: absolute;
  content: "";
  height: 2px;
  width: 200px;
  left: 20px;
  right: 0;
  display: block;
  margin-bottom: 18px;
}
.sidebar .panel-info {
  border-color: #f1f1f1;
  margin-top: 20px;
}

.media-heading{


  font-size: 16px;
}

a:hover{
  color: #000000;

  text-decoration: none;
}


a {
  color: #000000;
  text-decoration: none;
  
}

.espacio{

  margin-top: 18px;
}

.nav-link:hover {
    color: #fff!important;
}

.active{


  border-bottom: 3px solid red;
}

.navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show>.nav-link {
  color: #757575;
  font-weight: 700;
}

.navbar-light .navbar-nav .nav-link {
  color: #d0d0d0;
  font-weight: 700;
}

@media (min-width: 992px){
.navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 0.9rem;
    padding-left: 0.9rem;
}}


.navbar-brand {

  margin-right: 3rem;

}


.navbar-light .navbar-nav .nav-link {
    color: #757575;
    font-weight: 700;
}


@media (min-width: 992px){
.container, .container-lg, .container-md, .container-sm {
    max-width: 1140px;
}
}