/* Импортируем шрифты */
@import url('https://fonts.googleapis.com/css?family=Roboto|Lato|Philosopher|Raleway&display=swap');

body{
    padding: 0;
    margin: 0;
    background:#f2f2f2;
    font-family: "Roboto";
    font-weight: 300;
    font-size: 18px;
    color: #555;                            /* Цвет блока footera 'all rights reserved' */

    -webkit-font-smoothing: antialiased;
    -webkit-overflow-scrolling: touch;

    margin-top: 70px;
}

h1, h2, h3, h4, h5, h6, a, p {              /* Стили для заголовков */
    font-family: "Roboto";
    font-weight: 300;
    color: #333;
}

p {                                         /* Стили для параграфов */
    line-height: 22px;
    margin-bottom: 2px;
}

.text-comment {
    text-align: justify;
}

a {                                         /* Стили для ссылок */
    color: #F85c37;
}

a: hover, a: focus {                        /* Стили для ссылок при наведении и при фокусировке */
    color: #7b7b7b;
    text-decoration: none;
    outline: 0;
}

.navbar{                                    /* Стили для навигации сайта */
    font-weight: 800;
    font-size: 14px;
    padding-top: 15px;
    padding-bottom: 15px;
}

.navbar-inverse {
    background: #2d2d2d;
    border-color: #2d2d2d;                  /* Цвет границы навигации сайта */
}

.navbar-inverse .navbar-nav > .active > a {
    background-color: #F97300;
}

.nav-link , .navbar-brand{
    color: #f4f4f4;
    cursor: pointer;
}

.nav-link{
    margin-right: 1em !important;
}

.nav-link:hover{
    background: #999;
    color: white;

}

.navbar-collapse{
 justify-content: flex-end;
 overflow: auto;
}

.navbar-collapse a {
    color: white;
    font-size: 20px;
}

.navbar-collapse a:hover {
    background-color: #000;
}

.navbar-toggler{
  background:#fff !important;
}

/**********************************************************/
/*                      ПРОКРУТКА                         */
/**********************************************************/

#menu li {
    background: rgba(255, 255, 255, 0.5);
    border-radius: 4px;
    color: #000;
    display: inline-block;
    margin: 10px;
}
 
/*Стиль ссылки когда активен соответствующий блок*/
#menu li a, #menu li.active a {
    display: block;
    padding: 9px 18px;
    text-decoration: none;
    color:#ccc;
}
 
/*Стиль элемента списка когда активен соответствующий блок*/
#menu li.active {
    background: rgba(0, 0, 0, 0.5);
    color: #fff;
}


/**********************************************************/



.centered {                                 /* класс centered */
    text-align: center;                     /* выравнивает текст по центру */
}

.centered {                                 /* класс centered */
    text-align: center;                     /* выравнивает текст по центру */
}

.w {                                        /*  */
    padding-top: 35px;                      /*  */
}

.w h4 {                                     /*  */
    font-size: 30px;                        /*  */
}

#akcii {                                       /*  */
    background: #e0e0e0;                    /*  */
    padding-top: 70px;                      /*  */
    padding-bottom: 70px;                   /*  */
    text-align: center;                     /*  */
}

#akcii h4 {                                    /*  */
    font-size: 40px;                        /*  */
}

#akcii a {
    cursor: default;
}

.tilt {                                     /*  */
    -webkit-transition: all 0.5s ease;      /*  */
    -moz-transition: all 0.5s ease;         /*  */
    -o-transition:  all 0.5s ease;          /*  */
    -ms-transition: all 0.5s ease;          /*  */
    transition: all 0.5s ease;              /*  */
}

.tilt:hover {                               /*  */
    -webkit-transform: rotate(-10deg);      /*  */
    -moz-transform: rotate(-10deg);         /*  */
    -o-transform: rotate(-10deg);           /*  */
    -ms-transform: rotate(-10deg);          /*  */
    transform: rotate(-10deg);              /*  */
}

/* Стили для картинки*/
.wb {                                       /*  */
    padding-top: 35px;                      /*  */
    margin-bottom: 10px;                    /*  */
}

.wb h4 {                                    /*  */
    font-size: 35px;                        /*  */
    text-align: center;                     /*  */
}

#partners {                                       /*  */
    background: #ebebeb;                    /*  */
    padding-top: 70px;                      /*  */
    padding-bottom: 70px;                   /*  */
    text-align: center;                     /*  */
}
#partners h4 {                              /*  */
    font-size: 45px;                        /*  */
    text-align: center;                     /*  */
}

#contacts {                                  /* стили блока red-box */
    background: #99764d;                    /* фон блока */
    padding-top: 70px;                      /* внутренний отступ сверху */    
    padding-bottom: 70px;                   /* внутренний отступ снизу */
    cursor: default;
}

#contacts a {
    cursor: default;
}

#contacts h4 {                               /* стили заголовков блока red-box */
    color: white;                           /* цвет шрифта */
    font-size: 45px;                        /* размер шрифта */
    cursor: default; 
}

#contacts p, h5 {                               /* стили текста блока red-box */
    color: white;                               /* цвет текста */
    cursor: default;                           
}

#footer {                                   /* стили footera */
    background: #2d2d2d;                    /* фон footera */
    padding-top: 50px;                      /* внутренний отступ сверху */
    padding-bottom: 50px;                   /* внутренний отступ снизу */
}

#footer i{                                  /* стили footera */
    color: #bdbdbd;                         /* цвет footera */
    font-size: 30px;                        /* высота шрифта footera */
    padding: 20px;                          /* внутренний отступ со всех сторон footera */
}
#footer i:hover {                           /* стили footera при наведении */
    color: #99764d;                         /* цвет при наведении */
}

.left carousel-control {                    /*  */
    text-decoration: none;                  /*  */
    color: #fff;                            /*  */
    font-size: 40px;                        /*  */
    margin-top: -28px;                      /*  */
    position: absolute;                     /*  */
    top: 50%;                               /*  */
}

.right carousel-control {                   /*  */
    text-decoration: none;                  /*  */
    color: #fff;                            /*  */
    font-size: 40px;                        /*  */
    margin-top: -28px;                      /*  */
    position: absolute;                     /*  */
    top: 50%;                               /*  */
}

.carousel-inner > .item > img,              /*  */
  .carousel-inner > .item > a > img {       /*  */
      width: 100%;                          /*  */
      margin: auto;                         /*  */
  }

.scrollup {                                 /* стиль для кнопки прокрутки сайта наверх */
    width:40px;                             /* ширина кнопки */
    height:40px;                            /* высота кнопки */
    opacity:0.3;                            /* значение непрозрачности элемента */
    position:fixed;                         /* фиксируем позицию кнопки */
    bottom:50px;                            /* отступ снизу от края страницы */    
    right:100px;                            /* отступ справа от края страницы */
    display:none;                           /* делаем её невидимой вначале страницы */ 
    text-indent:-9999px;                    /* размеротступа(пустого места) перед строкой в блоке */
    background: url('../img/icon_top.png') no-repeat;   /*  */
}

.wrap_images img{
    width: 25%;
    height: auto;
}

@media and (max-width: 768px){
 .team .item img{
    width: 100%;
 }  
}
.header{
     position: relative;

     background-size: cover;
     background-position: center;
 }
.overlay{
    position: absolute;
    min-height: 100%;
    min-width: 100%;
    left: 0;
    top: 0;
    background: rgba(244, 244, 244, 0.79);
}
.description{
    position: absolute;
    top: 30%;
    margin: auto;
    padding: 2em;

}
.description h1{
    color:#F97300 ;
}
.description p{
    color:#666;
    font-size: 20px;
    width: 50%;
    line-height: 1.5;
}
.description button{
    border:1px  solid #F97300;
    background:#F97300;
    color:#fff;
}

/***********************************************************/
/*                 АНИМАЦИЯ ТЕКСТА                         */
/***********************************************************/

.text-animation,
.text-animation:after {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    z-index: 0;
}
.text-animation li{
    z-index: 1000;
    position: absolute;
    bottom: 300px;
    left: 0px;
    width: 100%;
    text-align: right;
    opacity: 0;
    -webkit-animation: textAnimation 20s linear infinite 0s;
    -moz-animation: textAnimation 20s linear infinite 0s;
    -o-animation: textAnimation 20s linear infinite 0s;
    -ms-animation: textAnimation 20s linear infinite 0s;
    animation: textAnimation 20s linear infinite 0s;
    list-style-type:none;
}
.text-animation li h3 {
    font-family: 'Open Sans Condensed', sans-serif;
    text-transform:uppercase;
    font-size: 240px;
    padding: 0 400px;
    line-height: 120px;
    color:#F90;
}
.text-animation li:nth-child(2){
    -webkit-animation-delay: 4s;
    -moz-animation-delay: 4s;
    -o-animation-delay: 4s;
    -ms-animation-delay: 4s;
    animation-delay: 4s;
}
.text-animation li:nth-child(3){
    -webkit-animation-delay: 8s;
    -moz-animation-delay: 8s;
    -o-animation-delay: 8s;
    -ms-animation-delay: 8s;
    animation-delay: 8s;
}
.text-animation li:nth-child(4){
    -webkit-animation-delay: 12s;
    -moz-animation-delay: 12s;
    -o-animation-delay: 12s;
    -ms-animation-delay: 12s;
    animation-delay: 12s;
}
.text-animation li:nth-child(5){
    -webkit-animation-delay: 16s;
    -moz-animation-delay: 16s;
    -o-animation-delay: 16s;
    -ms-animation-delay: 16s;
    animation-delay: 16s;
}
.text-animation li:nth-child(6){
    -webkit-animation-delay: 20s;
    -moz-animation-delay: 20s;
    -o-animation-delay: 20s;
    -ms-animation-delay: 20s;
    animation-delay: 20s;
}
@-webkit-keyframes textAnimation { 
    0% {
        opacity: 0;
        -webkit-transform: translateX(200px);
    }
    8% {
        opacity: 1;
        -webkit-transform: translateX(0px);
    }
    17% {
        opacity: 1;
        -webkit-transform: translateX(0px);
    }
    19% {
        opacity: 0;
        -webkit-transform: translateX(-300px);
    }
    25% { opacity: 0 }
    100% { opacity: 0 }
}
@-moz-keyframes textAnimation { 
    0% {
        opacity: 0;
        -moz-transform: translateX(200px);
    }
    8% {
        opacity: 1;
        -moz-transform: translateX(0px);
    }
    17% {
        opacity: 1;
        -moz-transform: translateX(0px);
    }
    19% {
        opacity: 0;
        -moz-transform: translateX(-300px);
    }
    25% { opacity: 0 }
    100% { opacity: 0 }
}
@-o-keyframes textAnimation { 
    0% {
        opacity: 0;
        -o-transform: translateX(200px);
    }
    8% {
        opacity: 1;
        -o-transform: translateX(0px);
    }
    17% {
        opacity: 1;
        -o-transform: translateX(0px);
    }
    19% {
        opacity: 0;
         -o-transform: translateX(-300px);
    }
    25% { opacity: 0 }
    100% { opacity: 0 }
}
@-ms-keyframes textAnimation { 
    0% {
        opacity: 0;
        -ms-transform: translateX(200px);
    }
    8% {
        opacity: 1;
        -ms-transform: translateX(0px);
    }
    17% {
        opacity: 1;
        -ms-transform: translateX(0px);
    }
    19% {
        opacity: 0;
        -ms-transform: translateX(-300px);
    }
    25% { opacity: 0 }
    100% { opacity: 0 }
}
@keyframes textAnimation { 
    0% {
        opacity: 0;
        transform: translateX(200px);
    }
    8% {
        opacity: 1;
        transform: translateX(0px);
    }
    17% {
        opacity: 1;
        transform: translateX(0px);
    }
    19% {
        opacity: 0;
        transform: translateX(-300px);
    }
    25% { opacity: 0 }
    100% { opacity: 0 }
}

