﻿@font-face {
   font-family: 'SF-Regular';
   font-style: normal;
   font-weight: normal;
   src:url(fonts/SF-UI-Display-Regular.otf);
}
@font-face {
   font-family: 'SF-Bold';
   font-style: normal;
   font-weight: normal;
   src:url(fonts/SF-UI-Display-Bold.otf);
}
@font-face {
    font-family: 'SF-UI-Display-Light';
      font-style: normal;
   font-weight: 100;
    src: url('fonts/SF-UI-Display-Light.otf');
}

.body-load{
        width: 100%;
    height: 100vh;
    display: block;
    background: #2c2c2c;
    position:absolute;
    top:0;
    left:0;
    z-index:9999999999;
   
}
.loading {
    display: flex;
    justify-content: center;
    position: absolute;

    top: 50%;
    left: 50%;
    transform: translate(-50%);
}
.loading div {
  width: 1rem;
  height: 1rem;
  margin: 2rem 0.3rem;
  background: #979fd0;
  border-radius: 50%;
  -webkit-animation: 0.9s bounce infinite alternate;
          animation: 0.9s bounce infinite alternate;
}
.loading div:nth-child(2) {
  -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s;
}
.loading div:nth-child(3) {
  -webkit-animation-delay: 0.6s;
          animation-delay: 0.6s;
}

@-webkit-keyframes bounce {
  to {
    opacity: 0.3;
    -webkit-transform: translate3d(0, -1rem, 0);
            transform: translate3d(0, -1rem, 0);
  }
}

@keyframes bounce {
  to {
    opacity: 0.3;
    -webkit-transform: translate3d(0, -1rem, 0);
            transform: translate3d(0, -1rem, 0);
  }
}
.donut {
  width: 2rem;
  height: 2rem;
  margin: 2rem;
  border-radius: 50%;
  border: 0.3rem solid rgba(151, 159, 208, 0.3);
  border-top-color: #979fd0;
  -webkit-animation: 1.5s spin infinite linear;
          animation: 1.5s spin infinite linear;
}
.donut.multi {
  border-bottom-color: #979fd0;
}

@-webkit-keyframes spin {
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

@keyframes spin {
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
.ripple {
  width: 2rem;
  height: 2rem;
  margin: 2rem;
  border-radius: 50%;
  border: 0.3rem solid #979fd0;
  -webkit-transform: translate(50%);
          transform: translate(50%);
  -webkit-animation: 1s ripple ease-out infinite;
          animation: 1s ripple ease-out infinite;
}

@-webkit-keyframes ripple {
  from {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 1;
  }
  to {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 0;
  }
}

@keyframes ripple {
  from {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 1;
  }
  to {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 0;
  }
}
.multi-ripple {
  width: 2.6rem;
  height: 2.6rem;
  margin: 2rem;
}
.multi-ripple div {
  position: absolute;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  border: 0.3rem solid #979fd0;
  -webkit-animation: 1.5s ripple infinite;
          animation: 1.5s ripple infinite;
}
.multi-ripple div:nth-child(2) {
  -webkit-animation-delay: 0.5s;
          animation-delay: 0.5s;
}

.fancy-spinner {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 5rem;
  height: 5rem;
}
.fancy-spinner div {
  position: absolute;
  width: 4rem;
  height: 4rem;
  border-radius: 50%;
}
.fancy-spinner div.ring {
  border-width: 0.5rem;
  border-style: solid;
  border-color: transparent;
  -webkit-animation: 2s fancy infinite alternate;
          animation: 2s fancy infinite alternate;
}
.fancy-spinner div.ring:nth-child(1) {
  border-left-color: #979fd0;
  border-right-color: #979fd0;
}
.fancy-spinner div.ring:nth-child(2) {
  border-top-color: #979fd0;
  border-bottom-color: #979fd0;
  -webkit-animation-delay: 1s;
          animation-delay: 1s;
}
.fancy-spinner div.dot {
  width: 1rem;
  height: 1rem;
  background: #979fd0;
}

@-webkit-keyframes fancy {
  to {
    -webkit-transform: rotate(360deg) scale(0.5);
            transform: rotate(360deg) scale(0.5);
  }
}

@keyframes fancy {
  to {
    -webkit-transform: rotate(360deg) scale(0.5);
            transform: rotate(360deg) scale(0.5);
  }
}

#loadMore{
    max-width:172px;
    background:#444649;
        padding: 12px 50px;
    text-align:center;
    color:#76d898;
    text-transform:uppercase;
        text-decoration: none;
        transition:all ease 0.3s;
        -webkit-transition:all ease 0.3s;
        -moz-transition:all ease 0.3s;
        -ms-transition:all ease 0.3s;


}
#loadMore:hover{
     background:#76d898;
      color:#444649;
       padding: 11px 49px;
       border-radius:1px solid  #444649;
}
div.div.display {
	display: inline-block;
}
#homepage{
	height: auto;
	min-height: 100vh;
	background: #2c2c2c
}
html{
    background: #2c2c2c
}
body{
	 font-family: "SF-Regular", sans-serif;
}
h1,h2,h3,h4{margin:0;font-family: 'SF-Bold';}
/*MENU*/
a.logo img{    display: inline-block;}
#menu-header{position: relative;}
.div-center{min-height: 120px;height: auto;    z-index: 41;
    position: relative;}
.div-center > *{padding-top:20px}
h2.header-title{font-family: 'SF-Bold';color:#fff; font-size: 16px;text-transform: uppercase;margin-top:25px }
p.title-add{font-family: 'SF-Regular';color:#fff; font-size: 14px;margin-top:10px}
/*SOCIAL*/
.social{margin-top:14px;float:right;    width: 48%;}
.lang{display: inline-block;padding-right: 20px;    float: left;    padding-top: 5px;}
.lang a{font-size: 16px;color: #4b4b4b;  transition: all ease 0.3s;-webkit-transition: all ease 0.3s;  -ms-transition: all ease 0.3s;  -moz-transition: all ease 0.3s;}
.lang a:hover,.lang a.active,.lang span{color: #fff}
.lang span{padding: 0 3px}
.fa {
      padding: 4px;
    font-size: 17px;
    width: 22px;
    height: 22px;
  text-align: center;
  text-decoration: none;
  margin: 5px 2px;
  border-radius: 3px;
  background: #4b4b4b;
  color:#2c2c2c;
  transition: all ease 0.3s;
  -webkit-transition: all ease 0.3s;
  -ms-transition: all ease 0.3s;
  -moz-transition: all ease 0.3s;
}

.fa:hover {
    background: #4b4b4b;
 	 color:#fff;
 	 padding: 5px;
       text-decoration: none;
 	
}
.btn-close {
    position: absolute;
    top: 20px;
    right: 20px;
    z-index: 100;
    width: 17px;
    height: 21px;
    background: url(../images/x40.png) no-repeat center center;
    background-size: cover;
}
.coppy-right p{text-align:center;color:#fff;font-size:14px;background:#2c2c2c;z-index:2;padding-left: 8px;padding-right: 8px;position: relative;display: inline-block;}
.coppy-right a{text-align:center;color:#fff;font-size:14px;background:#2c2c2c;}
.coppy-right{margin:50px 0 10px 0;position:relative;text-align: center;}
.coppy-right:after{
    content:"";
    left:0;
    top: 44%;
    transform:translateY(-50%);
    width:100%;
    height:1px;
    background:#424242;
    position:absolute;
    z-index:1;
}
.coppy-right .fa-heart{
    background:transparent;
    color:#d82329
}
/*.fa-facebook {
  background: #3B5998;
  color: white;
}

.fa-twitter {
  background: #55ACEE;
  color: white;
}

.fa-google {
  background: #dd4b39;
  color: white;
}
.fa-pinterest {
  background: #cb2027;
  color: white;
}
.fa-tumblr {
  background: #2c4762;
  color: white;
}*/
/*div.info
{
    background-color: grey;
    float: left;
    clear: both;
    width: 100%;
    height: 200px;
    display: none;
}*/
#carousel-bounding-box{padding:40px  0}
#carousel-bounding-box .bx-wrapper{border:none;background:none !important; box-shadow:none}
 ul.bx-slider{padding:0;margin:0}
ul.bx-slider > li{margin:0;position:relative;z-index:2}
ul.bx-slider > li .main-img{background-position:center;background-size:cover;height:610px;padding-left:5px;padding-right:5px}
.bx-wrapper img {

    position: absolute;
    top:0;
    left:50%;
    transform: translate(-50%);
     -webkit-transform: translate(-50%);
      -ms-transform: translate(-50%);
      -moz-transform: translate(-50%);
}
.bx-wrapper{border:none;margin-bottom:0}
.headline{position:absolute;left:0;overflow:hidden;color:#fff;bottom:15px;left:50%;transform:translateX(-50%);-webkit-transform:translateX(-50%);-moz-transform:translateX(-50%)}
.headline .container-headline{width:auto;display:inline-block;text-align:left;position:relative}
.headline h3{font-size:24px;color:#fff;font-family:'Roboto-Regular';position:relative}
/*.section#slider-5   .bx-viewport{position:absolute!important}*/
 .bx-wrapper .bx-pager.bx-default-pager a{background:#fff;border:0px solid #fff;width:13px;height:13px;border-radius:50%}
.bx-wrapper .bx-pager.bx-default-pager a{z-index:150;width:18px;height:18px;padding:2px;border:2px solid #dfb83f;margin:10px 0}
.bx-wrapper .bx-pager.bx-default-pager a.active,.bx-wrapper .bx-pager.bx-default-pager a:focus,.bx-wrapper .bx-pager.bx-default-pager a:hover{background:#dfb83f;border:2px solid #dfb83f;width:18px;height:18px}
.bx-wrapper .bx-next,.bx-wrapper .bx-prev{width:50px;height:96px;top:50%;transform:translateY(-50%);margin-top:-30px}
#carousel-bounding-box .bx-wrapper .bx-next{background: url("../images/slide-next.jpg") center center no-repeat;right:0%;width:50px;height:96px;}
#carousel-bounding-box .bx-wrapper .bx-prev{background: url("../images/slide-prev.jpg") center center no-repeat;left:0%;width:50px;height:96px;}
 .control { position: absolute; bottom: 0px; left: 0px; right: 0px; overflow: auto; display: flex; align-items: center; }
 .control .next-prev { width: 50%; float: left; background-color: rgba(255,255,255,.5); text-align: right; padding-top: 28px; padding-right: 25px; padding-bottom: 22px; }
 .control .next-prev a { font-size: 18px; color: #666666; text-decoration: none; display: inline-block; padding-left: 20px; padding-right: 25px; }

.hide-bullets .col-sm-3{ padding-left: 2px;
    padding-right: 2px;}

.relative{
    display:none;
      position: absolute;
    z-index: 1000;
    background: #232323;
    width: 100%;
    top: 419px;
    height: auto;
    min-height: 664px;
    padding-left: 15px;
    padding-right: 15px;

}

.glp-arrow{
    content:"";
    position:absolute;
        display: block;
    position: absolute;
    z-index: 1;
    top: -60px;
    left: 12.5%;
    margin-left: -30px;
    width: 0;
    height: 0;
    border: 30px solid transparent;
    border-bottom-color: #232323;

}

homepage#home .info  [class*='col-']{    padding-left: 0px;
    padding-right: 0px;
}
   .homepage#home .info h3 {
    display: inline-block;
    font-family: SF-UI-Display-Light;
    color: #8e9095;
     font-size:18px;
         margin-top: 0px;
                text-transform:initial;
                display:inline-block

    }
.homepage#home .info div p {
    display: inline-block;
    font-family: SF-UI-Display-Light;
    color: #fff;
     font-size:20px;
         margin-top: 0px;
}
.homepage#home .lg-preview-descr .info{margin-bottom:20px}
.homepage#home .lg-preview-descr .info  .row{
   margin-top: 10px;
    margin-bottom: 10px;
    border-bottom:1px solid #393939
}
.homepage#home .lg-preview-descr .info .col-xs-4{padding-left:0px}
.homepage#home .lg-preview-descr .info .row:last-child{
    border-bottom:none;
}
.homepage#home .lg-preview-descr .info  .row:first-child p{
    font-family:SF-Bold
}
.homepage#home .lg-preview-descr .info  .row:last-child p{font-size:16px;}
ul.list-img{list-style-type:none}
.bx-pager a{color:#fff;font-size:16px; cursor:pointer;display:inline-block;background-size:cover;width:102px;height:108px;margin-right:10px;}
.bx-pager a.active{border: 2px solid yellow;}
#slider-thumbs{
    height:266px;
       overflow: auto;
}
#slider-thumbs::-webkit-scrollbar{background:#444444;width:3px;height:11px}
#slider-thumbs::-webkit-scrollbar-thumb:hover{background:#929250}
#slider-thumbs::-webkit-scrollbar-thumb{background:#929250;border-radius:10px}
@media (min-width: 768px){
    .container.container-cus {
    width: 700px;
}
}
@media (min-width: 992px) {
    .container.container-cus {
        width: 970px;
    }
}
@media (min-width: 1360px){
.container.container-cus {
    width: 1170px;
}
}
@media (min-width: 1680px){
.container.container-cus {
    width: 1600px;
}
    #slider-thumbs {
        height: 266px;
    }

}
@media screen and (max-width:1440px) and (min-width:992px){
    /*.gl-preview-container .col-md-7,.gl-preview-container .col-md-5{
        width:50%
    }*/
}
@media screen and (max-width:1440px) {
    .homepage#home .info h3 {font-size: 15px;}
    .homepage#home .info div p {font-size: 16px;margin-top: 0px;}
    h2.header-title {font-size: 14px;}
    .fa {padding: 4px;font-size: 15px;}
    ul.bx-slider > li .main-img {height: 585px;}
    .social {width: 70%;}
    .lg-preview-descr .col-xs-4{padding:0}
}
@media screen and (max-width:1280px){
    ul.bx-slider > li .main-img {
    height: 485px;
}
    .lg-preview-descr {
    padding-top: 45px !important;
}
     .social {    width: 100%;}
}
@media screen and (max-width:1280px) and (min-width:992px){
    .relative {min-height: 520px;}
    .lang {padding-right: 2px;}
}
@media screen and (max-width:768px) {
h2.header-title {
    font-size: 19px;
}
    #album_container .album-item:hover .title,#album_container .album-item.grid-item--width2:hover .title {
font-size: 18px;
}

    /*.bx-viewport{height:100% !important}*/
    .bx-wrapper img {
    position: relative;
    /*left:25%;*/
    /* margin: auto; */
}
    #carousel-bounding-box {
    padding: 50px 0 0 0;
}
.lang {
    display: block;
    float: left;
    padding-top: 5px;
    margin-right: 15px;
    text-align: center;
}
    .lg-preview-descr {
        padding-top: 0px !important;
    }
    #album_container .album-item .bg{margin-bottom:0px}
}
@media screen and (max-width:640px) {
        .lang {
            display: block;
    float: unset;
    padding-top: 5px;
    margin-right: 75px;
    text-align: center;
    }
    .coppy-right p {
        font-size: 12px;
    }
    h2.header-title {
    font-size: 14px;
    padding: 0 15px;
}
    h2.header-title span{display:block}
    ul.bx-slider > li {
    width: 354px  !important;
}
    #carousel-bounding-box .bx-wrapper{margin-bottom:30px}
    .btn-close {
        top: 10px;
        right: 15px;
        z-index: 100;
        width: 15px;
        height: 21px;
    }

    #carousel-bounding-box .bx-wrapper .bx-prev, #carousel-bounding-box .bx-wrapper .bx-next {
        width: 30px;
        height: 45px;
    }

    a.logo img {
        margin: auto;
            display: block;
    }

    ul.bx-slider > li .main-img {
        height: 384px;
    }

    .social {
        float: unset;
        text-align: center;
        margin-bottom: 20px;
        margin-top: -10px;
    }

    .lang {
        margin-right: 0px;
        text-align: center;
        padding-right: 0;
    }

    .textCenter {
        display: inline-block;
    }

    p.title-add {
        font-size: 12px;
    }
}
/************************ARROW*******************************/
@media screen and (min-width:1681px){
    #carousel-bounding-box .bx-wrapper .bx-prev{left:-137px}
    #carousel-bounding-box .bx-wrapper .bx-next {right: -86%;}
    }
@media screen and (max-width:1440px) and (min-width:1285px) {
      #carousel-bounding-box .bx-wrapper .bx-prev{left:-74px}
    #carousel-bounding-box .bx-wrapper .bx-next {right: -82.2%;}
}
@media screen and (min-width:1281px) and (max-width:2000px){
     .bx-viewport {
    height: 720px !important;
    width: 610px !important;
    margin: auto;

}
ul.bx-slider > li{margin:0;position:relative;z-index:2; height: 720px !important;width: 610px !important;}
ul.bx-slider > li .main-img{background-position:center;background-size:cover; height: 720px !important;width: 610px !important;padding-left:5px;padding-right:5px}
}
@media screen and (max-width:400px){
        p.title-add {
    font-size: 12px;
    padding:0 15px
}
}
 