/* CSS Document */
html {
  width: 100%;
  height: 100%; }

body {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  position: relative; }

section {
  width: 100%;
  color: #000000; }

form {
  width: 100%;
  height: 100%; }

a {
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s; }

a, a img {
  text-decoration: none;
  outline: none;
  border: none; }

.clr {
  clear: both;
  height: 0; }

::-webkit-input-placeholder {
  color: #000000;
  font-style: italic; }

:-moz-placeholder {
  color: #000000;
  font-style: italic; }

::-moz-placeholder {
  color: #000000;
  font-style: italic; }

:-ms-input-placeholder {
  color: #000000;
  font-style: italic; }

::selection {
  background: #e4cfa7; }

::-moz-selection {
  background: #e4cfa7; }

body, input, textarea, select, option {
  font-family: 'Futura Lt BT', sans-serif;
  color: #636466; }

*, *:after, *::before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  text-decoration: none;
  list-style-type: none;
  outline: none; }

*:before {
  font-family: IcoFont !important;
  font-style: normal; }

@font-face {
  font-family: 'Futura Hv BT';
  src: local("Futura Heavy BT"), local("FuturaBT-Heavy"), url("fonts/FuturaBT-Heavy.woff2") format("woff2"), url("fonts/FuturaBT-Heavy.woff") format("woff");
  font-weight: 900;
  font-style: normal; }

@font-face {
  font-family: 'Futura Lt BT';
  src: local("Futura Light Italic BT"), local("FuturaBT-LightItalic"), url("fonts/FuturaBT-LightItalic.woff2") format("woff2"), url("fonts/FuturaBT-LightItalic.woff") format("woff");
  font-weight: 300;
  font-style: italic; }

@font-face {
  font-family: 'Futura Lt BT';
  src: local("Futura Light BT"), local("FuturaBT-Light"), url("fonts/FuturaBT-Light.woff2") format("woff2"), url("fonts/FuturaBT-Light.woff") format("woff");
  font-weight: 300;
  font-style: normal; }

@font-face {
  font-family: 'Futura Md BT';
  src: url("fonts/FuturaBT-Medium.woff2") format("woff2"), url("fonts/FuturaBT-Medium.woff") format("woff");
  font-weight: 500;
  font-style: normal; }

.mobile-menu-open, .mobile-menu {
  display: none; }

img {
  width: 100%; }

nav {
  width: 100%;
  display: flex;
  overflow: hidden;
  position: absolute;
  top: 1.7%;
  z-index: 9;
  justify-content: center; }
  nav ul li {
    float: left;
    margin-right: 85px; }
    nav ul li:last-child {
      margin-right: 0; }
    nav ul li a {
      color: #18191a;
      font-size: 38px;
      font-family: 'Futura Md BT'; }

section > h2 {
  margin-top: 40px !important; }

section .leafs {
  width: 20.55%;
  margin: 0 auto; }

.desktop {
  display: block; }

.mobile {
  display: none; }

#mainScreen {
  height: 100%; }
  #mainScreen .mainScreen-img {
    width: 100%;
    margin: 0 auto; }
    #mainScreen .mainScreen-img img {
      width: 100%; }

#secondScreen {
  padding-top: 60px;
  position: relative; }
  #secondScreen .text {
    max-width: 1340px;
    margin: 0 auto;
    margin-top: 80px;
    width: 80%; }
    #secondScreen .text h2 {
      font-family: 'Bebas Neue', cursive;
      font-size: 72px;
      text-align: center;
      letter-spacing: 7px; }
      #secondScreen .text h2 small {
        display: block; }
    #secondScreen .text p {
      font-size: 28px;
      text-align: center;
      color: #636466;
      margin-top: 8%; }
  #secondScreen .iyicocuk {
    width: 11.8%;
    position: absolute;
    top: 30%;
    left: 10%; }
  #secondScreen .iyibeslen {
    width: 12.3%;
    position: absolute;
    top: 32%;
    right: 10%; }
  #secondScreen .iyiyasam {
    width: 9.1%;
    position: absolute;
    bottom: -25%;
    left: 7%; }
  #secondScreen .iyikal {
    width: 7.5%;
    position: absolute;
    right: 11%;
    bottom: -24%; }

#thirdScreen {
  padding-top: 5%;
  margin-top: 4%;
  position: relative; }
  #thirdScreen .leafs {
    transform: rotate(180deg);
    margin-bottom: 20px; }
  #thirdScreen h2 {
    font-family: 'Bebas Neue', cursive;
    font-size: 72px;
    text-align: center;
    letter-spacing: 7px;
    margin-top: 5%; }
  #thirdScreen p {
    font-size: 42px;
    color: #18191a;
    margin-top: 55px;
    text-align: center; }
  #thirdScreen .instagramLink {
    max-width: 520px;
    width: 95%;
    margin: 0 auto;
    background: #ececec;
    padding: 20px 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    margin-top: 55px;
    display: flex;
    align-items: center;
    color: #000000; }
    #thirdScreen .instagramLink .img {
      width: 128px;
      float: left; }
    #thirdScreen .instagramLink .text {
      width: calc(100% - 128px);
      float: left;
      text-align: left;
      display: flex;
      flex-direction: column;
      padding-left: 20px;
      font-size: 36px;
      margin: 0 !important; }
  #thirdScreen .instagramLink {
    max-width: 520px;
    width: 95%;
    margin: 0 auto;
    background: #ececec;
    padding: 20px 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    margin-top: 55px;
    display: flex;
    align-items: center;
    color: #000000; }
    #thirdScreen .instagramLink .instagramLink .img {
      width: 128px;
      float: left; }
    #thirdScreen .instagramLink .instagramLink .text {
      width: calc(100% - 128px);
      float: left;
      text-align: left;
      display: flex;
      flex-direction: column;
      padding-left: 20px;
      font-size: 36px; }

#fourthScreen {
  padding-top: 5%; }
  #fourthScreen .leafs {
    transform: rotate(180deg); }
  #fourthScreen h2 {
    font-family: 'Bebas Neue', cursive;
    font-size: 60px;
    text-align: center;
    letter-spacing: 30px;
    margin-top: 60px; }

#fifthScreen h2 {
  font-family: 'Bebas Neue', cursive;
  font-size: 60px;
  text-align: center;
  letter-spacing: 30px; }

#sixthScreen h2 {
  font-family: 'Bebas Neue', cursive;
  font-size: 60px;
  text-align: center;
  letter-spacing: 30px; }

#seventhScreen h2 {
  font-family: 'Bebas Neue', cursive;
  font-size: 60px;
  text-align: center;
  letter-spacing: 30px;
  margin-top: 10px; }

#eightScreen {
  padding-top: 50px;
  padding-bottom: 200px; }
  #eightScreen h2 {
    font-family: 'Futura Lt BT';
    font-size: 48px;
    text-align: center;
    margin-top: 90px; }
  #eightScreen p {
    font-family: 'Futura Lt BT';
    font-size: 20px;
    text-align: center;
    margin-top: 10px; }
  #eightScreen .links {
    max-width: 1690px;
    width: 90%;
    margin: 30px auto 0; }
    #eightScreen .links a {
      width: 100%;
      float: left;
      color: #000000;
      position: relative;
      font-size: 20px;
      text-align: center;
      padding: 0 43px; }
      #eightScreen .links a img {
        margin-bottom: 30px;
        max-width: 337px;
        display: block;
        margin: 0 auto; }
      #eightScreen .links a:nth-child(4n) {
        margin-right: 0; }
    #eightScreen .links .owl-item.active:nth-child(4n) a:after {
      display: none; }

.scrollTop {
  position: fixed;
  right: 10px;
  bottom: 10px;
  font-family: 'Futura Hv BT';
  font-size: 16px;
  color: #000000;
  text-align: center;
  display: none;
  z-index: 9; }
  .scrollTop img {
    width: 40px;
    display: block;
    margin: 0 auto; }

.ribbon {
  position: fixed;
  z-index: 9;
  bottom: 10px;
  left: 0;
  background: #1d6243;
  color: #ffffff;
  width: 25%;
  padding: 5px;
  text-align: center;
  font-size: 20px; }

#projeSlider .owl-controls {
  position: absolute;
  top: 40%;
  height: 20px;
  width: 100%; }
  #projeSlider .owl-controls .owl-nav {
    height: 100%;
    position: relative; }

#projeSlider {
  width: 80%;
  margin: auto; }

#projeSlider .owl-prev {
  display: block;
  position: absolute;
  left: -70px;
  margin-top: -30px;
  top: 50%;
  width: 31px;
  height: 56px;
  background: url(../images/leftArrow.png) no-repeat; }

#projeSlider .owl-next {
  display: block;
  position: absolute;
  right: -70px;
  margin-top: -30px;
  top: 50%;
  width: 31px;
  height: 56px;
  background: url(../images/rightArrow.png) no-repeat; }

.imgList {
  width: 100%; }

.imgItem {
  width: 25%;
  float: left;
  padding: 5px; }

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

.videoItem {
  width: 100%;
  height: auto;
  display: block; }

.txt {
  text-align: center; }

.txt strong {
  display: block;
  color: #636466;
  font-size: 20px;
  padding: 50px 0;
  letter-spacing: 2px; }

.txt span {
  display: inline-block;
  color: #636466;
  font-size: 18px;
  background: url(../images/leaf.png) no-repeat left center;
  padding: 0 30px;
  line-height: 1.5; }

.links {
  max-width: 1500px;
  width: 90%;
  margin: 10px auto 0; }
  .links .brandItem {
    position: relative;
    width: 24.1%;
    float: left;
    margin-right: 1%;
    margin-bottom: 1%;
    display: flex;
    justify-content: center;
    border: 1px solid #000000; }
    .links .brandItem .info {
      background: transparent;
      top: 10px;
      right: 10px;
      bottom: auto;
      padding: 0;
      width: 29px;
      height: 29px; }
    .links .brandItem .info-detail {
      position: absolute;
      right: 50px;
      left: 15px;
      top: 10px;
      padding: 5px;
      background: #000000;
      color: #ffffff;
      font-size: 12px;
      display: none; }
    .links .brandItem span {
      position: absolute;
      bottom: 10px;
      background: #000000;
      color: #ffffff;
      font-size: 16px;
      font-family: 'Futura LT BT';
      padding: 5px; }
    .links .brandItem a {
      width: 100% !important; }
    .links .brandItem:nth-child(4n) {
      margin-right: 0; }
    .links .brandItem:nth-child(3n) {
      margin-right: 1%; }

#cekilis {
  position: absolute;
  bottom: 40%; }

#cizelge {
  margin-top: 7%; }

#cizelge .leafs {
  margin-bottom: 20px; }

@media screen and (max-width: 1680px) {
  #secondScreen .iyibeslen {
    top: 37%;
    right: 7%; }
  #secondScreen .iyicocuk {
    top: 37%;
    left: 7%; }
  nav {
    top: 1%; }
  nav ul li {
    margin-right: 40px; } }

@media screen and (max-width: 1440px) {
  nav ul li {
    margin-right: 60px; }
    nav ul li a {
      font-size: 24px; }
  #secondScreen .text {
    margin-top: 50px; }
    #secondScreen .text h2 {
      font-size: 50px; }
    #secondScreen .text p {
      margin-top: 5%;
      font-size: 22px; }
  #thirdScreen h2, #fourthScreen h2, #fifthScreen h2, #sixthScreen h2, #seventhScreen h2 {
    font-size: 50px; }
  #eightScreen h2 {
    font-size: 38px; }
  #eightScreen .links a {
    font-size: 16px;
    padding: 0 20px; } }

@media screen and (max-width: 1024px) {
  .ribbon {
    bottom: auto;
    top: 0;
    width: 100%; }
  #projeSlider {
    width: 90%; }
  #projeSlider .owl-next {
    right: -10%; }
  #projeSlider .owl-prev {
    left: -10%; }
  .imgItem {
    width: 50%; }
  .txt strong {
    font-size: 14px;
    padding: 30px 15px; }
  .txt span {
    display: block;
    text-align: left;
    font-size: 14px; }
  .desktop {
    display: none; }
  .mobile {
    display: block; }
  .scrollTop {
    display: none !important; }
  .mobile-menu-open {
    display: block;
    position: absolute;
    left: 3%;
    top: 1%;
    width: 50px;
    padding: 5px; }
    .mobile-menu-open span {
      width: 100%;
      height: 5px;
      background: #626366;
      display: block;
      margin: 6px 0; }
  .mobile-menu {
    width: 100%;
    height: 100%;
    background: #ffffff;
    position: fixed;
    z-index: 9;
    font-size: 24px;
    text-align: center;
    right: -100%;
    display: block; }
    .mobile-menu .close {
      position: absolute;
      right: 20px;
      top: 20px; }
    .mobile-menu ul {
      margin-top: 30%; }
      .mobile-menu ul li {
        margin: 50px 0; }
        .mobile-menu ul li a {
          color: #5e5e5e; }
  nav {
    display: none; }
  section .leafs {
    width: 38%; }
  #secondScreen .iyicocuk {
    width: 20%;
    top: 8%;
    left: 9%; }
  #secondScreen .iyibeslen {
    width: 20%;
    top: 8%;
    right: 10%; }
  #secondScreen .iyiyasam {
    width: 18%;
    bottom: -33%;
    left: 7%; }
  #secondScreen .iyikal {
    width: 14%;
    right: 3%;
    bottom: -27%; }
  #thirdScreen h2, #fourthScreen h2, #fifthScreen h2, #sixthScreen h2, #seventhScreen h2 {
    font-size: 40px; }
  #eightScreen .links a {
    width: 100%;
    font-size: 20px;
    padding: 0 50px;
    border-bottom: 1px solid gray;
    padding-bottom: 40px; }
    #eightScreen .links a:nth-child(2n):after {
      display: none; }
    #eightScreen .links a:after {
      display: none; } }

@media screen and (max-width: 768px) {
  .links .brandItem span {
    bottom: 0;
    font-size: 13px; }
  #secondScreen .text h2 {
    font-size: 42px; }
  #secondScreen .text p {
    font-size: 18px; }
  #eightScreen .links a {
    margin: 20px 0;
    font-size: 18px;
    border-bottom: 1px solid gray;
    padding-bottom: 40px; }
  #secondScreen .iyiyasam {
    width: 12%;
    bottom: -17%;
    left: 7%; }
  #secondScreen .iyikal {
    width: 14%;
    right: 3%;
    bottom: -23%; }
  #eightScreen h2 {
    font-size: 28px; } }

@media screen and (max-width: 480px) {
  .links .brandItem {
    width: 32%; }
  .links .brandItem:nth-child(4n) {
    margin-right: 1%; }
  #thirdScreen .instagramLink .img {
    width: 70px; }
  #thirdScreen .instagramLink .text {
    font-size: 20px; }
  #thirdScreen .instagramLink {
    display: flex;
    justify-content: center; }
  .links .brandItem .info-detail {
    width: 200%;
    left: auto;
    right: 0;
    top: 25px;
    z-index: 999; }
  .links .brandItem .info {
    position: absolute;
    width: 19px;
    height: 19px;
    top: 5px;
    right: 5px; }
  .ribbon {
    font-size: 18px; }
  .links .brandItem {
    display: block; }
  .links .brandItem span {
    position: relative;
    bottom: 0;
    display: block;
    width: 100%;
    font-size: 9px; }
  #thirdScreen .text p {
    font-size: 14px; }
  #mainScreen {
    margin-top: 10px; }
  .mobile-menu-open {
    width: 40px;
    top: 30px; }
  .mobile-menu-open span {
    height: 3px; }
  #secondScreen .text h2 {
    font-size: 22px;
    letter-spacing: 1px; }
  #secondScreen {
    padding-top: 30px; }
  section .leafs {
    width: 50%; }
  #secondScreen .text p {
    font-size: 14px; }
  #secondScreen .iyicocuk {
    top: 12%;
    left: 9%; }
  #secondScreen .iyibeslen {
    top: 12%;
    right: 10%; }
  #secondScreen .iyiyasam {
    bottom: -10%;
    left: 7%; }
  #secondScreen .iyikal {
    right: 3%;
    bottom: -15%; }
  #thirdScreen h2, #fourthScreen h2, #fifthScreen h2, #sixthScreen h2, #seventhScreen h2 {
    font-size: 20px;
    letter-spacing: 1px; }
  #eightScreen h2 {
    font-size: 16px;
    margin-top: 40px; }
  #eightScreen p {
    font-size: 14px; }
  #eightScreen .links a {
    width: 100%; }
    #eightScreen .links a:after {
      display: none; } }