
/* 
Theme Name: USYD Brand 
Theme URI: https://sydney.edu.au 
Author: USYD Wordpress Team 
Author URI: http://sydney.edu.au 
Description: University of Sydney branded theme 
Requires at least: 6.0 
Tested up to: 6.8 
Requires PHP: 5.7 
Version: 2.2.8 
License: GNU General Public License v2 or later 
License URI: http://www.gnu.org/licenses/gpl-2.0.html 
Text Domain: usyd-brand 
Tags: Site Editor 
/* used on the border of the header */
/* used on the border of the header */
.shadow-effect { 
    box-shadow: 0 4px 21px 0 rgba(0, 0, 0, 0.06); 
} 
/* stretches the header to full width of the device */
.fixed-header { 
    position:fixed ; 
    width:100%; 
    z-index:2;     
} 
/* sets the maximum width for the content of the page. not including the header and footer. */ 
.container-fluid { 
 --container-width: 1200px; 
 max-width: var(--container-width); 
 margin-right: auto; 
 margin-left: auto; 
} 
/* Ensure WordPress layout wrappers actually use the block gap variable */ 
.is-layout-flex, 
.is-layout-flow, 
.is-layout-constrained, 
.wp-block-group { 
 gap: var(--wp--style--block-gap, 32px); 
} 
/* For column-based layouts, enforce horizontal column-gap too */ 
.wp-block-columns { 
 column-gap: var(--wp--style--columns-gap, 50px); 
} 
/* If a reset removed margins from children, keep gaps via flex gap */ 
.wp-block-group > * { 
} 
/* Clear the root gutters for the hero band only */ 
.no-root-gutters { 
 padding-left: 0; 
 padding-right: 0; 
} 
/* If any inner Groups inherit padding, normalize them too */ 
.no-root-gutters .wp-block-group { 
 padding-left: 0; 
 padding-right: 0; 
} 
.wp-post-image { 
 width: 100%; 
 height: 350px; 
 object-fit: cover; 
 display: block; 
} 
.usyd-logo-block img { 
    padding: 10px; 
} 
.usyd-full-width-background { 
 width: 100vw; 
 margin-left: calc(-50vw + 50%); 
 position: relative; 
 box-sizing: border-box; 
} 
.usyd-full-width-background .container-fluid { 
 max-width: 1200px; /* or your theme's container width */ 
 margin: 0 auto; 
} 
/*************************************/ 
@media (max-width: 768px) { 
 .wp-block-post-featured-image { 
 width: 100vw !important; 
 height: 350px !important; 
 }     
.no-root-gutters .wp-block-column:not(:first-child) { 
 /* prevent residual padding on columns */ 
 padding-left: 0; 
 padding-right: 0; 
 } 
} 
/* device size for the header */ 
@media screen and (max-width: 650px) { 
    .desktop-header-visit { 
        display:none !important; 
    } 
 .desktop-header { 
 display: none !important; 
 } 
    .desktop-menu { 
        display: none !important; 
    } 
    .mobile-reverse-column-direction { 
 flex-direction: column-reverse; 
 }         
    .make-row{ 
        flex-direction: row !important; 
        justify-content: space-between; 
    }     
    .usyd-logo-block img { 
        width:117px ; 
        height: auto; 
    } 
} 
@media screen and (min-width: 651px){ 
    .mobile-header { 
 display: none !important; 
 }     
    .usyd-logo-block img { 
        width:200px ; 
        height: auto; 
    } 
}    
     
} 
@media screen { 
    .printed-header { 
        display: none !important; 
    } 
} 
@media print { 
    .desktop-header-visit { 
        display:none !important; 
    } 
    .desktop-menu { 
        display:none !important; 
    } 
    .mobile-header { 
        display: none !important; 
    } 
    .screen_display { 
        display:none !important; 
    } 
    .usyd-logo-block img { 
        width:140px ; 
        height: auto; 
    } 
} 
/* device size for the footer */ 
.footer-col-2-align .usyd-logo-block img { 
 width: 233px; /* or whatever size you need */ 
 height: auto; 
} 
/* Default footer links: white */ 
.footer-bar a, 
.footer-bar a:visited { 
 color: var(--wp--preset--color--white); 
} 
/* Learn more link: keep black */ 
.footer-bar a.footer-learn-more { 
 color: #141414; /* or var(--wp--preset--color--custom-text-black) */ 
} 
/* Optional hover/focus */ 
.footer-bar a:hover, 
.footer-bar a:focus { 
 color: rgba(255,255,255,0.85); 
 text-decoration: underline; 
} 
.footer-bar a.footer-learn-more:hover, 
.footer-bar a.footer-learn-more:focus { 
 color: #000; /* keep black on hover */ 
} 
.abn-dets { 
    gap: 10px;} 
@media screen and (max-width: 800px) { 
        .footer-border { 
        border-right: none; 
        padding-right:0; 
    } 
    .footer-col-1-align { 
        text-align: center; 
    } 
    .footer-col-2-align { 
        text-align:center; 
    } 
    .footer-button-align { 
        margin:auto !important;         
    } 
    .footer-links { 
        flex-direction: column; 
         gap: 3px; 
        align-items: start !important; 
    } 
    .abn-dets { 
        align-items: start !important; 
    } 
} 
@media only screen and (min-width: 801px){ 
    .footer-border { 
    border-right: 1px solid #141414; 
    padding-right:10%; 
    }     
    .footer-col-2-align { 
        text-align:right; 
    } 
    .align-logo { 
        margin-right:5%; 
    } 
    .abn-dets { 
        padding-left:35%; 
    } 
} 
/* create a hover overlay on the blog post feature image */ 
.hover-opacity:hover{      
    opacity:0.6; 
    filter:alpha(opacity=60); /* For IE8 and earlier */ 
    -webkit-transition: all 1s ease; 
    -moz-transition: all 1s ease; 
    -ms-transition: all 1s ease; 
    -o-transition: all 1s ease; 
    transition: all 1s ease; 
} 
/* remove the flex gap between the Site Title and the Site Tagline in the footer */ 
.no-gap{ 
    gap:3px !important 
} 
/* main menu navigation submenu styles */ 
.wp-block-navigation__submenu-container{ 
    background-color:#E7E7E8 !important; 
    border:0px !important; 
    min-width: 400px !important;     
} 
/* active menu item */ 
.current-menu-item { 
    text-decoration: underline; 
    text-decoration-color: #c63a1e;     
    text-underline-offset: 1rem; 
    text-decoration-thickness: 2px; 
} 
li.wp-block-navigation-item { 
        padding:15px !important; 
} 
li.wp-block-navigation-item:hover { 
    background-color:#c63a1e ; 
    color:white; 
} 
/* keep nav menu on top */ 
.on-top{ 
    z-index:999; 
} 
/* set the top padding for anchor links so it doesn't get pushed under the sticky nav header */ 
html { 
 scroll-padding-top: 8rem; 
} 
/* end menu css */ 
/* Page and post breadcrumbs. Code in the functions.php */ 
.breadcrumbs { 
    margin: 0; 
    padding: 0; 
    overflow: hidden; 
    background-color: #f3f3f3; 
} 
.breadcrumbs li { 
    float:left; 
    padding:10px; 
    list-style-type: ">"; 
 } 
/* end breadcrumbs css */ 
.wp-block-separator { 
 width: 50%; 
 display: block; 
} 
ul li { 
    list-style-type: '\2014'; 
} 
li { 
    padding-bottom: 1rem; 
    padding-left:1.2rem; 
} 
.post_date_display::before { 
    content: "Date created "; 
} 
.post_date_modified_display::before { 
    content: "Date modified "; 
} 
.post_nav_separator { 
    width: 100% !important; 
} 
.wp-block-post-template li{ 
    list-style-type:none; 
} 
.post_nav_cats {         
    padding-inline-start: 15px; 
} 
.post_nav_cats li { 
    list-style-type: none; 
    line-height: 2rem; 
    padding-left: 5px; 
} 
/*hero style page template */ 
.m-hero--style-1__title:after { 
 content: ''; 
 width: 68px; 
 height: 5px; 
 background-color: #E64626; 
 display: block; 
 margin-top: 32px; 
} 
.m-hero--style-1__wrapper { 
 border-bottom: 5px solid #E64626; 
} 
@media screen and (max-width: 800px) { 
    .m-hero--style-1__title { 
        font-size:32px !important; 
    } 
} 
@media screen and (min-width: 651px) { 
    .m-hero--style-1__wrapper { 
        padding-right:25%; 
    } 
} 
/* Hero Style 2 */ 
.m-hero--style-2__title { 
 font-size: 68px; 
 font-weight: 600; 
 font-style: normal; 
 margin-top: 70px; /* adjust as needed */ 
} 
.half-hero-page-title { 
 padding-left: 20%; 
 padding-right: 10%; 
 padding-top: 10%; 
} 
/* Optional responsive tweak */ 
@media screen and (max-width: 800px) { 
 .m-hero--style-2__title { 
 font-size: 32px !important; 
 } 
} 
@media screen and (max-width: 650px) { 
    .half-hero-page-title { 
    padding-left:5%; 
    padding-right:5%; 
    padding-top:10%; 
    }}
/* Containerized inner wrapper inside the full-width cover 
 - Aligns title & excerpt to the same start as the site content container 
 - Adds 25% right margin on desktop 
*/ 
.m-hero__inner { 
 /* This class already has max-width + auto margins via .container-fluid */ 
 padding-left: 0; /* start flush with container's left edge */ 
 padding-right: 0; /* base */ 
} 
@media screen and (min-width: 651px) { 
 .m-hero__inner { 
 /* Create right "margin" as readable padding so text wraps nicely */ 
 padding-right: 25%; 
 } 
} 
/* Title styles & underline */ 
.m-hero--style-1__title { 
 color: #fff; /* ensure visible over cover image (redundant but safe) */ 
 font-size: 68px; /* desktop size per requirement */ 
 font-weight: 600; 
} 
.m-hero--style-1__title:after { 
 content: ''; 
 width: 68px; 
 height: 5px; 
 background-color: #E64626; 
 display: block; 
 margin-top: 32px; 
} 
/* Excerpt inherits white color from block settings, add small tweaks if needed */ 
.m-hero--style-1__excerpt { 
 color: #fff; 
 font-size: 24px; 
 max-width: 100%; /* allow full measure within container + padding-right */ 
} 
/* Mobile typography & layout */ 
@media screen and (max-width: 800px) { 
 .m-hero--style-1__title { 
 font-size: 32px !important; /* per requirement */ 
 } 
} 
@media screen and (max-width: 650px) { 
 .m-hero__inner { 
 padding-right: 0; /* full width on mobile */ 
 padding-left: 0; /* no left gutter beyond container alignment */ 
 } 
} 
/* --- Existing Hero Style 2 (left as-is, optional cleanup) --- */ 
.m-hero--style-2__title { 
 font-size: 68px; 
 font-weight: 600; 
 font-style: normal; 
 margin-top: 70px; /* adjust as needed */ 
} 
.half-hero-page-title { 
 padding-left: 20%; 
 padding-right: 10%; 
 padding-top: 10%; 
} 
@media screen and (max-width: 800px) { 
 .m-hero--style-2__title { 
 font-size: 32px !important; 
 } 
} 
@media screen and (max-width: 650px) { 
 .half-hero-page-title { 
 padding-left: 5%; 
 padding-right: 5%; 
 padding-top: 10%; 
 } 
} 
/* controls the search field in the header */ 
.wp-block-search.wp-block-search__button-only .wp-block-search__button { 
 max-width: calc(100% - 0px) !important; 
} 
/* stops the browser user agent style for the outline when the search field has focus */ 
#wp-block-search__input-2, #wp-block-search__input-5{ 
    outline:0; 
} 
/*style the accordion
toggle
detail block */ 
.wp-block-details summary { 
    font-size:1.2rem; 
 font-weight: 900; 
 text-decoration: underline;} 
.wp-block-details summary::after { 
    content: '+'; 
    color:#e64626; 
    float:right; 
    font-size: 2.5rem; 
font-weight:400;} 
.wp-block-details summary::marker{ 
    content: none ;} 
/* end detail block style */ 
/*table design formatting */ 
table, th, td { 
 border: #ced4da 1px solid !important; 
 padding: 10px; 
} 
tr:nth-child(odd) { 
 background-color: #E7E7E8; 
} 
table { 
 border-collapse: collapse; 
} 
th { 
    background-color: #424242; 
    color: white; 
} 
/*end table design*/ 
#myBtn { 
 display: none; 
 position: fixed; 
 bottom: 20px; 
 right: 30px; 
 z-index: 99; 
 font-size: 18px; 
 border: none; 
 outline: none; 
 background-color: red; 
 color: white; 
 cursor: pointer; 
 padding: 15px; 
 border-radius: 4px; 
} 
#myBtn:hover { 
 background-color: #555; 
} 
#return-to-top { 
 position: fixed; 
 bottom: 40px; 
 right: 40px; 
 background: #000; 
 color: whitesmoke; 
 text-align: center; 
 padding: 10px 15px; 
 font-size: 20px; 
 text-decoration: none; 
 opacity: 0; 
 visibility: hidden; 
 transition: opacity 0.3s, visibility 0.3s; 
 z-index: 999; 
} 
#return-to-top:hover { 
 background: #444; 
} 
#return-to-top.show { 
 opacity: 1; 
 visibility: visible; 
} 
/************************ 
****BLOCKS Styles 
************************/ 
.usyd-icon-picker-dropdown { 
 max-width: 200px; 
 width: 100%; 
} 
.usyd-icon-grid { 
 display: grid; 
 grid-template-columns: repeat(3, 1fr); 
 gap: 12px; 
 margin-top: 10px; 
} 
.usyd-icon-item.selected { 
 box-shadow: 0 0 5px #007cba; 
} 
.icon-small { width: 24px; height: 24px; } 
.icon-medium { width: 48px; height: 48px; } 
.icon-large { width: 72px; height: 72px; } 
.icon-extra-large { width: 96px; height: 96px; }
