#op-panel,
#op-panel-btn {
  background-color: #ffffff;
}

#op-panel {
  display: none;

  z-index: 95;

  position: fixed;

  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.12), 0 1px 4px rgba(0, 0, 0, 0.24);
}

#op-panel-btn {
  top: 0;

  right: -58px;

  width: 58px;

  height: 58px;

  cursor: pointer;

  position: absolute;

  -webkit-border-radius: 0 2px 2px 0;

  -moz-border-radius: 0 2px 2px 0;

  border-radius: 0 2px 2px 0;

  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.12), 0 1px 4px rgba(0, 0, 0, 0.24);
}

#op-panel-btn:before {
  content: "";

  width: 5px;

  height: 100%;

  background: #fff;

  left: -5px;

  top: 0;

  position: absolute;
}

#op-panel-btn .rsicon {
  color: #3d4451;

  font-size: 25px;

  line-height: 58px;

  text-align: center;

  width: 100%;

  height: 100%;

  display: block;
}

@media (max-width: 767px) {
  #op-panel-btn {
    right: -35px;

    width: 35px;

    height: 35px;
  }

  #op-panel-btn .rsicon {
    font-size: 20px;

    line-height: 35px;
  }
}

.op-content {
  height: 100%;

  padding: 25px;

  position: relative;

  overflow-y: auto;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  box-sizing: border-box;
}

.op-content hr {
  margin: 0;

  background-color: #bfbfbf !important;
}

.op-section {
  margin-bottom: 30px;
}

.op-section:last-child {
  margin-bottom: 0px;
}

.op-theme-colors button {
  width: 42px;

  height: 42px;

  margin: 3px;

  padding: 0;

  border: 0;

  cursor: pointer;

  display: inline-block;

  position: relative;

  -webkit-border-radius: 50%;

  -moz-border-radius: 50%;

  border-radius: 50%;
}

.op-theme-colors button .rsicon {
  color: #fff;

  font-size: 20px;

  text-align: center;

  line-height: 30px;

  width: 30px;

  height: 30px;

  display: block;

  position: absolute;

  left: 50%;

  top: 50%;

  margin-left: -15px;

  margin-top: -15px;

  background-color: rgba(0, 0, 0, 0.1);

  -webkit-border-radius: 50%;

  -moz-border-radius: 50%;

  border-radius: 50%;

  -webkit-transition: all 0.3s ease-in-out;

  -moz-transition: all 0.3s ease-in-out;

  transition: all 0.3s ease-in-out;

  -webkit-transform: scale(0);

  -moz-transform: scale(0);

  transform: scale(0);
}

.op-theme-colors button.active .rsicon {
  -webkit-transform: scale(1);

  -moz-transform: scale(1);

  transform: scale(1);
}

.no-csstransforms .op-theme-colors button .rsicon {
  display: none;
}

.op-btn-group:before,
.op-btn-group:after {
  content: "";

  display: table;
}

.op-btn-group:after {
  clear: both;
}

.op-btn-group {
  position: relative;
}

.op-btn-group .op-btn {
  color: #3c4451;

  font-size: 13px;

  line-height: 1;

  font-weight: 600;

  font-family: "Open Sans", sans-serif;

  text-transform: uppercase;

  text-align: center;

  vertical-align: middle;

  cursor: pointer;

  border: 0;

  margin: 0;

  padding: 15px 10px;

  background-color: transparent;

  display: block;

  float: left;

  width: 50%;
}

.op-btn-group .op-btn-bar {
  left: 0;

  bottom: 0;

  width: 100%;

  height: 1px;

  position: absolute;

  background-color: #c5c6ca;
}

.op-btn-group .op-btn-bar-line {
  top: -2px;

  left: 0;

  position: absolute;

  height: 5px;

  background-color: #3d4351;

  width: 100px;

  -webkit-border-radius: 5px;

  -moz-border-radius: 5px;

  border-radius: 5px;

  -webkit-transition: all 1s cubic-bezier(0.23, 1, 0.32, 1) 0ms;

  -moz-transition: all 1s cubic-bezier(0.23, 1, 0.32, 1) 0ms;

  transition: all 1s cubic-bezier(0.23, 1, 0.32, 1) 0ms;
}

.op-btn-check {
  border: 0;

  margin: 0;

  display: block;

  padding: 0 0 0 35px;

  position: relative;

  background: transparent;

  text-align: left;

  color: #3c4451;

  font-size: 13px;

  line-height: 1;

  font-weight: 600;

  font-family: "Open Sans", sans-serif;

  text-transform: uppercase;
}

.op-btn-check .op-check {
  top: 0;

  left: 0;

  width: 25px;

  height: 25px;

  position: absolute;

  border: 2px solid #c5c6ca;

  -webkit-border-radius: 2px;

  -moz-border-radius: 2px;

  border-radius: 2px;
}

.op-btn-check .op-check .rsicon {
  width: 100%;

  height: 100%;

  color: #3d4351;

  display: block;

  font-size: 21px;

  text-align: center;

  opacity: 0;

  visibility: hidden;

  -webkit-transform: rotate(45deg);

  -moz-transform: rotate(45deg);

  transform: rotate(45deg);

  -webkit-transition: all 0.2s ease-in-out;

  -moz-transition: all 0.2s ease-in-out;

  transition: all 0.2s ease-in-out;
}

.op-btn-check.active .op-check .rsicon {
  opacity: 1;

  visibility: visible;

  -webkit-transform: rotate(0deg);

  -moz-transform: rotate(0deg);

  transform: rotate(0deg);
}

.op-theme-colors [data-color="e83b35"] {
  background-color: #e83b35;
}

.op-theme-colors [data-color="e8676b"] {
  background-color: #e8676b;
}

.op-theme-colors [data-color="ec407a"] {
  background-color: #ec407a;
}

.op-theme-colors [data-color="8e45ae"] {
  background-color: #8e45ae;
}

.op-theme-colors [data-color="673bb7"] {
  background-color: #673bb7;
}

.op-theme-colors [data-color="3f51b5"] {
  background-color: #3f51b5;
}

.op-theme-colors [data-color="5d6cc1"] {
  background-color: #5d6cc1;
}

.op-theme-colors [data-color="1a77d4"] {
  background-color: #1a77d4;
}

.op-theme-colors [data-color="07aaf5"] {
  background-color: #07aaf5;
}

.op-theme-colors [data-color="56c8d2"] {
  background-color: #56c8d2;
}

.op-theme-colors [data-color="27a79a"] {
  background-color: #27a79a;
}

.op-theme-colors [data-color="07cb79"] {
  background-color: #07cb79;
}

.op-theme-colors [data-color="8dc24c"] {
  background-color: #8dc24c;
}

.op-theme-colors [data-color="ffde03"] {
  background-color: #ffde03;
}

.op-theme-colors [data-color="fec107"] {
  background-color: #fec107;
}

.op-theme-colors [data-color="ff9801"] {
  background-color: #ff9801;
}

.op-theme-colors [data-color="d1a3a6"] {
  background-color: #d1a3a6;
}

.op-theme-colors [data-color="ffcfd3"] {
  background-color: #ffcfd3;
}

.op-theme-colors [data-color="fbbdd4"] {
  background-color: #fbbdd4;
}

.op-theme-colors [data-color="e2bfe7"] {
  background-color: #e2bfe7;
}

.op-theme-colors [data-color="c7ccea"] {
  background-color: #c7ccea;
}

.op-theme-colors [data-color="83d5fb"] {
  background-color: #83d5fb;
}

.op-theme-colors [data-color="b4e1dc"] {
  background-color: #b4e1dc;
}

.op-theme-colors [data-color="a7d9a8"] {
  background-color: #a7d9a8;
}