/*==================================================
[common]

#060708 - loader overlay

rgba(1, 1, 1, 0.5) - grid overlay
rgba(1, 1, 1, 0.3) - grid overlay hover
rgba(1, 1, 1, 0.3) - color overlay hover
==================================================*/
/* loader overlay */
.overlay1 {
  background-color: #060708;
}
.overlay2 {
  background-color: #060708;
}
.overlay3 {
  background-color: #060708;
}
/* grid overlay */
.grid-overlay {
  background-color: rgba(1, 1, 1, 0.6);
}
.grid-in .grid-outer:hover .grid-overlay,
.is-mobile .grid-overlay {
  background-color: rgba(1, 1, 1, 0.4);
}
/* content overlay */
.content-outer:before {
  background-color: rgba(1, 1, 1, 0.6);
}
/* color grid overlay */
.color-overlay .grid-overlay {
  background-color: rgba(29, 30, 40, 0.5);
}
.color-overlay.grid-in .grid-outer:hover .grid-overlay {
  background-color: rgba(29, 30, 40, 0.3);
}
/* color content overlay */
.color-overlay .content-outer:before {
  background-color: rgba(29, 30, 40, 0.5);
}

/*==================================================
[brown]

#9E7A42 - main color
158, 122, 66 -  fade color
==================================================*/
/* base color */
.brown .color {
  color: #9E7A42;
}
/* link color */
.brown a:hover {
  color: #9E7A42;
}
/* base button */
.brown .btn-theme {
  background-color: #9E7A42;
  border-color: #9E7A42;
}
.brown .btn-theme:active,
.brown .btn-theme.active,
.brown .btn-theme:focus,
.brown .btn-theme.focus,
.brown .btn-theme:hover {
  background-color: rgba(158, 122, 66, 0.85);
  border-color: rgba(158, 122, 66, 0.85);
}
/* square border color */
.brown .grid-heading:before {
  border-color: rgba(158, 122, 66, 0.5);
}
/* grid title */
.brown .grid-title {
  color: #9E7A42;
}
/* pogress bar */
.brown .progress {
  border-color: rgba(158, 122, 66, 0.85);
  background-color: rgba(158, 122, 66, 0.3);
}
.brown .progress-bar {
  background-color: #9E7A42;
}
/* contact form */
.brown #contact-form .col-md-12:before {
  background-color: #9E7A42;
}
/* subscribe form */
.brown #subscribe-form .input:before {
  background-color: #9E7A42;
}
/* slider button */
.brown .prev-icon:hover {
  color: #9E7A42;
}
.brown .next-icon:hover {
  color: #9E7A42;
}
/*==================================================
[blue]

#00D2E4 - main color
0, 210, 228 - fade color
==================================================*/
/* base color */
.blue .color {
  color: #00D2E4;
}
/* link color */
.blue a:hover {
  color: #00D2E4;
}
/* base button */
.blue .btn-theme {
  color: #ffffff;
  background-color: #00D2E4;
  border-color: #00D2E4;
}
.blue .btn-theme:active,
.blue .btn-theme.active,
.blue .btn-theme:focus,
.blue .btn-theme.focus,
.blue .btn-theme:hover {
  color: #ffffff;
  background-color: rgba(0, 210, 228, 0.85);
  border-color: rgba(0, 210, 228, 0.85);
}
/* square border color */
.blue .grid-heading:before {
  border-color: rgba(0, 210, 228, 0.5);
}
/* grid title */
.blue .grid-title {
  color: #00D2E4;
}
/* pogress bar */
.blue .progress {
  border-color: rgba(0, 210, 228, 0.85);
  background-color: rgba(0, 210, 228, 0.3);
}
.blue .progress-bar {
  background-color: #00D2E4;
}
/* contact form */
.blue #contact-form .col-md-12:before {
  background-color: #00D2E4;
}
/* subscribe form */
.blue #subscribe-form .input:before {
  background-color: #00D2E4;
}
/* slider button */
.blue .prev-icon:hover {
  color: #00D2E4;
}
.blue .next-icon:hover {
  color: #00D2E4;
}
/*==================================================
[green]

#4CFFB4 - main color
76, 255, 180 - fade color
==================================================*/
/* base color */
.green .color {
  color: #4CFFB4;
}
/* link color */
.green a:hover {
  color: #4CFFB4;
}
/* base button */
.green .btn-theme {
  color: #ffffff;
  background-color: #4CFFB4;
  border-color: #4CFFB4;
}
.green .btn-theme:active,
.green .btn-theme.active,
.green .btn-theme:focus,
.green .btn-theme.focus,
.green .btn-theme:hover {
  color: #ffffff;
  background-color: rgba(76, 255, 180, 0.85);
  border-color: rgba(76, 255, 180, 0.85);
}
/* square border color */
.green .grid-heading:before {
  border-color: rgba(76, 255, 180, 0.5);
}
/* grid title */
.green .grid-title {
  color: #4CFFB4;
}
 /* pogress bar */
.green .progress {
  border-color: rgba(76, 255, 180, 0.85);
  background-color: rgba(76, 255, 180, 0.3);
}
.green .progress-bar {
  background-color: #4CFFB4;
}
/* contact form */
.green #contact-form .col-md-12:before {
  background-color: #4CFFB4;
}
/* subscribe form */
.green #subscribe-form .input:before {
  background-color: #4CFFB4;
}
/* slider button */
.green .prev-icon:hover {
  color: #4CFFB4;
}
.green .next-icon:hover {
  color: #4CFFB4;
}
/*==================================================
[red]

#ff2222 - main color
255, 34, 34 - fade color
==================================================*/
/* base color */
.red .color {
  color: #ff2222;
}
/* link color */
.red a:hover {
  color: #ff2222;
}
/* base button */
.red .btn-theme {
  color: #ffffff;
  background-color: #ff2222;
  border-color: #ff2222;
}
.red .btn-theme:active,
.red .btn-theme.active,
.red .btn-theme:focus,
.red .btn-theme.focus,
.red .btn-theme:hover {
  color: #ffffff;
  background-color: rgba(255, 34, 34, 0.85);
  border-color: rgba(255, 34, 34, 0.85);
}
/* square border color */
.red .grid-heading:before {
  border-color: rgba(255, 34, 34, 0.5);
}
/* grid title */
.red .grid-title {
  color: #ff2222;
}
/* pogress bar */
.red .progress {
  border-color: rgba(255, 34, 34, 0.85);
  background-color: rgba(255, 34, 34, 0.3);
}
.red .progress-bar {
  background-color: #ff2222;
}
/* contact form */
.red #contact-form .col-md-12:before {
  background-color: #ff2222;
}
/* subscribe form */
.red #subscribe-form .input:before {
  background-color: #ff2222;
}
/* slider button */
.red .prev-icon:hover {
  color: #ff2222;
}
.red .next-icon:hover {
  color: #ff2222;
}
/*==================================================
[pink]

#FF3498 - main color
255, 52, 152 - fade color
==================================================*/
/* base color */
.pink .color {
  color: #FF3498;
}
/* link color */
.pink a:hover {
  color: #FF3498;
}
/* base button */
.pink .btn-theme {
  color: #ffffff;
  background-color: #FF3498;
  border-color: #FF3498;
}
.pink .btn-theme:active,
.pink .btn-theme.active,
.pink .btn-theme:focus,
.pink .btn-theme.focus,
.pink .btn-theme:hover {
  color: #ffffff;
  background-color: rgba(255, 52, 152, 0.85);
  border-color: rgba(255, 52, 152, 0.85);
}
/* square border color */
.pink .grid-heading:before {
  border-color: rgba(255, 52, 152, 0.5);
}
/* grid title */
.pink .grid-title {
  color: #FF3498;
}
/* pogress bar */
.pink .progress {
  border-color: rgba(255, 52, 152, 0.85);
  background-color: rgba(255, 52, 152, 0.3);
}
.pink .progress-bar {
  background-color: #FF3498;
}
/* contact form */
.pink #contact-form .col-md-12:before {
  background-color: #FF3498;
}
/* subscribe form */
.pink #subscribe-form .input:before {
  background-color: #FF3498;
}
/* slider button */
.pink .prev-icon:hover {
  color: #FF3498;
}
.pink .next-icon:hover {
  color: #FF3498;
}