*,:after,:before{box-sizing:border-box}h1,h2{margin:0;padding:0}input,select,textarea{letter-spacing:inherit}button,input,select,textarea{border:none;outline:none;background-color:transparent}button{cursor:pointer}html{margin-right:calc(-100vw - -100%);overflow-x:hidden}body{background-color:rgba(195,184,166,.5);font-family:Raleway,sans-serif;font-size:14px;letter-spacing:.3px}.fade-enter-active,.fade-leave-active{transition:opacity .3s}.fade-enter,.fade-leave-to{opacity:0}.delay-leave{opacity:1}.delay-leave-active{transition:opacity .5s}.recipe-ingredients-section{width:85%;margin-bottom:20px;padding:15px 10px 0 30px;background-color:#f5efd3}.recipe-ingredients-section .list{padding:5px}.recipe-ingredients-section .list-title{margin-bottom:5px;font-size:14px}.recipe-ingredients-section .ingredient{display:flex;align-items:center;padding:3px}.recipe-ingredients-section .ingredient:hover .delete-ingredient-button{opacity:1}.recipe-ingredients-section .ingredient-name{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;margin-right:8px}.recipe-ingredients-section .delete-ingredient-button{position:relative;width:15px;height:15px;opacity:0;transition:opacity .3s}.recipe-ingredients-section .delete-ingredient-button:after,.recipe-ingredients-section .delete-ingredient-button:before{content:"";position:absolute;top:3px;right:6px;width:1px;height:10px;background-color:#000}.recipe-ingredients-section .delete-ingredient-button:before{transform:rotate(45deg)}.recipe-ingredients-section .delete-ingredient-button:after{transform:rotate(-45deg)}.recipe-ingredients-section .form{display:flex;justify-content:space-between;flex-wrap:wrap;padding:5px}.recipe-ingredients-section .label-container-ingredient{width:40%}.recipe-ingredients-section .input-ingredient,.recipe-ingredients-section .select-category{width:100%;margin-bottom:20px;padding:5px 5px 3px;border-bottom:1px solid #000}.recipe-ingredients-section .select-category{width:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.recipe-ingredients-section .select-container{display:inline-block;position:relative;width:70%}.recipe-ingredients-section .select-container:before{content:"";position:absolute;top:5px;right:10px;border-bottom:1px solid #000;border-right:1px solid #000;width:10px;height:10px;transform:rotate(45deg)}.recipe-ingredients-section .add-ingredient-button{display:inline-block;position:relative;align-self:center;width:20px;height:20px}.recipe-ingredients-section .add-ingredient-button:after,.recipe-ingredients-section .add-ingredient-button:before{content:"";position:absolute;top:0;right:50%;width:1px;height:15px;background-color:#000}.recipe-ingredients-section .add-ingredient-button:after{transform:rotate(90deg)}.recipe-ingredients-section .message{margin-bottom:10px;font-size:13px}.recipe-ingredients-section .suggestions-area{height:auto;padding:5px}.recipe-ingredients-section .suggestion{margin-bottom:10px;margin-right:8px;padding:5px;border:1px solid grey}.recipe-ingredients-section .suggestion:hover{background-color:#f0e6ba}.recipe-ingredients-section .suggestion:focus{background-color:#ffc69e}@media screen and (max-width:500px){.recipe-ingredients-section .label-container-ingredient{width:75%}.recipe-ingredients-section .message{font-size:12px}}@media screen and (max-width:350px){.recipe-ingredients-section .label-container-ingredient{width:80%}.recipe-ingredients-section .message{font-size:11px}}.recipe-form{display:flex;flex-direction:column;align-items:center;width:100%}.recipe-form .title{margin-bottom:20px;text-align:center;font-size:22px;letter-spacing:.5px}.recipe-form .label-container{width:65%}.recipe-form .label-text{display:block;margin-bottom:5px;font-size:13px}.recipe-form .input{width:100%;margin-bottom:20px;padding:5px 5px 3px;border-bottom:1px solid #000}.recipe-form .add-recipe-button{padding:8px;border:1px solid #000;background-color:#f5efd3}.recipe-form .add-recipe-button:disabled{border:1px solid #ccc;color:#ccc;cursor:default}.ingredient-list{margin-bottom:70px}.ingredient-list .title{margin-bottom:10px;text-align:center;font-size:22px;letter-spacing:.5px}.ingredient-list .category-title{margin-bottom:10px;padding:5px;padding-top:10px;border-bottom:1px solid #000;font-size:18px;font-weight:400}.ingredient-list .ingredient{position:relative;width:100%;padding:10px}.ingredient-list .ingredient:hover .delete-button{opacity:1}.ingredient-list .availability-button{display:flex;align-items:center}.ingredient-list .checkbox{margin-right:8px;cursor:pointer}.ingredient-list .delete-button{position:absolute;top:10px;right:10px;width:20px;height:20px;opacity:0;transition:opacity .3s}.ingredient-list .delete-button:after,.ingredient-list .delete-button:before{content:"";position:absolute;top:1px;right:8px;width:1px;height:15px;background-color:#000}.ingredient-list .delete-button:before{transform:rotate(45deg)}.ingredient-list .delete-button:after{transform:rotate(-45deg)}.ingredient-list .delete-button:disabled{cursor:default}.ingredient-list .delete-button:disabled:after,.ingredient-list .delete-button:disabled:before{background-color:grey}@media screen and (max-width:350px){.ingredient-list .category-title{font-size:15px}}.ingredients{width:70%;margin-left:auto;margin-right:auto}.ingredients .add-form{display:flex;flex-direction:column;align-items:center;width:100%}.ingredients .form-title{margin-bottom:15px;text-align:center;font-size:18px}.ingredients .form-block,.ingredients .label-container-ingredient{width:90%}.ingredients .label-container-category{width:85%}.ingredients .form-block{display:flex;justify-content:space-between}.ingredients .label-text{display:block;font-size:13px}.ingredients .input-name,.ingredients .select-category{width:100%;margin-bottom:15px;padding:10px 5px 3px;border-bottom:1px solid #000}.ingredients .select-category{-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.ingredients .select-container{position:relative;width:100%}.ingredients .select-container:before{content:"";position:absolute;top:10px;right:18px;border-bottom:1px solid #000;border-right:1px solid #000;width:10px;height:10px;transform:rotate(45deg)}.ingredients .add-button{position:relative;align-self:center;width:20px;height:20px}.ingredients .add-button:after,.ingredients .add-button:before{content:"";position:absolute;top:0;right:50%;width:1px;height:18px;background-color:#000}.ingredients .add-button:after{transform:rotate(90deg)}@media screen and (max-width:350px){.ingredients{width:80%}}.sidebar{position:fixed;top:0;right:0;width:420px;overflow:visible;transform:translateX(100%);transition:transform .5s}.sidebar.show{transform:translateX(0)}.sidebar .buttons-container{position:absolute;top:50px;left:0;transform-origin:right bottom;transform:translateX(-100%) rotate(-90deg)}.sidebar .ingredients-button,.sidebar .recipe-form-button{padding:5px 10px;background-color:#f0e6ba;transition:background-color .3s}.sidebar .ingredients-button.active,.sidebar .recipe-form-button.active{background-color:#ffc69e}.sidebar .recipe-form-button{margin-left:20px}.sidebar .sidebar-content{height:100vh;padding:40px 30px 60px;overflow:auto;background-color:#f0e6ba}@media screen and (max-width:500px){.sidebar{width:300px}.sidebar .sidebar-content{padding-left:15px;padding-right:15px}}@media screen and (max-width:350px){.sidebar{width:250px}.sidebar .sidebar-content{padding-left:15px;padding-right:15px}}.recipe-list{width:100%;max-width:1300px;min-height:100vh;margin-left:auto;margin-right:auto;padding:30px;overflow:auto}.recipe-list .title{margin-bottom:20px;font-size:22px;letter-spacing:.5px}.recipe-list .display-modes{display:flex;margin-bottom:20px}.recipe-list .radio-button{display:none}.recipe-list .mode-button{display:block;margin-right:10px;padding:5px 10px;background-color:#f0e6ba;cursor:pointer;transition:background-color .2s}.recipe-list .mode-button:hover{background-color:#f5efd3}.recipe-list .mode-button.active{background-color:#ffc69e}.recipe-list .recipe{display:flex;flex-direction:column;position:relative;margin-bottom:30px;padding:20px 25px 25px}.recipe-list .recipe:before{content:"";position:absolute;top:0;left:0;z-index:-1;width:100%;height:100%;background-color:#bab8c2;transition:transform .3s}.recipe-list .recipe:hover .buttons-container{opacity:1}.recipe-list .recipe:hover:before{transform:scale(1.05)}.recipe-list .recipe-title{margin-bottom:15px;font-size:18px}.recipe-list .ingredients-container{align-self:center;width:105%;margin-bottom:15px;padding:5px;background-color:#cac8d0}.recipe-list .ingredient{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;padding:3px 4px}.recipe-list .ingredient.absent{background-color:rgba(255,198,158,.5)}.recipe-list .method{margin-bottom:15px;line-height:1.4}.recipe-list .buttons-container{display:flex;align-items:center;position:absolute;top:15px;right:10px;opacity:0;transition:opacity .3s}.recipe-list .edit-button{padding:5px}.recipe-list .delete-button{position:relative;width:20px;height:20px}.recipe-list .delete-button:after,.recipe-list .delete-button:before{content:"";position:absolute;top:1px;right:8px;width:1px;height:15px;background-color:#000}.recipe-list .delete-button:before{transform:rotate(45deg)}.recipe-list .delete-button:after{transform:rotate(-45deg)}.home .main-content{transition:transform .8s}.home .main-content.parallax{transform:translateX(-20px)}.home .test-data-message{display:flex;flex-direction:column;justify-content:space-between;align-items:center;position:absolute;bottom:10%;left:5%;width:380px;height:130px;padding:10px 0 20px;background-color:#bab8c2}.home .data-buttons-container{display:flex;justify-content:space-between;width:85%}.home .data-button{width:150px;height:45px;font-size:13px;background-color:#cac8d0;transition:background-color .3s}.home .data-button:hover{background-color:#bab8c2}