/* judson */ @font-face {font-family: 'judson'; src: url('../fonts/Judson-Bold.woff') format('woff'), font-weight: 300; font-style: normal; font-display: swap; } @font-face {font-family: 'judson'; src: url('../fonts/Judson-Italic.woff') format('woff'), font-weight: 200; font-style: normal; font-display: swap; } @font-face {font-family: 'judson'; src: url('../fonts/Judson-Regular.woff') format('woff'), font-weight: 600; font-style: normal; font-display: swap; } @font-face {font-family: 'judson'; src: url('../fonts/Judson-Bold.woff2') format('woff2'), font-weight: normal; font-style: normal; font-display: swap; } @font-face {font-family: 'judson'; src: url('../fonts/Judson-Italic.woff2') format('woff2'), font-weight: 500; font-style: normal; font-display: swap; } @font-face {font-family: 'judson'; src: url('../fonts/Judson-Regular.woff2') format('woff2'), font-weight: 100; font-style: normal; font-display: swap; } /* philosopher */ @font-face {font-family: 'philosopher'; src: url('../fonts/philosopher-SemiBold.woff2') format('woff2'), url('../fonts/philosopher-SemiBold.woff') format('woff'); font-weight: 600; font-style: normal; font-display: swap; } @font-face {font-family: 'philosopher'; src: url('../fonts/philosopher-Bold.woff2') format('woff2'), url('../fonts/philosopher-Bold.woff') format('woff'); font-weight: bold; font-style: normal; font-display: swap; } @font-face {font-family: 'philosopher'; src: url('../fonts/philosopher-Regular.woff2') format('woff2'), url('../fonts/philosopher-Regular.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap; } @font-face {font-family: 'philosopher'; src: url('../fonts/philosopher-Light.woff2') format('woff2'), url('../fonts/philosopher-Light.woff') format('woff'); font-weight: 300; font-style: normal; font-display: swap; } @font-face {font-family: 'philosopher'; src: url('../fonts/philosopher-Medium.woff2') format('woff2'), url('../fonts/philosopher-Medium.woff') format('woff'); font-weight: 500; font-style: normal; font-display: swap; } .philosopher{font-family: 'philosopher';} /* Common CSS */ *{margin: 0; padding: 0; box-sizing: border-box;} a{text-decoration: none; display: inline-block; transition: 0.2s ease-in;} a:hover{text-decoration: none;} body{font-size: 18px; color: #000; font-family: 'judson'; line-height: 1.8; font-weight: 400;} html{scroll-behavior: smooth;} :root{ --blueboxed-primary: #2f6dbf; --blueboxed-primary-strong: #21589f; --blueboxed-accent: #8FD8C7; --blueboxed-surface: #F0F8FF; --blueboxed-glass-bg: rgba(255, 255, 255, 0.25); --blueboxed-glass-border: rgba(58, 122, 197, 0.25); --blueboxed-shadow: 0 12px 30px rgba(41, 80, 150, 0.2); } button{outline: 0; border: 0; background: transparent;} .container{max-width: 1200px;} h1{font-size: 60px; line-height: 1.3 !important; font-weight: 400;} h2{font-size: 45px; line-height: 1.3 !important; font-weight: 400;} h3{font-size: 35px; line-height: 1.3 !important; font-weight: 400;} h4{font-size: 30px; line-height: 1.3 !important; font-weight: 400;} h5{font-size: 25px; line-height: 1.3 !important; font-weight: 400;} h6{font-size: 19px; line-height: 1.3 !important; font-weight: 400;} .font-13{font-size: 13px;} .font-14{font-size: 14px;} .font-16{font-size: 16px;} .font-18{font-size: 18px;} .font-20{font-size: 20px;} .font-300{font-weight: 300;} .font-400{font-weight: 400;} .font-500{font-weight: 500;} .font-600{font-weight: 600;} .font-700{font-weight: 700;} .border-r5{border-radius: 5px;} .border-r10{border-radius: 10px;} .border-r20{border-radius: 20px;} .border-r30{border-radius: 30px;} .border-r50{border-radius: 50px;} .border-50{border-radius: 100%;} .form-control{border-radius: 0; border: 0; background-color: transparent;} .form-control:focus{box-shadow: none; outline: 0;} .relative{position: relative;} .form-control::placeholder{color: #BEC2CE;} select{appearance: none; background: url('../images/angle-dropdown.png') no-repeat right 15px center; padding-right: 40px;} select:focus{outline: 0;} .text-underline{text-decoration: underline !important;} .pointer{cursor: pointer;} .zindex-0{z-index: 0;} .zindex-1{z-index: 1;} .zindex-m1{z-index: -1;} .t-green{color: #3a7ac5;} .t-black{color: #000;} .t-grey{color: #79869F;} .bg-grey{background-color: #f9f8f6;} .bg-green{background-color: #3a7ac5;} .grey-link{color: #454545;} .grey-link:hover{color: #3a7ac5; text-shadow: 0 0 1px #3a7ac5;} .grey-link2{color: #c6c6c6;} .grey-link2:hover{color: #3a7ac5; text-shadow: 0 0 1px #3a7ac5;} .green-link{color: #3a7ac5;} .green-link:hover{color: #3a7ac5; text-shadow: 0 0 1px #3a7ac5;} .btn-green{font-family: 'philosopher'; padding: 10px 35px; border-radius: 10px; color: #fff; background-color: #3a7ac5; font-size: 18px; border: 2px solid #3a7ac5; display: inline-block; text-align: center; min-width: 150px; line-height: 22px;} .btn-green:hover {color: #3a7ac5; background-color: transparent;} .btn-green2{font-family: 'philosopher'; padding: 10px 35px; border-radius: 50px; color: #3a7ac5; background-color: transparent; font-size: 18px; border: 2px solid #3a7ac5; display: inline-block; text-align: center; min-width: 150px; line-height: 22px;} .btn-green2:hover {color: #fff; background-color: #3a7ac5;} .btn-yellow{font-family: 'philosopher'; padding: 10px 35px; border-radius: 50px; color: #000; background-color: #fad13e; font-size: 18px; border: 2px solid #fad13e; display: inline-block; text-align: center; min-width: 165px; line-height: 22px; box-shadow: 0 2px #9f8630c7;} .btn-yellow:hover {color: #fad13e; background-color: transparent; box-shadow:none;} .btn-white{font-family: 'philosopher'; padding: 10px 15px; border-radius: 50px; color: #fff; background-color: transparent; font-size: 18px; border: 2px solid #fff; display: inline-block; text-align: center; min-width: 180px;} .btn-white:hover {color: #fff;} .btn-green, .btn-green2, .btn-yellow, .btn-white{ transition: transform 0.2s ease, box-shadow 0.2s ease, color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease; } .btn-green:focus-visible, .btn-green2:focus-visible, .btn-yellow:focus-visible, .btn-white:focus-visible{ outline: 2px dashed #fff; outline-offset: 3px; } /* Site Branding */ .site-logo {max-width: 100px;} .site-branding{padding-top: 15px;} .site-branding .site-title a {font-size: 25px; color: #fff;} h1.site-title, h1.site-title a{color: #fff;} /* Header CSS */ .menu {background-color: rgba(47, 109, 191, 0.95); box-shadow: 0 10px 24px rgba(21, 60, 120, 0.25); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);} .menu .navbar-nav ul{display: flex; align-items: center; flex-direction: row; gap: 18px; list-style: none; margin: 0;} .menu .navbar-nav li{margin: 0;} .menu .navbar-nav li a{color: #fff; display: inline-flex; align-items: center;} .navbar-collapse{align-items: center;} .menu .page_item a{color: #fff; position: relative; padding: 8px 6px; border-radius: 8px;} .menu .page_item a:focus-visible{outline: 2px dashed #fff; outline-offset: 3px;} .menu .page_item a:after{content: ""; position: absolute; left: 8px; right: 8px; bottom: 4px; height: 2px; background-color: #8FD8C7; opacity: 0; transform: scaleX(0.6); transition: transform 0.2s ease, opacity 0.2s ease;} .menu .page_item a:hover, .menu .page_item a:focus-visible{color: #8FD8C7;} .menu .page_item a:hover:after, .menu .page_item a:focus-visible:after{opacity: 1; transform: scaleX(1);} .menu .navbar-nav li a{position: relative; padding: 8px 6px; border-radius: 8px;} .menu .navbar-nav li a:focus-visible{outline: 2px dashed #fff; outline-offset: 3px;} .menu .navbar-nav li.active a, .menu .navbar-nav li a:hover {color: #8FD8C7; } .menu .navbar-nav li a:after{content: ""; position: absolute; left: 8px; right: 8px; bottom: 4px; height: 2px; background-color: #8FD8C7; opacity: 0; transform: scaleX(0.6); transition: transform 0.2s ease, opacity 0.2s ease;} .menu .navbar-nav li a:hover:after, .menu .navbar-nav li.active a:after{opacity: 1; transform: scaleX(1);} .menu .navbar-nav li{margin: 0 10px; position: relative;padding: 10px 0;} .menu ul ul { list-style: none; display: none; right: auto; left: 0; border-top: 1px solid #3a7ac5; margin: 0; min-width: 245px; position: absolute; top: 50px; z-index: 9999; background: rgba(37, 39, 40, 0.95); padding: 0px; box-shadow: 0 14px 28px rgba(0, 0, 0, 0.2); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);} .menu li:hover ul li{padding: 5px 0;} .menu li:hover ul { display: block; } .menu .navbar-nav li.current-menu-item ul a{color: #fff;} .menu .navbar-nav li ul li a{color: #fff;} .header-right-section img{width: 35px; height: 35px;} .navbar-brand {max-width: 260px;} .navbar-expand-lg {justify-content: space-between;} .navbar-expand-lg .navbar-collapse {justify-content: flex-end;} .navbar{gap: 18px; align-items: center;} .nav-right{display: flex; align-items: center; gap: 16px; margin-left: auto;} .navbar-collapse{flex: 1 1 auto;} .header-right-section{margin-left: 0;} .mobile-menu-close {display: none;} .submenu-caret:after { content: "+"; display: inline-block; font-size: 18px; left: 0; position: relative; font-family: "FontAwesome"; color: #fff;font-style: normal; cursor: pointer; } .submenu-caret {padding: 0 10px;} .submenu-caret:focus { padding: 0 10px; outline: 1px dotted white;} /* Search Box */ .search-field-form {padding: 5px; display: flex; background-color: rgba(255, 255, 255, 0.95); box-shadow: 0 12px 26px rgba(41, 80, 150, 0.2); border-radius: 10px; opacity: 0; visibility: hidden; position: absolute; transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s ease; right: 0; bottom: -150px; z-index: 1; transform: translateY(8px); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border: 1px solid rgba(58, 122, 197, 0.2);} .header-search .form-active {opacity: 1; visibility: visible; bottom: -105px; transform: translateY(0); } .header-search input {border: 0; outline: 0; } .search-field-form input[type="text"] {min-height: 50px; width: 400px; border: 1px solid #3a7ac5; padding: 0px 12px; border-bottom-left-radius: 8px; border-top-left-radius: 8px; font-size: 16px; } .search-field-form input[type="text"]::placeholder{color: #B2B2B2;} .search-field-form input[type="submit"] {min-height: 50px; color: white; padding: 0px 20px; border-bottom-right-radius: 8px; border-top-right-radius: 8px; font-size: 16px; background: #3a7ac5;} .search-field-form input[type="submit"]:focus {border: 1px solid white;} .search-form {padding: 5px; display: flex; background-color: white; transition: all 0.3s ease-in-out !important; right: 0; bottom: -150px; z-index: 1; } .search-form label {margin: 0;} .search-form input[type="search"] {min-height: 50px; width: 400px; border: 1px solid #3a7ac5; padding: 0px 10px; border-bottom-left-radius: 5px; border-top-left-radius: 5px; font-size: 16px; } .search-form input[type="search"]::placeholder{color: #B2B2B2;} .search-form input[type="submit"] {min-height: 50px; color: white; padding: 0px 20px; border-bottom-right-radius: 5px; border-top-right-radius: 5px; font-size: 16px; background: #3a7ac5;} /* Page Content */ h1.entry-title{color: #f0f8ff;} h2.wp-block-heading{color: #3a7ac5;margin-bottom: 20px;} .blueboxed-page {padding: 60px 0; background: linear-gradient(180deg, #eff6ff 0%, #ffffff 70%);} .blueboxed-page article,.blueboxed-post article{border-bottom: 1px solid rgba(58, 122, 197, 0.35); margin-bottom: 22px; padding-bottom: 15px; background: rgba(70, 108, 160, 0.86); padding: 28px 30px; border-radius: 18px; box-shadow: var(--blueboxed-shadow); transition: transform 0.25s ease, box-shadow 0.25s ease; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border: 1px solid rgba(58, 122, 197, 0.25); color: #eef5ff;} .blueboxed-page article:hover, .blueboxed-page article:focus-within{transform: translateY(-4px); box-shadow: 0 16px 36px rgba(41, 80, 150, 0.28);} .blueboxed-post article:last-child{border-bottom: 0;} .page-header {border-bottom: 2px solid #3a7ac5; margin-bottom: 20px;} figure.wp-block-image.size-large.is-style-default img{border-radius: 50px;} /* Search Page */ .blueboxed-search .page-header { border-bottom: 2px solid #3a7ac5;} .blueboxed-search a { color: #000;} .blueboxed-search a:hover { color: #3a7ac5;} /* Page Links */ h2.entry-title a {color: #f0f8ff;} .nav-links a, .entry-meta a, .entry-content a, .readmore-meta a, .page-content a, .comment-form a { color: #295096; font-weight: bold; text-decoration: underline; } .entry-meta, .entry-meta a{color: #dbe6fb;} .entry-header .entry-title{color: #f3f8ff;} .entry-header .entry-title a{color: #f3f8ff;} .entry-header{margin-bottom: 10px;} .comment-form input[type="submit"] {background: #3a7ac5; color: #fff; padding: 10px 15px; border: 1px solid #3a7ac5;transition: .4s;} .comment-form input[type="submit"]:hover{color: #fff;background-color: #295096;border: 1px solid #295096;} /* Widget */ .widget-area a { color: #3a7ac5; font-weight: bold; } .widget-area ul { list-style-type: unset; } /* Footer */ footer{background-color: #2f6dbf; animation: blueboxed-footer-rise 0.7s ease both;} .blueboxed-footer .widget{margin: 0;} .blueboxed-footer p, .blueboxed-footer h2, .blueboxed-footer h3, .blueboxed-footer h4, .blueboxed-footer h5, .blueboxed-footer h6, .blueboxed-footer a, .blueboxed-footer span { color: #fff; margin-bottom: 0px; } .social-icons img{width: 45px; height: 45px;} .social-icons a{margin-left: 15px;} .footer-menu-title{margin: 8px 0 8px; font-size: 32px; font-weight: 500;} .footer-2{text-align: left;} .footer-2 .footer-menu, .footer-2 .menu, .footer-2 .menu ul{list-style: none; padding: 0; margin: 0; display: block;} .footer-2 .footer-menu li, .footer-2 .menu li{margin: 8px 0;} .footer-2 a{color: #ffffff; text-decoration: none; position: relative; padding-bottom: 4px; display: inline-block;} .footer-2 a:after{content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: #8FD8C7; opacity: 0; transform: scaleX(0.7); transition: transform 0.2s ease, opacity 0.2s ease;} .footer-2 a:hover, .footer-2 a:focus-visible{color: #8FD8C7;} .footer-2 a:hover:after, .footer-2 a:focus-visible:after{opacity: 1; transform: scaleX(1);} /* Comment Form */ .comment-meta { background-color: unset; } .comment-meta a, .reply a, .comment-respond a { color: #3a7ac5; font-weight: bold; text-decoration: underline; } .comment-meta .comment-author img { height: 30px; width: 30px; border-radius: 50%; } #respond h3 { font-size: 20px; } #respond h3 small {margin-left: 10px;} /* Content Layout */ .content-posts{display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1.45fr); gap: 24px; align-items: start;} .content-posts .post-thumbnail{width: 100%; max-height: 220px; border-radius: 14px; overflow: hidden; box-shadow: 0 12px 28px rgba(21, 60, 120, 0.25); background: rgba(255, 255, 255, 0.15); display: flex;} .content-posts .post-thumbnail img{border-radius: 14px; transition: transform 0.35s ease; width: 100%; height: 100%; object-fit: cover; display: block;} .content-posts .post-thumbnail a:focus-visible{outline: 2px dashed #fff; outline-offset: 4px;} .content-posts .entry-content{background-color: rgba(240, 248, 255, 0.92); border-radius: 16px; border: 1px solid rgba(58, 122, 197, 0.2); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.35); padding: 22px; color: #1b2a44;} .content-posts .entry-content p{color: #1b2a44;} .single-post .content-posts .post-thumbnail{max-width: 100%; max-height: none;} .single-post .content-posts{grid-template-columns: 1fr; gap: 20px;} .single-post .content-posts .post-thumbnail img{width: 100%; height: auto;} .single-post .content-posts .post-thumbnail{margin-bottom: 10px;} .single-post .entry-content{background-color: rgba(240, 248, 255, 0.95);} .content-posts:hover .post-thumbnail img{transform: scale(1.02);} .readmore-meta a{transition: transform 0.2s ease, box-shadow 0.2s ease;} .readmore-meta a:hover{transform: translateY(-2px); box-shadow: 0 10px 18px rgba(41, 80, 150, 0.2);} /* Motion */ @keyframes blueboxed-fade-up{ from{opacity: 0; transform: translateY(12px);} to{opacity: 1; transform: translateY(0);} } .blueboxed-page article{animation: blueboxed-fade-up 0.6s ease both;} @keyframes blueboxed-slide-down{ from{opacity: 0; transform: translateY(-10px);} to{opacity: 1; transform: translateY(0);} } @keyframes blueboxed-footer-rise{ from{opacity: 0; transform: translateY(10px);} to{opacity: 1; transform: translateY(0);} } .site-header{animation: blueboxed-slide-down 0.6s ease both;} @media (prefers-reduced-motion: reduce){ *{animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important;} }