
/*  STARTFONT */

@font-face{
    font-family: "Montserrat-Black";
    src: url("../font/Montserrat/Montserrat-Black.ttf") format("truetype");
}
@font-face{
    font-family: "Montserrat-BlackItalic";
    src: url("../font/Montserrat/Montserrat-BlackItalic.ttf") format("truetype");
}
@font-face{
    font-family: "Montserrat-Bold";
    src: url("../font/Montserrat/Montserrat-Bold.ttf") format("truetype");
}
@font-face{
    font-family: "Montserrat-BoldItalic";
    src: url("../font/Montserrat/Montserrat-BoldItalic.ttf") format("truetype");
}
@font-face{
    font-family: "Montserrat-ExtraBold";
    src: url("../font/Montserrat/Montserrat-ExtraBold.ttf") format("truetype");
}
@font-face{
    font-family: "Montserrat-ExtraBoldItalic";
    src: url("../font/Montserrat/Montserrat-ExtraBoldItalic.ttf") format("truetype");
}
@font-face{
    font-family: "Montserrat-ExtraLight";
    src: url("../font/Montserrat/Montserrat-ExtraLight.ttf") format("truetype");
}
@font-face{
    font-family: "Montserrat-ExtraLightItalic";
    src: url("../font/Montserrat/Montserrat-ExtraLightItalic.ttf") format("truetype");
}
@font-face{
    font-family: "Montserrat-Italic";
    src: url("../font/Montserrat/Montserrat-Italic.ttf") format("truetype");
}
@font-face{
    font-family: "Montserrat-Light";
    src: url("../font/Montserrat/Montserrat-Light.ttf") format("truetype");
}
@font-face{
    font-family: "Montserrat-LightItalic";
    src: url("../font/Montserrat/Montserrat-LightItalic.ttf") format("truetype");
}
@font-face{
    font-family: "Montserrat-Medium";
    src: url("../font/Montserrat/Montserrat-Medium.ttf") format("truetype");
}
@font-face{
    font-family: "Montserrat-MediumItalic";
    src: url("../font/Montserrat/Montserrat-MediumItalic.ttf") format("truetype");
}
@font-face{
    font-family: "Montserrat-Regular";
    src: url("../font/Montserrat/Montserrat-Regular.ttf") format("truetype");
}
@font-face{
    font-family: "Montserrat-SemiBold";
    src: url("../font/Montserrat/Montserrat-SemiBold.ttf") format("truetype");
}
@font-face{
    font-family: "Montserrat-SemiBoldItalic";
    src: url("../font/Montserrat/Montserrat-SemiBoldItalic.ttf") format("truetype");
}
@font-face{
    font-family: "Montserrat-Thin";
    src: url("../font/Montserrat/Montserrat-Thin.ttf") format("truetype");
}
@font-face{
    font-family: "Montserrat-ThinItalic";
    src: url("../font/Montserrat/Montserrat-ThinItalic.ttf") format("truetype");
}

@font-face{
    font-family: "Roboto-Regular";
    src: url("../font/Roboto/Roboto-Regular.ttf") format("truetype");
}
@font-face{
    font-family: "Roboto-Medium";
    src: url("../font/Roboto/Roboto-Medium.ttf") format("truetype");
}

/* END FONT */

body{
    background-color: #131313 !important;
    font-family: "Montserrat-Regular" !important;
    color: #fff !important;
}
h1{
    font-family: "Montserrat-Bold";
    font-size: 36px;
}
.col-md-6, .col-12{
    padding: 0 !important;
    margin: 0 !important;
    height: 100% !important;
}
.col-md-6, .col-md-12{
    padding: 0 !important;
    margin: 0 !important;
    height: 100% !important;
}
.row{
    margin: 0 !important;
}
nav .navbar-text{
    /* text-align: right;
    width: 100% !important; */
    float: right;
    margin-top: 5px;
}
main .landing-artikel{
    width: 100%;
    height: 100vh;
    position: relative;
}
img.artikel{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.bg-overlay{
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    min-width: 100px;
    min-height: 100px;
    background: linear-gradient(0deg, #131313 0%, rgba(19, 19, 19, 0) 100%);
    top: 0;
}

main .landing-artikel .landing-description,
.artikel-description{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    -webkit-text-align: center;
    -moz-text-align: center;
    -o-text-align: center;
    max-width: 650px;
}
.artikel-description{
    width: 100%;
}
main .landing-artikel .landing-description .artikel-date{
    font-size: 15px;
}
main .landing-artikel .landing-description h1{
    margin: 10px 0 50px;
}
.artikel-description h1{
    margin: 10px 20px 50px;
}
main .landing-artikel .landing-description a.artikel-title,
.artikel-description a.artikel-title{
    color: #fff;
    text-decoration: none;
    outline: none;
}
main .landing-artikel .landing-description .btn-more,
.artikel-description .btn-more{
    font-size: 13px;
    color: #fff;
    border: 1px solid #fff;
    border-radius: 100px;
    padding: 10px 35px;
    text-decoration: none;
    outline: none;
}
/* main .landing-artikel .landing-description:hover > a.artikel-title,
.artikel-description:hover > a.artikel-title{
    color: #FFC123 !important;
}
main .landing-artikel .landing-description:hover > a.btn-more,
.artikel-description:hover > a.btn-more{
    background: #EC7B13 !important;
    border: 1px solid #EC7B13 !important;
} */

main .landing-artikel a,
main .section-1 a,
main .section-2 a,
main .section-3 a{
    color: #fff;
    text-decoration: none;
    outline: none;
}
main .landing-artikel a:hover > .bg-overlay,
main .section-1 .col-md-6 a:hover > .bg-overlay,
main .section-2 .col-md-6 a:hover > .bg-overlay,
main .section-3 .col-12 a:hover > .bg-overlay{
    background: linear-gradient(0deg, #131313 0%, rgba(19, 19, 19, 0.25) 100%);
}
main .landing-artikel a:hover > .landing-description h1,
main .section-1 .col-md-6 a:hover > .artikel-description h1,
main .section-2 .col-md-6 a:hover > .artikel-description h1,
main .section-3 .col-12 a:hover > .artikel-description h1{
    color: #FFC123 !important;
}
main .landing-artikel a:hover > .landing-description .btn-more,
main .section-1 .col-md-6 a:hover > .artikel-description .btn-more,
main .section-2 .col-md-6 a:hover > .artikel-description .btn-more,
main .section-3 .col-12 a:hover > .artikel-description .btn-more{
    background: #EC7B13 !important;
    border: 1px solid #EC7B13 !important;
}
main .landing-artikel .scroll-down{
    position: absolute;
    bottom: 25px;
    width: 100%;
    text-align: center;
}
main .landing-artikel .scroll-down img{
    width: 20px;
    height: auto;
}
main .landing-artikel .scroll-down span{
    display: block;
    margin: 20px;
    font-size: 12px;
}

main .section-1,
main .section-2{
    height: 820px;
    position: relative;
}
main .section-3{
    height: 410px;
    position: relative;
}
main .section-1 .col-md-6 .col-12,
main .section-2 .col-md-6 .col-12{
    max-height: 410px;
}
a.btn-all{
    color: #131313;
    background: #fff;
    border-radius: 100px;
    width: 100%;
    font-family: "Montserrat-SemiBold";
    font-size: 13px;
    padding: 12px 0;
    margin: 30px auto;
    display: block;
    text-decoration: none;
    outline: none;
    max-width: 1080px;
    text-align: center;
    -webkit-text-align: center;
    -moz-text-align: center;
    -o-text-align: center;
}
a.btn-all:hover{
    color: #fff;
    background: #EC7B13 !important;
    text-decoration: none;
    outline: none;
    transition: .2s;
}

footer{
    width: 100%;
    height: 275px;
    max-width: 1080px;
    margin: 0 auto;
    position: relative;
}
footer .row{
    position: absolute;
    width: 100%;
    bottom: 35px;
}
footer .row .col-xs-6{
    border-bottom: 1px solid #fff;
    padding-bottom: 15px !important;
    width: 50%;
}
footer ul.socmed-interaktif{
    list-style: none;
    margin: 12px 0 0;
    text-align: right;
    -webkit-text-align: right;
    -moz-text-align: right;
    -o-text-align: right;
}
footer ul.socmed-interaktif li{
    display: inline-block;
    margin: 0 5px;
}
footer ul.footer-link{
    list-style: none;
    margin: 10px 0 15px;
    padding-left: 0;
    display: block;
    width: 100%;
}
footer ul.footer-link li{
    display: inline-block;
    margin-right: 25px;
}
footer ul.footer-link li:last-child{
    margin-right: 0;
}
footer ul.footer-link li a{
    color: #fff;
    font-family: "Roboto-Medium";
    font-size: 13px;
    text-decoration: none;
    outline: none;   
}
footer ul.footer-link li a:hover{
    color: #ff8d07;
}
footer label.copyright{
    color: #fff;
    font-family: "Roboto-Regular";
    font-size: 12px;
    text-decoration: none;
    outline: none;
}

/* back to top */
.to-top{
    position: fixed;
    bottom: 0;
    width: 100%;
    max-width: 1080px;
    min-height: 1px;
    left: 50%;
    transform: translate(-50%, 0);
    transition: all .25s ease-in-out;
    cursor: pointer;
    /* background: #fff; */
}
/* .to-top.show{
    visibility: visible;
    opacity: 1;
}
.to-top.hide {
    visibility: hidden;
    opacity: 0;
  } */

.top-link {
    transition: all .25s ease-in-out;
    /* position: fixed;
    top: -110px;
    right: 0; */
    position: absolute;
    bottom: 45px;
    right: 0;
    display: block;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    margin: 0;
    border-radius: 50%;
    padding: .25em;
    text-decoration: none;
    outline: none;
  }
  /* .top-link.show {
    visibility: visible;
    opacity: 1;
  }
  .top-link.hide {
    visibility: hidden;
    opacity: 0;
  } */
  .top-link img {
    margin: 5px 11px;
  }
  .top-link:hover {
    text-decoration: none;
    outline: none;
  }
  a.top-link div,
  a.top-link div:hover{
      color: #fff;
      font-family: "Roboto-Regular";
      font-size: 13px;
      text-decoration: none;
      outline: none;
  }
  nav{
    padding: 0 !important;
  }
  nav .bg-black{
      width: 100%;
      padding: 5px 15px;
  }
  .bg-black.empty{
      background: none;
      /* transition: .3s; */
      border-bottom: none;
  }
  .bg-black.ava{
      background: #141414;
      border-bottom: 1px solid #353535;
  }