/*
Theme Name: Oceanacidification Custom Theme
Theme URI: https://www.oceanacidification.org.uk/
Author: Oceanacidification Team
Description: A custom WordPress theme for the UK Ocean Acidification Research Programme website, designed to support clear communication of ocean acidification science, research findings, and educational resources. The theme emphasizes intuitive navigation, responsive design, and accessible presentation of research outputs, publications, news updates and resources for scientists, policymakers and the public. Tailored for rich scientific content, data dissemination, and outreach on the impacts of rising CO₂ on ocean chemistry.
Version: 1.1
*/





*{
    box-sizing: border-box;
}
body{
    margin: 0px;
}
/* div#oceanacidification-header {
    background: #000;
} */

body .custom-logo {
    width: 300px !important;
    height: auto !important;
    
}

.oceanacidification-content-area {
    font-size: 16px;
    line-height: 24px;
}
.oceanacidification-container p{
    font-size:16px!important;
}
.oceanacidification-container {
    max-width: 1500px!important;
    width: 100%;
    margin: auto;
    padding: 20px 20px 20px 20px!important;
}
.oceanacidification-page-content p a{
	color:#2927a5;
}
.oceanacidification-page-content li a {
    color:#2927a5;
}
.campaign-list-item_more-btns{
    display:none;
}
.oceanacidification-content-area h1 {
    font-size: 36px;
    font-weight: bold;
    text-align: center;
    line-height: 45px;
}

.oceanacidification-content-area h2 {
    font-size: 30px;
    font-weight: bold;
    line-height: 40px;
}

.oceanacidification-content-area h3 {
    font-size: 27px;
    font-weight: bold;
    line-height: 35px;
}

.oceanacidification-content-area h4 {
    font-size: 24px;
    font-weight: bold;
    line-height: 30px;
}

.oceanacidification-content-area h5 {
    font-size: 20px;
    font-weight: bold;
    line-height: 28px;
}

.oceanacidification-content-area h6 {
    font-size: 18px;
    font-weight: bold;
    line-height: 25px;
}

.oceanacidification-content-area ol li {
    list-style: decimal;
}

.oceanacidification-content-area ul li {
    list-style: disc;
}

.oceanacidification-content-area ol,
.oceanacidification-content-area ul {
    padding-left: 30px;
}

h1, h2, h3, h4, h5, h6, p {
    margin: 10px 0 !important;
}
ol, ul {
    box-sizing: border-box;
    padding: 0;
}
.oceanacidification-content-area table {
    border-collapse: collapse;
    width: 100%;
    margin: 25px 0;
}

.oceanacidification-content-area td,
.oceanacidification-content-area th {
    border: 1px solid #ccc;
    padding: 8px;
    font-size: 16px;
}

.oceanacidification-content-area dl {
    margin: 20px;
    padding: 0;
    font-family: Arial, sans-serif;
    border: 1px solid #ddd;
    border-radius: 5px;
    background-color: #f9f9f9;
}

.oceanacidification-content-area dt {
    font-weight: bold;
    margin: 10px 0 5px;
    padding: 10px;
    background-color: #eee;
    border-bottom: 1px solid #ddd;
}

.oceanacidification-content-area dd {
    margin: 0 0 10px 20px;
    padding: 10px;
    border-left: 2px solid #ddd;
    background-color: #fff;
}

.oceanacidification-content-area li {
    line-height: 30px;
}

.oceanacidification-header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
}

/* FontAwesome arrow for top-level menu items */
.menu-item-has-children > a::after {
    content: "\f078";
    font-family: "FontAwesome";
    margin-left: 5px;
    color: #48569c;
    position: absolute;
    top: 0px;
    right: 0;
    font-size: 10px;
}

.oceanacidification-nav-menu li.menu-item-has-children:hover > a::after {
    transform: rotate(-180deg);
}

/* Hide arrow for nested submenu items */
.sub-menu .menu-item-has-children > a::after {
    display: block;
   right: 33px;
    top: 5px;
}

.oceanacidification-navigation {
    position: relative;
    display: inline-block;
    width: 100%;
}

.oceanacidification-navigation a {
    display: block;
    font-size: 17px;
    line-height: 40px !important;
    color: #48569c;
    text-decoration: none;
}


.sub-menu li a {
    line-height: 24px;
    margin: 5px 0;
    color: #48569c;
}

.oceanacidification-navigation li {
    position: relative;
    display: inline-block;
    padding: 0 20px;
}

.oceanacidification-nav-select {
    display: inline-block;
    width: 100%;
    text-align: right;
}

.oceanacidification-navigation a:hover,
.oceanacidification-navigation a:focus {
    color: #48569c;
}

.oceanacidification-navbar-toggle-wrapper {
    display: none;
}

.sub-menu {
    display: none;
    position: absolute;
    left: 0;
    
    width: 180px;
    text-align: left;
    padding: 10px 0;
    box-shadow: 0 0 6px #ddd;
    top: 34px;
    z-index: 999;
}

.menu-item:hover .sub-menu {
    display: block;
}

.sub-menu li {
    width: 100%;
}

.sub-menu .sub-menu {
    left: auto !important;
    right: 100%;
    top: -10px !important;
}

.oceanacidification-nav-select .sub-menu > li > .sub-menu {
    display: none;
    position: absolute;
}

.oceanacidification-nav-select .oceanacidification-menu__list > li:hover > .sub-menu,
.oceanacidification-nav-select .sub-menu > li:hover > .sub-menu {
    display: block;
}

.oceanacidification-footer {
    text-align: center;
}
.aligncenter {
    clear: both;
    display: block;
    margin: auto;
}

.campaign-list-item_key-features ul li {
    list-style: none;

}

.campaign-list-item_key-features ul {
    padding-left: 0;
}

a.su-button {
    background: #000 !important;
}

.site-header {
    position: unset;
    transform: unset;
    background-color: aliceblue;
    height: 95px;
    max-width: unset;
}
.main-navigation .menu-toggle {
    top: 3rem;
    background: unset;
}
.site-header .logo {
    top: 3rem;
    width: unset;
}
.site-footer .site-info p {
    font-size: 16px;
    text-align: center;
    margin-bottom: 0 !important;
}
div#site-info {
    width: 100%;
}
.site-footer ul {
    justify-content: center;
}

#menu-footer-menu{
        display: flex;
    justify-content: center;
    list-style: none;
}
#menu-footer-menu li a{
    color:#48569c;
    text-decoration: none;
}
#menu-footer-menu li {
  padding:0px 10px;
}


@media only screen and (max-width: 590px) {
    #menu-footer-menu{
        flex-direction:column;
        align-items: center;
    }
    #menu-footer-menu li {
  padding:10px;
}

	  .oceanacidification-content-area table {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }
    .menu-item-has-children > a::after {
    content: "none";
    
}
body .custom-logo{
    width: 227px !important;
}
}
@media only screen and (max-width: 991px) {

    .menu-item-has-children > a::after,
    .sub-menu .menu-item-has-children > a::after {
        display: none;
    }

    .oceanacidification-table-auto {
        overflow-x: scroll;
        width: 100%;
    }

.site-header .logo {
    top: 4rem;
}
.main-navigation .menu-toggle {
    top: 4.4rem;
}

    .oceanacidification-navigation {
        position: absolute;
        right: 0;
        top: 85px;
        width: 100%;
        cursor: pointer;
        text-align: left;
        background: #fff;
        box-shadow: 0 0 4px #ddd;
        display: none;
        padding: 14px;
        z-index: 999;
    }

    .oceanacidification-navbar-toggle-wrapper {
        display: flex !important;
        background-color: #fff;
        width: 40px;
        height: 40px;
        position: absolute;
        top: 10px;
        right: 15px;
        align-items: center;
        justify-content: center;
        border-radius: 3px;
        cursor: pointer;
        color: transparent;
    }

    .oceanacidification-navbar-toggle-wrapper span {
        width: 20px;
        height: 2px;
        background-color: #48569c;
        display: inline-block;
        position: relative;
        top: 0px;
        right: 0;
    }

    .oceanacidification-navbar-toggle-wrapper span::before,
    .oceanacidification-navbar-toggle-wrapper span::after {
        content: "";
        position: absolute;
        background-color: #48569c;
        width: 100%;
        height: 2px;
        left: 0;
    }

    .oceanacidification-navbar-toggle-wrapper span::before {
        top: -7px;
    }

    .oceanacidification-navbar-toggle-wrapper span::after {
        top: 7px;
    }


.oceanacidification-navigation li {
        position: relative;
        display: inline-block;
        Padding: 0 20px;
        margin: 0;
        width: 100%;
        box-sizing: border-box;

    }


    .sub-menu {
        display: block;
        position: relative !important;
        left: 0 !important;
        background: transparent;
        width: 100%;
        padding: 0 !important;
        box-shadow: none;
        top: auto;
    }

    .sub-menu .sub-menu {
        left: 0;
        right: 0;
        top: 0;
    }

    .oceanacidification-toggle-menu {
        position: absolute;
        right: -7px;
        width: 40px;
        height: 30px;
        font-size: 15px;
        top: 7px;
        cursor: pointer;
        z-index: 999;
        display: block;
       color: #48569c;
        transform: rotate(0deg);
        text-align: center;
    }

    .oceanacidification-toggle-menu i {
        transition: transform 0.3s ease;
    }

    .oceanacidification-toggle-menu.on i {
        transform: rotate(180deg);
    }

    .oceanacidification-nav-select {
        display: inline-block;
        width: 100%;
        text-align: left;
        margin: 0;
    }
    .oceanacidification-nav-select .sub-menu > li > .sub-menu {
    display: block;
    position: relative;
}

.oceanacidification-nav-select .oceanacidification-menu__list > li:hover > .sub-menu,
.oceanacidification-nav-select .sub-menu > li:hover > .sub-menu {
    display: block;
}

}

/*AUTHOR SECTION START*/
.main-title{
    text-align:left;
}
.custom_top_author {
    display: flex;
    align-items: center;
    gap: 16px;
   background: #000;
    border-radius: 10px;
    padding: 10px;
    
}
.author_imag img {
    width: 60px;
    min-width:60px;
    height: 60px;
    border-radius: 100%;
    object-fit: cover;
}
.name_author_out {
    display: flex;
}
.name_author_out span.lbl {
    margin-right: 5px;
}
.name_author_out h4 {
    margin: 0;
    color: #000;
    line-height: 24px;
    font-size: 18px;
    font-weight: normal;
}
.name_author_out p{
margin:0 !important;
}
 
 
/*AUTHOR SECTION And Page START*/
 
.main-title {
    text-align: left;
}
 
.custom_top_author {
    display: flex;
    align-items: center;
    gap: 16px;
}
 
.author_imag img {
    width: 60px;
    min-width: 60px;
    height: 60px;
    border-radius: 100%;
    object-fit: cover;
}
 
.name_author_out {
    display: flex;
    align-items: center;
}
 
.name_author_out span.lbl {
    margin-right: 5px;
}
 
.name_author_out h4,
.name_author_out p {
    margin: 0;
    padding: 0;
    font-weight: normal;
}
 
.name_author_out a p {
    font-weight: 600;
    font-size: 16px;
}
 
.name_author_out a:hover p {
    color: #ea0101;
}
 .oceanacidificationt_modifyDetails span{
    color:#fff;
 }
  .oceanacidificationt_modifyDetails .custom_author_info a{
    color:#fff;
  }
.oceanacidificationt_modifyDetails {
    
    border-radius: 20px;
    padding: 10px;
    margin-bottom: 20px;
}
 
.author_imag img {
    width: 60px;
    min-width: 60px;
    height: 60px;
    border-radius: 100%;
    object-fit: cover;
}
 
.author_imag {
    line-height: 0;
}
 
.name_author_out {
    display: flex;
}
 
.name_author_out span.lbl {
    margin-right: 5px;
}
 
.name_author_out a {
    color: inherit;
}
 
/*Author Page css*/
.header-profile-details h2 {
    font-size: 30px;
    margin-bottom: 0;
    margin-top: 0;
}
 
.profile-header-container {
    display: flex;
    align-items: center;
    gap: 30px;
}
 
.header-avatar-container img {
    padding: 0;
    border: 0;
    width: 75px;
    height: 75px;
    object-fit: cover;
}
 
.header-profile-details h2 {
    font-size: 30px;
    margin-bottom: 0;
    margin-top: 0;
}
 
.profile-fields-group.profile-fields-group-1 {
    border: 1px solid #eee;
    margin: 1.5rem 0 0;
    padding: 15px 20px;
    border-top-right-radius: 3px;
    border-top-left-radius: 3px;
    letter-spacing: 1px;
}
 
.profile-fields-group.profile-fields-group-1 h3 {
    margin-top: 0;
    margin-bottom: 20px;
    color: #000;
}
.home-page.author-box-wrapper {
    padding: 90px 20px 30px;
    box-shadow: none;
    max-width:1500px;
width:100%;
    margin:auto;
}
 
.author-f-name .label, .author-description-name .label {
    font-weight: 600 !important;
    font-size: inherit;
    line-height: inherit;
    background: transparent;
    color: #222222;
    padding: 0px;
}
.profile-fields-table .data{
    color: #222222;
}
 
.author-f-name {
    display: flex;
    gap: 15px;
    font-size: 20px;
}
 .header-profile-details h2{
    color:#222;
 }
.author-description-name {
    margin-top: 20px;
    font-size: 20px;
}
.name_author_out a:hover,
.name_author_out a:hover p {
    color: #fff ;
    text-decoration-color: #fff ;
}

.custom_author_info span a,
.custom_author_info span b,
.custom_author_info  a p,
.custom_author_info span{
    color:#fff!important;
}
.oceanacidification-footer{
    padding:20px;
}
.oceanacidification-footer a{
   color:#c0c0c0;
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1023px) {
    .toplist-techcity__offer-logo:before {
        right: 40px !important;
    }
}


