nav {

    margin: 27px auto 0;
    
    position: relative;
    
    width: 430px;
    
    height: 50px;
    
    background-color: #34495e;
    
    border-radius: 8px;
    
    font-size: 0;
    
    }
    
    nav a {
    
    line-height: 50px;
    
    height: 100%;
    
    font-size: 15px;
    
    display: inline-block;
    
    position: relative;
    
    z-index: 1;
    
    text-decoration: none;
    
    text-transform: uppercase;
    
    text-align: center;
    
    color: white;
    
    cursor: pointer;
    
    }
    
    nav .animation {
    
    position: absolute;
    
    height: 100%;
    
    top: 0;
    
    z-index: 0;
    
    transition: all .5s ease Os;
    
    border-radius: 8px;
    
    }
    a:nth-child(1) {

        width: 200px;
        
        }
        
        a:nth-child(2) {
        
        width: 200px;
        
        }
        
        
        
        nav.start-home, a:nth-child(1):hover~.animation {
        
        width: 200px;
        
        left: 0;
        
        background-color: #e55a5a;
        
        }
        
        nav.start-about, a:nth-child(2):hover~.animation {
        
        width: 200px;
        
        right: 0px;
        
        background-color:#e55a5a;
        
        }
       
            body {
            
            font-size: 12px;
            
            font-family: sans-serif;
            
            background: #ffffff;
            
            }
            
            }
            
            span {
            
            color: #2BD6B4;
            
            }