/* ==================== Import Fonts ==================== */
/* ===== Custom Font Family Setup ===== */
@font-face {
font-family: "BN";
src: url("../fonts/Blauer-Nue-Light-iF6626350c6db36.otf") format("opentype");
font-weight: 300;
font-style: normal;
}
@font-face {
font-family: "BN";
src: url("../fonts/Blauer-Nue-Regular-iF6626350c83fdf.otf") format("opentype");
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: "BN";
src: url("../fonts/Blauer-Nue-Medium-iF6626350c78103.otf") format("opentype");
font-weight: 500;
font-style: normal;
}
@font-face {
font-family: "BN";
src: url("../fonts/Blauer-Nue-Semibold-iF6626350c8d55c.otf") format("opentype");
font-weight: 600;
font-style: normal;
}
@font-face {
font-family: "BN";
src: url("../fonts/Blauer-Nue-Heavy-iF6626350c62afa.otf") format("opentype");
font-weight: 700;
font-style: normal;
}
@font-face {
font-family: "BN";
src: url("../fonts/Blauer-Nue-Extrabold-iF6626350c4c856.otf") format("opentype");
font-weight: 800;
font-style: normal;
}
/* ==================== Common Reset ==================== */
* {
padding: 0;
margin: 0;
outline: none;
border: none;
box-sizing: border-box;
}
html {
font-size: 1rem;
scroll-behavior: smooth !important;
}
body {
display: block;
width: 100%;
padding: 0;
margin: 0;
font-family: "BN";
color: var(--text-primary);
font-weight: 400;
font-size: 16px;
line-height: 1.33;
position: relative;
top: 0 !important;
background-color: var(--white);
}
.overflow-hidden {
overflow: hidden;
height: 100vh;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
display: block;
}
ul,
ol {
list-style: none;
margin: 0;
padding: 0;
}
blockquote,
q {
quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
content: "";
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
a {
display: inline-block;
font-size: 16px;
text-decoration: none;
transition: all 0.4s ease-in-out;
}
*:focus {
outline: none;
}
button[type="button"]:focus {
outline: none;
}
input:focus,
.form-control:focus {
outline: none;
box-shadow: none;
border-color: inherit;
resize: none;
}
/* ==================== Common style ==================== */
.wrapper {
display: block;
overflow: hidden;
min-height: 100vh;
position: relative;
}
.container-fluid {
max-width: 1720px;
margin: 0 auto;
padding: 0;
}
.container {
max-width: 1320px;
margin: 0 auto;
padding: 0;
}
.common-sec {
padding-block: 80px 80px;
}
.icon {
display: inline-block;
height: 1em;
width: 1em;
-webkit-mask-repeat: no-repeat;
-webkit-mask-position: center;
-webkit-mask-size: contain;
background-color: currentColor;
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
transition: all 0.4s ease;
}
p {
color: var(--text-secondary);
font-size: 16px;
line-height: 1.55;
}
p:last-child {
margin-bottom: 0;
}
a {
display: inline-block;
}
img {
display: block;
max-width: 100%;
max-height: 100%;
width: auto;
height: auto;
}
.shadow-overlay {
position: fixed;
inset: 0;
background: rgba(0, 0, 0, 0.6);
opacity: 0;
visibility: hidden;
transition: opacity 0.3s ease, visibility 0.3s ease;
z-index: 99;
}
body.nav-open .shadow-overlay {
opacity: 1;
visibility: visible;
}
/* ==================== Common Classes ==================== */
:root {
--primary-color: #7bae7f;
--primary-hover: #689a6e;
--text-primary: #2b312c;
--text-secondary: #474e48;
--light-bg: #f8f8f8;
--little-light: #f3f6f3;
--white: #ffffff;
--black: #000000;
--shadow-light: 0 2px 8px rgba(0, 0, 0, 0.1);
--shadow-medium: 0 4px 16px rgba(0, 0, 0, 0.15);
--border-radius: 12px;
--transition: all 0.3s ease-in-out;
}
.sub-title {
font-weight: 600;
font-size: 14px;
line-height: 1;
letter-spacing: 0.1em;
position: relative;
text-transform: uppercase;
margin-bottom: 22px;
padding-left:28px;
}
.sub-title::before {
content: "";
position: absolute;
left: 0;
top: 50%;
width: 20px;
height: 20px;
transform: translateY(-50%);
background-image: url("https://internationaljgo.com/wp-content/themes/ljgo/img/svg/handshake.svg");
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.sub-title img {
display: none !important;
}
.sec-title {
font-weight: 600;
font-size: 28px;
line-height: 1.36;
}
.sec-head {
margin-bottom: 40px;
}
.md-title {
font-weight: 600;
font-size: 22px;
line-height: 1;
margin-bottom: 6px;
}
.cm-row .right {
display: flex;
align-items: center;
padding-bottom: 8px;
}
.cm-row .right .cms-con {
flex: 1;
margin-right: 24px;
}
.cm-row .sec-head {
margin-bottom: 0;
}
.cm-row {
align-items: flex-end;
margin-bottom: 30px;
}
.cm-row .sec-title {
margin-bottom: 0;
}
/* slick-dot */
.slick-dots {
text-align: center;
margin-top: 20px;
line-height: 0;
}
.slick-dots li {
display: inline-block;
margin: 0 7px;
line-height: 0;
}
.slick-dots li button {
width: 12px;
height: 12px;
border-radius: 100%;
background: var(--primary-color);
opacity: 0.2;
padding: 0;
font-size: 0;
}
.slick-dots li.slick-active button {
opacity: 1;
}
/* slick-arrow */
.slick-prev,
.slick-next {
font-size: 0;
position: absolute;
width: 48px;
height: 48px;
background: var(--white);
top: 50%;
border-radius: 50%;
transition: var(--transition);
}
.slick-next {
right: -70px;
}
.slick-prev {
left: -70px;
}
.slick-prev::before,
.slick-next::before {
content: "";
position: absolute;
display: block;
width: 16px;
height: 8px;
background-color: var(--text-secondary);
mask-image: url("../img/svg/right_arrow.svg");
mask-size: cover;
mask-position: center;
mask-repeat: no-repeat;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
transition: var(--transition);
}
.slick-prev::before {
transform: translate(-50%, -50%) scale(-1); /* flip for left arrow */
}
.slick-prev:hover::before,
.slick-next:hover::before {
background-color: var(--white);
}
.slick-prev:hover,
.slick-next:hover {
background-color: var(--primary-color);
}
/* slick slider height 100% */
.slider-wrapper,
.slick-slider,
.slick-list,
.slick-track,
.slick-slide > div {
height: 100%;
}
.slick-slide > div > div {
height: 100%;
}
.slick-track {
display: flex !important;
}
.slick-slide {
height: auto !important;
display: flex;
}
.slick-slide > div {
flex: 1;
}
/* ======================= cms-con ============================== */
.cms-con h3 {
font-weight: 600;
font-size: 22px;
line-height: 1.27;
margin-bottom: 12px;
}
.cms-con h4 {
font-weight: 600;
font-size: 20px;
line-height: 1.27;
margin-bottom: 12px;
}
.cms-con p {
font-weight: 300;
font-size: 16px;
line-height: 1.6;
margin-bottom: 20px;
color: var(--text-secondary);
}
.cms-con p:last-child {
margin-bottom: 0;
}
.cms-con span {
display: inline-block;
font-weight: 300;
font-size: 14px;
line-height: 1;
margin-bottom: 12px;
}
.cms-con span:last-child {
margin-bottom: 0;
}
/* same style */
.submit-card::before,
.val-proposition .btm-row > div:first-child .pro-position-card .box::before,
.val-proposition .btm-row > div:last-child .pro-position-card .box::before,
.team-card .box::before {
content: "";
width: 50%;
height: 123px;
background-color: inherit;
position: absolute;
top: -20px;
left: 0;
border-radius: 16px;
z-index: -1;
clip-path: polygon(0 0, 100% 20px, 100% 100%, 0% 100%);
}
.team-sec .btm-row > div:nth-child(2) .team-card .box::before,
.team-sec .btm-row > div:nth-child(4) .team-card .box::before,
.right .submit-card::before,
.val-proposition .btm-row > div:last-child .pro-position-card .box::before {
transform: scaleX(-1);
right: 0;
left: inherit;
}
.val-proposition .btm-row > div:first-child .pro-position-card .box::before,
.val-proposition .btm-row > div:last-child .pro-position-card .box::before,
.team-card .box::before {
width: 95%;
}
/* ==================== btn style ==================== */
.btn {
display: inline-block;
font-weight: 500;
font-size: 16px;
line-height: 1;
text-align: center;
background-color: transparent;
padding: 18px 26px;
border: 1.5px solid;
border-radius: 100px;
text-transform: capitalize;
transition: var(--transition);
}
.btn:has(.icon) {
display: inline-flex;
justify-content: center;
align-items: center;
gap: 12px;
}
.btn .icon {
width: 16px;
height: 8px;
mask-size: cover;
}
.btn:hover .icon {
transform: translate(3px) scale(1.1);
}
.btn-green {
color: var(--primary-color);
border-color: var(--primary-color);
}
.btn-green:hover {
color: var(--white);
background-color: var(--primary-color);
border-color: var(--primary-color);
}
.btn-white {
color: var(--white);
border-color: var(--white);
}
.btn-white:hover {
color: var(--white);
background-color: var(--text-primary);
border-color: var(--text-primary);
}
.arrow-icon {
mask-image: url(../img/svg/right_arrow.svg);
}
.vector-arrow {
mask-image: url(../img/svg/Vector-arrow.svg);
}
/* ======= HEADER STYLING ======= */
.header {
width: 100%;
position: relative;
z-index: 1000;
}
.sticky-header .btm-header {
position: fixed;
padding: 12px 0;
top: 0;
left: 0;
right: 0;
z-index: 999;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
transform: translateY(-100%);
animation: slideDown 0.8s ease forwards;
}
@keyframes slideDown {
from {
transform: translateY(-100%);
}
to {
transform: translateY(0);
}
}
/* --- Top Header --- */
.xy-icons {
display: inline-flex;
gap: 0px;
margin-right: 5px;
}
.xy-icons .icon {
color: var(--white);
width: 12px;
height: 6px;
mask-size: cover;
opacity: 0.2;
transform: rotate(90deg);
animation: arrowFlash 2s linear infinite;
margin-left: -4px;
}
/* keyframes = flash once */
@keyframes arrowFlash {
0% {
opacity: 1;
}
10% {
opacity: 0.75;
}
25% {
opacity: 0.5;
}
50% {
opacity: 0.25;
}
100% {
opacity: 0.2;
}
}
/* staggered delays so wave goes forward */
.xy-icons .icon:nth-child(5) {
animation-delay: 0s;
}
.xy-icons .icon:nth-child(4) {
animation-delay: 0.1s;
}
.xy-icons .icon:nth-child(3) {
animation-delay: 0.4s;
}
.xy-icons .icon:nth-child(2) {
animation-delay: 0.6s;
}
.xy-icons .icon:nth-child(1) {
animation-delay: 0.8s;
margin: 0;
}
.top-header {
background: var(--text-primary); /* dark strip */
padding: 10px 0px;
font-size: 14px;
color: var(--white);
}
.top-header p {
font-weight: 400;
font-size: 14px;
line-height: 1;
margin: 0;
color: var(--white);
}
.social-links ul {
display: flex;
gap: 25px;
margin: 0;
padding: 0;
list-style: none;
}
.social-links ul li a {
color: var(--white);
font-size: 18px;
display: inline-flex;
align-items: center;
transition: color 0.3s ease;
}
.social-links ul li a:hover {
color: var(--primary-color);
}
/* individual icons */
.fb-icon {
-webkit-mask-image: url("../img/svg/facebook.svg");
mask-image: url("../img/svg/facebook.svg");
}
.x-icon {
-webkit-mask-image: url("../img/svg/x.svg");
mask-image: url("../img/svg/x.svg");
}
.linkedin-icon {
-webkit-mask-image: url("../img/svg/linkedin.svg");
mask-image: url("../img/svg/linkedin.svg");
}
.researchgate-icon {
-webkit-mask-image: url("../img/svg/researchgate.svg");
mask-image: url("../img/svg/researchgate.svg");
}
.insta-icon {
-webkit-mask-image: url("../img/svg/instagram.svg");
mask-image: url("../img/svg/instagram.svg");
}
/* --- Bottom Header --- */
.btm-header {
background: var(--white);
padding: 20px 0;
border-bottom: 1px solid #eee;
}
.header-logo {
position: relative;
z-index: 50;
max-height: 48px;
display: block;
}
.header-logo img {
height: 75px;
transform: translateY(-10px);
}
.nav-logo img {
height: 75px;
/* filter: drop-shadow(0px 5px 10px #0000000d); */
}
/* --- Navigation --- */
.main-nav ul {
display: flex;
align-items: center;
gap: 26px;
}
.main-nav ul li {
position: relative;
}
.has-submenu .icon {
height: 7px;
width: 10px;
mask-size: cover;
}
.main-nav ul li a {
font-weight: 500;
font-size: 16px;
padding: 8px 0;
color: var(--text-primary);
transition: var(--transition);
}
.main-nav ul li a:hover {
color: var(--primary-color);
}
/* Dropdown */
.main-nav ul li ul {
display: block;
position: absolute;
top: 100%;
left: 0;
background: #fff;
min-width: 180px;
padding: 10px 0;
opacity: 0;
transform: translateY(5px);
visibility: hidden;
transition: all 0.3s ease;
z-index: 99;
}
.main-nav ul li ul li {
width: 100%;
padding: 0;
}
.main-nav .has-submenu {
display: flex;
align-items: center;
gap: 6px;
}
.main-nav ul li ul li a {
display: block;
padding: 8px 15px;
font-size: 14px;
color: #333;
}
.main-nav ul li ul li a:hover {
background: var(--light-bg);
color: var(--primary-color);
}
/* Show dropdown on hover */
.main-nav ul li:hover > ul {
transform: translateY(0px);
opacity: 1;
visibility: visible;
}
/* --- Search Button --- */
.search-btn {
margin: 0 28px;
font-size: 16px;
color: var(--primary-color);
transition: color 0.3s ease;
}
.search-icon {
mask-image: url(../img/svg/search.svg);
}
.search-btn:hover {
color: var(--text-primary);
}
.searchMain {
position: absolute;
left: 0;
width: 100%;
background-color: var(--white);
padding: 35px 0;
opacity: 0;
visibility: hidden;
box-shadow: 0 8px 12px -4px rgba(0, 0, 0, 0.25);
transition: all 0.4s ease-in-out;
transform: translateY(-100%);
z-index: 1;
}
.header.has_sticky .searchMain {
padding: 33px 0;
}
.searchMain.active {
opacity: 1;
visibility: visible;
z-index: 49;
transform: translateY(-1%);
}
.close-icon {
mask-image: url(../img/svg/close-icon.svg);
}
.searchMain .form-control {
border: none;
width: 100%;
font-size: 18px;
padding: 0 35px 0;
line-height: 1.2;
background: transparent;
}
.searchMain .search-icon {
font-size: 20px;
}
.searchMain .form-control::placeholder {
font-size: 18px;
}
.searchMain .container {
position: relative;
}
.search-submit {
position: absolute;
width: 18px;
top: 50%;
transform: translateY(-50%);
left: 10px;
background-color: transparent;
}
.searchMain .closeSearch {
font-size: 20px;
position: absolute;
right: 0px;
top: 0;
bottom: 0;
margin: auto;
background-color: #9d9d9d;
cursor: pointer;
}
.searchMain .closeSearch:hover {
background-color: #ee1c25;
}
/* ========================hero-sec======================= */
.hero-sec {
position: relative;
color: var(--white);
background-image: url(../img/scientists-working.jpg);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
padding: 135px 0;
}
.hero-sec::before,
.hero-sec::after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 2;
}
.hero-sec::before {
background: linear-gradient(90deg, rgba(123, 174, 127, 0.8) 0%, rgba(123, 174, 127, 0.7) 50%, rgba(123, 174, 127, 0) 80%);
}
.hero-sec::after {
background-color: rgb(123, 174, 127, 0.3);
}
.hero-sec .hero-con {
position: relative;
z-index: 10;
}
.hero-con {
max-width: 752px;
}
.hero-title {
font-weight: 400;
font-size: 42px;
line-height: 1.2;
margin-bottom: 14px;
}
.hero-con p {
font-weight: 300;
font-size: 16px;
line-height: 1.5;
color: var(--white);
}
.hero-btns {
margin: 33px 0 50px;
}
.hero-btns .btn:not(:last-child) {
margin-right: 10px;
}
.hero-btns .btn,
.submit-card .btn {
padding-top: 15px;
padding-bottom: 15px;
}
.search-contain {
max-width: 560px;
margin: 50px 0 35px;
}
.hero-search {
display: flex;
align-items: center;
width: 100%;
background-color: var(--white);
border-radius: 12px;
padding: 5px 10px;
margin-bottom: 12px;
overflow: hidden;
}
.hero-search input {
flex: 1;
padding: 14px 10px;
font-weight: 300;
font-size: 15px;
line-height: 1;
color: var(--text-secondary);
}
.hero-search button {
width: 46px;
height: 46px;
border-radius: 10px;
border: none;
color: var(--white);
background-color: var(--primary-color);
display: flex;
align-items: center;
justify-content: center;
}
.search-contain ul li {
display: inline-block;
line-height: 1;
}
.search-contain ul li:last-child {
margin-right: 0;
}
.search-contain ul li a {
background: #ffffff33;
border-radius: 100px;
padding: 10px 12px;
margin-right: 1px;
font-weight: 400;
line-height: 1;
font-size: 13px;
color: var(--white);
}
.reviewers .images .slight {
display: inline-block;
height: 40px;
width: 40px;
}
.reviewers .images .slight:not(:first-child) {
margin-left: -16px;
}
.reviewers .images {
display: inline-block;
margin-right: 8px;
}
.reviewers .images .more {
display: inline-flex;
align-items: center;
justify-content: center;
border: 1px solid var(--white);
background-color: var(--primary-color);
}
.reviewers .tt-review {
display: inline-block;
vertical-align: middle;
}
.reviewers .md-title {
margin-bottom: 0;
}
.reviewers .tt-review span {
font-weight: 300;
font-size: 13px;
line-height: 1;
margin: 0;
}
.star-icon {
mask-image: url(../img/svg/star.svg);
font-size: 16px;
}
/* ================================about-sec =============================*/
.about-sec {
border-bottom: 1px solid rgba(43, 49, 44, 0.102);
}
.swb {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 15px;
}
.num-count {
display: flex;
align-items: center;
}
.stat-num {
font-weight: 600;
font-size: 26px;
line-height: 1;
margin-bottom: 10px;
}
.ab-stats-box p {
font-weight: 300;
font-size: 16px;
line-height: 1;
}
.about-sec .top-row {
padding-bottom: 32px;
margin-bottom: 50px;
border-bottom: 1px solid rgba(43, 49, 44, 0.102);
}
.about-sec .btm-row {
--bs-gutter-x: 0px;
}
.about-sec .btm-row .left .img {
margin-bottom: 50px;
}
.about-sec .btm-row .right .cms-con {
margin-bottom: 40px;
}
.about-sec .btm-row .right .md-title {
margin-bottom: 20px;
}
.about-sec .btm-row .right {
max-width: 607px;
margin-left: auto;
}
/* ======================== - Featured Section - ========================= */
.feature-sec .btm-row {
--bs-gutter-x: 24px;
--bs-gutter-y: 24px;
}
.feat-card .box,
.feat-card {
height: 100%;
}
.feat-card .box {
position: relative;
background-color: var(--little-light);
border-radius: 16px;
padding: 33px 20px 20px;
color: var(--text-primary);
transition: var(--transition);
display: flex;
justify-content: space-between;
flex-direction: column;
}
.feat-card .box .btn {
position: absolute;
border-radius: 50%;
padding: 0;
height: 48px;
width: 48px;
background-color: var(--white);
right: 20px;
top: 40px;
}
.feat-card .box:hover .btn .icon {
transform: none;
background-color: var(--primary-color) !important;
}
.feat-card .box .cms-con span {
color: var(--text-secondary);
opacity: 0.6;
margin-right: 68px;
}
.feat-card .box .cms-con h3 {
margin-right: 68px;
}
.feat-card .box .cms-con {
margin-bottom: 20px;
}
.feat-card .box .img-wrap span {
font-weight: 300;
font-size: 14px;
line-height: 1;
color: var(--text-secondary);
opacity: 0.8;
margin-bottom: 10px;
}
.feat-card .box .img-wrap span span {
font-weight: 400;
}
.feat-card .box:hover {
background-color: var(--primary-color);
}
.feat-card .box:hover h3,
.feat-card .box:hover span,
.feat-card .box:hover .img-wrap span,
.feat-card .box:hover .cms-con span,
.feat-card .box:hover p {
color: var(--white);
}
/* ================================ - sub-mission-sec - ========================= */
.sub-mission-sec {
position: relative;
background-color: var(--light-bg);
border-top-left-radius: 32px;
border-top-right-radius: 32px;
max-width: 1728px;
margin: 0 auto;
overflow: hidden;
z-index: 2;
}
.sub-mission-sec::before {
opacity: 0.4 !important;
}
.sub-mission-sec .container {
max-width: 1094px;
}
.sub-mission-sec .left,
.sub-mission-sec .right {
height: 100%;
}
.submit-card {
position: relative;
height: 100%;
background-color: var(--white);
padding: 40px 30px;
border-radius: 16px;
z-index: 2;
}
.submit-card .img {
height: 60px;
width: 60px;
margin-bottom: 24px;
}
.submit-card .img img {
height: 100%;
width: 100%;
}
.submit-card .cms-con p {
margin-bottom: 22px;
}
.val-proposition.common-sec {
padding-bottom: 60px;
}
/* ===================== - team meet - ============================ */
.val-proposition {
position: relative;
background-color: var(--primary-color);
color: var(--white);
z-index: 2;
}
.val-proposition::before,
.stats-sec .container::before,
.testimonial-sec::before,
.footer .bottom-footer::before,
.foot-card::before,
.sub-mission-sec::before {
content: "";
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
background-image: url(../img/dots.png);
background-repeat: repeat;
background-position: center;
opacity: 0.6;
z-index: -1;
}
.val-proposition .sub-title img {
filter: brightness(0) invert(1);
}
.val-proposition .right p {
color: var(--white);
}
.val-proposition .cm-row {
margin-bottom: 70px;
}
.val-proposition .cm-row .right {
padding: 0;
}
.pro-position-card,
.team-card {
height: 100%;
}
.pro-position-card .box {
position: relative;
background-color: var(--white);
padding: 40px 30px 34px;
color: var(--text-primary);
border-radius: 16px;
height: 100%;
z-index: 2;
}
.pro-position-card .box .img {
height: 60px;
width: 60px;
padding: 3px;
margin-bottom: 25px;
}
.pro-position-card .box .img img {
height: 100%;
width: 100%;
}
.pro-position-card .box .cms-con h3 {
margin-bottom: 18px;
}
/* ================== - team-sec - ====================== */
.team-sec .cm-row {
margin-bottom: 70px;
}
.team-sec .cm-row .right {
padding-bottom: 4px;
}
.team-card .box {
position: relative;
background-color: var(--little-light);
color: var(--text-primary);
border-radius: 16px;
padding: 40px 20px 20px;
text-align: center;
height: 100%;
z-index: 2;
}
.team-card .box .social-links ul li a {
color: var(--text-primary);
font-size: 16px;
}
.team-card .box .social-links ul {
justify-content: center;
margin-top: 24px;
gap: 20px;
}
.team-card .box .img img {
height: 160px;
width: 160px;
border-radius: 50%;
margin: 0 auto 25px;
}
.team-card .box hr,
.testimonial-slide .box hr {
width: 60px;
margin: 13px auto;
color: var(--text-primary);
opacity: 0.2;
}
.team-card .img span {
font-weight: 400;
font-size: 14px;
line-height: 1;
color: var(--text-secondary);
opacity: 0.6;
}
/* ============================.stats-sec======================== */
.stats-sec .container {
position: relative;
background-color: var(--primary-color);
padding: 50px;
border-radius: 16px;
color: var(--white);
z-index: 2;
}
.stats-sec .stat-box {
display: grid;
grid-template-columns: 60px 1fr;
align-items: start;
gap: 20px;
}
.stats-sec .stat-box .img {
height: 60px;
width: 60px;
background-color: rgb(255, 255, 255, 0.1);
display: flex;
align-items: center;
justify-content: center;
border-radius: 12px;
}
.stats-sec .stat-box .num-count {
font-weight: 600;
font-size: 26px;
line-height: 1;
margin-bottom: 5px;
}
.stats-sec .stat-box .con {
padding-top: 10px;
}
.stats-sec .stat-box p {
font-weight: 300;
font-size: 15px;
line-height: 1.6;
color: var(--white);
}
/* testimonial */
.testimonial-sec {
position: relative;
background-color: var(--light-bg);
z-index: 2;
}
.testimonial-sec .sub-title {
color: var(--primary-color);
}
.testimonial-slider {
position: relative;
}
/* .testimonial-slider::before,
.testimonial-slider::after {
content: "";
width: 31%;
height: 123px;
background-color: var(--white);
position: absolute;
top: 0px;
left: 0;
border-radius: 16px;
z-index: -1;
clip-path: polygon(0 0, 100% 20px, 100% 100%, 0% 100%);
} */
.testimonial-slider::after {
transform: scaleX(-1);
right: 0;
left: inherit;
}
/* .testimonial-slider .slick-track {
padding-top: 20px;
} */
.testimonial-slider .slick-list.draggable {
margin: 0 -12px;
}
.testimonial-slide {
padding: 0 12px;
height: 100%;
}
.testimonial-slide .box {
position: relative;
background-color: var(--white);
padding: 40px 30px;
text-align: center;
height: 100%;
border-radius: 16px;
z-index: 2;
}
.testimonial-slide .box .img img {
height: 90px;
width: 90px;
border-radius: 12px;
margin: 0 auto 30px;
}
.testimonial-slide .box .img {
margin-bottom: 6px;
}
.testimonial-slide .box hr {
margin: 23px auto;
}
.rating .icon.is-active {
background-color: #ebb81b;
}
.rating .icon {
font-size: 17px;
margin-right: 6px;
background-color: #f1f1f1;
}
.rating .icon:last-child {
margin-right: 0;
}
.testimonial-slide .box .cms-con p i {
font-weight: 300;
font-size: 18px;
line-height: 1.55;
}
.testimonial-slide .box .cms-con p {
margin-bottom: 0;
}
.testimonial-slide .box .cms-con p strong {
display: inline-block;
font-weight: 600;
font-size: 16px;
line-height: 1.55;
color: var(--text-primary);
}
.testimonial-slide .box .cms-con span {
font-weight: 400;
font-size: 16px;
line-height: 1;
opacity: 0.6;
}
/* ================= - hospitals-sec - =================== */
.hospitals .img-wrapper {
display: flex;
align-items: center;
justify-content: space-between;
padding: 40px !important;
border-radius: 16px;
background-color: var(--white);
margin-top: 80px;
}
.hospitals .img img {
height: 80px;
width: 80px;
object-fit: contain;
}
/*==============================================
= Footer =
==============================================*/
.footer {
overflow: hidden;
}
.footer .top-footer {
background-color: var(--white);
}
.footer .bottom-footer {
position: relative;
background-color: var(--text-primary);
z-index: 2;
}
/*==============================================
= Loop Text =
==============================================*/
.loop-text {
position: relative;
overflow: hidden;
background: var(--white);
padding: 40px 0;
}
.loop-text .marquee-track {
display: flex;
width: max-content;
animation: marquee 20s linear infinite; /* speed adjusted */
}
.loop-text .marquee {
display: flex;
align-items: center;
margin-right: 40px; /* spacing between repeats */
}
.loop-text p {
display: inline;
font-weight: 500;
font-size: 26px;
line-height: 1.46;
color: var(--primary-color);
margin: 0;
}
.loop-text .marquee span {
display: inline-block;
min-width: 30px;
height: 3px;
vertical-align: middle;
background-color: var(--primary-color);
margin: 0 20px;
}
@keyframes marquee {
from {
transform: translateX(0);
}
to {
transform: translateX(-50%); /* one full cycle */
}
}
/*==============================================
= Foot Card =
==============================================*/
.foot-card .sub-title::before{
filter: brightness(0) invert(1);
}
.foot-card {
position: relative;
padding: 40px 30px;
background-color: var(--primary-color);
color: var(--white);
max-width: 394px;
border-bottom-left-radius: 16px;
border-bottom-right-radius: 16px;
z-index: 2;
}
.foot-card .sub-title {
margin-bottom: 20px;
}
.foot-card .sub-title img {
filter: brightness(0) invert(1);
}
.foot-card .img {
margin-bottom: 40px;
}
.foot-card p {
font-weight: 300;
line-height: 1.62;
color: var(--white);
margin-bottom: 30px;
}
.foot-card .md-title {
font-size: 28px;
margin-bottom: 20px;
}
.foot-card .btns-group .btn,
.foot-card .btns-group input {
width: 100%;
}
.foot-card .btns-group .btn:hover {
color: var(--white) !important;
}
.foot-card .btns-group input {
padding: 20px;
font-weight: 400;
font-size: 16px;
line-height: 1;
background-color: transparent;
border: 1px solid var(--white);
border-radius: 100px;
color: var(--white);
margin-bottom: 15px;
}
.foot-card .btns-group input::placeholder {
color: rgba(255, 255, 255, 0.6);
}
.btn-bg-white {
background-color: var(--white);
border-color: var(--white);
color: var(--text-primary);
}
.btn-bg-white:hover {
background-color: var(--text-primary);
border-color: var(--text-primary);
color: var(--white);
}
/*==============================================
= Footer Info Blocks =
==============================================*/
.footer-info {
color: var(--white);
}
.footer-info .address-row,
.footer-info .bottom-info,
.footer-info .top-info {
position: relative;
padding: 44px 0;
}
.footer-info .top-info::before,
.footer-info .address-row::before,
.footer-info .bottom-info::before {
content: "";
position: absolute;
left: 0;
width: 100%;
bottom: 0;
height: 1px;
background: linear-gradient(90deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0) 100%);
}
.footer-info .info-box {
display: grid;
grid-template-columns: 42px 1fr;
gap: 15px;
}
.footer-info .top-info .col-md-4:nth-child(2) .info-box {
max-width: 200px;
margin-left: auto;
}
.email-icon {
mask-image: url(../img/svg/mail-send.svg);
}
.footer .footer-info span {
font-weight: 400;
font-size: 14px;
line-height: 1;
color: #eef9ef;
}
.footer-info .info-box p {
margin-bottom: 0;
font-weight: 500;
font-size: 18px;
line-height: 1.5;
color: var(--white);
}
.footer-info .info-box a {
font-weight: 500;
font-size: 18px;
line-height: 1.5;
color: var(--white);
}
.footer-info .top-info .img {
position: absolute;
right: 13px;
top: -25px;
}
.footer-info .info-box img {
margin-top: 6px;
}
.foot-title {
font-weight: 600;
font-size: 18px;
line-height: 1;
margin-bottom: 30px;
}
.bifoot-title {
font-weight: 600;
font-size: 32px;
line-height: 1;
text-transform: uppercase;
margin-bottom: 28px;
}
.bifoot-title a {
color: inherit;
font-size: inherit;
}
.bottom-footer p {
font-weight: 400;
font-size: 16px;
line-height: 1.625;
color: var(--white);
}
.footer .bottom-info .links-wrap ul li a {
color: #eef9ef;
font-weight: 400;
font-size: 15px;
line-height: 1;
}
.footer .bottom-info .links-wrap ul li {
position: relative;
padding-left: 14px;
margin-bottom: 15px;
}
.footer .bottom-info .links-wrap ul li::before {
content: "";
position: absolute;
left: 0;
top: 8px;
mask-image: url(../img/svg/Vector-arrow.svg);
mask-repeat: no-repeat;
mask-size: contain;
mask-position: center;
height: 6px;
width: 12px;
background-color: #eef9ef;
transform: rotate(-90deg);
opacity: 0.4;
}
.footer .social-links {
margin-top: 32px;
}
.footer .social-links ul {
gap: 32px;
}
.foot-btm-copyright p {
font-weight: 300;
font-size: 14px;
line-height: 1;
color: #eef9ef;
}
.foot-btm-copyright p a {
color: #eef9ef;
font-size: inherit;
}
.foot-btm-copyright p span {
display: inline-block;
width: 2px;
height: 10px;
background-color: var(--white);
opacity: 0.3;
margin: 0 15px;
}
.foot-btm-copyright {
padding: 50px 0;
}
/* hover */
.foot-btm-copyright p a:hover {
color: var(--primary-color);
}
.footer a:hover {
color: var(--primary-color) !important;
}
/*================== fixed =======================*/
.roket-icon {
mask-image: url(../img/svg/roket.svg);
mask-size: cover;
}
.fixed-element {
right: 0px;
z-index: 999;
}
.fixed-element ul {
overflow: hidden;
border-top-left-radius: 12px;
border-bottom-left-radius: 12px;
margin-bottom: 40px;
border: 1px solid #474e481a;
}
.fixed-element ul li a {
padding: 17px 16px;
background-color: var(--white);
border-bottom: 1px solid #474e481a;
}
.fixed-element ul li a:hover {
background-color: var(--primary-color);
}
.fixed-element ul li a:hover img {
filter: brightness(0) invert(1);
}
.fixed-element ul li {
line-height: 0;
}
.fixed-element ul li a img {
height: 22px;
width: 22px;
transition: var(--transition);
}
.back-to-top-btn {
position: relative;
height: 58px;
width: 56px;
background-color: var(--white);
border: 1px solid #474e481a;
font-size: 22px;
line-height: 0;
border-top-left-radius: 12px;
border-bottom-left-radius: 12px;
color: var(--primary-color);
transition: all 0.3s ease-in-out;
overflow: hidden;
}
/* wrapper does centering */
.rocket-wrap {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
/* rocket only animates now */
.rocket {
width: 28px;
height: 28px;
display: block;
animation: rocket-bob 1.6s ease-in-out infinite;
}
.rocket path {
fill: none;
}
.flame {
transform-origin: center bottom;
stroke: var(--primary-color);
animation: flame-flicker 0.25s ease-in-out infinite alternate;
}
.back-to-top-btn:hover {
background-color: var(--primary-color);
}
.back-to-top-btn:hover .rocket .body {
stroke: var(--white);
}
.back-to-top-btn:hover .flame {
stroke: var(--white);
filter: drop-shadow(0 0 2px #ffae42) drop-shadow(0 0 4px var(--white));
}
/* rocket bobbing idle */
@keyframes rocket-bob {
0% {
transform: translateY(6px);
}
40% {
transform: translateY(0px);
}
70% {
transform: translateY(3px);
}
100% {
transform: translateY(6px);
}
}
/* flame flicker */
@keyframes flame-flicker {
0% {
transform: scaleY(0.6);
opacity: 0.3;
}
50% {
transform: scaleY(1.4);
opacity: 1;
}
100% {
transform: scaleY(0.8);
opacity: 0.5;
}
}
.icon-menu {
mask-image: url(../img/svg/menu-toggle.svg);
}
.menu-toggle-btn {
font-size: 22px;
margin-left: 20px;
line-height: 0;
}
.main-nav .social-links,
.main-nav .foot-col {
display: none;
}
/* inner page */
.inner-banner-sec {
position: relative;
z-index: 2;
}
.page-title {
font-size: 28px;
}
.inner-banner-sec::before {
content: "";
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
z-index: 2;
background: linear-gradient(0deg, rgba(123, 174, 127, 0.8) 0%, rgba(123, 174, 127, 0.7) 50%, rgba(123, 174, 127, 0.4) 80%);
}
.inner-banner-sec .inner-banner-con {
position: relative;
z-index: 5;
color: var(--white);
max-width: 600px;
margin: 0 auto;
}
.inner-banner-sec .inner-banner-con p {
color: var(--white);
margin-bottom: 20px;
}
ol.breadcrumb {
margin-bottom: 0;
}
.breadcrumb-item a {
color: var(--white);
}
.breadcrumb-item.active {
color: var(--light-bg);
}
.breadcrumb-item + .breadcrumb-item::before {
color: inherit;
}
.cms-con ul li strong,
.cms-con p strong {
font-weight: 600;
color: var(--text-primary);
}
.cms-con ul li {
position: relative;
padding-left: 24px;
margin-bottom: 10px;
font-size: 16px;
}
.cms-con ul li::before {
position: absolute;
content: "";
height: 16px;
width: 16px;
left: 0;
top: 4px;
mask-image: url(../img/svg/check-mark-circle.svg);
mask-position: center;
mask-size: contain;
mask-repeat: no-repeat;
background-color: var(--primary-color);
}
.cms-con ul li:last-child {
margin-bottom: 0;
}
.cms-con ul:not(:last-child) {
margin-bottom: 20px;
}
.inn-con .cms-con h3 {
font-size: 24px;
}
.cms-con ul li ul li::before {
mask-image: none;
background-color: var(--text-primary);
border-radius: 50%;
height: 6px;
width: 6px;
top: 8px;
}
.cms-con ul li ul li {
padding-left: 14px;
margin-bottom: 6px;
}
.cms-con ul li ul {
margin-top: 10px;
}
p strong {
font-weight: 600;
}
.cms-con ul li a,
.cms-con p a {
color: var(--primary-color);
}
.cms-con ul li a:hover,
.cms-con p a:hover {
color: var(--primary-hover);
text-decoration: underline;
}
.inn-con {
border-bottom: 1px solid #0000000d;
}
.journal-sec .top-row {
margin-bottom: 50px;
padding-bottom: 50px;
border-bottom: 1px solid #0000000d;
}
.journal-sec .top-row .sec-head {
margin-bottom: 20px;
}
.journal-sec .top-row .sec-head .sub-title {
margin-bottom: 10px;
}
.editorial-board-sec .editor-member {
padding: 40px 15px;
border: 1px solid var(--text-secondary);
text-align: center;
background-color: var(--white);
height: 100%;
border-radius: 16px;
}
.editorial-board-sec .row {
--bs-gutter-y: 24px;
}
.editor-member .cms-con p {
margin-bottom: 10px;
}
.journal-sec .top-row .img img {
display: inline-block;
border-radius: 16px;
}
.auther-guide-sec .mid-row {
padding-top: 30px;
border-top: 1px solid rgba(43, 49, 44, 0.3);
margin-bottom: 40px;
}
.auther-guide-sec .mid-row img {
border-radius: 16px;
}
.auther-guide-sec .btm-row .cms-con:first-child ul {
display: grid;
grid-template-columns: repeat(3, 1fr);
column-gap: 24px;
}
.modern-table {
background: var(--white);
border-radius: 16px;
box-shadow: 0 8px 32px rgba(43, 49, 44, 0.08);
overflow: hidden;
border: 2px solid rgba(43, 49, 44, 0.06);
max-width: calc(100% - 10px);
margin: 10px auto;
}
.modern-table thead th {
background: linear-gradient(135deg, var(--text-primary) 0%, var(--text-secondary) 100%);
color: var(--white);
border: none;
font-weight: 600;
font-size: 1rem;
letter-spacing: 0.5px;
text-transform: uppercase;
padding: 1.25rem 1.5rem;
}
.modern-table tbody td {
border: none;
border-bottom: 1px solid rgba(43, 49, 44, 0.08);
border-right: 1px solid rgba(43, 49, 44, 0.05);
padding: 1.25rem 1.5rem;
color: var(--text-primary);
transition: var(--transition);
vertical-align: middle;
}
.modern-table tbody td:last-child {
border-right: none;
}
.modern-table tbody td:first-child {
font-weight: 600;
color: var(--text-secondary);
background: linear-gradient(90deg, var(--little-light) 0%, transparent 100%);
}
.modern-table tbody tr {
transition: var(--transition);
}
.modern-table tbody tr:hover {
background: linear-gradient(90deg, var(--little-light) 0%, var(--white) 50%);
transform: translateY(-1px);
}
.modern-table tbody tr:hover td {
color: var(--text-primary);
}
.modern-table tbody tr:last-child td {
border-bottom: none;
}
.table-container {
margin: 30px 0;
}
.table-responsive {
border-radius: 16px;
background: var(--white);
border: 1px solid rgba(43, 49, 44, 0.04);
}
.auther-guide-sec .row {
position: relative;
}
.review-misconduct-row::before,
.row-manuscript::before,
.appeals-contact-row::before {
content: "";
mask-position: center;
mask-size: contain;
mask-repeat: no-repeat;
background-color: var(--primary-color);
position: absolute;
opacity: 0.3;
}
.row-manuscript::before {
bottom: 0;
right: 0;
height: 30%;
width: 25%;
mask-image: url(../img/svg/script.svg);
}
.review-misconduct-row::before {
top: 50%;
transform: translate(-50%);
left: 45%;
height: 50%;
width: 50%;
mask-image: url(../img/svg/review-message.svg);
}
.appeals-contact-row::before {
mask-image: url(../img/svg/contact-plus.svg);
height: 50%;
width: 15%;
right: 0;
top: 50%;
}
/* Step 1: Basic table and container setup */
/* Step 2: Editor in Chief styling */
.editorial-board-table-sec .table-container {
width: 100%;
margin: 0;
}
.editorial-board-table-sec .table-responsive {
width: 100%;
border: none;
border-radius: 0;
}
.editorial-board-table-sec .table {
width: 100%;
border-collapse: collapse;
margin: 0;
}
.editorial-board-table-sec .table td {
padding: 0;
vertical-align: top;
border: none;
}
/* Basic editor card styling */
.editorial-board-table-sec .editor-card {
display: inline-block;
padding: 15px 25px;
border-radius: 8px;
font-weight: 500;
text-align: center;
}
/* Editor in Chief specific styling */
.editorial-board-table-sec .editor-in-chief {
background-color: var(--text-primary);
color: var(--white);
font-size: 18px;
padding: 20px 30px;
margin: 0 auto 20px;
}
.editorial-board-table-sec .editor-in-chief strong {
font-weight: 500;
}
/* Associate Editors title styling */
.editorial-board-table-sec .associate-title {
background-color: var(--primary-color);
color: var(--white);
font-size: 16px;
font-weight: 600;
padding: 15px 25px;
}
/* Editors grid layout */
/* */
/* Journal Section */
.gosi-journal-sec .sec-title {
border-bottom: 3px solid var(--primary-color);
padding-bottom: 15px;
margin-bottom: 35px;
}
/* Quick Links */
.gosi-quick-links {
display: flex;
gap: 12px;
flex-wrap: wrap;
margin-bottom: 45px;
padding: 25px;
background: var(--little-light);
border-radius: 10px;
border-left: 4px solid var(--primary-color);
}
.gosi-quick-link {
padding: 10px 18px;
background: var(--white);
border: 2px solid var(--primary-color);
color: var(--primary-color);
text-decoration: none;
border-radius: 6px;
font-size: 0.9em;
font-weight: 600;
transition: var(--transition);
display: inline-block;
}
.gosi-quick-link:hover {
background: var(--primary-color);
color: var(--white);
transform: translateY(-3px);
box-shadow: 0 4px 8px rgba(123, 174, 127, 0.3);
}
/* Section Styles */
.gosi-section {
margin-bottom: 50px;
}
.gosi-section-title {
color: var(--primary-hover);
margin-bottom: 25px;
padding: 15px 20px;
background: var(--little-light);
border-left: 5px solid var(--primary-color);
border-radius: 8px;
display: flex;
align-items: center;
gap: 12px;
}
.gosi-section-icon {
font-size: 1.3em;
width: 40px;
height: 40px;
border: 2px solid var(--primary-color);
border-radius: 50%;
display: inline-flex;
align-items: center;
justify-content: center;
color: var(--white);
}
/* Article Card */
.gosi-article {
margin-bottom: 25px;
padding: 30px;
background: var(--little-light);
border-radius: 10px;
border-left: 4px solid transparent;
transition: var(--transition);
position: relative;
}
.gosi-article::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 0;
height: 100%;
background: linear-gradient(90deg, rgba(123, 174, 127, 0.05), transparent);
transition: var(--transition);
border-radius: 10px;
}
.gosi-article:hover {
background: var(--white);
border-left-color: var(--primary-color);
box-shadow: 0 6px 20px rgba(123, 174, 127, 0.15);
transform: translateX(8px);
}
.gosi-article:hover::before {
width: 100%;
}
.gosi-article-title {
font-size: 1.2em;
font-weight: 600;
color: var(--text-primary);
margin-bottom: 12px;
line-height: 1.6;
position: relative;
z-index: 1;
}
.gosi-article-authors {
color: var(--text-secondary);
font-size: 1em;
margin-bottom: 15px;
font-style: italic;
position: relative;
z-index: 1;
}
.gosi-article-meta {
display: flex;
flex-wrap: wrap;
gap: 15px;
align-items: center;
margin-top: 18px;
position: relative;
z-index: 1;
}
.gosi-article-links {
display: flex;
gap: 10px;
flex-wrap: wrap;
}
.gosi-article-link {
padding: 8px 16px;
background: var(--white);
border: 1.5px solid var(--primary-color);
color: var(--primary-hover);
text-decoration: none;
border-radius: 6px;
font-size: 0.9em;
font-weight: 600;
transition: var(--transition);
display: inline-block;
}
.gosi-article-link:hover {
background: var(--primary-color);
color: var(--white);
transform: scale(1.05);
}
.gosi-page-numbers {
color: var(--text-secondary);
font-size: 0.95em;
font-weight: 600;
padding: 8px 16px;
background: var(--white);
border-radius: 6px;
border: 1px solid #e0e0e0;
}
.gosi-doi {
color: var(--text-secondary);
font-size: 0.88em;
margin-top: 12px;
word-break: break-all;
position: relative;
z-index: 1;
}
.gosi-doi a {
color: var(--primary-hover);
text-decoration: none;
transition: var(--transition);
}
.gosi-doi a:hover {
color: var(--primary-color);
text-decoration: underline;
}
/* Footer Section */
.gosi-footer-section {
margin-top: 60px;
padding: 35px;
background: linear-gradient(135deg, var(--little-light) 0%, var(--white) 100%);
border-radius: 10px;
border-top: 4px solid var(--primary-color);
box-shadow: 0 4px 15px rgba(123, 174, 127, 0.1);
}
.gosi-footer-title {
color: var(--text-primary);
font-weight: 600;
margin-bottom: 20px;
display: flex;
align-items: center;
gap: 10px;
}
.gosi-footer-title::before {
content: "";
background: url(../img/Pngtree.png);
background-position: center;
background-repeat: no-repeat;
background-size: contain;
height: 40px;
width: 40px;
}
.gosi-volume-info {
display: inline-block;
padding: 12px 28px;
background: rgba(255, 255, 255, 0.2);
backdrop-filter: blur(10px);
border-radius: 30px;
font-size: 1.1em;
font-weight: 500;
margin-bottom: 25px;
border: 1px solid rgba(255, 255, 255, 0.3);
}
/* */
/* Container */
.archives-sec {
background: linear-gradient(135deg, var(--little-light) 0%, var(--light-bg) 100%);
}
/* Archive Content */
.archive-content {
background: var(--white);
border-radius: var(--border-radius);
box-shadow: var(--shadow-medium);
padding: 2rem;
}
/* Tabs */
.archive-tabs {
margin-bottom: 2rem;
border-bottom: 3px solid var(--little-light);
padding-bottom: 0;
flex-wrap: nowrap;
white-space: nowrap;
overflow-x: auto;
scrollbar-width: none;
}
.archive-tabs::-webkit-scrollbar {
display: none;
}
.archive-tabs .nav-link {
background: transparent;
border: none;
color: var(--text-secondary);
font-weight: 600;
padding: 1rem 1.5rem;
margin: 0 0.25rem;
border-radius: var(--border-radius) var(--border-radius) 0 0;
transition: var(--transition);
position: relative;
overflow: hidden;
}
.archive-tabs .nav-link::before {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 3px;
background: var(--primary-color);
transform: scaleX(0);
transform-origin: right;
transition: transform 0.3s ease;
}
.archive-tabs .nav-link:hover {
background: var(--little-light);
color: var(--primary-color);
transform: translateY(-2px);
}
.archive-tabs .nav-link:hover::before {
transform: scaleX(1);
transform-origin: left;
}
.archive-tabs .nav-link.active {
background: var(--primary-color);
color: var(--white);
box-shadow: var(--shadow-light);
}
.archive-tabs .nav-link.active::before {
transform: scaleX(1);
background: var(--white);
}
/* Tab Content */
.tab-content-wrapper {
min-height: 400px;
}
.section-title {
color: var(--text-primary);
font-weight: 700;
margin-bottom: 0.5rem;
display: flex;
align-items: center;
}
.section-title::after {
content: "";
flex: 1;
height: 2px;
background: linear-gradient(to right, var(--primary-color), transparent);
margin-left: 1rem;
}
.section-description {
color: var(--text-secondary);
margin-bottom: 2rem;
font-size: 1.1rem;
}
/* Accordion */
.accordion-item {
background: var(--white);
border: 2px solid var(--little-light);
margin-bottom: 1rem;
border-radius: var(--border-radius);
box-shadow: var(--shadow-light);
transition: var(--transition);
overflow: hidden;
}
.accordion-item:hover {
box-shadow: var(--shadow-medium);
transform: translateY(-2px);
}
.accordion-button {
background: var(--little-light);
color: var(--text-primary);
font-weight: 600;
border: none;
padding: 1.5rem;
transition: var(--transition);
}
.accordion-button:not(.collapsed) {
background: var(--primary-color);
color: var(--white);
}
.accordion-button:focus {
box-shadow: 0 0 0 0.25rem rgba(123, 174, 127, 0.25);
border-color: var(--primary-color);
}
.accordion-button::after {
background-image: url("data:image/svg+xml,");
transition: var(--transition);
}
.accordion-button:not(.collapsed)::after {
background-image: url("data:image/svg+xml,");
}
/* Accordion Body */
.accordion-body {
padding: 2rem 1.5rem;
background: var(--white);
}
/* Issue Grid */
.issue-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 1.5rem;
padding: 30px 0;
}
/* Issue Cards */
.issue-card {
background: var(--white);
border: 2px solid var(--little-light);
border-radius: var(--border-radius);
padding: 1.5rem;
transition: var(--transition);
position: relative;
overflow: hidden;
}
.issue-card::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 4px;
background: linear-gradient(135deg, var(--primary-color), var(--primary-hover));
transform: scaleX(0);
transform-origin: left;
transition: var(--transition);
}
.issue-card:hover {
box-shadow: var(--shadow-medium);
transform: translateY(-4px);
border-color: var(--primary-color);
}
.issue-card:hover::before {
transform: scaleX(1);
}
.issue-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 1rem;
}
.issue-number {
color: var(--primary-color);
font-size: 0.9rem;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.issue-header i {
font-size: 1.5rem;
color: var(--primary-color);
cursor: pointer;
}
.icon-file {
mask-image: url(../img/svg/file.svg);
}
.issue-details .issue-month {
color: var(--text-primary);
font-weight: 600;
margin-bottom: 0.5rem;
font-size: 1rem;
}
.issue-details p {
color: var(--text-secondary);
font-size: 0.9rem;
margin-bottom: 1rem;
}
.issue-details .btn {
padding: 10px 18px;
}
.issue-details .btn span {
display: none;
}
.issue-details .btn .icon {
height: 1em;
width: 1em;
}
.issue-details .btn:hover .icon {
transform: none;
}
.eye-icon {
mask-image: url(../img/svg/eye.svg);
}
.btn-outline-primary {
border-color: var(--primary-color);
color: var(--primary-color);
transition: var(--transition);
}
.btn-outline-primary:hover {
background-color: var(--primary-color);
border-color: var(--primary-color);
color: var(--white);
transform: translateY(-1px);
box-shadow: var(--shadow-light);
}
/* Empty State */
.archive-content .cms-con {
text-align: center;
padding: 4rem 2rem;
color: var(--text-secondary);
}
.archive-content .cms-con i {
font-size: 4rem;
color: var(--primary-color);
margin-bottom: 1rem;
opacity: 0.7;
}
.archive-content .cms-con h4 {
color: var(--text-primary);
margin-bottom: 1rem;
}
.accordion-body .md-title {
padding: 10px 0;
border-bottom: 2px solid var(--primary-color);
}
/* Contact Us Section Styles */
.contact-us-sec .container {
position: relative;
padding: 3rem 30px;
}
.contact-us-sec .form {
width: 100%;
max-width: 1199px;
background-color: #fff;
border-radius: 20px;
box-shadow: 0 0 20px 1px rgba(0, 0, 0, 0.1);
z-index: 1000;
overflow: hidden;
display: grid;
grid-template-columns: repeat(2, 1fr);
margin: 0 auto;
}
.contact-us-sec .contact-form {
background-color: var(--primary-color);
position: relative;
}
.contact-us-sec .circle {
border-radius: 50%;
background: linear-gradient(135deg, transparent 20%, #6a9d6e);
position: absolute;
}
.contact-us-sec .circle.one {
width: 130px;
height: 130px;
top: 130px;
right: -40px;
}
.contact-us-sec .circle.two {
width: 80px;
height: 80px;
top: 10px;
right: 30px;
}
.contact-us-sec .contact-form:before {
content: "";
position: absolute;
width: 26px;
height: 26px;
background-color: var(--primary-color);
transform: rotate(45deg);
top: 50px;
left: -13px;
}
.contact-us-sec .contact-form {
padding: 2.3rem 2.2rem;
z-index: 10;
overflow: hidden;
position: relative;
}
.contact-us-sec .title {
color: #fff;
font-weight: 500;
font-size: 1.5rem;
line-height: 1;
margin-bottom: 0.7rem;
}
.contact-us-sec .form-control {
position: relative;
margin: 1rem 0;
background-color: transparent;
border: none;
padding: 0;
}
.contact-us-sec .input {
width: 100%;
height:100%;
outline: none;
border: 2px solid #fafafa;
background: none;
padding: 0.6rem 1.2rem;
color: #fff;
font-weight: 500;
font-size: 0.95rem;
letter-spacing: 0.5px;
border-radius: 12px;
transition: 0.3s;
}
.contact-us-sec .input::placeholder {
color: var(--white);
}
.contact-us-sec textarea.input {
min-height: 150px;
resize: none;
overflow-y: auto;
}
.contact-us-sec .form-control label {
position: absolute;
top: 50%;
left: 15px;
transform: translateY(-50%);
padding: 0 0.4rem;
color: #fafafa;
font-size: 0.9rem;
font-weight: 400;
pointer-events: none;
z-index: 1000;
transition: 0.5s;
}
.contact-us-sec .form-control.textarea label {
top: 1rem;
transform: translateY(0);
}
.contact-us-sec .btn {
padding: 0.6rem 1.3rem;
background-color: #fff;
border: 2px solid #fafafa;
font-size: 0.95rem;
color: var(--primary-color);
line-height: 1;
border-radius: 25px;
outline: none;
cursor: pointer;
transition: 0.3s;
margin: 0;
}
.contact-us-sec .btn:hover {
background-color: transparent;
color: #fff;
}
/* .contact-us-sec .form-control span {
position: absolute;
top: 0;
left: 25px;
transform: translateY(-50%);
font-size: 0.8rem;
padding: 0 0.4rem;
color: transparent;
pointer-events: none;
z-index: 500;
} */
.contact-us-sec .form-control span:before,
.contact-us-sec .form-control span:after {
content: "";
position: absolute;
width: 10%;
opacity: 0;
transition: 0.3s;
height: 5px;
background-color: var(--primary-color);
top: 50%;
transform: translateY(-50%);
}
.contact-us-sec .form-control span:before {
left: 50%;
}
.contact-us-sec .form-control span:after {
right: 50%;
}
.contact-us-sec .form-control.focus label {
top: 0;
transform: translateY(-50%);
left: 25px;
font-size: 0.8rem;
}
.contact-us-sec .form-control.focus span:before,
.contact-us-sec .form-control.focus span:after {
width: 50%;
opacity: 1;
}
.contact-us-sec .contact-info {
padding: 2.3rem 2.2rem;
position: relative;
background-color: var(--white);
}
.contact-us-sec .contact-info .title {
color: var(--primary-color);
}
.contact-us-sec .information {
color: var(--text-secondary);
margin: 0.7rem 0;
font-size: 0.95rem;
}
.contact-us-sec .information:last-child img {
object-fit: contain;
height: 30px;
width: 30px;
}
.contact-us-sec .information:last-child {
margin-top: 30px;
}
.contact-us-sec .information a,
.contact-us-sec .information .add {
display: grid;
grid-template-columns: 30px 1fr;
align-items: flex-start;
color: var(--text-secondary);
gap: 0px;
}
.contact-us-sec .information .add {
gap: 10px;
}
.contact-us-sec .information a:hover {
color: var(--primary-color);
}
.contact-us-sec .social-icons a {
width: 28px;
}
.contact-us-sec .social-media {
padding: 2rem 0 0 0;
}
.contact-us-sec .social-media p {
color: var(--text-primary);
font-weight: 500;
margin-bottom: 0.5rem;
}
.contact-us-sec .social-icons {
display: flex;
margin-top: 0.5rem;
}
.contact-us-sec .social-icons li {
display: inline-block;
margin-right: 5px;
}
.contact-us-sec .social-icons a {
width: 35px;
height: 35px;
border-radius: 5px;
background: linear-gradient(45deg, var(--primary-color), #6a9d6e);
color: #fff;
display: flex;
align-items: center;
justify-content: center;
transition: var(--transition);
}
.contact-us-sec .social-icons a:hover {
transform: scale(1.05);
}
.contact-us-sec .social-icons i {
font-size: 16px;
}
.contact-us-sec .contact-info:before {
content: "";
position: absolute;
width: 110px;
height: 100px;
border: 22px solid var(--primary-color);
border-radius: 50%;
bottom: -60px;
right: 50px;
opacity: 0.3;
}
.contact-us-sec .big-circle {
position: absolute;
width: 250px;
height: 250px;
border-radius: 50%;
background: linear-gradient(to bottom, var(--primary-color), #6a9d6e);
top: -25%;
left: 5%;
transform: translate(-40%, 38%);
}
.contact-us-sec .big-circle:after {
content: "";
position: absolute;
width: 80%;
height: 80%;
background-color: #fafafa;
border-radius: 50%;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.contact-us-sec .square {
position: absolute;
height: 400px;
top: 50%;
left: 60%;
transform: translate(181%, 11%);
opacity: 0.2;
}
/* changes */
.hero-sec .reviewers,
.hospitals.container {
display: none !important;
}
/* */
.editorial-board-table-sec .leadership-section {
margin-bottom: 60px;
}
.editorial-board-table-sec .leadership-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 30px;
}
.editorial-board-table-sec .leader-card {
background: var(--white);
padding: 30px;
border-radius: var(--border-radius);
box-shadow: var(--shadow-light);
transition: var(--transition);
border-top: 4px solid var(--primary-color);
}
.editorial-board-table-sec .leader-card:hover {
transform: translateY(-5px);
box-shadow: var(--shadow-medium);
}
.editorial-board-table-sec .leader-role {
font-size: 0.85rem;
font-weight: 600;
color: var(--primary-color);
text-transform: uppercase;
letter-spacing: 1px;
margin-bottom: 8px;
}
.editorial-board-table-sec .leader-name {
font-size: 1.4rem;
font-weight: 600;
color: var(--text-primary);
margin-bottom: 5px;
}
.editorial-board-table-sec .leader-location {
font-size: 0.9rem;
color: var(--text-secondary);
}
.editorial-board-table-sec .editors-section {
background: var(--white);
padding: 40px;
border-radius: var(--border-radius);
box-shadow: var(--shadow-light);
margin-bottom: 40px;
}
.editorial-board-table-sec .editors-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 20px;
}
.editorial-board-table-sec .editor-item {
padding: 20px;
background: var(--little-light);
border-radius: 8px;
transition: var(--transition);
}
.editorial-board-table-sec .editor-item:hover {
background: var(--primary-color);
color: var(--white);
transform: translateY(-3px);
}
.editorial-board-table-sec .editor-item:hover .editor-role,
.editorial-board-table-sec .editor-item:hover .editor-name,
.editorial-board-table-sec .editor-item:hover .editor-affiliation {
color: var(--white);
}
.editorial-board-table-sec .editor-role {
font-size: 0.75rem;
font-weight: 600;
color: var(--primary-color);
text-transform: uppercase;
letter-spacing: 0.5px;
margin-bottom: 5px;
}
.editorial-board-table-sec .editor-name {
font-size: 1.1rem;
font-weight: 600;
color: var(--text-primary);
margin-bottom: 3px;
}
.editorial-board-table-sec .editor-affiliation {
font-size: 0.85rem;
color: var(--text-secondary);
}
.editorial-board-table-sec .members-section {
background: var(--white);
padding: 40px;
border-radius: var(--border-radius);
box-shadow: var(--shadow-light);
}
.editorial-board-table-sec .members-list {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
gap: 15px;
}
.editorial-board-table-sec .member-item {
display: flex;
align-items: center;
padding: 15px 20px;
background: var(--little-light);
border-radius: 8px;
transition: var(--transition);
}
.editorial-board-table-sec .member-item:hover {
background: var(--primary-color);
border-left-color: var(--primary-hover);
transform: translateY(-3px);
}
.editorial-board-table-sec .member-item:hover .member-name,
.editorial-board-table-sec .member-item:hover .member-location {
color: var(--white);
}
.editorial-board-table-sec .member-number {
font-size: 1.2rem;
font-weight: 700;
color: var(--primary-color);
margin-right: 10px;
}
.editorial-board-table-sec .member-item:hover .member-number {
color: var(--white);
}
.editorial-board-table-sec .member-info {
flex: 1;
}
.editorial-board-table-sec .member-name {
font-size: 1rem;
font-weight: 600;
color: var(--text-primary);
margin-bottom: 2px;
}
.editorial-board-table-sec .member-location {
font-size: 0.85rem;
color: var(--text-secondary);
}
.row.bor .col-md-6:last-child::before {
content: "";
position: absolute;
left: 0px;
top: 0;
width: 1px;
height: 100%;
background: linear-gradient(to bottom, transparent, var(--text-primary) 50%, transparent);
}
/* Make sure parent has relative positioning */
.row.bor .col-md-6 {
position: relative;
}
.row.bor ol li {
list-style: auto;
}
.inner-banner-sec .inner-banner-con {
max-width: 720px;
}
/* style by */
.journal-sec .sec-title a{
color: var(--primary-color);
font-size: 70%;
vertical-align: middle;
}
.cms-con span b{
font-weight: 600;
}
.cms-con table {
width: 100%;
border-collapse: collapse;
margin: 16px 0;
}
.cms-con th, .cms-con td {
border: 1px solid #000;
padding: 8px 10px;
text-align: left;
}
.cms-con thead th {
background-color: #333;
color: #fff;
font-weight: 300;
}
.cms-con article:has(table){
width: 100%;
overflow-x: auto;
}
.max-w td,
.max-w th{
min-width:300px;
}
.max-w tr td:first-of-type,
.max-w tr th:first-of-type{
width: 1%; /* forces shrink */
white-space: nowrap; /* keeps content in one line */
min-width: 0 !important; /* removes any min-width restriction */
}
/* */
/* Modal styling */
#submitArticleModal .modal-content {
border: none;
border-radius: var(--border-radius);
box-shadow: var(--shadow-medium);
overflow: hidden;
}
#submitArticleModal .modal-header {
background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-hover) 100%);
color: var(--white);
padding: 1.5rem 1.75rem;
border-bottom: none;
}
#submitArticleModal .modal-header .mail-send-to {
color: var(--white);
margin-right: 10px;
font-size: 25px;
}
#submitArticleModal .modal-title {
font-size: 1.5rem;
font-weight: 600;
color: var(--white);
}
#submitArticleModal .btn-close {
filter: brightness(0) invert(1);
opacity: 0.8;
transition: var(--transition);
}
#submitArticleModal .btn-close:hover {
opacity: 1;
transform: rotate(90deg);
}
#submitArticleModal .modal-body {
padding: 2rem 1.75rem;
background: var(--white);
color: var(--text-primary);
}
#submitArticleModal .modal-body p {
line-height: 1.7;
color: var(--text-secondary);
}
#submitArticleModal .modal-body strong {
color: var(--text-primary);
font-weight: 600;
}
#submitArticleModal #emailLink {
color: var(--primary-color);
text-decoration: none;
font-weight: 600;
display: inline-block;
margin-top: 0.5rem;
padding: 0.4rem 0.8rem;
background: var(--little-light);
border-radius: 6px;
transition: var(--transition);
}
#submitArticleModal #emailLink:hover {
background: var(--primary-color);
color: var(--white);
transform: translateX(4px);
}
#submitArticleModal .text-muted {
background: var(--light-bg);
padding: 1rem;
border-radius: 8px;
border-left: 3px solid var(--primary-color);
margin-top: 1.5rem;
}
#submitArticleModal .modal-footer {
background: var(--little-light);
padding: 1.25rem 1.75rem;
border-top: 1px solid rgba(123, 174, 127, 0.1);
}
#submitArticleModal .btn-secondary {
background: var(--white);
color: var(--text-secondary);
border: 1px solid #ddd;
padding: 0.6rem 1.5rem;
border-radius: 8px;
font-weight: 500;
transition: var(--transition);
}
#submitArticleModal .btn-secondary:hover {
background: var(--light-bg);
color: var(--text-primary);
border-color: var(--primary-color);
transform: translateY(-2px);
box-shadow: var(--shadow-light);
}
#submitArticleModal .btn-primary {
background: var(--primary-color);
color: var(--white);
border: none;
padding: 0.6rem 1.5rem;
border-radius: 8px;
font-weight: 600;
transition: var(--transition);
text-decoration: none;
box-shadow: 0 2px 8px rgba(123, 174, 127, 0.3);
}
#submitArticleModal .btn-primary:hover {
background: var(--primary-hover);
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(123, 174, 127, 0.4);
}
/* Animation */
@keyframes modalFadeIn {
from {
opacity: 0;
transform: scale(0.95);
}
to {
opacity: 1;
transform: scale(1);
}
}
#submitArticleModal.show .modal-content {
animation: modalFadeIn 0.3s ease-out;
}
/* Demo button */
.demo-btn {
background: var(--primary-color);
color: var(--white);
border: none;
padding: 1rem 2rem;
border-radius: 8px;
font-weight: 600;
transition: var(--transition);
box-shadow: var(--shadow-light);
}
.demo-btn:hover {
background: var(--primary-hover);
transform: translateY(-2px);
box-shadow: var(--shadow-medium);
}
.mail-send-to {
mask-image: url(../img/svg/mail-send-to.svg);
}
@media (max-width: 767px) {
#submitArticleModal .modal-header {
padding: 10px 20px;
}
#submitArticleModal .modal-body,
#submitArticleModal .modal-footer {
padding: 20px 20px;
}
#submitArticleModal .modal-title {
font-size: 20px;
}
}
.feature-article-sec img{
/* aspect-ratio: 1/1;
width: 400px;
object-fit: contain;
margin: 20px 0;
} */
}
.feature-article-sec img.aligncenter{
margin: 20px auto;
}
.sub-reserch-title{
font-size:32px ;
margin-bottom:20px;
}
.sub-reserch-title a{
font-size: inherit;
color: var(--primary-color);
}
.foot-card .wpcf7-spinner{
position:absolute;
right:0;
bottom:-30px;
}
.foot-card .btns-group p{
position:relative;
}