Chris@14: /**
Chris@14:  * @file
Chris@14:  * Set base styles for the off-canvas dialog.
Chris@14:  */
Chris@14: 
Chris@14: /* Set some global attributes. */
Chris@14: #drupal-off-canvas *,
Chris@14: #drupal-off-canvas *:not(div) {
Chris@18:   color: #ddd;
Chris@14:   background: #444;
Chris@18:   font-family: "Lucida Grande", "Lucida Sans Unicode", "liberation sans", sans-serif;
Chris@14: }
Chris@14: 
Chris@14: /* Generic elements. */
Chris@14: #drupal-off-canvas a,
Chris@14: #drupal-off-canvas .link {
Chris@18:   transition: color 0.5s ease;
Chris@18:   text-decoration: none;
Chris@18:   color: #85bef4;
Chris@14:   border-bottom: none;
Chris@18:   font-family: "Lucida Grande", "Lucida Sans Unicode", "liberation sans", sans-serif;
Chris@14:   font-size: inherit;
Chris@14:   font-weight: normal;
Chris@14: }
Chris@14: 
Chris@14: #drupal-off-canvas a:focus,
Chris@14: #drupal-off-canvas .link:focus,
Chris@14: #drupal-off-canvas a:hover,
Chris@14: #drupal-off-canvas .link:hover {
Chris@14:   text-decoration: underline;
Chris@14: }
Chris@14: #drupal-off-canvas hr {
Chris@14:   height: 1px;
Chris@14:   background: #ccc;
Chris@14: }
Chris@14: #drupal-off-canvas summary,
Chris@14: #drupal-off-canvas .fieldgroup:not(.form-composite) > legend {
Chris@14:   font-weight: bold;
Chris@14: }
Chris@14: #drupal-off-canvas h1,
Chris@14: #drupal-off-canvas .heading-a {
Chris@14:   display: block;
Chris@18:   font-size: 1.625em;
Chris@14:   font-weight: bold;
Chris@14:   line-height: 1.875em;
Chris@14: }
Chris@14: #drupal-off-canvas h2,
Chris@14: #drupal-off-canvas .heading-b {
Chris@14:   display: block;
Chris@14:   margin: 10px 0;
Chris@14:   font-size: 1.385em;
Chris@18:   font-weight: bold;
Chris@14: }
Chris@14: #drupal-off-canvas h3,
Chris@14: #drupal-off-canvas .heading-c {
Chris@14:   display: block;
Chris@14:   margin: 10px 0;
Chris@14:   font-size: 1.231em;
Chris@18:   font-weight: bold;
Chris@14: }
Chris@14: #drupal-off-canvas h4,
Chris@14: #drupal-off-canvas .heading-d {
Chris@14:   display: block;
Chris@14:   margin: 10px 0;
Chris@14:   font-size: 1.154em;
Chris@18:   font-weight: bold;
Chris@14: }
Chris@14: #drupal-off-canvas h5,
Chris@14: #drupal-off-canvas .heading-e {
Chris@14:   display: block;
Chris@14:   margin: 10px 0;
Chris@14:   font-size: 1.077em;
Chris@18:   font-weight: bold;
Chris@14: }
Chris@14: #drupal-off-canvas h6,
Chris@14: #drupal-off-canvas .heading-f {
Chris@14:   display: block;
Chris@14:   margin: 10px 0;
Chris@14:   font-size: 1.077em;
Chris@18:   font-weight: bold;
Chris@14: }
Chris@14: #drupal-off-canvas p {
Chris@14:   margin: 1em 0;
Chris@14: }
Chris@14: #drupal-off-canvas dl {
Chris@14:   margin: 0 0 20px;
Chris@14: }
Chris@14: #drupal-off-canvas dl dd,
Chris@14: #drupal-off-canvas dl dl {
Chris@18:   margin-bottom: 10px;
Chris@14:   margin-left: 20px; /* LTR */
Chris@14: }
Chris@14: [dir="rtl"] #drupal-off-canvas dl dd,
Chris@14: [dir="rtl"] #drupal-off-canvas dl dl {
Chris@14:   margin-right: 20px;
Chris@14: }
Chris@14: #drupal-off-canvas blockquote {
Chris@14:   margin: 1em 40px;
Chris@14: }
Chris@14: #drupal-off-canvas address {
Chris@14:   font-style: italic;
Chris@14: }
Chris@14: #drupal-off-canvas u,
Chris@14: #drupal-off-canvas ins {
Chris@14:   text-decoration: underline;
Chris@14: }
Chris@14: #drupal-off-canvas s,
Chris@14: #drupal-off-canvas strike,
Chris@14: #drupal-off-canvas del {
Chris@14:   text-decoration: line-through;
Chris@14: }
Chris@14: #drupal-off-canvas big {
Chris@14:   font-size: larger;
Chris@14: }
Chris@14: #drupal-off-canvas small {
Chris@14:   font-size: smaller;
Chris@14: }
Chris@14: #drupal-off-canvas sub {
Chris@14:   vertical-align: sub;
Chris@14:   font-size: smaller;
Chris@14:   line-height: normal;
Chris@14: }
Chris@14: #drupal-off-canvas sup {
Chris@14:   vertical-align: super;
Chris@14:   font-size: smaller;
Chris@14:   line-height: normal;
Chris@14: }
Chris@14: #drupal-off-canvas abbr,
Chris@14: #drupal-off-canvas acronym {
Chris@14:   border-bottom: dotted 1px;
Chris@14:   background: transparent;
Chris@14: }
Chris@14: 
Chris@14: #drupal-off-canvas ul {
Chris@14:   list-style-type: disc;
Chris@14:   list-style-image: none;
Chris@14: }
Chris@14: [dir="rtl"] #drupal-off-canvas .messages__list {
Chris@14:   margin-right: 0;
Chris@14: }
Chris@14: #drupal-off-canvas ol {
Chris@14:   list-style-type: decimal;
Chris@14: }
Chris@14: #drupal-off-canvas ul li,
Chris@14: #drupal-off-canvas ol li {
Chris@14:   display: block;
Chris@14: }
Chris@14: #drupal-off-canvas blockquote,
Chris@14: #drupal-off-canvas code {
Chris@14:   margin: 20px 0;
Chris@14: }
Chris@14: #drupal-off-canvas pre {
Chris@14:   margin: 20px 0;
Chris@14:   white-space: pre-wrap;
Chris@14: }
Chris@14: 
Chris@14: /* Classes for hidden and visually hidden elements. See hidden.module.css. */
Chris@14: #drupal-off-canvas .hidden {
Chris@14:   display: none;
Chris@14: }
Chris@14: #drupal-off-canvas .visually-hidden {
Chris@14:   position: absolute !important;
Chris@18:   overflow: hidden;
Chris@14:   clip: rect(1px, 1px, 1px, 1px);
Chris@18:   width: 1px;
Chris@14:   height: 1px;
Chris@14:   word-wrap: normal;
Chris@14: }
Chris@14: #drupal-off-canvas .visually-hidden.focusable:active,
Chris@14: #drupal-off-canvas .visually-hidden.focusable:focus {
Chris@14:   position: static !important;
Chris@18:   overflow: visible;
Chris@14:   clip: auto;
Chris@18:   width: auto;
Chris@14:   height: auto;
Chris@14: }
Chris@14: #drupal-off-canvas .invisible {
Chris@14:   visibility: hidden;
Chris@14: }
Chris@14: 
Chris@14: /* Some system classes. See system.admin.css. */
Chris@14: #drupal-off-canvas .panel {
Chris@14:   padding: 5px 5px 15px;
Chris@14: }
Chris@14: #drupal-off-canvas .panel__description {
Chris@14:   margin: 0 0 3px;
Chris@14:   padding: 2px 0 3px 0;
Chris@14: }
Chris@14: #drupal-off-canvas .compact-link {
Chris@14:   margin: 0 0 10px 0;
Chris@14: }
Chris@14: #drupal-off-canvas small .admin-link:before {
Chris@18:   content: " [";
Chris@14: }
Chris@14: #drupal-off-canvas small .admin-link:after {
Chris@18:   content: "]";
Chris@14: }
Chris@14: 
Chris@14: /* Override jQuery UI */
Chris@14: #drupal-off-canvas .ui-widget-content a {
Chris@14:   color: #85bef4 !important;
Chris@14: }
Chris@14: 
Chris@14: /* Message styles */
Chris@14: #drupal-off-canvas .messages {
Chris@14:   background: no-repeat 10px 17px;
Chris@14: }
Chris@14: [dir="rtl"] #drupal-off-canvas .messages {
Chris@14:   background-position: right 10px top 17px;
Chris@14: }
Chris@14: #drupal-off-canvas .messages abbr {
Chris@14:   color: #444;
Chris@14: }
Chris@14: #drupal-off-canvas .messages--status {
Chris@18:   color: #325e1c;
Chris@14:   background-color: #f3faef;
Chris@14:   background-image: url(../icons/73b355/check.svg);
Chris@14: }
Chris@14: #drupal-off-canvas .messages--warning {
Chris@18:   color: #734c00;
Chris@14:   background-color: #fdf8ed;
Chris@14:   background-image: url(../icons/e29700/warning.svg);
Chris@14: }
Chris@14: 
Chris@14: #drupal-off-canvas .messages--error {
Chris@18:   color: #a51b00;
Chris@14:   background-color: #fcf4f2;
Chris@14:   background-image: url(../icons/e32700/error.svg);
Chris@14: }
Chris@14: 
Chris@14: #drupal-off-canvas .messages--error div[role="alert"] {
Chris@18:   color: inherit;
Chris@14:   background: transparent;
Chris@14: }