*{
	margin:0px;
	padding:0px;
	box-sizing:border-box;
	
}
body{
	font-size:20px;
	overflow-x:hidden;
	color:white;
	font-family: 'Bubblegum Sans', cursive;

}

header{
	    background-image:linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.5)),url('auto54.jpg');
		background-size:cover;
		background-repeat:no-repeat;
		background-position:center;
		height:100vh;
	  
}

.clearfix:after{
	content:".";
	       visibility:hidden;
		   display:block;
		   height:0px;
		   clear:both;
		   
}
.image{
	     max-width:1180px
		 margin:0 auto;
}
.logo{
        height:140px;
		weight:auto;
		float:left;
		margin-top:30px;
		margin-left:25px;
		border:3px solid #8b008b;
		border-radius:360px;	
}


.box{
	    float:right;
	  margin-top:55px;
	  margin-right:25px;
	  
}
.box li{
	       display:inline-block;
		   list-style:none;
		   margin-left:40px;
}

.box li a{
	       padding:5px 0;
           color:#fff;
           text-decoration:none;
           text-transform:uppercase;
           font-size:90%;
           font-weight:100px;	   
}

.box li a:hover{
	   border-bottom:2px solid #bf6345;
}

.header-content{
	    width:1180px;
		position:absolute;
		top:55%;
		left:50%;
		transform:translate(-50%,-50%);
	
}

h1{
	color:#fff;
	font-size:240%;
	word-spacing:2px;
	letter-spacing:2px;
	margin-bottom:20px;
	text-transform:uppercase;
	font-weight:lighter;
	
}

.btn{
	  display:inline-block;
	  padding:10px 30px;
	  font-weight:lighter;
	  text-decoration:none;
	  text-transform:uppercase;
	  border-radius:200px;
	  transition:background-color 0.2s,border 0.2s,color 0.2s;
		
}

.btn-full{
	background-color:transparent;
	color:#fff;
	margin-right:15px;
	border:1px solid #48d80d;
	
}

.btn-full:hover{background-color:#391282;}

.btn-nav{
	background-color:transparent;
	color:#fff;
	border:1px solid #48d80d;
	
}

.btn-nav:hover{background-color:#ff69b4;}

.changecolor{
	  animation: changecolorhomeshopiie 2s infinite;
}

@keyframes changecolorhomeshopiie{
	0%{color:#fff;}
	25%{color:#48d80d;}
	50%{color:yellow;}
	100%{color:pink;}
}

.icon{display:none;}

@media only screen and (max-width:1180px){
	.header-content{
		 width:100%;
		 padding:0 2%;
	}
}

@media only screen and (max-width:998px){
    h1{font-size:200%;}	
}

@media only screen and (max-width:768px){
	h1{font-size:180%;}	
	
	.box{display:none;}
	
	.icon{
		display:inline-block;
		color:#fff;
		float:right;
		margin-right:30px;
		margin-top:25px;
	}
	
	.box{float:left;}
	
	
	.box li{
		 display:block;
		 margin-top:10px;
	}
}