.search-container{position:absolute;right:20px;bottom:0;height:100%;z-index:1}.search-container .search{position:absolute;right:-70px;bottom:34%;width:40px;height:40px;background:0 0;border-radius:50%;transition:all 1s;z-index:4;font-size:9px}.search-container .search:hover{cursor:pointer}.search-container .search::before{content:"";position:absolute;margin:auto;top:22px;right:0;bottom:0;left:22px;width:12px;height:2px;background:#fff;transform:rotate(45deg);transition:all .5s;zoom:.7}.search-container .search::after{content:"";position:absolute;margin:auto;top:-5px;right:0;bottom:0;left:-5px;width:25px;height:25px;border-radius:50%;border:2px solid #fff;transition:all .5s;zoom:.7}.search-container input{font-family:Montserrat,sans-serif;position:absolute;right:-70px;bottom:30%;width:50px;height:39px;outline:0;border:none;background:#fff;color:#000;padding:0 20px 0 20px;border-radius:3px;transition:all 1s;opacity:0;z-index:5;font-weight:100;letter-spacing:.1em;font-size:13px}.search-container input:hover{cursor:pointer}.search-container input:focus{width:200px;opacity:1;cursor:text;font-weight:500;font-size:13px;background:#fff;padding:12px;letter-spacing:0}.search-container input:focus~.search{right:-80px;background:#009ce0;bottom: 33%;z-index:6}.search-container input:focus~.search::before{top:0;left:0;width:25px;background:#fff}.search-container input:focus~.search::after{top:0;left:0;width:25px;height:2px;border:none;background:#fff;border-radius:0;transform:rotate(-45deg)}

@media (max-width:1024px) {
	.search-container {
	    position: relative;
	    right: 0;
	    top: 40px;
	    height: 100%;
	    z-index: 1;
	    width: 0px;
	    background: white;
	    width: 250px; 
	    height: 45px;
	}
	
	.search-container form {
	    width: 475px;
	    display: block;
	    background: white;
	}
	
.search-container form input {
    width: 70%;
    display: block;
    background: transparent;
    color: black;
    opacity: 1;
    letter-spacing: 0;
    left: 12px;
    top: 0px;
    font-weight: 500;
}
	
.search-container .search {
    position: absolute;
    bottom: 30%;
    width: 40px;
    left: 0;
    top: 1px;
    height: 40px;
    background: 0 0;
    border-radius: 50%;
    transition: all 1s;
    z-index: 9999999999;
    font-size: 9px;
    display: none;
}
}