:root { --header: 'Open Sans', sans-serif; --subheader: "Inter Tight", sans-serif, system-ui; --bodytext: "Inter", sans-serif, system-ui; /*Colors*/ --primary:#EC2E26; --secondary:#5f646a; --highlight: #a31711; --dark: #1b1b1b; --mute:#555555; --gray:#f5f6f6; --light:#e5e7e8; --lightOrange:#fff2f1; /*Utilities*/ --sliderHeight:640px; } body{color:var(--mute);} body.subpage{ margin-top:120px;} body.noScroll{ overflow:hidden;} body::-webkit-scrollbar-track {background-color: #fff;} body::-webkit-scrollbar { width: 5px; background-color: #fff;} body::-webkit-scrollbar-thumb { background-color: var(--primary);} a{color:var(--highlight); font-weight:500;} /* 3. Base Elements */ h1, h2, h3, h4, h5, h6 {margin-top: 0;margin-bottom: 0.5rem;font-family:var(--header);font-weight: 600;text-align:left;text-rendering:optimizelegibility;line-height: 1.2;color: var(--secondary); a { color:inherit;} } .button{ &.button-highlight {background: var(--primaryDark);border: 1px solid transparent;color: var(--white); } } header.Header {position: fixed;z-index: 99;top: 0;background: var(--white);transition: all .3s ease; box-shadow:0px 0px 1px rgb(9 9 9 / 30%); & .logo {position:relative;display: flex;flex-wrap: nowrap;justify-content: space-between; & img {width: 200px;padding: 10px 0;max-height: none;transition: all .3s ease;} button.navbar-toggler{ padding:15px; font-size:3em;} } .main-navigation { & ul { & li { & a, span {color: var(--dark);padding: 10px;font-size: 1.0em;border-top:2px solid transparent;font-weight: 400; cursor:pointer;} &.home a{font-size:0;text-align: center;padding: 8px 15px;margin: 0; &:before{content:"\f424";font-family:bootstrap-icons!important;font-size: 18px;display: block;margin: 0 auto;} } &:hover{background:var(--primary); & > a, span {color:var(--white); border-color:var(--highlight);} } ul li{ a{color:var(--white);} &:hover{ a{ color:var(--dark);} } } } } } } .slider-block {position:relative;background: var(--dark);margin-top: 84px;} .sliderSection {z-index: 1; position: relative;top: 0;width: 100%;left: 0; & .slide { & .caption { & :is(h1, h2, h3, h4){ font-family:var(--special);} .h1, h1 {font-size: calc(2.5rem + 1.5vw); @media (min-width: 1200px) {font-size: 4rem; } } .h2, h2 {font-size: calc(1.20rem + 0.5vw); @media (min-width: 1200px) {font-size: 3.5rem; } } .h3, h3 {font-size: calc(1.0rem + 0.075vw); @media (min-width: 1200px) {font-size: 3rem; } } p, div {font-size: calc(1.0rem + 0.05vw); @media (min-width: 1200px) {font-size: 1.6rem; } } & .button.button-sm{ padding:10px 15px; } } } .tao-carousel .tao-item .item .caption { position:relative ; height:auto;} @media (min-width: 0px) and (max-width: 549px) { --sliderHeight: 400px; & .slide { display:flex; flex-wrap:wrap; height:var(--sliderHeight); & .image{/* position:relative; */order:0;height: calc( var(--sliderHeight));width:100%;background-size:cover;background-position:center;} & .captionData{ order:1; height:auto; .caption {width:100%;/* padding:0; */} } & .caption{ .h1, h1 {font-size: calc(1.20rem + 1.5vw); @media (min-width: 1200px) {font-size: 3rem; } } .h2, h2 {font-size: calc(1.4rem + 0.5vw); @media (min-width: 1200px) {font-size: 2.5rem; } } .h3, h3 {font-size: calc(.70rem + 0.06vw); @media (min-width: 1200px) {font-size: 2rem; } } p, div {font-size: calc(1.0rem + 0.05vw); @media (min-width: 1200px) {font-size: 1.6rem; } } } } } } .subpageHeader-block {margin-top: 86px; div.pageHeader{ position:relative; z-index:1; img{transform:scale(1); transition:all .5s ease; } } img{ width:100%;} } .titleBlock {/* padding:30px 0; */ &.white{ color:var(--white);} span {font-size: 1.3rem;font-weight:400;font-family:var(--bodytext);font-weight: 500;margin: 0 0 10px;position: relative;display: inline-block;color: var(--primary);} .title{font-size: 2.65em;font-weight:600;font-family:var(--special);line-height: 1.0;} } .homeContentCards {background: var(--white);} /*Side nav*/ .sideNav ul{ margin-bottom:15px;} .sideNav .highlight span, .sideNav .highlight a {background: var(--primary); color: var(--white); } #changeparameters_1{display:none;} .taoGalleryBox .overlay {background:color-mix(in srgb,var(--mute) 85%,transparent) !important;} .gallery_paging_links span a, .gallery_next_link_inactive, .gallery_prev_link_inactive {margin: 0 1px !important;} .imageGallery { display: grid; grid-template-columns: repeat(5, 1fr); gap: 0; width: 100%; height: auto; .ligBox{max-width: none;} @media (min-width: 0px) and (max-width: 1190px) {grid-template-columns: repeat(4, 1fr);} @media (min-width: 0px) and (max-width: 778px) {grid-template-columns: repeat(3, 1fr);} @media (min-width: 0px) and (max-width: 479px) {grid-template-columns: repeat(2, 1fr);} } .titleBlock { &.white{ color:var(--white);} span {font-size: 1.3rem;font-weight:400;font-family:var(--bodytext);font-weight: 500;position: relative;display: inline-block;color: var(--mute);border-bottom: 2px solid var(--primary);} .title{font-size: 2.65em;font-weight:600;font-family:var(--special);line-height: 1.0;} } .about-block{ border-bottom: 1px solid #f9f9f9; img{ width:100%;} & .aboutContent {background:var(--light);padding: 30px;display: flex;flex-wrap: wrap;align-content: center;height: 100%;justify-content: center;} } .introBlock{ position:relative; &:before{content:'';display:block;width:100%;height:100%;position:absolute;top:0;left:0;background: url(/image/cache/icon-blue.svg) no-repeat;opacity: .1;background-size: auto 80%;background-position: 5% -50%;transform: rotate(0);} & .container{position:relative; z-index:2;} & .introWrapper{box-shadow:0 0 10px 0 rgba(0, 0, 0, 0.1);border-radius: 3px;} & .introText{height:100%;padding: 40px; & .section-title { span{font-family: "Kalam", cursive;font-size: 30px;text-transform:lowercase;color:var(--primary);line-height: 1;display: inline-block;} h2{color:var(--dark);margin-bottom:15px;line-height: 1.3;font-weight: bold;} } } & .aboutContentBlocks { & .iconBlock {display:flex;align-items: center;border-style: solid;border-width: 1px 1px 1px 1px;border-color: var(--light);border-radius: 4px 4px 4px 4px;background-color: var(--gray);margin-bottom: 20px;padding: 10px; & .icon{min-width: 120px; img{width:100%;color: #2D6A9F;padding: 0 16px;} } & .title.lead{font-weight:600;} p a {color: #D5301A;font-size: 1.1em; i{vertical-align:middle;font-weight: bold;color: inherit;} } @media (min-width: 0px) and (max-width: 549px) {flex-direction:column;} } } } .featuredBlock{position:relative;overflow:hidden;height: 100%;background: var(--lightOrange);border-radius: 3px; div.img{ position:relative; z-index:1; img{transform:scale(1); transition:all .5s ease; } &:after{content:'';display:block;position:absolute;width:100%;height:100%;top:0;left:0;transition:all .5s ease;background: linear-gradient(0deg, var(--secondary) 0%, rgb(255 255 255 / 15%) 100%);opacity: 0;} } & .details {position:relative;z-index: 9;padding: 15px 17px;transition:all .5s ease;background: var(--lightOrange); h2{display:inline-block;color: var(--dark); font-size:1.3em; font-weight:600; margin:0;} } &:hover { div.img{ img{ transform:scale(1.2); transition:all .5s ease; } } } } .videoBlocks{background: var(--light); .videoBlock{background:var(--white); & a {display:block; position: relative; transition:all .5s ease; img{border-radius: 3px; transition:all .5s ease; background:var(--primary);} span{ display:inline-block; padding:15px; color:var(--mute);} &:after{content: ''; display: block; width: 60px; height: 80px; background: url(data:image/png;base64,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); background-size: contain; background-repeat: no-repeat; background-position: center; position: absolute; z-index: 11; transform: translate(-50%, -50%); top: 50%; left: 50%;} &:hover{ img{opacity: .8; transition:all .5s ease;}} } & .desc{ } } } /*Board & Staff*/ .directorRows { .directorRow{display:flex;padding-bottom: 30px;align-items: stretch;height: 100%; & .image{min-width: 225px; img{width:100%;height:100%;object-fit:cover;max-height: 335px;} } & .biography{ padding:15px; border: 1px solid #ddd;} @media all and (min-width: 0px) and (max-width: 769px) { flex-direction:column; & .image{text-align:center; img{max-height: none;width: auto;height: auto;} } } @media all and (min-width: 0px) and (max-width: 479px) { & .image{text-align:center; img{width: 100%;} } } } } footer#footer { background:transparent; color:var(--white); & .footerWrapper {background: var(--secondary);padding-top: 50px;} & .footlogo img{width: 150px;filter: brightness(0) invert(1);/* margin-bottom: 30px; */} & .footerDetails{ } & .address{} & .credentails{ > img{width: 300px;display:block;/* margin-bottom: 30px; */} } & .footerNav{ ul{display:flex;flex-wrap: wrap; li {min-width:50%;text-align: right;} } @media (min-width: 0px) and (max-width: 991px) { ul li {text-align:center;} } @media (min-width: 0px) and (max-width: 769px) { ul li {text-align:left;} } } & .copyright{margin-top: 30px; span{text-align:right;} @media all and (min-width: 0px) and (max-width: 769px) { nav, ul{justify-content:center;} } } @media all and (min-width: 0px) and (max-width: 769px) { nav.footerNav ul li {min-width:100%;} & .copyright{ span{text-align:center;} } } } #social {background:transparent;margin-bottom: 15px;} @media all and (min-width: 0px) and (max-width: 991px) {} @media all and (min-width: 0px) and (max-width: 779px) { .sliderSection{position:relative;height: auto;background: #333;} .sliderSection { & .slide {/* height:auto; */} } } @media all and (min-width: 0px) and (max-width: 579px) { .sliderSection{/* margin-top: 73px; */} } @media all and (min-width: 0px) and (max-width: 479px) { .sliderSection{/* margin-top: 63px; */} }