From fb366d3e0b9facd6cab1cb3d73eac99015bd2b33 Mon Sep 17 00:00:00 2001 From: Developer 02 Date: Wed, 25 Sep 2024 09:21:55 +0200 Subject: [PATCH] refactor: Umschlag nav-menu bearbeiten. minfied card.css --- .../Views/Home/ShowEnvelope.cshtml | 84 +++--- .../Views/Shared/_Layout.cshtml | 6 +- EnvelopeGenerator.Web/bundleconfig.json | 6 + EnvelopeGenerator.Web/wwwroot/css/card.css | 274 ++++++++++++++++++ .../wwwroot/css/card.min.css | 1 + EnvelopeGenerator.Web/wwwroot/css/logo.css | 5 + .../wwwroot/css/logo.min.css | 2 +- EnvelopeGenerator.Web/wwwroot/css/site.css | 56 +++- .../wwwroot/css/site.min.css | 2 +- 9 files changed, 374 insertions(+), 62 deletions(-) create mode 100644 EnvelopeGenerator.Web/wwwroot/css/card.css create mode 100644 EnvelopeGenerator.Web/wwwroot/css/card.min.css diff --git a/EnvelopeGenerator.Web/Views/Home/ShowEnvelope.cshtml b/EnvelopeGenerator.Web/Views/Home/ShowEnvelope.cshtml index b469feb8..30bec195 100644 --- a/EnvelopeGenerator.Web/Views/Home/ShowEnvelope.cshtml +++ b/EnvelopeGenerator.Web/Views/Home/ShowEnvelope.cshtml @@ -18,53 +18,11 @@ var document = Model.Envelope?.Documents?.FirstOrDefault(); var sender = Model.Envelope?.User; var pages = document?.Elements?.Select(e => e.Page) ?? Array.Empty(); + int? signatureCount = document?.Elements?.Count(); var stPageIndexes = string.Join(pages.Count() > 1 ? ", " : "", pages.Take(pages.Count() - 1)) + (pages.Count() > 1 ? $" {_localizer[WebKey.and].TrySanitize(_sanitizer)} " : "") + pages.LastOrDefault(); } -
- -
-
-
-
-
-
- @($"{_localizer[WebKey.SigningProcessTitle]}: ".TrySanitize(_sanitizer)) - @($"{envelope?.Title}".TrySanitize(_sanitizer)) -
-

@Html.Raw(string.Format(_localizer[WebKey.EnvelopeInfo1], pages.Count(), stPageIndexes).TrySanitize(_hlSanitizer))

-

- - @Html.Raw(string.Format(_localizer[WebKey.EnvelopeInfo2], /* sanitize separately but don't sanitize the URI */ - envelope?.AddedWhen.ToString(userCulture?.Info?.DateTimeFormat).TrySanitize(_sanitizer), - $"{sender?.Prename} {sender?.Name}".TrySanitize(_sanitizer), - sender?.Email.TrySanitize(_sanitizer), - envelope?.Title.TrySanitize(_sanitizer), - sender?.Prename.TrySanitize(_sanitizer), - sender?.Name.TrySanitize(_sanitizer), - sender?.Email.TrySanitize(_sanitizer))) - -

-
-
-
-
-
+
-
+ +
+
+
+
Digital Data
+

signFlow

+ Erfahren Sie mehr +
+
+ +

@($"{envelope?.Title}".TrySanitize(_sanitizer))

+
@($"{@envelope?.Message}".TrySanitize(_sanitizer))
+

+ + @Html.Raw(string.Format(_localizer[WebKey.EnvelopeInfo2], /* sanitize separately but don't sanitize the URI */ + envelope?.AddedWhen.ToString(userCulture?.Info?.DateTimeFormat).TrySanitize(_sanitizer), + $"{sender?.Prename} {sender?.Name}".TrySanitize(_sanitizer), + sender?.Email.TrySanitize(_sanitizer), + envelope?.Title.TrySanitize(_sanitizer), + sender?.Prename.TrySanitize(_sanitizer), + sender?.Name.TrySanitize(_sanitizer), + sender?.Email.TrySanitize(_sanitizer))) + +

+
+
+ + 0/@signatureCount Unterschriften + +
+
+
+
+ +
@Html.AntiForgeryToken() - + \ No newline at end of file diff --git a/EnvelopeGenerator.Web/bundleconfig.json b/EnvelopeGenerator.Web/bundleconfig.json index 3584b22f..d382de45 100644 --- a/EnvelopeGenerator.Web/bundleconfig.json +++ b/EnvelopeGenerator.Web/bundleconfig.json @@ -76,5 +76,11 @@ "inputFiles": [ "wwwroot/css/privacy-policy.css" ] + }, + { + "outputFileName": "wwwroot/css/card.min.css", + "inputFiles": [ + "wwwroot/css/card.css" + ] } ] diff --git a/EnvelopeGenerator.Web/wwwroot/css/card.css b/EnvelopeGenerator.Web/wwwroot/css/card.css new file mode 100644 index 00000000..7ef17e70 --- /dev/null +++ b/EnvelopeGenerator.Web/wwwroot/css/card.css @@ -0,0 +1,274 @@ +@import url('https://fonts.googleapis.com/css?family=Muli&display=swap'); + +* { + box-sizing: border-box; +} + +.dd-cards-container { + font-family: 'Muli', sans-serif; + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; + height: 10rem; +} + +.dd-card { + background-color: #fff; + box-shadow: 0 0.625rem 0.625rem rgba(0, 0, 0, 0.2); + display: flex; + max-width: 100%; + margin: 0; + overflow: hidden; + width: 100%; +} + +.dd-card h6 { + opacity: 0.6; + margin: 0; + letter-spacing: 0.0625rem; +} + +.uppercase { + text-transform: uppercase; +} + +.dd-card h2 { + letter-spacing: 0.0625rem; + margin: 0; +} + +.dd-card-preview { + background-color: #2A265F; + color: #fff; + padding: 1.875rem; + max-width: 15.625rem; +} + +.dd-card-preview a { + color: #fff; + display: inline-block; + font-size: 0.75rem; + opacity: 0.6; + margin-top: 1.875rem; + text-decoration: none; +} + +.dd-card-info { + padding: 1rem 0 0 1.875rem; + position: relative; + width: 100%; +} + + .dd-card-info p { + opacity: 0.6; + font-size: 0.75rem; + opacity: 0.6; + margin-top: .875rem; + text-decoration: none; + } + +.progress-container { + text-align: right; + width: 9.375rem; +} + +.progress { + position: relative; + background-color: #ddd; + border-radius: 0.1875rem; + height: 0.3125rem; + width: 10rem; +} + + .progress::after { + background-color: #2A265F; + content: ''; + position: absolute; + top: 0; + left: 0; + height: 0.3125rem; + width:1%; + } + +.progress-text { + font-size: 0.625rem; + opacity: 0.6; + letter-spacing: 0.0625rem; + text-align: left; +} + +.dd-card-btn { + background-color: #2A265F; + border: 0; + border-radius: 3.125rem; + box-shadow: 0 0.625rem 0.625rem rgba(0, 0, 0, 0.2); + color: #fff; + font-size: 1rem; + padding: 0.75rem 1.5625rem; + position: absolute; + bottom: 1.875rem; + right: 1.875rem; + letter-spacing: 0.0625rem; +} + +/* SOCIAL PANEL CSS */ +.social-panel-container { + position: fixed; + right: 0; + bottom: 5rem; + transform: translateX(100%); + transition: transform 0.4s ease-in-out; +} + + .social-panel-container.visible { + transform: translateX(-0.625rem); + } + +.social-panel { + background-color: #fff; + border-radius: 16px; + box-shadow: 0 16px 31px -17px rgba(0,31,97,0.6); + border: 5px solid #001F61; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + font-family: 'Muli'; + position: relative; + height: 169px; + width: 370px; + max-width: calc(100% - 10px); +} + +.social-panel button.close-btn { + border: 0; + color: #97A5CE; + cursor: pointer; + font-size: 20px; + position: absolute; + top: 5px; + right: 5px; +} + +.social-panel button.close-btn:focus { + outline: none; +} + +.social-panel p { + background-color: #001F61; + border-radius: 0 0 10px 10px; + color: #fff; + font-size: 14px; + line-height: 18px; + padding: 2px 17px 6px; + position: absolute; + top: 0; + left: 50%; + margin: 0; + transform: translateX(-50%); + text-align: center; + width: 235px; +} + +.social-panel p i { + margin: 0 5px; +} + +.social-panel p a { + color: #FF7500; + text-decoration: none; +} + +.social-panel h4 { + margin: 20px 0; + color: #97A5CE; + font-family: 'Muli'; + font-size: 14px; + line-height: 18px; + text-transform: uppercase; +} + +.social-panel ul { + display: flex; + list-style-type: none; + padding: 0; + margin: 0; +} + +.social-panel ul li { + margin: 0 10px; +} + +.social-panel ul li a { + border: 1px solid #DCE1F2; + border-radius: 50%; + color: #001F61; + font-size: 20px; + display: flex; + justify-content: center; + align-items: center; + height: 50px; + width: 50px; + text-decoration: none; +} + +.social-panel ul li a:hover { + border-color: #FF6A00; + box-shadow: 0 9px 12px -9px #FF6A00; +} + +.floating-btn { + border-radius: 26.5px; + background-color: #001F61; + border: 1px solid #001F61; + box-shadow: 0 16px 22px -17px #03153B; + color: #fff; + cursor: pointer; + font-size: 16px; + line-height: 20px; + padding: 12px 20px; + position: fixed; + bottom: 20px; + right: 20px; + z-index: 999; +} + +.floating-btn:hover { + background-color: #ffffff; + color: #001F61; +} + +.floating-btn:focus { + outline: none; +} + +.floating-text { + background-color: #001F61; + border-radius: 10px 10px 0 0; + color: #fff; + font-family: 'Muli'; + padding: 7px 15px; + position: fixed; + bottom: 0; + left: 50%; + transform: translateX(-50%); + text-align: center; + z-index: 998; +} + +.floating-text a { + color: #FF7500; + text-decoration: none; +} + +@media screen and (max-width: 480px) { + + .social-panel-container.visible { + transform: translateX(0px); + } + + .floating-btn { + right: 10px; + } +} \ No newline at end of file diff --git a/EnvelopeGenerator.Web/wwwroot/css/card.min.css b/EnvelopeGenerator.Web/wwwroot/css/card.min.css new file mode 100644 index 00000000..02966274 --- /dev/null +++ b/EnvelopeGenerator.Web/wwwroot/css/card.min.css @@ -0,0 +1 @@ +@import url('https://fonts.googleapis.com/css?family=Muli&display=swap');*{box-sizing:border-box}.dd-cards-container{font-family:'Muli',sans-serif;display:flex;align-items:center;justify-content:center;flex-direction:column;height:10rem}.dd-card{background-color:#fff;box-shadow:0 .625rem .625rem rgba(0,0,0,.2);display:flex;max-width:100%;margin:0;overflow:hidden;width:100%}.dd-card h6{opacity:.6;margin:0;letter-spacing:.0625rem}.uppercase{text-transform:uppercase}.dd-card h2{letter-spacing:.0625rem;margin:0}.dd-card-preview{background-color:#2a265f;color:#fff;padding:1.875rem;max-width:15.625rem}.dd-card-preview a{color:#fff;display:inline-block;font-size:.75rem;opacity:.6;margin-top:1.875rem;text-decoration:none}.dd-card-info{padding:1rem 0 0 1.875rem;position:relative;width:100%}.dd-card-info p{opacity:.6;font-size:.75rem;opacity:.6;margin-top:.875rem;text-decoration:none}.progress-container{text-align:right;width:9.375rem}.progress{position:relative;background-color:#ddd;border-radius:.1875rem;height:.3125rem;width:10rem}.progress::after{background-color:#2a265f;content:'';position:absolute;top:0;left:0;height:.3125rem;width:1%}.progress-text{font-size:.625rem;opacity:.6;letter-spacing:.0625rem;text-align:left}.dd-card-btn{background-color:#2a265f;border:0;border-radius:3.125rem;box-shadow:0 .625rem .625rem rgba(0,0,0,.2);color:#fff;font-size:1rem;padding:.75rem 1.5625rem;position:absolute;bottom:1.875rem;right:1.875rem;letter-spacing:.0625rem}.social-panel-container{position:fixed;right:0;bottom:5rem;transform:translateX(100%);transition:transform .4s ease-in-out}.social-panel-container.visible{transform:translateX(-.625rem)}.social-panel{background-color:#fff;border-radius:16px;box-shadow:0 16px 31px -17px rgba(0,31,97,.6);border:5px solid #001f61;display:flex;flex-direction:column;justify-content:center;align-items:center;font-family:'Muli';position:relative;height:169px;width:370px;max-width:calc(100% - 10px)}.social-panel button.close-btn{border:0;color:#97a5ce;cursor:pointer;font-size:20px;position:absolute;top:5px;right:5px}.social-panel button.close-btn:focus{outline:0}.social-panel p{background-color:#001f61;border-radius:0 0 10px 10px;color:#fff;font-size:14px;line-height:18px;padding:2px 17px 6px;position:absolute;top:0;left:50%;margin:0;transform:translateX(-50%);text-align:center;width:235px}.social-panel p i{margin:0 5px}.social-panel p a{color:#ff7500;text-decoration:none}.social-panel h4{margin:20px 0;color:#97a5ce;font-family:'Muli';font-size:14px;line-height:18px;text-transform:uppercase}.social-panel ul{display:flex;list-style-type:none;padding:0;margin:0}.social-panel ul li{margin:0 10px}.social-panel ul li a{border:1px solid #dce1f2;border-radius:50%;color:#001f61;font-size:20px;display:flex;justify-content:center;align-items:center;height:50px;width:50px;text-decoration:none}.social-panel ul li a:hover{border-color:#ff6a00;box-shadow:0 9px 12px -9px #ff6a00}.floating-btn{border-radius:26.5px;background-color:#001f61;border:1px solid #001f61;box-shadow:0 16px 22px -17px #03153b;color:#fff;cursor:pointer;font-size:16px;line-height:20px;padding:12px 20px;position:fixed;bottom:20px;right:20px;z-index:999}.floating-btn:hover{background-color:#fff;color:#001f61}.floating-btn:focus{outline:0}.floating-text{background-color:#001f61;border-radius:10px 10px 0 0;color:#fff;font-family:'Muli';padding:7px 15px;position:fixed;bottom:0;left:50%;transform:translateX(-50%);text-align:center;z-index:998}.floating-text a{color:#ff7500;text-decoration:none}@media screen and (max-width:480px){.social-panel-container.visible{transform:translateX(0)}.floating-btn{right:10px}} \ No newline at end of file diff --git a/EnvelopeGenerator.Web/wwwroot/css/logo.css b/EnvelopeGenerator.Web/wwwroot/css/logo.css index 9527cdaa..5cd9526e 100644 --- a/EnvelopeGenerator.Web/wwwroot/css/logo.css +++ b/EnvelopeGenerator.Web/wwwroot/css/logo.css @@ -5,6 +5,11 @@ .dd-show-logo { width: 9rem; + position: absolute; + right: 0; + margin: 0 2rem 0 0; + padding: 0; + top:0; } .cursor-locked-logo { diff --git a/EnvelopeGenerator.Web/wwwroot/css/logo.min.css b/EnvelopeGenerator.Web/wwwroot/css/logo.min.css index bc86abec..3b0dcc86 100644 --- a/EnvelopeGenerator.Web/wwwroot/css/logo.min.css +++ b/EnvelopeGenerator.Web/wwwroot/css/logo.min.css @@ -1 +1 @@ -.dd-locked-logo{width:13rem;padding-top:1rem}.dd-show-logo{width:9rem}.cursor-locked-logo{width:9rem;padding-top:1rem}.cursor-show-logo{width:6rem}@media(max-width:767px){.dd-show-logo{width:5rem}.cursor-show-logo{width:3rem}} \ No newline at end of file +.dd-locked-logo{width:13rem;padding-top:1rem}.dd-show-logo{width:9rem;position:absolute;right:0;margin:0 2rem 0 0;padding:0;top:0}.cursor-locked-logo{width:9rem;padding-top:1rem}.cursor-show-logo{width:6rem}@media(max-width:767px){.dd-show-logo{width:5rem}.cursor-show-logo{width:3rem}} \ No newline at end of file diff --git a/EnvelopeGenerator.Web/wwwroot/css/site.css b/EnvelopeGenerator.Web/wwwroot/css/site.css index d9dbe1a3..3f056363 100644 --- a/EnvelopeGenerator.Web/wwwroot/css/site.css +++ b/EnvelopeGenerator.Web/wwwroot/css/site.css @@ -4,11 +4,6 @@ */ /* Toolbar Buttons */ -#app { - background: gray; - width: 100vw; - height: 80vh; -} .navbar-toggler { border: 0; @@ -19,7 +14,6 @@ margin-bottom: 10vh; } - .btn_refresh, .btn_reject, .btn_complete { height:2.5rem; } @@ -69,8 +63,7 @@ } body { - background-color: #bbb; - + background: #f8fcfc; display: flex; flex-direction: column; height: 100vh; @@ -78,16 +71,51 @@ body { } main { - flex: 1; + display:flex; + margin: 0 0 0.5vh 0; } -footer { - background: #333; - color: white; - text-align: center; - padding: 10px 0; +.envelope-view { + display: flex; /* d-flex */ + flex-direction: column; /* flex-column */ + width: 100vw; + height: 95.9vh; +} + +#app { + background: gray; + width: 100vw; + height: 100%; + flex-grow: 1; + border-width: 0; } +footer { + height: 4vh; + background-color: #001F61; + border-radius: 10px 10px 0 0; + color: #fff; + font-family: 'Muli'; + padding: 0.5vh 0; + position: fixed; + bottom: 0; + width: 100%; + z-index: 998; + border-width: 0; +} + + footer * { + margin-left: 1rem; + } + + footer > * { + margin: 0 6rem 0 1rem; + } + + footer a { + color: #FF7500; + text-decoration: none; + } .page { margin-top: 3rem; diff --git a/EnvelopeGenerator.Web/wwwroot/css/site.min.css b/EnvelopeGenerator.Web/wwwroot/css/site.min.css index 241a4f3d..b9702f5e 100644 --- a/EnvelopeGenerator.Web/wwwroot/css/site.min.css +++ b/EnvelopeGenerator.Web/wwwroot/css/site.min.css @@ -1 +1 @@ -#app{background:#808080;width:100vw;height:50vh}.navbar-toggler{border:0}.btn-group{margin-right:10vw;margin-bottom:10vh}.btn_refresh,.btn_reject,.btn_complete{height:2.5rem}.btn_complete .icon,.btn_reject .icon,.btn_refresh .icon{width:1.1rem}.btn_complete span,.btn_reject span,.btn_refresh span{vertical-align:middle}.button-finish{transition:background-color linear 300ms;background-color:#059669;color:#fff;border-left:0}.button-finish:hover,.button-finish:focus,.button-finish:active{background-color:#10b981;color:#fff}.button-reject{transition:background-color linear 300ms;background-color:#d97706;color:#fff;border-left:0}.button-reject:hover,.button-reject:focus,.button-reject:active{background-color:#f59e0b;color:#fff}.button-reset{transition:background-color linear 300ms;background-color:#2563eb;color:#fff;border-left:0}.button-reset:hover,.button-reset:focus,.button-reset:active{background-color:#3b82f6;color:#fff}body{background-color:#bbb;display:flex;flex-direction:column;height:100vh;margin:0}main{flex:1}footer{background:#333;color:#fff;text-align:center;padding:10px 0}.page{margin-top:3rem;background:#fff;border-radius:.313rem;box-shadow:rgba(9,30,66,.25) 0 .25rem .5rem -.125rem,rgba(9,30,66,.08) 0 0 0 .063rem;max-width:40rem}.page section{max-width:30rem;margin:0 auto}.page header .icon{display:inline-block;border-radius:6.25rem;padding:.938rem;margin-bottom:2rem}.page header .icon.admin{background-color:#331904;color:#fecba1}.page header .icon.locked{background-color:#ffc107;color:#000}.page header .icon.signed{background-color:#146c43;color:#fff}.page header .icon.rejected{background-color:#e4d8d5;color:#fff}.page .form{max-width:30rem;margin:2rem auto;display:flex;gap:1rem}#form-access-code>.input,#form-admin-password>.input{flex-grow:1}#page-admin header .icon{background-color:#331904;color:#fecba1}.envelope{display:block;border:.063rem solid #eee;margin-bottom:1rem;padding:.5rem}footer#page-footer{color:#333;max-width:40rem;margin-top:1rem;font-size:.85rem}footer#page-footer a,footer#page-footer a:link,footer#page-footer a:hover,footer#page-footer a:visited,footer#page-footer a:focus{color:#444}.sender-card{background-color:transparent;border:0}.sender-card .row{height:7vh}.sender-card img{height:7vh;background-color:#d1cfcf;border-radius:3.125rem}.navbar .container{display:flex;padding:0;margin:0}.navbar-toggler{padding:0;margin:0;width:4rem;left:0}.envelope-message{position:absolute;display:flex;width:calc(100% - 8rem);align-items:center;justify-content:start;margin-left:4rem}.envelope-message .icon{margin-right:.5rem}.envelope-message .message{font-family:'Roboto',sans-serif;font-size:16px;font-weight:550}.logo{width:9rem;position:absolute;right:0;margin-right:2rem}.none-display{display:none}.dropdown-flag img,.img-flag{width:30%;height:70%}.dropdown-flag{height:75%;width:75%}.increase-dropdown-height{min-height:25rem}.dropdown-flag .select2-container{width:100%!important;max-width:11.25rem}.lang-item{font-size:.85rem}#langDropdownMenuButton{min-width:4vw}.highlight{font-weight:700;font-size:.85rem}.signature-process-title,.signature-process-name{font-size:1.125rem}.mail-link{color:#000;text-decoration:none}.mail-link:hover{text-decoration:underline}#flex-action-panel{z-index:1050}#form-access-code{margin-left:5rem}.header-1{align-items:center;justify-content:space-between;margin-top:0;padding-top:0}.header-1 .text{text-align:center;margin-left:1.5vw;margin-top:0;padding-top:0}@media(max-height:850px){.navbar .container{display:flex;padding:0;margin:0}.navbar-toggler{padding:0;margin:0;width:4rem;left:0}.envelope-message{width:calc(100% - 4rem - 9rem)}.envelope-message .message{font-size:14px;font-weight:550}.logo{width:9rem;position:absolute;right:0}.card-text,.card-text{font-size:.6rem;margin:0;padding:0}.highlight{font-weight:700;font-size:.5rem}.signature-process-title,.signature-process-name{font-size:.7rem}}@media(max-width:767px){.navbar{flex-direction:column;align-items:flex-start}.navbar-brand{font-size:.5rem;text-align:center;overflow:hidden;text-overflow:ellipsis}.envelope-message{width:calc(100% - 4rem - 4.5rem);margin-left:3rem}.envelope-message .message{font-size:12px;font-weight:550}.envelope-message .icon{margin-right:.1rem;font-size:1rem}.logo{width:5rem;right:0;margin-right:1rem}.btn_group{position:fixed;flex-direction:row;bottom:.5rem;right:.5rem}.img-fluid{width:1.2rem;height:100%;display:none}.page{margin-top:1rem;max-width:90%;padding:.5rem}.page section{max-width:90%}#form-access-code{margin-left:0}}@media(max-height:600px){.collapse{height:4rem}} \ No newline at end of file +.navbar-toggler{border:0}.btn-group{margin-right:10vw;margin-bottom:10vh}.btn_refresh,.btn_reject,.btn_complete{height:2.5rem}.btn_complete .icon,.btn_reject .icon,.btn_refresh .icon{width:1.1rem}.btn_complete span,.btn_reject span,.btn_refresh span{vertical-align:middle}.button-finish{transition:background-color linear 300ms;background-color:#059669;color:#fff;border-left:0}.button-finish:hover,.button-finish:focus,.button-finish:active{background-color:#10b981;color:#fff}.button-reject{transition:background-color linear 300ms;background-color:#d97706;color:#fff;border-left:0}.button-reject:hover,.button-reject:focus,.button-reject:active{background-color:#f59e0b;color:#fff}.button-reset{transition:background-color linear 300ms;background-color:#2563eb;color:#fff;border-left:0}.button-reset:hover,.button-reset:focus,.button-reset:active{background-color:#3b82f6;color:#fff}body{background:#f8fcfc;display:flex;flex-direction:column;height:100vh;margin:0}main{display:flex;margin:0 0 .5vh 0}.envelope-view{display:flex;flex-direction:column;width:100vw;height:95.9vh}#app{background:#808080;width:100vw;height:100%;flex-grow:1;border-width:0}footer{height:4vh;background-color:#001f61;border-radius:10px 10px 0 0;color:#fff;font-family:'Muli';padding:.5vh 0;position:fixed;bottom:0;width:100%;z-index:998;border-width:0}footer *{margin-left:1rem}footer>*{margin:0 6rem 0 1rem}footer a{color:#ff7500;text-decoration:none}.page{margin-top:3rem;background:#fff;border-radius:.313rem;box-shadow:rgba(9,30,66,.25) 0 .25rem .5rem -.125rem,rgba(9,30,66,.08) 0 0 0 .063rem;max-width:40rem}.page section{max-width:30rem;margin:0 auto}.page header .icon{display:inline-block;border-radius:6.25rem;padding:.938rem;margin-bottom:2rem}.page header .icon.admin{background-color:#331904;color:#fecba1}.page header .icon.locked{background-color:#ffc107;color:#000}.page header .icon.signed{background-color:#146c43;color:#fff}.page header .icon.rejected{background-color:#e4d8d5;color:#fff}.page .form{max-width:30rem;margin:2rem auto;display:flex;gap:1rem}#form-access-code>.input,#form-admin-password>.input{flex-grow:1}#page-admin header .icon{background-color:#331904;color:#fecba1}.envelope{display:block;border:.063rem solid #eee;margin-bottom:1rem;padding:.5rem}footer#page-footer{color:#333;max-width:40rem;margin-top:1rem;font-size:.85rem}footer#page-footer a,footer#page-footer a:link,footer#page-footer a:hover,footer#page-footer a:visited,footer#page-footer a:focus{color:#444}.sender-card{background-color:transparent;border:0}.sender-card .row{height:7vh}.sender-card img{height:7vh;background-color:#d1cfcf;border-radius:3.125rem}.navbar .container{display:flex;padding:0;margin:0}.navbar-toggler{padding:0;margin:0;width:4rem;left:0}.envelope-message{position:absolute;display:flex;width:calc(100% - 8rem);align-items:center;justify-content:start;margin-left:4rem}.envelope-message .icon{margin-right:.5rem}.envelope-message .message{font-family:'Roboto',sans-serif;font-size:16px;font-weight:550}.logo{width:9rem;position:absolute;right:0;margin-right:2rem}.none-display{display:none}.dropdown-flag img,.img-flag{width:30%;height:70%}.dropdown-flag{height:75%;width:75%}.increase-dropdown-height{min-height:25rem}.dropdown-flag .select2-container{width:100%!important;max-width:11.25rem}.lang-item{font-size:.85rem}#langDropdownMenuButton{min-width:4vw}.highlight{font-weight:700;font-size:.85rem}.signature-process-title,.signature-process-name{font-size:1.125rem}.mail-link{color:#000;text-decoration:none}.mail-link:hover{text-decoration:underline}#flex-action-panel{z-index:1050}#form-access-code{margin-left:5rem}.header-1{align-items:center;justify-content:space-between;margin-top:0;padding-top:0}.header-1 .text{text-align:center;margin-left:1.5vw;margin-top:0;padding-top:0}@media(max-height:850px){.navbar .container{display:flex;padding:0;margin:0}.navbar-toggler{padding:0;margin:0;width:4rem;left:0}.envelope-message{width:calc(100% - 4rem - 9rem)}.envelope-message .message{font-size:14px;font-weight:550}.logo{width:9rem;position:absolute;right:0}.card-text,.card-text{font-size:.6rem;margin:0;padding:0}.highlight{font-weight:700;font-size:.5rem}.signature-process-title,.signature-process-name{font-size:.7rem}}@media(max-width:767px){.navbar{flex-direction:column;align-items:flex-start}.navbar-brand{font-size:.5rem;text-align:center;overflow:hidden;text-overflow:ellipsis}.envelope-message{width:calc(100% - 4rem - 4.5rem);margin-left:3rem}.envelope-message .message{font-size:12px;font-weight:550}.envelope-message .icon{margin-right:.1rem;font-size:1rem}.logo{width:5rem;right:0;margin-right:1rem}.btn_group{position:fixed;flex-direction:row;bottom:.5rem;right:.5rem}.img-fluid{width:1.2rem;height:100%;display:none}.page{margin-top:1rem;max-width:90%;padding:.5rem}.page section{max-width:90%}#form-access-code{margin-left:0}}@media(max-height:600px){.collapse{height:4rem}} \ No newline at end of file