/* Loading */
.loading {
    background-color: rgba(0, 76, 97, 1);
}
.loading div {
    color: #fff;
}

.rgba {
    background-color: rgba(0, 0, 0, .75);
}
.rgba:hover {
    background-color: rgba(0, 0, 0, .0);
}

.rgba:hover div {
    border-right: 7px solid #004c61;
}
.rgba:hover div.bottom {
    border-bottom: 7px solid #004c61;
}

.rgba p, .rgba:hover a {
    color: #fff;
}
.rgba:hover a#c004c61 {
    color: #004c61;
}

.rgba:hover a.c004c61 {
    background-color: rgba(0, 76, 97, .75);
}
.rgba:hover a.c004c61:hover {
    background-color: rgba(0, 180, 230, .75);
}

.bi.m1 {
    background-image: url(img/m1.gif);
}
.bi.m2 {
    background-image: url(img/m2s.gif);
}

.bi.s1 {
    background-image: url(img/s1s.gif);
}
.bi.s2 {
    background-image: url(img/s1.gif);
}
.bi.s3 {
    background-image: url(img/s3s.gif);
}

.bi.b {
    background-image: url(img/b.gif);
}

/*
.bi.b1 {
    background-image: url(img/b1.gif);
}
.bi.b2 {
    background-image: url(img/b2.gif);
}
.bi.b3 {
    background-image: url(img/b3.gif);
}
.bi.b4 {
    background-image: url(img/b4.gif);
}

.bi:hover {
    background-image: url(img/bi.gif);
}

.bi.m1:hover {
    background-image: url(img/m1s.gif);
}
.bi.m2:hover {
    background-image: url(img/m2s.gif);
}

.bi.s1:hover {
    background-image: url(img/s1s.gif);
}
.bi.s2:hover {
    background-image: url(img/s2s.gif);
}
.bi.s3:hover {
    background-image: url(img/s3s.gif);
}
*/

/* 右上方按鍵，圖片 */
.button .fa-stack-2x {
    color: rgba(0, 76, 97, .75);
}
.header, .button, .button .fa-stack-1x {
    color: #fff;
}

.button:hover .fa-stack-2x {
    color: transparent;
}
.button:hover, .button:hover .fa-stack-1x {
    color: rgba(0, 180, 230, .95);
}

.ig {
    background: -webkit-linear-gradient(45deg, #fcaf45, #e1306c, #405de6);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

@media (max-width: 767px) {
    .bi.b1 {
        background-image: url(img/bs1.gif);
    }
    .bi.b2 {
        background-image: url(img/bs2.gif);
    }
    .bi.b3 {
        background-image: url(img/bs3.gif);
    }
    .bi.b4 {
        background-image: url(img/bs4.gif);
    }

    .rgba:hover div {
        border-right: none;
        border-bottom: 7px solid #004c61;
    }
    .rgba:hover div.bottom {
        border-bottom: none;
    }
}

@media (max-width: 499px) {
    none {
        display: none;
    }
}