.app{background-color:var(--darkest-blue);display:grid;grid-template-rows:4rem 1fr 4rem;min-height:100vh}p{font-size:16px;margin:16px;text-align:center}h1{color:var(--turquoise);font-weight:500;margin:0;padding:0}p.small{color:var(--dark-grey);font-size:12px}button{background-color:var(--turquoise);border:none;border-radius:8px;cursor:pointer;font-size:12px;font-weight:600;padding:12px}video{height:100%;object-fit:cover;width:100%}.api-error,video{border-radius:4px}.api-error{align-self:center;background:var(--dark-blue-border);box-sizing:border-box;display:inline-flex;flex-direction:column;height:270px;justify-self:center;padding:3rem;text-align:center;width:480px}.api-error p{color:var(--white)}.api-error h1{color:var(--red-dark)}.api-error a,.api-error a:visited{color:var(--white)}.home-screen{align-items:center;display:flex;flex-direction:column;justify-content:center;margin:auto;max-width:600px;padding:0 1rem;text-align:center}.home-screen h1{color:var(--white);font-weight:700}.home-screen p{color:var(--grey)}.call{grid-column-gap:30px;grid-row-gap:30px;align-items:center;display:grid;grid-auto-rows:1fr;grid-template-columns:repeat(auto-fit,minmax(480px,1fr));justify-items:center;padding:5rem;position:relative;width:100%}@media only screen and (max-width:600px){.call{grid-auto-rows:auto;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));padding:0}}.is-screenshare{grid-row-gap:15px;display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));padding:5rem}.is-screenshare .self-view,.is-screenshare .tile-video{height:135px;width:240px}.info-box{background:var(--dark-blue-border);border-radius:4px;box-sizing:border-box;color:var(--white);display:flex;flex-direction:column;height:270px;justify-content:center;padding:3rem;text-align:center;width:480px}@media only screen and (max-width:600px){.info-box{height:auto;padding:2rem 1rem;width:240px}}.room-url{font-size:12px;font-weight:400;padding:0 1rem;word-break:break-word}.tile-video{height:270px;position:relative;width:480px}@media only screen and (max-width:600px){.tile-video{height:135px;width:240px}}.self-view{height:270px;position:relative;width:480px}@media only screen and (max-width:600px){.self-view{height:135px;width:240px}}.no-video{background-color:var(--dark-blue-border)}.no-video video{visibility:hidden}.self-view.alone{height:270px;width:480px}@media only screen and (max-width:600px){.self-view.alone{height:135px;width:240px}}.tile-screenshare{grid-column:1/-1;grid-row:1}.username{background-color:var(--dark-blue);bottom:0;color:var(--grey);font-size:14px;left:0;padding:.2em .5em;position:absolute;z-index:2}.get-user-media-error{align-items:center;grid-column:1/3}.get-user-media-error h1{color:var(--red-dark)}.get-user-media-error button{background:#000;color:var(--white);margin:1rem 0}.get-user-media-error a,.get-user-media-error a:visited{color:#fff;text-decoration:underline}.get-user-media-error p{margin:0}header{align-items:center;background-color:var(--black);border-bottom:1px solid var(--black);display:flex;justify-content:space-between;padding:.5rem 1rem}header span{font-size:12px;font-weight:600}span.title{padding:0 16px}header a{align-items:center;color:var(--dark-blue);display:flex;padding:8px 16px;text-decoration:none}header a.new-tab-link{border:1px solid var(--dark-grey);border-radius:8px}a:focus,a:visited{color:var(--dark-blue)}a:active,a:hover{color:var(--turquoise)}.header-section{align-items:center;display:flex}.meeting-information{background-color:var(--white);border:1px solid var(--grey);border-radius:8px;font-size:12px;left:.5rem;max-width:400px;padding:12px;position:absolute;top:4.5rem;z-index:2}.meeting-information h1{color:var(--dark-blue)}.chat{background:var(--white);border-left:1px solid var(--grey);bottom:4rem;display:flex;flex-direction:column;justify-content:flex-end;overflow-y:auto;position:absolute;right:0;top:4rem;width:300px}@media only screen and (max-width:600px){.chat{width:100%;z-index:3}}.add-message{border-bottom:1px solid var(--grey);border-top:1px solid var(--grey);padding:1rem}.chat-messages{height:100%;margin:0;overflow-y:auto;padding:1rem}.chat-message{list-style-type:none;margin-bottom:1rem}.chat-message-author{font-size:14px;font-weight:700}.chat-message-body{color:var(--dark-grey);display:inline;font-size:14px;margin:0;text-align:left}.chat-form{border-bottom:2px solid var(--grey);display:flex;justify-content:space-between}.chat-input{border:0;flex-grow:1;padding:.5rem}.chat-input,.chat-submit-button{background:transparent}.close-chat{align-self:end;background:var(--turquoise);border:1px solid var(--grey);font-weight:400;margin:1rem;padding:.5rem 1rem}.close-chat:hover{background:var(--grey);border:1px solid var(--dark-blue-border)}.tray{background:var(--white);color:var(--darkest-blue);display:flex;flex-direction:column;justify-content:center;width:100%}.tray-buttons-container{display:flex;padding:10px}.tray-buttons-container button{align-items:center;background-color:#fff;display:flex;flex-direction:column;font-weight:400;padding:0}.tray-buttons-container button svg{color:#121a24}.tray-buttons-container button+button{margin-left:2rem}.actions,.controls,.leave{align-items:center;display:flex;flex:1 1}.controls{justify-content:flex-start}.actions{justify-content:center}.leave{justify-content:flex-end}.hair-check{background:#fff;border:1px solid grey;border-radius:4px;display:flex;flex-direction:column;justify-content:center;margin:auto;max-width:600px;padding:1rem}.hair-check video{max-width:480px}.hair-check label{color:var(--dark-grey);display:block;font-size:12px;line-height:14px;margin:1em 0 .5em}.hair-check input,.hair-check select{border:1px solid var(--grey);border-radius:4px;color:var(--dark-blue);padding:.5em;width:100%}.hair-check h1{color:var(--dark-blue);font-size:1em;margin-bottom:1em;text-align:center}.hair-check button{margin-top:2em}.hair-check button+button{margin-top:0}.cancel-call{background:var(--white)}:root{--grey-lightest:#f7f9fa;--white:#fff;--grey:#c8d1dc;--dark-grey:#6b7785;--dark-blue:#1f2d3d;--dark-blue-border:#2b3f56;--darkest-blue:#121a24;--green:#72cc18;--red-dark:#f63135;--turquoise:#1bebb9}*{box-sizing:border-box}body,html{height:100%;position:relative;width:100%}body{color:#333;margin:0;padding:0}body,button{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif}
/*# sourceMappingURL=main.9951e119.css.map*/