
/* KV 底色
#banner{
  background-color: #aaaaaa;
}

/*用來裁剪banner使它看起來像是有下斜角
.wrapper.spotlight.style1:before{
    background-color: #aaaaaa;
}*/


/*第一段*/


.wrapper.spotlight.style1{
    background-color: #ffdca7;
}

.wrapper.spotlight.style1:before{
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon points='0,100 100,0 100,100' style='fill:%23ffdca7%3B' /%3E%3C/svg%3E");

    box-shadow: inset 0 -2px 0 0 #ffdca7, 0 1px 0 0 #ffdca7;
}

.wrapper.spotlight.style1:after{
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon points='0,100 100,0 100,100' style='fill:%23ffdca7%3B' /%3E%3C/svg%3E");

    box-shadow: inset 0 -2px 0 0 #ffdca7, 0 1px 0 0 #ffdca7;
}


/*第二段*/


.wrapper.spotlight.style2{
    background-color: #f8b551;
}

.wrapper.spotlight.style2:before{
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon points='0,100 100,0 100,100' style='fill:%23f8b551%3B' /%3E%3C/svg%3E");

    box-shadow: inset 0 -2px 0 0 #f8b551, 0 1px 0 0 #f8b551;
}

.wrapper.spotlight.style2:after{
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon points='0,100 100,0 100,100' style='fill:%23f8b551%3B' /%3E%3C/svg%3E");

    box-shadow: inset 0 -2px 0 0 #f8b551, 0 1px 0 0 #f8b551;

}
/*第三段*/

.wrapper.spotlight.style3{
    background-color: #ffdca7;
}

.wrapper.spotlight.style3:before{
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon points='0,100 100,0 100,100' style='fill:%23ffdca7%3B' /%3E%3C/svg%3E");

    box-shadow: inset 0 -2px 0 0 #ffdca7, 0 1px 0 0 #ffdca7;
}

.wrapper.spotlight.style3:after{
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon points='0,100 100,0 100,100' style='fill:%23ffdca7%3B' /%3E%3C/svg%3E");

    box-shadow: inset 0 -2px 0 0 #ffdca7, 0 1px 0 0 #ffdca7;
}


/*第四段*/


/* .wrapper.alt.style1{
    background-color: #75001d;
}

.wrapper.alt.style1:before{
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon points='0,100 100,0 100,100' style='fill:%2375001d%3B' /%3E%3C/svg%3E");

    box-shadow: inset 0 -2px 0 0 #75001d, 0 1px 0 0 #75001d;
}

.wrapper.alt.style1:after{
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon points='0,100 100,0 100,100' style='fill:%2375001d%3B' /%3E%3C/svg%3E");

    box-shadow: inset 0 -2px 0 0 #75001d, 0 1px 0 0 #75001d;
} */

#header{
    padding: 0;
    margin-top: -4px;
    height: 33px;
}

#footer{
    background-color: #d28ea0;
}
@media (max-width: 768px){
    .wrapper-topbar a:hover{
        background-color: #DC4776;
    }
    #header .wrapper-topbar{
        margin-bottom: -3px;
    }
}
