/* FONTS */
@import url("https://fast.fonts.net/t/1.css?apiType=css&projectid=bba0fc53-ae5c-42fd-a8a5-d42dd6a2cf14");
/* light */
@font-face{
    font-family:"Helvetica Neue LT W01_41488878";
    src:url("../fonts/1b950d2a-907a-4888-8056-0d44e8e86338.eot?#iefix");
    src:url("../fonts/1b950d2a-907a-4888-8056-0d44e8e86338.eot?#iefix") format("eot"),url("../fonts/3a46542f-f429-4821-9a88-62e3be54a640.woff2") format("woff2"),url("../fonts/50ac1699-f3d2-47b6-878f-67a368a17c41.woff") format("woff"),url("../fonts/0be5590f-8353-4ef3-ada1-43ac380859f8.ttf") format("truetype"),url("../fonts/82a4e1c2-7ffd-4c58-86fa-4010a6723c8e.svg#82a4e1c2-7ffd-4c58-86fa-4010a6723c8e") format("svg");
}
/* medium */
@font-face{
    font-family:"Helvetica Neue LT W01_65 Md";
    src:url("../fonts/f95f9fc2-ffda-431c-9d6a-2c3668f5b20b.eot?#iefix");
    src:url("../fonts/f95f9fc2-ffda-431c-9d6a-2c3668f5b20b.eot?#iefix") format("eot"),url("../fonts/5b1fbd62-45dc-4433-a7df-a2b24a146411.woff2") format("woff2"),url("../fonts/050b1948-f226-4d20-a65a-15d8ed031222.woff") format("woff"),url("../fonts/beb88be6-2a60-46fe-914f-6892b3ae46ce.ttf") format("truetype"),url("../fonts/e5567978-93ef-4de1-804d-1f0e3654a014.svg#e5567978-93ef-4de1-804d-1f0e3654a014") format("svg");
}

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center, main,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video, button, input, textarea {
    display: block;
    position: relative;
	margin: 0;
	padding: 0;
	border: 0;
	vertical-align: baseline;
    box-sizing: border-box;
    font-weight: 300;
    font-style: normal;
    border-radius: 0px;
    -webkit-margin-before: 0px;
	-webkit-margin-after: 0px;
	-webkit-margin-start: 0px;
	-webkit-margin-end: 0px;
	-webkit-padding-start: 0px;
}
/* HTML5 display-role reset for older browsers */
body {
    font-family: "Helvetica Neue LT W01_41488878", Helvetica, Arial, sans-serif;
	line-height: 1.5;
    -webkit-font-smoothing: antialiased;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
button, input[type="submit"], input[type="reset"] {
    background: none;
    color: inherit;
    font: inherit;
    cursor: pointer;
    outline: inherit;
    box-shadow: none;
    border-radius: 0;
    -webkit-appearance: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

html, body, #wrap {
    width: 100%;
}
#wrap {
    padding-top: 80px;
}
body.index #wrap {
    padding-top: 0;
}
::-webkit-scrollbar {
    width: 0px;
    background: transparent;
}

/* FONT ASSIGNMENT */
.item-article-title, .item-title h2, .award-heading, .person-position,
.instagram-header h4, .instagram-header h5,
.awards-for-project-list h3, #prev-next-item h5 {
    font-family: "Helvetica Neue LT W01_41488878", Helvetica, Arial, sans-serif;
}
h1, h2, h3, h4, h5, h6, .text-content strong {
    font-family: "Helvetica Neue LT W01_65 Md", Helvetica, Arial, sans-serif;
}
body, h1, h2, h3, h4, h5, h6, .item-title h2, .item-title div, .item-date,
#footer a, .footer-address, .footer-credits > p.column,
body.phone .practice-article {
    font-size: 14px;
}
.item-article-title, .award-heading, .project-name {
    font-size: 22px;
}
.text-content em, .text-content i, .text-content blockquote,
.text-content blockquote * {
    font-style: italic;
}
.text-content sup,  .text-content sub {
    font-size: smaller;
}

/* RESPONSIVE GRID */
.row, .fl-row, .column {
	position: relative;
	overflow: hidden;
}
.row, .fl-row, .fl-row .column {
    display: block;
}
.row {
    font-size: 0;
}
.row .column {
    display: inline-block;
    vertical-align: top;
    font-size: 1rem;
}
.row, .fl-row {
	width: 100%;
}
.row-min-ht {
	min-height:100vh;
}
.fl-left, .fl-row, .fl-row .column {
    float: left;
}
.fl-right, .fl-row .column.fl-right {
    float: right;
}
.column.fixed-column-right {
	position:fixed;
	left:50%;
	top:80px;
	height:calc(100% - 80px);
	width:calc(50% - 80px);
	overflow:hidden;
}
.col-sm-1 {
	width: 100%;
}
.col-sm-2-3 {
    width: 66.666666%;
}
.col-sm-1-2 {
	width: 50%;
}
.col-sm-1-3 {
	width: 33.333333%;
}
.col-sm-1-4 {
	width: 25%;
}
@media all and (max-width: 420px) {
    .column.col-xs-1 {
        width: 100%;
    }
}
@media all and (min-width: 560px) {
	.col-md-1-2 {
		width: 50%;
	}
	.col-md-1-4 {
		width: 25%;
	}
    .col-md-1-6 {
        width: 16.666666%;
    }
}
@media all and (min-width: 1024px) {
	.col-lg-1-2 {
		width: 50%;
	}
    .col-lg-1-3 {
		width: 33.333333%;
	}
	.col-lg-1-4 {
		width: 25%;
	}
    .col-lg-1-6 {
		width: 16.666666%;
	}
    .col-lg-1-12 {
        width: 8.333333%;
    }
}
@media all and (min-width: 1600px) {
	.col-xl-1-6 {
		width: 16.666666%;
	}
    .col-xl-1-12 {
        width: 8.333333%;
    }
}


/* GENERAL */
#loading {
    position: fixed;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    background-color: #ffffff;
    z-index: 1000;
    background-image: url(../img/loading.gif);
    background-repeat: no-repeat;
    background-position: center;
    background-attachment: local;
    -webkit-background-size: auto 81px;
    -moz-background-size: auto 81px;
    -o-background-size: auto 81px;
    background-size: auto 81px;
}
body.phone #loading {
    -webkit-background-size: auto 46px;
    -moz-background-size: auto 46px;
    -o-background-size: auto 46px;
    background-size: auto 46px;
}
.hidden {
    display: none;
}
.clear {
    clear: both;
}
.xy-centred, .x-centred, .y-centred, .parent-cover-abs, .tint {
    position: absolute;
}
.xy-centred {
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}
.x-centred {
    left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
}
.y-centred {
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}
.xy-overflow-hidden {
    overflow: hidden;
}
.parent-cover-abs {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.tint {
    background-color: rgba(0,0,0,0.75);
}
.fade {
    -webkit-transition: opacity 500ms linear;
    -moz-transition: opacity 500ms linear;
    -o-transition: opacity 500ms linear;
    -ms-transition: opacity 500ms linear;
    transition: opacity 500ms linear;
}
a .tint {
    opacity: 0;
}
a:hover .tint, a:active .tint {
    opacity: 1;
}
a {
    text-decoration: none;
}
.black-txt, body, .menu-item a, .cat-menu-link, .footer-top a:not(.footer-email) {
    color: #333333;
}
.white-txt {
    color: #ffffff;
}
.grey-txt, a, a:hover, a:active, .footer-top a:hover, .footer-top a:active,
.list-item-link:hover .item-title *, .list-item-link:active .item-title *,
.uniform-list-item a:hover .item-info *, .uniform-list-item a:hover .item-info *,
#prev-next-item a:hover .pn-text, #prev-next-item a:active .pn-text,
#mobile-menu .menu-item a.current, #mobile-category-menu .cat-menu-link.current,
#mobile-category-menu.show-menu #category-filter .cat-menu-link {
    color: #999999;
}
.rel-fw {
    position: relative;
    width: 100%;
}
.centre-column {
    display: block;
    width: 100%;
    padding: 0;
}
body.computer .centre-column, body.tablet .centre-column {
    padding-left: 72px;
    padding-right: 72px;
}
body.phone .centre-column {
    padding-left: 8px;
    padding-right: 8px;
}
.grid-item, .centre-column > .column {
    padding: 8px;
    min-height: 80px;
}
body.computer #project-grid, body.tablet #project-grid,
body.computer #item-grid, body.tablet #item-grid,
body.computer .item-container.centre-column, body.tablet .item-container.centre-column {
    padding-top: 40px;
}
body.index.computer #project-grid, body.index.tablet #project-grid {
    padding-top: 80px;
}
#mobile-category-menu ~ #project-grid {
    padding-top: 8px;
}
.scroll-container {
    position: relative;
    overflow-y: scroll;
}
body.no-page-scroll {
    overflow: hidden;
    max-height: 100vh;
}
.btn-bg {
    background-repeat: no-repeat;
    background-position: center;
    background-attachment: local;
    -webkit-background-size: 14px;
    -moz-background-size: 14px;
    -o-background-size: 14px;
    background-size: 14px;
}

/* HEADER, MAIN MENU and OTHER MENUS */
#header {
    position: fixed;
    top: 0;
    left: 0;
    height: 80px;
    width: 100%;
    z-index: 100;
    background-color: rgba(255,255,255,0.96);
}
#nav, #menu, #category-menu, #toggle-mobile-menu {
    position: relative;
}
.mobile-logo img {
    height: 14px;
}
#nav {
    height: 80px;
    padding: 32px 0 0 80px;
}
#mobile-nav {
    display: none;
    position: fixed;
    width: 100%;
    padding: 0px;
    background-color: #ffffff;
    z-index: 99;
    top: 80px;
    height: calc(100% - 80px);
}
#menu, #toggle-mobile-menu {
    height: 40px;
}
#toggle-mobile-menu {
    width: 46px;
    margin-top: 20px;
}
#toggle-mobile-menu.show-menu {
    background-image: url(../img/menu-show.png);
}
#toggle-mobile-menu.hide-menu {
    background-image: url(../img/menu-hide.png);
}
#category-menu {
    width: 50%;
    z-index: 101;
}
body.index #category-menu {
    display: none;
}
body.index #mobile-category-menu {
    visibility: hidden;
}
#mobile-category-menu, #mobile-category-menu li, #practice-article-nav.pa-nav-mobile {
    background-color: #f9f9f9;
}
#mobile-category-menu:not(.show-menu) li:not(#category-filter) {
    position: absolute;
    top: 0;
    width: 100%;
}
#mobile-category-menu.show-menu li {
    position: relative;
}
#category-filter {
    z-index: 1;
}
.right-fixed-menu {
    position: fixed;
    width: 50%;
    right: 0;
    top: 32px;
    z-index: 101;
}
body.computer .menu-item, body.tablet .menu-item {
    float: left;
    margin-right: 20px;
}
.menu-item a, .cat-menu-link {
    padding: 8px 0;
    height: 40px;
    text-decoration: none;
}
.menu-item a.current, .cat-menu-link.current {
    border-bottom: 1px solid #333333;
}
#mobile-menu .menu-item a.current, #mobile-category-menu .cat-menu-link.current {
    border-bottom-style: none;
}
#mobile-menu .menu-item {
    width: 100%;
}
#mobile-menu .menu-item a, #mobile-category-menu .cat-menu-link {
    display: inline-block;
}
#mobile-menu .menu-item a, body.phone #mobile-category-menu .cat-menu-link,
body.phone .practice-menu-item {
    margin-left: 16px;
}
body.tablet #mobile-category-menu .cat-menu-link, body.tablet .practice-menu-item:first-child {
    margin-left: 80px;
}

/* index menu */
.menu-viewport-offset #header {
    position: absolute;
    top: 100vh;
}
.menu-viewport-offset #mobile-nav {
    position: absolute;
    top: calc(100vh + 40px);
    height: calc(100vh - 40px);
}

/* scroll action */
.thin-header #header, .thin-header #nav {
    height: 40px;
}
.thin-header #toggle-mobile-menu {
    margin-top: 0px;
}
.thin-header #nav {
    padding-top: 0px;
}
.thin-header .right-fixed-menu {
    top: 0px;
}
.thin-header:not(.menu-viewport-offset) #mobile-nav {
    position: fixed;
    top: 40px;
    height: calc(100vh - 40px);
}
.thin-header .column.fixed-column-right {
	height:calc(100vh - 40px);
}
.fixed-column-right .scroll-container {
	height:calc(100vh - 96px);
	padding-bottom:8px;
}
.thin-header .fixed-column-right .scroll-container {
	height:calc(100vh - 56px);
}
.fixed-column-right .scroll-container #main-content {
    padding-bottom: 120px;
}

/* FOOTER */
body.computer .above-footer, body.tablet .above-footer,
body.computer #footer .footer-top, body.tablet #footer .footer-top {
    padding-top: 72px;
    padding-bottom: 72px;
}
body.phone .above-footer, body.phone #footer .footer-top {
    padding-top: 16px;
    padding-bottom: 16px;
}
#footer .column {
    min-height: auto;
}
.footer-address {
    margin-top: -16px;
}
.footer-address p {
    margin: 16px 0;
}
body.computer .above-footer, body.tablet .above-footer {
    min-height: 150px;
}
.above-footer, body.projects #footer, body.items #footer,
body.page #footer, body.error404 #footer, body.item #footer {
    background-color: #f9f9f9;
}
body.computer .above-footer, body.tablet .above-footer,
body.projects.computer #footer, body.projects.tablet #footer,
body.items.computer #footer, body.items.tablet #footer,
body.page.computer #footer, body.page.tablet #footer {
    margin-top: 72px;
}
body.item.computer #footer, body.item.tablet #footer {
    margin-top: 56px;
}
body.phone .above-footer,
body.projects.phone #footer,
body.items.phone #footer,
body.page.phone #footer {
    margin-top: 8px;
}
.footer-address > p:last-child {
    margin-bottom: 0;
}
.footer-tel, .footer-email, .footer-credits a {
    display: inline-block;
    vertical-align: top;
}
.footer-credits {
    border-top: 1px solid #eeeeee;
}

/* HOMEPAGE */
.hp-slideshow-container {
    padding: 80px;
    width: 100%;
}
body.phone .hp-slideshow-container {
    padding:16px;
}
#hp-slideshow {
    position: relative;
    height: calc(100vh - 160px);
    width: 100%;
}
#hp-slideshow, .hp-slide {
    background-color: #000000;
}
body.phone #hp-slideshow {
    height: calc(100vh - 32px);
}
#hp-interactive-logo {
    z-index: 10;
    white-space: nowrap;
    width: auto;
}
.hp-ilogo-char {
    display: inline-block;
    position: relative;
    opacity: 1;
}
.hp-ilogo-char:hover, .hp-ilogo-char:focus {
    opacity: 0.5;
}
.hp-ilogo-char img {
    height: 80px;
}
body.phone .hp-ilogo-char img {
    height: 46px;
}
.hp-tint {
    z-index: 5;
    background-color: rgba(0,0,0,0.1);
}

/* homepage - instagram */
.instagram-header, .ig-link-container {
    padding: 8px;
}
.ig-link {
    padding-bottom: 100%;
}
.ig-link .img-landscape, .ig-link .vid-landscape {
    width: auto;
    height: 100%;
}
.ig-link .img-portrait, .ig-link .vid-portrait {
    width: 100%;
    height: auto;
}
.ig-link .img-square, .ig-link .vid-square {
    width: 100%;
    height: 100%;
}

/* ITEM and PAGE STYLES */
.item-image {
    margin-bottom: 16px;
}
body.computer .item-article > header, body.tablet .item-article > header,
body.computer .page-article > header, body.tablet .page-article > header,
.text-container {
    margin-bottom: 32px;
}
body.phone .item-article > header, body.phone .page-article > header {
    margin-bottom: 10px;
}
.text-content p {
    margin: 16px 0;
}
.text-content a, .text-content strong, .text-content b,
.text-content em, .text-content i, .text-content u,
.text-content sup,  .text-content sub,
.award-title, .award-heading, .award-heading a {
    display: inline;
}
.text-content sup {
    vertical-align: super;
}
.text-content sub {
    vertical-align: sub;
}
.text-content ul, .text-content ol {
    list-style-position: inside;
}
.text-content ul ul, .text-content ol ol,
.text-content ul ol, .text-content ol ul {
    padding-left: 16px;
}
.text-content ul li, .text-content ol li {
    display: list-item;
}
.text-content ul {
    list-style-type: disc;
}
.text-content ul ul {
    list-style-type: circle;
}
.text-content ul ul ul {
    list-style-type: square;
}
.text-content ol {
    list-style-type: decimal;
}
.text-content ol ol {
    list-style-type: lower-alpha;
}
.text-content ol ol ol {
    list-style-type: lower-roman;
}
.text-content blockquote {
    padding-left: 16px;
}
.text-content blockquote::before {
    position: absolute;
    font-size: 40px;
    left: -6px;
    top: -11px;
    content: '\201C';
}
.awards-for-project-list > li:not(:first-child) {
    margin-top: 16px
}
body.computer #prev-next-item a, body.tablet #prev-next-item a {
    width: 200px;
}
body.phone #prev-next-item a {
    width: 120px;
}
h5.pn-text {
    margin-bottom: 16px;
    white-space: nowrap;
}
#prev-item {
    text-align: left;
    padding-left: 8px;
}
#next-item {
    text-align: right;
    padding-right: 8px;
}
#next-item h5.pn-text {
    direction: rtl;
}
.nav-img-container{
    width: 100%;
    padding-bottom: 56.25%;
}
#main-content {
    width: 100%;
}
.scroll-container {
    width: 100%;
    padding-left: 64px;
}
@media all and (min-width:1920px){
    .scroll-container {
        width: 50%;
        padding-right: 80px;
    }
}
.item-page-img-link {
    z-index: 50;
}
.img-link-icon {
    display: block;
    position: absolute;
    top: 24px;
    right: 24px;
    height: 40px;
    width: 40px;
    background-color: #000000;
    background-image: url(../img/link-icon.png);
    background-repeat: no-repeat;
    background-position: center;
    background-attachment: local;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    opacity: 1;
}
.item-page-img-link:hover .img-link-icon, .item-page-img-link:active .img-link-icon {
    opacity: 0.65;
}

/* items gallery */
#gallery, #gallery-item-list, .gallery-item {
    top: 0;
    left: 0;
    width: 100%;
    background-color: #ffffff;
    z-index: 200;
}
#gallery {
    position: fixed;
    height: 100%;
}
#gallery-item-list, .gallery-item {
    position: absolute;
    height: 100%;
}
#gallery-close, #gallery-navigation {
    cursor: pointer;
    text-align: center;
    z-index: 210;
}
#gallery-close {
    height: 40px;
    width: 40px;
    background-color: rgba(255,255,255,0.5);
    background-image: url(../img/menu-hide.png);
    z-index: 300;
}
body.phone #gallery-close {
    top: 0;
}
body.computer #gallery-close, body.tablet #gallery-close {
    top: 20px;
}
.gallery-navigator {
    position: absolute;
    font-size: 0px;
    height: 100%;
    width: 50%;
    top: 0;
}
.gallery-navigator.invis {
    visibility: hidden;
    cursor: default;
}
#gallery-prev {
    left: 0;
}
#gallery-next {
    right: 0;
}

/* project item */
#hide-text{
    position: relative;
    margin-bottom: 28px;
    width: 72px;
    cursor: pointer;
}
.text-description, .text-hidden .text-close {
    display: none;
}
.text-hidden .text-description {
    display: block;
}

/* ARTICLE, AWARD, PROJECT GRID STYLES */
#item-grid.grid > ul > .uniform-list-item {
    display: none;
}
#item-grid.list > ul > .uniform-grid-item {
    display: none;
}
.toggle-title-container {
    padding-left: 16px;
    padding-right: 16px;
}
.toggle-title-container h2 {
    display: inline-block;
    vertical-align: middle;
}
.toggle-title-container #toggle-grid-list {
    float: right;
    width: 14px;
    height: 36px;
}
body.computer #toggle-grid-list, body.tablet #toggle-grid-list {
    position: fixed;
    top: 32px;
    width: 30px;
    height: 40px;
    z-index: 100;
}
body.computer #toggle-grid-list {
    left: 50%;
}
body.tablet #toggle-grid-list {
    right:72px;
}
body.computer .thin-header #toggle-grid-list,
body.tablet .thin-header #toggle-grid-list {
    top: 0px;
}
#toggle-grid-list.grid {
    background-image: url(../img/toggle-list.png);
}
#toggle-grid-list.grid:hover, #toggle-grid-list.grid:active {
    background-image: url(../img/toggle-list-hover.png);
}
#toggle-grid-list.list {
    background-image: url(../img/toggle-grid.png);
}
#toggle-grid-list.list:hover, #toggle-grid-list.list:active {
    background-image: url(../img/toggle-grid-hover.png);
}
.project-grid-link, .list-item-image {
	display: block;
	position: relative;
	width: 100%;
}

.project-grid-link .project-name, .uniform-grid-link .press-article-name {
    left: 16px;
    opacity: 0;
    max-width: calc(100% - 32px);
}
.project-grid-link:hover .project-name, .project-grid-link:active .project-name,
.uniform-grid-link:hover .press-article-name, .uniform-grid-link:active .press-article-name {
    opacity: 1;
}
.project-grid-link, .grid-img-container, .press-img-text {
    background-color: #cccccc;
}
.item-info {
    margin: 16px 0 24px;
}

/* PROJECTS GRID */
body.projects.computer #wrap {
    padding-top: 32px;
}
.project-grid-link {
    padding-bottom: 56.25%;
}
#category-menu li {
    float: left;
    margin:0 8px;
}

@media all and (min-width: 1024px) {
    .project-grid-item.col-lg-1-2 .project-grid-link {
        padding-bottom: calc(56.25% + 8px);
    }
}

/* ARTICLES and AWARDS GRID */
.list-item-image {
    padding-bottom: 56.25%;
}
.grid-img-container {
    padding-bottom: 90%;
}
.press-img-text, body.press .list-item-image {
    padding-bottom: 130%;
}

/* ARTICLE, AWARD, PROJECT LIST STYLES */
#item-grid .list-item > a.row > .column {
    padding: 8px;
}
#item-grid .list-item .item-info {
    margin: 0;
}
#item-grid[data-type="awards"] .item-title h2,
#item-grid[data-type="awards"] .item-title div {
    display: inline;
}

/* PRACTICE PAGE */
body.computer #practice-article-nav {
    padding-left: 72px;
    z-index: 110;
}
#practice-article-nav li {
    float: left;
}
#main-content > .practice-article:not(.selected),
#practice-images-column > .practice-images:not(.selected) {
    display: none;
}

/* PEOPLE SECTION */
.person-profile {
    margin: 32px 0;
}
.person-position {
    margin:0 0 24px;
}

body.page.contact #footer {
    display: none;
}

/* 404 Page */
.hp-link-404 {
    margin-top: 32px;
}
.column-404 {
    height: 70vh;
}