html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}
body{margin:0}
article,aside,details,figcaption,figure,footer,header,main,menu,nav,section{display:block}summary{display:list-item}
html,body{font-family:"open sans";font-weight: 300;font-size:16px;line-height:1.6}html{overflow-x:hidden}
h1,h2,h3,h4,h5,h6{font-family:raleway;font-weight:400;margin:1em 0;}
h1{font-size:22px}h2{font-size:18px;text-transform: uppercase;border-left: 4px solid black;padding-left: 1em;}h3{font-size:16px;text-transform: capitalize;}h4{font-size:16px;text-transform: capitalize;}h5{font-size:16px}h6{font-size:16px}
@media (min-width:768px){h1{font-size:22px}h2{font-size:20px}h3{font-size:18px}h4{font-size:16px}h5{font-size:16px}h6{font-size:16px}}
@media (min-width:992px){h1{font-size:28px}h2{font-size:24px}h3{font-size:20px}h4{font-size:18px}h5{font-size:16px}h6{font-size:16px}}
@media (min-width:1600px){h1{font-size:36px}h2{font-size:30px}h3{font-size:24px}h4{font-size:20px}h5{font-size:18px}h6{font-size:16px}}
img{vertical-align:middle;width: 100%; height: auto; object-fit: contain;}
a{text-decoration: none;font-family: raleway;color: black;}
p > a {font-family: "open sans";font-weight:  bold;text-decoration:underline;}
button{border: none;font-size: 1em;font-family: raleway; font-weight:normal;align-items: center;padding-left: 1.25em;padding-right: 1.25em;}
ul { list-style-type: none;padding: 0}
li {padding-top: 0.5em;padding-bottom: 0.5em;}
hr {display: block; margin: 0 1em 0 1em;color: white;height: 1px;border: 0;border-top: 1px solid grey;}
/* responsive */
.responsive{display:block;overflow-x:auto}
.container:after,.container:before,.row:after,.row:before,.row-padding:after,.row-padding:before,
.cell-row:before,.cell-row:after,.clear:after,.clear:before{content:"";display:table;clear:both}
.col{float:left;width:100%}
.col.s1{width:8.33333%}.col.s2{width:16.66666%}.col.s3{width:24.99999%}.col.s4{width:33.33333%}
.col.s5{width:41.66666%}.col.s6{width:49.99999%}.col.s7{width:58.33333%}.col.s8{width:66.66666%}
.col.s9{width:74.99999%}.col.s10{width:83.33333%}.col.s11{width:91.66666%}.col.s12{width:99.99999%}
@media (min-width:768px){.col.m1{width:8.33333%}.col.m2{width:16.66666%}.col.m3{width:24.99999%}.col.m4{width:33.33333%}
.col.m5{width:41.66666%}.col.m6{width:49.99999%}.col.m7{width:58.33333%}.col.m8{width:66.66666%}
.col.m9{width:74.99999%}.col.m10{width:83.33333%}.col.m11{width:91.66666%}.col.m12{width:99.99999%}}
@media (min-width:992px){.col.l1{width:8.33333%}.col.l2{width:16.66666%}.col.l3{width:24.99999%}.col.l4{width:33.33333%}
.col.l5{width:41.66666%}.col.l6{width:49.99999%}.col.l7{width:58.33333%}.col.l8{width:66.66666%}
.col.l9{width:74.99999%}.col.l10{width:83.33333%}.col.l11{width:91.66666%}.col.l12{width:99.99999%}}
.rest{overflow:hidden}.stretch{margin-left:-16px;margin-right:-16px}
.content,.auto{margin-left:auto;margin-right:auto}.content{max-width:980px}.auto{max-width:1140px}
.hide{display:none!important}.show-block,.show{display:block!important}.show-inline-block{display:inline-block!important}
@media (max-width:1205px){.auto{max-width:95%}}
/* main background */
#main {margin:0;padding:0;background: linear-gradient(-45deg, #FFD6C9, #FFC0D9, #C0EEFF, #C6FFF1);background-size: 400% 1200%;animation: gradient 15s ease infinite;}
@keyframes gradient {0% {background-position: 0% 50%;} 50% {background-position: 100% 50%;} 100% {background-position: 0% 50%;}}
/* message */
.message {margin-top: 4em;padding-top: 35vh;padding-bottom: 35vh;display: block;text-align: center;width: 100%;}
/* text style */
.cap {text-transform: capitalize;}
.upper {text-transform: uppercase;}
.bold {font-weight: bold;}
.textwhite {background-color:rgba(0,0,0,0.7);color: white;}
blockquote {font-size: 1.25em;border-left: 1px solid black;padding-left: 1em;}
/* navbar */
#logo {height: 4em;left: 50%;position: absolute;margin-left: -3em;}
@media (min-width:992px){#logo{position: static;margin-left: 0em;margin-right: 0em;padding-left: 2em;padding-right: 2em;float: left;}}
#logosvg {width: 4em;height: 4em;}
.navbar {top: 0;width: 100%;position: fixed;z-index: 1;transition: opacity 0.5s ease, background 0.5s ease;}
.bborder {box-shadow: 0 1px;}
.allborder {border: 1px solid #e1e2e4;}
.navhidden {display: none;}
@media (min-width: 992px){.navhidden {display: block;}}
.navbar button {background-color: transparent;height: 4em;text-transform: uppercase;}
.navbar button:hover {background-color: rgba(0,0,0,0.05);}
#projectnav {background-color: white;}
/* icon */
.icon {vertical-align: middle;}
/* menu */
#menubtn {float: left;background-color: transparent;height: 4em;}
#closebtn {background-color: transparent;height: 4em;float: left;}
@media (min-width:992px){#menubtn {display: none;}}
.sidepanel {height: 100%;width: 80%;position: fixed;z-index: 3;top: 0;left: -100%;background-color: black;overflow-x: hidden;transition: 0.2s ease;}
.sidepanel h2 {color: white; text-transform: uppercase;font-size: 18px;}
.sidepanel a {color: white;display: block;height: 2em;text-transform: capitalize;font-family: "open sans";}
#menutop {top: 0;width: 100%;height: 4em;position: sticky;background-color: black;}
#backbtn {color: white;text-transform: uppercase;float: right;}
#overlay {position: fixed;display: none;width: 100%;height: 100%;top: 0;left: 0;right: 0;bottom: 0;background-color: rgba(0, 0, 0, 0.5);z-index: 1;transition: 0.2s ease;}
/* dropdown */
.dropdown {float: left;overflow: hidden;}
.dropdown-content {display: none;position: absolute;top: 4em;background-color: white;min-width: 160px;box-shadow: 0 0 3em rgba(0, 0, 0, 0.3);z-index: 2;}
.dropdown-content a {font-family:  "open sans";float: none;color: black;padding: 12px 16px;text-decoration: none;display: block;text-align: left;text-transform: capitalize;}
.dropdown-content > div	{margin: 1em 0 1em 0;}
.dropdown-content a:hover {background-color: rgba(0,0,0,0.05);}
.dropdown:hover .dropdown-content {display: block;}
.dropdown > a{float:  left;text-align: center;top: 50%;padding: 1.3125em 1em;height: 4em;}
/* button */
#totop {display: none;position: fixed;bottom: 1em;right: 1em;z-index: 99;height: 4em;width: 4em;color: white;background-color: rgba(0,0,0,0.7);}
@media (min-width:768px){#totop {bottom: 2em;right: 2em;}}
@media (min-width:992px){#totop {bottom: 4em;right: 4em;}}
#totop:hover {background-color: black;}
/* banner */
.ontop {position: absolute;}
.banner {position: relative;}
.respbanner{height: 80vh;}
@media (min-width:768px){.respbanner {height: 60vh;}}
@media (min-width:992px){.respbanner {height: 70vh;}}
@media (min-width:1600px){.respbanner {height: 60vh;}}
/* banner opacity change */
@media (min-width:992px){.banneranima {opacity: 0.3;transition: opacity 0.5s ease;}}
.banner:hover .title,.banner:hover {opacity: 1;}
.banner h1 {text-transform: capitalize;}
.banner h1, .banner h2, .banner h4 {margin: 0;}
/* title */
.title {display: inline-block;max-width: 80vw;padding: 1em;}
@media (min-width:768px){.title {max-width: 70vw;padding: 1em 2em 1em 2em;}}
@media (min-width:992px){.title {max-width: 40vw;padding: 1em 2em 1em 2em;}.titleanima {opacity: 0;transition: opacity 0.5s ease;transition: background-color 0.5s ease;}}
.title h2 {text-transform: uppercase;margin: 0;}
.title h3 {margin: 0;}
.title:hover {background-color: black;}
/* section header */
.sectionheader {top: 10%;background-color: white;max-width: 80%;}
.bggrey {background: #fafafa;}
/* footer */
#footer a {font-family:"open sans";font-size: 16px;line-height:1.6;text-transform: capitalize;}
#footer p{margin: 0;font-size: 16px;}
#footer h3{text-transform: uppercase;font-weight: bold;padding-bottom: 0.5em;border-bottom: 1px solid black;}
#footer h4{text-transform: uppercase;}
#contactlist {margin: 0;}
#contactlist .icon {display: inline;}
#contactlist .col {padding-top: 0.5em; padding-bottom: 0.5em;}
#contactlist h4 {padding-top: 1em;}
#contactlist p, #contactlist a {display: inline;margin-left: 1em;text-transform: uppercase;}
 #contactlist a { text-decoration: underline;}
 #contactlist a:hover {background-color: rgba(0,0,0,0.05);}
/* colour and shadow */
.l1shadow {box-shadow:  0 0 3em rgba(0, 0, 0, 0.3);}
.l2shadow {box-shadow: 0 0 3em rgba(0,0,0,0.05)}
/* images */
.col > img{width: 100%;}
.fullwidth {object-fit: cover;object-position: right 50%;}.fullwidth.l{object-fit: cover;object-position: left 50%;}.fullwidth.c{object-fit: cover;object-position: 50% 50%;}
.galleryimg {object-fit: cover;padding: 0.5em;}
.multiblend {mix-blend-mode: multiply;}

/* size */
.mx.wh1 {max-width: 18em;max-height: 18em;}.mx.wh2{max-width: 18em;max-height: 18em;}.mx.wh3{max-width: 25em;max-height: 25em;}.mx.w{max-width: 31em;}.mx.h{max-height: 15em;}
@media (min-width:768px){.mx.wh1{max-width: 22em;max-height: 22em;}.mx.wh2{max-width: 26em;max-height: 26em;}.mx.wh3{max-width: 38em;max-height: 38em;}}
@media (min-width:992px){.mx.wh1{max-width: 26em;max-height: 26em;}.mx.wh2{max-width: 32em;max-height: 32em;}.mx.wh3{max-width: 50em;max-height: 50em;}}
@media (min-width:1600px){.mx.wh1{max-width: 28em;max-height: 28em;}.mx.wh2{max-width: 38em;max-height: 38em;}.mx.wh3{max-width: 60em;max-height: 60em;}}
.min.h1 {min-height: 10em;}.min.h2 {min-height: 15em;}
@media (min-width:768px){.min.h1 {/* min-height: 15em; */}.min.h2 {min-height: 20em;}}
@media (min-width:992px){.min.h1 {min-height: 20em;}.min.h2 {min-height: 25em;}}
@media (min-width:1600px){.min.h1 {min-height: 30em;}.min.h2 {min-height: 40em;}}
/* alignment and spacing */
.h.middle {top: 50%;transform:  translate(0,-50%);}.h.resp {top: 0}
@media (min-width:992px){.h.resp {top: 50%;transform:  translate(0%,-50%);}}
.hspace.s{height: 1em;}.hspace.m {height: 4em;}.hspace.l {height: 4em;}
.centeritem {display: flex;/* align-items: center; */align-content: center;}.centeritem.w{justify-content: center;}.centeritem.h {align-items: center;}
.toright {float: right;}
.spacing.t05{padding-top: 0.5em;}.spacing.t1{padding-top: 1em;}.spacing.t2{padding-top: 2em;}.spacing.b05{padding-bottom: 0.5em;}.spacing.b1{padding-bottom: 1em;}.spacing.b2{padding-bottom: 2em;}.spacing.tb05{padding-top: 0.5em;padding-bottom: 0.5em;}.spacing.tb1{padding-top: 1em;padding-bottom: 1em;}.spacing.tb2{padding-top: 2em;padding-bottom: 2em;}.spacing.l05{padding-left: 0.5em;}.spacing.l1{padding-left: 1em;}.spacing.l2{padding-left: 2em;}.spacing.r05{padding-right: 0.5em;}.spacing.r1{padding-right: 1em;}.spacing.r2{padding-right: 2em;}.spacing.lr05{padding-left: 0.5em;padding-right: 0.5em;}.spacing.lr1{padding-left: 1em;padding-right: 1em;}.spacing.lr2{padding-left: 2em;padding-right: 2em;}
@media (min-width:768px){.spacing.t05{padding-top: 1em;}.spacing.t1{padding-top: 2em;}.spacing.t2{padding-top: 4em;}.spacing.b05{padding-bottom: 1em;}.spacing.b1{padding-bottom: 2em;}.spacing.b2{padding-bottom: 4em;}.spacing.tb05{padding-top: 1em;padding-bottom: 1em;}.spacing.tb1{padding-top: 2em;padding-bottom: 2em;}.spacing.tb2{padding-top: 4em;padding-bottom: 4em;}.spacing.l05{padding-left: 1em;}.spacing.l1{padding-left: 2em;}.spacing.l2{padding-left: 4em;}spacing.r05{padding-right: 1em;}.spacing.r1{padding-right: 2em;}.spacing.r2{padding-right: 4em;}.spacing.lr05{padding-left: 1em;padding-right: 1em;}.spacing.lr1{padding-left: 2em;padding-right: 2em;}.spacing.lr2{padding-left: 4em;padding-right: 4em;}}
@media (min-width:992px){.spacing.t05{padding-top: 1.5em;}.spacing.t1{padding-top: 3em;}.spacing.t2{padding-top: 6em;}.spacing.b05{padding-bottom: 1.5em;}.spacing.b1{padding-bottom: 3em;}.spacing.b2{padding-bottom: 6em;}.spacing.tb05{padding-top: 1.5em;padding-bottom: 1.5em;}.spacing.tb1{padding-top: 3em;padding-bottom: 3em;}.spacing.tb2{padding-top: 6em;padding-bottom: 6em;}.spacing.l05{padding-left: 2em;}.spacing.l1{padding-left: 4em;}.spacing.l2{padding-left: 8em;}spacing.r05{padding-right: 2em;}.spacing.r1{padding-right: 4em;}.spacing.r2{padding-right: 8em;}.spacing.lr05{padding-left: 2em;padding-right: 2em;}.spacing.lr1{padding-left: 4em;padding-right: 4em;}.spacing.lr2{padding-left: 8em;padding-right: 8em;}}
@media (min-width:1600px){.spacing.t05{padding-top: 2em;}.spacing.t1{padding-top: 4em;}.spacing.t2{padding-top: 8em;}.spacing.b05{padding-bottom: 2em;}.spacing.b1{padding-bottom: 4em;}.spacing.b2{padding-bottom: 8em;}.spacing.tb05{padding-top: 2em;padding-bottom: 2em;}.spacing.tb1{padding-top: 4em;padding-bottom: 4em;}.spacing.tb2{padding-top: 8em;padding-bottom: 8em;}.spacing.l05{padding-left: 3em;}.spacing.l1{padding-left: 6em;}.spacing.l2{padding-left: 12em;}spacing.r05{padding-right: 3em;}.spacing.r1{padding-right: 6em;}.spacing.r2{padding-right: 12em;}.spacing.lr05{padding-left: 3em;padding-right: 3em;}.spacing.lr1{padding-left: 6em;padding-right: 6em;}.spacing.lr2{padding-left: 12em;padding-right: 12em;}}