@charset "UTF-8";
       html {
line-height: 1.15; -webkit-text-size-adjust: 100%; }  body {
margin: 0;
} h1 {
font-size: 2em;
margin: 0.67em 0;
}  hr {
box-sizing: content-box; height: 0; overflow: visible; } pre {
font-family: monospace, monospace; font-size: 1em; }  a {
background-color: transparent;
} abbr[title] {
border-bottom: none; text-decoration: underline; text-decoration: underline dotted; } b,
strong {
font-weight: bolder;
} code,
kbd,
samp {
font-family: monospace, monospace; font-size: 1em; } small {
font-size: 80%;
} sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}  img {
border-style: none;
}  button,
input,
optgroup,
select,
textarea {
font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0; } button,
input { overflow: visible;
} button,
select { text-transform: none;
} button,
[type="button"],
[type="reset"],
[type="submit"] {
-webkit-appearance: button;
} button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
border-style: none;
padding: 0;
} button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
outline: 1px dotted ButtonText;
} fieldset {
padding: 0.35em 0.75em 0.625em;
} legend {
box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0; white-space: normal; } progress {
vertical-align: baseline;
} textarea {
overflow: auto;
} [type="checkbox"],
[type="radio"] {
box-sizing: border-box; padding: 0; } [type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
height: auto;
} [type="search"] {
-webkit-appearance: textfield; outline-offset: -2px; } [type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
} ::-webkit-file-upload-button {
-webkit-appearance: button; font: inherit; }  details {
display: block;
} summary {
display: list-item;
}  template {
display: none;
} [hidden] {
display: none;
} body,
button,
input,
select,
optgroup,
textarea {
color: #1a1a1a;
font-family: "Noto Sans TC", sans-serif;
font-size: 16px;
font-size: 1rem;
line-height: 2;
letter-spacing: 1.05px;
}
h1,
h2,
h3,
h4,
h5,
h6 {
position: relative;
clear: both;
}
h2 {
font-size: 44px;
font-size: 2.75rem;
}
h3 {
font-size: 36px;
font-size: 2.25rem;
}
.single-post h2 {
font-size: 24px;
font-size: 1.5rem;
}
.single-post h3 {
font-size: 20px;
font-size: 1.25rem;
}
@media screen and (max-width: 768px) {
h1 {
font-size: 32px;
font-size: 2rem;
}
h2 {
font-size: 28.8px;
font-size: 1.8rem;
}
h3 {
font-size: 24px;
font-size: 1.5rem;
}
}
p {
margin-bottom: 1.5em;
}
dfn,
cite,
em,
i {
font-style: italic;
}
blockquote {
margin: 0 1.5em;
}
address {
margin: 0 0 1.5em;
}
pre {
background: #eee;
font-family: "Courier 10 Pitch", Courier, monospace;
font-size: 15px;
font-size: 0.9375rem;
line-height: 1.6;
margin-bottom: 1.6em;
max-width: 100%;
overflow: auto;
padding: 1.6em;
}
code,
kbd,
tt,
var {
font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
font-size: 15px;
font-size: 0.9375rem;
}
abbr,
acronym {
border-bottom: 1px dotted #666;
cursor: help;
}
mark,
ins {
background: #faf3dd;
text-decoration: none;
}
big {
font-size: 125%;
}
.uppercase {
text-transform: uppercase;
}
.text-center {
text-align: center;
} html {
box-sizing: border-box;
}
*,
*::before,
*::after { box-sizing: inherit;
}
body {
background: #fff; }
hr {
background-color: #ccc;
border: 0;
height: 1px;
margin-bottom: 1.5em;
}
ul,
ol {
margin: 0 0 1.5em 3em;
}
ul {
list-style: disc;
}
ol {
list-style: decimal;
}
li > ul,
li > ol {
margin-bottom: 0;
margin-left: 1.5em;
}
dt {
font-weight: bold;
}
dd {
margin: 0 1.5em 1.5em;
}
img {
height: auto; max-width: 100%; }
figure {
margin: 1em 0; }
table {
margin: 0 0 1.5em;
width: 100%;
}
figure.borderless table {
border: none;
}
figure.bg-white table {
background-color: #fff;
}
.tb-border-top {
border-top: 3px solid #ec6336;
padding-top: 50px;
}
.tb-border-top tr td {
padding-top: 1em;
padding-bottom: 1em;
border-bottom: 1px solid #a1a1a1;
}
.tb-border-top tr td:first-child {
width: 33%;
text-align: right;
padding-right: 3em;
border-right: 1px solid #a1a1a1;
}
.tb-border-top tr td:last-child {
padding-left: 6em;
}
.price-table {
border-top: 3px solid #ec6336;
border-collapse: collapse;
}
.price-table tr:first-child {
text-align: center;
}
.price-table tr:first-child td {
padding: 1em 0.5em;
}
.price-table tr:not(:first-child) {
border-bottom: 1px solid #1a1a1a;
}
.price-table tr:not(:first-child) td {
padding-bottom: 1em;
padding-top: 1em;
text-align: center;
}
.price-table tr:not(:first-child) td:first-child {
width: calc(100% / 3);
}
.price-table tr:not(:first-child) td:last-child {
color: #ec6336;
}
.price-table.course-content tr:not(:first-child) td:last-child {
color: #1a1a1a;
text-align: left;
}
.price-table:nth-last-child(-n+2) {
margin-bottom: 100px;
}
.table-download thead tr {
background: #ec6336;
color: #fff;
border: 1px solid #1a1a1a;
}
.table-download thead th {
border: 1px solid #1a1a1a;
}
.table-download thead th:not(:last-child) {
border-right: 1px solid #ec6336;
}
.table-download tbody td {
vertical-align: middle;
}
.table-download tbody td:not(:last-child) {
border-right: 1px solid white;
}
.table-download tbody td a {
display: flex;
justify-content: center;
}
#latest-news {
border-collapse: collapse;
}
#latest-news tr:not(:last-child) {
border-bottom: 1px solid #666;
}
#latest-news td {
padding: 1em 0.5em;
}
#latest-news td:first-child {
width: 25%;
}
@media screen and (max-width: 768px) {
.tb-border-top {
padding-top: 36px;
}
.tb-border-top tr td:first-child {
padding-right: 1.5em;
}
.tb-border-top tr td:last-child {
padding-left: 1.5em;
}
} button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
border: 1px solid;
border-color: #ccc #ccc #bbb;
border-radius: 3px;
background: #e6e6e6;
color: rgba(0, 0, 0, 0.8);
font-size: 12px;
font-size: 0.75rem;
line-height: 1;
padding: 0.6em 1em 0.4em;
}
button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
border-color: #ccc #bbb #aaa;
}
button:active,
button:focus,
input[type="button"]:active,
input[type="button"]:focus,
input[type="reset"]:active,
input[type="reset"]:focus,
input[type="submit"]:active,
input[type="submit"]:focus {
border-color: #aaa #bbb #bbb;
}
button.menu-toggle,
input[type="button"].menu-toggle,
input[type="reset"].menu-toggle,
input[type="submit"].menu-toggle {
border: 2px solid;
border-color: #fff;
border-radius: 0;
color: #fff;
background: #ec6336;
padding: 0.5em 1em;
}
button.menu-toggle #hamburger,
input[type="button"].menu-toggle #hamburger,
input[type="reset"].menu-toggle #hamburger,
input[type="submit"].menu-toggle #hamburger {
margin-left: 1em;
}
button.menu-toggle #hamburger > div,
input[type="button"].menu-toggle #hamburger > div,
input[type="reset"].menu-toggle #hamburger > div,
input[type="submit"].menu-toggle #hamburger > div {
width: 15px;
height: 2px;
margin-bottom: 3px;
background: #fff;
transition: transform 0.5s, opacity 0.5s;
-webkit-transition: transform 0.5s, opacity 0.5s;
}
button.menu-toggle #hamburger > div:nth-child(1),
input[type="button"].menu-toggle #hamburger > div:nth-child(1),
input[type="reset"].menu-toggle #hamburger > div:nth-child(1),
input[type="submit"].menu-toggle #hamburger > div:nth-child(1) {
transform-origin: 0% 0%;
}
button.menu-toggle #hamburger > div:nth-child(2),
input[type="button"].menu-toggle #hamburger > div:nth-child(2),
input[type="reset"].menu-toggle #hamburger > div:nth-child(2),
input[type="submit"].menu-toggle #hamburger > div:nth-child(2) {
opacity: 1;
}
button.menu-toggle #hamburger > div:nth-child(3),
input[type="button"].menu-toggle #hamburger > div:nth-child(3),
input[type="reset"].menu-toggle #hamburger > div:nth-child(3),
input[type="submit"].menu-toggle #hamburger > div:nth-child(3) {
transform-origin: 0% 100%;
}
.toggled button.menu-toggle #hamburger > div {
transition: transform 0.5s, opacity 0.5s;
-webkit-transition: transform 0.5s, opacity 0.5s;
}
.toggled button.menu-toggle #hamburger > div:nth-child(1) {
transform: rotate(45deg) translate(4px, -4px);
}
.toggled button.menu-toggle #hamburger > div:nth-child(2) {
opacity: 0;
}
.toggled button.menu-toggle #hamburger > div:nth-child(3) {
transform: rotate(-45deg) translate(4px, 4px);
}
a.cta-btn,
button.cta-btn,
input[type="submit"].cta-btn,
input[type="button"].cta-btn,
input[type="reset"].cta-btn {
align-items: center;
border: solid 3px #1a1a1a;
border-radius: 50px;
background: #03c755;
color: white;
display: flex;
font-size: 24px;
font-size: 1.5rem;
font-weight: 700;
height: 3em;
justify-content: space-between;
max-width: 436px;
margin-left: auto;
margin-right: auto;
padding-left: 30px;
padding-right: 30px;
width: 100%;
}
a.cta-btn:visited,
button.cta-btn:visited,
input[type="submit"].cta-btn:visited,
input[type="button"].cta-btn:visited,
input[type="reset"].cta-btn:visited {
color: #eee;
}
a.cta-btn:hover,
button.cta-btn:hover,
input[type="submit"].cta-btn:hover,
input[type="button"].cta-btn:hover,
input[type="reset"].cta-btn:hover {
background: #bbd9bb;
color: #333;
}
a.cta-btn.cta-line,
button.cta-btn.cta-line,
input[type="submit"].cta-btn.cta-line,
input[type="button"].cta-btn.cta-line,
input[type="reset"].cta-btn.cta-line {
border: 0;
border-radius: 10px;
box-shadow: #a1a1a1 0 3px 1px 0;
transition: box-shadow 0.3s;
}
a.cta-btn.cta-line:hover,
button.cta-btn.cta-line:hover,
input[type="submit"].cta-btn.cta-line:hover,
input[type="button"].cta-btn.cta-line:hover,
input[type="reset"].cta-btn.cta-line:hover {
color: #1a1a1a;
box-shadow: #a1a1a1 0 0 0 0;
transition: box-shadow 0.3s;
}
a.cta-btn.cta-line::before,
button.cta-btn.cta-line::before,
input[type="submit"].cta-btn.cta-line::before,
input[type="button"].cta-btn.cta-line::before,
input[type="reset"].cta-btn.cta-line::before {
background-image: url(https://karada39.com.tw/wp-content/themes/karada/assets/img/line-default.png);
content: "";
background-size: 50px 50px;
width: 50px;
height: 50px;
}
a.cta-btn.cta-recruit,
button.cta-btn.cta-recruit,
input[type="submit"].cta-btn.cta-recruit,
input[type="button"].cta-btn.cta-recruit,
input[type="reset"].cta-btn.cta-recruit {
background-color: #fff568;
right: calc((100% - 1000px )/2);
position: absolute;
bottom: 3em;
}
a.cta-btn.cta-red,
button.cta-btn.cta-red,
input[type="submit"].cta-btn.cta-red,
input[type="button"].cta-btn.cta-red,
input[type="reset"].cta-btn.cta-red {
background-color: #f00;
}
a.cta-btn.cta-red:hover,
button.cta-btn.cta-red:hover,
input[type="submit"].cta-btn.cta-red:hover,
input[type="button"].cta-btn.cta-red:hover,
input[type="reset"].cta-btn.cta-red:hover {
background-color: #c00;
}
a.cta-btn.cta-blue,
button.cta-btn.cta-blue,
input[type="submit"].cta-btn.cta-blue,
input[type="button"].cta-btn.cta-blue,
input[type="reset"].cta-btn.cta-blue {
background-color: #418bd1;
}
a.cta-btn.cta-blue:hover,
button.cta-btn.cta-blue:hover,
input[type="submit"].cta-btn.cta-blue:hover,
input[type="button"].cta-btn.cta-blue:hover,
input[type="reset"].cta-btn.cta-blue:hover {
background-color: #519be1;
}
a.cta-btn.btn-pill,
button.cta-btn.btn-pill,
input[type="submit"].cta-btn.btn-pill,
input[type="button"].cta-btn.btn-pill,
input[type="reset"].cta-btn.btn-pill {
border: solid 3px #1a1a1a;
border-radius: 50px;
box-shadow: none;
}
a.cta-btn.cta-orange,
a.cta-btn.cta-orange:visited,
button.cta-btn.cta-orange,
button.cta-btn.cta-orange:visited,
input[type="submit"].cta-btn.cta-orange,
input[type="submit"].cta-btn.cta-orange:visited,
input[type="button"].cta-btn.cta-orange,
input[type="button"].cta-btn.cta-orange:visited,
input[type="reset"].cta-btn.cta-orange,
input[type="reset"].cta-btn.cta-orange:visited {
background-color: #ec6336;
color: #1a1a1a;
}
a.cta-btn.cta-orange:hover,
button.cta-btn.cta-orange:hover,
input[type="submit"].cta-btn.cta-orange:hover,
input[type="button"].cta-btn.cta-orange:hover,
input[type="reset"].cta-btn.cta-orange:hover {
background-color: #fff;
color: #1a1a1a;
}
input[type="submit"].cta-btn,
input[type="button"].cta-btn,
input[type="reset"].cta-btn {
justify-content: center;
}
@media screen and (max-width: 37.5em) {
a.cta-btn,
button.cta-btn,
input[type="submit"].cta-btn,
input[type="button"].cta-btn,
input[type="reset"].cta-btn {
font-size: 16px;
font-size: 1rem;
}
a.cta-btn.cta-recruit,
button.cta-btn.cta-recruit,
input[type="submit"].cta-btn.cta-recruit,
input[type="button"].cta-btn.cta-recruit,
input[type="reset"].cta-btn.cta-recruit {
display: none;
}
}
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
background-color: #efefef;
color: #666;
border: 1px solid #ccc;
border-radius: 3px;
padding: 3px;
width: 100%;
}
input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
color: #111;
}
select {
background-color: #efefef;
border: 1px solid #ccc;
width: 100%;
padding: 6px;
min-height: 40px;
}
textarea {
width: 100%;
} .wpcf7-form .jp-desc {
color: #a1a1a1;
}
.wpcf7-exclusive-checkbox {
display: flex;
width: 100%;
flex-wrap: wrap;
row-gap: 8px;
}
.wpcf7-exclusive-checkbox > .wpcf7-list-item {
width: calc(100% / 3);
}
@media screen and (max-width: 37.5em) {
.wpcf7-exclusive-checkbox > .wpcf7-list-item {
width: 100%;
}
}
@media screen and (max-width: 37.5em) {
.wpcf7-form > .flex > [class*="f-w-"] {
width: 100%;
}
} input#booking-date {
width: 100%;
}  a {
color: #ec6336;
text-decoration: none;
}
a:visited {
color: #dc5326;
}
a:hover,
a:focus,
a:active {
color: #fc7346;
}
a:focus {
outline: thin dotted;
}
a:hover,
a:active {
outline: 0;
}
.has-main-orange-background-color a {
color: #f1f1f1;
}
.has-main-orange-background-color a:visited {
color: #f1f1f1;
}
.has-main-orange-background-color a:hover,
.has-main-orange-background-color a:focus,
.has-main-orange-background-color a:active {
color: #f1f1f1;
} .page-header {
position: relative;
margin-bottom: 2em;
}
.page-header .nav-wrapper {
background-color: rgba(0, 0, 0, 0);
position: absolute;
top: 0;
left: 0;
right: 0;
transition: background-color 0.6s, position 0.6s;
margin-left: auto;
margin-right: auto;
z-index: 1;
}
.page-header .nav-wrapper > nav {
max-width: 1000px;
}
.admin-bar .nav-wrapper.fixed {
top: 32px;
}
.main-navigation,
.footer-navigation,
.mobile-navigation {
align-items: center;
clear: both;
display: flex;
margin-left: auto;
margin-right: auto;
max-width: 1000px;
justify-content: center;
width: 100%;
}
.main-navigation > [class*="container"],
.footer-navigation > [class*="container"],
.mobile-navigation > [class*="container"] {
flex-grow: 1;
}
.main-navigation ul,
.footer-navigation ul,
.mobile-navigation ul {
display: none;
list-style: none;
margin: 0;
padding-left: 0;
}
.main-navigation ul ul,
.footer-navigation ul ul,
.mobile-navigation ul ul {
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
float: left;
position: absolute;
top: 100%;
left: -999em;
z-index: 99999;
}
.main-navigation ul ul ul,
.footer-navigation ul ul ul,
.mobile-navigation ul ul ul {
left: -999em;
top: 0;
}
.main-navigation ul ul li:hover > ul,
.main-navigation ul ul li.focus > ul,
.footer-navigation ul ul li:hover > ul,
.footer-navigation ul ul li.focus > ul,
.mobile-navigation ul ul li:hover > ul,
.mobile-navigation ul ul li.focus > ul {
left: 100%;
}
.main-navigation ul ul a,
.footer-navigation ul ul a,
.mobile-navigation ul ul a {
width: 200px;
text-decoration: none;
}
.main-navigation ul li:hover > ul,
.main-navigation ul li.focus > ul,
.footer-navigation ul li:hover > ul,
.footer-navigation ul li.focus > ul,
.mobile-navigation ul li:hover > ul,
.mobile-navigation ul li.focus > ul {
left: auto;
}
.main-navigation li,
.footer-navigation li,
.mobile-navigation li {
float: left;
position: relative;
}
.main-navigation a,
.footer-navigation a,
.mobile-navigation a {
display: block;
text-decoration: none;
}
.main-navigation .cta-btn,
.footer-navigation .cta-btn,
.mobile-navigation .cta-btn {
background-color: #03c755;
border: 2px solid #1a1a1a;
border-radius: 100px;
color: white;
display: flex;
font-size: 16px;
font-size: 1rem;
justify-content: center;
margin-left: auto;
margin-right: auto;
padding-bottom: 1em;
padding-top: 1em;
text-align: center;
text-decoration: none;
width: 235px;
} .menu-toggle {
display: block;
}
footer .menu ul {
list-style: none;
}
@media screen and (min-width: 37.5em) {
.menu-toggle {
display: none;
}
.main-navigation ul,
.footer-navigation ul {
display: flex;
justify-content: space-around;
}
.mobile-navigation {
display: none;
}
.page-header .nav-wrapper.fixed {
background-color: #ec6336;
position: fixed;
z-index: 10;
padding-bottom: 1em;
transition: background-color 0.6s, position 0.6s;
} .single-coupon .page-header,
.single-info .page-header {
margin-top: -1px;
}
.single-coupon .page-header .nav-wrapper,
.single-info .page-header .nav-wrapper {
background-color: #ec6336;
padding-bottom: 1em;
}
}
@media screen and (max-width: 37.5em) {
.main-navigation {
display: none;
}
.mobile-navigation {
background-color: #ec6336;
position: relative;
padding-bottom: 1.5em;
padding-top: 1em;
}
.mobile-navigation a.cta-btn {
margin-left: calc((100% - 235px)/2);
margin-right: calc((100% - 235px)/2);
color: #1a1a1a;
}
button.menu-toggle {
display: flex;
}
.site-branding.toggled,
.site-branding.fixed {
position: fixed;
z-index: 10;
top: 0;
}
.mobile-navigation.toggled {
flex-direction: column;
align-items: flex-start;
justify-content: flex-start;
overflow: auto;
padding-top: 75px;
padding-right: 10%;
padding-left: 10%;
position: fixed;
top: 0;
bottom: 0;
z-index: 9;
}
.mobile-navigation.toggled .cta-btn {
padding-top: 0.5em;
padding-bottom: 0.5em;
width: auto;
height: 3em;
margin-left: 0;
margin-bottom: 1em;
}
.mobile-navigation.toggled .cta-btn:visited {
color: #1a1a1a;
}
.mobile-navigation.toggled ul {
display: flex;
flex-direction: column;
width: 80vw;
}
.mobile-navigation.toggled ul a,
.mobile-navigation.toggled ul a:visited,
.mobile-navigation.toggled ul a:hover {
color: #1a1a1a;
border-bottom: 2px solid #303030;
padding: 0.5em 1.5em;
}
.mobile-navigation.toggled ul a::after,
.mobile-navigation.toggled ul a:visited::after,
.mobile-navigation.toggled ul a:hover::after {
content: "→";
float: right;
}
.mobile-navigation.toggled ul#sidemenu a {
border: none;
font-size: 12px;
font-size: 0.75rem;
}
.mobile-navigation.toggled ul#sidemenu a::after {
content: "";
}
.mobile-navigation.toggled .menu-toggle {
display: flex;
position: absolute;
top: 8px;
right: 8px;
}
.footer-navigation ul {
display: flex;
justify-content: center;
flex-wrap: wrap;
}
.footer-navigation ul > li:not(:last-child) {
border-right: 2px solid #fff;
margin-right: 1em;
margin-bottom: 1em;
padding-right: 1em;
}
}
.site-main .comment-navigation,
.site-main
.posts-navigation,
.site-main
.post-navigation {
margin: 1.5em auto;
overflow: hidden;
}
.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
float: left;
width: 50%;
}
.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
float: right;
text-align: right;
width: 50%;
}  .screen-reader-text {
border: 0;
clip: rect(1px, 1px, 1px, 1px);
clip-path: inset(50%);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute !important;
width: 1px;
word-wrap: normal !important; }
.screen-reader-text:focus {
background-color: #f1f1f1;
border-radius: 3px;
box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
clip: auto !important;
clip-path: none;
color: #21759b;
display: block;
font-size: 14px;
font-size: 0.875rem;
font-weight: bold;
height: auto;
left: 5px;
line-height: normal;
padding: 15px 23px 14px;
text-decoration: none;
top: 5px;
width: auto;
z-index: 100000; } #content[tabindex="-1"]:focus {
outline: 0;
} .alignleft {
display: inline;
float: left;
margin-right: 1.5em;
}
.alignright {
display: inline;
float: right;
margin-left: 1.5em;
}
.aligncenter {
clear: both;
display: block;
margin-left: auto;
margin-right: auto;
} .clear::before,
.clear::after,
.entry-content::before,
.entry-content::after,
.comment-content::before,
.comment-content::after,
.site-header::before,
.site-header::after,
.site-content::before,
.site-content::after,
.site-footer::before,
.site-footer::after {
content: "";
display: table;
table-layout: fixed;
}
.clear::after,
.entry-content::after,
.comment-content::after,
.site-header::after,
.site-content::after,
.site-footer::after {
clear: both;
}  .widget {
margin: 0 0 1.5em; }
.widget select {
max-width: 100%;
}
.widget-area {
display: flex;
justify-content: center;
max-width: 900px;
margin-left: auto;
margin-right: auto;
width: 100%;
}
.widget-area .widget {
flex-grow: 1;
display: flex;
justify-content: center;
}
.widget-area .widget:first-child {
flex-grow: 2;
justify-content: flex-start;
}  .sticky {
display: block;
}
.hidden {
display: none;
}
.d-block {
display: block;
}
body.page,
body.post {
margin-bottom: 0;
}
.post,
.page {
margin: 0 0 1.5em;
}
.updated:not(.published) {
display: none;
}
.page-content,
.entry-content,
.entry-summary {
margin: 1.5em 0 0;
}
.page-links {
clear: both;
margin: 0 0 1.5em;
}
.bg-primary {
background-color: #ec6336;
}
.bg-secondary {
background-color: #faf3dd;
}
.wp-block-image.intersect {
background-image: url(https://karada39.com.tw/wp-content/themes/karada/assets/img/intersect.png);
background-repeat: repeat-x;
background-size: contain;
margin-bottom: 0;
}
.wp-block-image.intersect figure {
margin-bottom: 0;
}
.wp-block-image.way-right figure {
margin-right: 2em;
}
.wp-block-image.way-left figure {
margin-left: 2em;
}
@media screen and (min-width: 768px) {
#expand::after {
content: url(https://karada39.com.tw/wp-content/themes/karada/assets/img/expand.png);
position: absolute;  top: -120px;
left: 3em;
}
}
@media screen and (max-width: 768px) {
.wp-block-image.intersect figure {
margin-left: 35%;
margin-right: 5%;
}
.wp-block-image.way-right figure {
margin-right: 1em;
}
.wp-block-image.way-left figure {
margin-left: 1em;
}
}  .has-main-orange-background-color {
background-color: #ec6336;
}
.has-main-orange-color {
color: #ec6336;
}
.has-main-orange-color a {
color: #ec6336;
}
.has-icon-gold-background-color {
background-color: #c0a972;
}
.has-icon-gold-color {
color: #c0a972;
}
.has-icon-gold-color a {
color: #c0a972;
}
.has-default-black-background-color {
background-color: #1a1a1a;
}
.has-default-black-color {
color: #1a1a1a;
}
.has-default-black-color a {
color: #1a1a1a;
}
.has-default-white-background-color {
background-color: #fff;
}
.has-default-white-color {
color: #fff;
}
.has-default-white-color a {
color: #fff;
}
.has-light-orange-background-color {
background-color: #faf3dd;
}
.has-light-orange-color {
color: #faf3dd;
}
.has-light-orange-color a {
color: #faf3dd;
}
.has-defautl-grey-background-color {
background-color: #f2f2f2;
}
.has-defautl-grey-color {
color: #f2f2f2;
}
.has-defautl-grey-color a {
color: #f2f2f2;
} .wp-block-media-text {
grid-template-columns: 60% auto;
}
.wp-block-media-text.grid-row-reverse {
grid-template-columns: auto 60%;
}
.wp-block-media-text.grid-row-reverse .wp-block-media-text__media {
grid-column: 2;
}
.wp-block-media-text.grid-row-reverse .wp-block-media-text__content {
grid-column: 1;
height: 100%;
}
.wp-block-media-text.half-layout {
grid-template-columns: 50% auto;
}
.wp-block-media-text.half-layout h3 {
margin-top: 0;
}
.wp-block-media-text.half-layout .wp-block-media-text__content {
padding: 0 16%;
}
ul.wp-block-gallery,
figure.wp-block-gallery {
margin-left: 0;
align-items: flex-start;
}
ul.wp-block-gallery.columns-2 figure,
ul.wp-block-gallery.columns-3 figure,
figure.wp-block-gallery.columns-2 figure,
figure.wp-block-gallery.columns-3 figure {
margin-bottom: 2.25rem;
}
ul.wp-block-gallery.columns-4 li.blocks-gallery-item,
figure.wp-block-gallery.columns-4 li.blocks-gallery-item {
flex-grow: initial;
}
ul.wp-block-gallery.has-nested-images figure.wp-block-image,
figure.wp-block-gallery.has-nested-images figure.wp-block-image {
flex-grow: unset;
}
ul.wp-block-gallery.has-nested-images figure.wp-block-image:has(figcaption)::before,
figure.wp-block-gallery.has-nested-images figure.wp-block-image:has(figcaption)::before {
content: unset;
}
ul.wp-block-gallery.has-nested-images figure.wp-block-image figcaption,
figure.wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
color: #1a1a1a;
font-size: 1rem;
will-change: unset;
background: rgba(255, 255, 255, 0);
text-shadow: unset;
}
.wp-block-gallery .blocks-gallery-image,
.wp-block-gallery .blocks-gallery-item {
flex-grow: unset;
}
.wp-block-gallery .blocks-gallery-image figure,
.wp-block-gallery .blocks-gallery-item figure {
justify-content: center;
position: relative;
}
.wp-block-gallery .blocks-gallery-image figcaption.vertical,
.wp-block-gallery .blocks-gallery-item figcaption.vertical {
align-items: center;
display: flex;
font-size: 24px;
font-size: 1.5rem;
justify-content: center;
left: 0;
letter-spacing: 8px;
padding: 0;
right: 0;
top: 0;
writing-mode: vertical-rl;
}
.wp-block-gallery .blocks-gallery-image figcaption.horizontal,
.wp-block-gallery .blocks-gallery-item figcaption.horizontal {
align-items: center;
display: flex;
font-size: 24px;
font-size: 1.5rem;
justify-content: center;
left: 0;
letter-spacing: 8px;
padding: 0;
right: 0;
top: 0;
writing-mode: horizontal-tb;
}
.wp-block-gallery.icon-caption .blocks-gallery-image figcaption,
.wp-block-gallery.icon-caption .blocks-gallery-item figcaption {
background: transparent;
font-size: 14px;
font-size: 0.875rem;
color: #1a1a1a;
}
.wp-block-gallery .blocks-gallery-grid {
justify-content: center;
width: 100%;
}
.massage-block {
justify-content: space-between;
margin-bottom: 2em;
}
.massage-block:nth-child(2n) {
flex-direction: row-reverse;
}
.massage-block h2,
.massage-block h3,
.massage-block h4 {
margin-top: 0;
margin-bottom: 0;
}
.massage-block figure.wp-block-image {
margin-top: 0;
}
.massage-block .wp-block-column:not(:first-child) {
margin-left: 0;
flex-basis: calc(100% - 290px);
}
.massage-block .wp-block-column:first-child {
align-items: center;
border: 3px solid #1a1a1a;
display: flex;
flex-direction: column;
height: 250px;
justify-content: flex-end;
max-width: 250px;
position: relative;
}
.massage-block .wp-block-column:first-child p {
color: #ec6336;
font-size: 18px;
font-size: 1.125rem;
margin-top: 0;
margin-bottom: 1em;
}
.massage-block:first-child .wp-block-column:first-child::before {
content: "1";
background-color: #ec6336;
position: absolute;
top: 0;
margin-top: -1em;
font-size: 36px;
padding-top: 1em;
padding-left: 0.5em;
padding-right: 0.5em;
padding-bottom: 0.5em;
z-index: -1;
}
.massage-block:nth-child(2) .wp-block-column:first-child::before {
content: "2";
background-color: #ec6336;
position: absolute;
top: 0;
margin-top: -1em;
font-size: 36px;
padding-top: 1em;
padding-left: 0.5em;
padding-right: 0.5em;
padding-bottom: 0.5em;
z-index: -1;
}
.massage-block:nth-child(3) .wp-block-column:first-child::before {
content: "3";
background-color: #ec6336;
position: absolute;
top: 0;
margin-top: -1em;
font-size: 36px;
padding-top: 1em;
padding-left: 0.5em;
padding-right: 0.5em;
padding-bottom: 0.5em;
z-index: -1;
}
.campaign-loop .wp-block-gallery.columns-4 {
gap: 1em;
}
@media screen and (max-width: 37.5em) {
.wp-block-media-text.grid-row-reverse .wp-block-media-text__media {
grid-column: 1;
}
.wp-block-media-text .half-layout .wp-block-media-text__content {
padding: 0 8%;
}
.wp-block-gallery .blocks-gallery-image,
.wp-block-gallery .blocks-gallery-item {
width: 50%;
margin: 0;
}
.wp-block-gallery .blocks-gallery-image figcaption.vertical,
.wp-block-gallery .blocks-gallery-item figcaption.vertical {
writing-mode: horizontal-tb;
}
ul.wp-block-gallery.columns-4 li,
figure.wp-block-gallery.columns-4 li {
padding-bottom: 20px;
}
ul.wp-block-gallery.columns-4 li:nth-child(2n),
figure.wp-block-gallery.columns-4 li:nth-child(2n) {
padding-left: 10px;
}
ul.wp-block-gallery.columns-4 li:nth-child(2n+1),
figure.wp-block-gallery.columns-4 li:nth-child(2n+1) {
padding-right: 10px;
}
ul.wp-block-gallery.columns-3 li,
ul.wp-block-gallery.columns-2 li,
figure.wp-block-gallery.columns-3 li,
figure.wp-block-gallery.columns-2 li {
width: 100%;
margin-bottom: 1.5em;
}
.campaign-loop .wp-block-gallery.columns-3 {
align-items: flex-start;
}
.campaign-loop .wp-block-gallery.columns-3 li {
margin-bottom: 2em;
margin-left: auto;
margin-right: auto;
width: 90%;
}
.campaign-loop .wp-block-gallery.columns-4 {
gap: 0;
justify-content: center;
}
.campaign-loop .blocks-gallery-image img,
.campaign-loop .blocks-gallery-item img {
width: 100%;
}
.massage-block .wp-block-column:first-child {
margin-left: auto;
margin-right: auto;
}
.massage-block .wp-block-column:not(:first-child) {
flex-basis: 100%;
}
} .wp-block-media-text.balloon {
grid-template-columns: 100px auto;
margin-bottom: 1.5em;
-webkit-box-align: initial;
-ms-flex-align: initial;
align-items: initial;
}
.wp-block-media-text.balloon.has-media-on-the-right {
grid-template-columns: auto 100px;
}
.wp-block-media-text.balloon.has-media-on-the-right .wp-block-media-text__content {
margin-right: 20px;
margin-left: 0;
}
.wp-block-media-text.balloon.has-media-on-the-right .wp-block-media-text__content::before {
border-left: 10px solid #aaa;
border-right: none;
right: -20px;
left: 100%;
}
.wp-block-media-text.balloon.has-media-on-the-right .wp-block-media-text__content::after {
border-left: 10px solid #fff;
border-right: none;
right: -19px;
left: calc(100% - 1px);
}
.balloon figure {
-ms-flex-item-align: start;
align-self: flex-start;
vertical-align: top;
}
.balloon figure img {
border-radius: 50%;
border: 1px solid #ddd;
}
.balloon .wp-block-media-text__content {
-ms-flex-item-align: end;
align-self: flex-end;
border: 2px solid #ec6336;
border-radius: 5px;
padding: 4%;
position: relative;
margin-left: 20px;
width: 100%;
}
.balloon .wp-block-media-text__content p:last-child {
margin: 0;
}
.balloon .wp-block-media-text__content::before,
.balloon .wp-block-media-text__content::after {
position: absolute;
content: "";
border: 10px solid transparent;
top: 25px;
}
.balloon .wp-block-media-text__content::before {
border-right: 10px solid #ec6336;
left: -22px;
}
.balloon .wp-block-media-text__content::after {
border-right: 10px solid #fff;
left: -19px;
}
@media screen and (max-width: 600px) {
.balloon {
padding-left: 20px;
padding-right: 20px;
}
} body.blog .tag-cloud-link,
.archive .tag-cloud-link,
.single-post .tag-cloud-link {
font-size: 16px !important;
font-size: 1rem !important;
}
body.blog .nav-wrapper,
.archive .nav-wrapper,
.single-post .nav-wrapper {
background: #ec6336;
padding-bottom: 1rem;
position: relative;
}
body.blog .site-content,
.archive .site-content,
.single-post .site-content {
align-items: flex-start;
max-width: 1000px;
margin-left: auto;
margin-right: auto;
}
body.blog .nav-links,
.archive .nav-links,
.single-post .nav-links {
margin: 1em auto;
}
body.blog #primary,
.archive #primary,
.single-post #primary {
padding-right: 1rem;
}
body.blog #secondary,
.archive #secondary,
.single-post #secondary {
padding-left: 1rem;
}
body.blog #secondary .widget,
.archive #secondary .widget,
.single-post #secondary .widget {
justify-content: flex-start;
}
body.blog #secondary h2,
.archive #secondary h2,
.single-post #secondary h2 {
border-bottom: 1px solid #ec6336;
color: #ec6336;
font-size: 24px;
font-size: 1.5rem;
}
body.blog #secondary ul,
.archive #secondary ul,
.single-post #secondary ul {
list-style: none;
margin-left: 0;
padding-left: 0;
}
body.blog #secondary a,
.archive #secondary a,
.single-post #secondary a {
color: #333;
}
body.blog #secondary a:hover,
body.blog #secondary a:visited,
.archive #secondary a:hover,
.archive #secondary a:visited,
.single-post #secondary a:hover,
.single-post #secondary a:visited {
color: #666;
}
body.blog h1.entry-title,
.archive h1.entry-title {
font-size: 24px;
font-size: 1.5rem;
margin-top: 0;
line-height: 1.5;
}
body.blog h1.entry-title a,
.archive h1.entry-title a {
color: #1a1a1a;
transition: color 0.25s linear;
}
body.blog h1.entry-title a:hover,
.archive h1.entry-title a:hover {
color: #ec6336;
transition: color 0.25s linear;
}
body.blog .wp-block-media-text,
.archive .wp-block-media-text {
grid-template-columns: calc(100%/3) auto;
align-items: start;
}
body.blog .wp-block-media-text a,
.archive .wp-block-media-text a {
align-self: center;
}
@media screen and (max-width: 37.5em) {
body.blog .nav-wrapper,
.archive .nav-wrapper,
.single-post .nav-wrapper {
padding-bottom: 0;
}
body.blog #secondary,
.archive #secondary,
.single-post #secondary {
padding: 0 20px;
width: 100%;
}
body.blog #primary,
.archive #primary,
.single-post #primary {
padding: 0;
width: 100%;
}
body.blog #primary p,
body.blog #primary .entry-header,
body.blog #primary .entry-footer,
body.blog #primary .wp-block-heading,
body.blog #primary .navigation.post-navigation,
.archive #primary p,
.archive #primary .entry-header,
.archive #primary .entry-footer,
.archive #primary .wp-block-heading,
.archive #primary .navigation.post-navigation,
.single-post #primary p,
.single-post #primary .entry-header,
.single-post #primary .entry-footer,
.single-post #primary .wp-block-heading,
.single-post #primary .navigation.post-navigation {
padding: 0 20px;
}
.single-post .page-header {
margin-bottom: 0;
}
.single-post #primary .cta-btn {
width: 65%;
}
} .site-branding {
padding-top: 3rem;
padding-bottom: 2rem;
}
@media screen and (max-width: 768px) {
.site-branding {
display: flex;
justify-content: center;
align-items: center;
padding: 0.5rem;
}
.site-branding a.custom-logo-link {
padding-right: 1.5em;
}
} .faq-loop h3.faq-question {
display: flex;
align-items: center;
}
.faq-loop h3.faq-question::before {
content: url(https://karada39.com.tw/wp-content/themes/karada/assets/img/icon-q.png);
margin-right: 1em;
}
.faq-loop p.faq-answer {
border-radius: 10px;
padding: 1em;
line-height: 1.5;
} .single-course .faq-loop p:last-child {
margin-bottom: 100px;
}
.course-process > div {
max-width: 1500px;
margin-bottom: 72px;
padding-top: 75px;
padding-bottom: 50px;
width: 85%;
}
.course-process > div h3,
.course-process > div p {
padding-left: 50px;
}
.course-process > div img {
display: block;
}
.course-process > div:nth-child(odd) {
margin-left: auto;
}
.course-process > div:nth-child(even) {
flex-direction: row-reverse;
}
.course-process > div:nth-child(even) h3 {
padding-left: 75px;
}
.course-process > div:nth-child(even) img {
margin-left: auto;
}
.course-process h3 {
font-size: 30px;
font-size: 1.875rem;
}
.course-process #step-1 h3::before {
content: "01";
background-color: #f07944;
border-radius: 50%;
display: inline-flex;
width: 100px;
height: 100px;
justify-content: center;
align-items: center;
border: 3px solid;
margin-right: 1.5em;
}
.course-process #step-2 h3::before {
content: "02";
background-color: #f07944;
border-radius: 50%;
display: inline-flex;
width: 100px;
height: 100px;
justify-content: center;
align-items: center;
border: 3px solid;
margin-right: 1.5em;
}
.course-process #step-3 h3::before {
content: "03";
background-color: #f07944;
border-radius: 50%;
display: inline-flex;
width: 100px;
height: 100px;
justify-content: center;
align-items: center;
border: 3px solid;
margin-right: 1.5em;
}
.course-process #step-4 h3::before {
content: "04";
background-color: #f07944;
border-radius: 50%;
display: inline-flex;
width: 100px;
height: 100px;
justify-content: center;
align-items: center;
border: 3px solid;
margin-right: 1.5em;
}
.course-process #step-5 h3::before {
content: "05";
background-color: #f07944;
border-radius: 50%;
display: inline-flex;
width: 100px;
height: 100px;
justify-content: center;
align-items: center;
border: 3px solid;
margin-right: 1.5em;
}
.course-process #step-6 h3::before {
content: "06";
background-color: #f07944;
border-radius: 50%;
display: inline-flex;
width: 100px;
height: 100px;
justify-content: center;
align-items: center;
border: 3px solid;
margin-right: 1.5em;
}
.course-process #step-7 h3::before {
content: "07";
background-color: #f07944;
border-radius: 50%;
display: inline-flex;
width: 100px;
height: 100px;
justify-content: center;
align-items: center;
border: 3px solid;
margin-right: 1.5em;
}
.course-process #step-8 h3::before {
content: "08";
background-color: #f07944;
border-radius: 50%;
display: inline-flex;
width: 100px;
height: 100px;
justify-content: center;
align-items: center;
border: 3px solid;
margin-right: 1.5em;
}
.course-process #step-9 h3::before {
content: "09";
background-color: #f07944;
border-radius: 50%;
display: inline-flex;
width: 100px;
height: 100px;
justify-content: center;
align-items: center;
border: 3px solid;
margin-right: 1.5em;
}
@media screen and (max-width: 768px) {
.course-feedback > [class*="f-w-"] {
margin-bottom: 1em;
width: 100%;
}
.course-process > div {
border-radius: 10px;
flex-wrap: wrap;
width: 90%;
}
.course-process > div:nth-child(odd),
.course-process > div:nth-child(even) {
margin-right: auto;
margin-left: auto;
flex-direction: row;
}
.course-process > div:nth-child(odd) img,
.course-process > div:nth-child(even) img {
margin-left: auto;
margin-right: auto;
}
.course-process > div:nth-child(odd) h3,
.course-process > div:nth-child(odd) p,
.course-process > div:nth-child(even) h3,
.course-process > div:nth-child(even) p {
padding-left: 25px;
padding-right: 25px;
}
.course-process > div .f-w-50 {
width: 100%;
}
.course-process #step-1 h3::before {
content: "01";
background-color: #f07944;
border-radius: 50%;
display: inline-flex;
width: 100px;
height: 100px;
justify-content: center;
align-items: center;
border: 3px solid;
margin-right: 1em;
}
.course-process #step-2 h3::before {
content: "02";
background-color: #f07944;
border-radius: 50%;
display: inline-flex;
width: 100px;
height: 100px;
justify-content: center;
align-items: center;
border: 3px solid;
margin-right: 1em;
}
.course-process #step-3 h3::before {
content: "03";
background-color: #f07944;
border-radius: 50%;
display: inline-flex;
width: 100px;
height: 100px;
justify-content: center;
align-items: center;
border: 3px solid;
margin-right: 1em;
}
.course-process #step-4 h3::before {
content: "04";
background-color: #f07944;
border-radius: 50%;
display: inline-flex;
width: 100px;
height: 100px;
justify-content: center;
align-items: center;
border: 3px solid;
margin-right: 1em;
}
.course-process #step-5 h3::before {
content: "05";
background-color: #f07944;
border-radius: 50%;
display: inline-flex;
width: 100px;
height: 100px;
justify-content: center;
align-items: center;
border: 3px solid;
margin-right: 1em;
}
.course-process #step-6 h3::before {
content: "06";
background-color: #f07944;
border-radius: 50%;
display: inline-flex;
width: 100px;
height: 100px;
justify-content: center;
align-items: center;
border: 3px solid;
margin-right: 1em;
}
.course-process #step-7 h3::before {
content: "07";
background-color: #f07944;
border-radius: 50%;
display: inline-flex;
width: 100px;
height: 100px;
justify-content: center;
align-items: center;
border: 3px solid;
margin-right: 1em;
}
.course-process #step-8 h3::before {
content: "08";
background-color: #f07944;
border-radius: 50%;
display: inline-flex;
width: 100px;
height: 100px;
justify-content: center;
align-items: center;
border: 3px solid;
margin-right: 1em;
}
.course-process #step-9 h3::before {
content: "09";
background-color: #f07944;
border-radius: 50%;
display: inline-flex;
width: 100px;
height: 100px;
justify-content: center;
align-items: center;
border: 3px solid;
margin-right: 1em;
}
} .yotu-playlist {
min-height: 320px;
}
.yotu-playlist .yotu-videos {
float: none;
} .single-coupon header.entry-header,
.single-coupon .entry-content > p,
.single-coupon .entry-content ul,
.single-coupon .entry-content li,
.single-coupon blockquote,
.single-coupon h1,
.single-coupon h2,
.single-coupon h3,
.single-coupon h4,
.single-coupon h5,
.single-coupon h6,
.single-info header.entry-header,
.single-info .entry-content > p,
.single-info .entry-content ul,
.single-info .entry-content li,
.single-info blockquote,
.single-info h1,
.single-info h2,
.single-info h3,
.single-info h4,
.single-info h5,
.single-info h6 {
max-width: 1000px;
width: 90%;
margin-left: auto;
margin-right: auto;
} .single-member #entry-content,
#member-header > .inner-wrap {
max-width: 1000px;
margin: auto;
text-align: center;
}
.single-member #entry-content .flex {
gap: 60px;
}
@media screen and (max-width: 768px) {
.single-member #entry-content .flex {
gap: 11px;
}
}
.single-member #entry-content .member-info-wrapper {
padding: 0 15px;
}
.member-img {
width: calc(50% - 60px);
}
@media screen and (max-width: 768px) {
.member-img {
width: 100%;
}
}
.member-img img {
max-width: 450px;
width: 100%;
}
.member-info-wrapper #member-info {
margin-bottom: 60px;
}
@media screen and (max-width: 768px) {
.member-info-wrapper #member-info {
margin-bottom: 32px;
}
}
.member-info-wrapper table {
width: 50%;
margin-top: auto;
border-collapse: collapse;
}
@media screen and (max-width: 768px) {
.member-info-wrapper table {
width: 100%;
}
}
.member-info-wrapper table th,
.member-info-wrapper table td {
border: 1px solid #707070;
padding: 18px;
text-align: left;
}
.member-info-wrapper table th {
background-color: #f9f3dd;
width: 168px;
}
@media screen and (max-width: 768px) {
.member-info-wrapper table th {
width: 33%;
}
}
.member-info-wrapper table ul {
margin-left: 0;
padding-left: 20px;
}
#booking-from-member #select-store,
#booking-from-member #booking-link,
#booking-from-member #store-phone {
margin-bottom: 40px;
}
@media screen and (max-width: 768px) {
#booking-from-member #select-store,
#booking-from-member #booking-link,
#booking-from-member #store-phone {
margin-bottom: 20px;
}
}
#booking-from-member #select-store {
display: block;
border-radius: 10px;
margin: 16px auto 40px;
max-width: 436px;
padding: 1em;
}
#booking-from-member label {
font-weight: 700;
} .error404 .content-area {
margin-top: 68px;
margin-bottom: 100px;
}
.error404 .page-content > * {
max-width: 1000px;
margin-left: auto;
margin-right: auto;
width: 90%;
}
.error404 .page-content > * > * {
margin-bottom: 1.5em;
} .comments-area {
max-width: 1000px;
width: 90%;
margin-left: auto;
margin-right: auto;
} .site-footer {
min-height: 400px;
}
@media screen and (max-width: 768px) {
.site-footer {
display: flex;
flex-direction: column;
padding: 50px 20px 1em 20px;
}
.site-footer .footer-navigation {
order: 1;
padding-top: 1em;
padding-bottom: 1em;
}
.site-footer .widget-area {
flex-wrap: wrap;
order: 2;
}
.site-footer .widget-area .widget {
width: 25%;
margin-bottom: 0;
}
.site-footer .widget-area .widget:first-child {
order: 1;
}
.site-footer .widget-area .widget img {
width: 50px;
}
.site-footer .widget-area .widget p {
margin-bottom: 0;
}
.site-footer a.custom-logo-link {
order: 0;
}
.site-footer .copyright {
display: block;
color: #fff;
order: 3;
}
} #top-members-wrapper,
#course-top-wrapper {
gap: 24px;
}
@media screen and (max-width: 768px) {
#top-members-wrapper,
#course-top-wrapper {
justify-content: flex-start;
}
}
#top-members-wrapper .top-member,
#top-members-wrapper .course-top-member,
#course-top-wrapper .top-member,
#course-top-wrapper .course-top-member {
width: calc(20% - 20px);
}
@media screen and (max-width: 768px) {
#top-members-wrapper .top-member,
#top-members-wrapper .course-top-member,
#course-top-wrapper .top-member,
#course-top-wrapper .course-top-member {
width: calc(50% - 12px);
}
}
#top-members-wrapper .top-member a,
#top-members-wrapper .course-top-member a,
#course-top-wrapper .top-member a,
#course-top-wrapper .course-top-member a {
color: #1a1a1a;
}
#top-members-wrapper .top-member {
position: relative;
}
#top-members-wrapper .member-badge {
background: #333;
border-radius: 50%;
color: #f1f1f1;
position: absolute;
width: 50px;
height: 50px;
font-size: 20px;
top: -25px;
left: -20px;
display: flex;
justify-content: center;
align-items: center;
}
@media screen and (max-width: 768px) {
#top-members-wrapper .member-badge {
top: -15px;
left: -12px;
}
}
#top-members-wrapper div:first-child .member-badge,
#top-members-wrapper div:nth-child(2) .member-badge,
#top-members-wrapper div:nth-child(3) .member-badge {
color: #1a1a1a;
}
#top-members-wrapper div:first-child .member-badge {
background-color: #f5d100;
}
#top-members-wrapper div:nth-child(2) .member-badge {
background-color: #b9c3c9;
}
#top-members-wrapper div:nth-child(3) .member-badge {
background-color: #b87333;
}
.top-member-name,
.course-top-member-name,
.course-top-name {
text-align: center;
}
.course-top-name {
background-color: #ec6336;
margin-bottom: 0;
color: #f1f1f1;
}
.top-member-name,
.course-top-member-name {
margin-top: 0;
} .flex {
display: flex;
}
.flex .align-self-end {
margin-left: auto;
}
.flex-wrap {
flex-wrap: wrap;
}
.flex-column {
flex-direction: column;
}
.flex-column .align-self-end {
margin-top: auto;
}
.flex-row-reverse {
flex-direction: row-reverse;
}
.flex-grow-1 {
flex-grow: 1 !important;
}
.flex-grow-2 {
flex-grow: 2 !important;
}
.flex-grow-3 {
flex-grow: 3 !important;
}
.flex-grow-4 {
flex-grow: 4 !important;
}
.flex-grow-5 {
flex-grow: 5 !important;
}
.f-w-33 {
width: 33.33%;
}
.f-w-25 {
width: 25%;
}
.f-w-50 {
width: 50%;
}
.f-w-66 {
width: 66.67%;
}
.f-w-75 {
width: 75%;
}
.f-w-100 {
width: 100%;
}
.justify-center {
justify-content: center;
}
.align-center {
align-items: center;
}
.align-end {
align-items: flex-end;
} .mx-auto {
margin-left: auto;
margin-right: auto;
}
.my-auto {
margin-top: auto;
margin-bottom: auto;
}
.pt-0-em {
padding-top: 0;
}
.pb-0-em {
padding-bottom: 0;
}
.pr-0-em {
padding-right: 0;
}
.pl-0-em {
padding-left: 0;
}
.mt-0-em {
margin-top: 0 !important;
}
.mb-0-em {
margin-bottom: 0 !important;
}
.mr-0-em {
margin-right: 0;
}
.ml-0-em {
margin-left: 0;
}
.px-0-em {
padding-left: 0;
padding-right: 0;
}
.py-0-em {
padding-top: 0;
padding-bottom: 0;
}
.mx-0-em {
margin-left: 0;
margin-right: 0;
}
.my-0-em {
margin-top: 0;
margin-bottom: 0;
}
.pt-1-em {
padding-top: 1rem;
}
.pb-1-em {
padding-bottom: 1rem;
}
.pr-1-em {
padding-right: 1rem;
}
.pl-1-em {
padding-left: 1rem;
}
.mt-1-em {
margin-top: 1rem !important;
}
.mb-1-em {
margin-bottom: 1rem !important;
}
.mr-1-em {
margin-right: 1rem;
}
.ml-1-em {
margin-left: 1rem;
}
.px-1-em {
padding-left: 1em;
padding-right: 1em;
}
.py-1-em {
padding-top: 1em;
padding-bottom: 1em;
}
.mx-1-em {
margin-left: 1em;
margin-right: 1em;
}
.my-1-em {
margin-top: 1em;
margin-bottom: 1em;
}
.pt-2-em {
padding-top: 2rem;
}
.pb-2-em {
padding-bottom: 2rem;
}
.pr-2-em {
padding-right: 2rem;
}
.pl-2-em {
padding-left: 2rem;
}
.mt-2-em {
margin-top: 2rem !important;
}
.mb-2-em {
margin-bottom: 2rem !important;
}
.mr-2-em {
margin-right: 2rem;
}
.ml-2-em {
margin-left: 2rem;
}
.px-2-em {
padding-left: 2em;
padding-right: 2em;
}
.py-2-em {
padding-top: 2em;
padding-bottom: 2em;
}
.mx-2-em {
margin-left: 2em;
margin-right: 2em;
}
.my-2-em {
margin-top: 2em;
margin-bottom: 2em;
}
.pt-3-em {
padding-top: 3rem;
}
.pb-3-em {
padding-bottom: 3rem;
}
.pr-3-em {
padding-right: 3rem;
}
.pl-3-em {
padding-left: 3rem;
}
.mt-3-em {
margin-top: 3rem !important;
}
.mb-3-em {
margin-bottom: 3rem !important;
}
.mr-3-em {
margin-right: 3rem;
}
.ml-3-em {
margin-left: 3rem;
}
.px-3-em {
padding-left: 3em;
padding-right: 3em;
}
.py-3-em {
padding-top: 3em;
padding-bottom: 3em;
}
.mx-3-em {
margin-left: 3em;
margin-right: 3em;
}
.my-3-em {
margin-top: 3em;
margin-bottom: 3em;
}
.pt-4-em {
padding-top: 4rem;
}
.pb-4-em {
padding-bottom: 4rem;
}
.pr-4-em {
padding-right: 4rem;
}
.pl-4-em {
padding-left: 4rem;
}
.mt-4-em {
margin-top: 4rem !important;
}
.mb-4-em {
margin-bottom: 4rem !important;
}
.mr-4-em {
margin-right: 4rem;
}
.ml-4-em {
margin-left: 4rem;
}
.px-4-em {
padding-left: 4em;
padding-right: 4em;
}
.py-4-em {
padding-top: 4em;
padding-bottom: 4em;
}
.mx-4-em {
margin-left: 4em;
margin-right: 4em;
}
.my-4-em {
margin-top: 4em;
margin-bottom: 4em;
}
.pt-5-em {
padding-top: 5rem;
}
.pb-5-em {
padding-bottom: 5rem;
}
.pr-5-em {
padding-right: 5rem;
}
.pl-5-em {
padding-left: 5rem;
}
.mt-5-em {
margin-top: 5rem !important;
}
.mb-5-em {
margin-bottom: 5rem !important;
}
.mr-5-em {
margin-right: 5rem;
}
.ml-5-em {
margin-left: 5rem;
}
.px-5-em {
padding-left: 5em;
padding-right: 5em;
}
.py-5-em {
padding-top: 5em;
padding-bottom: 5em;
}
.mx-5-em {
margin-left: 5em;
margin-right: 5em;
}
.my-5-em {
margin-top: 5em;
margin-bottom: 5em;
} .comment-content a {
word-wrap: break-word;
}
.bypostauthor {
display: block;
}  .infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer { display: none;
} .infinity-end.neverending .site-footer {
display: block;
} .page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
border: none;
margin-bottom: 0;
margin-top: 0;
padding: 0;
} embed,
iframe,
object {
max-width: 100%;
} .custom-logo-link {
display: block;
max-width: 100%;
margin-left: auto;
margin-right: auto;
}
.custom-logo-link .custom-logo {
display: block;
margin-left: auto;
margin-right: auto;
} .scroll-down {
position: absolute;
bottom: -3em;
right: 0;
left: 0;
text-decoration: none;
}
.scroll-down #scroll-down {
width: 24px;
height: 46px;
border-radius: 12px;
border: solid 3px #333;
background-color: #f37a45;
}
.scroll-down #scroll-down #scroll-dot {
width: 5px;
height: 5px;
background-color: #333;
}
.page-header > .post-thumbnail {
position: relative;
}
.page-header > .post-thumbnail h1 {
position: absolute;
bottom: 0;
top: 0;
right: 25%;
left: 25%;
letter-spacing: 8px;
font-size: 44px;
font-size: 2.75rem; display: flex;
justify-content: center;
align-items: center;
text-align: center;
width: 50%;
}
.post-thumbnail img {
width: 100%;
}
.post-thumbnail.thumbnail-coupon img,
.post-thumbnail.thumbnail-info img {
width: auto;
display: block;
margin-left: auto;
margin-right: auto;
padding-top: 120px;
}
.store-loop {
max-width: 900px;
margin: 0 auto 3em;
}
.store-loop .wp-block-gallery.columns-2 {
align-items: flex-start;
}
.store-loop .wp-block-gallery.columns-2 .blocks-gallery-item {
padding: 0 16px;
}
.store-loop figure {
border: solid 3px #c0a972;
}
.store-loop figure::before,
.store-loop figure::after {
content: "";
position: absolute;
top: 0;
right: 0;
border-color: transparent;
border-style: solid;
}
.store-loop figure::after {
border-radius: 0;
border-width: 0.55em 0.9em;
border-right-color: #fff;
border-top-color: #fff;
}
.store-loop .wp-block-gallery .blocks-gallery-image img,
.store-loop .wp-block-gallery .blocks-gallery-item img {
width: 100%;
}
@media screen and (min-width: 37.5em) {
.store-loop .wp-block-gallery.columns-6 .blocks-gallery-image,
.store-loop .wp-block-gallery.columns-6 .blocks-gallery-item {
align-self: center;
width: 150px;
margin: 0 0 1.5em 0;
flex-grow: 0;
}
}
.pop-course figure.wp-block-image img {
margin: auto;
}
@media screen and (max-width: 37.5em) {
.wp-block-gallery.columns-3 figure.wp-block-image,
.wp-block-gallery.columns-4 figure.wp-block-image,
.pop-course figure.wp-block-image {
flex-grow: 0 !important;
}
}
.wp-block-gallery[class*="columns-"] .blocks-gallery-item figure {
justify-content: center;
}
.wp-block-gallery[class*="columns-"] ul.blocks-gallery-grid {
justify-content: flex-start;
}
.wp-block-gallery[class*="columns-"] ul.blocks-gallery-grid li {
max-width: calc(50% - 1em);
margin: 0;
}
@media screen and (min-width: 37.5em) {
.wp-block-gallery[class*="columns-"] ul.blocks-gallery-grid li {
margin-bottom: 2em;
}
}
@media screen and (max-width: 37.5em) {
.wp-block-gallery[class*="columns-"] ul.blocks-gallery-grid {
gap: 1.5em;
justify-content: space-between;
}
}
.wp-block-gallery.columns-3 > .blocks-gallery-grid {
justify-content: flex-start;
}
.wp-block-gallery.columns-2:not(.has-nested-images) .blocks-gallery-item,
.wp-block-gallery.columns-3:not(.has-nested-images) .blocks-gallery-item {
flex-grow: unset;
}
.wp-block-gallery.columns-6 .blocks-gallery-item {
margin: 0 !important;
}
@media screen and (max-width: 37.5em) {
.store-loop .wp-block-gallery.columns-2 .blocks-gallery-image,
.store-loop .wp-block-gallery.columns-2 .blocks-gallery-item {
width: 100%;
}
.page-header > .post-thumbnail h1 {
font-size: 32px;
font-size: 2rem;
left: 0;
right: 0;
width: 90%;
margin: auto;
}
.page-header > .post-thumbnail.thumbnail-coupon img {
padding-top: 60px;
}
} .wp-caption {
margin-bottom: 1.5em;
max-width: 100%;
}
.wp-caption img[class*="wp-image-"] {
display: block;
margin-left: auto;
margin-right: auto;
}
.wp-caption .wp-caption-text {
margin: 0.8075em 0;
}
.wp-caption-text {
text-align: center;
} .gallery {
margin-bottom: 1.5em;
}
.gallery-item {
display: inline-block;
text-align: center;
vertical-align: top;
width: 100%;
}
.gallery-columns-2 .gallery-item {
max-width: 50%;
}
.gallery-columns-3 .gallery-item {
max-width: 33.33%;
}
.gallery-columns-4 .gallery-item {
max-width: 25%;
}
.gallery-columns-5 .gallery-item {
max-width: 20%;
}
.gallery-columns-6 .gallery-item {
max-width: 16.66%;
}
.gallery-columns-7 .gallery-item {
max-width: 14.28%;
}
.gallery-columns-8 .gallery-item {
max-width: 12.5%;
}
.gallery-columns-9 .gallery-item {
max-width: 11.11%;
}
.gallery-caption {
display: block;
}