@import url('https://fonts.googleapis.com/css?family=Roboto:100,300,400,500');


body {
  padding-top: 0 !important;
  font-family: 'Roboto', sans-serif;
}


html, body{
  color: #010101;
  background-color: #fcfcfc;
/*  #f6f6f6;*/
  /*f4*/
}


/*TRANSITION LINKS*/
a {
  text-decoration: none;
/*  color: #9aa3ab;*/
  color: #000;
  transition: all 0.125s ease-in-out 0s;
}

.footer a{
  text-decoration: none;
  color: #9aa3ab;
/*  color: #000;*/
  transition: all 0.125s ease-in-out 0s;
}

a:hover, a:focus, a:active {
  text-decoration: none;
  
  color: #5e666e;
  outline: 0;
}

.text-left{
  text-align: left;
}

/*MAKE ALL FLUID IMAGES 100% WIDTH*/
.img-fluid{
  min-width: 100%;
}

.nm-10{
  margin-top: -10rem;
}
.nm-2{
  margin-top: -2rem;
}


.card-text{
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.2;
/*  letter-spacing: 1px;*/
}


/*FONT STYLES*/
.display-1, .display-2, .display-3, .display-4 {
  font-weight: 100;
}
.display-5 {
  font-size: 2.5rem;
  font-weight: 100;
  line-height: 1.2;
}
.display-6 {
  font-size: 1.5rem;
  font-weight: 100;
  line-height: 1.2;
}

/*make header font smaller on mobile*/
@media (max-width: 767px) {
  .display-4 {
    font-size: 3.0rem;
    /*font-weight: 100;*/
    /*line-height: 1.2;*/
  }
  .display-5 {
    font-size: 2.0rem;
    /*font-weight: 100;*/
    /*line-height: 1.2;*/
  }
  
}

.sub-head{
  text-transform: uppercase;
  letter-spacing: 2px;
  font-size: 16px;

}


/*VIEWPORT HEIGHT*/
/*.vh-100{
  height: 100vh;
}*/

.vh-100{
  min-height: 100vh;
}

.pagination .page-item .page-link{
  color: #000;
}
.pagination .page-item.active .page-link{
  background-color: #000;
  border-color: #000;
  color: #fff;
}



/*PADDINGS / MARGINS*/

.nopadding {
  margin: 0 !important;
  padding: 0 !important;
}

.pt-20{
  padding-top: 20px;
}
.pb-20{
  padding-bottom: 20px;
}
.pt-40{
  padding-top: 40px;
}
.pb-40{
  padding-bottom: 40px;
}
.pt-80{
  padding-top: 80px;
}
.pb-80{
  padding-bottom: 80px;
}
.pt-160{
  padding-top: 160px;
}
.pb-160{
  padding-bottom: 160px;
}
.mt-20{
  margin-top: 20px;
}
.mb-20{
  margin-bottom: 20px;
}
.mt-40{
  margin-top: 40px;
}
.mb-40{
  margin-bottom: 40px;
}
.mt-80{
  margin-top: 80px;
}
.mb-80{
  margin-bottom: 80px;
}
.mt-160{
  margin-top: 160px;
}
.mb-160{
  margin-bottom: 160px;
}


/*ITEM MIN HEIGHT*/
.min-400 {
    min-height: 400px;
}
.min-500 {
    min-height: 500px;
}
.min-600 {
    min-height: 600px;
}


.zi-1030{
  position: relative;
  z-index: 930;
}
.fg-white{
  color: #efefef;
}


/*BG COLOR UTILITY*/
.color1{
  color: #efefef;
  background-color: #0a0a0a;
}
.color2{
  color: #efefef;
  background-color: #292929;
}
.color3{
  color:#424242;
  background-color: #ffffff;
}
.color4{
  background-color: #f6f2ef;
}

.color5{
  color:#1a1a1a;
  background-color: #efefef;
}
/*.bg-img{
  background-image:url(../);
  background-repeat:none;
  background-attachment:scroll;
  background-position:center center;
  -webkit-background-size:cover;
  -moz-background-size:cover;
  background-size:cover;
  -o-background-size:cover;
}


.bg-img .img-tint, .bg-img-fixed .img-tint {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,.5);
}


.bg-img .img-tint-lt, .bg-img-fixed .img-tint-lt{
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: rgba(255,255,255,.5);
}*/


/*BACKGROUND IMAGES*/

.bg-img{
  /*IMAGE ADDED VIA JS - DATA ATTRIBUTE*/
  /*background-image:url(../img/image.jpg);*/
  background-repeat:no-repeat;
  background-attachment:scroll;
  background-position:center center;

  -webkit-background-size:contain;
  -moz-background-size:contain;
  background-size:contain;
  -o-background-size:contain;
}

.bg-img-cover{
  -webkit-background-size:cover;
  -moz-background-size:cover;
  background-size:cover;
  -o-background-size:cover;
}

.bg-img .img-tint {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,.5);
}

.bg-img .img-tint-lt{
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: rgba(255,255,255,.5);
}


.tinted-section{
  position: relative;
}
.tint-item-white{
  position: absolute;
  top: 0;
  z-index: 920;
  width: 100%;
  height: 100%;
  background-color: rgba(255,255,255,0.3);
}
.tint-color{
  color:#1a1a1a;
  background-color: rgba(255,255,255,.75);
}


.card {
  /*position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;*/
  
  background-color: transparent;
  /*background-clip: border-box;*/
  border: 0px;
  border-radius: 0;
}

.card-body {
/*flex: 1 1 auto;*/
padding: 1rem 0;
height: 100px;
/*background-color: #eee;*/
}

/*HEADERS*/
header h1 {
  letter-spacing: 3px;
}
header{
  /*text-align:center;*/
}

/*FOOTER*/

.footer-nav .nav-link{
  color: #5d5d5d;
  font-size: 13px;
}





footer {
/*  color: #F4F4F4;*/
/*color: #868e96;*/
/*  background-color: #242424;*/
background-color: #f5f5f5;



  padding: 10px 0;
  
  font-size: 13px;
  margin: 0;
}
footer .footer-social-links {
  text-align: right;
  font-size: 18px;
}
footer .footer-social-links a {
  display: inline-block;
  padding: 0 6px;
}


/*DIVIDER*/
.divider-d {
  width: 35px;
  border-top: 3px solid #1a1a1a;
  margin: 0;
}


/*BUTTONS*/
.corner-btn {
  text-transform: uppercase;
  letter-spacing: 1px;
  font-size: 12px;
  font-weight: 500;
  padding: 0.7rem 1.4rem;
  min-width: 140px;
}
.square-btn {
  border-radius: 0 !important;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-size: 12px;
  font-weight: 500;
  padding: 0.7rem 1.4rem;
  min-width: 140px;
}
.rounded-btn {
  border-radius: 42px !important;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-size: 12px;
  font-weight: 500;
  padding: 0.7rem 1.4rem;
  min-width: 140px;
}
.round-btn {
  border-radius: 42px !important;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-size: 12px;
  font-weight: 500;
  padding: 0.7rem 0.9rem;
}

.nav-pills .nav-item{
  padding-right: 10px;
}
.nav-pills .nav-link{
  border-radius: 42px !important;
  background-color: #F4F4F4 !important;
}
.nav-pills .nav-link.active{
  /*border-radius: 42px !important;*/
  color: #fff !important;
  background-color: #000 !important;
}


/*TEXT CAROUSEL*/
.carousel-text-lg .carousel-caption{
  font-size: 36px;
  color: #efefef;
  /*min-height: 200px;*/
}
.carousel-text-lg .carousel-item{
  /*font-size: 56px;*/
  min-height: 200px;
}

.carousel-control-next,
.carousel-control-prev /*, .carousel-indicators */ {
    filter: invert(100%);
}

/*PORTFOLIO*/

/*PORTFOLIO FILTER*/

/*.filter a {
  text-decoration: none;
}*/
.filter {
  list-style: none;
  padding: 0;
  margin: 0 0 70px;
}
.filter > li {
  letter-spacing: 2px;
  display: inline-block;
  padding: 0 0 10px;
  margin-right: 20px;
}
/*SELECTED FILTER*/
.filter li .current{
  color: #1a1a1a;
}



/*PORTFOLIO GRID*/
.works-grid {
  list-style: none;
  padding: 0;
  margin: 0;
}
/*OPTIONAL GUTTER*/
.works-grid.works-grid-gut {
  margin: 0 0 0 -10px;
}
.works-grid.works-grid-gut .work-item {
  padding: 0 0 10px 10px;
}
.work-item {
  width: 50%;
  float: left;
  margin: 0;
}
/*3 column*/
.works-grid-3 .work-item {
  width: 33.3333%;
}
.container .works-grid-3 .work-item {
  width: 33.2%;
}
/*make 3 column grid 2 column on mobile*/
@media (max-width: 767px) {
  .container .works-grid-3 .work-item {
    width: 50%;
  }
}
.works-grid-4 .work-item {
  width: 25%;
}
.works-grid-5 .work-item {
  width: 20%;
}
.work-item > a {
  position: relative;
  display: block;
  overflow: hidden;
}
.work-image {
  position: relative;
  overflow: hidden;
}
.work-image img {
  display: block;
  overflow: hidden;
  width: 100%;
}
.work-image:after {
  position: absolute;
  display: block;
  content: "";
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}
.work-caption {
  width: 100%;
  padding: 0 20px;
  opacity: 0;
  position: absolute;
  bottom: 36%;
  left: 0;
  text-align: center;
  overflow: hidden;
}
.work-title {
  letter-spacing: 2px;
  font-size: 14px;
  color: #fff;
  margin: 0 0 6px;
}
.work-descr {
  letter-spacing: 1px;
  color: #999;
}
.work-item:hover .work-image:after {
  background: rgba(0, 0, 0, 0.6);
}
.work-item:hover .work-image > img {
  -webkit-transform: scale(1.1);
  -ms-transform: scale(1.1);
  transform: scale(1.1);
}
.work-item:hover .work-caption {
  bottom: 50%;
  opacity: 1;
  z-index: 3;
  -webkit-transform: translateY(50%);
  -ms-transform: translateY(50%);
  transform: translateY(50%);
}
/* Work item white background*/
.works-grid.works-hover-w .work-title {
  color: #111;
}
.works-grid.works-hover-w .work-item:hover .work-image:after {
  background: rgba(255, 255, 255, 0.8);
}
 
.work-caption,
.work-image > img,
.work-image:after{
  transition: all 0.3s ease-in-out 0s;
}


/*NAV*/

/*use a logo image*/
.navbar-brand img {
  height: 25px;
  padding-right: 10px;
  margin-top: -4px;
}
.navbar-brand {
  position: relative;
  color: #010101 !important;
  top: 0px;
  font-size: 16px;
  font-family: 'Roboto', sans-serif;
  text-transform: uppercase;
  letter-spacing: 2px;
}
.fullscreen-nav{
  pointer-events: none;
  position: fixed;
  z-index: 3000;
  top: 0;
  left: 0%;
  min-height: 100%;
  min-width: 100%;
  background-color: #F4F4F4;
  visibility:hidden;
  opacity:0;
  -webkit-transform: translateX(0%);
  transform: translateX(0%);
  transition: transform .3s cubic-bezier(.694, .048, .335, 1), visibility 2s ease-in-out 2.6s, opacity 0.35s ease-in-out 1.6s;
  transition-delay: 0.1s;
}
@media (max-width: 767px) {
  .fullscreen-nav{
    min-width: 100%;
  }
}
.fullscreen-nav.active{
  visibility:visible;
  opacity: 1;
  -webkit-transform: translateX(0%);
  transform: translateX(0%);
  transition: transform .35s cubic-bezier(.694, .048, .335, 1),visibility 0s ease-in-out 0.0s,opacity 0.35s ease-in-out;
}
.nav-contain{
  pointer-events: auto;
  width: 100%;
}
#toggler{
  pointer-events: auto;
  position: fixed;
  top:8px;
  right:10px;
  color: #222;
  z-index: 3001 !important;
  padding: 0.5rem 0.75rem;
  font-size: 1rem;
  line-height: 1.25;
  border-radius: 0.25rem;
}
.icon-bar {
  display: block;
  width: 22px;
  height: 2px;
  border-radius: 1px;
  background-color: #888;
  margin-top: 4px;
}
.nav-toggle {
  -webkit-transform: rotate(0deg);
          transform: rotate(0deg);
          -webkit-transition: -webkit-transform 0s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: -webkit-transform 0s cubic-bezier(0.694, 0.048, 0.335, 1);
  -webkit-transition-delay: 0.4s;
          transition-delay: 0.4s;
}
.nav-toggle .icon-bar:nth-of-type(1) {
  margin-top: 1px;
  -webkit-transform: scaleX(1);
          transform: scaleX(1);
  -webkit-transition: -webkit-transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: -webkit-transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1), -webkit-transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
  -webkit-transition-delay: 0.4s;
          transition-delay: 0.4s;
}
.nav-toggle .icon-bar:nth-of-type(2) {
  -webkit-transform: scaleX(1);
          transform: scaleX(1);
  -webkit-transition: -webkit-transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: -webkit-transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1), -webkit-transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
  -webkit-transition-delay: 0.4s;
          transition-delay: 0.4s;
}
.nav-toggle .icon-bar:nth-of-type(3) {
  -webkit-transform: scaleX(1);
          transform: scaleX(1);
  -webkit-transition: -webkit-transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: -webkit-transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1), -webkit-transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
  -webkit-transition-delay: 0.4s;
          transition-delay: 0.4s;
}
.nav-toggle .other-bar {
  display: block;
  border-radius: 1px;
  width: 2px;
  height: 22px;
  background-color: #888;
  position: absolute;
  top: 5px;
  margin-left: 10px;
  -webkit-transform: scaleY(0);
          transform: scaleY(0);
  -webkit-transition: -webkit-transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: -webkit-transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1), -webkit-transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
  -webkit-transition-delay: 0.0s;
          transition-delay: 0.0s;
  z-index: 10;
}
.nav-toggle .other-bar2 {
  display: block;
  border-radius: 1px;
  width: 22px;
  height: 2px;
  background-color: #888;
  position: absolute;
  top: 15px;
  margin-left: -0px;
  -webkit-transform: scaleX(0);
          transform: scaleX(0);
  -webkit-transition: -webkit-transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: -webkit-transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1), -webkit-transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
  -webkit-transition-delay: 0.0s;
          transition-delay: 0.0s;
  z-index: 10;
}
.nav-toggle.active {
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
          -webkit-transition: -webkit-transform 0s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: -webkit-transform 0s cubic-bezier(0.694, 0.048, 0.335, 1);
  -webkit-transition-delay: 0.4s;
          transition-delay: 0.4s;
}
.nav-toggle.active .icon-bar:nth-of-type(1) {
  -webkit-transform: scaleX(0);
          transform: scaleX(0);
  -webkit-transition: -webkit-transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: -webkit-transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1), -webkit-transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
  -webkit-transition-delay: 0.0s;
          transition-delay: 0.0s;
}
.nav-toggle.active .icon-bar:nth-of-type(2) {
  -webkit-transform: scaleX(0);
          transform: scaleX(0);
  -webkit-transition: -webkit-transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: -webkit-transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1), -webkit-transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
  -webkit-transition-delay: 0.0s;
          transition-delay: 0.0s;
}
.nav-toggle.active .icon-bar:nth-of-type(3) {
  -webkit-transform: scaleX(0);
          transform: scaleX(0);
  -webkit-transition: -webkit-transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: -webkit-transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1), -webkit-transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
  -webkit-transition-delay: 0.0s;
          transition-delay: 0.0s;
}
.nav-toggle.active .other-bar {
  -webkit-transform: scaleY(1);
          transform: scaleY(1);
  -webkit-transition: -webkit-transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: -webkit-transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1), -webkit-transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
  -webkit-transition-delay: 0.4s;
          transition-delay: 0.4s;
}
.nav-toggle.active .other-bar2 {
  -webkit-transform: scaleX(1);
          transform: scaleX(1);
  -webkit-transition: -webkit-transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: -webkit-transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
          transition: transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1), -webkit-transform 0.2s cubic-bezier(0.694, 0.048, 0.335, 1);
  -webkit-transition-delay: 0.4s;
          transition-delay: 0.4s;
}
.fullscreen-nav .nav-link {
  color: #888;
  font-size: 2.5rem;
  font-weight: 300;
  letter-spacing: 0px;
  opacity: 1;
  transition: all 0.125s ease-in-out 0s;
}


/*smaller nav link on mobile*/
@media (max-width: 767px) {
  .fullscreen-nav .nav-link {
    font-size: 1.5rem;
  }
}

.nav-item .active {
  color: #292929
}


/*OPTIONAL NAV GRADIENT*/
.bg-nav-grad{
  /*background-image: linear-gradient(rgba(42,42,42,1) 40% , rgba(42,42,42,0) );*/
  /*background-image: linear-gradient(rgba(239,239,239,1) 40% , rgba(239,239,239,0) );*/
}



/*OWL CAROUSEL - IN MODAL*/

.fullscreen {
    min-width: 100% !important;
    height: 100% !important;
    margin: 0;
    top: 0;
    left: 0;
    z-index: 3999;
}

.close{
  position: fixed;
  z-index: 4000;
  right: 24px;
  top: 20px;
}

.close{
  -webkit-filter: drop-shadow( 0px 0px 2px rgba(255,255,255,1));
  filter: drop-shadow( 0px 0px 2px rgba(255,255,255,1));
}
.close:hover{
  cursor: pointer;
}



/*-------------------------------------------------------------------*/

/*OWL CAROUSEL*/

.carousel-section .slide-item {
  position: relative;
  /*height: 720px;*/
}
.carousel-slider .dots-container{
  position: absolute;
  bottom: 20px;
}
.carousel-slider .dots-block{
  display: inline-block;
}
.carousel-slider .nav-container{
  position: absolute;
  right: 0;
  width: 100%;
  top: 50%;
}


/* DOTS */
.carousel-slider .owl-dots {
  display: -ms-flex;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-top: 9px;
}

.carousel-slider .owl-dots .owl-dot {
  width: 8px;
  height: 8px;
  background: #fff;
  border-radius: 15px;
  margin-right: 10px;
  opacity: 0.25;
/*  width: 16px;
  height: 16px;*/
  width: 8px;
  height: 8px;
}

.carousel-slider .owl-dots .owl-dot.active {
  opacity: 1;
}

.carousel-slider .owl-dots .owl-dot:last-child {
  margin-right: 0;
}




/* NAV BUTTONS */

.carousel-slider .owl-nav button.owl-next,
.carousel-slider .owl-nav button.owl-prev {
  font-size: 27px;
  position: absolute;
  color: #fff;
  padding: 10px !important; 
  top:-30px;
  opacity: 0.5;
  -webkit-transition: opacity 0.2s ease;
  -o-transition: opacity 0.2s ease;
  transition: opacity 0.2s ease;
}

.carousel-slider .owl-nav button.owl-next:hover,
.carousel-slider .owl-nav button.owl-prev:hover {
  opacity: 1;
}

.carousel-slider .owl-nav button.owl-next {
  right: 10px;
}

.carousel-slider .owl-nav button.owl-prev {
  left: 10px;
}


.cFull{
  /*position: relative;
  top: -42px;
  left: 5px;
  z-index: 3998;
  font-size: 1.25rem !important;*/
}

/*-------------------------------------------------------------------*/