/**
 * Content
 */
/*
@media only screen and (max-width: 480px) {
.paragraphIntro h2{
    font-size: 2.0rem !important;
   	line-height: 150% !important;
}
}
 */

.littleSpace{
	margin-top: 2rem;
}

@media only screen and (min-width: 1284px) {
.teachingHeight{
	height: 330px;
}

.teachingInside{
	height: 95%;
	display: flex;
	justify-content: space-between;
	
}
.teachingText{
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	height: 100%;
	padding-right: 1.2rem;
    }
.hundredHeight{
	 height: 100%;
}



}

@media only screen and (min-width: 728px) {
.logoPadding{
padding-right:8rem; 
padding-left:8rem;
    }
}

/* CAROUSEL*/
/* carousel */
@media only screen and (max-width: 728px) {
.addSpaceMobile{
    margin-bottom: 3rem;
}
}

@media only screen and (max-width: 728px) {
.addSpaceMobile-above{
    margin-top: 8rem;
}
}

@media only screen and (max-width: 728px) {
.removeSpaceMobile{
	margin-bottom: -5rem;
}
}

@media only screen and (min-width: 728px) {
.removeSpaceDesktop{
	margin-top: -5rem;
}
}

@media only screen and (min-width: 728px) {
.addDesktopSpace{
	margin-top: 7.5rem;
}
}


@media only screen and (max-width: 728px) {
.leftOnMobile{
	text-align: left;
}
}
@media only screen and (min-width: 728px) {
.leftOnMobile{
	text-align: right;
}
}


.fullWidthProject{
}


.label{
	font-size: 1.2rem;

    line-height: 1.2rem;
    text-align: left;
    font-weight: 300;
}

@media only screen and (min-width: 728px) {
.carousel-inner{
	width: 100%;
	padding: 0px;
    height:60vh;
    }
}

@media only screen and (max-width: 728px) {
.carousel-inner{
	width: 100%;
	padding: 0px;
    height:812px;
    }
}

.row{
	width: 100%;
}

.carouselInner{
	
}
@media only screen and (min-width: 728px) {
.carouselContainer{
  
    padding: 4rem;
}
}
.carouselContainer{
    width: 100%;
	vertical-align: middle;
   text-align: left;
	position: relative;
 
}

@media only screen and (max-width: 728px) {

    .carouselContainer{
    width:95vw;
    }
}


.carouselArrow{
	display: inline-block;
    color: white;
    font-size: 40px;
    font-family: "DM Mono", Icons;
	font-style: normal;
	font-weight: 200;
}


#quote-carousel 
{
  padding: 0px;
  width: 100%;
	
    vertical-align: middle;
	
    
}

/* Control buttons  */
#quote-carousel .carousel-control
{
  background: none;
  color: #fff;
  font-size: 2.3em;
  text-shadow: none;
  margin-top: 30px;
    display: inline-block;
}
/* Previous button  */
#quote-carousel .carousel-control.left 
{
    display: inline-block;
    text-align: left;
}
/* Next button  */
#quote-carousel .carousel-control.right 
{
display: inline-block;
    text-align: left;
}

.controlsContainer{
    text-align: left;
	display: inline-block;
	margin-left: 8px;
    position: absolute;
    bottom: 0rem;
}
/* Changes the position of the indicators */
#quote-carousel .carousel-indicators 
{
	display: none;

}
/* Changes the color of the indicators */
#quote-carousel .carousel-indicators li 
{
  background: #c0c0c0;
}
#quote-carousel .carousel-indicators .active 
{
  background: #333333;
}

/* End carousel */

.item blockquote {
    border-left: none; 
    margin: 0px;
	
}

.item blockquote img {
    margin-bottom: 0px;
}



/* END CAROUSEL*/

.pinkOutline{
	border: solid 1px #FAA7F8;
}
@media only screen and (max-width: 728px) {
.homepageHero{
    padding-top: 10rem;
}
}

@media only screen and (max-width: 728px) {
.spaceBelow{
	margin-bottom: 4rem;
}
}

@media only screen and (max-width: 728px) {
.spaceAbove{
    padding-top: 4rem;
}
}



.navIcon{
	  -webkit-transition: 0.2s cubic-bezier(.05, .69, .14, 1);
    -moz-transition:  0.2s cubic-bezier(.05, .69, .14, 1);
    transition:  0.2s cubic-bezier(.05, .69, .14, 1);
}


.navIcon:hover{
	-webkit-transform: rotateZ(15deg);
      -moz-transform: rotateZ(15deg);
      transform: rotateZ(15deg);
}

@media only screen and (max-width: 728px) {
.twoColMobile{
	column-count: 2;
}
}

@media only screen and (min-width: 728px) {
.twoColMobile{
	column-count: 3;
}
}

@media only screen and (max-width: 728px) {
.showDesktop{
	display: none;
}
}

@media only screen and (min-width: 728px) {
.showDesktop{
	display: inherit;
}
}

@media only screen and (min-width: 728px) {
.showMobile{
	display: none;
}
}

@media only screen and (max-width: 728px) {
.showMobile{
	display: inherit;
}
}



.flexButton{
	 flex-grow: 1;
display: flex;
flex-direction: row;
justify-content: center;

}
.buttonGroup{


display: flex;
gap: 1rem;
}

.pinkText{
	font-weight: 700;
    color: magenta;
}
h3{
	font-family: 'Piazzolla';
font-style: normal;
font-weight: 300;
font-size: clamp(1.2rem,calc(var(--vw, 1vw)*100*.045),2rem); 
line-height: 120%;
/* or 34px */
}

.quoteText{
	font-family: 'Piazzolla';
font-style: normal;
font-weight: 300;
font-size: 28px;
line-height: 120%;
    color: white;
}

@media only screen and (max-width: 728px) {
.quoteText{
    font-size: 24px;
    line-height: 130%;
    }
}

@media only screen and (min-width: 728px) {
.wide-button{
    width: 30vw;
}
}


@media only screen and (max-width: 860px) {
.fixed-col-height{
    height: auto;
}
}

@media only screen and (min-width: 1200px) {
.fixed-col-height{
    height: 24rem;
}
}

@media only screen and (min-width: 1440px) {
.fixed-col-height{
    height: 20rem;
}
}

.flexible {
    flex-grow: 1;
}

.headerLink{
	color: magenta;
    font-family: 'Piazzolla';
	font-style: normal;
	font-weight: 600;
	font-size: 44px;
	line-height: 120%;
	text-decoration: none;
    border-bottom: none;
}

.descriptor { 
	font-size: 1.2rem;
}

.rightPadding{
	padding-left: 5rem;
}
.leftRight{
	justify-content: space-between;
	display: flex;
	margin-bottom: 24px;
}

.belowPadding-s{
	margin-bottom: 24px;
}

.belowPadding-lg{
	margin-bottom: 44px;
}

@media only screen and (min-width: 1440px) {
.logoCard{
	height: 36rem;
	padding-bottom: 1.5rem;
}
    .logoCardBottom{
	height: 100%;

}
    
    .imageCard{
	height: 750px;
    padding-bottom: 1.5rem;
        
       
}

.imageCardBottom{
	height: 68%;
    display: flex;
	justify-content: space-between;
    flex-direction: column;

}

    .imageCardLink{
    display: flex;
    vertical-align: bottom;
	display: inline-block;
    height: 70px;
    margin: 0 auto;
    
        
}
}



.card{
	border-radius: 3px;
	border: solid 1px #FAA7F8;
}

svg:hover{
	fill: rgba(255, 0, 255, .1);

}

.cardImage{
	width: 100%;
    height: 242px;
	background-color: lightgrey;
	padding: 16px;
	text-align: right;
	border-bottom: solid 1px #FAA7F8;
	background-size: cover;
	background-position: center;
}

.card01{
	background-image: url("https://freight.cargo.site/t/original/i/bafbfcf88fb6c92a0e0ca74d35600101bf21f6f68dd5fad4d18899f3ec9b5384/Attending-Futures.jpg");
}

.card02{
	background-image: url("https://freight.cargo.site/t/original/i/43af9fb2f61648233d0c68f187380e240250d2fa32cf4553baa73b3d7ee3fc71/Attending-Futures-4.jpg");
}

.card03{
	background-image: url("https://freight.cargo.site/t/original/i/60f53df7da89164fb54916c9e2208d209592adcbf8e72fdbc86dea091a80e3ee/Attending-Futures-3.jpg");
}

.card04{
	background-image: url("https://freight.cargo.site/t/original/i/b7832ac3e9cf498092a871df5b0d49799223d47291a3160a8ef5fab3e92ba734/Attending-Futures-1.jpg");
}

.card05{
	background-image: url("https://freight.cargo.site/t/original/i/64c3597e285f2d8aea38c1981f52cdfc1a19e22cb3a8fbc12e39679ff2c1e87f/Frame-140.jpg");
}

.card06{
	background-image: url("https://freight.cargo.site/t/original/i/ee4e23c6911a53d7b60649977a4e249221f07d4863aef6c59843e7f20e209382/Attending-Futures.png");
}

.cardTag{
	padding: 10px 20px;
    background-color: #E6E6FF;
	border-radius: 3px;
	display: inline-block;
    text-align: right;
	border: solid 1px #0000FF;

	font-family: 'Piazzolla';
font-style: normal;
font-weight: 700;
font-size: 16px;
line-height: 16px;
/* or 100% */

letter-spacing: 0.145em;
text-transform: uppercase;

/* Blue/Blue */

color: #0000FF;
    
}

.cardBottom{
	background-color: #F8EEF5;
    padding: 3rem;
	margin: 0rem .7rem .7rem .7rem;
	border-radius: 0px 0px 3px 3px;
    display: flex;
     flex-direction: column;	
    
}

.cardText{
	text-align: left;

}
.cardIcon{
	
}

.cardIcon a:hover{
	color: blue;
}

.cardLink{
	width: 100%;
 justify-content: space-between;
	display: flex;
	text-align: left;
    border-bottom: none;
	vertical-align: bottom;
    text-decoration: underline;
    color: #323031;

}


.video{
		  position: relative;

}

.videoIcon{
	position: absolute;
    bottom: 4vw;
    right: 4vw;
}

.video{
}

.video:hover{
	opacity: .9;
}

@media only screen and (max-width: 728px) {
.videoIcon{
	scale: .7;
    bottom: 2vw;
    right: 2vw;
}
}
.videoText{
	width: 60vw;
	padding: 0vw 3vw;
    position: absolute;
    bottom: 5vw;
    left: 3vw;
    border-left: solid 1px #F9BEF7;
    display: inline-block;
	text-transform: capitalize;
    letter-spacing: 0px;
    color: #fff;
}

.navbar{
	font-weight: 500;
    font-size: 1.4rem;
color: #fff;
}

#more{
	display: none;
}
#more{
	display: none;
}

.quote{      font-family: Piazzolla, Icons;
        font-style: normal;
        font-weight: 400;
        padding: 0;
        margin: 0;
        color: #000;
        font-size: 2.4rem;
        line-height: 1.4;
	
}

.light{
	color: #7c777a;
	line-height: 140%;
    font-size: 1.4rem;
    font-family: "DM Mono", Icons;
    font-style: normal;
        font-weight: 300;
        letter-spacing: .1em;
      text-transform: uppercase;
}

.light li{
	padding-bottom: 2.7rem;
    list-style: none;
}

[local-style="28361498"].page_container {
padding-top: 6em;
    padding-bottom: 6rem;
}


[local-style="28358385"].page_container {
background-image: url("https://freight.cargo.site/t/original/i/9947d1ce6f30530e945235ddfa4375f6f4bbd7c9933d4b57e0fa58797bd89fbc/Student-Zoom.png");
background-size: contain;
}

[local-style="28192317"].page_container {
mix-blend-mode: difference;
color: #fff;
display: flex;
justify-content: space-between;

    
    
    
}


.BgColour {
    color: black;
    transition: all 1s;
    background-color: white;
    border-bottom: 1px solid lightgray;
}


 .margin-sm{
	margin-bottom: 16px;
}

.margin-med{
	margin-bottom: 24px;
}

.margin-lg{
	margin-bottom: 48px;
}


@media only screen and (max-width: 728px) {
.btn-blue{
    display: flex;
        width: 100%;
    flex-grow: 1;
        text-align: center;
	padding: 12px 0px;
	
}


@media only screen and (max-width: 728px) {
.halfButton{
	height: 100%;
	width: 45vw;
}
}


    .btn-pink{
    display: flex;
        width: 100%;
    flex-grow: 1;
        text-align: center;
}
    .btn-grey{
    display: flex;
        width: 100%;
    flex-grow: 1;
        text-align: center;
}
       .btn-transparent{
    display: flex;
        width: 100%;
    flex-grow: 1;
        text-align: center;
}
}

.btn-pink:hover{
background-color: #F8EEF5;
}

.btn-grey:hover{
background-color: rgba(0,0,0,.1);
}

.btn-pink{
	color: #FF00FF;
    border-color: #FF00FF;
    border: 1px solid;
	font-size: 1.1rem;
    font-family: 'DM Mono';
font-style: normal;
font-weight: 400;
   /* Style1/Title 
font-family: 'DM Mono';
font-style: normal;
font-weight: 400;
font-size: 20px;
line-height: 24px;

letter-spacing: 0.1em;
text-transform: uppercase;
box-sizing: border-box;*/

/* Auto layout */
display: inline-block;
flex-direction: row;
justify-content: center;
align-items: center;
padding: 12px 56px;
gap: 10px;
border-radius: 6px;
}

.btn-grey{
    font-size: 1.1rem;
    font-family: 'DM Mono';
font-style: normal;
font-weight: 400;
	color: grey;
    border-color: grey;
    border: 1px solid;
    background-color: white;

/* Auto layout */
    
    width: 100%;
align-items: center;
padding: 12px 56px;
gap: 10px;
border-radius: 6px;
}

.btn-transparent{
    font-size: 1.1rem;
    font-family: 'DM Mono';
font-style: normal;
font-weight: 400;
	color: blue;
    border-color: blue;
    border: 1px solid;
	background-color: transparent;
   /* Style1/Title 
font-family: 'DM Mono';
font-style: normal;
font-weight: 400;
font-size: 20px;
line-height: 24px;

letter-spacing: 0.1em;
text-transform: uppercase;
box-sizing: border-box;*/

/* Auto layout */
display: inline-block;
flex-direction: row;
justify-content: center;
align-items: center;
padding: 12px 56px;
gap: 10px;
border-radius: 6px;
}
	
.btn-transparent:hover{
background-color: rgba(0,0,255, .1);
}

.btn-blue:hover{
background-color: #E6E6FF;
}

.btn-blue{
    font-size: 1.1rem;
    font-family: 'DM Mono';
font-style: normal;
font-weight: 400;
	color: blue;
    border-color: blue;
    border: 1px solid;
	background-color: white;

   /* Style1/Title 
font-family: 'DM Mono';
font-style: normal;
font-weight: 400;
font-size: 20px;
line-height: 24px;

letter-spacing: 0.1em;
text-transform: uppercase;
box-sizing: border-box;*/

/* Auto layout */
display: inline-block;
flex-direction: row;
justify-content: center;
align-items: center;
padding: 12px 48px;
gap: 10px;
border-radius: 6px;
}

.Link1{
	
   	vertical-align: middle;
	height: 32px;
}

 [local-style="28254681"].page_container{
    background: linear-gradient(270deg, #FAA7F8 0%, #F8EEF5 10%, #0000FF 35%, #000000 100%);
    }
    
    
    #line{
        width: 100%;
        height: 12px;
    }
    
    .gradient{
         background: linear-gradient(270deg, #FAA7F8 0%, #F8EEF5 10%, #0000FF 35%, #000000 100%);
    }
    
    body {
        
    }
    
    a:active {
        opacity: 0.7;
    }
    
    .page a.active {
        opacity: .4;
    }
    
    i,
    em {
        font-style: italic;
    }
    
    b,
    strong {
        font-weight: bolder;
    }
    
    sub,
    sup {
        position: relative;
        vertical-align: baseline;
    }
    
    sub {
        top: 0.3em;
    }
    
    sup {
        top: -0.4em;
    }
    
    s {
        text-decoration: line-through;
    }
    
    img {
        border: 0;
        padding: 0;
    }
    
    ul,
    ol {
        margin: 0;
        padding: 0 0 0 1em;
    }
    
    blockquote {
        margin: 0;
        padding: 0 0 0 0;
    }
    
    hr {
        background: #F9BEF7;
        border: 0;
        height: 1px;
        display: block;
    }
    
    .content img {
        float: none;
    }
    
    .gallery_image_caption {
        margin-top: 1.2rem;
        margin-bottom: 0.5rem;
        font-size: 1.5rem;
        font-weight: 400;
        color: rgba(0, 0, 0, 0.35);
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif, "Sans Serif", Icons;
        font-style: normal;
        line-height: 1.3;	
    }
    
    /**
     * Loading Animation
     */
    
    .loading[data-loading] {
        position: fixed;
        bottom: 8px; 
        left: 8px;
    }
    
    /**
     * Editor styles
     */
    
    [data-predefined-style="true"] bodycopy {
        font-size: 1.4rem;
        font-weight: 400;
        color: rgba(0, 0, 0, 0.8);
        font-family: Piazzolla, Icons;
        font-style: normal;
        line-height: 1.6;
    }
    
    [data-predefined-style="true"] bodycopy a {
        color: #00f;        
        padding-bottom: .1em;
        border-bottom: 0.05em solid blue;
        text-decoration: none;
        letter-spacing: 0.145em;
		font-weight: 700;
		font-size:1.1rem;
text-transform: uppercase;
    }
    
    [data-predefined-style="true"] bodycopy a:hover {
    
    }
    
    bodycopy a.image-link,
    bodycopy a.icon-link,
    bodycopy a.image-link:hover,
    bodycopy a.icon-link:hover {
        border-bottom: 0;
        padding-bottom: 0;
    }

bodycopy a.image-link:hover{
}

bodycopy a.image-link{
 display: block;
 overflow: hidden;
padding: 0px;
object-fit: cover;
}

#imageContainer{
	position: relative;
    overflow: hidden;
	height: 100px;
	padding-bottom: 60%;
	background-size: cover;
/*box-sizing: border-box;
max-height: 24rem;
resize: horizontal;
  border: 1px dashed;
  overflow: hidden;
  max-width: 100%;
  height: calc(100vh - 16px);*/
	
}

.right-padding{
	margin-right: .4rem
}

.left-padding{
	margin-left: .4rem
}

.neste{
 background-image: url("https://freight.cargo.site/t/original/i/33936d316bb9c17541a6466a8d4c96ca6c9728c83610d7700571b898b9bcc785/NESTE.jpg");
}

.mariah-app{
 background-image: url("https://freight.cargo.site/t/original/i/05f68f5256ec9f697755c266f006bef1627605273bef994536908a5dad242cc4/MARIAH-1.jpg");
}

.mariah-resistance{
 background-image: url("https://freight.cargo.site/t/original/i/e38a67cc39afc853f4a70f352bf8e4a58ee5b729748474241ec4630fae24f036/MARIAH-2.jpg");
}

.lost-in-translation{
 background-image: url('https://freight.cargo.site/t/original/i/86f4164e68eceb561df725bf83851487be9913a54335aa9ad215bd6ace3fccff/LOST.jpg');
}

.slanted{
 background-image: url("https://freight.cargo.site/t/original/i/8d16146ab7d30164fc8bbfea8c9795e1c41ae5c0b4e132c3ac8fa92a97911084/SLANTED.jpg");
}

.transparency{
 background-image: url("https://freight.cargo.site/t/original/i/6c1e162dad1110df509b549575e4a6adef89ee6d2f37328801bacb77aea2a69f/TRANSPARENCY.jpg");
}

.technologies{
 Background-image:url("https://freight.cargo.site/t/original/i/6094713bc6d9a9759d966321be669c30ed82274c77a7bda9eb1e96f9ff7212e4/HQ-TECHOFDCEPT.png");
    background-position: center;
}

.strikethrough{
 Background-image: url("https://freight.cargo.site/t/original/i/bbf70262a803d04ad167f73385c3a65945e0875933e676fc1836ab05b13f5798/image-46.jpg");
}

.projectImage{
	object-fit: cover;
	display: inline-block;
	width: 100%;

}

.projectImage img{
	width: 100%;
	object-fit: cover;
}


#imageContainer:hover .projectOverlay{
	opacity: .5;
}

#imageContainer:hover .projectText{
	opacity: 1;
}

.projectText{
	border-left: solid 1px #F9BEF7;
    padding-left: 1em;
	color: white;
	position: absolute;
  	bottom: 8%;
	padding-right: rem;
  	left: 5%;
  	text-align: left;

     font-size: 1.4rem;
        line-height: 1.5;
        font-family: "DM Mono", Icons;
        font-style: normal;
        font-weight: 300;
        letter-spacing: .1em;
      text-transform: uppercase;
	opacity: 0;
}

@media only screen and (max-width: 728px) {
.projectText{
	padding-right: 1rem;
}
}

.projectDescription{
	padding-top: 1rem;
	 font-size: 1.2rem;
        line-height: 1.8	;
        font-family: Piazzolla, Icons;
        font-style: normal;
        font-weight: 400;
        letter-spacing: 0px;
		color: white;
     	text-transform: none;
}




	.projectOverlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  opacity: 0;
  transition: .5s ease;
  background-color: blue;
}


    
    [data-predefined-style="true"] h1 {
        font-family: Piazzolla, Icons;
        font-style: normal;
        font-weight: 100;
        padding: 0;
        margin: 0;
     
        line-height: 0.9;
        color: #f8eef5;
		font-size: clamp(4rem,calc(var(--vw, 1vw)*100*.06),6rem);        
}
    
    [data-predefined-style="true"] h1 a {
        color: #f8eef5;
    }
    
    [data-predefined-style="true"] h2 {
        font-family: Piazzolla, Icons;
        font-style: normal;
        font-weight: 400;
        padding: 0;
        margin: 0;
        color: #000;
        font-size: clamp(1.8rem,calc(var(--vw, 1vw)*100*.07),2.6rem); 
        line-height: 130%;
        }
    
    [data-predefined-style="true"] h2 a {
        color: rgba(0, 0, 0, 0.85);
    }
    
    [data-predefined-style="true"] small {
        font-size: 1.4rem;
        line-height: 1.2;
        font-family: "DM Mono", Icons;
        font-style: normal;
        font-weight: 300;
        color: #00f;
        letter-spacing: .1em;
      text-transform: uppercase;
    
    }

.caption{
	   display: inline-block;
        font-size: 1.2rem;
        line-height: 1.5;
        font-family: "DM Mono", Icons;
        font-style: normal;
        font-weight: 300;
        color: #fff;
        letter-spacing: .1em;
      text-transform: uppercase;
}

.caption a{
	   display: inline-block;
        font-size: 1.2rem;
        line-height: 1.5;
        font-family: "DM Mono", Icons;
        font-style: normal;
        font-weight: 300;
        color: #fff;
        letter-spacing: .1em;
      text-transform: uppercase;
	text-decoration: underline;
}
    
    [data-predefined-style="true"] small a {
 font-size: 1.2rem;
        line-height: 1.5;
        font-family: "DM Mono", Icons;
        font-style: normal;
        font-weight: 300;
        color: #00f;
        letter-spacing: .1em;
      	text-transform: uppercase;
		text-decoration: none;
		padding-bottom: none;
    	border-bottom: none;
    	margin-bottom: none;
       
    
    }
    /**
     * Breakpoints
     */
    
    
    [data-css-preset] .page {
        background-color: initial /*!page_bgcolor*/;
    }
    
    .mobile .page,
    [data-css-preset].mobile .page {
        position: relative;
        min-height: 10px;
        max-width: 100%;
        width: 100%;
        background-color: transparent /*!page_bgcolor*/;
    }
    
    [data-css-preset] .container {
        margin-left: auto /*!content_center*/;
        margin-right: auto /*!content_center*/;
        text-align: center /*!text_center*/;

        
    }
    
    [data-css-preset] body {
        background-color: rgb(255, 255, 255) /*!body_bgcolor*/;
    }
    
    [data-css-preset] .container_width {
        width: 100%/*!content_center*/;
    }
    
    [data-css-preset] .content_padding {
        padding-top: 5.9rem/*!main_margin*/;
        padding-bottom: 5.9rem/*!main_margin*/;
        padding-left: 5.9rem/*!main_margin*/;
        padding-right: 5.9rem/*!main_margin*/;
    }
    
    
    [data-css-preset] text-limit {
        display: inline-block /*!text_width*/;
        max-width: 70rem/*!text_width*/;
    }
    
    /**
     * Thumbnails
     */
    
    div[thumbnails] {
        justify-content: flex-start;
    }
    
    [data-css-preset] .thumbnails {
           background-color: #fff/*!thumbnails_bgcolor*/;   
    }
    
    [data-css-preset] .thumbnails_width {
        width: 100%/*!thumbnails_width*/;
    }
    
    [data-css-preset] [thumbnails-pad] {
        padding: 0.6rem/*!thumbnails_padding*/;
    }
    
    [data-css-preset] [thumbnails-gutter] {
        margin: -1.2rem/*!thumbnails_padding*/;
    }
    
    [data-css-preset] [responsive-layout] [thumbnails-pad] {
        padding: 1rem/*!responsive_thumbnails_padding*/; 
    }
    
    [data-css-preset] [responsive-layout] [thumbnails-gutter] {
        margin: -2rem/*!responsive_thumbnails_padding*/; 
    }
    
    .thumbnails .thumb_image {
        outline: 1px solid rgba(0,0,0,.12);
        outline-offset: -1px;
    }
    
    .thumbnails .title {
        margin-top: 1.4rem;
        margin-bottom: .3rem;
        font-size: 1.5rem;
        font-weight: 400;
        color: rgba(0, 0, 0, 0.4);
        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif, 'Sans Serif', Icons;
        font-style: normal;
        line-height: 1.1;
        text-align: center;
    }
    
    .thumbnails .tags {
        margin-top: 1.2rem;
        margin-bottom: 0.5rem;
        font-size: 1.6rem;
        font-weight: 400;
        color: rgba(0, 0, 0, 0.35);
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif, "Sans Serif", Icons;
        font-style: normal;
        line-height: 1.2;
        text-align: center;
    }
    
    .thumbnails .tags a {
        border-bottom: 0;
        color: rgba(0, 0, 0, 0.35);
        text-decoration: none;
    }
    
    .thumbnails .has_title .tags {
        margin-top: 0rem;
    }
    
    /**
     * Site Menu
     */
    
    [data-css-preset] #site_menu_button {
        color: rgba(255, 255, 255, 0);
        line-height: 1;
        font-size: 36px /*!site_menu_button*/;
        padding: 6px;
        line-height: 1;
        background: rgba(33, 32, 46, 0);
        position: fixed;
        top: 1.2rem /*!site_menu_button*/;
        right: 4.2rem /*!site_menu_button*/;
    }
    
    body.mobile #site_menu_button {
       width: 32px;
        height: 28px;
		position: fixed;
        top: 1rem /*!site_menu_button*/;
        right: 4rem /*	!site_menu_button*/;
    }
    
    #site_menu_button.custom_icon {
        width: 40px;
        height: 40px;
    }
    
    #site_menu_button.active {
		display: none;
    }
    
    /**
     * Site Menu
     */
    
    #site_menu {
        font-family: Piazzolla, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif, "Sans Serif", Icons;
        background: #FF00FF;
        font-size: 5.5rem;
        font-style: normal;
        font-weight: 300;
        padding: 2.5rem 4rem 2.5rem 4rem;
        max-width: 100%;
        width: 100%;
        color: #fff;
        min-width: 300px;
        text-align: center;
        display: inline-block;
   		vertical-align: middle;
    }
    
    body.mobile #site_menu {
        width: 100%;
		font-size: 48px;
    	line-height: 56px;
    }
    
    #site_menu .page-link a {
        color:#F8EEF5;
    }
    
    #site_menu .page-link a:hover {
        color: #0000FFE5;
        font-style: italic;
        text-decoration: underline;
        text-decoration-thickness: .2rem;
    
    }
    
    #site_menu .set-link > a {
       color:#F8EEF5;
font-weight: 300;
    }

    #site_menu .set-link > a:hover {
       color: #0000FFE5;
        font-style: italic;
        text-decoration: underline;
        text-decoration-thickness: .2rem;
    }
    
    #site_menu a:active {
        opacity: .7;
    }
    
    #site_menu a.active {
        font-style: italic;
		text-decoration: underline;
        text-decoration-thickness: .2rem;
    }
    
    #site_menu .close {
        display: block;
        color: rgba(255, 255, 255);
		font-family: "Diatype Mono Variable", Icons;
        font-size: 88px;
		font-style: normal;
		font-weight: 200;
		position: fixed;
        top: 5.8rem /*!site_menu_button*/;
        right: 6.5rem /*!site_menu_button*/;
	font-variation-settings: 'slnt' 0, 'MONO' 1;
}
    
    body.mobile #site_menu .close {
        display: block;
        font-size: 88px;
		font-family: "Diatype Mono Variable", Icons;
		
		color: #fff;
	       position: fixed;
        top: 1.4rem /*!site_menu_button*/;
        right: 2.2rem /*!site_menu_button*/;
	font-style: normal;
	font-weight: 200;
	font-variation-settings: 'slnt' 0, 'MONO' 1;
}
    
    #site_menu .break {
        height: 0px;
    }
    
    #site_menu .indent {
        margin-left: 28px;
    }
    
    /*
     * Shop Button
     */
    
    [data-css-preset] #shop_button {
        color: rgba(0, 0, 0, 0.85);
        background: transparent;
        font-size: 40px;
        font-style: normal;
        font-weight: 400;
        line-height: 1;
        position: fixed;
        padding: 6px;
        top: 2.5rem /*!shop_button*/;
        left: 2.5rem /*!shop_button*/;
    }
    
    #shop_button.text {
        font-family: "Bureau Grot", Icons;
        font-style: normal;
        font-weight: 400;
        font-size: 2.2rem;
        padding: 0;
        line-height: 1.2;
        color: rgba(0, 0, 0, 0.85);
    }
    
    body.mobile #shop_button {
        margin: -6px;
        font-size: 34px;
    }
    
    #shop_button.custom_icon {
        width: 40px;
        height: auto;
    }
    
    body.mobile #shop_button:not(.text) {
        margin: -6px;
        font-size: 40px;
    }
    
    /*
     * Shop Product Widget
     */
    
    .shop_product {
        width: 100%;
        max-width: 22rem;
        position: relative;
        display: block;
        text-align: left;
    }
    
    .shop_product .price {
           font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif, 'Sans Serif', Icons;
        font-style: normal;
        font-weight: 400;
        font-size: 1.5rem;
        line-height: 1;
        color: rgba(0, 0, 0, 0.85);
        display: block;
        margin-bottom: 1rem;
    }
    
    .shop_product .dropdown {
        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif, 'Sans Serif', Icons;
        font-size: 1.5rem;
        display: inline-block;
        width: 100%;
        border: 1px solid rgba(0,0,0,.2);
        background:  white url(https://static.cargo.site/assets/images/select-line-arrows.svg) no-repeat right;
        margin-bottom: 1rem;
        line-height: 1.2;
        padding: .7rem 2.5rem .8rem 1rem;
        font-style: normal;
        font-weight: 400;
        color: rgba(0, 0, 0, 0.85);
    }
    
    .shop_product .button {
        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif, 'Sans Serif', Icons;
        font-size: 1.5rem;
        background: rgba(0, 0, 0, 0.85);
        color: rgba(255, 255, 255, 1);
        flex: 0 0 50%;
        text-align: left;
        display: inline-block;
        line-height: 1;
        padding: .8rem 1rem;
        font-style: normal;
        font-weight: 400;
    }
    
    /*
     * Image Zoom
     */
    
    .content img.image-zoom:active {
      opacity: .7;
    }
    
    /**
     * Quick View
     */
    
    [data-css-preset] .quick-view {
        padding-top: 2.5rem /*!quick_view_padding*/;
        padding-bottom: 2.5rem /*!quick_view_padding*/;
        padding-left: 2.5rem /*!quick_view_padding*/;
        padding-right: 2.5rem /*!quick_view_padding*/;
        height: 100% /*!quick_view_height*/;
        width: 100% /*!quick_view_width*/;
    }
    
    body.mobile .quick-view {
        width: 100%;
        height: 100%;
        margin: 0;
    }
    
    
    [data-css-preset] .quick-view-background {
        background: rgba(255, 255, 255, 0.95) /*!quick_view_bgcolor*/;
    }
    
    .quick-view-caption {
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif, "Sans Serif", Icons;
        transition: 100ms opacity ease-in-out;
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        margin: 3.5rem 0;
        text-align: center;
        font-size: 1.5rem;
        font-style: normal;
        font-weight: 400;
        line-height: 1.3;
    }
    
    .quick-view-caption span {
        padding: 0.5rem 1rem;
        display: inline-block;
        background: rgba(0,0,0,0.4);
        color: white;
    }
    
    
    /**
     * Quick View Navigation 
     */
    
    .quick-view-navigation .left-arrow {
        left: 10px;
    }
    
    .quick-view-navigation .right-arrow {
        right: 10px;
    }
    
    .quick-view-navigation .left-arrow,
    .quick-view-navigation .right-arrow {
        /* Change height/width together to scale */
        height: 36px;
        width: 36px;
    }
    
    .quick-view-navigation .left-arrow .inner-color,
    .quick-view-navigation .right-arrow .inner-color {
        stroke: rgba(0, 0, 0, 0.85);
        stroke-width: 1.5px;
    }
    
    .quick-view-navigation .left-arrow .outer-color,
    .quick-view-navigation .right-arrow .outer-color {
        stroke: transparent;
        stroke-width: 2.5px;
    }
    
    .quick-view-navigation .close-button {  
        top: 10px;
        right: 10px;
        /* Change height/width together to scale */
        width: 36px;
        height: 36px;
    }
    
    .quick-view-navigation .close-button .inner-color {
        stroke: rgba(0, 0, 0, 0.85);
        stroke-width: 1.5px;
    }
    
    .quick-view-navigation .close-button .outer-color {
        stroke: transparent;
        stroke-width: 2.5px;
    }
    
    /** 
     * Image Gallery Navigation Arrows 
     */
     
    .image-gallery-navigation .left-arrow,
    .image-gallery-navigation .right-arrow {
        /* Change height/width together to scale */
        height: 36px;
        width: 36px;
    }
    
    .image-gallery-navigation .left-arrow .inner-color,
    .image-gallery-navigation .right-arrow .inner-color {
        stroke: #fff;
        stroke-width: 1.5px;
    }
    
    .image-gallery-navigation .left-arrow .outer-color,
    .image-gallery-navigation .right-arrow .outer-color {
        stroke: rgba(0, 0, 0, 0.6);
        stroke-width: 2.5px;
    }
    
    /**
     * Wallpaper Backdrop Navigation Arrows 
     */
    
    .wallpaper-navigation .left-arrow,
    .wallpaper-navigation .right-arrow {
       /* Change height/width together to scale */
       width: 36px;
       height: 36px;
    }
    
    .wallpaper-navigation .left-arrow .inner-color,
    .wallpaper-navigation .right-arrow .inner-color {
       stroke: #fff;
        stroke-width: 1.5px;
    }
    
    .wallpaper-navigation .left-arrow .outer-color,
    .wallpaper-navigation .right-arrow .outer-color {
        stroke: rgba(0, 0, 0, 0.6);
        stroke-width: 2.5px;
    }
    
    
    /**
     * Feed
     */
    
    .feed .content_container .page {
        border-top: 0px dashed rgba(0, 0, 0, 0.2);
    }
    
    .feed .content_container .page_container:last-child .page {
        border-bottom: 0;
    }
    
    
    
    /*
     * Audio Player
     */
    
    .audio-player {
        max-width: 36rem;
        height: 3.3rem;
        outline: 1px solid rgba(0,0,0,0.15);
        color: rgba(0, 0, 0, 0.6);
        background: #fff;
        font-size: 1.2rem;
        line-height: 1.3;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif, "Sans Serif", Icons;
        font-style: normal;
        font-weight: 400;
        text-align: left;
        margin: 1px 1px 1em 1px;
    }
    
    body.mobile .audio-player {
        max-width: 100%;
    }
    
    .audio-player .separator {
        width: 1px;
        background-color: rgba(0,0,0,0.15);
    }
    
    .audio-player .button {
        background: transparent;
        cursor: pointer;
        fill: rgba(0, 0, 0, 0.85);
    }
    
    .audio-player .icon {
        fill: rgba(0, 0, 0, 0.85);
        padding: 30%;
        width: 100%;
        margin: auto;
    }
    
    .audio-player .buffer {
        background: rgba(0,0,0,0.03);
    }
    
    .audio-player .progress {
        background: rgba(0,0,0,0.1);
    }
    
    .audio-player .progress-indicator {
        border: 1px solid rgba(0, 0, 0, 0.7);
        width: 1px;
        height: 100%;
        right: 0;
        position: absolute;
        cursor: ew-resize;
    }
    
    .audio-player .note-icon {
        height: 100%;
        width: 3.8rem;
        padding: 1rem;
        fill: rgba(0, 0, 0, 0.5);
    }
    
    .audio-player .current-time {
        padding-left: 1rem;
    }
    
    .audio-player .total-time {
        padding-right: 1rem;
    }