/**
 * Table of Contents
 */
/*
/* 01. Colour Variables
/* 02. HTML Elements
/* 02.1 HTML Elements -> Common
/* 02.2 HTML Elements -> HTML & Body
/* 02.3 HTML Elements -> Regions
/* 02.4 HTML Elements -> Media
/* 02.5 HTML Elements -> Form
/* 02.6 HTML Elements -> List
/* 02.7 HTML Elements -> Table
/* 02.8 HTML Elements -> Typography
/* 03. Default Box Sizing
/* 04. Attributes
/* 04.1 Attributes -> Selection
/* 05. Layout
/* 05.1 Layout -> Main
/* 05.2 Layout -> Sidebar(s)
/* 05.3 Layout -> Flex
/* 06. Header
/* 06.1 Header -> Preface Area
/* 06.2 Header -> Site Branding
/* 06.3 Header -> Main Menu
/* 06.4 Header -> User Menu
/* 06.5 Header -> Mobile Menu
/* 06.6 Header -> Search Block
/* 06.7 Header -> Cart Popup
/* 07. Page Header
/* 07.1 Page Header -> Breadcrumb
/* 07.2 Page Header -> Title
/* 07.3 Page Header -> Highlighted
/* 08. Homepage
/* 08.1 Homepage -> Slider
/* 09. Node
/* 09.1 Node -> Teaser View
/* 09.2 Node -> Title
/* 09.3 Node -> Submitted Details
/* 09.4 Node -> Taxonomy & Links
/* 09.5 Node -> Read More
/* 09.6 Node -> Pager
/* 09.7 Node -> Search Page
/* 09.8 Node -> Form Items
/* 09.9 Node -> Composers
/* 09.10 Node -> Images
/* 09.12 Node -> Commerce Products
/* 09.13 Node -> Products View
/* 09.14 Node -> Commerce Cart
/* 09.15 Node -> Commerce Checkout
/* 10. Footer
/* 10.1 Footer -> Scroll To Top
/* 11. Social Icons
/* 12. Block
/* 12.1 Block -> Highlighted Region
/* 12.2 Block -> Content
/* 12.3 Block -> Search Contact
/* 13. Comments
/* 13.1 Comments -> Form
/* 13.2 Comments -> Single
/* 14. Shortcodes
/* 14.1 Shortcodes -> Text Align
/* 14.2 Shortcodes -> Text Size
/* 14.3 Shortcodes -> Container Width
/* 14.4 Shortcodes -> Empty Space
/* 14.5 Shortcodes -> Colour
/* 15. Button
/* 16. Services
/* 17. Features
/* 18. Animation
/* 19. Admin
/* 19.1 Admin -> Drupal Core - NOT USED
/* 19.2 Admin -> Admin Tabs - NOT USED
/* 19.3 Admin -> System Message
/* 20. Clearing
 */

/* 01. Colour Variables
---------------------------------------- */
 :root {
  --content-bg: #ffffff;
  --content-border-color: #e2e2e2;
  --footer-top-bg: #2b323c;
  --footer-bottom-bg: #3b4252;
  --footer-top-color: #ffffff;
  --footer-bottom-color: #999999;
  --text-color: #222222;
  --bold-color: #222222;
  --border-color: #ccc;
  --theme-color: #8a211b; /* Red */
  --theme-color-two: #a5a9b1; /* Light grey */
}

/* 02. HTML Elements
---------------------------------------- */

/* 02.1 HTML Elements -> Common
---------------------------------------- */
hr {
  clear: both;
  width: 100%;
  height: 1px;
  background: var(--border-color);
  border: 0;
  box-sizing: content-box;
  overflow: visible;
  margin-bottom: 2em;
}
address {
  margin: 0 0 1em 0;
  font-style: normal;
}
dl {
  margin: 0 2em;
}
dt {
  font-weight: bold;
}
dd {
  margin-bottom: 2em;
}
blockquote {
  position: relative;
  margin: 1em 0;
  padding: 1em;
  background: var(--content-bg);
  border-left: 6px solid var(--theme-color);
  border-top: 2px solid var(--border-color);
  border-right: 2px solid var(--border-color);;
  border-bottom: 2px solid var(--border-color);;
}
blockquote > :last-child {
  margin-bottom: 0;
}

/* 02.2 HTML Elements -> HTML & Body
---------------------------------------- */
html {
  line-height: 1.7;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}
body {
  width: 100%;
  height: auto;
  min-height: 100%;
  margin: 0;
  padding: 0;
  font-family: Helvetica,Arial,sans-serif;
  font-size: 15px;
  font-weight: 300;
  line-height: 1.625;
  background: url(/themes/custom/brolga/images/bg-pattern.jpg) repeat;
  color: var(--text-color);
  overflow-x: hidden;
  -webkit-font-smoothing: subpixel-antialiased;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}
.mm-page {
  background: url(/themes/custom/brolga/images/bg-pattern.jpg) repeat;
}
.mm-page .wrapper {
  background: white;
}
/* 02.3 HTML Elements -> Regions
---------------------------------------- */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section {
  display: block;
}
summary {
  display: list-item;
  cursor: pointer;
  color: #a1a1a1;
  color: var(--text-color);
}
template,
[hidden] {
  display: none;
}

/* 02.4 HTML Elements -> Media
---------------------------------------- */
audio,
canvas,
progress,
video {
  display: inline-block;
  vertical-align: baseline;
}
audio:not([controls]) {
  display: none;
  height: 0;
}
img,
a img {
  height: auto;
  margin: 0;
  padding: 0;
  border: 0;
  border-style: none;
  vertical-align: middle;
}
svg:not(:root) {
  overflow: hidden;
}
figure {
  max-width: 100%;
  height: auto;
  margin: 1em 0;
  border: 0;
}
.align-left {
  margin: 1em 1em 1em 0;
}
.align-right {
  margin: 1em 0 1em 1em;
}
.align-center {
  margin-top: 1em;
  margin-bottom: 1em;
}
figcaption {
  padding: 4px;
  font-size: 0.8em;
  background: var(--content-bg);
  border: 1px solid var(--border-color);
  text-align: center;
}
.image-field {
  margin: 0 0 1em 0;
}

/* 02.5 HTML Elements -> Form
---------------------------------------- */
button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  font-size: 100%;
  line-height: 1.6;
  margin: 0;
}
button,
input {
  overflow: visible;
}
select {
  text-transform: none;
}
button[disabled],
html input[disabled] {
  cursor: not-allowed;
}
::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit;
}
input {
  line-height: normal;
}
input, textarea {
  max-width: 100%;
  box-sizing: border-box;
}
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
select.form-select,
textarea {
  color: var(--text-color);
  padding: 7px;
  border: 1px solid var(--border-color);
  -webkit-transition: border 0.5s ease-in-out;
  transition: border 0.5s ease-in-out;
}
input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
select.form-select:focus,
textarea:focus {
  border: 1px solid var(--theme-color-two);
  outline: 0;
}
textarea {
  width: 100%;
  overflow: auto;
  -webkit-transition: border 0.3s linear;
  transition: border 0.3s linear;
  vertical-align: top;
}
@-webkit-keyframes autofill {
  to {
    color: var(--text-color);
    background: transparent;
  }
}
@keyframes autofill {
  to {
    color: var(--text-color);
    background: transparent;
  }
}
input:-webkit-autofill {
  -webkit-animation-name: autofill;
  animation-name: autofill;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
[type="checkbox"],
[type="radio"] {
  padding: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
[type="search"] {
  -webkit-appearance: textfield;
  outline-offset: -2px;
  -webkit-appearance: textfield;
  -moz-appearance: textfield;
}
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}
progress {
  vertical-align: baseline;
}
optgroup {
  font-weight: bold;
}
select {
  padding: 4px 0;
}
form label {
  color: var(--bold-color);
}
label[for] {
  cursor: pointer;
}
.form-textarea {
  height: 100px;
  -webkit-transition: height 0.3s ease-in-out;
  transition: height 0.3s ease-in-out;
}
.form-textarea:focus {
  height: 180px;
}

/* 02.6 HTML Elements -> List
---------------------------------------- */
 ul,
 ol {
   margin: 0;
 }
 [dir="rtl"] ul,
 [dir="rtl"] ol {
   padding: 0 1em 0.25em 0;
 }
 ol ol,
 ul ul {
   margin: 0;
   padding: 0 0 0.25em 1em;
 }
 [dir="rtl"] ol ol,
 [dir="rtl"] ul ul {
   padding: 0 1em 0.25em 0;
 }
 ul {
   list-style: disc;
 }
 ol {
   list-style: decimal;
 }
 li > ul,
 li > ol {
   margin-bottom: 0;
 }
 [dir="rtl"] ul,
 [dir="rtl"] ol {
   padding: 0 1em 0.25em 0;
 }
 li {
   padding: 0;
 }

/* 02.7 HTML Elements -> Table
---------------------------------------- */
table {
  width: 100%;
  margin-bottom: 1em;
  border-spacing: 0;
  border-collapse: collapse;
}
th,
tr,
td {
  vertical-align: middle;
}
th {
  margin: 0;
  padding: 5px 10px;
  background: #3b4252;
  color: #fff;
  border: 1px solid #3b4252;
  text-align: left;
  text-shadow: none;
  font-weight: normal;
}
th a {
  color: #fff;
}
th a:hover {
  color: #C8A9A1;
}
td {
  padding: 5px 10px;
  border: 1px solid var(--border-color);
}

/* 02.8 HTML Elements -> Typography
---------------------------------------- */
h1 {
  font-size: 22px;
  margin: 0;
}
h2 {
  font-size: 18px;
  margin: .2em 0;
  font-weight: bold;
}
h3 {
  font-size: 16px;
  font-weight: bold;
  margin: 0 0 0.4em;
}
h4 {
  font-size: 14px;
  font-weight: bold;
  font-style: italic;
  margin: 0 0 0.4em;
}
h5 {
  font-size: 10px;
}
h6 {
  font-size: 8px;
}
p {
  margin: 0 0 0.5em 0;
}
b,
strong {
  font-weight: bold;
  color: var(--bold-color);
}
dfn,
cite {
  font-style: italic;
}
del {
  text-decoration: line-through;
}
small {
  font-size: 80%;
}
big {
  font-size: 125%;
}
em {
  font-style: italic;
}
a {
  color: var(--theme-color);
  background-color: transparent;
  text-decoration: none;
}
a:active,
li a.active {
  color: var(--theme-color);
}
a:hover,
a:visited:hover {
  color: var(--theme-color-two);
}
a:active,
a:hover,
a:focus {
  text-decoration: none;
  border: 0;
  outline: 0;
}
code,
kbd,
pre,
samp,
pre.sf-dump .sf-dump-public,
pre.sf-dump .sf-dump-protected {
  font-family: monospace, monospace;
  font-size: 1em;
  background: #f0f8ff !important;
  color: #000000 !important;
}
kbd {
  margin: 0;
  padding: 0 5px;
}
pre {
  overflow: auto;
  margin: 1em 0;
  padding: 1em;
}
sub,
sup {
  position: relative;
  font-size: 75%;
  line-height: 0;
  vertical-align: baseline;
}
sub {
  bottom: -0.25em;
}
sup {
  top: -0.5em;
}
tt,
var {
  font-family: monospace, monospace;
  font-style: italic;
}
mark {
  background: var(--theme-color);
  color: #ffffff;
  text-shadow: none;
}
acronym[title], abbr[title] {
  border-bottom: none;
  text-decoration: underline;
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
}
abbr,
acronym {
  cursor: help;
}

/* 03. Default Box Sizing
---------------------------------------- */
/** {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
:after,
:before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
*:after,
*::after,
*:before,
*::before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}*/

/* 04. Attributes
---------------------------------------- */

/* 04.1 Attributes -> Selection
---------------------------------------- */
::-moz-selection {
  background: var(--theme-color);
  color: #fff;
  text-shadow: none;
}
::selection {
  background: var(--theme-color);
  color: #fff;
  text-shadow: none;
}

/* 05. Layout
--------------------------------*/
.wrapper {
  width: 1260px;
  margin: 0 auto;
}
.main-container {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  margin-top: 20px;
}

/* 05.1 Layout -> Main
--------------------------------*/
#main {
  position: relative;
  background-color: white;
  padding: 0 20px 20px;
  order: 2;
  width: auto;
}
/*.no-sidebar #main {
  width: 100%;
  margin: 0;
  padding: 0;
} TODO: delete */
/*.no-sidebar #home-main {
  margin: 0.5em 20px 1em 20px;
  position: relative;
  width: auto;
} TODO: delete */

/* 05.2 Layout -> Sidebar(s)
--------------------------------*/
#sidebar-left {
  order: 1;
  margin-left: 20px;
}
#sidebar-right {
  order: 3;
}
.sidebar {
  padding: 0;
}
.sidebar .block {
  border-radius: 0;
  clear: both;
  margin-bottom: 1em;
  font-size: 14px;
  width: 230px;
}
.sidebar ul,
.sidebar ol {
  margin: 0;
  padding: 0;
}
.sidebar ul {
  list-style: none;
}
.sidebar ul li {
  position: relative;
}
.sidebar .block > h2 {
  color: #FFFFFF;
  background-color: var(--theme-color);
  font-weight: bold;
  font-size: 14px;
  padding: 0.7em;
  text-transform: uppercase;
  margin: 0;
}
/* Facets in sidebar */
.block-facet > .block-content {
  border: 1px solid rgb(226, 226, 226);
  padding: 0.7em;
  border-top: none;
  display: block;
}
.block-facet .fas {
  display: none;
}
.facet-item input[type="checkbox"] {
  position: absolute;
  top: 2px;
  left: 0;
  height: 17px;
  width: 17px;
  margin-right: 17px;  
}
.facet-active h2::before {
  content: "*";
}
.sidebar ul li > label {
  margin-left: 24px;
  display: inline-block;
}
.sidebar ul li .facets-widget {
  padding-left: 25px;
}
.sidebar .item-list {
  margin: 0;
}
/* Forms in sidebar */
.sidebar input[type="text"],
.sidebar input[type="email"],
.sidebar input[type="url"],
.sidebar input[type="password"],
.sidebar input[type="search"],
textarea {
  width: 100%;
  border: 1px solid var(--content-border-color);
}

/* 05.3 Layout -> Flex
--------------------------------*/
.flex-container {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  margin: 0;
}

/* 06. Header
--------------------------------------*/
#header {
	background-color: var(--theme-color);
	position: relative;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
#header-top {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  padding: 0 20px;
}

/* 06.1 Header -> Preface Area
--------------------------------------*/
#preface-area {
  background: var(--footer-top-bg);
}
#preface-area p {
  margin: 0;
  color: #fff;
}

.grad-bar {
  background: linear-gradient(#2b323c, #fff);
  height: 8px;
  clear: both;
}
.top-grad-bar {
  background: linear-gradient(#2b323c, #d7d7d7);
  height: 8px;
  clear: both;
}
.bottom-grad-bar {
  background: linear-gradient(#d7d7d7, #fff);
  height: 8px;
}

/* 06.2 Header -> Site Branding
--------------------------------------*/
#site-logo {
  width: 50%;
   -webkit-align-self: flex-start;
   align-self: flex-start;
}
#site-logo img {
  padding: 5px 0;
}
#partner-logo {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-align: center;
  align-items: flex-end;
}
#partner-logo a {
  padding-bottom: 7px;
  padding-right: 14px;
}
#partner-logo img {
  max-height: 60px;
}
.phone {
	padding: 0 5px 0 10px;
	margin-top: -2px;
}
.phone-number {
  margin-right: 5px;
}
#navigation {
	-webkit-box-flex: 2;
  order: 3;
}

/* 06.3 Header -> Main Menu
--------------------------------------*/
#navigation {
  display: block;
  float: left;
  width: 100%;
  border-top: 2px solid #f6f1f0;
  box-sizing: border-box;
}
#main-menu {
  display: block;
  float: left;
}
#main-menu > ul {
  font-size: 14px;
  list-style: none;
  margin: 0;
  padding: 0;
  display: table;
  width: 100%;
}
#main-menu > ul li {
  border: none;
  position: relative;
  display: table-cell;
  text-align: left;
}
#main-menu > ul.menu a {
  color: #fff;
  line-height: 39px;
  padding: 0 1.6em;
  text-decoration: none;
  font-weight: bold;
  display: block;
}
#main-menu > ul ul {
  display: none;
  float: left;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 39px;
  left: 0;
  list-style: none;
  width: 150px;
  z-index: 999;
}
#main-menu > ul ul li {
  display: block;
  text-align: left;
  overflow: visible;
}
#main-menu > ul ul ul {
  left: 100%;
  top: 0;
  display: none;
  float: left;
  margin: 0;
  position: absolute;
  list-style: none;
  width: 151px;
  z-index: 999;
}
#main-menu > ul ul a {
  background: #8a211b;
  border-top: 1px solid #2b323c;
  color: #fff;
  font-size: 13px;
  font-weight: normal;
  height: auto;
  line-height: 1em;
  padding: 10px;
}
#main-menu > ul ul ul a {
  background: #8a211b;
  border-left: 1px solid #2b323c;
  width: 150px;
}
#main-menu > ul li:hover > a,
#main-menu > ul ul :hover > a,
#main-menu > ul a:focus {
  color: #e0cec9;
  background: #902b26;
}
#main-menu ul li:hover,
#main-menu ul li.active-trail,
#main-menu ul ul li:hover,
#main-menu ul ul li.active-trail {
  background: #902b26;
}
#main-menu > ul li:hover > ul {
  display: block;
}
#main-menu > ul li:last-child, 
#main-menu > ul ul li {
  border:none;
}
#main-menu ul li.leaf, #main-menu ul li.expanded {
  list-style: none;
}

/* 06.4 Header -> User Menu & Preface Menu
--------------------------------------*/
.overlay {
  z-index: 499;
  background: #000;
  display: none;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0.6;
}
.popup {
  position: fixed;
  top: -400px;
  left: 50%;
  width: 350px;
  margin-left: -195px;
  background-color: #fff;
  color: #222222;
  padding: 20px;
  z-index: 999;
}
.popup h2, .popup label, .popup a {
  font-family: Helvetica, Arial, sans-serif;
}
.popup h2 {
  font-size: 18px;
  font-weight: bold;
}
.popup label, .popup li {
  font-size: 14px;
  font-weight: bold;
}
.popup .form-item, .popup .item-list {
  margin-bottom: 10px;
}
.popup ul {
  margin-left: -1px;
  padding-left: 15px;
}
.popup input {
  font-size: 14px;
  box-sizing: border-box;
}
.popup .user-login-form input[type='password'],
.popup .user-login-form input[type='text'] {
  width: 100%;
}
.popup .create-account-link,
.popup .request-password-link {
  color: #1982d1;
  font-weight: normal;
}
.popup .user-login-form {
  margin-bottom: 10px;
}
.popup .button {
  margin-top: 5px;
}
.popup .close a {
  font-size: 16px;
  line-height: 0.5;
  position: absolute;
  top: 10px;
  right: 10px;
  font-weight: bold;
  cursor: pointer;
  display: block;
  padding: 8px 8px 10px;
  color: #fff;
  background: var(--theme-color);
}
.popup .close a:hover {
  color: var(--theme-color);
  background: #242424;
}
#preface-block ul {
  list-style: none;
  margin-left: 10px;
  padding-left: 0;
}
#preface-block ul > li {
  border: none;
  float: left;
  position: relative;
  list-style: none outside none;
  margin: 10px 0;
  border-left: 1px dotted #555555;
  color: #fff;
  font-size: 12px;
}
#preface-block ul > li:first-child {
  border-left: none;
  padding-left: 0;
}
#preface-block ul > li > a {
  color: #fff;
  padding: 0 1em;
  text-decoration: none;
  display: block;
}
.popup ul > li > a:hover, #preface-block ul > li > a:hover, a.cart-button:hover {
  color: #C8A9A1;
}
#user-menu > ul {
  float: right;
  margin: 0;
}

/* 06.5 Header -> Mobile Menu
--------------------------------------*/
.off-canvas-wrapper {
  display: none;
}
#mobile-header { 
  display: none;
}
.responsive-menu-toggle-icon {
  height: 52px;
}
/*.mm-menu_offcanvas {
  width: 260px;
}*/
.mm-listitem:after {
  left: 0;
}
.mm-panels .mm-listview .mm-listitem a {
  color: #707070;
}
.mm-navbar__title > span {
  color: var(--theme-color);
  font-size: 20px;
  font-weight: bold;
}

/* 06.6 Header -> Search Block
--------------------------------------*/
#search-bar {
  -webkit-box-flex: 1;
  margin-left: 20px;
  align-self: center;
}
#views-exposed-form-site-search-page-1 .form-actions,
#search-bar .form-actions, #search-bar .js-form-type-select {
  display: none;
}
#search-bar form, #search-bar input {
  margin: 0;
}
#search-bar .form-item input {
  font-size: 16px;
  width: 150px;
}
.view-site-search #views-exposed-form-search-products-page-1 .form-item-search-api-fulltext {
  display: none;
}
.view-site-search .views-row, .view-product-search .views-row {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  width: 100%;
}
/* DELETE
.view-product-search .views-field-title a,
.view-site-search .views-field-title a,
.view-site-search .views-field-title a {
  color: var(--theme-color);
  text-decoration: none;
}*/

/* 06.7 Header -> Cart Popup
--------------------------------------*/
#block-commerce-popup-cart-commerce-popup-cart {
  float: none;
}
#block-commerce-popup-cart-commerce-popup-cart #commerce-cart-pop-block {
  padding: 10px;
  top: 62px;
  right: -2px;
  box-sizing: 
}
#commerce-cart-pop-block table td {
  border: 1px solid var(--border-color) !important;
  padding: 6px;
}
#block-commerce-popup-cart-commerce-popup-cart .commerce-cart-pop-count {
  position: relative;
  left: 4px;
  top: -12px;
  font-weight: bold;
  font-size: 14px;
}
#commerce-cart-pop-block .button {
  font-size: 0.8em;
  padding: 3px 6px;
  width: max-content;
}
#commerce-cart-pop-block .button a {
  color: #fff;
}
#commerce-cart-pop-block .button a:hover {
  color: var(--theme-color);
}
.commerce-cart-pop-arrow {
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-bottom: 7px solid #ccc;
  height: 0; 
  width: 0;
  right: 10px;
  top: -7px;
  position: absolute;
}
.commerce-cart-pop-view-cart-link {
  display: flex;
  justify-content: flex-end;
}
/* 07. Page Header
--------------------------------------*/
.page-header {
  position: relative;
  width: 100%;
  margin: 0;
  padding: 5em 0 6em ;
  text-align: center;
}

/* 07.1 Page Header -> Breadcrumb
--------------------------------------*/
.breadcrumb {
  position: relative;
  width: 100%;
}
ol.breadcrumb-items {
  margin: 0;
  padding: 0;
  list-style: none;
}
ol.breadcrumb-items li {
  display: inline-block;
}
.breadcrumb-item span {
  margin: 0 10px;
}

/* 07.2 Page Header -> Title
--------------------------------------*/
.page-title {
  padding: 5px 20px;
}

/* 07.3 Page Header -> Highlighted
--------------------------------------*/
.promo-images {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
    -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-align-items: center;
  align-items: center;
  margin-bottom: 1em;
}

/* 08. Homepage
--------------------------------------*/
.homepage h1 {
  display: none;
}
.home-content {
  padding: 20px;
}
.home-content .flex-container {
  align-items: center;
  background-color: #f6f1f0;
  border-left: solid 4px #8a211b;
  padding: 15px 20px;
  position: relative;
}
.home-content .flex-container:after {
  border-left: solid 4px #8a211b !important;
  background: none;
    left: 0;
    content: "";
    display: block;
    height: 0px;
    top: 50%;
    margin: -2.5px 0 0 0;
    position: absolute;
    width: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 4px;
}
.home-content .flex-item1 {
  margin-right: 10px;
  -webkit-box-flex: 1;
}
.home-content .flex-item2 {
  min-width: 89px;
}

/* 08.1 Homepage -> Slider
--------------------------------------*/
/*.flexslider-wrapper {
  background: #d7d7d7;
}*/
.homepage .flexslider {
  background: #d7d7d7;
  margin: 20px 20px 40px 20px;
  border: none;
}
.homepage .flex-control-paging li a.flex-active {
  background: var(--theme-color);
}
.homepage .flex-control-paging li a {
  background: #a5a9b1;
}
.homepage .flex-control-paging li a:hover {
  background: var(--theme-color-two);
}

/*.fraction-slider img {
  transform: scale(1);
  transform-origin: top left;
}*/

/* 09. Node
--------------------------------------*/
.node,
.node-promoted,
.node-sticky,
.node-view-mode-full,
.node-unpublished {
  position: relative;
}

/* 09.1 Node -> Teaser View
--------------------------------------*/
.node-view-mode-teaser {
  position: relative;
  background: var(--content-bg);
  padding: 1em 1em 4em 1em;
  margin-bottom: 4em;
  border-radius: 8px;
}
.node-view-mode-teaser.node-sticky {
  border: 2px solid var(--border-color);
}
.node-view-mode-full .node-taxonomy-container {
  margin: 0;
}

/* 09.2 Node -> Title
--------------------------------------*/
.node-title a {
  position: relative;
  transition: color 0.4s;
}
.node-title a::after {
  position: absolute;
  content: '';
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: var(--theme-color);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.4s;
}
.node-title a:hover::after {
  transform: scaleX(1);
}

/* 09.3 Node -> Submitted Details
--------------------------------------*/
.node-header {
  position: relative;
  display: block;
  background: var(--content-bg);
  border: 1px solid var(--content-border-color);
  border-radius: 30px;
  font-size: 0.8em;
  width: 100%;
  margin: 0 0 1em 0;
  padding: 10px;
}
.author-picture {
  float: left;
}
.author-picture img {
  width: auto;
  height: 25px;
  margin: 0 6px 0 0;
}
.node-submitted-details {
  margin: 0;
  padding: 0;
}
.node-submitted-details i {
  margin: 0 0 0 1em;
  color: var(--theme-color);
}
.node-submitted-details i.user-icon {
  margin-left: 0;
}

/* 09.4 Node -> Taxonomy & Links
--------------------------------------*/
h3.term-title {
  margin: 0;
  font-size: 1.2em;
  line-height: 1;
}
ul.taxonomy-terms {
  padding: 0;
  list-style: none;
  list-style-type: none;
}
/*li.taxonomy-term a {
  padding: 6px 14px;
  border: 1px solid var(--border-color);
  border-radius: 30px;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}
li.taxonomy-term a:hover {
  background: var(--theme-color);
  color: #fff;
}*/
.node-links-container ul.links {
  position: relative;
  margin: 0;
  padding: 0;
  list-style: none;
  list-style-type: none;
}
ul.inline,
ul.links.inline {
  display: inline;
  padding-left: 0;
}
ul.inline li {
  position: relative;
  display: inline-block;
  padding: 0;
  list-style-type: none;
}
ul.inline li a {
  display: inline-block;
}
.node-links-container li {
  float: left;
  margin-right: 1em;
}

/* 09.5 Node -> Read More
--------------------------------------*/
li.node-readmore {
  float: right;
  margin: 0;
}
li.node-readmore a {
  position: relative;
  border: 2px solid var(--theme-color);
  border-radius: 30px;
  padding: 0.4em 0.8em;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}
li.node-readmore a:hover {
  color: var(--theme-color);
  padding: 0.4em 3em 0.4em 0.8em;
}
li.node-readmore a::after {
  content: '';
  position: absolute;
  top: 50%;
  right: 10px;
  height: 2px;
  width: 0;
  background: var(--theme-color);
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}
li.node-readmore a:hover::after {
  width: 2em;
}
.comment-comments a::before,
.comment-add a::before {
  font-family: 'vani';
  color: var(--theme-color-two);
  padding-right: 6px;
}
.comment-comments a::before{
  content: "\e911";
}
.comment-add a::before {
  content: "\e910";
}

/* 09.6 Node -> Pager
--------------------------------------*/
nav.pager {
  position: relative;
  width: 100%;
}
.pager ul.pager__items {
  position: relative;
  margin: 0;
  padding: 1em 0;
  list-style: none;
  list-style-type: none;
}
.pager__items {
  clear: both;
  text-align: center;
}
.pager__item {
  display: inline-block;
  padding: 12px 0;
}
.pager__item a {
  padding: 8px 14px;
  background: var(--content-bg);
  border-radius: 4px;
}
.pager__item a:hover,
.pager__item.is-active a {
  background: var(--theme-color);
  color: #fff;
}

/* 09.7 Node -> Search Page
--------------------------------------*/
/*.views-field-image-hard-link span {
  display: flex;
  width: 100px;
  justify-content: center;
}*/
.view-site-search .views-field-fieldset {
  margin-left: 20px;
}
.view-site-search .flex-container {
  margin-bottom: 20px;
}
.view-site-search img {
  max-width: 100px;
}
.views-field-title {
  font-weight: bold;
}
.view-site-search .views-row {
  border-bottom: 1px solid #d3d7d9;
  padding-bottom: 1em;
  margin-bottom: 0.5em;
}
.view-site-search .views-row-last {
  border-bottom: none;
  padding-bottom: none;
  margin-bottom: 1em;
}
.view-site-search header {
  display: flex;
  justify-content: flex-end;
}

/* 09.8 Node -> Form Items
--------------------------------------*/
/*.form-item {
  margin-bottom: 1em;
}*/
.form-required:after {
  content: "*";
  display: inline-block;
  padding-left: 4px;
  color: red;
}
.form-item label, .field__label {
  font-weight: bold;
}
.field--name-quantity label {
  margin-right: 10px;
}
label.option {
  display: inline;
  font-weight: normal;
}
progress {
  vertical-align: baseline;
}
::-webkit-input-placeholder {
  color: var(--border-color);
}
:-moz-placeholder {
  color: var(--border-color);
}
::-moz-placeholder {
  color: var(--border-color);
  opacity: 1;
}
:-ms-input-placeholder {
  color: var(--border-color);
}
.field--name-body input[type="text"],
.field--name-body input[type="email"],
.field--name-body input[type="url"],
.field--name-body input[type="password"],
.field--name-body input[type="search"],
.field--name-body textarea {
  display: block;
  margin-bottom: 0.8em;
}

/* 09.9 Node -> Composers
--------------------------------------*/
.composer-img img {
  padding-left: 10px;
  max-width: 300px;
}

.view-composers {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
}

.composer-cell {
  display: block;
  padding: 12px;
  border: none;
  text-align: center;
}
.composer-cell .views-field-title {
  padding-top: 10px;
} 
img.composer {
  max-width: 200px;
}

/* 09.10 Node -> Images
--------------------------------------*/
.image-left {
  float: left;
  margin-right: 20px;
}
.image-right {
  float: right;
  margin-left: 20px;
}

/* Image Gallery */
.commerce-product-field-field-image {
	float: left;
}
#imagezoom-thumb-wrapper ul {
	list-style: outside none none;
	margin: 0;
}
#imagezoom-thumb-wrapper li {
	float: left;
	padding-right: 10px;
}

/* 09.12 Node -> Commerce Products
----------------------------------- */
.commerce-product h1 {
  margin: 0;
  font-weight: bold;
}
.commerce-product .item-left {
  width: auto;
  padding-right: 20px;
}
.commerce-product .item-right {
  width: 100%;
}
.commerce-product .item-price {
  display: flex;
  margin-bottom: 10px;
}
.commerce-product .item-price span {
  margin-right: 11px;
}
.commerce-product .form-actions {
  margin-top: 15px;
}
.commerce-product iframe {
  aspect-ratio: 16 / 9;
  width: 100%;
}

/* Product Display Images */
.commerce-product img {
  max-width: 300px;
  padding-left: 0;
  height: auto;
  padding-bottom: 0.5em;
}

/* Add to Cart Button */
.button--add-to-cart, .form-item-outofstock input {
  width: 157px;
  padding: 10px 0;
}

/* 09.13 Node -> Catalog View
----------------------------------- */
.view-sheet-music .views-field-field-image-hard-link img {
  width: 150px;
}
.view-sheet-music .views-field {
  margin-right: 20px;
}
.view-sheet-music .flex-container {
  margin-bottom: 20px;
}
.view-sheet-music .views-label {
  font-weight: bold;
}
.view-sheet-music .views-field-title {
  color: #555;
  font-weight: bold;
  text-transform: uppercase;
  margin-bottom: 0.4em;
}

/* Views Exposed Filter Block */
.views-exposed-form,
.views-exposed-form form,
.views-exposed-form .form-item {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  justify-content: flex-end;
}
.views-exposed-form .form-item {
  margin-left: 1em;
  align-items: baseline;
}
.views-exposed-form .form-item select.form-select {
  width: auto;
  height: 33px;
}
.views-exposed-form .form-item label {
  font-weight: bold;
  padding: 0 10px 0 0;
}
.views-exposed-form .form-item select {
  background-color: #fff;
  border: 1px solid #ccc;
  padding: 4px 4px 4px 0;
}
.views-exposed-form .form-item-items-per-page {
  order: 2;
}

/* 09.14 Node -> Commerce Cart
----------------------------------- */
.cart .view-content {
  display: block;
}
.commerce-order-summary {
  text-align: right;
  font-size: 14px;
  color: var(--text-color);
  margin-bottom: 1em;
}
/*.commerce-order-summary .value {
  font-weight: normal;
}*/
.cart .delete-order-item {
  font-size: 0.8em;
  padding: 1px 6px;
}
.cart tr, .checkout-pane tr {
  background: #eee;
}
.checkout-pane h3 {
  font-size: 14px;
  margin: 0;
}
.cart td .form-item {
  margin: 0;
}
.cart tr {
  height: 44px;
}
.cart .form-actions,
.cart .views-field-total-price__number {
  text-align: right;
}
.cart .order-total-line {
  padding: 0;
  font-size: inherit;
  margin-bottom: 10px;
}
.cart .commerce-order-summary .order-total-lin__total .label,
.cart .commerce-order-summary .order-total-lin__total .value {
  font-weight: bold;
}
.cart input.form-number {
  border: 1px solid var(--border-color);
  box-sizing: border-box;
  height: 33px;
  width: 100%;
  padding: 4px;
}
.cart #edit-submit {
  margin-right: 20px;
}
#edit-sidebar-coupon-redemption-form-code,
.checkout-pane .form-email,
.checkout-pane .organization,
.checkout-pane .address-line1,
.checkout-pane .address-line2,
.checkout-pane .text-full {
	width: 100%;
}
.cart td.views-field-remove-button {
	position: relative;
	width: 40px;
}
.cart td.views-field-remove-button input {
	display: inline-block;
	height: 40px;
	width: 40px;
	padding: 0;
	font-size: 0;
	background-color: inherit;
	border-color: var(--border-color);
	color: var(--text-color);
}
.cart td.views-field-remove-button:after {
	position: absolute;
	left: 20px;
	font-size: 23px;
	line-height: 40px;
	font-family: 'Font Awesome 5 Free';
	content: '\f2ed';
	pointer-events: none;
	transition: color .1s ease-in-out;
	color: var(--theme-color);
}
/*.cart td.views.field-remove-button input:hover {
	border: 1px solid var(--theme-color);
}*/

/* 09.15 Node -> Commerce Checkout
----------------------------------- */
.checkout-progress {
	display: inline-block;
	width: 100%;
	margin: 10px 0 20px;
	padding: 10px 15px;
	background: #f5f6f5;
	box-sizing: border-box;
}
.checkout-progress .checkout-progress--step {
	position: relative;
	padding-right: 50px;
	font-size: 16px;
	line-height: 1.5;
}
.checkout-progress .checkout-progress--step:before {
	display: inline-block;
	height: 25px;
	width: 25px;
	margin-right: 8px;
	border: 1px solid #ccc;
	border-radius: 50%;
	background-color: #fff;
	font-size: 16px;
	font-weight: 300;
	text-align: center;
	content: counter(checkout-progress) "";
}
.layout-region-checkout-main,
.layout-region-checkout-secondary {
  width: 50%;
}
#edit-login-returning-customer-forgot-password {
	margin-left: 10px;
}
.commerce-checkout-flow fieldset {
  background: #ffffff;
  border: 1px solid var(--border-color);
  margin-top: 10px;
  margin-bottom: 32px;
  padding: 0;
  position: relative;
  top: 12px; /* Offsets the negative margin of legends */
  -khtml-border-radius: 0;
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
  border-radius: 0;
}
.commerce-checkout-flow fieldset legend {
  color: #fff;
  background: #555;
  border: 1px solid #555;
  border-bottom: none;
  display: block;
  left: -1px;
  padding: 5px 0;
  position: absolute;
  text-indent: 10px;
  text-shadow: none;
  top: -12px; width: 100%;
  -khtml-border-radius: 0;
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
  border-radius: 0;
}
.commerce-checkout-flow fieldset .fieldset-wrapper {
  padding: 0 10px;
  margin: 34px 0 10px;
}
.commerce-checkout-flow fieldset .fieldset-wrapper  input {
  box-sizing: border-box;
}
/*.commerce-checkout-flow fieldset .fieldset-wrapper  a {
  margin-left: 20px;
}*/
.checkout-pane .fieldset-wrapper label {
  display: block;
}
.checkout-pane .js-form-type-checkbox {
  display: flex;
  align-items: center;
}
.checkout-pane .js-form-type-checkbox input {
  margin-right: 10px;
}
#edit-shipping-information-recalculate-shipping {
	display: none;
}
.form-item-payment-information-billing-information-copy-fields-enable,
.form-item-payment-information-payment-method,
.form-item-shipping-information-shipments-0-shipping-method-0 {
	display: flex;
	align-items: center;
}
.form-item-payment-information-billing-information-copy-fields-enable input,
.form-item-payment-information-payment-method input,
.form-item-shipping-information-shipments-0-shipping-method-0 input {
	margin-right: 10px;
}
.form-item-payment-information-billing-information-copy-fields-enable label,
.form-item-payment-information-payment-method label,
.form-item-shipping-information-shipments-0-shipping-method-0 label {
	padding-top: 1px;
}
.field--label-inline {
	display: flex;
}
.field--label-inline .field__label {
	font-weight: bold;
	margin-right: 10px;
}
.field--name-label {
	font-weight: bold;
}
.paypal-buttons-container + a.link--previous {
	margin-left: 0;
}

/* 10. Footer
----------------------------------- */
#footer-top {
  background-color: #2b323c;
  overflow: hidden;
  padding: 1em 2%;
}
#footer-bottom {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: space-between;
}
#footer h2 {
  color: #a5a9b1;
  border: none;
  font-size: 16px;
  margin: 0;
}
#footer p {
  color: #fff;
  margin-bottom: 0;
  font-size: 12px;
}
#footer a {
  color: #fff;
  font-weight: bold;
}
#footer a:hover {
  color: #C8A9A1;
}
.footer-top-first, .footer-top-second, .footer-top-third {
    float: left;
    margin-right: 3%;
    width: 31.3%;
}
.footer-top-third {
  margin-right: 0;
}
.footer-top-second img {
  margin-top: 5px;
  width: 70px;
}

#footer-bottom {
  background-color: #3b4252;
  clear: both;
  color: #999;
  font-size: 12px;
  padding: 1em 2%;
}

/* 10. Footer -> Scroll To Top
----------------------------------- */
.scrolltop {
  position: fixed;
  display: none;
  left: 10px;
  bottom: 10px;
  width: 50px;
  height: 50px;
  line-height: 42px;
  border-radius: 50%;
  background: var(--theme-color);
  color: #fff;
  font-size: 20px;
  z-index: 20;
  cursor: pointer;
  text-align: center;
  padding: 4px;
}
.scrolltop-icon {
  border-radius: 50%;
  -webkit-transition: background 0.3s ease;
  transition: background 0.3s ease;
}
.scrolltop:hover {
  background: var(--theme-color-two);
}

/* 11. Social Icons
----------------------------------- */
ul.social-icons {
  margin: 0;
  padding: 0;
  list-style: none;
}
.social-icons li {
  display: inline-block;
  margin: 0 0 6px 6px;
  padding: 0;
  border: 0;
}
.social-icons li a {
  width: 44px;
  height: 44px;
  line-height: 42px;
  text-align: center;
  padding: 0;
  border: 1px solid var(--theme-color);
  transition: all 0.3s ease-in-out;
}
.social-icons li a:hover {
  border: 1px solid var(--footer-color);
  border-radius: 6px;
}

/* 12. Block
----------------------------------- */
.block,
.block-title,
.block-content {
  position: relative;
}
/*.block-section .block-title {
  margin-bottom: 0.7em;
}
.block-section .block-title::before {
  bottom: 0;
  width: 30px;
}
.block-section .block-title::after {
  bottom: -6px;
  width: 45px;
}
*/
/* 12.1 Block -> Highlighted Region
----------------------------------- */
.highlighted {
  position: relative;
  background: var(--content-bg);
  width: 100%;
  padding: 0;
}
.region-highlighted {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.highlighted .block {
  position: relative;
  margin: 0;
}
.highlighted p:last-child {
  margin: 0;
}

/* 12.2 Block -> Content
----------------------------------- */
.content-top,
.content-bottom {
  width: 100%;
}
.region-content-top,
.region-content-bottom {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.content-top .block,
.content-bottom .block {
  position: relative;
  margin: 0;
}
.content-top .block {
  padding-bottom: 2em;
}
.content-bottom .block {
  padding: 1.5em 0;
}
/*.block-content h1 {
  margin-top: 0;
}*/

/* 12.3 Block -> Search Contact
----------------------------------- */
.search-results {
	background: #619DD4;
	color: #fff;
	padding: 5px 10px;
	margin-bottom: 20px;
}
.search-results a {
	color: #fff;
	font-weight: bold;
	font-variant-caps: all;
}
.search-results p {
	margin-bottom: 5px;
}
/* 13. Comments
--------------------------------------*/
#node-comment {
  position: relative;
  margin: 0;
  border-top: 1px solid var(--border-color);
}
#node-comment i {
  color: var(--theme-color);
}
.comments-title i {
  font-size: 1em;
}

/* 13.1 Comments -> Form
--------------------------------------*/
.comment-form-wrap {
  position: relative;
  margin: 2em 0 1em 0;
}
.add-comment-title {
  margin: 0;
}
.add-comment-title i {
  font-size: 1em;
}
.comment-form label {
  display: block;
}

/* 13.2 Comments -> Single
--------------------------------------*/
.single-comment {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  margin-bottom: 1em;
  padding: 10px 0;
  background: var(--content-bg);
}
.comment-user-picture {
  position: relative;
  padding: 0 4px;
  border-right: 1px solid var(--border-color);
  text-align: center;
  -webkit-box-flex: 0;
  -ms-flex: 0 0 60px;
  flex: 0 0 60px;
}
.comment-user-picture img {
  max-width: 100px;
  height: auto;
}
h3.single-comment-title {
  margin: 0.1em 0;
  font-size: 1.2em;
}
.single-comment-meta {
  width: 100%;
  margin-bottom: 6px;
  padding-bottom: 6px;
  font-size: 0.9em;
  border-bottom: 1px solid var(--border-color);
}
.single-comment-content-body {
  position: relative;
  padding: 0 10px;
  -webkit-box-flex: 1;
  -ms-flex: 1 1;
  flex: 1 1;
}
#node-comment .indented {
  margin-left: 4em;
}
.comment-delete,
.comment-edit {
  margin-right: 0.8em;
}
.comment-reply a,
.comment-delete a,
.comment-edit a {
  padding: 4px 16px;
  color: #fff;
  background: var(--theme-color);
  border-radius: 30px;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}
.comment-reply a:hover,
.comment-delete a:hover,
.comment-edit a:hover {
  background: var(--theme-color-two);
  color: #fff;
}

/* 14. Shortcodes
-------------------------------------------*/

/* 14.1 Shortcodes -> Text Align
-------------------------------------------*/
.text-left {
  text-align: left;
}
.text-right {
  text-align: right;
}
.text-center {
  text-align: center;
}
.center {
  margin: 0 auto;
}
.hidden {
  display: none;
}

/* 14.2 Shortcodes -> Text Size
-------------------------------------------*/
.size-2x {
  font-size: 2em;
}
.size-3x {
  font-size: 3em;
}
.size-4x {
  font-size: 4em;
}
.size-5x {
  font-size: 5em;
}
.size-6x {
  font-size: 6em;
}

/* 14.3 Shortcodes -> Container Width
-------------------------------------------*/
.width30,
.width40,
.width50,
.width60,
.width70,
.width80,
.width90 {
  width: 100%;
  clear: both;
  display: block;
}

/* 14.4 Shortcodes -> Empty Space
-------------------------------------------*/
.empty {
  position: relative;
  width: 100%;
  height: 2em;
  clear: both;
}

/* 14.5 Shortcodes -> Colour
-------------------------------------------*/
.theme-color {
  color: var(--theme-color);
}

/* 15. Button
-------------------------------------------*/
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 0;
}
button, .button,
input[type="submit"],
input[type="reset"],
input[name="outofstock"],
input[name="outofstock"]:hover,
input[type="button"] {
  background: var(--theme-color);
  border: none;
  border-radius: 0px;
  color: #fff;
  position: relative;
  font-weight: bold;
  padding: 11px 16px 10px;
  font-size: 13px;
}
button:hover, .button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover {
  background: #902b26;
  color: #e0cec9;
  cursor: pointer;
  text-decoration: none;
}
.form-item-outofstock input {
  background: var(--border-color);
}
a.link--previous {
  line-height: normal;
  margin-left: 20px;
}
.button-link,
a.button-link {
  display: inline-block;
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  color: #ffffff;
  background: var(--theme-color);
  border: 2px solid var(--theme-color);
  border-radius: 50px;
  padding: 9px 22px;
  transition: 0.3s ease-in-out;
}
.button-link:hover,
a.button-link:hover {
  color: var(--theme-color);
  background: transparent;
}
/* 16. Services
-------------------------------------------*/
.service {
  background: #ffffff;
  padding: 1em;
  border-radius: 0;
  box-shadow: 0 0 20px #cacbda;
  transition: all 0.5s ease-in-out;
}
.service:hover {
  border-radius: 30px 0;
  transform: translateY(-1em);
}
.service-icon {
  margin-bottom: 1em;
}
.service-icon img {
  max-height: 50px;
  width: auto;
}
.service-icon i {
  font-size: 3em;
  color: var(--theme-color);
}

.service .button-link,
.service a.button-link {
  color: var(--theme-color);
  background: transparent;
  border: 2px solid var(--theme-color);
}
.service .button-link:hover,
.service a.button-link:hover {
  color: #ffffff;
  background: var(--theme-color);
}
/* 17. Features
-------------------------------------------*/
.feature {
  background: #ffffff;
  padding: 1em;
  box-shadow: 0 0 10px #cacbda;
  transition: all 0.5s ease-in-out;
  text-align: center;
}
.feature-icon {
  margin-bottom: 1em;
}
.feature-icon img {
  max-height: 50px;
  width: auto;
}
.feature-icon i {
  font-size: 3em;
  color: var(--bold-color);
}
.feature:hover {
  background: var(--theme-color);
  color: #ffffff;
  transform: translateY(-10px);
}
.feature .button-link:hover,
.feature a.button-link:hover {
  border: 2px solid #ffffff;
}

/* 18. Animation
-------------------------------------------- */
@-webkit-keyframes slideUp {
  0% {
    -webkit-transform: translateY(20px);
            transform: translateY(20px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
    opacity: 1;
  }
}
@keyframes slideUp {
  0% {
    -webkit-transform: translateY(20px);
            transform: translateY(20px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
    opacity: 1;
  }
}
@-webkit-keyframes bounceIn {
  from,
  20%,
  40%,
  60%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
    transform: scale3d(0.97, 0.97, 0.97);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
@keyframes bounceIn {
  from,
  20%,
  40%,
  60%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
    transform: scale3d(0.97, 0.97, 0.97);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.bounceIn {
  -webkit-animation-duration: 0.75s;
  animation-duration: 0.75s;
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
@-webkit-keyframes fadeOutLeft {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

@keyframes fadeOutLeft {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}
.fadeOutLeft {
  -webkit-animation-name: fadeOutLeft;
  animation-name: fadeOutLeft;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

/* 19. Admin
--------------------------------------*/

/* 19.1 Admin -> Drupal Core
----------------------------------- */
/* 19.1.1 Admin Toolbar */
button.toolbar-item,
button.toolbar-icon {
  background: none;
}

/* 19.1.2 Filter Module */
.filter-wrapper {
  border: 1px solid var(--border-color);
}
/*.container {
  position: relative;
  width: 100%;
  max-width: 575px;
  margin: 0 auto;
  padding: 0 10px;
}
*/
/* 19.2 Admin -> Admin Tabs
--------------------------------------*/
ul.page-tabs {
  margin: 0.6em 0;
  padding: 0 0 1px 0;
  border-bottom: 1px solid var(--border-color);
  list-style: none;
}
.page-tabs li {
  display: inline-block;
  padding: 0;
}
.page-tabs li a {
  padding: 4px 10px;
  background: var(--border-color);
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.page-tabs li.active-page-tab a,
.page-tabs li a:hover {
  color: #fff;
  background: var(--theme-color);
}

/* 19.3 Admin -> System Message
--------------------------------------*/
.messages {
  margin: 9px;
  padding: 15px 20px 15px 35px;
  word-wrap: break-word;
  border: 1px solid;
  border-width: 1px 1px 1px 0;
  border-radius: 2px;
  background: no-repeat 10px 17px;
  overflow-wrap: break-word;
}
.messages + .messages {
  margin-top: 1.538em;
}
.messages__list {
  margin: 0;
  padding: 0;
  list-style: none;
}
.messages p {
  margin: 0;
}
.messages a,
.messages a:visited {
  color: #1982d1;
  text-decoration: underline;
}
.messages em {
  color: var(--bold-color);
}
.messages--status {
  color: #325e1c;
  border-color: #c9e1bd #c9e1bd #c9e1bd transparent;
  background-color: #f3faef;
  background-image: url(/core/misc/icons/73b355/check.svg);
  box-shadow: -8px 0 0 #77b259; /* LTR */
}
.messages--warning {
  color: #734c00;
  border-color: #f4daa6 #f4daa6 #f4daa6 transparent;
  background-color: #fdf8ed;
  background-image: url(/core/misc/icons/e29700/warning.svg);
  box-shadow: -8px 0 0 #e09600; /* LTR */
}
.messages--error {
  color: #a51b00;
  border-color: #f9c9bf #f9c9bf #f9c9bf transparent;
  background-color: #fcf4f2;
  background-image: url(/core/misc/icons/e32700/error.svg);
  box-shadow: -8px 0 0 #e62600; /* LTR */
}
.messages--error p.error {
  color: #a51b00;
}

/* 20. Clearing
--------------------------------------*/
.clear {
	position: relative;
}
.clear::before,
.clear::after,
.row::before,
.row::after,
.section::before,
.section::after {
  content: '';
  display: table;
  clear: both;
}