/*

Custom CSS
Ersin Yılmaz
hey@ersiny.com

*/
/* Base */
html,
body {
  outline: none!important;
  text-shadow: 1px 1px 1px rgba(0,0,0,0.004);
  -webkit-font-smoothing: antialiased!important;
  text-rendering: optimizeLegibility;
  font-family: 'Roboto', sans-serif;
  letter-spacing: 1px;
  font-weight: 400;
  background: #f4f4f4!important;
  color: #1b1b1c;
}
.letter-spacing-reset {
  letter-spacing: 0;
}
a, a * {
  cursor: pointer!important;
}
*:focus,
a:hover {
  color: #1b1b1c;
  outline: none!important;
  text-decoration: none!important;
}
.page-layout h4 a:hover {
  color: #1b1b1c;
}

.uk-h1, .uk-h2, .uk-h3, .uk-h4, .uk-h5, .uk-h6, h1, h2, h3, h4, h5, h6,
ul.uk-navbar-nav>li>a,
.uk-navbar-item,
.uk-button {
  color: #1b1b1c;
  word-wrap: break-word!important;
}
h1 {
  font-size: 38px!important;
  font-weight: 500!important;
  line-height: 48px!important;
  letter-spacing: 1px!important;
}
h2+p,
h3+p,
h4+p {
  margin-top: -10px;
}
p+ul {
  margin-top: -10px;
}

/* Color */
.uk-text-default {
  color: #333;
}
.uk-background-dark,
.uk-background-dark:not(.uk-navbar-transparent) {
  background: #1b1b1c!important;
  background-color: #1b1b1c!important;
}
.uk-background-grey,
.uk-navbar-container:not(.uk-navbar-transparent) {
  background: #f4f4f4;
  background-color: #f4f4f4;
}
.uk-background-white {
  background: #fff;
  background-color: #fff;
}
.equipment {
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
.equipment:hover {
  background: #fff;
  background-color: #fff;
}

/* Text */
@media (max-width: 639px) {
  .uk-heading-hero {
    font-size: 2.5rem;
  }
}
.uk-text-white {
  color: #fff!important;
}
.uk-text-grey,
a.uk-link-grey,
a.uk-link-grey:hover,
a.uk-link-grey:focus {
  color: #444;
}
.uk-text-dark,
.uk-text-dark:hover {
  color: #1b1b1c;
}
.uk-text-xsmall {
  font-size: 0.7rem!important;
}
.uk-text-xxsmall {
  font-size: 0.6rem!important;
}
.uk-text-bold {
  font-weight: 700!important;
}

/* Link Hover */
@-webkit-keyframes footer-link-hover {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  50% {
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
  }
  50.01% {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }
  to {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes footer-link-hover {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  50% {
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
  }
  50.01% {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }
  to {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
#footer {
  padding-top: 6vw;
  padding-bottom: 6vw
}
#footer .uk-link-hover {
  display: inline-block;
  position: relative;
  overflow: hidden;
  padding-bottom: .5em;
}
.uk-link-hover:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0;
  border-bottom: .2rem solid;
  transition: all .8s cubic-bezier(.555, .205, .295, .975);
}
#footer .uk-link-hover:hover:after {
  -webkit-animation: footer-uk-link-hover .8s cubic-bezier(.58, .3, .005, 1) 0s 1;
  animation: footer-uk-link-hover .8s cubic-bezier(.58, .3, .005, 1) 0s 1;
}

/* Height */
.uk-height-auto {
  height: auto!important;
}
.uk-height-xlarge {
  height: 50vh;
}
.uk-height-xxlarge {
  height: 70vh;
}
.uk-height-gridbox {
  height: calc(100vh - 200px);
  min-height: 500px!important;
}
@media (max-width:960px) {
  .uk-height-xlarge,
  .uk-height-xxlarge {
    height: 370px!important;
  }
  .uk-height-gridbox {
    min-height: 400px!important;
    height: calc(30vh);
  }
}
@media (max-width:640px) {
  .uk-height-xlarge,
  .uk-height-xxlarge {
    height: 370px!important;
  }
  .uk-height-gridbox {
    min-height: 220px!important;
    height: calc(30vh);
  }
}

@media (max-width:640px) {
  #remove-margin.uk-margin-large-left {
    margin: 0!important;
  }
}

/* Headig */
.uk-heading-line>:after {
    left: 100%;
    margin-left: .3em;
}
.uk-heading-line>:after, .uk-heading-line>:before {
    /* top: calc(50% - (1px / 2)); */
    top: auto;
    bottom: 6px;
 }

/* Button */
.uk-button-default {
  color: #1b1b1c;
  border: 1px solid #1b1b1c;
}
.uk-button-white {
  color: #fff;
  border: 1px solid #fff;
}

/* Label & Badge */
.uk-label {
  padding: 2px 8px 3px 8px;
}
.uk-badge {
  padding: 2px 8px 4px 8px;
}
.uk-badge-black,
.uk-label-black {
  color: #fff;
  background: #222;
}
.uk-badge-dark,
.uk-label-dark {
  color: #fff;
  background: #999;
}
.uk-badge-grey,
.uk-label-grey {
  color: #222;
  background: #ddd;
}
.uk-badge-light,
.uk-label-light {
  color: #222;
  background: #efefef;
}

/* Table */
.uk-table {
  border: 1px solid #e5e5e5;
}
.uk-table-small td,
.uk-table-small th {
  padding: 10px;
}
.uk-table-hover tbody tr:hover,
.uk-table-hover>tr:hover {
  background:#f8f8f8;
}

/* Meta */
.meta a {
  text-decoration: none;
}
#headline {
  width: 45px;
  border-top: 8px solid rgba(0,0,0,0);
  border-bottom: 2px solid #1b1b1c;
}
@media (max-width: 1200px) {
  #headline {
    width: 25px;
  }
}

/* Card */
.uk-card-primary {
    background: #444;
    color: #666;
    box-shadow: 0 0 0 rgba(0,0,0,0);
}
.uk-card-title a:hover {
  text-decoration: none;
}

/* Tabs */
.uk-tab>*>a {
  text-transform: none;
}
.uk-tab>.uk-active>a {
  border-color: #333;
}

/* Navbar */
ul.uk-navbar-nav>li>a {
  font-size: 1rem;
  font-weight: 700;
  color: #1b1b1c;
  padding: 0 20px;
  text-transform: none;
}
ul.uk-navbar-nav>li>a.uk-button {
  height: normal;
  line-height: normal;
  padding: 15px 20px!important;
}
.uk-logo.uk-navbar-item img {
  width: 136px;
  height: 60px;
}
.uk-light.uk-active {
  color: inherit;
}
h1.uk-light,
.uk-light .uk-navbar-nav>li>a {
  color: rgba(255,255,255,.8)!important;
}
.uk-navbar-nav>li>a {
  color: #1b1b1c;
}
#navbar,
#navbar .uk-navbar-item,
#navbar .uk-navbar-toggle,
#navbar .uk-navbar-nav>li>a,
#navbar .uk-logo.uk-navbar-item img,
#navbar .uk-navbar-nav>li>a.uk-button {
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
#navbar.uk-active {
  padding-top: 20px!important;
  padding-bottom: 20px!important;
}
#navbar.uk-active .uk-navbar-item,
#navbar.uk-active .uk-navbar-toggle,
#navbar.uk-active .uk-navbar-nav>li>a {
  height: 60px;
}
#navbar.uk-active .uk-navbar-nav>li>a.uk-button {
  height: normal;
  line-height: normal;
  padding: 10px 20px!important;
}
#navbar.uk-active .uk-logo.uk-navbar-item img {
  width: 110px;
  height: 48px;
}
.uk-navbar-nav>li>a:not(.uk-button) {
    position: relative;
    color: #1b1b1c;
    text-decoration: none;
    transition: color .2s cubic-bezier(.72, .16, .345, .875);
    outline: none
}
.uk-navbar-nav>li>a:not(.uk-button) span {
    position: absolute;
    top: 50%;
    left: -.5rem;
    width: calc(100% + 1rem);
    height: 0;
    border-bottom: .2rem solid;
    margin-top: -.1rem;
    -webkit-transform: scaleX(0)!important;
    transform: scaleX(0)!important;
    -webkit-transform-origin: left center!important;
    transform-origin: left center!important;
}

/* Subnav */
.uk-subnav>*:nth-child(n+2) {
  padding-left: 15px;
}
.uk-subnav>*>:first-child {
  text-transform: none;
}
.uk-subnav-pill>*>:first-child {
  background: #ddd;
  color: #444;
}
.uk-subnav-pill>*>:first-child:hover {
  background: #ccc;
  color: #222;
}
.uk-subnav-pill>.uk-active>a,
.uk-subnav-pill>.uk-active>a:hover {
  background-color: #333;
  color: #efefef;
}

/* Overlay */
.uk-overlay-dark {
  background-color: rgba(0,0,0,0.65);
}
.uk-overlay-secondary {
  background-color: rgba(0,0,0,0.3);
}
.uk-overlay-secondary-light {
  background-color: rgba(0,0,0,0.1);
}

/* Footer */
#footer .uk-subnav * {
  text-transform: none!important;
}
#footer .uk-subnav .uk-active a {
  color: #fff;
}
#footer h5 {
  font-weight: 600;
  color: #fff!important;
  margin-bottom: 10px;
}
#footer .uk-h3,
#footer .uk-h4 {
  font-weight: 300;
  color: #fff!important;
}
#footer .uk-logo {
  opacity: .3!important;
}

/* Services */
#services .uk-grid>div:nth-child(n+2) .uk-overlay::after {
  content: "";
  position: absolute;
  top: -3000px;
  left: 0;
  height: 100%;
  width: 1px;
  background-color: #fff;
  opacity: 0;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
#services:hover .uk-grid>div:nth-child(n+2) .uk-overlay::after {
  top: 0;
  opacity: .1;
}
@media (max-width: 960px) {
  #services .uk-grid>div:nth-child(n+2) .uk-overlay::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: -100vw;
    height: 1px;
    width: 100vw;
    background-color: #fff;
    opacity: 0;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
  }
  #services:hover .uk-grid>div:nth-child(n+2) .uk-overlay::after {
    left: 0;
    opacity: .1;
  }
}
#services .dash,
#services .dash:hover {
  height: 0;
  width: 3rem;
  display: inline-block;
  vertical-align: middle;
  border-top: .2rem solid;
  top: -.1rem;
  position: relative;
  color: #fff;
}

/* Scale */
.item-scale-up,
.item-scale-down {
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
.item-scale-up:hover {
  -ms-transform: scale(1.1, 1.1); /* IE 9 */
  -webkit-transform: scale(1.1, 1.1); /* Safari */
  transform: scale(1.2, 1.2);
}
.item-scale-down:hover {
  -ms-transform: scale(.9, .9); /* IE 9 */
  -webkit-transform: scale(.9, .9); /* Safari */
  transform: scale(.9, .9);
}

/* Modal */
.uk-modal-close-full {
  background: none!important;
}

/* Width */
.uk-width-xsmall {
  width: 60px;
}
/* Widget */
.player-control {
  cursor: pointer!important;
}
.player-control:active {
  opacity: .9;
}

/* AddtThis */
.addthis_follow * {
  cursor: pointer!important;
}

/* Responsive Videos */
.video-wrapper {
  padding-bottom: 56.25%;
  position: relative;
  height: 0;
}
.uk-switcher .video-wrapper {
  margin-bottom: 0;
}
.video-wrapper iframe {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: absolute;
}

/* Cover media without uk-cover: UIkit sizes uk-cover in JS, which shifted the layout (CLS) */
.cover-fill {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Row gaps before UIkit JS adds .uk-grid-margin to wrapped rows (same values as uikit.css, avoids CLS) */
.uk-grid-large.grid-static-rows { margin-top: -40px; }
.uk-grid-large.grid-static-rows > * { margin-top: 40px; }
@media (min-width: 1200px) {
  .uk-grid-large.grid-static-rows { margin-top: -70px; }
  .uk-grid-large.grid-static-rows > * { margin-top: 70px; }
}
/* Reserve the HubSpot form height so the map and footer do not jump when it loads */
.hubspot-form-slot { min-height: 760px; }
@media (min-width: 960px) {
  .hubspot-form-slot { min-height: 650px; }
}
