.container, .container-fluid {padding-inline:30px !important;}
.wd-side-hidden {width:200px !important;}

a:focus {color:#52699d; text-decoration:underline;}
.mainDiv {margin:0 auto; width:1500px; clear:both;}
.mainContent {padding:0 30px;}

.home {height:100vh; background-color:#98a5b5 !important; background-image:var(--homeBackground) !important; background-size:cover !important; background-position:center !important; background-repeat:no-repeat;}
.home .wd-page-wrapper {background-color:transparent !important;}
.home .whb-general-header {border-bottom-width:0px;}
.home .whb-color-dark:not(.whb-with-bg) {background-color:transparent !important;}
.home .wd-footer {background-color:transparent !important; color:#ffffff  !important}
.home .logo {color:#ffffff !important;}
.home .logo a {color:#ffffff !important;}
.home .logo a:focus {text-decoration:none;}

.homeWrapper {display:flex; flex-flow:wrap;}
.homeWrapper > div {height:calc(100vh - 160px); width:50%; }
.homeLeft  h1 {padding:24vh 50px 0 50px; margin:0 0 0 0; text-transform:uppercase; color:#ffffff; text-align:right; font-size:30px; line-height:30px; font-weight:300;}
.homeRight ul {padding:24vh 50px 0 0; margin:0 0 0 0; list-style:none; list-style-image:none;}
.homeRight ul li {border-left:#ffffff 2px solid; padding:0 0 30px 50px; margin:0 0 0 0; list-style:none; list-style-image:none;}
.homeRight ul li:last-of-type {padding:0 0 0 50px;}
.homeRight ul li a {text-transform:uppercase; color:#ffffff; font-size:30px; line-height:30px; font-weight:300; text-decoration:none;}
.homeRight ul li a:hover {color:#c5c5c5;}

.categoryDiv {padding:30px 0;}
.categoryDiv h1 {text-transform:uppercase;}
.categoryDesc {padding:0 20% 20px 0;}
.categoryPosts {display:flex; flex-flow:wrap; gap:30px;}
.categoryPosts > div {width:calc(33.3333% - 20px);}
.categoryPosts > div .image {position:relative; padding-top:66.666%; cursor:pointer; overflow:hidden; border:#dedede 1px solid;}
.categoryPosts > div .bgImage {position:absolute; z-index:1; top:0; right:0; width:100%; height:100%; transition:transform.2s; transform-origin:50% 50%;}
.categoryPosts > div:hover .bgImage {transform:scale(1.05); width:100%;}
.categoryPosts .text h2 {text-transform:none; font-size:18px; margin:10px 0 0 0;}
.categoryPosts .text h2 a:hover {color:#52699d; text-decoration:underline;}

.postDiv {display:flex; flex-flow:wrap;}
.postDiv > div {width:50%;}
.postDiv .image img {width:100%; height:auto; min-height:100%; max-height:calc(100vh - 90px); object-fit:cover;}
.postDiv .text {align-self:center;}
.postDiv .text .inner {padding:60px 20% 40px 60px;}
.postDiv .text .inner h1 {padding:0 0 0 0; margin:0 0 0 0; font-size:20px; line-height:26px;}
.postDiv .text .inner .postExcerpt {color:#484848; font-weight:500; padding:10px 0 0 0;}

.postGallery {display:flex; flex-flow:wrap; gap:30px; padding:80px 0 60px 0;}
.postGallery > div {width:calc(33.3333% - 22px);}
.postGallery > div .image {overflow:hidden; position:relative; border:#dedede 1px solid; padding-top:66.666%;}
.postGallery > div .bgImage {position:absolute; z-index:1; top:0; right:0; width:100%; height:100%; transition:transform.2s; transform-origin:50% 50%;}
.postGallery > div .bgImage img {width:100%; height:100%; object-fit:cover;}
.postGallery > div:hover .bgImage {transform:scale(1.05); width:100%;}
.postGallery > div .vid {overflow:hidden; position:relative; border:#dedede 1px solid; padding-top:66.666%;}
.postGallery > div .vid iframe {position:absolute; top:0; left:0; width:100%; height:100%;}


.aboutDiv {display:flex; flex-flow:wrap;}
.aboutDiv .image {width:40%;}
.aboutDiv .image img {width:100%; height:auto; min-height:100%; object-fit:cover;}
.aboutDiv .text {width:60%;}
.aboutDiv .text .inner {padding:60px 30% 40px 60px;}
.aboutDiv .text .inner h1 {padding:0 0 20px 0; margin:0 0 0 0; font-size:20px; line-height:26px;}

.aboutPublications {padding:60px 0 0 0;}
.aboutPublicationsItems {display:flex; flex-flow:wrap; gap:9%}
.aboutPublicationsItems > div {width:19%;}
.aboutPublicationsItems .image img {width:100%; height:auto;}
.aboutPublicationsItems h3 {font-size:18px; line-height:22px; padding:10px 0 2px 0; margin:0 0 0 0;}
.aboutPublicationsItems a {color:#52699d; text-decoration:underline;}

.aboutAwards {padding:60px 0 60px 0;}
.aboutAwardsItems {display:flex; flex-flow:wrap; gap:9%}
.aboutAwardsItems > div {width:19%;}
.aboutAwardsItems .image img {width:100%; height:auto;}
.aboutAwardsItems h3 {font-size:18px; line-height:22px; padding:10px 0 2px 0; margin:0 0 0 0;}
.aboutAwardsItems a {color:#52699d; text-decoration:underline;}

.pageDiv {padding:30px 0;}
.pageDiv h1 {text-transform:uppercase;}

@media only screen and (max-width:1540px) and (min-width:1240px)
{
    .mainDiv {width:1200px;}
    .postDiv .text .inner {padding:60px 15% 40px 60px;}
    .aboutDiv .text .inner {padding:60px 20% 40px 60px;}
}

@media only screen and (max-width:1239px) and (min-width:1025px)
{
    .mainDiv {width:1000px;}
    .categoryDesc {padding:0 15% 20px 0;}
    .postDiv .text .inner {padding:60px 10% 40px 60px;}
    .aboutDiv .text .inner {padding:60px 10% 40px 60px;}
}

@media only screen and (max-width:1024px) and (min-width:0px)
{
    .container, .container-fluid {padding-inline:16px !important;}
    .wd-sidebar-opener {display:none !important;}
    .mainDiv {width:auto;}
    .mainContent {padding:0 20px;}

    .homeWrapper {display:block; padding:0 40px; min-height:calc(100vh - 140px);}
    .homeWrapper > div {height:auto; width:auto;}
    .homeLeft h1 {padding:8vh 20px 40px 20px; text-align:center;}
    .homeRight {border-top:#ffffff 2px solid; }
    .homeRight ul {padding:40px 0 0 0;}
    .homeRight ul li {border-left:0px; padding:0 0 20px 0; text-align:center;}
    .homeRight ul li:last-of-type { padding:0 0 20px 0;}

    .categoryDiv {padding:16px;}
    .categoryDiv h1 {padding:4px 0 0 0;}
    .categoryDesc {padding:0 0 10px 0;}
    .categoryPosts {display:block;}
    .categoryPosts > div {width:auto; padding:0 0 20px 0;}

    .postDiv {display:block;}
    .postDiv > div {width:auto;}
    .postDiv .text .inner {padding:20px 16px 0 16px;}
    .postGallery {display:block; padding:20px 20px 40px 20px;}
    .postGallery > div {width:auto; padding:10px 0;}

    .aboutDiv {display:block;}
    .aboutDiv .image {width:auto;}
    .aboutDiv .text {width:auto;}
    .aboutDiv .text .inner {padding:20px 16px 0 16px;}

    .aboutPublications {padding:40px 20px 20px 20px;}
    .aboutPublicationsItems { gap:12%}
    .aboutPublicationsItems > div {width:44%;}

    .aboutAwards {padding:40px 20px 60px 20px;}
    .aboutAwardsItems { gap:12%}
    .aboutAwardsItems > div {width:44%;}

    .pageDiv {padding:16px;}
    .pageDiv h1 {padding:4px 0 0 0;}
}