body{
    margin: 0;
    padding: 0;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

a{
    text-decoration: none;
    color: #fff;
    font-size: 1em;
}
    
    
.header{
    font-size: 18vw;  
    color: #fff;
    font-weight: bold;
    text-align: center;
   
  
  }

section.sec1{
    width: 100%;
    height: 100vh;
    box-sizing: border-box;
    background-size: cover ;
    background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
	background-size: 400% 400%;
	animation: gradient 15s ease infinite;
}

nav
{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 70px;
    background-color: rgba(0, 0, 0, 0.26);
    padding: 0 100px;
    box-sizing:border-box;

}

nav .brand{
    float: left;
    height: 100%;
    line-height: 70px;
    color: #fff;
    text-decoration: none;

}

nav .brand h2{
     margin: 0;
     padding: 0;
     color: #fff; 
}

nav ul{
    float: right;
    display: flex;
    margin: 0;
    padding: 0;
    
}

nav ul li{

    list-style: none;
    
}
nav ul li a {
    position: relative;
    display: block;
    height: 70px;
    line-height: 70px;
    padding:  0 20px;
    box-sizing: border-box;
    color: #fff;
    text-decoration: none;
    text-transform: uppercase;
    transition: .5s;
    

}
nav ul li a:hover
{
    color: #daa4a4;
  
}
nav ul li a:before
{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transform-origin: right;
    transform: scaleX(0);
    transition: transform .5s;
    text-decoration: none;

}
nav ul li a:hover:before
{
    transform-origin: left;
    transform: scaleX(1);

}

.line{
    width: 1.4px;
    height: 9vw;
    color: black;
    margin: 0;
    margin-top: -2.3vw;
    background-color: black;
}

   

@keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}