﻿/* Color schemes and buttons */

:root {
--pi-red: #BE1E2D;
--pm-orange: #FF8C0D;
--sn-brown: #7F5026;
}

.pi-red {
background:var(--pi-red);
}

.pi-red-font {
color:var(--pi-red);
}

.pm-orange {
background:var(--pm-orange);
}

.sn-brown {
background:var(--sn-brown);
}


.mono-black {
background:#000;
}

.radius10 {
border-radius:10px;
margin:0 20px 40px 20px;
}

.radius10-nomargin,
.profile-photo {
border-radius:10px;
}


@media screen and (max-width:480px) {

.radius10 {
margin:0 0 20px 0;
}

}

.button {
padding:10px 15px;
text-decoration:none;
font-weight:bold;
color:#fff;
border-radius:10px;
transition: all 0.5s linear !important;
box-shadow:none !important;
-webkit-box-shadow: none !important;
cursor:pointer;
}

.button.pi-red:hover {
color:#fff;
background:#000;
}

.button.mono-black:hover {
color:#fff;
background:var(--pi-red);
}

.post-cat a,
.rpc-post-category a {
border-radius:10px;
}

/* Profile list */

.profile div:nth-child(1) {
width:19%;
float:left;
}

.profile div:nth-child(2) {
width:79%;
float:right;
}

.profile div:nth-child(1) img {
width:100%;
border-radius:10px;
}

.profile div span {
font-weight:bold;
color:var(--pi-red);
}

.profile:before {
content: ".";
display: block;
clear: both;
visibility: hidden;
height: 20px;
}

.profile div:nth-child(2) a {
color:var(--pi-red);
text-decoration:none;
-webkit-box-shadow: none;
box-shadow: none;
}

.profile div:nth-child(2) a[href*="mailto:"]:before {
display:inline-block;
vertical-align:middle;
margin:0 5px 0 0;
content:"";
width:37px;
height:40px;
background: url("images/red-email-icon.png")no-repeat center center;
}

@media screen and (max-width:480px) {

.profile div:nth-child(1), 
.profile div:nth-child(2) {
width:100%;
float:none;
}

.profile-photo {
width:100%;
}

}

/* All Grids */

.grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 300px));
grid-gap: 25px;
justify-content: center;
padding: initial;
}

.grid a,
.grid a:focus,
.grid a:hover,
.visual-buttons a,
.visual-buttons a:focus,
.visual-buttons a:hover {
box-shadow:none !important;
-webkit-box-shadow: none !important;
}

.grid:not(.bod-grid) br {
display: none;
}

.grid.covid .archive-grid br {
display: block !important;
}

.grid.featured {
display:flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: left;
align-items:flex-start;
}

.grid div {
padding-bottom:20px;
}

.grid div.featured {
padding-bottom:0;
}

/* BOD Grid */

.bod-grid {
position: relative;
display:inline-block;
border-radius:10px;
z-index: 1;
background: #ffffff;
transition: 0.3s;
box-shadow: 11px 10px 38px rgb(0 0 0 / 10%);
margin:17px;
}

.bod-grid img {
width:100%;
border-radius:10px 10px 0px 0px;
}

.bod-grid p {
padding:0px 20px;
}

.bod-grid span {
color:var(--pi-red);
font-weight:bold;
}

/* Archive Grid */

.archive-grid {
border:1px solid #cecece;
border-radius:10px;
min-height:620px;
}

.covid .archive-grid {
min-height:420px;
}

.archive-grid.featured,
.page-template-page-template-events .grid.two .archive-grid,
.page-template-page-template-surveys .grid.two .archive-grid,
.category-past-events .archive-grid,
.category-past-surveys .archive-grid {
min-height:initial;
}

.archive-grid.featured {
width:100%;
margin:15px 0px;
}

.archive-grid img {
width:100%;
border-radius:10px 10px 0px 0px;
}

.entry-content .archive-grid a img {
box-shadow:none;
}

.archive-grid.featured img {
border-radius:10px 0px 0px 10px;
float:left;
width:auto;
max-width:30%;
/* width:20%; */
}

.archive-grid .text-wrapper {
padding:5px 20px;
}

.archive-grid:not(.featured) .text-wrapper div {
min-height:240px;
}

.covid .archive-grid .text-wrapper div {
min-height:350px;
}

.archive-grid .text-wrapper .entry-meta{
display:block;
margin:10px 0;
}

/* .category-books .archive-grid .text-wrapper h3 {
margin-bottom:1px;
} */

.page-template-page-template-surveys .archive-grid .text-wrapper .entry-meta{
margin:10px 0 10px 0;
}

.archive-grid .text-wrapper .author {
display:block;
margin:-10px 0 25px 0;
}

.publication-blocks .publication-posts ul li .entry-date,
.home-news-posts .entry-meta .entry-date,
.archive-grid .text-wrapper .entry-meta,
.archive-grid .text-wrapper .entry-meta .entry-date {
text-transform: capitalize;
font-weight: normal;
font-size: 15px;
letter-spacing: 0;
}

.archive-grid.featured .text-wrapper {
width:65%;
float:left;
padding:20px 20px;
}

.archive-grid .text-wrapper h3 {
font-size:1.2rem;
}

.archive-grid.featured .text-wrapper h3 {
font-size:1.5rem;
}

.archive-grid .text-wrapper h3 {
font-weight:bold;
}

.page-template-page-template-surveys .archive-grid .text-wrapper div,
.page-template-page-template-events .archive-grid .text-wrapper div,
.category-past-events .archive-grid .text-wrapper div,
.category-past-surveys .archive-grid .text-wrapper div,
.category-past-surveys .archive-grid .text-wrapper div    {
min-height:170px;
}

.category-penang-institute-newsletters  .archive-grid,
.category-penang-institute-chats .archive-grid,
.category-highlights-at-penang-institute .archive-grid,
.category-in-the-mass-media  .archive-grid {
border:0;
border-radius:0;
border-bottom:1px solid #cecece;
}

.category-penang-institute-newsletters  .archive-grid.featured,
.category-penang-institute-chats .archive-grid.featured,
.category-highlights-at-penang-institute .archive-grid.featured,
.category-in-the-mass-media .archive-grid.featured {
padding:15px 0 30px 0;
margin:10px 0;
}

.category-penang-institute-chats .archive-grid.featured img {
border-radius:10px;
float:right;
width:auto;
max-width:40%;
}

.category-penang-institute-newsletters  .archive-grid.featured img,
.category-highlights-at-penang-institute .archive-grid.featured img,
.category-in-the-mass-media .archive-grid.featured img {
border-radius:10px;
float:right;
width:auto;
max-width:30%;
}

.category-penang-institute-newsletters .archive-grid.featured .text-wrapper h3,
.category-penang-institute-chats .archive-grid.featured .text-wrapper h3,
.category-highlights-at-penang-institute .archive-grid.featured .text-wrapper h3,
.category-in-the-mass-media  .archive-grid.featured .text-wrapper h3 {
font-size:1.2rem;
}

.category-penang-institute-newsletters .archive-grid.featured .text-wrapper,
.category-penang-institute-chats .archive-grid.featured .text-wrapper,
.category-highlights-at-penang-institute .archive-grid.featured .text-wrapper,
.category-in-the-mass-media  .archive-grid.featured .text-wrapper {
width:60%;
float:left;
padding:20px 0;
}


@media screen and (max-width:960px) {

.bod-grid {
width:90%;
margin:17px auto;
}

.grid div.featured {
padding-bottom:20px;
}

.archive-grid,
.covid .archive-grid,
.category-issues .archive-grid,
.category-monographs .archive-grid,
.category-suara-nadi .archive-grid,
.category-past-events .archive-grid,
.page-template-page-template-events .grid.two .archive-grid,
.page-template-page-template-surveys .grid.two .archive-grid,
.archive-grid.featured {
width:100%;
margin:15px 0;
padding:10px;
min-height:initial;
padding-bottom:20px;
}

.archive-grid img,
.archive-grid.featured img {
width:auto;
max-width:40%;
border-radius:10px;
float:left;
}

.archive-grid img.alignleft {
display:inline-block;
margin-right: 0;
float:left !important;
}

.archive-grid.featured .text-wrapper h3,
.archive-grid .text-wrapper h3 {
font-size:0.8rem;
font-weight:normal;
}

.archive-grid.featured .text-wrapper,
.archive-grid .text-wrapper {
width:55%;
float:left;
padding:0px 5px 0 20px;
font-size:0.8rem;
}

.covid .archive-grid .text-wrapper {
margin-top:-25px;
}

.archive-grid .text-wrapper .author {
font-size:0.6rem;
margin:3px 0 0 0;
}

.archive-grid .text-wrapper .entry-meta{
margin:0 0 5px 0;
}

.archive-grid .button,
.archive-grid .text-wrapper .entry-meta,
.archive-grid .text-wrapper .entry-meta .entry-date{
font-size:11px;
}

.page-template-page-template-surveys .archive-grid .text-wrapper div,
.page-template-page-template-events .archive-grid .text-wrapper div,
.category-past-events .archive-grid .text-wrapper div,
.archive-grid:not(.featured) .text-wrapper div {
min-height:initial;
}

.category-penang-institute-chats .archive-grid.featured img,
.category-penang-institute-newsletters  .archive-grid.featured img,
.category-highlights-at-penang-institute .archive-grid.featured img,
.category-in-the-mass-media .archive-grid.featured img {
float:none;
width:auto;
max-width:100%;
}

.category-penang-institute-newsletters .archive-grid.featured .text-wrapper,
.category-penang-institute-chats .archive-grid.featured .text-wrapper,
.category-highlights-at-penang-institute .archive-grid.featured .text-wrapper,
.category-in-the-mass-media  .archive-grid.featured .text-wrapper {
width:100%;
float:none;
}

html #shiftnav-toggle-main ~ #wpadminbar {
    top: 0px !important;
}

.logged-in .site {
margin-top:46px;
}

}

/* Articles sidebar */

.has-article-sidebar {
width:75%;
float:left;
border-right:1px solid #eaeaea;
padding-right:20px;
}

.article-sidebar {
width:22%;
float:right;
}

@media screen and (max-width:960px) {

.has-article-sidebar {
border-right:0px;
padding-right:0px;
}

.has-article-sidebar,
.article-sidebar {
width:100%;
float:none;
margin:0 0 10px 0;
}

}

/* Related Post styling */

#related_posts_thumbnails li {
width:100%;
border:0 !important;
background: transparent !important;
}

.relpost-post-image {
border-radius:10px;
float:left;
width:30%;
margin:0 15px 0 0 !important;
}

.rpth_list_content {
font-weight:bold;
}

.relpost_content:hover {
color:var(--pi-red) !important;
}

.relpost_content,
.relpost_content:hover,
.relpost_content:focus {
-webkit-box-shadow: none !important;
box-shadow: none !important;
}


/* Home Special Higlights */

#special-highlights {
background: url("images/parallax2.jpg") #000 no-repeat center center;
background-size:cover;
/* -webkit-background-size: 100% auto; */
background-attachment: fixed;
width:100%;
min-height:700px;
display:flex;
align-items: center;
justify-content: flex-end;
padding-top:40px;
}

#special-highlights img {
border-radius:10px;
}

#special-highlights p {
margin:8px 0 10px 0;
}

/* columns */

.col60 {
width:59%;
}

.col40 {
width:39%;
}

.cols.alignleft {
margin-right:0em;
}

.cols.alignright {
margin-left:0em;
}

@media screen and (max-width:960px) {

.col60,
.col40 {
width:100%;
margin:12px 0;
}

}

/* New Footer */

.site-footer {
background: url("images/parallax3.jpg") #000 no-repeat center top;
background-size:cover;
/* -webkit-background-size: 100% auto; */
color:#fff;
min-height:400px;
}

.site-footer .footer-widget-1 {
background:#383838;
min-height:400px;
}

.site-footer .footer-widget-3 {
text-align:right;
}

.site-footer .footer-widget-1,
.site-footer .footer-widget-2,
.site-footer .footer-widget-3 {
padding:100px 20px;
}

.site-footer .socialmedias-btm{
display:inline-block;
height:27px;
margin:0 8px;
background: url("images/social-media-icons-white-footer.png") no-repeat;
}


.site-footer .socialmedias-btm.fb{
width:27px;
background-position: 0 0;
}

.site-footer .socialmedias-btm.ig{
width:28px;
background-position: -33px 0;
}

.site-footer .socialmedias-btm.tw{
width:33px;
background-position: -67px 0;
}

.site-footer .socialmedias-btm.ch{
width:27px;
background-position: -103px 0;
}

.site-footer .contacts {
color:#fff;
padding:0 20px;
}

.site-footer a{
color:#fff;
text-decoration:none;
box-shadow: none !important;
}

.site-footer .contacts a:hover,
.site-footer .site-info a:hover{
color:#cecece !important;
}

.site-footer .contacts p span{
display:inline-block;
}

.site-footer .contacts p span:nth-child(1){
margin:0 15px 0 0;
background: url("images/footer-icons.png") no-repeat;
}

.site-footer .contacts p .address{
width:33px;
height:43px;
vertical-align:top;
background-position: 0 0 !important;
}

.site-footer .contacts p .tel{
width:33px;
height:36px;
vertical-align:top;
background-position: -39px -4px !important;
}

.site-footer .contacts p .hours{
width:33px;
height:33px;
vertical-align:top;
background-position: -78px -5px !important;
}

.site-footer .contacts p .email{
width:34px;
height:22px;
vertical-align:middle;
background-position: -117px -11px !important;
}

@media screen and (min-width:1680px) {

.site-footer {
background: url("images/parallax3.jpg") #000 no-repeat center center;
background-size:cover;
min-height:500px;
}

.site-footer .footer-widget-1 {
min-height:500px;
}

}


@media screen and (max-width:960px) {

.site-footer {
min-height:initial;
}

.site-footer .footer-widget-1 {
min-height:initial;
}

.site-footer .footer-widget-3 {
text-align:center;
}

.site-footer .contacts {
padding:0 10px;
}

.site-footer .footer-widget-1{
padding:100px 0px 20px 0px;
background:transparent;
}


.site-footer .footer-widget-2,
.site-footer .footer-widget-3 {
padding:20px 20px 5px 20px;
}

}


@media screen and (min-width:768px) and (max-width:768px) {

.site-footer .footer-widget-1, 
.site-footer .footer-widget-2,
.site-footer .footer-widget-3 {
padding:100px 0px 20px 0px;
}

}

/* Newsletter bar */

#newsletter {
background:var(--pi-red);
border-radius:10px;
width:100%;
min-height:100px;
padding:20px;
color:#fff;
position:relative;
display:flex;
flex-direction: row;
align-items: center;
justify-content: center;
margin:20px auto -50px auto;
}

#newsletter h3 {
color:#fff;
display:inline-block;
font-weight:bold;
margin:0;
}

#newsletter div {
width:30%;
text-align:center;
padding:0 30px;
}

#newsletter div input {
height:20px;
border:0;
border-radius:0;
background:transparent;
color:#fff;
border-bottom:2px solid #fff;
text-align:center;
}

/* #newsletter div.name input {
display:inline-block;
width:50%;
} */

#newsletter div input::placeholder {
color:#fff;
opacity:0.5;
}

#newsletter input[type="submit"] {
border-radius:10px;
background:#fff;
color:#000;
font-weight:bold;
font-size:20px;
}

@media screen and (max-width:768px) {

#newsletter {
flex-direction: column;
}

#newsletter.wrap {
max-width: 95%;
}

#newsletter h3 {
display:block;
margin:10px 0;
}

#newsletter div {
width:100%;
margin:15px 0;
}

#newsletter input[type="submit"] {
margin:20px 0 0 0;
}

}

/* Opportunities */
.opportunities {
border-radius:10px; 
border:1px solid #cecece;
padding:20px;
}

.opportunities #div2 {
display:none;
}

/* WP Admin Bar fixes */

@media screen and (max-width:480px) {

html #shiftnav-toggle-main ~ #wpadminbar {
    top: 0px !important;
}

.logged-in .site {
margin-top:46px;
}

.logged-in #masthead.on-scroll {
margin-top:-32px;
}

}

@media screen and (max-width:960px) {

.sidebar-newsletter {
display:none;
}

}

/* Home Features 3rd Carousel */

#home-features {
background:#f6f6f6;
}


#home-features h1 {
text-transform: uppercase;
font-weight: bold;
display: block;
text-align:center;
padding-top:50px;
}

#home-features .wcp-carousel-main-wrap .post-style-1 .wcp-content-wrap {
width: 49%;
}

#home-features .wcp-carousel-main-wrap .post-style-1 .wcp-img-wrap {
width: 49%;
float:right;
border-radius:0px 10px 10px 0px;
}

#home-features .wcp-carousel-main-wrap .post-style-1 {
border-radius:10px;
}

#home-features .wcp-carousel-main-wrap .post-style-1 .wcp-content-wrap {
padding:30px;
}
 
#home-features .wcp-carousel-main-wrap .post-style-1 h3 {
font-size:22px;
font-weight:bold;
margin: 10px 0 20px 0;
}

#home-features .wcp-carousel-main-wrap .slick-dots {
bottom: -50px !important;
}

@media screen and (max-width:960px) {

#home-features .wcp-carousel-main-wrap .post-style-1 .wcp-content-wrap {
width: 100%;
}


#home-features .wcp-carousel-main-wrap .post-style-1 .wcp-img-wrap {
width: 100%;
float:none;
border-radius:10px 10px 0px 0px;
}

#home-features .wcp-carousel-main-wrap .slick-dots {
bottom: -30px !important;
}

}

/* Tabs */

.tabContent {
    display:none;
}

#tabs-1 {
    display:block;
}