* { font-family: 'courier'; font-size: 16px; color: #000; }

html {

    height: 100%; min-height: 100%;

}

body {

	margin: 0;

	padding: 0;

	position: relative;

	width: 100%;

	background-repeat: no-repeat;

	background-color: #FFF;

}

.inner { width: 1140px; margin: 0 auto; box-sizing: border-box; position: relative;}

.inner2 { width: 1500px; max-width: 100%; margin: 0 auto;  box-sizing: border-box; position: relative; }

.relative { position: relative; }

.absolute { position: absolute; }

fieldset { border: none; padding: 0; margin: 0; }

.fl { float: left; }

.fr { float: right; }

.ff { clear: both; margin: 0; padding: 0; }



a { outline: none; text-decoration: none; }

a img { border: none; }

a:hover {cursor: pointer;}

h1, h2, h3, h4, h5, h6 { margin: 0px; }

.absolute-index { z-index: 999; }

*:focus {

    outline: none;

}



.abs-center {

    position: absolute;

    max-width: 100%;

    top: 50%;

    left: 50%;

    -moz-transform: translateX(-50%) translateY(-50%);

    -webkit-transform: translateX(-50%) translateY(-50%);

    -o-transform: translateX(-50%) translateY(-50%);

    -ms-transform: translateX(-50%) translateY(-50%);

    transform: translateX(-50%) translateY(-50%);

}

.anim {

    -webkit-transition: 0.4s;

    -moz-transition: 0.4s;

    -o-transition: 0.4s;

    transition: 0.4s;

}

.anim2 {

    -webkit-transition: 0.7s;

    -moz-transition: 0.7s;

    -o-transition: 0.7s;

    transition: 0.7s;

}



@font-face {

    font-family: 'courier_newregular';

    src: url('../fonts/courier_new-webfont.woff2') format('woff2'),

    url('../fonts/courier_new-webfont.woff') format('woff');

    font-weight: normal;

    font-style: normal;



}



.fullpage .section {

    position: relative;

}

.fullpage .section:first-child {

    background-color: #fff;

}

.fullpage .section:nth-child(2) {

    background-color: #d7d7d7;

}



.logo {

    display: block;

    width: 207px;

    height: 41px;

    background: url(../img/logo-top.png) no-repeat center;

    position: absolute;

    top: 50px;

    left: 50px;

}



.fullpage .section:first-child .text-box {

    width: 100%;

    padding: 0 50px;

    box-sizing: border-box;

    text-align: center;

    font-size: 24px;

    line-height: 1.1;

}

.fullpage .section:first-child .text-box .txt {

    font-size: 24px;

    line-height: 1.1;

    opacity: 0;

    position: relative;

    z-index: 2;

}

.fullpage .section:first-child .text-box h2 {

    font-size: 36px;

    line-height: 1;

    opacity: 0;

    position: relative;

    z-index: 2;

}

.fullpage .section:first-child .text-box h2.active {

    opacity: 1;



}

.fullpage .section:first-child .text-box .labelbox {

    width: 124px;

    height: 1px;

    background: url(../img/label-box.png) no-repeat bottom left;

    position: absolute;

    bottom: 110px;

    left: 0;

    right: 0;

    margin: auto;

    -webkit-transition: 0.9s;

    -moz-transition: 0.9s;

    -o-transition: 0.9s;

    transition: 0.9s;

}

.fullpage .section:first-child .text-box .labelbox.active {

    height: 253px;

}

.fullpage .section:first-child .text-box span {

    color: #b2030f;

    font-size: 24px;

}



.fullpage .section:nth-child(2) .text-box {

    width: 1400px;

    max-width: 100%;

}

.fullpage .section:nth-child(2) .text-box h3 {

    font-size: 24px;

    line-height: 1;

    margin-bottom: 20px;

    position: relative;

}

.fullpage .section:nth-child(2) .text-box h3:after {

    content: "";

    width: 15px;

    height: 1px;

    background-color: #595959;

    position: absolute;

    top: 100%;

    left: -40px;

}

.fullpage .section:nth-child(2) .text-box .item {

    font-size: 14px;

    line-height: 19px;

    padding-left: 80px;

    opacity: 0;

}

.fullpage .section:nth-child(2) .text-box .item4 {

    margin-top: 50px;

}

.fullpage .section:nth-child(2) .text-box .item a {

    color: #000;

}

.fullpage .section:nth-child(2) .text-box .item ul {

    list-style-type: none;

    margin: 0;

    padding: 0;

}

.fullpage .section:nth-child(2) .text-box .item ul li {

    float: left;

    position: relative;

    font-size: 14px;

    display: inline-block;

    margin-right: 45px;

}

.fullpage .section:nth-child(2) .text-box .item ul li:after {

    content: "";

    display: block;

    width: 3px;

    height: 3px;

    border-radius: 50%;

    background-color: #000;

    position: absolute;

    top: 7px;

    right: -22px;

}

.festivals {

    display: block;

    background: url(../img/festivals.png) no-repeat center;

    width: 100px;

    height: 36px;

    position: absolute;

    left: 0;

    right: 0;

    margin: auto;

    bottom: 50px;

    opacity: 0;

}
.biography {

    display: block;

    background: url(../img/biography.png) no-repeat center;

    width: 100px;

    height: 36px;

    position: absolute;

    left: 0;

    right: 0;

    margin: auto;

    bottom: 50px;

    opacity: 0;

}
.btn-scrolldown {

    display: block;

    background: url(../img/arrow-down.png) no-repeat center;

    width: 30px;

    height: 36px;

    position: absolute;

    left: 0;

    right: 0;

    margin: auto;

    bottom: 50px;

    opacity: 0;

}

.btn-scrollup {

    display: block;

    background: url(../img/arrow-up.png) no-repeat center;

    width: 30px;

    height: 36px;

    position: absolute;

    left: 0;

    right: 0;

    margin: auto;

    bottom: 50px;

    opacity: 0;

}



.animated {

    -webkit-animation-duration: 1s;

    animation-duration: 1s;

    -webkit-animation-fill-mode: both;

    animation-fill-mode: both;

}



@-webkit-keyframes fadeInDown {

    from {

        opacity: 0;

        -webkit-transform: translate3d(0, -100%, 0);

        transform: translate3d(0, -100%, 0);

    }



    to {

        opacity: 1;

        -webkit-transform: none;

        transform: none;

    }

}



@keyframes fadeInDown {

    from {

        opacity: 0;

        -webkit-transform: translate3d(0, -100%, 0);

        transform: translate3d(0, -100%, 0);

    }



    to {

        opacity: 1;

        -webkit-transform: none;

        transform: none;

    }

}



.fadeInDown {

    -webkit-animation-name: fadeInDown;

    animation-name: fadeInDown;

}





@-webkit-keyframes fadeIn {

    from {

        opacity: 0;

    }



    to {

        opacity: 1;

    }

}



@keyframes fadeIn {

    from {

        opacity: 0;

    }



    to {

        opacity: 1;

    }

}



.fadeIn {

    -webkit-animation-name: fadeIn;

    animation-name: fadeIn;

}



@-webkit-keyframes fadeInUp {

    from {

        opacity: 0;

        -webkit-transform: translate3d(0, 100%, 0);

        transform: translate3d(0, 100%, 0);

    }



    to {

        opacity: 1;

        -webkit-transform: none;

        transform: none;

    }

}



@keyframes fadeInUp {

    from {

        opacity: 0;

        -webkit-transform: translate3d(0, 100%, 0);

        transform: translate3d(0, 100%, 0);

    }



    to {

        opacity: 1;

        -webkit-transform: none;

        transform: none;

    }

}



.fadeInUp {

    -webkit-animation-name: fadeInUp;

    animation-name: fadeInUp;

}
.item-img {
    text-align: left;
}

.item-img img {
    max-width: 356px;
    height: auto;
    filter: grayscale(100%);
    opacity: 0.9;
	display: block;
}
.item-img img {
    filter: grayscale(100%) contrast(110%);
}
.item-img img {
    filter: grayscale(100%);
    transition: 0.4s;
}
.item-img img:hover {
    filter: grayscale(0%);
}
@media (max-width: 768px) {
    .item-img {
        margin: 30px 0;
    }
}
assets/
 └─ img/
     └─ burkay.jpg