footer {
   position: fixed;
   bottom: 0px;
   left: 0px;
   width: 100%;
   background-color: #333;
   margin-top: 30px;
   z-index: -1;
}

.contents {
   height: 306.88px;
   width: 90%;
   list-style-type: none;
   margin: auto;
   padding: 0px;
   display: flex;
   -ms-display: flex;
   -moz-display: flex;
   -webkit-display: flex;
   justify-content: space-around;
   transition: all 1s;
   -moz-transition: all 1s;
   -webkit-transition: all 1s;
   z-index: 1;
}

.contents-outter {
   border-top: 1px solid #FFF1;
   border-bottom: 1px solid #FFF2;
   overflow-y: hidden;
}

.div-containter {
   z-index: 0;
}

.div-bar {
   width: 90%;
   height: 60px;
   margin: auto;
   padding: 5px;
   display: flex;
   -ms-display: flex;
   -moz-display: flex;
   -webkit-display: flex;
   background-color: #333;
   text-align: center;
   align-items: center;
   justify-content: center;
   z-index: 10;
}

.div-bar-logo {
   height: calc(100% - 10px);
   width: calc((100% / 3) - 10px);
}

#bg1 {
   background-image: url("../img/logos/01.png");
   -o-background-image: url("../img/logos/01.png");
   -moz-background-image: url("../img/logos/01.png");
   -webkit-background-image: url("../img/logos/01.png");
   background-size: contain;
   background-repeat: no-repeat;
   background-position: center;
   cursor: pointer;
}

#bg2 {
   background-image: url("../img/logos/02.png");
   -o-background-image: url("../img/logos/02.png");
   -moz-background-image: url("../img/logos/02.png");
   -webkit-background-image: url("../img/logos/02.png");
   background-size: contain;
   background-repeat: no-repeat;
   background-position: center;
}

#bg3 {
   background-image: url("../img/logos/04.png");
   -o-background-image: url("../img/logos/04.png");
   -moz-background-image: url("../img/logos/04.png");
   -webkit-background-image: url("../img/logos/04.png");
   background-size: contain;
   background-repeat: no-repeat;
   background-position: center;
}

.vertical {
   display: grid;
   margin-bottom: auto;
}

footer a, footer p, .footer a, .footer p {
   font-size: 14px;
   line-height: 10px;
}

.link, .text, h5 {
   line-height: 15px;
   color: #DDD;
}

.contents .link, .contents .text, .contents h5 {
   z-index: 0;
}

.link, .text {
   margin: 10px;
}

.link {
   cursor: pointer;
}

.div-bar .text {
   margin-right: 0px;
}

.creditos {
   text-decoration: underline;
   cursor: pointer;
   font-size: 14px;
   color: #DDD;
   margin: 10px;
   margin-left: 0px;
}

@media screen and (max-width: 760px) {
   .contents {
      height: 0px;
      transition: all 1s;
      -moz-transition: all 1s;
      -webkit-transition: all 1s;
      z-index: -999;
   }
}


@media screen and (max-width: 760px) {
   .div-bar {
      width: 100%;
   }
}