.brk-theme-options {
  position: fixed;
  top: 0;
  right: 0;
  width: 100%;
  max-width: 380px;
  transform: translateX(100%);
  height: 100vh;
  z-index: 100;
  transition: all .3s ease-in-out;
  border-top: 3px solid var(--brand-primary);
  box-shadow: 0 6px 30px 0 rgba(0, 0, 0, 0.12);
  /* accordion */ }
  [dir="rtl"] .brk-theme-options {
    right: auto;
    left: 0;
    transform: translateX(-100%); }
  .brk-theme-options.active {
    transform: translateX(0);
    z-index: 999; }
  .brk-theme-options__panel {
    position: absolute;
    top: 165px;
    left: -52px;
    background-color: rgba(0, 0, 0, 0.2);
    box-shadow: -5.985px -0.419px 30px 0 rgba(0, 0, 0, 0.08), inset -2px 0 10px 0 rgba(0, 0, 0, 0.04);
    width: 52px;
    height: auto;
    z-index: 108;
    padding: 0 0 17px;
    border-radius: 13px 0 0 13px; }
    @media (max-width: 575px) {
      .brk-theme-options__panel {
        left: -38px;
        width: 38px;
        border-radius: 9px 0 0 9px; } }
    [dir="rtl"] .brk-theme-options__panel {
      left: auto;
      right: -52px;
      border-radius: 0 13px 13px 0; }
    .brk-theme-options__panel-link {
      display: block;
      text-align: center;
      color: #fff;
      font-size: 1.125rem;
      padding: 10px 0;
      transition: all .5s ease-in-out; }
      @media (max-width: 575px) {
        .brk-theme-options__panel-link {
          padding: 8px 0; } }
      .brk-theme-options__panel-link.panel-open {
        color: #fff;
        border-bottom: 1px solid rgba(255, 255, 255, 0.2);
        padding: 20px 0 15px;
        margin-bottom: 10px;
        /*&.checked,
				&:hover {
					i {
						animation: eye 3s linear infinite;

						@keyframes eye {
							from {
								transform: rotate(0);
							}
							to {
								transform: rotate(360deg);
							}
						}
					}
				}*/
        /*&:hover,
				&.checked {
					color: var(--brk-base-5);
				}*/ }
        @media (max-width: 575px) {
          .brk-theme-options__panel-link.panel-open {
            padding: 16px 0 10px; } }
      .brk-theme-options__panel-link:hover {
        color: #fff; }
      .brk-theme-options__panel-link:focus {
        color: #fff; }
  .brk-theme-options__control {
    overflow-y: auto;
    overflow-x: hidden;
    background-color: #fff;
    position: relative;
    width: 100%;
    height: 100%; }
  .brk-theme-options__header {
    line-height: 72px; }
  .brk-theme-options__close {
    background-color: #F9F9F9;
    box-shadow: inset 1.782px 0.908px 10px 0 rgba(0, 0, 0, 0.04);
    position: absolute;
    top: 0;
    right: 0;
    width: 71px;
    height: 72px;
    z-index: 15;
    cursor: pointer; }
    .brk-theme-options__close:before, .brk-theme-options__close:after {
      content: '';
      position: absolute;
      top: 50%;
      left: 50%;
      width: 14px;
      height: 2px;
      transform-origin: center center;
      background-color: var(--brand-primary);
      transition: width .3s; }
    .brk-theme-options__close:before {
      transform: translate(-50%, -50%) rotate(45deg); }
    .brk-theme-options__close:after {
      transform: translate(-50%, -50%) rotate(-45deg); }
    [dir="rtl"] .brk-theme-options__close {
      right: auto;
      left: 0; }
    .brk-theme-options__close:hover:before, .brk-theme-options__close:hover:after {
      width: 16px; }
  .brk-theme-options .card-block {
    padding: 30px 30px 40px; }
  .brk-theme-options .row {
    margin: -5px; }
  .brk-theme-options .col,
  .brk-theme-options [class*="col-"] {
    padding: 5px; }
  .brk-theme-options__check {
    position: relative;
    background: #808080 no-repeat center center;
    background-size: cover; }
    .brk-theme-options__check_active {
      box-shadow: -5.985px -0.419px 30px 0px rgba(0, 0, 0, 0.12); }
    .brk-theme-options__check_120 {
      height: 120px;
      transition: all .3s ease-in-out; }
      .brk-theme-options__check_120:hover {
        transform: translateY(-7px) scale(1.03);
        box-shadow: 0 6px 15px 0 rgba(50, 50, 50, 0.3); }
    .brk-theme-options__check_60 {
      height: 60px;
      transition: all .3s ease-in-out; }
      .brk-theme-options__check_60:hover {
        transform: translateY(-5px) scale(1.03);
        box-shadow: 0 6px 15px 0 rgba(50, 50, 50, 0.3); }
    .brk-theme-options__check_45 {
      height: 45px; }
    .brk-theme-options__check-title {
      position: absolute;
      z-index: 3;
      top: 50%;
      left: 10px;
      transform: translateY(-50%);
      color: #ffffff;
      font-size: 0.875rem; }
  .brk-theme-options__more {
    display: flex;
    justify-content: center;
    width: 100%;
    color: var(--brand-primary);
    padding: 19px 0; }
    .brk-theme-options__more .brk-options-more {
      cursor: pointer;
      text-transform: uppercase;
      font-size: 0.875rem;
      line-height: 25px;
      border-bottom: 1px dashed var(--brand-primary); }
      .brk-theme-options__more .brk-options-more i {
        margin-right: 8px;
        margin-top: -1px; }
  .brk-theme-options__before {
    position: absolute;
    top: -1px;
    right: 0;
    bottom: -1px;
    left: 0;
    border: 3px solid #fff;
    background-color: rgba(var(--brand-primary-rgb), 0.9);
    display: none;
    z-index: 1; }
    .brk-theme-options__check_active .brk-theme-options__before {
      display: block; }
    .brk-theme-options__before i {
      position: absolute;
      vertical-align: 0;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      color: #fff;
      font-size: 0.8125rem; }
      .brk-theme-options__check_title-on .brk-theme-options__before i {
        left: auto;
        right: 10px;
        transform: translateY(-50%); }
  .brk-theme-options__color {
    padding: 10px 0; }
    .brk-theme-options__color-row {
      display: flex;
      flex-wrap: wrap;
      margin: 0 -5px; }
    .brk-theme-options__color-radio {
      position: relative;
      width: 32px;
      height: 32px;
      box-shadow: inset 0 0 0 1px #ececec;
      cursor: pointer;
      border-radius: 5px;
      overflow: hidden;
      margin: 6px 5px;
      --oc: #8d8d8d; }
      .brk-theme-options__color-radio:before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(60deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.6) 100%);
        z-index: 9; }
      .brk-theme-options__color-radio span {
        position: absolute;
        display: block;
        top: 3px;
        right: 3px;
        bottom: 3px;
        left: 3px;
        transition: all .3s ease-in-out;
        background-color: var(--oc); }
      .brk-theme-options__color-radio i {
        display: none;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        color: #fff;
        font-size: 0.875rem;
        vertical-align: 0; }
      .brk-theme-options__color-radio:hover span {
        top: 0;
        right: 0;
        bottom: 0;
        left: 0; }
      .brk-theme-options__color-radio.checked span {
        top: 0;
        right: 0;
        bottom: 0;
        left: 0; }
      .brk-theme-options__color-radio.checked i {
        display: block; }
  .brk-theme-options .accordion-slider-min .card-toggle-icon .before {
    transform: translate(-50%, -50%) rotate(0) !important; }
  .brk-theme-options .accordion-slider-min .card-toggle-icon .after {
    transform: translate(-50%, -50%) rotate(0) !important; }
  .brk-theme-options .accordion-slider-min .card-header {
    height: 60px; }
    .brk-theme-options .accordion-slider-min .card-header h5 {
      font-size: 1.0625rem !important;
      line-height: 17px !important; }
    .brk-theme-options .accordion-slider-min .card-header:not(.collapsed) .before {
      transform: translate(-50%, -50%) rotate(90deg) !important; }
    .brk-theme-options .accordion-slider-min .card-header:not(.collapsed) .after {
      transform: translate(-50%, -50%) rotate(180deg) !important; }
  .brk-theme-options .accordion .card-header {
    min-height: 60px; }
