/*---------------------------------------------- Project Section ----------------------------------------------*/

h2, .h2  {

    text-transform: capitalize!important;

}

.title-label {

    font-family: 'Rajdhani', sans-serif!important;;

    font-size: 2.1vh!important;

    text-transform: uppercase!important;

}

img.logo-image {

    max-width: 20vh;

    margin-bottom:2vh;

    height: auto;

}

p.overview-intro {

    font-size: calc(12px + 0.9vh);

    font-weight: 300!important;

    padding-right: 0%;

}

.backbtn-portfolio {

    background-color: #252525;

    display: inline-block;

    float: left;

    height: 100vh;

    width: 150px;

    position: absolute;

    z-index: 2;

    margin: 0px 0px 0px 0px;

    padding: 0px;

    left: -90px;

    top:0px;

    -webkit-transition: left 0.15s ease-in-out;

    transition: left 0.15s ease-in-out;

}

.backbtn-portfolio:hover {

    left: 0px!important;

    -webkit-transition: left 0.15s ease-in-out;

    transition: left 0.15s ease-in-out;

}

.backbtn-row {

    display: flex;

    height: 100%;

    width:100%;

}

.backbtn-col {

    display: inline-flex;

    justify-content: center;

    flex-direction: column;

    text-align: right;

    color: #FFF;

    height: calc(100% - 40px);

    width:100%;

}

.swiper-container {

    width: calc(100% - 58px)!important;

    margin: 0px!important;

    left: 58px!important;

}



.overview-row.overview-story {

    padding-top: 3vh!important;

}



.overview-col {

  padding-right:3vh!important;

}



.overview-col p {

  margin-bottom:2.5vh!important;

}



.overview-right .title-label {

    padding-top:15px;

    padding-bottom: 0px;

    margin-bottom: 0px;

}



.overview-highlights {

    background-color: rgba(0,0,0,0.8);

    padding: 2vh!important;

    border-radius: 8px;

    border: 2px solid #fff;

    float:right;

    display:inline-block;

}



.overview-headline {

  padding-right:3vh;

}



.overview-client{

    width:100%;

    display:inline-block;

}



.overview-client .circle-box {

    max-width: calc(3vh + 5vw);

    margin: 0px 0px 3vh 0px;

    float:left;

    display:inline-block;

    background-color:#fff;

}



.overview-client .circle-content span {

    padding: 1vw;

}



.project-context {

    display: flex;

}



.context-col {

    display: flex;

    float: left;

    padding: 10px 15px;

    background-color: rgba(0,0,0,0.4);

    margin-right: 5px;

    flex-direction: column;

    justify-content: center;

    border-top: 2px solid #fff;

}



.context-col:last-child {

    margin-right: 0px;

}





element.style {

}

.context-col .title-label {

    font-family: 'Rajdhani', sans-serif!important;

    font-size: 2.1vh;
	
	font-weight: 700;

    padding-bottom: 2px;

    margin-bottom: 0px;
	
	margin-top: 5px;
	
	color:#fff!important;

}

#swiper-project1 .copy-white .bold-underline {
    border-bottom: 0.1em solid #fff!important;
}

#swiper-project1 .title-label {
    color: #fff;
}


.context-category{

  min-width: 10vw;

}



.context-headline {

    font-size: calc(1vh + 1.0vw)!important;

    text-transform: uppercase!important;
	
	padding-top: 0.17em!important;

}



.billboard-overview .overview-project {

    padding-right: 16vw;

}



.worknav-footer {

    display: inline-block;

    position: fixed;

    z-index: 9;

    background-color: #fff;

    color:#000;

    bottom: 0px;

    left:0px;

    width: 100vw;

    height: 50px!important;

    border-top: 1px solid #ccc;

}

.worknav-footer a, .worknav-footer a:hover, .worknav-footer a:active, .worknav-footer a:focus {

    color:#000!important

}

.worknav-row {

    display:flex;

    height:100%;

    height: 100%;

}

.worknav-col {

    display: inline-flex;

    float: left;

    height: 100%;

    flex-direction: column;

    justify-content: center;

}

.worknav-home, .worknav-back, .worknav-next {

  width:50px;

  height: 50px;

  text-align: center;

  font-size:15px;

}

.worknav-title {

  width:calc(100% - 150px);

  padding-left:15px;

  font-size:12px;

}

.worknav-title, .worknav-back, .worknav-next {

  border-left:1px solid #ccc;

}



.context-headline{

    font-family: 'Rajdhani', sans-serif!important;

    border: none;

    color: inherit;

    font-size:3vh;

	font-weight: 400;
	
    line-height: 1.0em;

    letter-spacing: -0.03em;

    padding-bottom: 0;

    text-shadow: none!important;

}



.swiper-slide.slide-main:last-child .intro-title {

    font-family: 'BigNoodleTitling', 'Tungsten', 'Rajdhani', sans-serif!important;

    font-size: 5.7vh!important;

    text-transform: uppercase!important;

    letter-spacing: 0px;

}



.swiper-slide.slide-main:last-child .title-label {
    font-family: 'Rajdhani', sans-serif!important;
    font-size: calc(1.15vh + 0.15vw)!important;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0px;
    padding-bottom: 1vh;
    color: #4ee202!important;
}





/*---------------------------------------------- Section Responsive ----------------------------------------------*/



@media screen and (min-width: 1501px) {

/*---------- Insert Style -----------*/

}



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

  .billboard-overview .overview-project {

      padding-right: 0px;

  }

}



@media screen and (max-width: 1450px) and (min-width: 769px){

/*---------- Insert Style -----------*/

}



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

  .overview-headline {

      font-size: 5vh;

  }

}



@media screen and (max-width: 1120px) and (min-width: 769px){

/*---------- Insert Style -----------*/

}



@media screen and (min-width: 1170px) {

	.title-label, .callout-label, .context-col .title-label {
		font-size: 1.3vh!important;
		line-height: 0.9em;
	}

}



@media screen and (min-width: 769px) {

  .worknav-footer {

    display:none;

  }

}



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

	.title-label, .callout-label, .context-col .title-label {
		font-size: 1.3vh!important;
		line-height: 0.9em;
	}

  p.overview-intro {

    padding-right: 0%!important;

  }

  .overview-client .circle-box {

      max-width: 12vh;

      margin: 0px 0px 1.5vh 0px;

  }

  .billboard-overview .billboard-bottom {

    position:relative!important;

  }

  .context-title.context-col {

    display: none;

  }

  .overview-col1 {

    padding-right:0%!important;

  }

  .overview-headline {

    padding-right:0vh;

  }

  .overview-col2 {

    display:none;

  }

  .float-bottom {

    bottom: 20px;

  }

  .swiper-container{

    width: 100%!important;

    height: calc(100vh - 120px);

    margin:0px auto!important;

    left: 0px!important;

  }

  .swiper-container-main .swiper-slide.slide-main {

    min-height: calc(100vh - 120px);

  }

  .swiper-container-main .swiper-slide.slide-main:last-child {

    margin-bottom:50px;

  }

  .billboard-container {

    min-height: calc(100vh - 120px);

  }

  .nav-slideout .billboard-container {

    min-height: calc(100vh - 90px)!important;

  }

  .split-top, .split-bottom {

    min-height: calc(70vh - 60px);

  }

  .billboard-left, .billboard-right {

    min-height: calc(100vh - 120px);

    width:100%!important;

  }

  .billboard-bottom.bottom-block {

    height: calc(60vh - 100px)!important;

  }

  .worknav-footer {

    display:inline-block;

  }

  .backbtn-portfolio {

      display:none!important;

  }

}



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

/*---------- Insert Style -----------*/

}



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



}