
.go-up {
	position: fixed;
	width: 120px;
	height: 50px;
	line-height: 40px;
	font-size: 15px;
	left: -10px;
	bottom: 10px;
	cursor: pointer;
	text-align: center;
	z-index: 9999;
}


* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    list-style: none;
}

.cont {
    width: 100%;
    height: 99.3vh;
    perspective: 600px;
}

.cont .Header li {
    position: fixed;
    z-index: 9999;
    font-weight: bold;
    font-size: 30px;
    top: 38%;
}



/*Start Slider*/
.cont .slider {
    position: relative;
    height: 75%;
    z-index: 0;
}

.cont .slider .con-img {
    width: 100%;
    height: 100%;
    background-size: 100% 100%;
    -webkit-transition: all 1.5s ease-in-out;
    -moz-transition: all 1.5s ease-in-out;
    transition: all 1.5s ease-in-out;
    transform-origin: center;
}

.cont .slider span {
    position: absolute;
    top: 50%;
    z-index: 4;
    cursor: pointer;
}

.cont .slider span.arrowleft {
    left: 0;
}

.cont .slider span.arrowright {
    right: 0;
}

.cont .slider span img {

    border-radius: 50%;
}

.cont .slider .over {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;

    z-index: 1;
}

/*End Slider*/

/*Start navbar Img*/
.cont .images {
    height: 25%;
}

.cont .images ul {
    display: flex;
    justify-content: center;
    height: 100%;
}

.cont .images ul li {
    flex-basis: 200px;
    transition: all .5s ease;
    cursor: pointer;
}

.cont .images ul li.active {
    flex-grow: 1;
    box-shadow: 1px 2px 1px 1px #333;
    border: 1px solid #333;

}

.cont .images ul li img {
    display: inline-block;
    height: 100%;
    width: 100%;
}

/*End navbar Img*/

.animationClass {
    -webkit-animation: fade 1s ease-in-out 1;
    -moz-animation: fade 1s ease-in-out 1;
    animation: fade 1s ease-in-out 1;
    transform-style: preserve-3d;
}

@keyframes fade {
    0% {
        transform: translateZ(0px);
    }

    25% {
        transform: translateZ(100px);
    }

    50% {
        transform: translateZ(50px);
    }

    75% {
        transform: translateZ(100px);
    }

    100% {
        transform: translateZ(0px);
    }
}



@media only screen and (max-width: 600px) {
    .cont {
        width: 100%;
        height: 40vh;
        perspective: 600px;
    }

}

