*{
	margin:0px;
	padding: 0px;
}

body{
	background-image: url(../images/bg.png);
	padding-bottom: 99px;
	padding-top:160px;
	position: relative;
	background-color:#081b2b;
}


@keyframes hover {
    0% {
    	width: 0px;
     }

    100% {
    	width: 100%;
     }
}

@keyframes hover22 {
    0% {
    	width: 0px;
     }

    100% {
    	width:300px;
     }
}


body:before{
	display: block;
	content: " ";
	height: 2px;
	width: 100%;
	max-width: 1170px;
	background-color: #df5711;
	left: 50%;
	top:85px;
    transform: translate(-50%, 0);
    position: absolute;
     animation: hover 1.5s normal;
}

/* linear 
body:after{
	display: block;
	content: " ";
	height: 42px;
	width:320px;
 	background-color: #df5711;
	left:0%;
	top: 150px;
    transform: translate(-50%, 0);
    position: absolute;
     animation: hover22 1.5s normal;
}
*/

body .dots {
    display: block;
    content: " ";
    height: 50px;
    width: 50px;
    left: 1%;
    top:80px;
    position: absolute;
    display: flex;
    animation: hover2 1.5s normal;
}

.orange-pointers{
	left: 35%;
	position: absolute;
	top: 0px;

}

body .dots > div{
	width: 10px;
 	margin-right: 2px;
}


body .dots span{
	height: 5px;
	width: 5px;
 	background-color: #df5711;
 	display: block;
 	margin:5px ;
}


.main-logo{
	text-align: center;
 }

.main-logo img{
	display: inline-block;
}

.main-box{
	background-color: #0f151e;
	border:1px #2a384c solid;
	padding: 16px 10px;
	margin:28px 0; 
	position: center;
transition: all 111ms cubic-bezier(0.250, 0.250, 0.750, 0.750); /* linear */

transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750); /* linear */
}

.main-box:hover{
 	z-index: 999;
box-shadow: -1px 2px 25px 0px rgba(0,0,0,0.73);
-webkit-box-shadow: -1px 2px 25px 0px rgba(0,0,0,0.73);
-moz-box-shadow: -1px 2px 25px 0px rgba(0,0,0,0.73);


}


.main-box a{
	text-decoration: none;
	color: #fff;
	position: relative;
	display: block;
}

.main-box a span{
	position: absolute;
	bottom: -40px;
	left: 0px;
	width: 100%;
	opacity: 0;

	transition: all 333ms cubic-bezier(0.250, 0.250, 0.750, 0.750); /* linear */

transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750); /* linear */
}

.main-box a:hover span{
	bottom: -50px;
	opacity: 1;

}


footer{
	position:fixed;
	bottom: 0px;
	background-color: #0f151e;
	color: #fff;
	padding: 15px;
	font-size: 14px;
	text-align: center;
	text-transform: uppercase;
	width: 100%;
	border-top: 5px #fff solid; 
}

.row {
	margin-left: 5px;
	margin-right: 5px;
}

.row > div{
	padding: 5px;
	text-align: center;
}

.row > div img{
	display: inline-block;
	max-width: 100%;
}


@media screen and (max-width:980px) {
.container{
	width: 100%;
}

}


@media screen and (max-width:767px) {
.row > div{

	width: 100%;
}


body:after , body .dots{
	display: none;
}


}