@font-face{font-family:'Roboto';font-style:normal;font-weight:300;src:local('Roboto Light'),local(Roboto-Light),url(https://fonts.gstatic.com/s/roboto/v19/KFOlCnqEu92Fr1MmSU5fCRc4EsA.woff2) format("woff2");unicode-range:U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:'Roboto';font-style:normal;font-weight:300;src:local('Roboto Light'),local(Roboto-Light),url(https://fonts.gstatic.com/s/roboto/v19/KFOlCnqEu92Fr1MmSU5fABc4EsA.woff2) format("woff2");unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:'Roboto';font-style:normal;font-weight:300;src:local('Roboto Light'),local(Roboto-Light),url(https://fonts.gstatic.com/s/roboto/v19/KFOlCnqEu92Fr1MmSU5fCBc4EsA.woff2) format("woff2");unicode-range:U+1F00-1FFF}@font-face{font-family:'Roboto';font-style:normal;font-weight:300;src:local('Roboto Light'),local(Roboto-Light),url(https://fonts.gstatic.com/s/roboto/v19/KFOlCnqEu92Fr1MmSU5fBxc4EsA.woff2) format("woff2");unicode-range:U+0370-03FF}@font-face{font-family:'Roboto';font-style:normal;font-weight:300;src:local('Roboto Light'),local(Roboto-Light),url(https://fonts.gstatic.com/s/roboto/v19/KFOlCnqEu92Fr1MmSU5fCxc4EsA.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+1EA0-1EF9,U+20AB}@font-face{font-family:'Roboto';font-style:normal;font-weight:300;src:local('Roboto Light'),local(Roboto-Light),url(https://fonts.gstatic.com/s/roboto/v19/KFOlCnqEu92Fr1MmSU5fChc4EsA.woff2) format("woff2");unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Roboto';font-style:normal;font-weight:300;src:local('Roboto Light'),local(Roboto-Light),url(https://fonts.gstatic.com/s/roboto/v19/KFOlCnqEu92Fr1MmSU5fBBc4.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Roboto';font-style:normal;font-weight:400;src:local(Roboto),local(Roboto-Regular),url(https://fonts.gstatic.com/s/roboto/v19/KFOmCnqEu92Fr1Mu72xKOzY.woff2) format("woff2");unicode-range:U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:'Roboto';font-style:normal;font-weight:400;src:local(Roboto),local(Roboto-Regular),url(https://fonts.gstatic.com/s/roboto/v19/KFOmCnqEu92Fr1Mu5mxKOzY.woff2) format("woff2");unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:'Roboto';font-style:normal;font-weight:400;src:local(Roboto),local(Roboto-Regular),url(https://fonts.gstatic.com/s/roboto/v19/KFOmCnqEu92Fr1Mu7mxKOzY.woff2) format("woff2");unicode-range:U+1F00-1FFF}@font-face{font-family:'Roboto';font-style:normal;font-weight:400;src:local(Roboto),local(Roboto-Regular),url(https://fonts.gstatic.com/s/roboto/v19/KFOmCnqEu92Fr1Mu4WxKOzY.woff2) format("woff2");unicode-range:U+0370-03FF}@font-face{font-family:'Roboto';font-style:normal;font-weight:400;src:local(Roboto),local(Roboto-Regular),url(https://fonts.gstatic.com/s/roboto/v19/KFOmCnqEu92Fr1Mu7WxKOzY.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+1EA0-1EF9,U+20AB}@font-face{font-family:'Roboto';font-style:normal;font-weight:400;src:local(Roboto),local(Roboto-Regular),url(https://fonts.gstatic.com/s/roboto/v19/KFOmCnqEu92Fr1Mu7GxKOzY.woff2) format("woff2");unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Roboto';font-style:normal;font-weight:400;src:local(Roboto),local(Roboto-Regular),url(https://fonts.gstatic.com/s/roboto/v19/KFOmCnqEu92Fr1Mu4mxK.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Roboto';font-style:normal;font-weight:500;src:local('Roboto Medium'),local(Roboto-Medium),url(https://fonts.gstatic.com/s/roboto/v19/KFOlCnqEu92Fr1MmEU9fCRc4EsA.woff2) format("woff2");unicode-range:U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:'Roboto';font-style:normal;font-weight:500;src:local('Roboto Medium'),local(Roboto-Medium),url(https://fonts.gstatic.com/s/roboto/v19/KFOlCnqEu92Fr1MmEU9fABc4EsA.woff2) format("woff2");unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:'Roboto';font-style:normal;font-weight:500;src:local('Roboto Medium'),local(Roboto-Medium),url(https://fonts.gstatic.com/s/roboto/v19/KFOlCnqEu92Fr1MmEU9fCBc4EsA.woff2) format("woff2");unicode-range:U+1F00-1FFF}@font-face{font-family:'Roboto';font-style:normal;font-weight:500;src:local('Roboto Medium'),local(Roboto-Medium),url(https://fonts.gstatic.com/s/roboto/v19/KFOlCnqEu92Fr1MmEU9fBxc4EsA.woff2) format("woff2");unicode-range:U+0370-03FF}@font-face{font-family:'Roboto';font-style:normal;font-weight:500;src:local('Roboto Medium'),local(Roboto-Medium),url(https://fonts.gstatic.com/s/roboto/v19/KFOlCnqEu92Fr1MmEU9fCxc4EsA.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+1EA0-1EF9,U+20AB}@font-face{font-family:'Roboto';font-style:normal;font-weight:500;src:local('Roboto Medium'),local(Roboto-Medium),url(https://fonts.gstatic.com/s/roboto/v19/KFOlCnqEu92Fr1MmEU9fChc4EsA.woff2) format("woff2");unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Roboto';font-style:normal;font-weight:500;src:local('Roboto Medium'),local(Roboto-Medium),url(https://fonts.gstatic.com/s/roboto/v19/KFOlCnqEu92Fr1MmEU9fBBc4.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Roboto';font-style:normal;font-weight:700;src:local('Roboto Bold'),local(Roboto-Bold),url(https://fonts.gstatic.com/s/roboto/v19/KFOlCnqEu92Fr1MmWUlfCRc4EsA.woff2) format("woff2");unicode-range:U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:'Roboto';font-style:normal;font-weight:700;src:local('Roboto Bold'),local(Roboto-Bold),url(https://fonts.gstatic.com/s/roboto/v19/KFOlCnqEu92Fr1MmWUlfABc4EsA.woff2) format("woff2");unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:'Roboto';font-style:normal;font-weight:700;src:local('Roboto Bold'),local(Roboto-Bold),url(https://fonts.gstatic.com/s/roboto/v19/KFOlCnqEu92Fr1MmWUlfCBc4EsA.woff2) format("woff2");unicode-range:U+1F00-1FFF}@font-face{font-family:'Roboto';font-style:normal;font-weight:700;src:local('Roboto Bold'),local(Roboto-Bold),url(https://fonts.gstatic.com/s/roboto/v19/KFOlCnqEu92Fr1MmWUlfBxc4EsA.woff2) format("woff2");unicode-range:U+0370-03FF}@font-face{font-family:'Roboto';font-style:normal;font-weight:700;src:local('Roboto Bold'),local(Roboto-Bold),url(https://fonts.gstatic.com/s/roboto/v19/KFOlCnqEu92Fr1MmWUlfCxc4EsA.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+1EA0-1EF9,U+20AB}@font-face{font-family:'Roboto';font-style:normal;font-weight:700;src:local('Roboto Bold'),local(Roboto-Bold),url(https://fonts.gstatic.com/s/roboto/v19/KFOlCnqEu92Fr1MmWUlfChc4EsA.woff2) format("woff2");unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Roboto';font-style:normal;font-weight:700;src:local('Roboto Bold'),local(Roboto-Bold),url(https://fonts.gstatic.com/s/roboto/v19/KFOlCnqEu92Fr1MmWUlfBBc4.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

* {
    margin: 0;
    padding: 0;
    font-family: 'Roboto', sans-serif;
    outline: none;
}

body {
    background-color: #000;
    color: #fff;
    overflow-x: hidden;
}

html.mobile,body.mobile{
    overflow: hidden;
}

div.container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}

a.whatsapp {
    position: fixed;
    right: -70px;
    border-radius: 10px;
    top: 35%;
    width: 180px;
    height: 52px; 
    background-color: #46DA00;
    z-index: 9999;
    transform: rotate(-90deg);
}

i.whatsapp-icon {
    background-image: url(../img/whatsapp-icon.svg);
    width: 20px;
    height: 50px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    float: left;
    margin: 0 10px;
}

a.whatsapp p {
    float: left;
    line-height: 52px;
    font-size: 16px;
    color: #fff;
    font-weight: 400;
}

header {
    width: 100%;
    height: 93px;
    float: left;
    position: fixed;
    z-index: 999;
    transition: 300ms all ease-in-out;
}

header div.logo {
    float: left;
    width: 150px;
    height: auto;
    margin-top: 10px;
    opacity: 0;
}

header div.logo img {
    width: 100%;
    height: auto;
    float: left;
}

header.scroll {
    background-color: #fff;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.11);
    height: 60px;
}

header.scroll nav ul {
    margin-top: 20px;
}

header.scroll nav ul li a {
    color: #000;
}

header.scroll div.logo {
    opacity: 1;
    transition: 500ms all ease-in-out;
    transition-delay: 300ms;
    background-color: #fff;
    padding: 20px;
    border-bottom-right-radius: 50px;
    border-bottom-left-radius: 50px;
    box-shadow: 0 0 5px rgba(0,0,0,0.20);
    margin-top: 0px;
}

header nav {
    width: auto;
    height: 100%;
    float: right;
}

header nav ul {
    float: right;
    margin-top: 38px;
}

header nav ul li {
    list-style: none;
    float: left;
}

header nav ul li a {
    float: left;
    font-size: 14px;
    font-weight: 500;
    color: #fff;
    letter-spacing: 0.14em;
    text-decoration: none;
    margin-right: 15px;
}

header nav ul li:last-child a {
    margin-right: 0;
}

header div.mobile-button {
    float: right;
    width: 33px;
    margin-top: 18px;
    display: none;
}

header div.mobile-button span.line {
    width: 100%;
    height: 4px;
    border-radius: 3px;
    float: left;
    background-color: #fff;
    margin-bottom: 5px;
    transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
    background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
    opacity 0.55s ease;
    transform-origin: 4px 0px;
}

header.scroll div.mobile-button span.line {
    background-color: #202124;
}

header div.mobile-button span.line:first-child {
  transform-origin: 0% 0%;
}

header div.mobile-button span.line:nth-child(3) {
  transform-origin: 0% 100%;
}

header div.mobile-button.active span.line {
  opacity: 1;
  transform: rotate(45deg) translate(4px, -5px);
}

header div.mobile-button.active span.line:nth-child(2) {
  opacity: 0;
  transform: rotate(0deg) scale(0.2, 0.2);
}

header div.mobile-button.active span.line:nth-child(3) {
  transform: rotate(-45deg) translate(2px, 7px);
}

div.mobile-header {
    position: fixed;
    right: 0;
    top: 0;
    width: 60%;
    height: 100%;
    transform: scale(0.85);
    opacity: 0;
    z-index: -55;
    margin-top: 60px;
    transition: 500ms all ease;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    display: none;
}

div.mobile-header.active {
    transform: none;
    opacity: 1;
    z-index: 999999;
}

div.mobile-header ul {
    float: left;
    width: 100%;
    box-sizing: border-box;
    padding-left: 20px;
    padding-right: 70px;
}

div.mobile-header ul li {
    float: left;
    width: 100%;
    list-style: none;
}

div.mobile-header ul li a {
    float: left;
    width: 100%;
    color: #fff;
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    padding: 30px 0px;
    font-size: 1.25em;
    font-weight: 300;
    text-decoration: none;
}

div.mobile-header ul li:last-child a {
    border-bottom: none;
}

main#maincontent {
    float: left;
    width: 100%;
    height: auto;
}

main#maincontent.active {
    -webkit-filter: brightness(50%) blur(8px);
    -moz-filter: brightness(50%) blur(8px);
    -o-filter: brightness(50%) blur(8px);
    -ms-filter: brightness(50%) blur(8px);
    filter: brightness(50%) blur(8px);
    transition: 0.5s;
}

section#hero {
    float: left;
    width: 100%;
    height: 969px;
    overflow: hidden;
    position: relative;
}

section#hero div.wave {
    background-image: url(../img/wave.png);
    background-repeat: no-repeat;
    width: 100%;
    height: 440px;
    position: absolute;
    bottom: 0;
    z-index: 4;
}

section#hero img#logo {
    position: absolute;
    z-index: 5;
    left: 0;
    right: 0;
    top: 212px;
    margin: 0 auto;
    transition: 500ms all ease-in-out;
}

section#hero img#logo.scroll {
    top: -10%;
    left: -60%;
    opacity: 0;
}

section#hero div.slide-item {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    opacity: 0;
    transition: 600ms all ease-in-out;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

section#hero div.slide-item img {
    float: left;
    width: 100%;
    height: auto;
    display: none;
}

section#hero div.slide-item.visible {
    opacity: 1;
}

section#corporate {
    float: left;
    width: 100%;
    height: auto;
}

section#corporate div.title {
    float: left;
    text-align: center;
    width: 100%;
    height: auto;
    font-size: 22px;
    font-weight: 300;
    letter-spacing: 0.14em;
    margin-bottom: 52px;
}

section#corporate div.box {
    float: left;
    width: 277px;
    height: 283px;
    background-color: #202124;
    box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.11);
    border-radius: 16px;
    box-sizing: border-box;
    padding: 0 27px;
    margin-right: 184px;
}

section#corporate div.box:hover {
    transition: 300ms all ease-in-out;
    transform: translateY(-5px);
}

section#corporate div.boxes div.box:last-child {
    margin-right: 0;
}

section#corporate div.box div.icon {
    width: 82px;
    height: 82px;
    margin-top: 30px;
    float: left;
    margin-left: calc(50% - 41px);
}

section#corporate div.box div.icon img {
    width: 100%;
    height: auto;
    float: left;
}

section#corporate div.box div.box-title {
    width: 100%;
    height: auto;
    float: left;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0.14em;
    text-align: center;
    margin-top: 10px;
}

section#corporate div.box div.desc {
    width: 100%;
    float: left;
    height: auto;
    font-size: 14px;
    font-weight: 300;
    letter-spacing: 0.14em;
    text-align: center;
    margin-top: 9.4px;
}

section#corporate a.readm {
    float: right;
    color: #fff;
    text-decoration: none;
    margin-top: 28px;
    display: flex;
    align-items: center;
    letter-spacing: 0.14em;
    font-size: 14px;
}

i.read-icon {
    background-image: url(../img/readbutton.svg);
    background-repeat: no-repeat;
    width: 11px;
    height: 11px;
    float: right;
    margin-left: 5px;
}

section#products {
    float: left;
    width: 100%;
    height: auto;
    margin-top: 94px;
    margin-bottom: 50px;
}

section#products div.title {
    font-size: 22px;
    font-weight: 300;
    letter-spacing: 0.14em;
    float: left;
    width: 100%;
    height: auto;
    text-align: center;
}

section#products div.boxes {
    float: left;
    width: 100%;
    height: auto;
    margin-top: 30px;
    position: relative;
}

section#products div.boxes div.box {
    float: left;
    width: 100%;
    height: auto;
    box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.11);
    border-radius: 6px;
    box-sizing: border-box;
    padding: 0 15px;
    overflow: hidden;
    position: relative;
}

section#products div.boxes div.box div.bg {
    float: left;
    width: 100%;
    height: 100%;
    position: absolute;
    background-size: cover;
    background-position: center;
    filter: brightness(30%);
    left: 0;
    top: 0;
    z-index: -1;
}

section#products div.boxes div.box div.image {
    width: 100%;
    height: 259px;
    border-radius: 6px;
    float: left;
    margin-top: 31px;
    overflow: hidden;
    background-size: cover;
    background-position: center;
    box-shadow: 0 0 5px rgba(0,0,0,0.6);
}

section#products div.boxes div.box div.image img {
    float: left;
    width: 100%;
    height: auto;
    display: none;
}

section#products div.boxes div.box div.box-title {
    font-size: 18px;
    float: left;
    letter-spacing: 0.14em;
    font-weight: 400;
    margin-top: 12px;
}

section#products div.boxes div.box div.desc {
    float: left;
    width: 100%;
    height: auto;
    margin-top: 16px;
}

section#products div.boxes div.box div.desc p {
    font-size: 14px;
    font-weight: 300;
    letter-spacing: 0.14em;
    float: left;
    line-height: 20px;
}

section#products div.boxes div.box a.button {
    width: 100%;
    height: 34px;
    border: 1px solid #A80000;
    border-radius: 6px;
    float: left;
    color: #fff;
    text-align: center;
    font-size: 14px;
    line-height: 34px;
    letter-spacing: 0.14em;
    text-decoration: none;
    margin: 20px 0px;
    transition: 300ms all linear;
    position: relative;
}

@-webkit-keyframes pulse {
  0% {
    -webkit-box-shadow: 0 0 0 0 rgba(168,0,0,1);
  }
  70% {
      -webkit-box-shadow: 0 0 0 15px rgba(168,0,0,0);
  }
  100% {
      -webkit-box-shadow: 0 0 0 0 rgba(168,0,0,0);
  }
}
@keyframes pulse {
  0% {
    -moz-box-shadow: 0 0 0 0 rgba(168,0,0,1);
    box-shadow: 0 0 0 0 rgba(168,0,0,1);
  }
  70% {
      -moz-box-shadow: 0 0 0 15px rgba(168,0,0,0);
      box-shadow: 0 0 0 15px rgba(168,0,0,0);
  }
  100% {
      -moz-box-shadow: 0 0 0 0 rgba(168,0,0,0);
      box-shadow: 0 0 0 0 rgba(168,0,0,0);
  }
}

section#products div.boxes div.box a.button:hover {
    background-color: #A80000;
    animation: pulse 2s infinite;
}

i.arrow-prev {
    float: left;
    background-image: url(../img/prev.svg);
    background-repeat: no-repeat;
    background-size: contain;
    width: 30px;
    height: 30px;
}

i.arrow-next {
    float: left;
    background-image: url(../img/next.svg);
    background-repeat: no-repeat;
    background-size: contain;
    width: 30px;
    height: 30px;
}

.owl-theme .owl-nav {
    float: left;
    width: 100%;
    position: absolute;
    height: 30px;
    top: 0;
    bottom: 0;
    margin: auto;
    z-index: -1;
}

.owl-next {
    position: absolute;
    right: -47px;
}

.owl-prev {
    position: absolute;
    left: -47px;
}

section#references {
    margin-top: 165px;
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 97px;
}

section#references div.title {
    float: left;
    width: 100%;
    height: auto;
    font-size: 22px;
    font-weight: 300;
    letter-spacing: 0.14em;
    text-align: center;
}

section#references div.boxes {
    float: left;
    width: 100%;
    height: auto;
    margin-top: 38px;
    position: relative;
}

section#references div.boxes a.box {
    float: left;
    width: 100%;
    height: 220px;
    background-color: #202124;
    border: 1px solid #ccc;
    border-radius: 3px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    box-sizing: border-box;
}

section#contact {
    width: 100%;
    height: auto;
    background-color: #1F1E24;
    float: left;
}

section#contact div.title {
    font-size: 22px;
    letter-spacing: 0.14em;
    float: left;
    font-weight: 300;
    text-align: center;
    width: 100%;
    margin-top: 36px;
    margin-bottom: 26px;
}

section#contact div.map {
    width: 772px;
    height: 426px;
    float: left;
    margin-bottom: 38px;
}

section#contact div.map iframe {
    width: 100%;
    height: 100%;
    float: left;
}

section#contact form {
    float: right;
    width: 367px;
}

section#contact form input {
    float: left;
    width: 100%;
    height: 52px;
    margin-bottom: 16px;
    border: none;
    background-color: transparent;
    border-bottom: 1px solid #ccc;
    color: #fff;
    font-size: 14px;
    border-radius: 0;
}

section#contact form input::placeholder {
    font-size: 14px;
    font-weight: 300;
    letter-spacing: 0.14em;
    color: rgba(255, 255, 255, 0.68);
}

section#contact form textarea {
    width: 100%;
    height: 188px;
    resize: none;
    float: left;
    background-color: transparent;
    border: none;
    border-bottom: 1px solid #ccc;
    color: #fff;
    font-size: 14px;
    border-radius: 0;
}

section#contact form textarea::placeholder {
    font-size: 14px;
    font-weight: 300;
    letter-spacing: 0.14em;
    color: rgba(255, 255, 255, 0.68);
}

section#contact form button {
    float: right;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.14em;
    background-color: transparent;
    border: none;
    color: #fff;
    margin-top: -32px;
    cursor: pointer;
    display: flex;
    align-items: center;
}

section#contact form button:hover .send-icon {
    margin-left: 10px;
}

.send-icon {
    width: 25px;
    height: 25px;
    float: right;
    background-image: url(../img/send.svg);
    margin-left: 5px;
    background-size: contain;
    background-repeat: no-repeat;
    transition: 300ms all cubic-bezier(.24,.48,.19,.11);
}

section#gallery {
    float: left;
    width: 100%;
    height: auto;
    margin-top: 66px;
    margin-bottom: 103px;
}

section#gallery div.title {
    font-size: 22px;
    font-weight: 300;
    float: left;
    width: 100%;
    text-align: center;
    letter-spacing: 0.14em;
}

section#gallery div.boxes {
    float: left;
    width: 100%;
    height: auto;
    margin-top: 34px;
    position: relative;
}

section#gallery div.boxes a.box {
    float: left;
    width: 100%;
    height: 220px;
    background-color: #202124;
    border-radius: 3px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    box-sizing: border-box;
    overflow: hidden;
    position: relative;
    cursor: zoom-in;
}

section#gallery div.boxes a.box:hover div.desc {
    bottom: 0;
}

section#gallery div.boxes a.box div.desc {
    float: left;
    width: 100%;
    box-sizing: border-box;
    padding: 15px 10px;
    position: absolute;
    bottom: -100%;
    left: 0;
    background-color: rgba(0,0,0,0.7);
    display: flex;
    align-items: center;
    transition: 300ms all ease-in-out;
    word-break: break-all;
}

section#gallery div.boxes a.box div.desc p {
    color: #fff;
    width: 100%;
    height: auto;
    text-align: center;
    font-size: 14px;
    font-weight: 300;
    letter-spacing: 0.14em;
}

footer {
    float: left;
    width: 100%;
    height: auto;
}

footer div.box {
    float: left;
    width: 100%;
    height: auto;
    border-top: 1px solid #ccc;
}

footer div.box div.copyright {
    float: left;
    width: 100%;
    height: auto;
    text-align: center;
    margin: 16px 0px;
    font-size: 14px;
    letter-spacing: 0.14em;
}

div#loading-screen {
    background-color: #fff;
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    transition: 1s all ease-in-out;
    z-index: 99999;
}

div#loading-screen img {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 400px;
}

div.headercontainer {
    width: 100%;
    height: 60px;
    float: left;
    position: relative;
    background-color: #fff;
}

section.head {
    width: 100%;
    height: 400px;
    float: left;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

section.head img {
    width: 100%;
    height: auto;
    float: left;
    display: none;
}

main#corporate {
    float: left;
    width: 100%;
    height: auto;
    margin-top: 25px;
    margin-bottom: 104px;
}

main#corporate section.sidebar {
    float: left;
    width: 202px;
    height: auto;
}

main#corporate section.sidebar ul {
    float: left;
    width: 100%;
    height: auto;
}

main#corporate section.sidebar ul li {
    float: left;
    list-style: none;
    width: 100%;
    height: auto;
    margin-bottom: 15px;
}

main#corporate section.sidebar ul li.active {
    background-image: url(../img/cizgi.svg);
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

main#corporate section.sidebar ul li a {
    float: left;
    font-size: 16px;
    color: #fff;
    font-weight: 400;
    text-decoration: none;
    background-color: #000;
    padding-right: 15px;
}

main#corporate section.content {
    float: right;
    width: 975px;
    height: auto;
}

main#corporate section.content div.image {
    width: 100%;
    height: auto;
    float: left;
}

main#corporate section.content div.image img {
    float: left;
    width: 100%;
    height: auto;
}

main#corporate section.content div.desc {
    float: left;
    width: 100%;
    height: auto;
}

main#corporate section.content div.desc h1 {
    float: left;
    width: 100%;
    height: auto;
    margin: 25px 0px;
    font-size: 25px;
    font-weight: 600;
}

main#corporate section.content div.desc p {
    float: left;
    width: 100%;
    height: auto;
    font-size: 18px;
    font-weight: 300;
    line-height: 30px;
}

main#products {
    float: left;
    width: 100%;
    height: auto;
    margin-top: 25px;
    margin-bottom: 104px;
}

main#products section.sidebar {
    float: left;
    width: 202px;
    height: auto;
}

main#products section.sidebar ul {
    float: left;
    width: 100%;
    height: auto;
}

main#products section.sidebar ul li {
    float: left;
    list-style: none;
    width: 100%;
    height: auto;
    margin-bottom: 15px;
}

main#products section.sidebar ul li.active {
    background-image: url(../img/cizgi.svg);
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

main#products section.sidebar ul li a {
    float: left;
    font-size: 16px;
    color: #fff;
    font-weight: 300;
    text-decoration: none;
    background-color: #000;
    padding-right: 15px;
}

main#products section.products {
    float: right;
    width: 961px;
    height: auto;
}

main#products section.products div.boxes {
    float: left;
    width: 100%;
    height: auto;
    position: relative;
}

main#products section.products div.boxes div.box {
    float: left;
    width: 289px;
    height: auto;
    box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.11);
    box-sizing: border-box;
    padding: 0 15px;
    margin-bottom: 20px;
    position: relative;
    margin-right: 47px;
}

main#products section.products div.boxes div.box div.bg {
    float: left;
    width: 100%;
    height: 100%;
    position: absolute;
    background-size: cover;
    background-position: center;
    filter: brightness(30%);
    left: 0;
    top: 0;
    z-index: -1;
}

main#products section.products div.boxes div.box:nth-child(3n) {
    margin-right: 0px;
}

main#products section.products div.boxes div.box div.image {
    width: 100%;
    height: 259px;
    border-radius: 6px;
    float: left;
    margin-top: 31px;
    overflow: hidden;
    background-size: cover;
    background-position: center;
    box-shadow: 0 0 5px rgba(0,0,0,0.6);
}

main#products section.products div.boxes div.box div.image img {
    float: left;
    width: 100%;
    height: auto;
    display: none;
}

main#products section.products div.boxes div.box div.box-title {
    font-size: 18px;
    float: left;
    letter-spacing: 0.14em;
    font-weight: 400;
    margin-top: 12px;
}

main#products section.products div.boxes div.box div.desc {
    float: left;
    width: 100%;
    height: auto;
    margin-top: 16px;
}

main#products section.products div.boxes div.box div.desc p {
    font-size: 14px;
    font-weight: 300;
    letter-spacing: 0.14em;
    float: left;
    line-height: 20px;
}

main#products section.products div.boxes div.box a.button {
    width: 100%;
    height: 34px;
    border: 1px solid #A80000;
    border-radius: 6px;
    float: left;
    color: #fff;
    text-align: center;
    font-size: 14px;
    line-height: 34px;
    letter-spacing: 0.14em;
    text-decoration: none;
    margin: 20px 0px;
    transition: 300ms all linear;
}

main#products div.boxes div.box a.button:hover {
    background-color: #A80000;
    animation: pulse 2s infinite;
}

main#references {
    float: left;
    width: 100%;
    height: auto;
    margin-top: 20px;
}

main#references div.boxes {
    float: left;
    width: 100%;
    height: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

main#references div.boxes div.box {
    width: 225px;
    height: 225px;
    float: left;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-color: #202124;
    box-sizing: border-box;
    border: 1px solid #ccc;
    margin-bottom: 20.5px;
}

main#references div.boxes div.box:nth-child(5n) {
    margin-right: 0px;
}

main#gallery {
    float: left;
    width: 100%;
    height: auto;
    margin-top: 20px;
}

main#gallery div.boxes {
    float: left;
    width: 100%;
    height: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

main#gallery div.boxes div.box {
    width: 225px;
    height: 225px;
    float: left;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    background-color: #202124;
    box-sizing: border-box;
    margin-bottom: 20.5px;
    position: relative;
    overflow: hidden;
}

main#gallery div.boxes div.box img {
    float: left;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

main#gallery div.boxes div.box:nth-child(5n) {
    margin-right: 0px;
}

main#gallery div.boxes div.box:hover div.desc {
    bottom: 0;
}

main#gallery div.boxes div.box div.desc {
    float: left;
    width: 100%;
    box-sizing: border-box;
    padding: 15px 10px;
    position: absolute;
    bottom: -100%;
    left: 0;
    background-color: rgba(0,0,0,0.7);
    display: flex;
    align-items: center;
    transition: 300ms all ease-in-out;
    word-break: break-all;
}

main#gallery div.boxes div.box a {
    float: left;
    width: 100%;
    height: 100%;
    position: absolute;
}

main#gallery div.boxes div.box div.desc p {
    color: #fff;
    width: 100%;
    height: auto;
    text-align: center;
    font-size: 14px;
    font-weight: 300;
    letter-spacing: 0.14em;
}

section.map {
    width: 100%;
    height: 400px;
    float: left;
    margin-bottom: 15px;
}

section.map iframe {
    width: 100%;
    height: 100%;
    float: left;
}

main#contact {
    width: 100%;
    height: auto;
    float: left;
    margin-bottom: 37px;
}

main#contact form {
    float: left;
    width: 600px;
    height: auto;
    background-color: #fff;
    box-sizing: border-box;
    padding: 0 48px;
    padding-bottom: 80px;
}

main#contact form h1 {
    font-size: 26px;
    font-weight: 400;
    float: left;
    width: 100%;
    height: auto;
    text-align: center;
    margin-top: 42px;
    margin-bottom: 72px;
    color: #000;
}

main#contact form input {
    float: left;
    width: 100%;
    height: 52px;
    margin-bottom: 16px;
    border: none;
    background-color: transparent;
    border-bottom: 1px solid #ccc;
    color: #000;
    font-size: 16px;
}

main#contact form input::placeholder {
    font-size: 16px;
    font-weight: 300;
    letter-spacing: 0.14em;
    color: rgba(0, 0, 0, 0.68);
}

main#contact form textarea {
    width: 100%;
    height: 250px;
    resize: none;
    float: left;
    background-color: transparent;
    border: none;
    color: #000;
    font-size: 16px;
}

main#contact form textarea::placeholder {
    font-size: 16px;
    font-weight: 300;
    letter-spacing: 0.14em;
    color: rgba(0, 0, 0, 0.68);
}

main#contact form button {
    float: right;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0.14em;
    background-color: transparent;
    border: none;
    color: #000;
    margin-top: -32px;
    cursor: pointer;
    display: flex;
    align-items: center;
}

.send-icon-black {
    width: 25px;
    height: 25px;
    float: right;
    background-image: url(../img/send-black.svg);
    margin-left: 5px;
    background-size: contain;
    background-repeat: no-repeat;
    transition: 300ms all cubic-bezier(.24,.48,.19,.11);
}

main#contact form button:hover .send-icon-black {
    margin-left: 10px;
}

main#contact div.right-bar {
    float: right;
    width: 486px;
    height: auto;
    margin-top: 30px;
}

main#contact div.right-bar h2 {
    font-weight: 400;
    font-size: 26px;
    letter-spacing: 0.2em;
    float: left;
    width: 100%;
    text-align: center;
}

main#contact div.right-bar div.boxes {
    float: left;
    width: 100%;
    height: auto;
    margin-top: 57px;
}

main#contact div.right-bar div.boxes div.box {
    float: left;
    width: 100%;
    height: auto;
    box-sizing: border-box;
    padding: 0 120px;
    padding-bottom: 29px;
    padding-top: 13px;
    border-radius: 6px;
    background-color: #006A92;
    display: inline-flex;
    align-content: center;
    justify-content: center;
    flex-wrap: wrap;
    background-repeat: no-repeat;
    background-size: 41px 41px;
    background-position: left 70px center;
    margin-bottom: 8px;
}

main#contact div.right-bar div.boxes div.box:nth-child(2) {
    background-position: left 15px center;
}

main#contact div.right-bar div.boxes div.box span.title {
    font-size: 26px;
    font-weight: 300;
    color: #fff;
    text-align: center;
    float: left;
    width: 100%;
}

main#contact div.right-bar div.boxes div.box a {
    color: #fff;
    text-decoration: none;
    float: left;
    font-size: 26px;
    font-weight: 300;
    margin-top: 14px;
}

main#contact div.right-bar div.boxes div.box p {
    color: #fff;
    float: left;
    font-size: 22px;
    font-weight: 300;
    margin-top: 14px;
}

main#productdetail {
    float: left;
    width: 100%;
    height: auto;
    margin-top: 20px;
    margin-bottom: 151px;
}

main#productdetail div.left {
    float: left;
    width: 630px;
    height: auto;
    margin-left: 10px;
}

main#productdetail div.left div.big-image {
    float: left;
    width: 100%;
    height: 630px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

main#productdetail div.left div.small-images {
    width: 100%;
    height: auto;
    float: left;
    margin-top: 20px;
}

main#productdetail div.left div.small-images div.small-image {
    float: left;
    width: 206px;
    height: 206px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    margin-right: 6px;
    margin-bottom: 6px;
}

main#productdetail div.left div.small-images div.small-image:nth-child(3n) {
    margin-right: 0px;
}

main#productdetail div.right {
    float: left;
    width: 333px;
    margin-left: 25px;
}

main#productdetail div.right h1 {
    font-size: 22px;
    font-weight: 400;
    float: left;
    width: 100%;
}

main#productdetail div.right div.desc {
    float: left;
    width: 100%;
    height: auto;
    margin-top: 25px;
}

main#productdetail div.right div.desc p {
    font-size: 16px;
    font-weight: 300;
    line-height: 30px;
    float: left;
    width: 100%;
}

main#productdetail section.sidebar {
    float: left;
    width: 202px;
    height: auto;
}

main#productdetail section.sidebar ul {
    float: left;
    width: 100%;
    height: auto;
}

main#productdetail section.sidebar ul li {
    float: left;
    list-style: none;
    width: 100%;
    height: auto;
    margin-bottom: 15px;
}

main#productdetail section.sidebar ul li.active {
    background-image: url(../img/cizgi.svg);
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

main#productdetail section.sidebar ul li a {
    float: left;
    font-size: 16px;
    color: #fff;
    font-weight: 300;
    text-decoration: none;
    background-color: #000;
    padding-right: 15px;
}

a.popup-image {
    float: left;
    width: 100%;
    height: 100%;
}

select {
    width: 100%;
    height: 30px;
    border: none;
    border-bottom: 1px solid rgba(255,255,255,0.2);
    background-color: transparent;
    color: #fff;
    font-size: 16px;
    font-weight: 300;
    margin-bottom: 20px;
    border-radius: 0px;
    -webkit-appearance: none;
    box-sizing: border-box;
    padding-right: 20px;
    background-image: url(../img/down-arrow.svg);
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 15px 15px;
    display: none;
}