html, body {
    margin:0; 
    padding:0; 
    height: 100%;
    min-height: 100%;
}

h1 {
    font-size: 28px;
}

nav {
    padding: 0 0.75rem;
}

.navbar-fixed-bottom nav {
    position: fixed;
    bottom: 0;
    height: initial;
    line-height: initial;
}

.navbar-fixed-bottom nav ul li, .navbar-fixed-bottom nav ul li a {
    width: 80px;
    height: 67px;
    padding: 0;
    margin: 0;
}

.navbar-fixed-bottom nav i {
    color: #9e9e9e;
    font-size: 2.2rem;
    padding: 0.6rem 0 0.3rem;
    height: initial !important;
    line-height: initial !important;
    text-align: center;
}

.navbar-fixed-bottom nav a.sidenav-trigger i {
    height: initial !important;
    line-height: initial !important;
}

.navbar-fixed-bottom nav a.sidenav-trigger {
    display: initial !important;
}

.navbar-fixed-bottom nav .icon-label {
    font-size: .8rem;
    color: #9e9e9e;
    padding-bottom: 0.6rem;
    height: initial;
    line-height: initial;
    text-align: center;
}

.canvasContainer {
    width: 100%;
    height: 100%;
    min-height: 100%;
    padding: 1.52rem !important;
    display: flex;
    justify-content: center;
    align-items: center;
}

.fixed-action-btn {
    position: absolute;
    right: 23px;
}

.btn-header {
    margin-top: 20px;
    text-align: right;
}

.btn-header a {
    line-height: 27px;
}

#btnMore {
    bottom: 23px;
}

.relative {
    position: relative;
}

.colorDisplay {
    width: 20px;
    height: 20px;
    position: absolute;
    bottom: 20px;
    right: 12px;
}

.colorDisplay:hover {
    cursor: pointer;
}

.mainContainer {
    height: -webkit-calc(100% - 67px);
    height:    -moz-calc(100% - 67px);
    height:         calc(100% - 67px);
    margin-bottom: 0;
}

.menu {
    overflow: auto;
    height: 100%;
}

.sidenav li > .nav-item {
    display: block;
    height: 48px;
    line-height: 48px;
    padding: 0 32px;
}

.sidenav li .row .s6:nth-child(1n) {
    padding-left: 32px;
}

.sidenav li .row .s6:nth-child(2n) {
    padding-left: 0;
    padding-right: 32px;
}

.sidenav li .row .s6:nth-child(2n) .colorDisplay {
    right: 32px;
}

.sidenav li .row .s12 {
    padding: 0 32px;
}

#menu-size li a.presetSize {
    display: flex;
    justify-content: space-between;
}

#menu-size li a span:last-of-type {
    font-weight: 400;
}

#menu-background li.presetGradients {
    display: flex;
    flex-wrap: wrap;
    margin: 0 32px;
}

#menu-background li a.presetGradient {
    height: 32px;
    width: 32px;
    padding: 0px;
    margin: 0 14px 16px 0;
    border-radius: 4px;
    border: 1px solid #9e9e9e;
}

#menu-background li a.presetGradient:nth-child(5n) {
    margin: 0 0 16px 0;
}

#menu-background li a.pg001 {
    background: #22c1c3;
    background: -webkit-linear-gradient(to right, #22c1c3, #FC0149);
    background: linear-gradient(to right, #22c1c3, #FC0149);
}

#menu-background li a.pg002 {
    background: rgba(241,46,17,1);
    background: -webkit-linear-gradient(to right, rgba(241,46,17,1), rgba(245,175,25,1));
    background: linear-gradient(to right, rgba(241,46,17,1), rgba(245,175,25,1));
}

#menu-background li a.pg003 {
    background: #b92b27;
    background: -webkit-linear-gradient(to right, #b92b27, #1565c0);
    background: linear-gradient(to right, #b92b27, #1565c0);
}

#menu-background li a.pg004 {
    background: #00c3ff;
    background: -webkit-linear-gradient(to right, #00c3ff, #ffee00);
    background: linear-gradient(to right, #00c3ff, #ffee00);
}

#menu-background li a.pg005 {
    background: #1217d0;
    background: -webkit-linear-gradient(to right, #1217d0, #1cb5e0);
    background: linear-gradient(to right, #1217d0, #1cb5e0);
}

#menu-background li a.pg006 {
    background: #ffafbd;
    background: -webkit-linear-gradient(to right, #ffafbd, #ffc3a0);
    background: linear-gradient(to right, #ffafbd, #ffc3a0);
}

#menu-background li a.pg007 {
    background: #ff00cc;
    background: -webkit-linear-gradient(to right, #ff00cc, #333399);
    background: linear-gradient(to right, #ff00cc, #333399);
}

#menu-background li a.pg008 {
    background: #db36a4;
    background: -webkit-linear-gradient(to right, #db36a4, #f7ff00);
    background: linear-gradient(to right, #db36a4, #f7ff00);
}

#menu-background li a.pg009 {
    background: #a80077;
    background: -webkit-linear-gradient(to right, #a80077, #66ff00);
    background: linear-gradient(to right, #a80077, #66ff00);
}

#menu-background li a.pg010 {
    background: #43c6ac;
    background: -webkit-linear-gradient(to right, #43c6ac, #f8ffae);
    background: linear-gradient(to right, #43c6ac, #f8ffae);
}

#menu-background li a.pg011 {
    background: #C6FFDD;
    background: -webkit-linear-gradient(to right, #f7797d, #FBD786, #C6FFDD);
    background: linear-gradient(to right, #f7797d, #FBD786, #C6FFDD);
}

#menu-background li a.pg012 {
    background: #833ab4;
    background: -webkit-linear-gradient(to right, #fcb045, #fd1d1d, #833ab4);
    background: linear-gradient(to right, #fcb045, #fd1d1d, #833ab4);
}

#menu-background li a.pg013 {
    background: #12c2e9;
    background: -webkit-linear-gradient(to right, #12c2e9, #c471ed, #f64f59);
    background: linear-gradient(to right, #12c2e9, #c471ed, #f64f59);
}

#menu-background li a.pg014 {
    background: #1E9600;
    background: -webkit-linear-gradient(to right, #1E9600, #FFF200, #FF0000);
    background: linear-gradient(to right, #1E9600, #FFF200, #FF0000);
}

#menu-background li a.pg015 {
    background: linear-gradient(to right, #7DE2FC 0%, #B9B6E5 100%);
}

#menu-background li a.pg016 {
    background: linear-gradient(to right, #d7d2cc 0%, #304352 100%);
}

#menu-background li a.pg017 {
    background: linear-gradient(to right, #2b5876 0%, #4e4376 100%);
}

#menu-background li a.pg018 {
    background: linear-gradient(to right, #d299c2 0%, #fef9d7 100%);
}

#menu-background li a.pg019 {
    background: linear-gradient(to right, #231557 0%, #44107A 29%, #FF1361 67%, #FFF800 100%);
}

#menu-background li a.pg020 {
    background: linear-gradient(to right, #FF057C 0%, #7C64D5 48%, #4CC3FF 100%);
}

#menu-background li a.pg021 {
    background: linear-gradient(to right, #b3ffab 0%, #12fff7 100%);
}

#menu-background li a.pg022 {
    background-image: linear-gradient(to right, #5f72bd 0%, #9b23ea 100%);
}

#menu-background li a.pg023 {
    background-image: linear-gradient(to right, #88d3ce 0%, #6e45e2 100%);
}

#menu-background li a.pg024 {
    background-image: linear-gradient(to right, #fccb90 0%, #d57eeb 100%);
}

#menu-background li a.pg025 {
    background-image: linear-gradient(to right, #50cc7f 0%, #f5d100 100%);
}

#menu-background li a.pg026 {
    background-image: linear-gradient(to right, #4481eb 0%, #04befe 100%);
}

#menu-background li a.pg027 {
    background-image: linear-gradient(to right, #7028e4 0%, #e5b2ca 100%);
}

#menu-background li a.pg028 {
    background-image: linear-gradient(to right, #8baaaa 0%, #ae8b9c 100%);
}

#menu-background li a.pg029 {
    background-image: linear-gradient(to right, #9795f0 0%, #fbc8d4 100%);
}

#menu-background li a.pg030 {
    background-image: linear-gradient(to right, #ff758c 0%, #ff7eb3 100%);
}

#menu-background li a.pg031 {
    background-image: linear-gradient(to right, #f5f7fa 0%, #c3cfe2 100%);
}

#menu-background li a.pg032 {
    background-image: linear-gradient(to right, #fdfcfb 0%, #e2d1c3 100%);
}

#menu-background li a.pg033 {
    background-image: linear-gradient(to right, #89f7fe 0%, #66a6ff 100%);
}

#menu-background li a.pg034 {
    background-image: linear-gradient(to right, #fddb92 0%, #d1fdff 100%);
}

#menu-background li a.pg035 {   
    background-image: linear-gradient(to right, #a8edea 0%, #fed6e3 100%);
}

#menu-background li a.pg036 {   
    background-image: linear-gradient(to right, #50cc7f 0%, #d100ff 100%);
}

#menu-background li a.pg037 {   
    background-image: linear-gradient(to right, #fa709a 0%, #fee140 100%);
}

#menu-background li a.pg038 {
    background-image: linear-gradient(to right, #4facfe 0%, #00f2fe 100%);
}

.range-field {
    margin: 0;
}

@media only screen and (min-width: 993px) {
    #toast-container {
        top: 77px;
        left: 23px;
        max-width: 86%;
        width: 320px;
    }
}

.sidenav {
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    background: rgba(255, 255, 255, 0.75);
}

.sidenav-overlay  {
    background-color: transparent;
}