:root{--background1: rgba(26, 148, 122, .4);--background2: rgba(26, 148, 122, .6);--background3: rgba(255, 255, 255, .15);--background4: rgba(255, 255, 255, .3);--color1: rgb(51, 74, 226)}*{box-sizing:border-box;overflow-x:hidden}html,body{margin:0;padding:0;font-family:Roboto;font-weight:900;background:radial-gradient(50% 50% at 50% 50%,#334ae240,#334ae20d);background-position:center;background-repeat:no-repeat;background-size:100% 100%;background-size:cover;background-attachment:fixed}h1{min-height:50px;font-family:Roboto;font-style:normal;font-weight:400;font-size:2em;color:#000;margin:0;display:flex;align-items:center;cursor:default}h2{min-height:50px;font-family:Roboto;font-style:normal;font-weight:900;font-size:1.3em;color:#000;margin:0;display:flex;align-items:center;text-align:center}h3{min-height:40px;font-style:normal;font-weight:800;opacity:.9;font-size:1.1em;color:#000;margin:0;display:flex;align-items:center}h4{min-height:30px;font-family:Roboto;font-style:normal;font-weight:900;font-size:1em;color:#000;margin:0;display:flex;align-items:center}p{height:20px;font-family:Roboto;font-style:normal;font-weight:400;font-size:1em;color:#000;margin:0}.p-light{height:20px;font-family:Roboto;font-style:normal;font-weight:300;font-size:1em;color:#000}@media (max-width: 700px){h1{font-size:1.75em}p,.p-light{height:20px;font-size:.9em}}button{display:flex;min-height:25px;padding:0 10px;border:1px solid #000000;border-radius:5px;background:none;font-family:Roboto;font-style:normal;font-weight:300;font-size:.9em;color:#000;align-items:center;justify-content:center;cursor:pointer;transition:.15s}button:hover{background:#ffffff40}button.button-lg{display:flex;gap:10px;min-height:30px;border:2px solid #000000;font-weight:500;font-size:1.2em;padding:0 2.5vw;min-width:200px}button.selected{background-color:#334ae233;cursor:default;font-weight:500}.title{display:flex;justify-content:start;align-items:center;margin-bottom:25px}.title>.back{display:grid;cursor:pointer;transition:.15s}.title>.back:hover{scale:1.1}.title>h1{margin-left:100px;color:var(--color1)}.title>a{display:flex;align-content:center;margin-top:5px}.body{margin:0 2.5vw}.body>h3{padding-left:25px}.page-layout{display:flex;flex-direction:column;margin:60px auto 0;min-height:calc(100vh - 60px);width:90vw;max-width:1200px;justify-self:center;padding-top:10vh}.page-layout>.head>.top{display:flex;justify-content:space-between;align-items:center;padding:0 25px}.page-layout>.head>.break{width:100%;height:2px;background-color:var(--color1);box-shadow:0 1px 2px #00000040;border-radius:5px 0 0 5px;margin-bottom:50px}.page-layout>.head>.top .settings{display:grid;scale:1.75;cursor:pointer;transition:.15s;padding:0 10px}.page-layout>.head>.top .settings:hover{scale:2}@media (max-width: 700px){.page-layout{width:95vw}.title>h1{margin-left:50px}}.break{width:100%;height:2px;background-color:var(--color1);box-shadow:0 1px 2px #00000040;border-radius:5px 0 0 5px}header{position:fixed;top:0;height:60px;width:100vw;display:flex;justify-self:center;justify-content:space-between;align-items:center;padding:0 25px;background:var(--color1);box-shadow:0 2px 4px #00000040;z-index:4}header>h4{display:flex;color:#fff;align-items:center;cursor:default}header>.hamburger-icon-wrapper{overflow:hidden}header .hamburger-icon{display:flex;height:15px;cursor:pointer;transition:.15s;align-self:center}header .hamburger-icon:hover{scale:1.05}header a{display:flex;align-items:center}header a .headshot{margin-right:10px;width:30px;height:30px;border-radius:100%;background-color:#000}.side-menu{position:fixed;width:275px;height:100vh;top:0;right:0;background-color:var(--color1);border-left:solid white 2px;box-shadow:inset 1px 0 2px #00000040;z-index:6;padding:0 15px}.blur{position:fixed;width:100vw;height:100vh;top:0;left:0;background:#00000080;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:5}.side-menu>.head{height:50px;width:75px;display:flex;align-items:center;cursor:pointer;transition:.15s}.side-menu>.head:hover{scale:1.05}.side-menu>.head h4{height:50px;color:#fff;display:flex;align-items:center;padding-left:5px}.side-menu>nav{margin-top:75px;width:105%;position:relative;left:2.5px}.side-menu>nav>a{display:flex;height:45px;align-items:center;text-decoration:none;padding-left:10px;transition:.15s}.side-menu>nav>a:hover{background-color:#0000001a}.side-menu>nav>a>h3{color:#fff;padding-left:15px}.side-menu>nav>a>svg{width:25px}.side-menu>nav>.break{height:2px;background:#fff;box-shadow:0 1px 2px #00000040;border-radius:5px 0 0 5px}.side-menu>.bottom{display:flex;justify-content:space-between;align-items:center;position:absolute;bottom:0;width:245px;padding:0 2.5px;overflow:hidden}.side-menu>.bottom>.container{display:flex;height:50px;align-items:center;cursor:pointer;transition:.15s;text-decoration:none}.side-menu>.bottom>.container:hover{scale:1.05}.side-menu>.bottom>.container h4{color:#fff;display:flex;align-items:center;padding-right:5px}.popout-window{z-index:3;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:95vw;max-width:1200px;background-color:#fff;border-radius:10px;box-shadow:0 0 10px #00000040;padding:0 3.5vw;padding-top:25px;border:solid 1px white}.popout-window>.body{margin:0 0 10px;padding:25px 10px;max-height:70vh}.popout-window>.body::-webkit-scrollbar{width:10px}.popout-window>.body::-webkit-scrollbar-track{background:#0000000d}.popout-window>.body::-webkit-scrollbar-thumb{background-color:var(--color1);border-radius:5px;border:white 2.5px solid}.popout-blur{position:fixed;width:100vw;height:100vh;left:0;top:0;background:#00000080;z-index:2}.popout-window>.title{display:flex;justify-content:space-between;min-height:50px;align-items:center}.popout-window>.title>h1{color:var(--color1);margin:0}.popout-window>.title>div>.exit-icon{height:25px;width:25px;cursor:pointer;transition:.15s;margin:2.5px 15px 2.5px 10px}.popout-window>.title>div>.exit-icon:hover{scale:1.1}.create-appointment form>button{justify-self:center}.create-appointment>.body .data-table>.data-row .left p{min-width:50px}.create-appointment>.body .data-table>.data-row .left input{display:flex}button.selected{background-color:var(--color1);cursor:default;border:solid 1px var(--color1);color:#fff;font-weight:300}.apt-times-wrapper>.data-row>.left{gap:0 10px}.apt-times{margin:5px 0}.create-appointment>.body>.popout-window .options{display:flex;justify-self:center;width:100%;justify-content:space-around}.data-table{padding:2.5px 0;margin-bottom:50px}.title-data-table{display:flex;justify-content:space-between;align-items:center;margin:0 25px}.title-data-table>h3{min-height:25px;margin:0}.data-table>.break{width:100%;height:2px;background:var(--color1);box-shadow:0 1px 1px #00000040;border-radius:0;margin:2px 0;opacity:.95;transform:translateZ(0);will-change:transform}.data-table .data-row{display:flex;justify-content:space-between;align-items:center;align-self:center;padding:0 5vw;min-height:35px;overflow-y:hidden;background-color:#334ae213}.data-table .data-row:last-child:after{content:"";position:absolute;bottom:-4px;left:0;right:0;height:2px;background:var(--color1)}.data-table>div:nth-child(4n){background-color:#fff3}.data-table .data-row>div{display:flex;column-gap:10px;align-items:center;flex-wrap:wrap}input{display:flex;height:35px;min-width:200px;width:35vw;max-width:400px;background:none;border:none;text-indent:10px;transition:.15s;font-family:Roboto;font-style:normal;font-weight:300;font-size:.9em}@media (max-width: 700px){input{text-indent:5px;font-size:.85em}}input:hover{background-color:#0000000d}input:focus{outline:none;background-color:#ffffff40}.dropdown>.dropdown-toggle{display:flex;gap:0 15px;border:none;border-radius:0}.dropdown>.dropdown-toggle:hover{background:none}.dropdown>.dropdown-toggle>.arrow-icon{scale:.8;transition:.35s}.dropdown>.dropdown-menu{position:absolute;border:solid 3px var(--color1);background-color:#fff;margin-top:7px;z-index:2;border-radius:0 0 10px 10px;max-height:300px;overflow-y:auto;box-shadow:0 2.5px 5px #00000080}.dropdown>.dropdown-menu::-webkit-scrollbar{width:2px}.dropdown>.dropdown-menu::-webkit-scrollbar-track{background:none;margin-bottom:10px}.dropdown>.dropdown-menu::-webkit-scrollbar-thumb{background-color:#000}.dropdown>.dropdown-menu>.dropdown-item{height:35px;font-family:Roboto;font-style:normal;font-weight:300;font-size:.9em;color:#000;cursor:pointer;display:flex;align-items:center;justify-content:center;margin:2px;padding:0 10px;min-width:50px}.dropdown>.dropdown-menu>.dropdown-item:hover{background-color:var(--color1);color:#fff}.dropdown>.dropdown-menu>.break{background-color:#000;height:1px;width:calc(100% - 2px);justify-self:center;box-shadow:none}.date-selector{display:flex;gap:0 15px}.appointment-requests .popout-window .title-data-table>.title-right{display:flex;gap:10px}.appointment-requests .popout-window .title-data-table>.title-right>button{padding:0 15px}.appointment-requests .popout-window .title-data-table>.title-right>button.accept:hover{background-color:#0092201a}.appointment-requests .popout-window .title-data-table>.title-right>button.decline:hover{background-color:#9600001a}.appointment-requests .popout-window .data-table>.data-row>.left{column-gap:25px}.appointment-requests .popout-window .data-table>.data-row>.left>p{min-width:75px}.dashboard>.body{display:flex;flex-wrap:wrap;justify-content:space-between;justify-self:center;align-self:center;width:100%;padding:0 5vw}.dashboard>.body>a,.dashboard>.body>.signout-btn,.dashboard>.body>.upcoming-appts{display:flex;border:solid var(--color1) 2px;border-radius:10px;text-decoration:none;transition:.15s;width:48.75%;height:75px;justify-content:center;align-items:center;margin:5px 0 15px;cursor:pointer;text-align:center}.dashboard>.body>a:hover,.dashboard>.body>.upcoming-appts:hover{background-color:#334ae21a;box-shadow:0 1px 2px #00000040}.dashboard>.body>.signout-btn:hover{background-color:#96000013;box-shadow:0 1px 2px #00000040}.update-hours{min-height:calc(100vh - 60px);width:90vw;max-width:1200px;justify-self:center;padding-top:10vh}.update-hours>.head>.container{display:flex;justify-content:center;align-items:center;gap:7.5vw}.update-hours>.head>.container>h2{width:200px;justify-content:center}.update-hours>.head>.container>div>.arrow-icon{cursor:pointer;transition:.15s}.update-hours>.head>.container>div>.arrow-icon:hover{scale:1.1}.update-hours>.head>.break{width:100%;height:2px;background-color:var(--color1);box-shadow:0 1px 2px #00000040;border-radius:5px 0 0 5px}.update-hours>.body>.main{margin:50px}.update-hours>.body>.main>.title-data-table>.title-right{margin-right:25px}.update-hours>.save-changes{position:fixed;bottom:0;left:0;width:100vw;height:100px;background-color:var(--color1);padding:0 20vw;padding-top:15px;box-shadow:0 -2px 4px #00000040;text-align:center;display:flex;flex-direction:column;justify-content:space-around}.update-hours>.save-changes>.container{display:flex;align-items:center;justify-content:space-around}.update-hours>.save-changes>.container>button{color:#fff;border:solid 1px white}.update-hours>.save-changes>.container>button:hover{background-color:#0000001a}.update-hours>.save-changes>.container>button.cancel:hover{background-color:#ff17171a}.update-hours>.save-changes>p{color:#ffffffe6;font-size:.9em}.appointments>.head>.container{display:flex;justify-content:center;align-items:center;gap:7.5vw}.appointments>.head>.container>h2{width:200px;justify-content:center}.appointments>.head>.container>div>.arrow-icon{cursor:pointer;transition:.15s}.appointments>.head>.container>div>.arrow-icon:hover{scale:1.1}.appointments>.head>.break{width:100%;height:2px;background-color:var(--color1);box-shadow:0 1px 2px #00000040;border-radius:5px 0 0 5px}.appointments>.body .create-icon{height:10px;width:10px;margin-right:5px}.appointments>.body .data-table>.data-row .left{gap:10px;min-width:400px}.appointments>.body .data-table>.data-row .left>p{min-width:175px}.calendar>.head>.container{display:flex;justify-content:center;align-items:center;gap:7.5vw}.calendar>.head>.container>h2{width:200px;justify-content:center}.calendar>.head>.container>div>.arrow-icon{cursor:pointer;transition:.15s}.calendar>.head>.container>div>.arrow-icon:hover{scale:1.1}.calendar>.head>.break{width:100%;height:2px;background-color:var(--color1);box-shadow:0 1px 2px #00000040;border-radius:5px 0 0 5px}.calendar>.body>.title-data-table>.title-right>.filter-options{display:flex;gap:10px}.calendar>.body>.title-data-table>.title-right>.filter-options>.selected{background-color:var(--color1);border:var(--color1) solid 1px;color:#fff}.calendar>.body>.data-table>.data-row>.left>div{display:flex}.calendar>.body>.data-table>.data-row>.left>.appointment-list>p{min-width:175px}.calendar>.body>.data-table>.data-row>.left>.availability-list>p{min-width:50px}.calendar>.body>.data-table>.data-row>.left>.availability-list>p.p-light{min-width:100px}.settings>.body>.options{display:flex;gap:10px;justify-self:center;justify-content:center;flex-wrap:wrap}.settings .data-table .data-row>.left>p{min-width:55px}.update-profile .data-table>.data-row>.left .personal-info-p{min-width:75px}.update-profile .data-table>.data-row>.left .change-password-p{min-width:175px}.update-profile form>.options{display:flex;justify-content:space-around;flex-wrap:wrap;row-gap:10px}.update-profile form>.options>button.cancel:hover{background-color:#96000013}.update-profile form>.options>button.save:hover{background-color:#00922013}.home>.body{display:flex;justify-content:space-around;flex-wrap:wrap;margin:0 5vw}.home>.body>.option{display:flex;border:solid var(--color1) 2px;border-radius:10px;text-decoration:none;transition:.15s;width:400px;height:100px;justify-content:center;align-items:center;margin:5px 0;cursor:pointer}.home>.body>.option:hover{background-color:#334ae21a;box-shadow:0 1px 2px #00000040}.home .popout-window{min-height:0px}.home .popout-window>.body{display:flex;justify-content:space-around;flex-wrap:wrap;gap:10px}.home .popout-window>.body>.button-lg{width:30%}.client-appointments>.body .data-table>.data-row>.left>p{min-width:200px}.client-appointments>.body .data-table>.data-row>.right>.status{min-width:50px}.login>.body .data-table>.data-row>.left>p,.sign-up>.body .data-table>.data-row>.left>p{min-width:80px}.login>.body>form>button.button-lg,.sign-up>.body>form>button.button-lg{justify-self:center;padding:0 10%}
