.main-container{display:grid;grid-template-columns:1fr 2fr;width:60%;margin:auto;color:var(--text);box-shadow:0 0 3px #000}.main-page{background:var(--secondary)}.search-bar{background:var(--primary);height:60px;display:-webkit-flex;display:flex;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;align-items:center}.hamburger{margin-right:20px}.search-bar a{width:60%}.search-bar a input{width:100%;height:35px;box-sizing:border-box;border:0;padding-left:10px;font-size:1.1em;background:transparent;border-bottom:1px solid var(--text);color:var(--text);transition:all .5s ease}.search-bar a input:focus{border-bottom-color:var(--secondary)}.search-bar button{width:35px;height:35px;box-sizing:border-box;font-size:1.5em;display:-webkit-flex;display:flex;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;align-items:center;border:0;background:transparent;color:var(--text);transition:all .5s ease}.search-bar button:hover{color:var(--secondary)}.content-container{box-sizing:border-box;background:var(--primary);color:var(--text);border:2px solid var(--secondary);border-width:2px 0;overflow:auto}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:#fff}::-webkit-scrollbar-thumb{background:var(--primary);margin:3px}@media (min-width:768px){.content-container{border-left-width:2px}}@media (min-width:768px) and (max-width:1302px){.main-container{width:80%}}@media (min-width:0px) and (max-width:768px){.main-container{width:100%;display:inline-block}.main-page{z-index:0}}.chats{padding:30px 15px}.chats h1{font-size:1.5em;color:var(--secondary);text-align:center;margin:0}.chats .reload{display:-webkit-flex;display:flex;margin-top:20px;margin-bottom:20px;-webkit-justify-content:center;justify-content:center}.chat,.chats .reload{-webkit-align-items:center;align-items:center}.chat{display:grid;grid-template-columns:90px auto 20px;grid-gap:10px;color:var(--text);box-shadow:0 0 3px var(--tertiary);border:solid var(--text);border-width:1px 0;padding:10px;height:90px;transition:all .5s ease}.chat:hover{box-shadow:0 0 15px var(--tertiary)}.chat img{width:85px;height:85px}.chat div p{margin:0}.last-text{color:var(--text2);font-size:.9em;height:20px;overflow:hidden;text-overflow:ellipsis}.unread-marker{width:10px;height:10px;border-radius:50%;background:var(--secondary)}.no-friends{text-align:center}.no-friends p{color:var(--text)}.no-friends button{background:var(--secondary);padding:10px;box-sizing:border-box;color:var(--text2);margin-top:5px;border:0;border-radius:10px;transition:all .5s ease}.no-friends button:hover{-webkit-transform:scale(1.1);transform:scale(1.1)}.loading{width:30px;height:30px;border-left:3px solid var(--text);border-top:3px solid var(--text);border-radius:50%;border-bottom:3px solid transparent;border-right:3px solid transparent;-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite;margin:10px auto}.avatar,.conversation{box-shadow:0 0 3px var(--tertiary)}.avatar{display:grid;grid-template-columns:30px 60px auto 30px;height:50px;-webkit-align-items:center;align-items:center;padding:10px}.avatar a{color:var(--text);font-size:1.3em;transition:all .5s ease}.avatar a:hover{color:var(--secondary)}.avatar img{height:50px;width:50px}.texts{overflow:auto}.text{margin:10px;display:-webkit-flex;display:flex}.text-sent{-webkit-justify-content:flex-end;justify-content:flex-end}.text-sent button{background:transparent;color:var(--text);border:0;width:5px;font-size:.9em;margin-right:5px;transition:all .5s ease}.text-sent button:hover{color:var(--secondary)}.text-received{-webkit-justify-content:flex-start;justify-content:flex-start}.text p{margin:0;display:inline;box-shadow:0 0 5px var(--tertiary);border-radius:10px;padding:10px 15px;max-width:70%;background:var(--secondary)}.send-message{height:50px;box-shadow:0 0 3px var(--tertiary);display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center}.send-message input{width:90%;height:30px;background:transparent;padding-left:10px;padding-right:10px;font-size:1em}.send-message button,.send-message input{box-sizing:border-box;border:0;color:var(--text)}.send-message button{width:10%;height:50px;background:var(--secondary);font-size:1.5em}.send-message button svg{transition:all .5s ease}.send-message button:hover svg{-webkit-transform:scale(1.1);transform:scale(1.1);color:var(--primary)}.sidebar{padding:30px;-webkit-flex-direction:column;flex-direction:column;box-sizing:border-box;background:var(--primary)}.sidebar,.sidebar-logo{display:-webkit-flex;display:flex}.sidebar-logo{-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;align-items:center;width:100%}.sidebar-logo img{height:100px;width:100px;display:inline}.sidebar ul{margin:30px 0;padding:0;width:100%;-webkit-flex:3 1;flex:3 1}.sidebar li{margin-bottom:10px;transition:all .5s ease}.activeSidebarItem,.sidebar li:hover{border-left:2px solid var(--secondary);padding-left:10px}.sidebar ul li a{font-size:1.3em}.sidebar ul li:nth-child(2) div,.sidebar ul li a{color:var(--text);display:-webkit-flex;display:flex}.sidebar ul li:nth-child(2) div{height:30px;min-width:30px;max-width:auto;background:var(--secondary);border-radius:50%;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;align-items:center;font-size:.9em;margin-left:8px}.logout{-webkit-align-self:center;align-self:center}.logout p{text-align:center;margin:0 0 5px}.logout-btn{background:transparent;color:var(--secondary);border-radius:10px;border:0;width:70px;height:30px;font-weight:700;-webkit-align-self:center;align-self:center;transition:all 1s ease}.logout-btn:hover{background:var(--secondary);color:var(--text)}.sidebar-close{background:transparent;border:0;font-size:2em;color:var(--text);transition:-webkit-transform 1s;transition:transform 1s;transition:transform 1s,-webkit-transform 1s;width:75px;height:75px;transition:all .5s ease}.sidebar-close:hover{-webkit-transform:scale(1.1);transform:scale(1.1)}@media(min-width:0px) and (max-width:768px){.sidebar{position:absolute;background:var(--primary);width:100%;transition:-webkit-transform .5s ease;transition:transform .5s ease;transition:transform .5s ease,-webkit-transform .5s ease}.sidebar,.sidebar-inactive{visibility:hidden;-webkit-transform:translateX(-100%);transform:translateX(-100%)}.sidebar-inactive{transition:all .5s ease}.sidebar-active{transition:all .3s ease;visibility:visible;opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}.sidebar-close{-webkit-flex:2 1;flex:2 1;color:var(--text)}.sidebar-close svg{float:right}}.profile{display:grid;grid-template-columns:1fr;margin:30px;grid-gap:20px}.profile a{color:var(--text);font-size:1.3em;display:inline}.back-and-reload div{display:inline;float:right}.profile .reload{display:-webkit-flex;display:flex;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;align-items:center}.profile h1{color:var(--secondary);margin:0;justify-self:center}.profile-picture{display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;align-items:center}.profile-picture img{height:125px;width:125px}.profile-details div{display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center;box-shadow:0 0 3px var(--tertiary);padding:0 10px;margin-bottom:10px;transition:all .5s ease}.account-delete p:hover,.password-update div:hover,.profile-details div:hover{box-shadow:0 0 8px var(--tertiary)}.profile-details div p{-webkit-flex:3 1;flex:3 1}.profile-details div span{text-shadow:0 0 3px var(--text)}.profile-btn{border:0;color:var(--text);font-weight:700;font-size:1em;padding:10px;margin-bottom:10px;box-shadow:0 0 1px var(--tertiary);border-radius:10px}.profile-btn:hover{-webkit-transform:scale(1.03);transform:scale(1.03)}.init-upd-pwd{background:#61b329}.account-delete p,.password-update div{display:-webkit-flex;display:flex;box-shadow:0 0 3px var(--tertiary);margin-bottom:10px;padding:10px;transition:all .5s ease}.password-update label{-webkit-flex:3 1;flex:3 1}.password-update p{color:red;font-size:.9em}.account-delete button,.password-update button{margin-right:5px;background:transparent;color:var(--text);border:0;padding:5px}.account-delete button:hover,.password-update button:hover{box-shadow:0 0 3px var(--tertiary)}.init-del-acc{background:#bb2a3c}.profile-actions{width:90%;margin:0 auto 10px;text-align:center}.profile-actions p{margin:0 0 20px}.profile-action-buttons,.profile-action-buttons button{display:-webkit-flex;display:flex;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;align-items:center}.profile-action-buttons button{border:0;width:120px;height:35px;font-size:1em;box-shadow:0 0 3px var(--tertiary);border-radius:10px;transition:all .5s ease}.profile-action-buttons a{font-size:inherit}.profile-action-buttons button:hover{-webkit-transform:scale(1.03);transform:scale(1.03)}.normal-btn{background:var(--secondary);color:var(--text)}.var(--text)-btn{background:var(--text);color:var(--tertiary)}.red-btn{background:#bb2a3c;color:var(--text)}.green-btn{background:#61b329;color:var(--text)}@media (min-width:0px) and (max-width:1102px){.password-update div,.profile-details div{display:block;padding-top:1px;padding-bottom:10px}.password-update label{display:block;margin-top:5px;margin-bottom:5px}}.search-results{padding:30px;overflow:auto}.search-results a{color:var(--text);font-size:1.3em;transition:all 1s ease}.search-results a:hover{color:var(--secondary)}.search-results h4{text-align:center;font-weight:400}.result-item{margin-bottom:10px;display:grid;grid-template-columns:90px auto 30px;box-shadow:0 0 3px var(--tertiary);height:100px;-webkit-align-items:center;align-items:center;padding:10px;transition:all .5s ease}.result-item:hover{box-shadow:0 0 8px var(--tertiary)}.result-item img{height:85px;width:85px}.result-item h4{padding-left:10px;font-weight:400;justify-self:left;-webkit-align-self:left;align-self:left}.result-item a{color:var(--secondary);font-size:1.5em;color:var(--text)}@media (min-width:0px) and (max-width:768px){.search-results{padding:15px}.result-item h4{width:50%}}.notifications{padding:30px}.notifications h1{color:var(--secondary);text-align:center;font-size:1.5em;margin:0}.notifications h4{text-align:center;font-weight:400;-webkit-animation-iteration-count:63;animation-iteration-count:63}.notification{box-shadow:0 0 3px var(--tertiary);padding:15px;margin:20px 0 0}.notification p{margin:0 0 10px}.notification button{width:75px;height:25px;border:0;margin-right:5px;border-radius:10px;transition:all .5s ease}.notification button:hover{-webkit-transform:scale(1.05);transform:scale(1.05)}.notification a{float:right;color:var(--text);font-size:.9em;transition:all .5s ease}.notification a:hover{text-shadow:0 0 3px var(--text)}.notifications .reload{display:-webkit-flex;display:flex;text-align:center;margin:20px auto}.homepage{text-align:center;padding:30px 0;display:grid;grid-template-rows:200px auto auto auto;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;align-items:center;background:var(--primary);width:70%;margin:auto;box-sizing:border-box;box-shadow:0 0 1px #000}.homepage img{width:150px;height:150px}.homepage h1{margin:0;color:var(--text);text-shadow:0 2px 4px var(--secondary);font-family:Narkisim,"Segoe UI"}.homepage p{color:var(--text);width:50%;margin:20px auto}.homepage .links{display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column;margin:15px 0;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;align-items:center}.homepage a{color:var(--text);background:var(--secondary);font-weight:700;padding:10px;margin-bottom:10px;width:150px;border-radius:10px;transition:all .5s ease}.homepage a:hover{-webkit-transform:scale(1.03);transform:scale(1.03)}.homepage span{color:var(--text);font-size:.9em;text-shadow:0 1px 2px var(--secondary)}@media (min-width:768px) and (max-width:1302px){.homepage{width:80%}.homepage p{width:70%}}@media (min-width:0px) and (max-width:768px){.homepage{width:100%}.homepage p{width:80%}}.account-form{text-align:center;display:grid;grid-template-rows:auto auto auto;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;align-items:center;position:relative;padding:50px 0;background:var(--primary);width:50%;margin:auto;box-sizing:border-box;box-shadow:0 0 1px #000}.account-form h1{color:var(--text)}.account-form img{height:100px;width:100px;margin:auto}.account-form form{margin-top:15px}.form-field{display:-webkit-flex;display:flex;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;align-items:center;margin-bottom:20px}.form-field svg{color:var(--text);font-size:1.7em;margin-right:10px}.form-field input,select{height:35px;width:225px;background-color:var(--tertiary);padding-left:10px;border:0;border-bottom:2px solid var(--text);color:var(--text);font-size:1em;transition:all .5s ease}.form-field select{width:238px}.form-field input[type=date]{text-transform:uppercase}::-webkit-calendar-picker-indicator{-webkit-filter:invert(1);filter:invert(1)}.form-field input:focus{border-color:var(--secondary);color:var(--secondary)}.account-form .alert{color:red;font-size:.9em}.account-form button{background-color:var(--secondary);height:35px;width:120px;border:0;border-radius:10px;font-weight:700;color:var(--text);margin-top:10px;margin-bottom:20px;transition:all .5s ease}.account-form button:hover{-webkit-transform:scale(1.03);transform:scale(1.03)}.account-form a{color:var(--text);font-size:.9em;transition:all .5s ease}.account-form a:hover{text-shadow:0 1px 2px var(--text)}@media (min-width:768px) and (max-width:1302px){.account-form{width:70%}}@media (min-width:0px) and (max-width:768px){.account-form{width:100%}}*{font-family:"Segoe UI"}button,input,select{outline:none}ul{list-style-type:none}a{text-decoration:none}p{overflow-wrap:break-word;word-wrap:break-word;word-break:break-word;-ms-hyphens:auto;-webkit-hyphens:auto;hyphens:auto}.app-container{width:80%;margin:50px auto;box-shadow:0 3px 5px #000;padding:50px 0;box-sizing:border-box}.red-black{--primary:#1a1b1c;--secondary:#dc143c;--tertiary:#000;--text:#fff;--text2:#e5e4e2}.blue-pink{--primary:#ffe6ea;--secondary:#4169e1;--tertiary:#e75480}.blue-pink,.yellow-white{--text:#000;--text2:#1a1b1c}.yellow-white{--primary:linen;--secondary:gold;--tertiary:#aa6c39}body{margin:0;padding:0}.reload{background:transparent;color:var(--text);font-size:1.3em;border:0;width:30px;padding:0;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;align-items:center;transition:all .5s ease}.reload:hover{-webkit-transform:scale(1.1);transform:scale(1.1)}.reload-spin{-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite}.theme-changer{display:-webkit-flex;display:flex;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;align-items:center;margin:30px auto}.theme-changer p{color:#fff;font-weight:700;font-size:1.1em;margin:10px}.theme-changer select{float:right;background:#fff;color:#000}::-webkit-input-placeholder{color:var(--text);opacity:.7}::placeholder{color:var(--text);opacity:.7}:-ms-input-placeholder{color:var(--text);opacity:.7}::-ms-input-placeholder{color:var(--text);opacity:.7}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@media (min-width:768px) and (max-width:1302px){.app-container{width:90%}}@media (min-width:0px) and (max-width:768px){.app-container{width:100%;margin:0}}
/*# sourceMappingURL=main.7cfcdbfb.chunk.css.map */