.wpsm-show a, .wpsm-show:active, .wpsm-show:visited {
cursor: pointer;
text-decoration: none;
font-size: 100%;
}
.wpsm-show:hover {
cursor: pointer;
text-decoration: underline;
}
.wpsm-hide a, .wpsm-hide:active, .wpsm-hide:visited {
cursor: pointer;
text-decoration: none;
}
.wpsm-hide:hover {
cursor: pointer;
text-decoration: underline;
}
.wpsm-content-hide {
display: none;
}html {
padding: 0;
margin: 0;
}
body {
padding: 0;
margin: 0;
background-color: #FAF9F6;
font-family: 'Montserrat', 'Arial';
min-height: 100vh;
display: flex;
flex-direction: column;
}
a {
text-decoration: none;
color: inherit;
}
iframe {
width: 100%;
height: 350px;
}
@media screen and (min-width: 800px) {
iframe {
height: 500px;
}
}
h2 {
padding: 0;
margin: 0;
} header {
background-color: transparent;
height: 64px;
display: flex;
justify-content: center;
}
.menu-container {
display: flex;
justify-content: space-between;
align-items: center;
gap: 14px;
padding: 11px max(20px, calc((100% - 1140px) / 2));
margin: 0;
width: 100%;
max-width: none;
box-sizing: border-box;
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 10;
background: rgba(250, 249, 246, .88);
-webkit-backdrop-filter: blur(14px) saturate(130%);
backdrop-filter: blur(14px) saturate(130%);
border-bottom: 1px solid rgba(1, 33, 47, .08);
box-shadow: 0 6px 24px rgba(1, 33, 47, .07);
transition: background .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.logo img {
width: 250px;
height: auto;
} .button-container {
vertical-align: center;
display: flex;
justify-content: space-around;
cursor: pointer;
-webkit-tap-highlight-color: transparent;
}
.fa-search {
color: #002535;
padding-right: 15px;
margin-top: -3px;
font-size: 23px !important;
}
.menu-button span {
display: block;
width: 30px;
height: 3px;
margin-bottom: 5px;
background: #002535;
border-radius: 2px;
} .mobile-menu {
position: fixed;
top: 0;
right: 0;
height: 100vh;
height: 100dvh;
width: min(87%, 400px);
z-index: 20;
display: flex;
flex-direction: column;
padding: 0;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
color: #fff;
background: linear-gradient(160deg, #00506f 0%, #012432 55%, #01212d 100%);
box-shadow: -26px 0 70px rgba(0, 0, 0, .45);
transform: translateX(102%);
transition: transform .42s cubic-bezier(.2, .74, .2, 1);
}
.mobile-menu::before {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
height: 4px;
background: linear-gradient(90deg, #ffab40, #ff6b5c 35%, #ff5c8a 62%, #0bbcd6);
}
body.menu-open { overflow: hidden; }
body.menu-open .mobile-menu { transform: translateX(0); }
.mobile-menu__head {
display: flex;
align-items: center;
justify-content: space-between;
padding: 24px 24px 10px;
flex: none;
}
.mobile-menu__logo img {
width: 178px;
height: auto;
filter: brightness(0) invert(1);
}
.closebtn {
flex: none;
width: 42px;
height: 42px;
border-radius: 50%;
border: 1px solid rgba(255, 255, 255, .22);
display: grid;
place-items: center;
font-size: 28px;
line-height: 1;
font-weight: 300;
color: #fff;
cursor: pointer;
-webkit-tap-highlight-color: transparent;
transition: background .2s ease, transform .3s ease, border-color .2s ease;
}
.closebtn:hover,
.closebtn:active {
background: rgba(255, 255, 255, .12);
border-color: rgba(255, 255, 255, .5);
transform: rotate(90deg);
}
.mobile-search {
width: auto;
margin: 0;
box-sizing: border-box;
padding: 10px 24px 20px;
flex: none;
}
.mobile-menu ul {
list-style: none;
padding: 0;
margin: 0;
}
.mobile-menu ul li {
border-top: 1px solid rgba(255, 255, 255, .07);
}
.mobile-menu ul li:last-child { border-bottom: 1px solid rgba(255, 255, 255, .07); }
.mobile-menu ul li a {
display: flex;
align-items: center;
justify-content: space-between;
padding: 18px 26px;
font-size: 1.14rem;
font-weight: 600;
letter-spacing: .01em;
color: #fff;
transition: background .22s ease, padding-left .22s ease, color .22s ease;
}
.mobile-menu ul li a svg {
width: 17px;
height: 17px;
color: #7fb0c3;
transition: transform .22s ease, color .22s ease;
}
.mobile-menu ul li a:hover,
.mobile-menu ul li a:active {
background: rgba(255, 255, 255, .05);
padding-left: 32px;
color: #6fe0ee;
}
.mobile-menu ul li a:hover svg,
.mobile-menu ul li a:active svg {
transform: translateX(4px);
color: #6fe0ee;
}
.mobile-menu__cta {
display: flex;
align-items: center;
justify-content: center;
gap: 9px;
margin: 26px 24px 4px;
padding: 16px;
border-radius: 999px;
font-weight: 800;
font-size: 1rem;
color: #fff;
background: linear-gradient(120deg, #ff6b5c, #ff5c8a);
box-shadow: 0 14px 30px rgba(255, 92, 138, .34);
transition: transform .2s ease, filter .2s ease;
}
.mobile-menu__cta:active { transform: scale(.98); }
.mobile-menu__cta svg { width: 18px; height: 18px; }
.mobile-menu__social {
margin-top: auto;
padding: 26px 24px 32px;
text-align: center;
}
.mobile-menu__social-label {
display: block;
font-size: .72rem;
letter-spacing: .2em;
text-transform: uppercase;
color: #79b0c3;
margin-bottom: 4px;
}
.mobile-menu .footer-socials {
justify-content: center;
padding-top: 4px;
}
.offMenuToggle {
position: fixed;
inset: 0;
height: 100%;
z-index: 15;
background-color: rgba(1, 18, 26, .5);
-webkit-backdrop-filter: blur(3px);
backdrop-filter: blur(3px);
opacity: 0;
visibility: hidden;
pointer-events: none;
transition: opacity .35s ease, visibility .35s ease;
}
body.menu-open .offMenuToggle {
opacity: 1;
visibility: visible;
pointer-events: auto;
}
.search-field {
width: 100%;
height: 100%;
border: none;
padding: 0;
background-color: transparent;
font-family: 'Montserrat', 'Arial';
font-size: 0.92rem;
color: #002535;
}
.search-field::placeholder { color: #8aa0a9; }
input:focus {
outline:none;
border: none;
}
.search-field-box {
display: flex;
align-items: center;
gap: 8px;
height: 38px;
background-color: #fff;
border: 1px solid rgba(1, 33, 47, .14);
border-radius: 999px;
padding: 0 16px;
transition: border-color .2s ease, box-shadow .2s ease;
}
.search-field-box:focus-within {
border-color: #0bbcd6;
box-shadow: 0 0 0 3px rgba(11, 188, 214, .14);
}
.search-field-box button,
.search-field-box .search-button {
flex: none;
background: transparent;
border: none;
padding: 0;
display: grid;
place-items: center;
cursor: pointer;
color: #002535;
transition: color .2s ease;
}
.search-field-box button:hover { color: #0bbcd6; }
.search-field-box i {
color: inherit !important;
margin: 0;
padding: 0;
font-size: 100% !important;
}
.desktop-menu {
display: none;
}
.desktop-search {
width: clamp(190px, 22vw, 264px);
}
@media screen and (max-width: 800px) {
.desktop-search {
display: none;
}
header {
height: 72px;
}
.menu-container {
padding-top: 16px;
padding-bottom: 16px;
}
}
@media screen and (min-width: 800px) {   
.desktop-menu {
display: flex;
}
.desktop-menu ul li {
display: inline;
padding-right: 25px;
font-size: 120%;
font-weight: bold;
font-family: 'Montserrat', 'Arial';
color: #003851;
}
.desktop-menu ul li:hover {
color: #2c6a8a;
}
.button-container {
display: none;
}
.desktop-menu a {
background: linear-gradient(to right, rgba(100, 200, 200, 0), rgba(100, 200, 200, 0)), linear-gradient(to right, rgba(255, 0, 0, 1), rgba(255, 0, 180, 1), rgba(0, 100, 200, 1));
background-size: 100% 0.1em, 0 0.1em;
background-position: 100% 100%, 0 100%;
background-repeat: no-repeat;
transition: background-size 400ms;
}
.desktop-menu a:hover,
.desktop-menu a:focus {
background-size: 0 0.1em, 100% 0.1em;
}
.desktop-menu ul li.nav-cta { padding-right: 0; }
.desktop-menu ul li.nav-cta a {
display: inline-block;
color: #fff !important;
padding: 10px 20px;
border-radius: 999px;
background: linear-gradient(120deg, #ff6b5c, #ff5c8a) !important;
background-size: auto !important;
box-shadow: 0 8px 20px rgba(255, 92, 138, .35);
transition: transform .25s ease, box-shadow .25s ease, filter .25s ease;
}
.desktop-menu ul li.nav-cta a:hover {
transform: translateY(-2px);
filter: brightness(1.05);
box-shadow: 0 12px 26px rgba(255, 92, 138, .45);
}
.search-field-box {
background-color: #fff;
}
} .fp-container {
margin: auto;
width: 100%;
max-width: 1100px;
}
.fp-cover img {
width: 100%;
height: auto;
}
@media screen and (min-width: 500px) {
.coverthree {
display: none;
}
}
@media screen and (max-width: 500px) {
.cover {
display: none;
}
.coverthree {
display: inline;
}
}
@media screen and (min-width: 1100px) {
.fp-cover img {
width: 100%;
height: 600px;
object-fit: none;
object-position: center;
}
}
.fp-ttd-container {
position: relative;
display: flex;
justify-content: center;
text-align: center;
padding-right: 5px;
}
.fp-ttd-title {
position: absolute;
background-color:rgba(0, 0, 0, 0.212);
padding: 10px;
color: rgba(255, 255, 255, 0.801);
font-style: inherit;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-webkit-tap-highlight-color: transparent;
}
.fp-ttd-container img.attachment-medium {
height: auto;
width: 400px;
}
.fp-ttd-columns {
display: flex;
flex-wrap: nowrap;
overflow-x: scroll; 
-webkit-overflow-scrolling: touch;
padding-inline-start: 0;
margin: 0;
margin-block-start: 0;
}
@media screen and (max-width: 1100px) {
.fp-ttd-container img.attachment-medium {
height: 200px;
width: 200px;
object-fit: cover;
border-radius: 50%;
}
.fp-ttd-title {
padding: 0;
background-color: transparent;
}
.fp-container {
margin: 5px;
} }
@media screen and (max-width: 410px) {
.fp-ttd-container img.attachment-medium {
height: 175px;
width: 175px;
object-fit: cover;
border-radius: 50%;
}
.fp-ttd-title {
padding: 0;
background-color: transparent;
font-size: 75%;
}
} .main-container {
margin: 0 auto;
width: 100%;
padding: 15px 0 30px;
max-width: 1100px;
box-sizing: border-box;
display: flex;
justify-content: left;
} .page-container {
width: 75%;
}
.sidebar-container {
width: 25%;
}
.sidebar-ad-slot {
position: sticky;
top: 15%;
display: flex;
justify-content: right;
}
.page-content {
padding-top: 10px;
}
.page-content .share-buttons {
display: flex;
justify-content: left;
padding-bottom: 15px;
}
.page-content .share-buttons svg {
padding: 5px 20px 0 0;
}
@media screen and (max-width: 800px) {
.page-container {
width: 100%;
box-sizing: border-box;
}
.sidebar-container {
display: none;
}
} .ttd-container {
position: relative;
display: flex;
justify-content: center;
text-align: center;
padding-right: 5px;
}
.ttd-title {
position: absolute;
background-color:rgba(0, 0, 0, 0.212);
padding: 10px;
color: rgba(255, 255, 255, 0.801);
font-style: inherit;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-webkit-tap-highlight-color: transparent;
}
.ttd-container img.attachment-medium {
height: auto;
width: 400px;
}
.ttd-columns {
display: flex;
flex-wrap: wrap;
justify-content: center;
padding-inline-start: 0;
margin: 0;
margin-block-start: 0;
}
@media screen and (max-width: 1100px) {
.ttd-container img.attachment-medium {
height: auto;
width: 100%;
}   
}
@media screen and (max-width: 900px) {
.ttd-container img.attachment-medium {
height: 200px;
width: 200px;
object-fit: cover;
border-radius: 50%;
}
.ttd-title {
padding: 0;
background-color: transparent;
}
}
@media screen and (max-width: 410px) {
.ttd-container img.attachment-medium {
height: 175px;
width: 175px;
object-fit: cover;
border-radius: 50%;
}
.ttd-title {
padding: 0;
background-color: transparent;
font-size: 75%;
}
} .archieve-title {
padding: 0 0 20px 5px;
}
.archieve-container {
display: flex;
justify-content: left;
align-items:center;
padding: 5px;
}
.archieve-content {
padding-left: 10px;
width: 50%;
}
.archieve-blog-title {
font-size: 150%;
font-weight: bold;
}
.archieve-img-container {
width: 50%;
}
.archieve-container img.attachment-medium {
width: 100%;
height: auto;
object-fit: cover;
}
.archieve-excerpt {
padding-top: 10px;
}
@media screen and (max-width: 800px) {
.archieve-excerpt {
display: none;
}
} .single-featured-img {
padding-top: 10px;
}
.single-featured-img img.attachment-large {
width: 100%;
height: auto;
}
.author-n-share {
display: flex;
justify-content: space-between;
align-items: center;
padding: 5px 0;
}
.single-info h4 {
margin-block-start: 0;
margin-block-end: 0;
padding: 10px 0 5px;
}
.single-info p {
margin-block-start: 0;
margin-block-end: 0;
font-size: 85%;
}
@media screen and (max-width: 1100px) {
.single-container {
padding: 0 10px;
}
}
.share-buttons {
display: flex;
justify-content: space-between;
}
.share-buttons svg {
padding: 10px 10px 0px;
fill: #003851;
}
.share-buttons button {
background-color: transparent;
border: none;
padding: 0;
cursor: pointer;
} .footer-socials {
display: flex;
justify-content: center;
padding-top: 15px;
}
.footer-socials i {
margin:0;
padding: 15px;
color: white;
font-size: 170% !important;
-webkit-tap-highlight-color: transparent;
} footer.site-footer {
margin-top: auto;
width: 100%;
position: relative;
color: #e7f0f3;
background: linear-gradient(180deg, #003851 0%, #01222f 100%);
font-family: 'Montserrat', 'Arial';
}
footer.site-footer::before {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
height: 4px;
background: linear-gradient(90deg, #ffab40, #ff6b5c 35%, #ff5c8a 62%, #0bbcd6);
}
.site-footer__inner {
max-width: 1140px;
margin: 0 auto;
box-sizing: border-box;
padding: 56px 30px 30px;
display: grid;
grid-template-columns: 1.5fr 1fr 1fr;
gap: 40px;
}
.site-footer__logo img {
width: 210px;
height: auto;
filter: brightness(0) invert(1);
}
.site-footer__tagline {
margin: 16px 0 0;
max-width: 340px;
line-height: 1.65;
font-size: 0.95rem;
color: #a9c3cd;
}
.site-footer__socials {
display: flex;
gap: 10px;
margin-top: 20px;
}
.site-footer__socials a {
width: 42px;
height: 42px;
border-radius: 50%;
display: grid;
place-items: center;
color: #fff;
border: 1px solid rgba(255, 255, 255, 0.22);
transition: background 0.25s ease, border-color 0.25s ease, transform 0.25s ease;
}
.site-footer__socials a:hover {
background: linear-gradient(120deg, #ff6b5c, #ff5c8a);
border-color: transparent;
transform: translateY(-3px);
}
.site-footer__socials i {
font-size: 120% !important;
color: #fff;
}
.site-footer__col h4 {
margin: 0 0 16px;
font-size: 0.78rem;
letter-spacing: 0.16em;
text-transform: uppercase;
color: #79b0c3;
font-weight: 700;
}
.site-footer__col ul {
list-style: none;
padding: 0;
margin: 0;
display: grid;
gap: 12px;
}
.site-footer__col a {
color: #d6e6ec;
font-size: 0.98rem;
transition: color 0.2s ease, padding-left 0.2s ease;
}
.site-footer__col a:hover {
color: #fff;
padding-left: 5px;
}
.site-footer__bar {
border-top: 1px solid rgba(255, 255, 255, 0.1);
max-width: 1140px;
margin: 0 auto;
box-sizing: border-box;
padding: 20px 30px;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
gap: 8px;
font-size: 0.85rem;
color: #8fadb8;
}
.site-footer__bar p { margin: 0; }
.site-footer__bar a {
color: #cfe6ee;
font-weight: 600;
transition: color 0.2s ease;
}
.site-footer__bar a:hover { color: #6fe0ee; }
@media screen and (max-width: 800px) {
.site-footer__inner {
grid-template-columns: 1fr;
gap: 32px;
padding: 44px 24px 26px;
}
.site-footer__bar {
flex-direction: column;
text-align: center;
align-items: center;
}
}