
:root
{
  --rja-max-width: 1440px;
  --rja-content-width: 95%;
  --rja-text-max-width: 1192px;
}

/* Fonts */
/*@font-face {
  font-family: 'Roboto';
  src: url('/fonts/fonts/Roboto-VariableFont_wdth,wght.ttf') format('ttf');
}*/

body
{
  background-color: #FFF;
  color: #000;
  font-size: 12px;
  line-height: 21px;
  letter-spacing: 5%;
  font-family: 'Roboto', sans-serif;
  font-weight: 300;
  margin: 0px;
  padding: 98px 0 0 0;
}

br.mobile-only {
  display: none;
}

#swipe-notice
{
  display: none;
}

h1,h2,h3,h4,h5,h6
{
  margin-top: 0px;
}

h1 {
  margin:60px 0px;
  text-transform: uppercase;
  font-weight: 300;
  opacity: 0;
  transform: translateY(50px);
  transition: opacity .7s ease;
}

h1.visible {
  opacity: 1;
  transform: translateY(0px);
}



a
{
  text-decoration: none;
  position: relative;
  color: #000;
}

a::before {
  position: absolute;
  content: "";
  display: block;
  left: 0;
  right: 0;
  bottom: -7px;
  width: 0;
  border-bottom:
1px solid #000;
  opacity: 0;
  transition:
width .3s, opacity .3s;
}

strong
{
  font-weight: 500;
}

figure
{
  margin: 0px;
}

img
{
  display: block;
  width: 100%;
  height: auto;
}

p {
  margin: 0px 0px 1em 0px;
}

#site-header
{
  width: 100%;
  position: fixed;
  top: 0px;
  left: 0px;
  background-color: #FFF;
  text-align: center;
  z-index: 100;
  margin: 0px;
  padding: 28px 0px;
}

#site-header a
{
  background-image: linear-gradient(#000,#000);
  background-position: 0 100%;
  background-repeat: no-repeat,no-repeat;
  background-size: 0% 1px;
  transition: all .5s ease;
  padding-bottom: 7px;
}

#site-header li.current a
{
  background-repeat: no-repeat,no-repeat;
  transition: background-position 1s ease, color 1s linear;
  background-image: linear-gradient(#FFF, #FFF), linear-gradient(#000, #000), linear-gradient(#000, #000);
  background-size: 100px 1px, 100% 1px, 0 1px;
  background-position: calc(100px * -1) 100%, 100% 100%, 0 100%;
  padding-bottom: 7px;
}

#site-header li.current a:hover
{
  background-size: 100px 1px, 0 1px, 100% 1px;
  background-position: calc(100% + 100px) 100%, 100% 100%, 0 100%;
}

#site-header a:hover
{
  background-size: 100% 1px;
}



.site-logo
{
  max-width: 342px;

}

.site-nav
{
  font-size: 14px;
  text-transform: uppercase;
  list-style: none;
  font-weight: 400;
  letter-spacing: 7%;
  width: 95%;
  max-width: var(--rja-max-width);
  margin: 0px auto;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}

.site-nav li.current a
{

}

/*.site-nav li.current a:hover
{
  background-size: 100px 1px, 0 1px, 100% 1px;
  background-position: calc(100% + 100px) 100%, 100% 100%, 0 100%;
}*/

.site-nav li.current a::before {
  display: none;
}



.site-nav nav > ul
{
  display: flex;
  gap: 60px;
}

.site-nav nav.left-nav
{

}

.site-nav nav.right-nav
{

}

.site-nav ul
{
  list-style: none;
  display: flex;
  padding: 0px;
  margin: 0px;
  align-items: center;
  justify-content: space-between;
}

.site-nav ul li
{

}

.navigation li.logo {
  width: 342px;
}

@media all and (max-width: 1024px){
  .navigation li.logo
  {
    width: 300px;
  }
}

@media all and (max-width: 960px){
  .navigation li.logo
  {
    width: 250px;
  }
}


#mobile-navigation,
#mobile-logo,
.bubble-wrap
{
  display: none;
}

@media (max-width: 900px) {
  .site-nav {
    display: none;
  }

  #mobile-logo {
    display: block;
    width: 232px;
    margin: 0px 0px 0px 25px;
  }

  #site-header
  {
    padding: 20px 0px 30px 0px;
  }

  #mobile-navigation {
   position: fixed;
   display: flex;
   align-items: center;
   font-size: 25px;
   top: 0px;
   left: 0px;
   width: 100%;
   height: 100%;
   background-color: rgba(255, 255, 255, .98);
   font-weight: 300;
   letter-spacing: 2px;
   pointer-events: none;
   opacity: 0;
   transition: opacity .3s linear;
 }

  #mobile-navigation.visible
  {
   opacity: 1;
   z-index: 11;
   pointer-events: visible;
   opacity: 1;
  }


  #mobile-navigation ul
	{
		padding: 0px;
		margin: 0px;
    width: 100%;
		list-style: none;
		text-transform: uppercase;
		position: relative;
		/*top: 50%;
		transform: translateY(-100%);
		-webkit-transform: translateY(-100%);
		-moz-transform: translateY(-100%);*/
	}

	#mobile-navigation ul li
	{
		text-align: center;
		margin-bottom: 35px;
	}

	#mobile-navigation ul li:last-child
	{
		margin-bottom: 0px;
	}

  #mobile-navigation ul li a {
    text-decoration: none;
    border: 0;
    color: #474241;
  }

  /* Hamburger Effect */
	.bubble-wrap {
		height: 60px;
		width: 60px;
		background-color: transparent;
    top: 14px;
		right: 5px;
		position: absolute;
		border-radius: 50%;
		cursor: pointer;
		-webkit-transform: scale(1);
		-webkit-transition: all 0.3s ease-out;
		display: block;
	}

	.bubble-wrap.active {
		display: none;
	}

	.bubble {
		height: 60px;
		width: 60px;
		background-color: transparent;
		top: 0px;
		right: 30px;
		position: absolute;
		border-radius: 50%;
		-webkit-transform: scale(1);
		-webkit-transition: all 0.3s ease-out;
	}

	.bubble.active {
		-webkit-transform: scale(100);
		-webkit-transition: all 0.6s ease-out;
		/* -webkit-transition-delay: .4s; */
	}

	.bubbleback {
		height: 60px;
		width: 60px;
		background-color: transparent;
		top: 0px;
		right: 30px;
		position: absolute;
		border-radius: 50%;
		-webkit-transform: scale(1);
		opacity: 1;
	}

	.bubbleback.active {
		-webkit-transform: scale(1.5);
		opacity: 0;
		-webkit-transition: all 0.3s ease-out;
	}

  .label
	{
		text-transform: uppercase;
		font-size: 9px;
		letter-spacing: 1.4px;
		background-color: transparent;
		width: 34px;
		position: absolute;
		right: 10px;
    top: 5px;
		opacity: 1;
	}

	.label.active
	{
		opacity: 0;
		-webkit-transition: all 0.3s ease-out;
		/* -webkit-transition-delay: .4s; */
	}


	.bar
	{
		background-color: #000;
		width: 31px;
		height: 1.5px;
		border-radius: 0px;
		right: 13px;
		top: 20px;
	}

	.first {
		position: absolute;
		opacity: 0;
		-webkit-transition: all 0.2s ease-out;
	}


	.first.active {
		opacity: 1;
		margin-top: 2px;
		-webkit-transform-origin: 50% 50%;
		-moz-transform-origin: 50% 50%;
		-o-transform-origin: 50% 50%;
		-ms-transform-origin: 50% 50%;
		transform-origin: 50% 50%;
		-webkit-transform: rotate(45deg);
		-moz-transform: rotate(45deg);
		-o-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		transform: rotate(45deg);
		-webkit-transition: all 0.2s ease-out;
		/* -webkit-transition-delay: .4s; */
	}


	.second {
		margin-top: 2px;
		position: absolute;
		-webkit-transition: all 0.2s ease-out;
	}


	.second.active {
		opacity: 0;
		margin-top: 10px;
		-webkit-transition: all 0.2s ease-out;
		/* -webkit-transition-delay: .4s; */
	}


	.third-bar {
		margin-top: 9px;
		position: absolute;
		-webkit-transition: all 0.2s ease-out;
	}


	.third-bar.active {
		margin-top: 2px;
		-webkit-transform-origin: 50% 50%;
		-moz-transform-origin: 50% 50%;
		-o-transform-origin: 50% 50%;
		-ms-transform-origin: 50% 50%;
		transform-origin: 50% 50%;
		-webkit-transform: rotate(-45deg);
		-moz-transform: rotate(-45deg);
		-o-transform: rotate(-45deg);
		-ms-transform: rotate(-45deg);
		transform: rotate(-45deg);
		-webkit-transition: all 0.2s ease-out;
		/* -webkit-transition-delay: .4s; */
	}

}

.swiper
{
  opacity: 0;
  transition: opacity .6s linear;
  height: calc(100dvh - 100px - 60px);
}

.swiper.loaded
{
  opacity: 1;
}

.swiper .swiper-slide .img-holder
{
  transition: transform .6s ease;
  transform: scale(.975);
}

.swiper .swiper-slide .img-holder video
{
  width: 100%;
  height: auto;
}

/*.swiper .swiper-slide.swiper-slide-active .img-holder
{
  transform: scale(1);
}*/

/*.swiper .swiper-slide.scaled .img-holder
{
  transform: scale(.6);
}*/

.single-project .swiper
{

}

.swiper .img-holder
{
  width: 100%;
  height: 100%;
}

.swiper .img-holder img
{
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.swiper .down-button
{
  width: 60px;
  height: auto;
  position: absolute;
  bottom: 40px;
  left: 50%;
  transform: translate3d(-50%,0,0);
  z-index: 1;
  cursor: pointer;
}

.slider-info
{

  padding-top: 17px;
}

.slider-info .inner
{
  width: var(--rja-content-width);
  max-width: var(--rja-max-width);
  margin: 0px auto;
  display: flex;
  flex-direction: row;
  align-items: center;
}

.slider-info .project-title
{
  text-transform: uppercase;
  font-size: 15px;
}

.slider-info .navigation
{
  background-color: #FFF;
  border-radius: 8px;
  position: relative;
  margin-left: auto;
  z-index: 1;
  width: 140px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 0px 0px;
  font-size: 14px;
}

.slider-info .navigation button
{
  appearance: none;
  padding: 10px 10px;
  margin: 0px;
  border: none;
  background-color: transparent;
  cursor: pointer;
  display: flex;
}

.swiper .count
{
  padding: 10px 0px;
}

@media all and ( max-width: 767px )
{
  .swiper
  {
    opacity: 0;
    transition: opacity .6s linear;
    height: calc(100vh - 80px);
  }

  .swiper .img-holder img
  {
    object-fit: cover;
    height: 100%;
    width: 100%;
  }

  .swiper .img-holder video
  {
    transform: translate3d(0,-50%,0);
    position: relative;
      top: 41%;
  }

}

/* Projects */

.thumbnails
{
  width: 95%;
  max-width: 1192px;
  margin: 92px auto 0px auto;
  padding-top: 0px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 110px 2.4%;
}

.thumbnails .img-holder figure
{
  margin:0px;
  width: 100%;
  position: relative;
  height: 0px;
  padding-bottom: 57.2%;
  opacity: 0;
  transition:
  opacity .3s linear;
  overflow: hidden;
}

.thumbnails .img-holder figure img
{
  position: relative;
  top: 0px;
  left: 0px;
  width: 100%;
  height: auto;
  transform: scale(1);
  transition: transform 1.5s ease-out;
}

.thumbnails .img-holder figure:hover img
{
  transform: scale(1.05);
}

.thumbnails .img-holder figure.visible
{
  opacity: 1;
}

.thumbnails .project
{
  flex-basis: 48.8%;
}

.project p.caption
{
  font-size: 15px;
  font-weight: 300;
  margin-top: 16px;
  text-transform: uppercase;
}

.project p.caption a
{
  background-image: linear-gradient(#000,#000);
  background-position: 0 100%;
  background-repeat: no-repeat,no-repeat;
  background-size: 0% 1px;
  transition: all .5s ease;
  padding-bottom: 7px;
}

.project p.caption a::before
{
  display: none;
}

.project p.caption a:hover
{
  background-size: 100% 1px;
}

@media (max-width: 767px) {
  .thumbnails {
    margin: 0px 25px;
    padding-top: 0px;
    width: unset;
    gap: 6.2%;
  }

  .thumbnails .img-holder {
   flex-basis: 100%;
   flex-shrink: 0;
   margin-right: 0%;
   margin-bottom: 6.2%;
 }

}



/* end Projects */

/* Single Project */

body.single-project #work-content
{
  position: relative;
  width: 100%;
  top: 0px;
  left: 0px;
  transform: translate3d(0,0,0);
  transition: transform .6s ease;
  z-index: 1;
}

body.single-project #work-content.hidden
{
  transform: translate3d(0,-110%,0);
}

.slideover-content h1
{
  font-size: 15px;
  font-weight: 300;
  text-transform: uppercase;
  text-align: center;
  margin-bottom: 160px;
}

.slideover-content h2
{
  margin-top: 92px;
}

.slideover-content h2:first-of-type
{
  margin-top: 0px;
}

.slideover-placeholder
{
  height: 0px;
}

.slideover-placeholder.visible
{
  height: 100dvh;
}

.slideover-content .wrap
{
  position: relative;
  bottom: 0px;
  width: 100%;
}

.slideover-content .inner
{
  max-width: 684px;
  margin: 107px auto 0px auto;
  width: var(--rja-content-width);
}

.slideover-content
{
  font-size: 18px;
  font-weight: 400;
  line-height: 33px;
  letter-spacing: 3%;
}

.slideover-content.visible
{
  opacity: 1;
  pointer-events: visible;
}

.slideover-content h2
{
  font-size: 18px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 10%;
  line-height: 21px;
}

footer.project-footer
{
  font-weight: 300;
  font-size: 12px;
  text-align: center;
  text-transform: uppercase;
  margin-top: 240px;
}

footer.project-footer p
{
  margin: 0px;
  line-height: 1.4em;
  margin-bottom: 8px;
}

footer.project-footer p.project-name
{
  font-size: 15px;
  margin-bottom: 0px;
}

footer.project-footer p.project-name a
{
  background-repeat: no-repeat,no-repeat;
  transition: background-position 1s ease, color 1s linear;
  background-image: linear-gradient(#FFF, #FFF), linear-gradient(#000, #000), linear-gradient(#000, #000);
  background-size: 100px 1px, 100% 1px, 0 1px;
  background-position: calc(100px * -1) 100%, 100% 100%, 0 100%;
  padding-bottom: 2px;
}

footer.project-footer p.project-name a:hover
{
  background-size: 100px 1px, 0 1px, 100% 1px;
  background-position: calc(100% + 100px) 100%, 100% 100%, 0 100%;
}

/* end Single Project */

/* About */

body.about .main-text
{
  margin-top: 92px;
}

.media-block
{
  max-width: 924px;
  width: 90%;
  margin: 140px auto 140px auto;
}

.media-block .video-caption
{
  font-size: 15px;
  font-weight: 300;
  margin-top: 16px;
  text-transform: uppercase;
}

.media-block .video-caption p
{
  margin: 0px;
}

.media-block figure.img-holder
{
  width: 100%;
  height: 0px;
  overflow: hidden;
  padding-bottom: 64.56%;
  position: relative;
}

.media-block figure.vid-holder
{
  width: 100%;
  height: 0px;
  overflow: hidden;
  padding-bottom: 56.18%;
  position: relative;
}

.media-block figure.vid-holder video
{
  width:100%;
  height: auto;
}

.about-row
{
  display: flex;
  flex-direction: row;
  gap: 36px;
  max-width: 924px;
  width: 90%;
  margin: 0px auto;
  font-size: 14px;
  line-height: 21px;
  margin-bottom: 100px;
}

.about-row .img-holder
{
  overflow: hidden;
}



.about-row > div
{
  flex-basis: 50%;
  position: relative;
}

.about-row h2,
.about-row p
{
  opacity: 0;
  transform: translateY( 15px );
  transition: .7s all ease;
}

.about-row.visible h2,
.about-row.visible p
{
  opacity: 1;
  transform: translateY( 0px );
}

.about-row .img-holder::after,
.media-block figure.img-holder::after,
.media-block figure.vid-holder::after
{
  display: block;
  width: 100%;
  height: 100%;
  background-color: #FFF;
  position: absolute;
  top: 0px;
  left: 0px;
  content: ' ';
  transform: translateY(0%);
  transition: .7s all ease;

}

.about-row .img-holder.visible::after,
.media-block figure.img-holder.visible::after,
.media-block figure.vid-holder.visible::after
{
    transform: translateY(-100%);
}


.about-row h2
{
  font-size: 14px;
  line-height: 21px;
  text-transform: uppercase;
  font-weight: 300;
}

.about-row h2::before {
  content: "";
  margin-bottom: -0.1641em;
  display: table;
}

.about-row h2::after {
  content: "";
  margin-top: -0.1914em;
  display: table;
}

@media all and (max-width:767px)
{

  .about-row
  {
    flex-direction: column;
  }

  .about-row > div
  {
    flex-basis: 100%;
  }

  .about-row .img-holder img
  {
      width: 61.5%;
  }

  .about-row.right-side
  {
    flex-direction: column-reverse;
  }
}

/* end about */

/* Services */

body.services h1
{
  font-size: 60px;
  line-height: 1.17em;
  letter-spacing: 0.03em;
}

.featured-img figure
{
  width: 100%;
  height: 0px;
  padding-bottom: 47.53%;
  position: relative;
}

.featured-img figure::after
{
  display: block;
  width: 100%;
  height: 100%;
  background-color: #FFF;
  position: absolute;
  top: 0px;
  left: 0px;
  content: ' ';
  transform: translateY(0%);
  transition:.75s all ease;
}

.featured-img figure.visible::after
{
    transform: translateY(-100%);
}

body.services .container.main,
body.contact .container.main
{
  max-width: var(--rja-text-max-width);
  width: var(--rja-content-width);
  margin: 92px auto 0px auto;
}

body.services .section .col, body.contact .section .col {
  font-size: 18px;
  line-height: 33px;
  font-weight: 300;
  flex-basis: 59.5%;
}

body.services h1
{
  font-size: 60px;
  line-height: 1.17em;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  font-weight: 300;
}

body.services .section .col h2, body.contact .section .col h2 {
  font-weight: 400;
  text-transform: uppercase;
  font-size: 18px;
  letter-spacing: 1px;
}

body.services .section,
body.contact .section
{
  display: flex;
  flex-direction: row;
  border-top: 1px solid #000;
  margin-top: 100px;
  padding-top: 30px;
  opacity: 0;
  transform: translateY(50px);
  transition: all .7s ease;
}

body.services .section.visible,
body.contact .section.visible
{
  opacity: 1;
  transform: translateY(0px);
}

body.services .section .col,
body.contact .section .col
{
  font-size: 18px;
  line-height: 33px;
  font-weight: 300;
  flex-basis: 59.5%;
}

#site-container .section .col ul
{
  margin-top: -1em;
}

body.services .section .col p:last-of-type,
body.contact .section .col p:last-of-type
{
  margin-bottom: 0px;
}

.section-id-3 .col {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
}

.section-id-3 .inside-col
{
  flex-basis: 50%;
}

.section-id-3 .col .inside-col.adjusted
{
  line-height: 28px;
}

@media all and ( max-width:767px ){
  body.contact .section .col p:last-of-type
  {
    margin-bottom: 1em;
  }
}

/* end Services */

/* Contact */

.section-id-3 .col h3 {
  text-transform: uppercase;
  margin-bottom: 0px;
  font-weight: 500;
  font-size: 18px;
  letter-spacing: 1px;
}

body.contact .section-id-4 .col > p {
  font-size: 30px;
  line-height: 1.53em;
  letter-spacing: 0.03em;
}

body.contact h1
{
  font-size: 90px;
  line-height: .78em;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  font-weight: 300;
}

#contact-form
{
  margin-top: 50px;
}

#email-conf
{
  position: absolute;
  left: 0px;
  width: 100%;
  background-color: #FFF;
  height: 100%;
  z-index: 1;
  text-align: center;
  font-size: 24px;
  line-height: 1.92em;
  letter-spacing: 0.03em;
  opacity: 0;
  transition: opacity .3s linear;
}

#email-conf.visible
{
  opacity: 1;
}

#email-conf p
{
  margin-top: 190px;
}

@media all and (max-width: 767px)
{

  body.services .container.main,
  body.contact .container.main,
  body.about .main-text
  {
    margin-top: 12px;
  }

  body.services h1,
  body.contact h1
  {
    font-weight: 300;
    font-size: 42px;
    line-height: 1.12em;
    letter-spacing: 0.03em;
    padding: 0px 25px;
  }

  body.services .section, body.contact .section
  {
    box-sizing: border-box;
    padding: 30px 0px 0px 0px;
    flex-wrap: wrap;
    margin: 100px 25px 0px 25px;
  }

  body.services .section .col:first-child,
  body.contact .section .col:first-child
  {
    flex-basis: 100%;
  }

  body.services .section .col h2,
  body.contact .section .col h2
  {
    font-size: 18px;
    line-height: 1.17em;
    letter-spacing: 0.1em;
  }

  .testimonials
  {
    padding: 0px 25px;
    box-sizing: border-box;
  }

  .testimonials > div
  {
    padding-left: 0px;
  }

  .testimonials > div:nth-child(5)
  {
    margin-top: 0px;
  }

  body.services .section, body.contact .section
  {
    box-sizing: border-box;
    padding: 30px 0px 0px 0px;
    flex-wrap: wrap;
    margin: 100px 25px 0px 25px;
  }

  body.services .section .col:first-child,
  body.contact .section .col:first-child
  {
    flex-basis: 100%;
  }

  body.services .section .col h2,
  body.contact .section .col h2
  {
    font-size: 18px;
    line-height: 1.17em;
    letter-spacing: 0.1em;
    margin-bottom: 28px;
  }

  .testimonials
  {
    padding: 0px 25px;
    box-sizing: border-box;
  }

  .testimonials > div:nth-child(5)
  {
    margin-top: 0px;
  }

  body.services .section .col, body.contact .section .col
  {
    flex-basis: 100%;
  }

  .section-id-3 .inside-col
  {
    flex-basis: 100%;
  }

  form .row
  {
    flex-wrap: wrap;
  }

  form .row .half-width
  {
    flex-basis: 100%;
    margin-right: 0px;
  }

  body.contact .section-id-4 .col > p
  {
    font-size: 24px;
    line-height: 1.67em;
  }

  .thumbnails
  {
    margin: 0px 25px;
    padding-top: 0px;
  }

  .testimonials
  {
    columns: 1;
  }

  ul.slides li > .img-holder
  {
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
  }

}

/* Contact Form */

form .row
{
  display: flex;
  flex-direction: row;
}

form .row .half-width
{
  flex-basis: 49%;
  margin-right: 2%;
}

form .row .half-width:last-child
{
  margin-right: 0px;
}

form .row .half-width:last-child
{
  margin-right: 0px;
}

form .email-again
{
  display: none;
}

input[type="text"],
input[type="email"],
textarea
{
  border-width: 0 0 1px;
  border-style: solid;
  border-color: #000;
  background-color: transparent;
  -webkit-appearance: none;
  border-radius: 0;
  width: 100%;
  outline: none;
  font-size: 18px;
  font-family: 'Roboto',sans-serif;
  font-weight: 300;
  padding: 0 0 13px;
}

textarea
{
  height: 122px;
}

label
{
  color: #000;
  font-size: 18px;
  line-height: 21px;
  padding-left: 0;
  position: relative;
  z-index: 1;
  transform: translateY(26px);
  transition: .2s all ease-out;
  transform-origin: left top;
  display: block;
  pointer-events: none;
}

label.filled
{
  transform: translateY(0px);
}

span.error
{
  font-size: 14px;
  color: red;
}

button
{
  -webkit-appearance: none;
  border-radius: 0;
  border: 1px solid #000;
  background-color: #FFF;
  color: #000;
  text-transform: uppercase;
  padding: 10px 46px;
  cursor: pointer;
  transition: all .2s linear;
  font-size: 18px;
  font-weight: 300;
  letter-spacing: .1em;
}

button:hover
{
  background-color: #000;
  color: #FFF;
}

/* end Contact */

/* Testimonials */
.testimonials
{
  columns: 3 242px;
  column-gap: 42px;
  font-size: 14px;
  line-height: 1.5em;
  letter-spacing: 0.05em;
  opacity: 0;
  transform: translateY(50px);
  transition: all .7s ease;
  margin-top: 123px;
}

.testimonials.visible
{
  opacity: 1;
  transform: translateY(0px);
}

.testimonials > div {
  width: 100%;
  display: inline-block;
  box-sizing: border-box;
  padding-right: 0px;
  margin-bottom: 80px;
  padding-left: 0px;
  box-sizing: border-box;
  border-bottom: 1px solid #000;
  padding-bottom: 40px;
}

.testimonials > div p:last-child
{
  margin-bottom: 0px;
}


.testimonials > div:first-child
{
  padding-top: 162px;
  background-image: url('/images/quote.svg');
  background-size: 80px auto;
  background-repeat: no-repeat;
  background-position: center top;
}

.testimonials > div:nth-child(5)
{
  margin-top: 162px;
}

@media all and (max-width: 900px)
{
  .testimonials
  {
    columns: 3 202px;
  }
}

@media all and (max-width: 900px){
  .testimonials > div
  {
    padding-left: 0px;
    margin-bottom: 40px;
  }

  .testimonials > div:nth-child(5)
  {
    margin-top: 0px;
  }
}

/* End Testimonials */

/*  Footer */

.site-footer
{
  background-color: #FFF;
  width: 100%;
  font-size: 15px;
  line-height: 21px;
  margin-top: 150px;
  margin-bottom: 20px;
}

.site-footer p
{
  margin: 0px;
}

.site-footer .wrap
{
  width: var(--rja-content-width);
  max-width: var(--rja-max-width);
  margin: 220px auto 0px auto;
  border-top: 1px solid #000;
  padding: 20px 0px;
  display: flex;
  flex-direction: row;
}

.instagram-link
{
  align-self: flex-start;
  width: 204px;
  margin-right: auto;
  display: flex;
  flex-direction: row;
  align-items: center;
}

.instagram-link .img-holder
{
  width: 20px;
  margin-right: 18px;
}

/* end of Footer */
