/*font improt*/
@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,700');
.is-pattern {
  background-attachment: fixed;
  background-color: #fff !important;
  background-position: center;
  background-repeat: repeat;
}
.is-bg-image {
  background-attachment: fixed;
  background-color: #fff !important;
  background-position: center;
  background-repeat: no-repeat;
  background-size: : cover;
}
.s-customizer {
  background-color: #fff;
  box-shadow: -3px 0 10px -2px rgba(0, 0, 0, 0.15);
  display: block;
  font-family: 'Open Sans', sans-serif;
  height: 100%;
  position: fixed;
  right: auto;
  left: -325px;
  top: 0;
  transition: ease-in-out 0.35s;
  width: 325px;
  z-index: 1000000000000;
}
.s-customizer.active {
  left: 0;
}
.s-customizer h3 {
  color: #343434 !important;
  font-family: 'Open Sans', sans-serif;
  font-size: 20px;
  font-weight: 700;
  margin: 25px 0 0 0;
}
.s-customizer p {
  margin-bottom: 15px;
}
.s-customizer p, .s-customizer li {
  color: #5f5f5f !important;
  font-family: 'Open Sans', sans-serif;
  font-weight: 400;
}
.s-customizer-header {
  background-color: #fff;
  border-bottom: 1px solid #dddd;
  padding: 15px 35px;
  text-align: center;
}
.s-customizer-toggle-btn {
  background-color: #fff;
  border: 1px solid #ddd;
  color: #343434 !important;
  font-size: 24px;
  height: 45px;
  line-height: 45px;
  position: absolute;
  right: -45px;
  text-align: center;
  top: 80px;
  width: 45px;
}
.s-customizer-content {
  height: 100%;
  overflow-y: auto;
  padding: 15px 35px 100px 35px;
  position: relative;
  top: 0;
  z-index: -1;
}
.s-customizer-content::-webkit-scrollbar {
  margin-top: 15px;
  margin-right: -10px;
  width: 8px;
  z-index: 3;
}
.s-customizer-content::-webkit-scrollbar * {
  background:transparent;
  margin-right: -10px;
}
.s-customizer-content::-webkit-scrollbar-track {
  display: none;
}
.s-customizer-content::-webkit-scrollbar-thumb {
  background-color: #dfdfdf !important;
  border-radius: 6px;
  margin-right: -10px;
}
.s-customizer-ul {
  padding-left: 0;
  text-align: left;
}
.s-customizer-ul li {
  border: 1px solid #d4d4d4;
  cursor: pointer;
  overflow: hidden;
  display: inline-block;
  height: 35px;
  line-height: 35px;
  margin: 2px;
  text-align: center;
  width: 22%;
}
.s-customizer-ul.layout li {
  width: 46%;
}
.resetAll.s-customizer-ul {
  margin: 25px 0;
}
.resetAll.s-customizer-ul li {
  font-weight: 700;
  width: 100%;
}
.s-customizer-ul li a {
  display: block;
}
.skin-green {
  background-color: #95c41f;
}
.skin-amber {
  background-color: #ff1744;
}
.skin-blue-grey {
  background-color: #607d8b;
}
.skin-cyan {
  background-color: #1a237e;
}
.skin-orenge {
  background-color: #006064;
}
.skin-pink {
  background-color: #006400;
}
.skin-purple {
  background-color: #4caf50;
}
.skin-teal {
  background-color: #ffffff;
}
.theme-light {
  background-color: #f5f5f5;
}
.theme-dark {
  background-color: #121212;
}
.button.button-reset {
  background-color: #f25050;
  color: #fff !important;
}
.button.button-reset:hover {
  background-color: #e05050;
}

/*responsive design*/
@media only screen and (max-width: 480px){
  .s-customizer {
	width: 90%;
	left: -90%;
  }
  .s-customizer-toggle-btn {
	right: -35px;
	top: 87px;
	width: 35px;
	height: 35px;
	font-size: 20px;
	line-height: 35px;
  }
  .s-customizer.active .s-customizer-toggle-btn {
	right: -15px;
  }
  .s-customizer-ul li {
	width: 30%;
  }
}