@charset "UTF-8";
img {
    width: 100%;
    display: inline-block;
    margin: inherit auto;
}

table {
    width: 100%;
}

th,
td {
    vertical-align: middle;
}

a,
a * {
    transition: all 0.15s ease-in-out;
    color: inherit;
}

#page {
    overflow: hidden;
    position: relative;
}

#page section {
    padding: 3em 0.5em;
    margin: 0;
}

#page article {
    max-width: 900px;
    margin: 0 auto;
}

#buttones {
    padding-bottom: 5em !important;
}

.rounded-2xs {
    border-radius: 0.5em !important;
}

.rounded-xs {
    border-radius: 0.8em !important;
}

.rounded-1x {
    border-radius: 1em !important;
}

.rounded-2x {
    border-radius: 1.5em !important;
}

.roundedx {
    border-radius: 3em !important;
}

.rounded-4x {
    border-radius: 4em !important;
}

.rounded-top {
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.rounded-bottom {
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
}

.rounded-left {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.rounded-right {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}


/******** #a03-3 外交特考講座********/

#a03-3 h4 {
    font-size: 1.2em;
}

#a03-3 h5.months {
    font-size: 1.4em;
    font-weight: 900;
    color: #024059;
    background-color: #FFB941;
    padding: .2em 1em;
    display: inline-block;
}

#a03-3 .card-body,
#a03-3 .card-footer {
    width: 100%;
}

#a03-3 .card-body {
    overflow: hidden;
    padding: 1em 1em 1em 1em !important;
    background-color: #024059;
    color: #fff
}

#a03-3 .card-body.newtag {
    position: relative;
}

#a03-3 .card-body.newtag::after {
    content: "New";
    position: absolute;
    top: -1px;
    left: 2em;
    width: 3em;
    height: 3em;
    background-color: #e74c3c;
    color: #fff;
    border-top-right-radius: 2px;
    display: -ms-flexbox !important;
    display: flex !important;
    -ms-flex-align: center !important;
    align-items: center !important;
    -ms-flex-pack: center !important;
    justify-content: center !important;
}

#a03-3 .card-footer {
    width: 100%;
}

.bnn3 { width: 100%;    margin: 0 auto;    padding: 0.3%;}
.bnn3 ul { list-style: none; text-align: center;}
.bnn3 li { width: 60%; margin: 1%; padding: 1%; font-size: 28px; font-weight: bold;
    color: #FFFFFF;    display: inline-block; background-color: #000; border-radius: 30px;}
.bnn3 li a { display: block; color: #FFFFFF; text-decoration: none;}

/*-------------------------------------END-顏色-----------------------------------------*/

#ban {
    background: linear-gradient(to top, #769bbe8c, #34789a55, transparent), url(../images/ban-BG.jpg) center/cover;
}

#a00 {
    background: linear-gradient(to bottom, #0240598c, #00aaff55, #fff), url(../images/01-BG.jpg) center/cover fixed;
}

#a01 {
    background: linear-gradient(to bottom, #88bdd38c, #3f9cca55, #fff), url(../images/01-BG.jpg) center/cover fixed, url(../images/01-BG.jpg) center/100% 100%;
}

#a02 {
    background: linear-gradient(to top, #f2e08855, #22362a55, #ceeefe55, #fff), url(../images/02-BG.jpg) center/cover;
}

#a03 {
    background: linear-gradient(to top, #ffffff55, #babf9355, #d9d0c155, transparent), url(../images/04-BG.jpg) right center/cover fixed, url(../images/04-BG.jpg) right center/cover;
}

#a04 {
    background: linear-gradient(to top, #ffffff55, #f1f4deb0, #f2e9db99, transparent), url(../images/03-BG.jpg) center center/cover;
}

#a05 {
    background: linear-gradient(to top, #000000, transparent), url(../images/05-BG.jpg) right center/cover;
}

#a06 {
    background: linear-gradient(to bottom, #000000, #000000aa, #000000aa), url(../images/06-BG.jpg) right center/cover;
    color: white;
}

@media screen and (max-width: 767px) {
    .bnn3 {
        width: 100%;
        margin: 0 auto;
        padding: 1%;
    }
	.bnn3 ul {
        list-style: none;
        text-align: center;
    }
	.bnn3 li {
        width: 65%;
        margin: 1%;
        padding: 1%;
        font-size: 16px;
        font-weight: bold;
        color: #FFFFFF;
        display: inline-block;
        background-color: #000;
        border-radius: 15px;
    }
	.bnn3 li a {
        display: block;
        color: #FFFFFF;
        text-decoration: none;
    }
}
#a07 {
    background: linear-gradient(to right, #ffffff55, #ffffff55), url(../images/07-BG.jpg) center/cover fixed, url(../images/07-BG.jpg) center/cover;
}


/*-----------------------------------------按鈕-----------------------------------------*/


/*留單按鈕 OR 前往各班按鈕*/

.go_btn,
.more_btn {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    display: block;
    outline: 0;
    line-height: 1.25;
    vertical-align: middle;
    text-decoration: none;
    text-align: center;
    cursor: pointer;
    text-align: center;
    transition: all 0.15s ease-in-out;
    display: inline-block;
    position: relative;
}

.more_btn,
.go_btn {
    background: #ffffff99;
    padding: 0.125em 1em;
    margin: 0.25em;
    border: 0.2rem solid;
    border-radius: 1em;
}

.more_btn {
    width: 15em;
    max-width: 80vw;
}

#btns a {
    position: relative;
}

.more_btn:before,
#btns a:before {
    position: absolute;
    content: '';
    background: url(../images/index-icon.png) top center/contain no-repeat;
    transition: all 0.15s ease-in-out;
    width: 1.5em;
    height: 1.5em;
    left: calc(100% - 0.75em);
    bottom: calc(0% - 0.75em);
}

.more_btn:hover,
.go_btn:hover {
    box-shadow: inherit;
}

.more_btn:hover:before,
#btns a:hover:before {
    transform: scale(0);
}

.more_btn:hover,
.go_btn:hover,
#page .btn:hover {
    transform: translate(0.25em, 0.1em) scale(0.9);
    filter: drop-shadow(0 0 0.125rem white) drop-shadow(0 0 0.25rem #f7b730);
}

.more_btn:hover:after,
.btn:hover:after,
#page .btn:hover:after {
    transform: scale(0);
}

.more_btn.disabled,
.btn.disabled,
#ban .btn.disabled {
    transform: scale(0.9);
    filter: none;
}


/*滑動效果*/

.hvr-underline-from-left,
.hvr-underline-from-center {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    position: relative;
    /*overflow: hidden;*/
}

.hvr-underline-from-center:before,
.hvr-underline-from-left:before {
    background: #1bafeb;
    height: 0.125em;
}

.hvr-underline-from-center:before {
    content: '';
    position: absolute;
    z-index: -1;
    left: 51%;
    right: 51%;
    bottom: 0;
    -webkit-transition-property: left, right;
    transition-property: left, right;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}

.hvr-underline-from-center:hover:before,
.hvr-underline-from-center:focus:before,
.hvr-underline-from-center:active:before {
    left: 0;
    right: 0;
}


/*底部滑動橫條*/

#goTop {
    position: fixed;
    bottom: 5em;
    right: 1em;
    width: 3em;
    height: 3em;
    padding: 0.5em;
}

#SocialLinks .btn {
    font-weight: 700;
    border: 0;
    filter: drop-shadow(0 -1px 3em rgba(0, 0, 0, 01));
    font-size: 1.75em;
}

#SocialLinks .btn.green {
    background: -webkit-linear-gradient(35deg, #8fcc35, #62aa00);
    background: -o-linear-gradient(35deg, #8fcc35, #62aa00);
    background: linear-gradient(125deg, #8fcc35, #62aa00);
}

#SocialLinks .btn.blue {
    background: -webkit-linear-gradient(35deg, #5c80e1, #3b60c4);
    background: -o-linear-gradient(35deg, #5c80e1, #3b60c4);
    background: linear-gradient(125deg, #5c80e1, #3b60c4);
}

.offcanvas-bottom {
    height: inherit;
    padding-bottom: 3em;
}

#topNavbar {
    animation-name: fadeInDown;
    animation-duration: 0.75s;
    animation-fill-mode: both;
}

.float {
    position: fixed;
    bottom: 220px;
    right: 0;
    z-index: 6666;
    display: block;
}

.float h3 {
    color: #161C2E;
}

.float_box {
    position: relative;
    background: #FFB941;
    padding: 15px;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(51, 51, 51, 0.4);
    margin-right: 15px;
    text-align: center;
}

.btn_close {
    background: #161C2E;
    display: inline-block;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    vertical-align: middle;
    color: #fff;
    font-size: 1.4em;
    border-radius: 50px;
    position: absolute;
    top: -25px;
    right: -15px;
    cursor: pointer;
}

.float_box_tips {
    display: none;
    width: 50px;
    text-align: center;
    line-height: 1;
    font-size: 1rem;
    background: #009c2f;
    padding: 5px 10px 5px 10px;
    border-radius: 5px 0 0 5px;
    cursor: pointer;
    color: #fff;
}

.float_box_tips:hover {
    background: #51b18c;
    color: #fff;
}

.float_box_tips a:hover {
    color: #fff!important;
}

.float_box_tips span {
    margin-left: -5px;
}


/*-------------------------------------END-按鈕-----------------------------------------*/


/*-----------------------------------------顏色-----------------------------------------*/


/* Colors */

.red,
.hover-red:hover {
    color: #fff !important;
    background-color: #e73418 !important;
}

.dark-red,
.hover-dark-red:hover {
    color: #fff !important;
    background-color: #981b03 !important;
}

.pale-red,
.hover-pale-red:hover {
    color: #000 !important;
    background-color: #f3d4d5 !important;
}

.pink,
.hover-pink:hover {
    color: #fff !important;
    background-color: #ae2b54 !important;
}

.orange,
.hover-orange:hover {
    color: #fff !important;
    background-color: #ec6b1a !important;
}

.deep-orange,
.hover-deep-orange:hover {
    color: #fff !important;
    background-color: #e83828 !important;
}

.pale-orange,
.hover-pale-orange:hover {
    color: #fff !important;
    background-color: #fa3900 !important;
}

.amber,
.hover-amber:hover {
    color: #000 !important;
    background-color: #f1bb1d !important;
}

.deep-amber,
.hover-deep-amber:hover {
    color: #fff !important;
    background-color: #f19600 !important;
}

.pale-amber,
.hover-pale-amber:hover {
    color: #000 !important;
    background-color: #f7cb83 !important;
}

.sand,
.hover-sand:hover {
    color: #000 !important;
    background-color: #fcddb0 !important;
}

.khaki,
.hover-khaki:hover {
    color: #000 !important;
    background-color: #f2e088 !important;
}

.yellow,
.hover-yellow:hover {
    color: #000 !important;
    background-color: #ffff00 !important;
}

.pale-yellow,
.hover-pale-yellow:hover {
    color: #000 !important;
    background-color: #fffaec !important;
}

.green,
.hover-green:hover {
    color: #fff !important;
    background-color: #034001 !important;
}

.pale-green,
.hover-pale-green:hover {
    color: #000 !important;
    background-color: #cce9da !important;
}

.light-green,
.hover-light-green:hover {
    color: #fff !important;
    background-color: #93a623 !important;
}

.lime,
.hover-lime:hover {
    color: #000 !important;
    background-color: #00ff00 !important;
}

.teal,
.hover-teal:hover {
    color: #fff !important;
    background-color: #009399 !important;
}

.pale-teal,
.hover-pale-teal:hover {
    color: #000 !important;
    background-color: #c1d4d9 !important;
}

.aqua,
.hover-aqua:hover {
    color: #000 !important;
    background-color: #00ffff !important;
}

.cyan,
.hover-cyan:hover {
    color: #fff !important;
    background-color: #2a9afe !important;
}

.light-blue,
.hover-light-blue:hover {
    color: #000 !important;
    background-color: #b4c5e2 !important;
}

.blue,
.hover-blue:hover {
    color: #fff !important;
    background-color: #0352b7 !important;
}

.pale-blue,
.hover-pale-blue:hover {
    color: #000 !important;
    background-color: #c1d4d9 !important;
}

.indigo,
.hover-indigo:hover {
    color: #fff !important;
    background-color: #024059 !important;
}

.pale-indigo,
.hover-pale-indigo:hover {
    color: #fff !important;
    background-color: #537d8e !important;
}

.deep-purple,
.hover-deep-purple:hover {
    color: #fff !important;
    background-color: #796bae !important;
}

.purple,
.hover-purple:hover {
    color: #fff !important;
    background-color: #822662 !important;
}

.pale-purple,
.hover-pale-purple:hover {
    color: #000 !important;
    background-color: #d2cde6 !important;
}

.brown,
.hover-brown:hover {
    color: #fff !important;
    background-color: #a67a55 !important;
}

.dark-brown,
.hover-dark-brown:hover {
    color: #fff !important;
    background-color: #6a3906 !important;
}

.pale-brown,
.hover-pale-brown:hover {
    color: #000 !important;
    background-color: #e5d8cd !important;
}

.dark-goldenrod,
.hover-dark-goldenrod:hover {
    color: #fff !important;
    background-color: #c9a063 !important;
}

.goldenrod,
.hover-goldenrod:hover {
    color: #000 !important;
    background-color: #8e6540 !important;
}

.blue-grey,
.hover-blue-grey:hover,
.blue-gray,
.hover-blue-gray:hover {
    color: #000 !important;
    background-color: #a0b1b9 !important;
}

.grey,
.hover-grey:hover,
.gray,
.hover-gray:hover {
    color: #000 !important;
    background-color: #9e9e9e !important;
}

.light-grey,
.hover-light-grey:hover,
.light-gray,
.hover-light-gray:hover {
    color: #000 !important;
    background-color: #e6e6e6 !important;
}

.dark-grey,
.hover-dark-grey:hover,
.dark-gray,
.hover-dark-gray:hover {
    color: #fff !important;
    background-color: #616161 !important;
}

.black,
.hover-black:hover {
    color: #fff !important;
    background-color: #000 !important;
}

.white,
.hover-white:hover {
    color: #000 !important;
    background-color: #fff !important;
}

.text-red,
.hover-text-red:hover {
    color: #c30d23 !important;
}

.text-dark-red,
.hover-text-dark-red:hover {
    color: #981b03 !important;
}

.text-pale-red,
.hover-text-pale-red:hover {
    color: #f3a4a3 !important;
}

.text-pink,
.hover-text-pink:hover {
    color: #ae2b54 !important;
}

.text-orange,
.hover-text-orange:hover {
    color: #e85514 !important;
}

.text-deep-orange,
.hover-text-deep-orange:hover {
    color: #e83828 !important;
}

.text-pale-orange,
.hover-text-pale-orange:hover {
    color: #fa3900 !important;
}

.text-amber,
.hover-text-amber:hover {
    color: #6a1b0f !important;
}

.text-deep-amber,
.hover-text-deep-amber:hover {
    color: #f19600 !important;
}

.text-pale-amber,
.hover-text-pale-amber:hover {
    color: #f7cb83 !important;
}

.text-sand,
.hover-text-sand:hover {
    color: #fcddb0 !important;
}

.text-khaki,
.hover-text-khaki:hover {
    color: #f2e088 !important;
}

.text-yellow,
.hover-text-yellow:hover {
    color: #ffff00 !important;
}

.text-pale-yellow,
.hover-text-pale-yellow:hover {
    color: #fffaec !important;
}

.text-green,
.hover-text-green:hover {
    color: #034001 !important;
}

.text-pale-green,
.hover-text-pale-green:hover {
    color: #cce9da !important;
}

.text-light-green,
.hover-text-light-green:hover {
    color: #93a623 !important;
}

.text-lime,
.hover-text-lime:hover {
    color: #00ff00 !important;
}

.text-teal,
.hover-text-teal:hover {
    color: #009399 !important;
}

.text-pale-teal,
.hover-text-pale-teal:hover {
    color: #c1d4d9 !important;
}

.text-aqua,
.hover-text-aqua:hover {
    color: #00ffff !important;
}

.text-cyan,
.hover-text-cyan:hover {
    color: #2a9afe !important;
}

.text-light-blue,
.hover-text-light-blue:hover {
    color: #b4c5e2 !important;
}

.text-blue,
.hover-text-blue:hover {
    color: #0352b7 !important;
}

.text-pale-blue,
.hover-text-pale-blue:hover {
    color: #c1d4d9 !important;
}

.text-indigo,
.hover-text-indigo:hover {
    color: #024059 !important;
}

.text-pale-indigo,
.hover-text-pale-indigo:hover {
    color: #537d8e !important;
}

.text-deep-purple,
.hover-text-deep-purple:hover {
    color: #796bae !important;
}

.text-purple,
.hover-text-purple:hover {
    color: #822662 !important;
}

.text-pale-purple,
.hover-text-pale-purple:hover {
    color: #d2cde6 !important;
}

.text-brown,
.hover-text-brown:hover {
    color: #a67a55 !important;
}

.text-dark-brown,
.hover-text-dark-brown:hover {
    color: #6a3906 !important;
}

.text-pale-brown,
.hover-text-pale-brown:hover {
    color: #e5d8cd !important;
}

.text-dark-goldenrod,
.hover-text-dark-goldenrod:hover {
    color: #c9a063 !important;
}

.text-goldenrod,
.hover-text-goldenrod:hover {
    color: #8e6540 !important;
}

.text-blue-grey,
.hover-text-blue-grey:hover,
.text-blue-gray,
.hover-text-blue-gray:hover {
    color: #a0b1b9 !important;
}

.text-grey,
.hover-text-grey:hover,
.text-gray,
.hover-text-gray:hover {
    color: #9e9e9e !important;
}

.text-light-grey,
.hover-text-light-grey:hover,
.text-light-gray,
.hover-text-light-gray:hover {
    color: #e6e6e6 !important;
}

.text-dark-grey,
.hover-text-dark-grey:hover,
.text-dark-gray,
.hover-text-dark-gray:hover {
    color: #616161 !important;
}

.text-black,
.hover-text-black:hover {
    color: #000 !important;
}

.text-white,
.hover-text-white:hover {
    color: #fff !important;
}


/*[class*="border-"]{border:0.1rem solid}*/

.bordered {
    border: 0.125rem solid !important;
}

.bordered-xs {
    border: 0.5rem solid !important;
}

.bordered-2xs {
    border: 0.25rem solid !important;
}

.bordered-top {
    border-bottom: 0 !important;
    border-right: 0 !important;
    border-left: 0 !important;
}

.bordered-bottom {
    border-top: 0 !important;
    border-right: 0 !important;
    border-left: 0 !important;
}

.bordered-left {
    border-right: 0 !important;
    order-bottom: 0 !important;
    border-top: 0 !important;
}

.bordered-right {
    border-left: 0 !important;
    order-bottom: 0 !important;
    border-top: 0 !important;
}

.border-red,
.hover-border-red:hover {
    border-color: #c30d23 !important;
}

.border-dark-red,
.hover-border-dark-red:hover {
    border-color: #981b03 !important;
}

.border-pale-red,
.hover-border-pale-red:hover {
    border-color: #f3a4a3 !important;
}

.border-pink,
.hover-border-pink:hover {
    border-color: #ae2b54 !important;
}

.border-orange,
.hover-border-orange:hover {
    border-color: #e85514 !important;
}

.border-deep-orange,
.hover-border-deep-orange:hover {
    border-color: #e83828 !important;
}

.border-pale-orange,
.hover-border-pale-orange:hover {
    border-color: #fa3900 !important;
}

.border-amber,
.hover-border-amber:hover {
    border-color: #f1bb1d !important;
}

.border-deep-amber,
.hover-border-deep-amber:hover {
    border-color: #f19600 !important;
}

.border-pale-amber,
.hover-border-pale-amber:hover {
    border-color: #f7cb83 !important;
}

.border-sand,
.hover-border-sand:hover {
    border-color: #fcddb0 !important;
}

.border-khaki,
.hover-border-khaki:hover {
    border-color: #f2e088 !important;
}

.border-yellow,
.hover-border-yellow:hover {
    border-color: #ffff00 !important;
}

.border-pale-yellow,
.hover-border-pale-yellow:hover {
    border-color: #fffaec !important;
}

.border-green,
.hover-border-green:hover {
    border-color: #034001 !important;
}

.border-pale-green,
.hover-border-pale-green:hover {
    border-color: #cce9da !important;
}

.border-light-green,
.hover-border-light-green:hover {
    border-color: #93a623 !important;
}

.border-lime,
.hover-border-lime:hover {
    border-color: #00ff00 !important;
}

.border-teal,
.hover-border-teal:hover {
    border-color: #009399 !important;
}

.border-pale-teal,
.hover-border-pale-teal:hover {
    border-color: #c1d4d9 !important;
}

.border-aqua,
.hover-border-aqua:hover {
    border-color: #00ffff !important;
}

.border-cyan,
.hover-border-cyan:hover {
    border-color: #2a9afe !important;
}

.border-light-blue,
.hover-border-light-blue:hover {
    border-color: #b4c5e2 !important;
}

.border-blue,
.hover-border-blue:hover {
    border-color: #96c6d9 !important;
}

.border-pale-blue,
.hover-border-pale-blue:hover {
    border-color: #c1d4d9 !important;
}

.border-indigo,
.hover-border-indigo:hover {
    border-color: #024059 !important;
}

.border-pale-indigo,
.hover-border-pale-indigo:hover {
    border-color: #537d8e !important;
}

.border-deep-purple,
.hover-border-deep-purple:hover {
    border-color: #796bae !important;
}

.border-purple,
.hover-border-purple:hover {
    border-color: #822662 !important;
}

.border-pale-purple,
.hover-border-pale-purple:hover {
    border-color: #d2cde6 !important;
}

.border-brown,
.hover-border-brown:hover {
    border-color: #a67a55 !important;
}

.border-dark-brown,
.hover-border-dark-brown:hover {
    border-color: #6a3906 !important;
}

.border-pale-brown,
.hover-border-pale-brown:hover {
    border-color: #e5d8cd !important;
}

.border-dark-goldenrod,
.hover-border-dark-goldenrod:hover {
    border-color: #c9a063 !important;
}

.border-goldenrod,
.hover-border-goldenrod:hover {
    border-color: #8e6540 !important;
}

.border-blue-grey,
.hover-border-blue-grey:hover,
.border-blue-gray,
.hover-border-blue-gray:hover {
    border-color: #a0b1b9 !important;
}

.border-grey,
.hover-border-grey:hover,
.border-gray,
.hover-border-gray:hover {
    border-color: #9e9e9e !important;
}

.border-light-grey,
.hover-border-light-grey:hover,
.border-light-gray,
.hover-border-light-gray:hover {
    border-color: #e6e6e6 !important;
}

.border-dark-grey,
.hover-border-dark-grey:hover,
.border-dark-gray,
.hover-border-dark-gray:hover {
    border-color: #616161 !important;
}

.border-black,
.hover-border-black:hover {
    border-color: #000 !important;
}

.border-white,
.hover-border-white:hover {
    border-color: #fff !important;
}

.stroke-red,
.hover-stroke-red:hover {
    color: #fff;
    text-shadow: 0 0 0.125em #c30d23, 0 0 0.125em #c30d23, 0 0 0.125em #c30d23, 0 0 0.125em #c30d23, 0 0 0.125em #c30d23, 0 0 0.125em #c30d23, 0 0 0.125em #c30d23, 0 0 0.125em #c30d23, 0 0 0.125em #c30d23, 0 0 0.125em #c30d23, 0 0 0.125em #c30d23, 0 0 0.125em #c30d23, 0 0 0.125em #c30d23, 0 0 0.125em #c30d23, 0 0 0.125em #c30d23, 0 0 0.125em #c30d23, 0 0 0.125em #c30d23, 0 0 0.125em #c30d23, 0 0 0.125em #c30d23, 0 0 0.125em #c30d23;
}

.stroke-dark-red,
.hover-stroke-dark-red:hover {
    color: #fff;
    text-shadow: 0 0 0.125em #981b03, 0 0 0.125em #981b03, 0 0 0.125em #981b03, 0 0 0.125em #981b03, 0 0 0.125em #981b03, 0 0 0.125em #981b03, 0 0 0.125em #981b03, 0 0 0.125em #981b03, 0 0 0.125em #981b03, 0 0 0.125em #981b03, 0 0 0.125em #981b03, 0 0 0.125em #981b03, 0 0 0.125em #981b03, 0 0 0.125em #981b03, 0 0 0.125em #981b03, 0 0 0.125em #981b03, 0 0 0.125em #981b03, 0 0 0.125em #981b03, 0 0 0.125em #981b03, 0 0 0.125em #981b03;
}

.stroke-pale-red,
.hover-stroke-pale-red:hover {
    color: #000;
    text-shadow: 0 0 0.125em #f3a4a3, 0 0 0.125em #f3a4a3, 0 0 0.125em #f3a4a3, 0 0 0.125em #f3a4a3, 0 0 0.125em #f3a4a3, 0 0 0.125em #f3a4a3, 0 0 0.125em #f3a4a3, 0 0 0.125em #f3a4a3, 0 0 0.125em #f3a4a3, 0 0 0.125em #f3a4a3, 0 0 0.125em #f3a4a3, 0 0 0.125em #f3a4a3, 0 0 0.125em #f3a4a3, 0 0 0.125em #f3a4a3, 0 0 0.125em #f3a4a3, 0 0 0.125em #f3a4a3, 0 0 0.125em #f3a4a3, 0 0 0.125em #f3a4a3, 0 0 0.125em #f3a4a3, 0 0 0.125em #f3a4a3;
}

.stroke-pink,
.hover-stroke-pink:hover {
    color: #fff;
    text-shadow: 0 0 0.125em #ae2b54, 0 0 0.125em #ae2b54, 0 0 0.125em #ae2b54, 0 0 0.125em #ae2b54, 0 0 0.125em #ae2b54, 0 0 0.125em #ae2b54, 0 0 0.125em #ae2b54, 0 0 0.125em #ae2b54, 0 0 0.125em #ae2b54, 0 0 0.125em #ae2b54, 0 0 0.125em #ae2b54, 0 0 0.125em #ae2b54, 0 0 0.125em #ae2b54, 0 0 0.125em #ae2b54, 0 0 0.125em #ae2b54, 0 0 0.125em #ae2b54, 0 0 0.125em #ae2b54, 0 0 0.125em #ae2b54, 0 0 0.125em #ae2b54, 0 0 0.125em #ae2b54;
}

.stroke-orange,
.hover-stroke-orange:hover {
    color: #fff;
    text-shadow: 0 0 0.125em #e85514, 0 0 0.125em #e85514, 0 0 0.125em #e85514, 0 0 0.125em #e85514, 0 0 0.125em #e85514, 0 0 0.125em #e85514, 0 0 0.125em #e85514, 0 0 0.125em #e85514, 0 0 0.125em #e85514, 0 0 0.125em #e85514, 0 0 0.125em #e85514, 0 0 0.125em #e85514, 0 0 0.125em #e85514, 0 0 0.125em #e85514, 0 0 0.125em #e85514, 0 0 0.125em #e85514, 0 0 0.125em #e85514, 0 0 0.125em #e85514, 0 0 0.125em #e85514, 0 0 0.125em #e85514;
}

.stroke-deep-orange,
.hover-stroke-deep-orange:hover {
    color: #fff;
    text-shadow: 0 0 0.125em #e83828, 0 0 0.125em #e83828, 0 0 0.125em #e83828, 0 0 0.125em #e83828, 0 0 0.125em #e83828, 0 0 0.125em #e83828, 0 0 0.125em #e83828, 0 0 0.125em #e83828, 0 0 0.125em #e83828, 0 0 0.125em #e83828, 0 0 0.125em #e83828, 0 0 0.125em #e83828, 0 0 0.125em #e83828, 0 0 0.125em #e83828, 0 0 0.125em #e83828, 0 0 0.125em #e83828, 0 0 0.125em #e83828, 0 0 0.125em #e83828, 0 0 0.125em #e83828, 0 0 0.125em #e83828;
}

.stroke-pale-orange,
.hover-stroke-pale-orange:hover {
    color: #fff;
    text-shadow: 0 0 0.125em #fa3900, 0 0 0.125em #fa3900, 0 0 0.125em #fa3900, 0 0 0.125em #fa3900, 0 0 0.125em #fa3900, 0 0 0.125em #fa3900, 0 0 0.125em #fa3900, 0 0 0.125em #fa3900, 0 0 0.125em #fa3900, 0 0 0.125em #fa3900, 0 0 0.125em #fa3900, 0 0 0.125em #fa3900, 0 0 0.125em #fa3900, 0 0 0.125em #fa3900, 0 0 0.125em #fa3900, 0 0 0.125em #fa3900, 0 0 0.125em #fa3900, 0 0 0.125em #fa3900, 0 0 0.125em #fa3900, 0 0 0.125em #fa3900;
}

.stroke-amber,
.hover-stroke-amber:hover {
    color: #000;
    text-shadow: 0 0 0.125em #f1bb1d, 0 0 0.125em #f1bb1d, 0 0 0.125em #f1bb1d, 0 0 0.125em #f1bb1d, 0 0 0.125em #f1bb1d, 0 0 0.125em #f1bb1d, 0 0 0.125em #f1bb1d, 0 0 0.125em #f1bb1d, 0 0 0.125em #f1bb1d, 0 0 0.125em #f1bb1d, 0 0 0.125em #f1bb1d, 0 0 0.125em #f1bb1d, 0 0 0.125em #f1bb1d, 0 0 0.125em #f1bb1d, 0 0 0.125em #f1bb1d, 0 0 0.125em #f1bb1d, 0 0 0.125em #f1bb1d, 0 0 0.125em #f1bb1d, 0 0 0.125em #f1bb1d, 0 0 0.125em #f1bb1d;
}

.stroke-deep-amber,
.hover-stroke-deep-amber:hover {
    color: #fff;
    text-shadow: 0 0 0.125em #f19600, 0 0 0.125em #f19600, 0 0 0.125em #f19600, 0 0 0.125em #f19600, 0 0 0.125em #f19600, 0 0 0.125em #f19600, 0 0 0.125em #f19600, 0 0 0.125em #f19600, 0 0 0.125em #f19600, 0 0 0.125em #f19600, 0 0 0.125em #f19600, 0 0 0.125em #f19600, 0 0 0.125em #f19600, 0 0 0.125em #f19600, 0 0 0.125em #f19600, 0 0 0.125em #f19600, 0 0 0.125em #f19600, 0 0 0.125em #f19600, 0 0 0.125em #f19600, 0 0 0.125em #f19600;
}

.stroke-pale-amber,
.hover-stroke-pale-amber:hover {
    color: #000;
    text-shadow: 0 0 0.125em #f7cb83, 0 0 0.125em #f7cb83, 0 0 0.125em #f7cb83, 0 0 0.125em #f7cb83, 0 0 0.125em #f7cb83, 0 0 0.125em #f7cb83, 0 0 0.125em #f7cb83, 0 0 0.125em #f7cb83, 0 0 0.125em #f7cb83, 0 0 0.125em #f7cb83, 0 0 0.125em #f7cb83, 0 0 0.125em #f7cb83, 0 0 0.125em #f7cb83, 0 0 0.125em #f7cb83, 0 0 0.125em #f7cb83, 0 0 0.125em #f7cb83, 0 0 0.125em #f7cb83, 0 0 0.125em #f7cb83, 0 0 0.125em #f7cb83, 0 0 0.125em #f7cb83;
}

.stroke-sand,
.hover-stroke-sand:hover {
    color: #000;
    text-shadow: 0 0 0.125em #fcddb0, 0 0 0.125em #fcddb0, 0 0 0.125em #fcddb0, 0 0 0.125em #fcddb0, 0 0 0.125em #fcddb0, 0 0 0.125em #fcddb0, 0 0 0.125em #fcddb0, 0 0 0.125em #fcddb0, 0 0 0.125em #fcddb0, 0 0 0.125em #fcddb0, 0 0 0.125em #fcddb0, 0 0 0.125em #fcddb0, 0 0 0.125em #fcddb0, 0 0 0.125em #fcddb0, 0 0 0.125em #fcddb0, 0 0 0.125em #fcddb0, 0 0 0.125em #fcddb0, 0 0 0.125em #fcddb0, 0 0 0.125em #fcddb0, 0 0 0.125em #fcddb0;
}

.stroke-khaki,
.hover-stroke-khaki:hover {
    color: #000;
    text-shadow: 0 0 0.125em #f2e088, 0 0 0.125em #f2e088, 0 0 0.125em #f2e088, 0 0 0.125em #f2e088, 0 0 0.125em #f2e088, 0 0 0.125em #f2e088, 0 0 0.125em #f2e088, 0 0 0.125em #f2e088, 0 0 0.125em #f2e088, 0 0 0.125em #f2e088, 0 0 0.125em #f2e088, 0 0 0.125em #f2e088, 0 0 0.125em #f2e088, 0 0 0.125em #f2e088, 0 0 0.125em #f2e088, 0 0 0.125em #f2e088, 0 0 0.125em #f2e088, 0 0 0.125em #f2e088, 0 0 0.125em #f2e088, 0 0 0.125em #f2e088;
}

.stroke-yellow,
.hover-stroke-yellow:hover {
    color: #000;
    text-shadow: 0 0 0.125em #ffff00, 0 0 0.125em #ffff00, 0 0 0.125em #ffff00, 0 0 0.125em #ffff00, 0 0 0.125em #ffff00, 0 0 0.125em #ffff00, 0 0 0.125em #ffff00, 0 0 0.125em #ffff00, 0 0 0.125em #ffff00, 0 0 0.125em #ffff00, 0 0 0.125em #ffff00, 0 0 0.125em #ffff00, 0 0 0.125em #ffff00, 0 0 0.125em #ffff00, 0 0 0.125em #ffff00, 0 0 0.125em #ffff00, 0 0 0.125em #ffff00, 0 0 0.125em #ffff00, 0 0 0.125em #ffff00, 0 0 0.125em #ffff00;
}

.stroke-pale-yellow,
.hover-stroke-pale-yellow:hover {
    color: #000;
    text-shadow: 0 0 0.125em #fffaec, 0 0 0.125em #fffaec, 0 0 0.125em #fffaec, 0 0 0.125em #fffaec, 0 0 0.125em #fffaec, 0 0 0.125em #fffaec, 0 0 0.125em #fffaec, 0 0 0.125em #fffaec, 0 0 0.125em #fffaec, 0 0 0.125em #fffaec, 0 0 0.125em #fffaec, 0 0 0.125em #fffaec, 0 0 0.125em #fffaec, 0 0 0.125em #fffaec, 0 0 0.125em #fffaec, 0 0 0.125em #fffaec, 0 0 0.125em #fffaec, 0 0 0.125em #fffaec, 0 0 0.125em #fffaec, 0 0 0.125em #fffaec;
}

.stroke-green,
.hover-stroke-green:hover {
    color: #fff;
    text-shadow: 0 0 0.125em #034001, 0 0 0.125em #034001, 0 0 0.125em #034001, 0 0 0.125em #034001, 0 0 0.125em #034001, 0 0 0.125em #034001, 0 0 0.125em #034001, 0 0 0.125em #034001, 0 0 0.125em #034001, 0 0 0.125em #034001, 0 0 0.125em #034001, 0 0 0.125em #034001, 0 0 0.125em #034001, 0 0 0.125em #034001, 0 0 0.125em #034001, 0 0 0.125em #034001, 0 0 0.125em #034001, 0 0 0.125em #034001, 0 0 0.125em #034001, 0 0 0.125em #034001;
}

.stroke-pale-green,
.hover-stroke-pale-green:hover {
    color: #000;
    text-shadow: 0 0 0.125em #cce9da, 0 0 0.125em #cce9da, 0 0 0.125em #cce9da, 0 0 0.125em #cce9da, 0 0 0.125em #cce9da, 0 0 0.125em #cce9da, 0 0 0.125em #cce9da, 0 0 0.125em #cce9da, 0 0 0.125em #cce9da, 0 0 0.125em #cce9da, 0 0 0.125em #cce9da, 0 0 0.125em #cce9da, 0 0 0.125em #cce9da, 0 0 0.125em #cce9da, 0 0 0.125em #cce9da, 0 0 0.125em #cce9da, 0 0 0.125em #cce9da, 0 0 0.125em #cce9da, 0 0 0.125em #cce9da, 0 0 0.125em #cce9da;
}

.stroke-light-green,
.hover-stroke-light-green:hover {
    color: #fff;
    text-shadow: 0 0 0.125em #93a623, 0 0 0.125em #93a623, 0 0 0.125em #93a623, 0 0 0.125em #93a623, 0 0 0.125em #93a623, 0 0 0.125em #93a623, 0 0 0.125em #93a623, 0 0 0.125em #93a623, 0 0 0.125em #93a623, 0 0 0.125em #93a623, 0 0 0.125em #93a623, 0 0 0.125em #93a623, 0 0 0.125em #93a623, 0 0 0.125em #93a623, 0 0 0.125em #93a623, 0 0 0.125em #93a623, 0 0 0.125em #93a623, 0 0 0.125em #93a623, 0 0 0.125em #93a623, 0 0 0.125em #93a623;
}

.stroke-lime,
.hover-stroke-lime:hover {
    color: #000;
    text-shadow: 0 0 0.125em #00ff00, 0 0 0.125em #00ff00, 0 0 0.125em #00ff00, 0 0 0.125em #00ff00, 0 0 0.125em #00ff00, 0 0 0.125em #00ff00, 0 0 0.125em #00ff00, 0 0 0.125em #00ff00, 0 0 0.125em #00ff00, 0 0 0.125em #00ff00, 0 0 0.125em #00ff00, 0 0 0.125em #00ff00, 0 0 0.125em #00ff00, 0 0 0.125em #00ff00, 0 0 0.125em #00ff00, 0 0 0.125em #00ff00, 0 0 0.125em #00ff00, 0 0 0.125em #00ff00, 0 0 0.125em #00ff00, 0 0 0.125em #00ff00;
}

.stroke-teal,
.hover-stroke-teal:hover {
    color: #fff;
    text-shadow: 0 0 0.125em #009399, 0 0 0.125em #009399, 0 0 0.125em #009399, 0 0 0.125em #009399, 0 0 0.125em #009399, 0 0 0.125em #009399, 0 0 0.125em #009399, 0 0 0.125em #009399, 0 0 0.125em #009399, 0 0 0.125em #009399, 0 0 0.125em #009399, 0 0 0.125em #009399, 0 0 0.125em #009399, 0 0 0.125em #009399, 0 0 0.125em #009399, 0 0 0.125em #009399, 0 0 0.125em #009399, 0 0 0.125em #009399, 0 0 0.125em #009399, 0 0 0.125em #009399;
}

.stroke-pale-teal,
.hover-stroke-pale-teal:hover {
    color: #000;
    text-shadow: 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9;
}

.stroke-aqua,
.hover-stroke-aqua:hover {
    color: #fff;
    text-shadow: 0 0 0.125em #00ffff, 0 0 0.125em #00ffff, 0 0 0.125em #00ffff, 0 0 0.125em #00ffff, 0 0 0.125em #00ffff, 0 0 0.125em #00ffff, 0 0 0.125em #00ffff, 0 0 0.125em #00ffff, 0 0 0.125em #00ffff, 0 0 0.125em #00ffff, 0 0 0.125em #00ffff, 0 0 0.125em #00ffff, 0 0 0.125em #00ffff, 0 0 0.125em #00ffff, 0 0 0.125em #00ffff, 0 0 0.125em #00ffff, 0 0 0.125em #00ffff, 0 0 0.125em #00ffff, 0 0 0.125em #00ffff, 0 0 0.125em #00ffff;
}

.stroke-cyan,
.hover-stroke-cyan:hover {
    color: #000;
    text-shadow: 0 0 0.125em #2a9afe, 0 0 0.125em #2a9afe, 0 0 0.125em #2a9afe, 0 0 0.125em #2a9afe, 0 0 0.125em #2a9afe, 0 0 0.125em #2a9afe, 0 0 0.125em #2a9afe, 0 0 0.125em #2a9afe, 0 0 0.125em #2a9afe, 0 0 0.125em #2a9afe, 0 0 0.125em #2a9afe, 0 0 0.125em #2a9afe, 0 0 0.125em #2a9afe, 0 0 0.125em #2a9afe, 0 0 0.125em #2a9afe, 0 0 0.125em #2a9afe, 0 0 0.125em #2a9afe, 0 0 0.125em #2a9afe, 0 0 0.125em #2a9afe, 0 0 0.125em #2a9afe;
}

.stroke-light-blue,
.hover-stroke-light-blue:hover {
    color: #000;
    text-shadow: 0 0 0.125em #b4c5e2, 0 0 0.125em #b4c5e2, 0 0 0.125em #b4c5e2, 0 0 0.125em #b4c5e2, 0 0 0.125em #b4c5e2, 0 0 0.125em #b4c5e2, 0 0 0.125em #b4c5e2, 0 0 0.125em #b4c5e2, 0 0 0.125em #b4c5e2, 0 0 0.125em #b4c5e2, 0 0 0.125em #b4c5e2, 0 0 0.125em #b4c5e2, 0 0 0.125em #b4c5e2, 0 0 0.125em #b4c5e2, 0 0 0.125em #b4c5e2, 0 0 0.125em #b4c5e2, 0 0 0.125em #b4c5e2, 0 0 0.125em #b4c5e2, 0 0 0.125em #b4c5e2, 0 0 0.125em #b4c5e2;
}

.stroke-blue,
.hover-stroke-blue:hover {
    color: #fff;
    text-shadow: 0 0 0.125em #96c6d9, 0 0 0.125em #96c6d9, 0 0 0.125em #96c6d9, 0 0 0.125em #96c6d9, 0 0 0.125em #96c6d9, 0 0 0.125em #96c6d9, 0 0 0.125em #96c6d9, 0 0 0.125em #96c6d9, 0 0 0.125em #96c6d9, 0 0 0.125em #96c6d9, 0 0 0.125em #96c6d9, 0 0 0.125em #96c6d9, 0 0 0.125em #96c6d9, 0 0 0.125em #96c6d9, 0 0 0.125em #96c6d9, 0 0 0.125em #96c6d9, 0 0 0.125em #96c6d9, 0 0 0.125em #96c6d9, 0 0 0.125em #96c6d9, 0 0 0.125em #96c6d9;
}

.stroke-pale-blue,
.hover-stroke-pale-blue:hover {
    color: #fff;
    text-shadow: 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9, 0 0 0.125em #c1d4d9;
}

.stroke-indigo,
.hover-stroke-indigo:hover {
    color: #fff;
    text-shadow: 0 0 0.125em #024059, 0 0 0.125em #024059, 0 0 0.125em #024059, 0 0 0.125em #024059, 0 0 0.125em #024059, 0 0 0.125em #024059, 0 0 0.125em #024059, 0 0 0.125em #024059, 0 0 0.125em #024059, 0 0 0.125em #024059, 0 0 0.125em #024059, 0 0 0.125em #024059, 0 0 0.125em #024059, 0 0 0.125em #024059, 0 0 0.125em #024059, 0 0 0.125em #024059, 0 0 0.125em #024059, 0 0 0.125em #024059, 0 0 0.125em #024059, 0 0 0.125em #024059;
}

.stroke-pale-indigo,
.hover-stroke-pale-indigo:hover {
    color: #000;
    text-shadow: 0 0 0.125em #537d8e, 0 0 0.125em #537d8e, 0 0 0.125em #537d8e, 0 0 0.125em #537d8e, 0 0 0.125em #537d8e, 0 0 0.125em #537d8e, 0 0 0.125em #537d8e, 0 0 0.125em #537d8e, 0 0 0.125em #537d8e, 0 0 0.125em #537d8e, 0 0 0.125em #537d8e, 0 0 0.125em #537d8e, 0 0 0.125em #537d8e, 0 0 0.125em #537d8e, 0 0 0.125em #537d8e, 0 0 0.125em #537d8e, 0 0 0.125em #537d8e, 0 0 0.125em #537d8e, 0 0 0.125em #537d8e, 0 0 0.125em #537d8e;
}

.stroke-deep-purple,
.hover-stroke-deep-purple:hover {
    color: #fff;
    text-shadow: 0 0 0.125em #796bae, 0 0 0.125em #796bae, 0 0 0.125em #796bae, 0 0 0.125em #796bae, 0 0 0.125em #796bae, 0 0 0.125em #796bae, 0 0 0.125em #796bae, 0 0 0.125em #796bae, 0 0 0.125em #796bae, 0 0 0.125em #796bae, 0 0 0.125em #796bae, 0 0 0.125em #796bae, 0 0 0.125em #796bae, 0 0 0.125em #796bae, 0 0 0.125em #796bae, 0 0 0.125em #796bae, 0 0 0.125em #796bae, 0 0 0.125em #796bae, 0 0 0.125em #796bae, 0 0 0.125em #796bae;
}

.stroke-purple,
.hover-stroke-purple:hover {
    color: #fff;
    text-shadow: 0 0 0.125em #822662, 0 0 0.125em #822662, 0 0 0.125em #822662, 0 0 0.125em #822662, 0 0 0.125em #822662, 0 0 0.125em #822662, 0 0 0.125em #822662, 0 0 0.125em #822662, 0 0 0.125em #822662, 0 0 0.125em #822662, 0 0 0.125em #822662, 0 0 0.125em #822662, 0 0 0.125em #822662, 0 0 0.125em #822662, 0 0 0.125em #822662, 0 0 0.125em #822662, 0 0 0.125em #822662, 0 0 0.125em #822662, 0 0 0.125em #822662, 0 0 0.125em #822662;
}

.stroke-pale-purple,
.hover-stroke-pale-purple:hover {
    color: #000;
    text-shadow: 0 0 0.125em #d2cde6, 0 0 0.125em #d2cde6, 0 0 0.125em #d2cde6, 0 0 0.125em #d2cde6, 0 0 0.125em #d2cde6, 0 0 0.125em #d2cde6, 0 0 0.125em #d2cde6, 0 0 0.125em #d2cde6, 0 0 0.125em #d2cde6, 0 0 0.125em #d2cde6, 0 0 0.125em #d2cde6, 0 0 0.125em #d2cde6, 0 0 0.125em #d2cde6, 0 0 0.125em #d2cde6, 0 0 0.125em #d2cde6, 0 0 0.125em #d2cde6, 0 0 0.125em #d2cde6, 0 0 0.125em #d2cde6, 0 0 0.125em #d2cde6, 0 0 0.125em #d2cde6;
}

.stroke-brown,
.hover-stroke-brown:hover {
    color: #fff;
    text-shadow: 0 0 0.125em #a67a55, 0 0 0.125em #a67a55, 0 0 0.125em #a67a55, 0 0 0.125em #a67a55, 0 0 0.125em #a67a55, 0 0 0.125em #a67a55, 0 0 0.125em #a67a55, 0 0 0.125em #a67a55, 0 0 0.125em #a67a55, 0 0 0.125em #a67a55, 0 0 0.125em #a67a55, 0 0 0.125em #a67a55, 0 0 0.125em #a67a55, 0 0 0.125em #a67a55, 0 0 0.125em #a67a55, 0 0 0.125em #a67a55, 0 0 0.125em #a67a55, 0 0 0.125em #a67a55, 0 0 0.125em #a67a55, 0 0 0.125em #a67a55;
}

.stroke-dark-brown,
.hover-stroke-dark-brown:hover {
    color: #fff;
    text-shadow: 0 0 0.125em #6a3906, 0 0 0.125em #6a3906, 0 0 0.125em #6a3906, 0 0 0.125em #6a3906, 0 0 0.125em #6a3906, 0 0 0.125em #6a3906, 0 0 0.125em #6a3906, 0 0 0.125em #6a3906, 0 0 0.125em #6a3906, 0 0 0.125em #6a3906, 0 0 0.125em #6a3906, 0 0 0.125em #6a3906, 0 0 0.125em #6a3906, 0 0 0.125em #6a3906, 0 0 0.125em #6a3906, 0 0 0.125em #6a3906, 0 0 0.125em #6a3906, 0 0 0.125em #6a3906, 0 0 0.125em #6a3906, 0 0 0.125em #6a3906;
}

.stroke-pale-brown,
.hover-stroke-pale-brown:hover {
    color: #000;
    text-shadow: 0 0 0.125em #e5d8cd, 0 0 0.125em #e5d8cd, 0 0 0.125em #e5d8cd, 0 0 0.125em #e5d8cd, 0 0 0.125em #e5d8cd, 0 0 0.125em #e5d8cd, 0 0 0.125em #e5d8cd, 0 0 0.125em #e5d8cd, 0 0 0.125em #e5d8cd, 0 0 0.125em #e5d8cd, 0 0 0.125em #e5d8cd, 0 0 0.125em #e5d8cd, 0 0 0.125em #e5d8cd, 0 0 0.125em #e5d8cd, 0 0 0.125em #e5d8cd, 0 0 0.125em #e5d8cd, 0 0 0.125em #e5d8cd, 0 0 0.125em #e5d8cd, 0 0 0.125em #e5d8cd, 0 0 0.125em #e5d8cd;
}

.stroke-dark-goldenrod,
.hover-stroke-dark-goldenrod:hover {
    color: #fff;
    text-shadow: 0 0 0.125em #c9a063, 0 0 0.125em #c9a063, 0 0 0.125em #c9a063, 0 0 0.125em #c9a063, 0 0 0.125em #c9a063, 0 0 0.125em #c9a063, 0 0 0.125em #c9a063, 0 0 0.125em #c9a063, 0 0 0.125em #c9a063, 0 0 0.125em #c9a063, 0 0 0.125em #c9a063, 0 0 0.125em #c9a063, 0 0 0.125em #c9a063, 0 0 0.125em #c9a063, 0 0 0.125em #c9a063, 0 0 0.125em #c9a063, 0 0 0.125em #c9a063, 0 0 0.125em #c9a063, 0 0 0.125em #c9a063, 0 0 0.125em #c9a063;
}

.stroke-goldenrod,
.hover-stroke-goldenrod:hover {
    color: #000;
    text-shadow: 0 0 0.125em #8e6540, 0 0 0.125em #8e6540, 0 0 0.125em #8e6540, 0 0 0.125em #8e6540, 0 0 0.125em #8e6540, 0 0 0.125em #8e6540, 0 0 0.125em #8e6540, 0 0 0.125em #8e6540, 0 0 0.125em #8e6540, 0 0 0.125em #8e6540, 0 0 0.125em #8e6540, 0 0 0.125em #8e6540, 0 0 0.125em #8e6540, 0 0 0.125em #8e6540, 0 0 0.125em #8e6540, 0 0 0.125em #8e6540, 0 0 0.125em #8e6540, 0 0 0.125em #8e6540, 0 0 0.125em #8e6540, 0 0 0.125em #8e6540;
}

.stroke-blue-grey,
.hover-stroke-blue-grey:hover,
.stroke-blue-gray,
.hover-stroke-blue-gray:hover {
    color: #000;
    text-shadow: 0 0 0.125em #a0b1b9, 0 0 0.125em #a0b1b9, 0 0 0.125em #a0b1b9, 0 0 0.125em #a0b1b9, 0 0 0.125em #a0b1b9, 0 0 0.125em #a0b1b9, 0 0 0.125em #a0b1b9, 0 0 0.125em #a0b1b9, 0 0 0.125em #a0b1b9, 0 0 0.125em #a0b1b9, 0 0 0.125em #a0b1b9, 0 0 0.125em #a0b1b9, 0 0 0.125em #a0b1b9, 0 0 0.125em #a0b1b9, 0 0 0.125em #a0b1b9, 0 0 0.125em #a0b1b9, 0 0 0.125em #a0b1b9, 0 0 0.125em #a0b1b9, 0 0 0.125em #a0b1b9, 0 0 0.125em #a0b1b9;
}

.stroke-grey,
.hover-stroke-grey:hover,
.stroke-gray,
.hover-stroke-gray:hover {
    color: #000;
    text-shadow: 0 0 0.125em #9e9e9e, 0 0 0.125em #9e9e9e, 0 0 0.125em #9e9e9e, 0 0 0.125em #9e9e9e, 0 0 0.125em #9e9e9e, 0 0 0.125em #9e9e9e, 0 0 0.125em #9e9e9e, 0 0 0.125em #9e9e9e, 0 0 0.125em #9e9e9e, 0 0 0.125em #9e9e9e, 0 0 0.125em #9e9e9e, 0 0 0.125em #9e9e9e, 0 0 0.125em #9e9e9e, 0 0 0.125em #9e9e9e, 0 0 0.125em #9e9e9e, 0 0 0.125em #9e9e9e, 0 0 0.125em #9e9e9e, 0 0 0.125em #9e9e9e, 0 0 0.125em #9e9e9e, 0 0 0.125em #9e9e9e;
}

.stroke-light-grey,
.hover-stroke-light-grey:hover,
.stroke-light-gray,
.hover-stroke-light-gray:hover {
    color: #000;
    text-shadow: 0 0 0.125em #e6e6e6, 0 0 0.125em #e6e6e6, 0 0 0.125em #e6e6e6, 0 0 0.125em #e6e6e6, 0 0 0.125em #e6e6e6, 0 0 0.125em #e6e6e6, 0 0 0.125em #e6e6e6, 0 0 0.125em #e6e6e6, 0 0 0.125em #e6e6e6, 0 0 0.125em #e6e6e6, 0 0 0.125em #e6e6e6, 0 0 0.125em #e6e6e6, 0 0 0.125em #e6e6e6, 0 0 0.125em #e6e6e6, 0 0 0.125em #e6e6e6, 0 0 0.125em #e6e6e6, 0 0 0.125em #e6e6e6, 0 0 0.125em #e6e6e6, 0 0 0.125em #e6e6e6, 0 0 0.125em #e6e6e6;
}

.stroke-dark-grey,
.hover-stroke-dark-grey:hover,
.stroke-dark-gray,
.hover-stroke-dark-gray:hover {
    color: #fff;
    text-shadow: 0 0 0.125em #616161, 0 0 0.125em #616161, 0 0 0.125em #616161, 0 0 0.125em #616161, 0 0 0.125em #616161, 0 0 0.125em #616161, 0 0 0.125em #616161, 0 0 0.125em #616161, 0 0 0.125em #616161, 0 0 0.125em #616161, 0 0 0.125em #616161, 0 0 0.125em #616161, 0 0 0.125em #616161, 0 0 0.125em #616161, 0 0 0.125em #616161, 0 0 0.125em #616161, 0 0 0.125em #616161, 0 0 0.125em #616161, 0 0 0.125em #616161, 0 0 0.125em #616161;
}

.stroke-black,
.hover-stroke-black:hover {
    color: #fff;
    text-shadow: 0 0 0.125em #000, 0 0 0.125em #000, 0 0 0.125em #000, 0 0 0.125em #000, 0 0 0.125em #000, 0 0 0.125em #000, 0 0 0.125em #000, 0 0 0.125em #000, 0 0 0.125em #000, 0 0 0.125em #000, 0 0 0.125em #000, 0 0 0.125em #000, 0 0 0.125em #000, 0 0 0.125em #000, 0 0 0.125em #000, 0 0 0.125em #000, 0 0 0.125em #000, 0 0 0.125em #000, 0 0 0.125em #000, 0 0 0.125em #000;
}

.stroke-white,
.hover-stroke-white:hover {
    color: #000;
    text-shadow: 0 0 0.125em #fff, 0 0 0.125em #fff, 0 0 0.125em #fff, 0 0 0.125em #fff, 0 0 0.125em #fff, 0 0 0.125em #fff, 0 0 0.125em #fff, 0 0 0.125em #fff, 0 0 0.125em #fff, 0 0 0.125em #fff, 0 0 0.125em #fff, 0 0 0.125em #fff, 0 0 0.125em #fff, 0 0 0.125em #fff, 0 0 0.125em #fff, 0 0 0.125em #fff, 0 0 0.125em #fff, 0 0 0.125em #fff, 0 0 0.125em #fff, 0 0 0.125em #fff;
}

.hover-shadow:hover {
    filter: drop-shadow(0 0 0.125em rgba(255, 255, 255, 0.7)) drop-shadow(0 0 0.5em rgba(0, 0, 0, 0.3));
    cursor: pointer;
}

.img_text {
    color: rgba(255, 255, 255, 0.01);
    padding: 0.75em 0.5em 0;
}

.img_text img {
    pointer-events: none;
}

.spac-2xs {
    letter-spacing: 0.25em;
}

.spac-xs {
    letter-spacing: 0.5em;
}

.rotate-3 {
    transform: rotate(-3deg);
}

.rotate-5 {
    transform: rotate(-5deg);
}

.rotate-10 {
    transform: rotate(-10deg);
}


/*----------------------------------------- BAN區塊-----------------------------------------*/

#ban {
    height: 73vh;
    max-height: 720px;
    text-shadow: 0 0 3em #024059;
}

#ban>article.position-relative {
    min-height: 30em;
}

#ban>article.position-relative {
    min-height: 30em;
}


/*-------------------------------------END-BAN區塊---------------------------------------*/


/*----------------------------------------- 區塊a01 -----------------------------------------*/

#a01 .nav-tabs .nav-link {
    background: #00000055;
    color: #fff;
    margin-top: 1em;
    padding: 0.5em 0;
}

#a01 .nav-tabs .nav-link.active {
    background: #fff;
    color: #024059;
    margin-top: 0em;
    font-size: 1.25em;
    padding: 0.75em 0;
    font-weight: 900;
}


/*11105新增*/

.hotnews ul,
.hotnews li {
    list-style: none !important;
}

.hotnews ul {
    margin: .5em 0 1.5em 0;
    color: #eee !important;
}

.hotnews ul .fa-bi {
    font-size: 1.5em !important;
    color: #fff;
    font-weight: 700;
    letter-spacing: 2px;
    margin: 0 .1em;
}

.hotnews .more_btn {
    line-height: 1.5;
    color: #024059;
    border: 3px solid #fff;
    font-weight: 500;
}

.f-blue {
    color: #a7dae8 !important;
}


/*#11105新增*/


/*-------------------------------------END- 區塊a01 -----------------------------------------*/


/*----------------------------------------- 區塊a02 -----------------------------------------*/

#a02>article.position-relative {
    padding: 3em 0 3em;
}


/*-------------------------------------END- 區塊a02 -----------------------------------------*/


/*----------------------------------------- 區塊a03 -----------------------------------------*/

main .arrow {
    clip-path: polygon(2em 0%, calc(100% - 2em) 0%, 100% 50%, calc(100% - 2em) 100%, 2em 100%);
    margin-bottom: 30px;
    padding: 0.5em 30px 0.5em 60px;
}

main .arrow h4 {
    color: #f2e088;
}

main .arrow h6 {
    font-size: 1em;
    text-align: left;
}

@media screen and (max-width: 576px) {
    main .arrow {
        clip-path: polygon(0 0, calc(100%) 0, 100% 30px, 100% calc(100% - 30px), calc(100% - 51%) 100%, 51% 100%, 0 calc(100% - 30px), 0 30px);
        margin-bottom: 10px;
        padding: 0.5em 0 30px 0;
    }
    main .arrow h6 {
        font-size: 1em;
        text-align: center;
    }
}

#class_news li {
    width: calc(100%/4.2);
    list-style: none;
}

.continue {
    background-color: rgba(255, 255, 255, .6);
    display: inline-block;
    padding: .2em 1em;
    color: #425b63;
}


/**輪播 swiper **/

.swiper {
    width: 100%;
    height: 100%;
    padding-left: 2.8em;
    padding-right: 2.8em;
    padding-bottom: 3em;
}

.swiper-slide {
    text-align: center;
    font-size: 16px;
    background: #fff;
    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

@media screen and (max-width: 768px) {
    .swiper-slide {
        font-size: 13px;
    }
}


/*##swiper*/


/******** # 輪播 swiper ********/


/*-------------------------------------END- 區塊a03 -----------------------------------------*/


/*----------------------------------------- 區塊a04 -----------------------------------------*/

#a04-1 {
    /*background: linear-gradient(to right bottom, #fff, #97BDD455)100% 100%, url(../images/04-BG.jpg)right center/cover fixed;*/
    background: linear-gradient(to right bottom, #fff, #97bdd455) 100% 100%;
    box-shadow: inset -0.1em -0.1em 0.5em 0px black;
    margin: 1.5em auto 2em;
    padding: 2em 3em 1em;
    border-radius: 2em;
}


/* #a01 article {
    background: linear-gradient(to right bottom, #fff, #97bdd455) 100% 100%;
    box-shadow: inset -0.1em -0.1em 0.5em 0px black;
    margin: 1.5em auto 2em;
    padding: 2em 3em 1em;
    border-radius: 2em;
} */

#a04 i.fa-plus.position-absolute {
    right: calc(100% - 0.5em) !important;
}


/*----早鳥優惠---*/

.ad_yellow {
    color: #ffc943 !important;
}

#a04 .act_pt {
    position: relative;
    font-size: 1.6em;
    text-align: left;
}

#a04 .act_pt h5 {
    font-size: 1.2em;
    letter-spacing: 1px;
    font-weight: 700;
    line-height: 1.3;
}

#a04 .act_pt h5 .sec-ti {
    font-weight: 400;
    font-size: 80%;
}

#a04 .act_pt .act_con {
    position: absolute;
    top: 0.7em;
    left: 28%;
    width: 68%;
}

#a04 .act_pt .act_con ul,
#a04 .act_pt .act_con li {
    list-style: none !important;
    padding-left: 0 !important;
    line-height: 1.1;
}

#a04 .act_pt .act_con h6,
#a04 .act_pt .act_con p {
    display: inline-block !important;
}

#a04 .act_pt .act_con h6 {
    background-image: url('../images/act-titke-2.png');
    background-position: center left;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    -ms-background-size: 100% 100%;
    -moz-background-size: 100% 100%;
    -webkit-background-size: 100% 100%;
    line-height: 1.6;
    padding: 0em 0.8em 0 0.8em;
    color: #a22b00;
    font-size: 0.65em;
    font-weight: 700;
    margin-bottom: 0em;
}

#a04 .act_pt .act_con p {
    font-weight: 300 !important;
    margin-bottom: 0;
    letter-spacing: 2px;
    font-size: 0.7em;
}

#a04 .act_pt .act_con small {
    font-weight: 300 !important;
    font-size: 75%;
}

@media screen and (max-width: 991px) {
    #a04 .act_pt {
        font-size: 1.75em;
    }
}

@media screen and (max-width: 768px) {
    #a04 .act_pt {
        font-size: 1.45em;
    }
}

@media screen and (max-width: 576px) {
    #a04 article {
        padding: 2em 1em 1em;
    }
    #a04 .act_pt {
        font-size: 1.2em;
    }
    #a04 .act_pt h5 span:nth-child(1) {
        background-image: url('../images/act-titke-1.png');
        background-position: center left;
        background-repeat: no-repeat;
        background-size: 100% 100%;
        -ms-background-size: 100% 100%;
        -moz-background-size: 100% 100%;
        -webkit-background-size: 100% 100%;
        line-height: 1.6;
        padding: 0em 0.8em 0 0.8em;
        color: #a22b00;
        font-size: 90%;
        margin-bottom: 0.4em;
    }
    #a04 .act_pt h5 span:nth-child(2) {
        font-size: 115%;
        letter-spacing: 1px;
    }
    #a04 .act_pt .act_con {
        left: 17%;
        width: 81%;
        top: 1.4em;
    }
}


/**/


/*----END-早鳥優惠---*/


/*-------------------------------------END- 區塊a04 -----------------------------------------*/


/*----------------------------------------- 區塊 a06 -----------------------------------------*/

#a06-2 .rounded-circle {
    width: 5em;
    height: 5em;
}

#a06-3 .col-md-9 .text-pink {
    color: #fe3775 !important;
}

#a06 h2 {
    font-weight: 700;
    color: #004991;
}

#a06 article {
    padding: 20px;
}

#a06 h3 {
    font-size: 1.3em;
}

#a06 img {
    width: 40%;
}

#a06 .row {
    max-width: 900px;
    margin: 0 auto;
}


/*----------------------------------------- 區塊 a06 -----------------------------------------*/


/*----------------------------------------- 區塊 a07 -----------------------------------------*/

#a07-1 *[title='名次'] {
    font-size: 1.1em;
    max-width: 1.75em;
    margin: 0.25em auto;
}

#a07-1 *[title='名次']+.col {
    max-width: calc(100% - 2em);
}

#a07-1 .name {
    font-size: 1.25em;
}

#a07-1 *[title='類科'],
#a07-1 *[title='分組'] {
    font-size: 0.9em;
}

#a07-1 .row-cols-5 *[title='類科'],
#a07-1 .row-cols-5 *[title='分組'] {
    font-size: 0.75em;
}

#a07-1 h6,
#a07-2 h6 {
    font-size: 1.125em;
}

#a07-1>.row,
#a07-2>.row {
    background-color: #ffffffaa;
    padding: 1em 0.25em 1em 1.25em;
    position: relative;
}

#a07-1>.row:before,
#a07-2>.row:before {
    filter: blur(5px);
}

#a07-3 .h-100 {
    padding-bottom: 8em !important;
}

@media screen and (max-width: 768px) {
    #a07-1 {
        font-size: 1.75vw;
    }
}


/*----------------------------------------- 區塊 a07 -----------------------------------------*/


/*----------------------------------------- 區塊buttones -----------------------------------------*/


/*-------------------------------------END- 區塊buttones -----------------------------------------*/


/*-------------------------------------END- 區塊 經驗談 -----------------------------------------*/

@media screen and (min-width: 577px) {
    .type_ph {
        display: none !important;
    }
}


/*手機板*/

@media screen and (max-width: 576px) {
    .type_pc {
        display: none !important;
    }
}


/*上下架關閉*/

.start-over-time {
    display: none;
}