body {
    background-color: #fff;
    color: #333;
    margin: 33px; }

body, p, ol, ul, td {
    font-family: verdana, arial, helvetica, sans-serif;
    font-size: 13px;
    line-height: 18px; }

pre {
    background-color: #eee;
    padding: 10px;
    font-size: 11px; }

th {
    padding-bottom: 5px; }

td {
    padding: 0 5px 7px; }

div.field,
div.actions {
    margin-bottom: 10px; }

#notice {
    color: green; }

.field_with_errors {
    padding: 2px;
    background-color: red;
    display: table; }

#error_explanation {
    width: 450px;
    border: 2px solid red;
    padding: 7px 7px 0;
    margin-bottom: 20px;
    background-color: #f0f0f0; }

#error_explanation h2 {
    text-align: left;
    font-weight: bold;
    padding: 5px 5px 5px 15px;
    font-size: 12px;
    margin: -7px -7px 0;
    background-color: #c00;
    color: #fff; }

#error_explanation ul li {
    font-size: 12px;
    list-style: square; }

label {
    display: block; }

    #vanillatoasts-container {
            position: fixed;
            width: auto;
            max-width: 400px;
            font-family: 'Roboto', Arial, Helvetica, sans-serif;
            z-index: 1000000;
          }

          .top-start {
            top: 0;
            left: 0;
          }

          .top-center {
            top: 0%;
            left: 50%;
            transform: translate(-50%, 0);
          }

          .top-end {
            top: 0;
            right: 0;
          }

          .middle-start {
            top: 40vh;
            left: 0;
          }

          .middle-center {
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
          }

          .middle-end {
            top: 40vh;
            right: 0;
          }

          .bottom-start {
            bottom: 0;
            left: 0;
          }

          .bottom-center {
            bottom: 0;
            left: 50%;
            transform: translate(-50%, 0);
          }

          .bottom-end {
            bottom: 0;
            right: 0;
          }

          .vanillatoasts-toast {
            position: relative;
            padding: 15px;
            margin: 20px;
            background: #f5f5f5;
            cursor: pointer;
            max-width: 350px;
            box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
            animation-duration: 0.3s;
            animation-name: VanillaToasts;
            animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
            border-radius: 9px;
            display: grid;
          }

          .vanillatoasts-persistent {
            cursor: auto;
          }

          .vanillatoasts-fadeOut {
            animation-name: VanillaToastsFadeOut;
            animation-duration: 0.3s;
            animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
            animation-fill-mode: forwards;
          }

          #vanillatoasts-container p,
          #vanillatoasts-container h4 {
            margin: 3px 0 !important;
          }

          .vanillatoasts-title {
            font-weight: 700;
            font-size: 15px;
            margin-bottom: 10px;
            word-break: break-all;
          }

          .vanillatoasts-text-icon-container {
            display: flex;
          }

          .vanillatoasts-text {
            font-size: 14px;
            color: #fff;
            word-break: break-all;
          }

          .vanillatoasts-icon {
            margin-right: 5px;
          }

          .vanillatoasts-template-wrapper {
            word-break: break-all;
          }

          .vanillatoasts-toast a,
          .vanillatoasts-toast a:hover {
            color: #549edb !important;
            text-decoration: none !important;
          }

          /** toast types */
          .vanillatoasts-success {
            background-color: #15cd72;
          }

          .vanillatoasts-success > .vanillatoasts-text,
          .vanillatoasts-success > .vanillatoasts-text-icon-container > .vanillatoasts-text {
            color: #282828;
          }

          .vanillatoasts-warning {
            background-color: #ffb40c;
          }

          .vanillatoasts-warning > .vanillatoasts-text,
          .vanillatoasts-warning > .vanillatoasts-text-icon-container > .vanillatoasts-text {
            color: #282828;
          }

          .vanillatoasts-error {
            background-color: #e0455e;
          }

          .vanillatoasts-error > .vanillatoasts-text,
          .vanillatoasts-error > .vanillatoasts-text-icon-container > .vanillatoasts-text {
            color: #282828;
          }

          .vanillatoasts-info > .vanillatoasts-text,
          .vanillatoasts-info > .vanillatoasts-text-icon-container > .vanillatoasts-text {
            color: #777;
          }

          .vanillatoasts-confirm-button {
            padding: 0px 10px !important;
            border: 1px solid #fff;
            -webkit-transition: all 0.1s;
            -moz-transition: all 0.1s;
            -ms-transition: all 0.1s;
            transition: all 0.1s;
            margin: 10px 10px 0px 10px;
            position: relative;
            float: right;
            cursor: pointer;
            font-weight: 600;
            background-color: #fff;
            color: #475c7b;
            font-size: 13px;
            border-radius: 4px;
            height: 30px;
            line-height: 30px;
          }

          .vanillatoasts-cancel-button {
            padding: 0px 10px !important;
            border: 1px solid #fff;
            -webkit-transition: all 0.1s;
            -moz-transition: all 0.1s;
            -ms-transition: all 0.1s;
            transition: all 0.1s;
            margin: 10px 10px 0px 10px;
            position: relative;
            background-color: transparent;
            color: #fff;
            float: right;
            cursor: pointer;
            font-weight: 600;
            font-size: 13px;
            border-radius: 4px;
            height: 30px;
            line-height: 30px;
          }

          @keyframes VanillaToasts {
            from {
              transform: translate3d(0, -400px, 0);
              opacity: 0;
            }
            to {
              transform: translate3d(0, 0, 0);
              opacity: 1;
            }
          }

          @keyframes VanillaToastsFadeOut {
            from {
              transform: translate3d(0, 0, 0);
              opacity: 1;
            }
            to {
              transform: translate3d(0, -400px, 0);
              opacity: 0;
            }
          }