/*=======================

========================*/

/*=====  [Table of contents] ===== 
 1. google fonts Import
 2. default Style
 3. Side Navigation
 4. Page Header
 5. Image Slider
 6. Features area
 7. Services area
 8. About area
 9. work area
 10. Call to Action area
 11. Pricing area
 12. Facts area
 13. Map area
 14. Contact area
 15. Team area
 16. Clients area
 17. Blog area
 18. Shop area
 19. Cart area
 20. Single Pages
 21. Responsive Style
*/

/*=======================
 1. fonts Import
 ========================*/
/* open-sans-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 300;
  src: url("../fonts/open-sans-v40-latin-300.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* open-sans-300italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Open Sans";
  font-style: italic;
  font-weight: 300;
  src: url("../fonts/open-sans-v40-latin-300italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* open-sans-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/open-sans-v40-latin-regular.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* open-sans-italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Open Sans";
  font-style: italic;
  font-weight: 400;
  src: url("../fonts/open-sans-v40-latin-italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* open-sans-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 500;
  src: url("../fonts/open-sans-v40-latin-500.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* open-sans-500italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Open Sans";
  font-style: italic;
  font-weight: 500;
  src: url("../fonts/open-sans-v40-latin-500italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* open-sans-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 600;
  src: url("../fonts/open-sans-v40-latin-600.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* open-sans-600italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Open Sans";
  font-style: italic;
  font-weight: 600;
  src: url("../fonts/open-sans-v40-latin-600italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* open-sans-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 700;
  src: url("../fonts/open-sans-v40-latin-700.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* open-sans-700italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Open Sans";
  font-style: italic;
  font-weight: 700;
  src: url("../fonts/open-sans-v40-latin-700italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* open-sans-800 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 800;
  src: url("../fonts/open-sans-v40-latin-800.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* open-sans-800italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Open Sans";
  font-style: italic;
  font-weight: 800;
  src: url("../fonts/open-sans-v40-latin-800italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-100 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 100;
  src: url("../fonts/montserrat-v26-latin-100.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-100italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Montserrat";
  font-style: italic;
  font-weight: 100;
  src: url("../fonts/montserrat-v26-latin-100italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-200 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 200;
  src: url("../fonts/montserrat-v26-latin-200.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-200italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Montserrat";
  font-style: italic;
  font-weight: 200;
  src: url("../fonts/montserrat-v26-latin-200italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 300;
  src: url("../fonts/montserrat-v26-latin-300.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-300italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Montserrat";
  font-style: italic;
  font-weight: 300;
  src: url("../fonts/montserrat-v26-latin-300italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/montserrat-v26-latin-regular.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Montserrat";
  font-style: italic;
  font-weight: 400;
  src: url("../fonts/montserrat-v26-latin-italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 500;
  src: url("../fonts/montserrat-v26-latin-500.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-500italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Montserrat";
  font-style: italic;
  font-weight: 500;
  src: url("../fonts/montserrat-v26-latin-500italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 600;
  src: url("../fonts/montserrat-v26-latin-600.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-600italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Montserrat";
  font-style: italic;
  font-weight: 600;
  src: url("../fonts/montserrat-v26-latin-600italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 700;
  src: url("../fonts/montserrat-v26-latin-700.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-700italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Montserrat";
  font-style: italic;
  font-weight: 700;
  src: url("../fonts/montserrat-v26-latin-700italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-800 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 800;
  src: url("../fonts/montserrat-v26-latin-800.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-800italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Montserrat";
  font-style: italic;
  font-weight: 800;
  src: url("../fonts/montserrat-v26-latin-800italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-900 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 900;
  src: url("../fonts/montserrat-v26-latin-900.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* montserrat-900italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Montserrat";
  font-style: italic;
  font-weight: 900;
  src: url("../fonts/montserrat-v26-latin-900italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-100 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Roboto";
  font-style: normal;
  font-weight: 100;
  src: url("../fonts/roboto-v30-latin-100.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-100italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Roboto";
  font-style: italic;
  font-weight: 100;
  src: url("../fonts/roboto-v30-latin-100italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Roboto";
  font-style: normal;
  font-weight: 300;
  src: url("../fonts/roboto-v30-latin-300.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-300italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Roboto";
  font-style: italic;
  font-weight: 300;
  src: url("../fonts/roboto-v30-latin-300italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Roboto";
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/roboto-v30-latin-regular.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Roboto";
  font-style: italic;
  font-weight: 400;
  src: url("../fonts/roboto-v30-latin-italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Roboto";
  font-style: normal;
  font-weight: 500;
  src: url("../fonts/roboto-v30-latin-500.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-500italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Roboto";
  font-style: italic;
  font-weight: 500;
  src: url("../fonts/roboto-v30-latin-500italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Roboto";
  font-style: normal;
  font-weight: 700;
  src: url("../fonts/roboto-v30-latin-700.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-700italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Roboto";
  font-style: italic;
  font-weight: 700;
  src: url("../fonts/roboto-v30-latin-700italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-900 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Roboto";
  font-style: normal;
  font-weight: 900;
  src: url("../fonts/roboto-v30-latin-900.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* roboto-900italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Roboto";
  font-style: italic;
  font-weight: 900;
  src: url("../fonts/roboto-v30-latin-900italic.woff2") format("woff2"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/*=======================
 2. default Style
 ========================*/
body {
  font-family: "Roboto", sans-serif;
  font-weight: normal;
  font-size: 16px;
  line-height: 20px;
  letter-spacing: 0.5px;
  color: #000000;
  background: white;
}

html,
body {
  height: 100%;
  margin: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  color: #000000;
  font-family: "Montserrat", sans-serif;
  font-weight: 700;
  letter-spacing: 0.5px;
  margin-top: 0;
  margin-bottom: 15px;
}

a {
  color: #000000;
  -moz-transition: 0.2s ease-in;
  -o-transition: 0.2s ease-in;
  -webkit-transition: 0.2s ease-in;
  -ms-transition: 0.2s ease-in;
  transition: 0.2s ease-in;
  letter-spacing: 0px;
  outline: 0 !important;
}
a:hover,
a:active,
a:focus {
  color: #000000;
  text-decoration: none;
}

p {
  color: #000000;
  font-family: "Roboto", sans-serif;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0px;
  line-height: 20px;
  margin-bottom: 10px;
}

ul {
  list-style: none;
  padding: 0;
}

li {
  color: #000000;
  font-size: 16px;
  line-height: 20px;
  letter-spacing: 0.5px;
  margin-bottom: 5px;
}

img {
  max-width: 100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

blockquote {
  border-left: 5px solid #000000;
  padding-left: 10px;
}

blockquote p {
  font-size: 16px;
  font-weight: 700;
}

strong {
  font-weight: 700;
}

cite {
  color: #cccccc;
  font-size: 14px;
}

/* End default */
/* Custom CSS */
.row {
  margin-right: 0;
  margin-left: 0;
}

.parallax {
  width: 100%;
  height: auto;
  color: white;
  text-align: center;
  background-position: center !important;
  background-attachment: fixed !important;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
}

.scroll {
  width: 100%;
  height: auto;
  text-align: center;
  color: white;
}

.dark-overlay {
  background-blend-mode: color;
  background-color: rgba(0, 0, 0, 0.5);
}
.cd-headline.clip .cd-words-wrapper::after {
  background-color: #fff;
  content: "";
  height: 67%;
  position: absolute;
  right: 0;
  top: 9px;
  width: 2px;
}
.light-overlay {
  background-blend-mode: color;
  background-color: rgba(255, 255, 255, 0.5);
}

.first {
  margin-top: 100px !important;
}

.separator-line {
  color: white;
  border-bottom: 3px solid #000000;
  width: 60px;
  margin: 20px auto;
}

/* End Custom CSS */

/*=======================
 3. Side Navigation
 ========================*/
#wrapper {
  padding-left: 0;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

#wrapper.toggled {
  padding-left: 250px;
}

#sidebar-wrapper {
  z-index: 999;
  position: fixed;
  left: 250px;
  width: 0;
  height: 100%;
  margin-left: -250px;
  overflow-y: auto;
  background: #000000;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
.sidebar-nav {
  position: absolute;
  top: 0;
  width: 250px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.sidebar-nav li {
  margin: 0;
}
.sidebar-nav li.active a {
  color: #000000;
}
.sidebar-nav a.menu-item {
  border-bottom: 1px solid #000000;
  color: #fff;
  display: block;
  font-family: Roboto;
  font-size: 17px;
  font-weight: 500;
  margin-bottom: 0;
  margin-top: 0;
  padding: 15px 0 15px 50px;
  text-align: left;
  text-decoration: none;
  text-transform: uppercase;
}
.slider-content .btn.btn-primary.sm.page-scroll {
  margin-top: 25px;
  padding: 14px 51px;
}
.sidebar-nav a:hover {
  text-decoration: none;
  color: #000000;
}
li.menu-footer span a {
  background: #000000 none repeat scroll 0 0;
  border-radius: 50%;
  display: inline-block;
  height: 38px;
  line-height: 38px;
  margin: 0;
  text-align: center;
  transition: all 0.3s ease 0s;
  width: 38px;
}
li.menu-footer span a:hover {
  background: #f1f1f1 none repeat scroll 0 0;
  color: #000000;
}
.sidebar-nav > .sidebar-brand {
  color: #000000;
  font-size: 30px;
  font-weight: bold;
  margin: 10px auto;
  padding: 50px;
}
.sidebar-nav > .sidebar-brand a {
  color: #000000;
  font-family: Montserrat;
  font-size: 36px;
  font-weight: 700;
  text-transform: uppercase;
}
.sidebar-nav > .sidebar-brand a:hover {
  color: #000000;
  background: none;
}
#menu-toggle {
  display: none;
  font-size: 35px;
  font-weight: 700;
  z-index: 9999;
}
.menu-footer {
  background: #000000 none repeat scroll 0 0;
  bottom: 0;
  margin-top: 30px;
  padding-top: 23px;
  position: fixed;
  text-align: center;
  width: 250px;
}
.menu-footer i {
  padding: 0 5px;
}
.menu-footer p {
  color: #fff;
  font-weight: 700;
  margin: 20px 0;
}

/*=======================
 4. Page Header
 ========================*/

.parallax-header {
  background-image: url("../images/main-demo.jpg");
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
  background-attachment: fixed;
  background-position: center;
  text-align: center;
}

.parallax-project-header {
  background-image: url("../images/portfolio-demo.jpg");
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
  background-attachment: fixed;
  background-position: center;
  text-align: center;
}

.parallax-project-header .header-content {
  background-color: rgba(64, 191, 255, 0.6);
  color: white !important;
}

.parallax-project-header .header-content h3 {
  color: white !important;
}

.parallax-project-header .header-content h5 {
  color: white !important;
}

.freelancer-header .header-content {
  background-color: rgba(64, 191, 255, 0.6);
  color: white !important;
}

.freelancer-header .header-content h3 {
  color: white !important;
}

.freelancer-header .header-content h5 {
  color: white !important;
}

.freelancer-header .header-content {
  padding: 245px 0;
}

.header-content {
  background-color: rgba(54, 215, 183, 0.6);
  color: white;
  padding: 180px 0;
}

.header-content h3 {
  color: white;
  font-size: 36px;
  margin-bottom: 0;
}

.header-content h5 {
  color: white;
  font-size: 18px;
  margin-top: 25px;
}

.header-content .btn {
  margin-top: 20px;
}

.about-header {
  background: url("../images/about-page.jpg");
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
  background-attachment: fixed;
  background-position: center;
  text-align: center;
}

.services-header {
  background: url("../images/services-page.jpg");
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
  background-attachment: fixed;
  background-position: center;
  text-align: center;
}

.portfolio-header {
  background: url("../images/portfolio-demo.jpg");
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
  background-attachment: fixed;
  background-position: center;
  text-align: center;
}

.shop-header {
  background: url("../images/shop-page.jpg");
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
  background-attachment: fixed;
  background-position: center;
  text-align: center;
}

.cart-header {
  background: url("../images/cart-page.jpg");
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
  background-attachment: fixed;
  background-position: center;
  text-align: center;
}

.blog-header {
  background: url("../images/blog-page.jpg");
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
  background-attachment: fixed;
  background-position: center;
  text-align: center;
}

.contact-header {
  background: url("../images/contact-page.html");
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
  background-attachment: fixed;
  background-position: center;
  text-align: center;
}

.freelancer-header {
  background-image: url("../images/freelancer-demo.jpg");
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
  background-position: center;
  text-align: center;
}
#shopping-cart {
  color: white;
  position: absolute;
  top: 40px;
  right: 40px;
  font-size: 20px;
}

#shopping-cart:hover {
  color: #f1f1f1;
}

.cart-items {
  color: white;
  background: #000000;
  position: absolute;
  width: 15px;
  height: 15px;
  top: 40%;
  right: -10px;
  text-align: center;
  line-height: 16px;
  font-size: 8px;
  font-weight: 700;
  margin-top: -13px;
  -webkit-border-radius: 30px;
  border-radius: 30px;
}

/* 2. header */
.header-fixed {
  left: 0;
  position: absolute;
  right: 0;
  z-index: 1030;
}
.header-transparent {
  background: transparent none repeat scroll 0 0;
  box-shadow: 0 -1px 0 rgba(255, 255, 255, 0.1) inset;
  transition: height 0.3s ease-out 0s, background 0.3s ease-out 0s,
    box-shadow 0s ease-out 0s;
}
.sticky {
  left: 0;
  margin: auto;
  position: fixed;
  top: 0;
  width: 100%;
  background: #ffffff none repeat scroll 0 0;
  box-shadow: 0 -1px 0 #f5f5f5 inset;
  transition: height 0.3s ease-out 0s, background 0.3s ease-out 0s,
    box-shadow 0.3s ease-out 0s;
  z-index: 1030;
}
.breadcrumb-2-area {
  background-position: 50% 0;
  height: 70vh;
  overflow: hidden;
  padding: 0;
}
.hero-caption {
  display: table;
  height: 100%;
  margin: 0 auto;
  position: relative;
  width: 80%;
  z-index: 2;
}
.hero-text {
  display: table-cell;
  height: 100%;
  position: relative;
  vertical-align: middle;
}
h1.breadcrumb-2 {
  color: #000;
  font-size: 35px;
  font-weight: 700;
  margin-top: 104px;
}
.logo {
  padding: 26px 0 24px;
  transition: all 0.3s ease 0s;
}
.logo h4 {
  font-weight: 600;
  margin: 0;
}
.header-transparent .logo h4 {
  color: #fff;
}
.sticky .logo h4 {
  color: #000;
}
.sticky .logo {
  padding: 19px 0;
}
.basic-area {
  position: relative;
}
.basic-menu {
  float: right;
}
.basic-menu li {
  float: left;
  margin-bottom: 0;
  margin-left: 20px;
  position: relative;
  transition: all 0.3s ease 0s;
}
nav ul.basic-menu {
  margin: 0;
}
.header-area {
  position: relative;
}
.header-area.headroom {
  background-color: #fff;
}
.logo.text-upper a {
  color: #000000;
  font-family: Montserrat;
  font-size: 36px;
  font-weight: 300;
}
.basic-menu > li:last-child:after {
  display: none;
}
.basic-menu li a {
  color: #000000;
  display: inline-block;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1px;
  position: relative;
  text-transform: uppercase;
}
.basic-menu > li > a {
  padding: 45px 0 20px;
}
.basic-menu li:hover > a {
  color: #000000;
}
.basic-menu li ul {
  background: #f8f8f8 none repeat scroll 0 0;
  box-shadow: 0 5px 9px rgba(0, 0, 0, 0.176);
  float: none;
  left: 0;
  opacity: 0;
  position: absolute;
  text-align: left;
  top: 100%;
  transform: scaleY(0);
  transform-origin: 0 0 0;
  transition: all 0.4s ease 0s;
  visibility: hidden;
  width: 250px;
  z-index: 11;
}
.basic-menu li:hover > ul {
  opacity: 1;
  visibility: visible;
  transform: scaleY(1);
}
.basic-menu li ul li {
  border-bottom: 1px solid rgba(255, 255, 255, 0.8);
  display: block;
  float: none;
  margin: 0;
}
.basic-menu li ul li:last-child {
  border-bottom: 0 none;
  margin: 0;
}
.basic-menu li ul li a i {
  float: right;
}
/* --------------------------
  Child Sub menu
-----------------------------*/
.basic-menu li ul li ul {
  left: 100%;
  opacity: 0;
  position: absolute;
  top: 10%;
  visibility: hidden;
  z-index: 999;
}
.basic-menu li ul li:hover > ul {
  opacity: 1;
  top: 0;
  visibility: visible;
}
.basic-menu li ul li a {
  color: #000000;
  display: block;
  font-size: 13px;
  font-weight: normal;
  padding: 17px 15px;
  text-transform: capitalize;
}
.basic-menu > li.active > a {
  color: #000000;
}
.basic-menu li ul li:hover > a {
  background: #000000 none repeat scroll 0 0;
  color: #fff;
}
.basic-menu li ul li a span {
  float: right;
}
.member-img img {
  width: 100%;
}
.menu-area .menu-p-right ul {
  left: auto;
  right: 0;
}
.basic-menu .menu-p-right ul li ul {
  right: 100%;
}

.headroom {
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
  z-index: 10;
}
.headroom--pinned {
  background: #fff none repeat scroll 0 0;
  box-shadow: 0 -1px 0 #f5f5f5 inset;
  transform: translateY(0px);
}
.headroom--unpinned {
  transform: translateY(-100%);
}
.headroom {
  transition: transform 0.25s ease-in-out 0s;
  will-change: transform;
  z-index: 999;
}
.basic-space {
  height: 78px;
}
.header-transparent .basic-menu li a {
  color: #fff;
}
.header-transparent.sticky .basic-menu > li > a {
  color: #232332;
}
.sticky .basic-menu > li > a {
  padding: 23px 0;
}
.sticky .basic-menu > li::after {
  top: 25px;
}
.header-transparent .basic-menu > li > a::before {
  background: #f6f6f6 none repeat scroll 0 0;
}
.header-transparent.sticky .basic-menu > li > a::before {
  background: #666 none repeat scroll 0 0;
}
.sticky .basic-menu > li > a::before {
  bottom: 17px;
}
.hamburger {
  float: right;
  margin-left: 20px;
  margin-top: 24px;
  padding: 0;
  transition: all 0.3s ease 0s;
}
.hamburger-inner,
.hamburger-inner::after,
.hamburger-inner::before {
  height: 2px;
  width: 30px;
}
.hamburger-inner::before {
  top: -8px;
}
.hamburger--collapse .hamburger-inner::after {
  top: -16px;
}
.hamburger-menu {
  float: right;
  margin-right: -30px;
  opacity: 0;
  transition: all 0.3s ease 0s;
  visibility: hidden;
}
nav.nav-menu-show {
  margin-right: 0;
  opacity: 1;
  visibility: visible;
}
.sticky .hamburger {
  margin-top: 17px;
}
.menu-area {
  margin-top: 5px;
}

.slider-screen .slider-content.ct-text-align-right {
  padding-right: 20%;
  text-align: right;
}
.slider-content h2 {
  font-weight: 500;
  letter-spacing: 5px;
}
.dot {
  background: #000000 none repeat scroll 0 0;
  display: inline-block;
  height: 5px;
  width: 5px;
}
.slider-content.text-white h2 {
  color: #fff;
  font-size: 55px;
  font-weight: bold;
  letter-spacing: 0;
  margin-bottom: 20px;
}
.slider-content.text-white h2 span {
  font-size: 30px;
  margin-top: 19px;
  text-transform: capitalize;
}
.slider-content.text-white p {
  color: #fff;
}
.slider_button a,
.formular_wrapper .kontaktformular_button {
  background: #94c11f none repeat scroll 0 0;
  border: 1px solid #94c11f;
  border-top-left-radius: 0px;
  border-top-right-radius: 8px;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
  color: #fff;
  display: inline-block;
  font-weight: 600;
  letter-spacing: 1px;
  margin-top: 4px;
  padding: 13px 47px;
  transition: all 0.3s ease 0s;
}
.formular_wrapper .kontaktformular_button {
  display: flex;
}
.slider_button a:hover {
  background: #000000 none repeat scroll 0 0;
  border: 1px solid #000000;
}
.slider_button2 a {
  background: #349f8f none repeat scroll 0 0;
  border: 1px solid #349f8f;
  border-top-left-radius: 0px;
  border-top-right-radius: 8px;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
  color: #fff;
  display: inline-block;
  font-weight: 600;
  letter-spacing: 1px;
  margin-top: 4px;
  padding: 13px 47px;
  transition: all 0.3s ease 0s;
}
.slider_button2 a:hover {
  background: #000000 none repeat scroll 0 0;
  border: 1px solid #000000;
}
.slider_button3 a {
  background: #32b3ca none repeat scroll 0 0;
  border: 1px solid #32b3ca;
  border-top-left-radius: 0px;
  border-top-right-radius: 8px;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
  color: #fff;
  display: inline-block;
  font-weight: 600;
  letter-spacing: 1px;
  margin-top: 4px;
  padding: 13px 47px;
  transition: all 0.3s ease 0s;
}
.slider_button3 a:hover {
  background: #000000 none repeat scroll 0 0;
  border: 1px solid #000000;
}

.slider_button_schulung a,
.formular_wrapper .kontaktformular_button {
  background: #94c11f;
  border: 1px solid #94c11f;
  border-top-left-radius: 0px;
  border-top-right-radius: 8px;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
  color: #fff;
  display: block;        /* << macht den Button block und passt sich an */
  width: 100%;           /* << füllt die Breite des Containers */
  font-weight: 600;
  letter-spacing: 1px;
  margin-top: 4px;
  padding: 13px 0;       /* Padding links/rechts entfernen, Höhe bleibt */
  text-align: center;    /* Text zentrieren */
  transition: all 0.3s ease 0s;
  box-sizing: border-box; /* Border wird in Breite einbezogen */
}  
    
.slider-content.black-bg-opacity {
  background: rgba(0, 0, 0, 0.7) none repeat scroll 0 0;
  display: inline-block;
  padding: 70px 50px;
  text-align: center;
  outline: 1px solid rgba(0, 0, 0, 0.2);
  outline-offset: -15px;
  position: relative;
}
.slider-content.black-bg-opacity > h2 {
  font-size: 30px;
  line-height: 40px;
  position: relative;
}
.slider-content.text-white.black-bg-opacity::before {
  border: 1px solid #000000;
  bottom: 15px;
  content: "";
  left: 15px;
  position: absolute;
  right: 15px;
  top: 10px;
}
.slider-content.text-white span {
  color: #000000;
}
.slider-white {
  border-bottom: 1px solid #f5f5f5;
  border-top: 1px solid #f5f5f5;
  padding: 140px 0;
}
.slider-white .slider-content {
}
.slider-white .slider-content h3 {
  font-weight: 500;
  letter-spacing: 3px;
  line-height: 50px;
  margin: 0;
}
.single-slider {
  background-size: cover;
  padding: 200px 0;
  background: repeat scroll right center;
}
.border-t-b {
  border-top: 1px solid #f5f5f5;
  border-bottom: 1px solid #f5f5f5;
}
.slider-screen {
  background-position: center center;
  background-size: cover;
  padding: 320px 0 246px;
  position: relative;
}
.slider-screen .slider-content {
  position: relative;
  text-align: left;
  z-index: 99;
}
.nrbop.bg-black-alfa-40::before {
  background: rgba(0, 0, 0, 0.5) none repeat scroll 0 0;
}
.slider-screen .slider-content.ct-text-align-left {
  padding-left: 20%;
  text-align: left;
}
.slide-2 .slider-content h2,
.slide-2 .slider-content.text-white p {
  color: #fff;
}
.slide-2 .btn.white-btn {
  background: #000000 none repeat scroll 0 0;
  border-color: #000000;
  padding: 12px 59px;
}
.slide-2 .btn.white-btn:hover {
  background: #000000 none repeat scroll 0 0;
  border-color: #000000;
  color: #fff;
  padding: 12px 59px;
}
.slider-active .owl-dots,
.slider-active .owl-nav {
  text-align: center;
}
.slider-active .owl-nav {
  margin-top: 10px;
}
.slider-active .owl-nav [class*="owl-"] {
  background: #d6d6d6 none repeat scroll 0 0;
  border-radius: 3px;
  color: #fff;
  cursor: pointer;
  display: inline-block;
  font-size: 14px;
  margin: 5px;
  padding: 4px 7px;
}
.slider-active .owl-nav [class*="owl-"]:hover {
  background: #869791 none repeat scroll 0 0;
  color: #fff;
  text-decoration: none;
}
.slider-active .owl-nav .disabled {
  cursor: default;
  opacity: 0.5;
}
.slider-active .owl-nav.disabled + .owl-dots {
  bottom: 36px;
  left: 50%;
  margin-top: -43px;
  position: absolute;
  margin-left: -44px;
}
.slider-active .owl-dots .owl-dot {
  display: inline-block;
}
.slider-active .owl-dots .owl-dot span {
  backface-visibility: visible;
  background: #fff none repeat scroll 0 0;
  border-radius: 30px;
  display: block;
  height: 15px;
  margin: 10px 7px;
  transition: opacity 0.2s ease 0s;
  width: 15px;
}
.slider-active .owl-dots .owl-dot.active span,
.slider-active .owl-dots .owl-dot:hover span {
  background: #000000 none repeat scroll 0 0;
}
.slider-3 .slider-content.text-white.black-bg-opacity > h2 {
  color: #fff;
}
.bg-black-alfa-40::before {
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 0;
}
.bg-black-alfa-40::before {
  background: rgba(0, 0, 0, 0.8) none repeat scroll 0 0;
}

/* 4. portfolio */
.filter-menu {
}
.filter-menu button {
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
  border: 0 none;
  color: #666;
  display: inline;
  font-family: dosis;
  font-weight: 500;
  letter-spacing: 2px;
  margin: 0 2px;
  padding: 6px 15px;
  position: relative;
  text-transform: uppercase;
}
.filter-menu button:last-child:before {
  display: none;
}
.filter-menu button.active,
.filter-menu button:hover {
  color: #94c11f;
}
.row-portfolio {
  margin: 0 -10px;
}
.row-portfolio .portfolio-item {
  padding: 0 10px;
}
.portfolio-wrapper {
  position: relative;
}
.related-wk .portfolio-item {
  float: left;
  margin-bottom: 20px;
  width: 100%;
}
.portfolio-item {
  margin-bottom: 20px;
}
.portfolio-thumb img {
  width: 100%;
}
.portfolio-thumb {
  position: relative;
}
.portfolio-thumb::before {
  background: #000000 none repeat scroll 0 0;
  content: "";
  height: 100%;
  left: 0;
  opacity: 0;
  position: absolute;
  top: 0;
  transition: all 0.3s ease 0s;
  width: 100%;
}
button:focus {
  outline: none;
}
.portfolio-wrapper:hover .portfolio-thumb::before {
  opacity: 0.15;
}
.view-icon {
  height: 42px;
  left: 0;
  margin-top: -21px;
  opacity: 1;
  position: absolute;
  right: 0;
  text-align: center;
  top: 50%;
  transform: scale(0);
  transition: all 0.3s ease 0s;
  visibility: visible;
  width: 100%;
  z-index: 9;
}
.portfolio-wrapper:hover .view-icon {
  opacity: 1;
  transform: scale(1);
  visibility: visible;
}
.view-icon > a {
  background: #fff none repeat scroll 0 0;
  border-radius: 5px;
  color: #000000;
  display: inline-block;
  height: 40px;
  line-height: 41px;
  width: 40px;
}
.view-icon > a:hover {
  background: #94c11f;
  color: #fff;
}
.portfolio-caption {
  padding: 15px;
}
.portfolio-caption > h4 {
  font-size: 18px;
  letter-spacing: 0px;
  margin-bottom: 0;
  padding-bottom: 5px;
  position: relative;
}
.work-tag > a {
  color: #555;
  font-size: 13px;
  letter-spacing: 1px;
}
.portfolio-caption {
  padding: 15px;
}
.portfolio-caption {
  padding: 15px;
}
.caption-border {
  box-shadow: 0 1px 3px 2px rgba(1, 152, 117, 0.03);
}
/* portfolio style 2 */
.portfolio-style-2 {
}
.portfolio-style-2 .portfolio-caption {
  bottom: 31px;
  left: 0;
  opacity: 0;
  padding: 15px;
  position: absolute;
  right: 0;
  transition: all 0.3s ease 0s;
  visibility: hidden;
}
.portfolio-wrapper:hover .portfolio-caption {
  bottom: 15px;
  opacity: 1;
  visibility: visible;
}

/* call to action */
.call-to-action > h3 {
  font-weight: 500;
  letter-spacing: 1.5px;
}
.call-to-action > p {
  margin: 0;
}
.call-to-action a {
  margin-top: 12px;
}
/* portfolio-style-3 */
.portfolio-style-3 {
}
.portfolio-style-3 .portfolio-caption {
  bottom: 20px;
  top: inherit;
}
.portfolio-style-3 .portfolio-wrapper:hover .portfolio-caption {
  bottom: 0;
  top: inherit;
}
.row-portfolio.m-0 {
  margin: 0;
}
.portfolio-style-4 .portfolio-thumb::before {
  background: #000000 none repeat scroll 0 0;
}
.portfolio-style-4 .portfolio-wrapper:hover .portfolio-thumb::before {
  opacity: 0.7;
}
.portfolio-style-4 .portfolio-caption > h4 {
  color: #fff;
}
.portfolio-style-4 .work-tag > a {
  color: #fff;
}
.portfolio-style-4 .portfolio-caption {
  bottom: 50%;
  top: inherit;
}
.portfolio-style-4 .portfolio-wrapper:hover .portfolio-caption {
  transform: translateY(50%);
  bottom: 50%;
}
.portfolio-grid-2 .portfolio-item {
  width: 50%;
}
.portfolio-grid-4 .portfolio-item {
  width: 25%;
}
.no-space .portfolio-item {
  margin-bottom: 0;
}
.width-8 {
  width: 66.6667%;
}

.portfolio-style-2 .portfolio-caption > h4,
.portfolio-style-2 .work-tag > a,
.portfolio-style-2 .work-tag {
  color: #fff;
}
.portfolio-style-2 .portfolio-caption > h4:hover a,
.portfolio-style-2 .work-tag > a:hover {
  color: #000000;
}
.portfolio-style-2 .portfolio-wrapper:hover .portfolio-thumb::before {
  opacity: 0.64;
}
.portfolio-caption > h4 a:hover,
.work-tag > a:hover {
  color: #94c11f;
}
.blog-post-small .embed-responsive-16by9 {
  min-height: 228px;
}

/*=======================
 5. Image Slider
 ========================*/
#image-slider .carousel-inner {
  height: 100%;
}

.carousel-item img {
  height: auto;
  max-height: auto;
  width: 100%;
}

#blog-carousel {
  height: auto;
  width: auto;
  overflow: hidden;
}

#image-slider .slide1 {
  background-image: url("../images/slide1.jpg");
  padding: 362px 0;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
  background-position: center;
  background-attachment: scroll;
}

#image-slider .slide2 {
  background-image: url("../images/slide2.jpg");
  padding: 362px 0;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
  background-position: center;
  background-attachment: scroll;
}

#image-slider .slide3 {
  background-image: url("../images/slide3.jpg");
  padding: 362px 0;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
  background-position: center;
  background-attachment: scroll;
}

#image-slider .slide4 {
  background-image: url("../images/slide4.jpg");
  padding: 362px 0;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
  background-position: center;
  background-attachment: scroll;
}

#image-slider .carousel-control.left,
#image-slider .carousel-control.right {
  background-image: none !important;
  opacity: 1;
  text-shadow: none !important;
  font-size: 30px;
}

.carousel-control-next-icon,
.carousel-control-prev-icon {
  background-image: none !important;
  opacity: 1;
  text-shadow: none !important;
  font-size: 30px;
}

#blog-carousel .carousel-control-next-icon,
#blog-carousel .carousel-control-prev-icon {
  margin-top: -25px;
}

#project-carousel .carousel-control-next-icon,
#project-carousel .carousel-control-prev-icon {
  margin-top: -25px;
}

.carousel-inner > .carousel-item > a > img,
.carousel-inner > .carousel-item > img {
  line-height: 1;
}

.carousel-inner > .carousel-item > a > img,
.carousel-inner > .carousel-item > img,
.img-responsive,
.thumbnail a > img,
.thumbnail > img {
  display: block;
  max-width: 100%;
  height: auto;
}

#image-slider .carousel-caption {
  height: auto;
  margin-top: -108px;
  text-align: center;
  text-shadow: none;
  top: 50%;
}
.scroll-down {
  display: none;
}
#image-slider .carousel-item {
  height: 100vh;
}
#image-slider .carousel-caption h2 {
  color: white;
  font-size: 46px;
  font-weight: 700;
  margin-bottom: 15px;
}
#image-slider .carousel-item.active {
  position: relative;
}
#image-slider .carousel-item.active::after {
  background: #000000 none repeat scroll 0 0;
  content: "";
  height: 100%;
  left: 0;
  opacity: 0.37;
  position: absolute;
  top: 0;
  width: 100%;
}
#image-slider .slider-content {
  background: transparent;
  border-radius: 5px;
  display: inline-block;
  padding: 60px 55px;
}
.slider-content > p {
  color: #eee;
  margin-bottom: 22px;
  margin-top: 18px;
}
#image-slider p.caption {
  padding: 6px;
  color: white;
}

#image-slider h4 {
  color: white;
  margin: 40px auto;
}

#image-slider .carousel-caption {
  padding-bottom: 0;
}

.scroll-down {
  color: white;
  font-size: 32px;
  position: absolute;
  margin-top: 230px;
}

.scroll-down:hover {
  color: rgba(200, 200, 200, 0.8) !important;
  -webkit-transition: 0.5s;
  -moz-transition: 0.5s;
  transition: 0.5s;
}

/*=======================
 6. Features area
 ========================*/
#feature {
  margin-bottom: 0;
  padding: 40px 0 78px;
}
.feature-icon {
  border: 2px solid #94c11f;
  border-radius: 100px;
  color: #94c11f;
  display: inline-block !important;
  font-size: 30px;
  height: 80px;
  margin-bottom: 30px;
  padding: 23px;
  text-align: center;
  transition: all 0.2s ease-in 0s;
  width: 80px;
}
.feature-icon:hover,
.feature-icon:active,
.feature-icon:focus {
  color: white;
  background-color: #000000;
  text-decoration: none;
}

.feature-title {
  color: #000000;
  font-size: 16px;
  margin-bottom: 15px;
}

.feature {
  text-align: center;
  margin-top: 50px;
}

/*=======================
 7. Services area
 ========================*/
#service {
  margin-bottom: 50px;
  padding-bottom: 30px;
  padding-top: 31px;
}

#service .page-header {
  margin-bottom: 0;
}
.service-icon {
  color: #94c11f;
  display: inline-block;
  font-size: 50px;
  height: 80px;
  margin-bottom: 16px;
  padding: 23px 23px 23px 0;
  text-align: left;
  width: 80px;
}
.service-title {
  font-size: 16px;
  margin-bottom: 15px;
  text-transform: uppercase;
}
.service {
  margin-top: 25px;
  text-align: left;
}

/*=======================
 8. About area
 ========================*/
#about {
  background: #f1f1f1 none repeat scroll 0 0;
  padding: 86px 0 69px;
}
.company-info .about-company-title,
.skills-bars .about-company-title {
  color: #000000;
  font-size: 35px;
  margin-bottom: 30px;
}
.skills .progress-title h6 {
  color: #000000;
  font-size: 16px;
}
.skills .company-info p {
  color: #000000;
}
.about-company-title {
  color: white;
  font-size: 35px;
  margin-bottom: 30px;
}

.company-info p {
  color: white;
}

.progress {
  height: 16px !important;
  background-color: #eee !important;
}

.progress-title h6 {
  color: white;
  font-size: 16px;
}

.progress-bar-success {
  background-color: #86d244 !important;
}

.progress-bar-primary {
  background-color: #000000 !important;
}

.progress-bar-warning {
  background-color: #ffbf25 !important;
}

.progress-bar-danger {
  background-color: #f11a1a !important;
}

#about-freelancer {
  background: #f7fde6 none repeat scroll 0 0;
}

#about-freelancer .row {
  position: relative;
}
.freelancer-image {
  background: rgba(0, 0, 0, 0) url("../images/agrar-ctrl-image.jpg") no-repeat
    scroll center center / cover;
  height: 100%;
  left: -15px !important;
  position: absolute;
}
#about-freelancer .company-info {
  padding: 83px 61px 54px;
}

#about-freelancer .company-info p {
  color: #000000;
  margin-bottom: 20px;
}

#about-freelancer .about-company-title {
  color: #000000;
  margin-bottom: 20px;
}

#about-freelancer .about-box {
  display: flex;
  margin: 5px 0;
  padding: 0;
  padding-right: 25px;
}

#about-freelancer .about-text {
  padding-left: 12px;
}

#about-freelancer .about-title {
  color: #000000;
  font-weight: 700;
  font-size: 15px;
}
.freelancer-image {
  right: 0;
}
#about-freelancer .about-company-title {
  color: #000;
  margin-bottom: 20px;
  text-transform: uppercase;
}
#about-freelancer .about-icon {
  color: #000000;
  font-size: 26px;
  float: left;
  margin-bottom: 0;
  width: 40px;
  height: 40px;
}
#team {
  margin-bottom: 0;
  padding: 32px 0 0;
}
#facts.fanfact {
  padding: 40px 0 41px;
}
#service.service-area {
  padding: 42px 0 28px;
}
#pricing.price-area {
  padding: 0 0 40px;
}
/* End Skills Section */

/*=======================
 9. work area
 ========================*/
#work.full-width .container {
  width: 100%;
  padding: 0;
}
#work {
  background: hsl(0, 0%, 100%) none repeat scroll 0 0;
  padding: 31px 0 68px;
}
.portfolio-filter {
  margin: 40px;
}

.portfolio-items .col-md-4 {
  padding: 0;
  margin: 0;
}

.portfolio-items.gutter .col-md-3 {
  padding: 12px;
}

.portfolio-items.gutter .col-md-4 {
  padding: 12px;
}

.portfolio-filter li a {
  color: #000000;
  font-size: 16px;
  font-weight: 700;
  margin: 10px;
  padding-bottom: 6px;
  position: relative;
}

.portfolio-filter li a.active:before {
  visibility: visible;
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}

.portfolio-filter li a:hover,
.portfolio-filter li a.active {
  color: #000000;
}

.portfolio-filter li {
  display: inline-block;
  margin-bottom: 0;
}

.portfolio-items .col-md-3 {
  margin-bottom: 0 !important;
}

ul.portfolio-items {
  margin-bottom: 0 !important;
}

.hovereffect {
  width: 100%;
  height: 100%;
  float: left;
  overflow: hidden;
  position: relative;
  text-align: center;
  cursor: default;
}

.hovereffect .overlay {
  background-color: rgba(54, 215, 183, 0.6);
  height: 100%;
  left: 0;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  top: 0;
  transition: all 0.4s ease-in-out 0s;
  width: 100%;
}
.hovereffect img {
  display: block;
  position: relative;
  -webkit-transition: all 0.4s linear;
  transition: all 0.4s linear;
}

.hovereffect-title h2 {
  color: white;
  background: transparent;
  text-align: center;
  position: absolute;
  top: 43%;
  width: 100%;
  font-size: 18px;
  -webkit-transform: translatey(-100px);
  -ms-transform: translatey(-100px);
  transform: translatey(-100px);
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  padding: 10px;
}

.hovereffect a.info {
  text-decoration: none;
  display: inline-block;
  color: white;
  border: 1px solid white;
  background-color: transparent;
  opacity: 0;
  filter: alpha(opacity=0);
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  margin: 20px 0;
  padding: 10px 20px;
}

.hovereffect a.info:hover {
  background-color: rgba(255, 255, 255, 0.1);
}

.hovereffect:hover img {
  -ms-transform: scale(1.2);
  -webkit-transform: scale(1.2);
  transform: scale(1.2);
}

.hovereffect:hover .overlay {
  opacity: 1;
  filter: alpha(opacity=100);
}

.hovereffect:hover h2,
.hovereffect:hover a.info {
  opacity: 1;
  filter: alpha(opacity=100);
  -ms-transform: translatey(0);
  -webkit-transform: translatey(0);
  transform: translatey(0);
}

.hovereffect:hover a.info {
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
}
.filter-menu button {
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
  border: 0 none;
  color: #000000;
  display: inline;
  font-family: "Roboto", sans-serif;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0;
  margin: 0 2px;
  padding: 6px 15px;
  position: relative;
  text-transform: capitalize;
}
.basic-portfolio-area .filter-menu {
  margin-bottom: 52px;
  margin-top: 10px;
}
.portfolio-caption > h4 a {
  color: #fff;
}

/*=======================
 10. Call to Action area
 ========================*/
#call-to-action {
  background-color: white;
  padding: 30px 0;
}
.stacked {
  margin-top: -51px !important;
}
#call-to-action.stacked {
  background: #fff none repeat scroll 0 0;
  margin-top: 0;
  padding: 30px 0;
}
.cta-text {
  font-family: "Montserrat", sans-serif;
  font-size: 28px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 32px;
  padding: 30px 0;
}
.cta-right {
  float: right;
}
.cta-center {
  float: center;
}
.cta-content {
  padding: 30px 20px 30px 20px;
}
.cta-content2 {
  padding: 30px 20px 0px 20px;
}

#call-to-action p {
  margin-bottom: 0;
}

.cta-content .btn {
  margin-top: 0px;
}
.cta-content2 .btn {
  margin-top: 0px;
}

/* breadcrumb area */

.bg-black-alfa-40::before {
  background: rgba(255, 255, 255, 0.4) none repeat scroll 0 0;
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 0;
}
.breadcrumb-2-area {
  background-position: 50% 0;
  height: 40vh;
  overflow: hidden;
  padding: 0;
}
.bg-2 {
  background: rgba(0, 0, 0, 0) url("../images/services-page.jpg") repeat scroll
    0 0;
  background-attachment: fixed;
  background-clip: initial;
  background-color: rgba(0, 0, 0, 0);
  background-origin: initial;
  background-position: center center;
  background-size: cover;
  position: relative;
  z-index: 0;
}
.bg-3 {
  background: rgba(0, 0, 0, 0) url("../images/ablaufplan.jpg") repeat scroll 0 0;
  background-attachment: fixed;
  background-clip: initial;
  background-color: rgba(0, 0, 0, 0);
  background-origin: initial;
  background-position: center center;
  background-size: cover;
  position: relative;
  z-index: 0;
}
.bg-4 {
  background: rgba(0, 0, 0, 0) url("../images/schulungen.jpg") repeat scroll 0 0;
  background-attachment: fixed;
  background-clip: initial;
  background-color: rgba(0, 0, 0, 0);
  background-origin: initial;
  background-position: center center;
  background-size: cover;
  position: relative;
  z-index: 0;
}
.bg-schulung {
  background: rgba(0, 0, 0, 0) url("../images/schulungen-slider.jpg") repeat scroll 0 0;
  background-attachment: fixed;
  background-clip: initial;
  background-color: rgba(0, 0, 0, 0);
  background-origin: initial;
  background-position: center center;
  background-size: cover;
  position: relative;
  z-index: 0;
}
.bg-bueroorganisation {
  background: rgba(0, 0, 0, 0) url("../images/services-page.jpg") repeat scroll
    0 0;
  background-attachment: fixed;
  background-clip: initial;
  background-color: rgba(0, 0, 0, 0);
  background-origin: initial;
  background-position: center center;
  background-size: cover;
  position: relative;
  z-index: 0;
}
.bg-digitalebuchhaltung {
  background: rgba(0, 0, 0, 0) url("../images/services-page.jpg") repeat scroll
    0 0;
  background-attachment: fixed;
  background-clip: initial;
  background-color: rgba(0, 0, 0, 0);
  background-origin: initial;
  background-position: center center;
  background-size: cover;
  position: relative;
  z-index: 0;
}
.bg-kontakt {
  background: rgba(0, 0, 0, 0) url("../images/kontakt_agrarctrl.jpg") repeat scroll
    0 0;
  background-attachment: fixed;
  background-clip: initial;
  background-color: rgba(0, 0, 0, 0);
  background-origin: initial;
  background-position: center center;
  background-size: cover;
  position: relative;
  z-index: 0;
}
.hero-caption {
  display: table;
  height: 100%;
  margin: 0 auto;
  position: relative;
  width: 80%;
  z-index: 2;
}
.hero-text {
  display: table-cell;
  height: 100%;
  position: relative;
  vertical-align: middle;
}
h1.breadcrumb-2 {
  color: #000;
  font-size: 35px;
  font-weight: 700;
}
.single-feature {
  background: #f1f1f1 none repeat scroll 0 0;
  padding: 50px 22px;
  transition: all 0.3s ease 0s;
}
.feature-title {
  font-size: 16px;
  margin-bottom: 15px;
  text-transform: uppercase;
}
.single-feature:hover .feature-icon,
.single-feature.active,
.single-feature:focus {
  background-color: #94c11f;
  color: white;
  text-decoration: none;
}
.single-feature.active .feature-icon {
  border-color: #fff;
  color: #fff;
}
.single-feature.active > p {
  color: #fff;
}
.company-info .about-company-title,
.skills-bars .about-company-title {
  font-size: 35px;
  margin-bottom: 30px;
}
.about-company-title {
  color: #000;
  font-size: 35px;
  margin-bottom: 30px;
  text-transform: uppercase;
}
.skills .progress-bar {
  background-color: #000000 !important ;
  border-radius: 5px;
}
.progress-bar {
  height: 8px;
}
.progress {
  background-color: #f1f1f1;
  border-radius: 6px;
  box-shadow: none;
  height: 8px !important;
  margin-bottom: 20px;
}
.signature {
  float: left;
}
.single-member-wrapper {
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
  padding: 20px;
}
.members-details {
  padding-top: 20px;
  text-align: center;
}
.member-details h3 {
  display: inline-block;
  font-size: 18px;
  font-weight: 600;
  line-height: 1;
  margin: 0 0 5px;
}
.members-details p {
  font-size: 12px;
  font-style: italic;
  letter-spacing: 1px;
  margin: 0;
  text-transform: uppercase;
}
#team {
  margin-bottom: 0;
  padding: 32px 0 35px;
}
#feature {
  padding: 40px 0 90px;
}
.members-details h3:hover a {
  color: #000000;
}
#pricing.price-area {
  background: hsl(0, 0%, 98%) none repeat scroll 0 0;
  padding: 91px 0 40px;
}
.pricing-table.featured-p-t {
  transform: translateY(-20px);
}

/*=======================
 11. Pricing area
 ========================*/
.pricing-table {
  background: hsl(0, 0%, 100%) none repeat scroll 0 0;
  margin-bottom: 50px;
  padding-bottom: 10px;
  text-align: center;
}
.pricing-title {
  background-color: #000;
  color: white;
  font-size: 20px;
  font-weight: 700;
  padding: 20px;
}
.featured.pricing-title {
  background-color: #000000;
}
#work.pot-area {
  padding: 46px 0 90px;
}
#shop {
  margin-top: 70px;
  padding: 44px 0 6px;
}
.pricing-table-price {
  font-weight: 700;
  padding: 30px 20px;
}
#blog.blog-page-area {
  padding: 68px 0 54px;
}
.blog-page-area .blog-post-small {
  margin: 25px 0;
}
.pricing-circle {
  color: #000000;
}

.pricing-currency {
  color: #000000;
  font-size: 16px;
  font-weight: 700;
  vertical-align: 25px;
}

.pricing-price {
  color: #000000;
  font-size: 50px;
  font-weight: 700;
}

.pricing-table-content li {
  margin-bottom: 15px;
}

.pricing-table-button {
  padding: 20px 0 30px;
}

/*=======================
 12. Facts area
 ========================*/
#facts {
  padding-bottom: 0;
  padding-top: 88px;
  text-align: center;
}
.facts-icon {
  color: #94c11f;
  display: block;
  font-size: 55px;
  margin-bottom: 20px;
}
#facts p {
  font-family: Montserrat;
  font-size: 35px;
  font-weight: 700;
}
.facts-title {
  color: #777777;
  font-size: 16px;
  font-weight: 700;
  margin-top: 15px;
  margin-bottom: 50px;
}
.facts-title {
  color: #000000;
  font-family: "Roboto", sans-serif;
  font-weight: 400;
  letter-spacing: 0;
  margin-bottom: 37px;
  text-transform: uppercase;
}

/*=======================
 13. Map area
 ========================*/
#map {
  width: 100%;
  height: 400px;
  margin-top: 50px;
}

#map.big {
  height: 450px;
  margin-top: 0;
}

/*=======================
 14. Contact area
 ========================*/
#contact {
  margin-bottom: 26px;
  margin-top: 45px;
}

#contact .form-group {
  margin-bottom: 0;
}

#contact #contactForm {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}

.form-control {
  font-size: 14px;
  line-height: 21px;
  font-family: "Roboto", sans-serif;
}

#contactForm .form-control {
  background: #f1f1f1 none repeat scroll 0 0;
  border: 2px solid #f1f1f1;
  border-radius: 5px;
  box-shadow: none;
  color: #000000;
  font-weight: 400;
  letter-spacing: 0.5px;
  margin-bottom: 30px;
  min-height: 50px;
  padding: 10px 20px;
}
button.btn.btn-md {
  background: #000000 none repeat scroll 0 0;
  border-color: #000000;
  text-transform: uppercase;
}
#contactForm #message {
  min-height: 130px;
}
.btn-primary.focus,
.btn-primary:focus {
  box-shadow: none;
}
.btn-form-submit {
  font-family: "Roboto", sans-serif;
  font-size: 16px;
  border-radius: 5px;
  margin: 0;
  padding: 14px;
  width: 100%;
}

#contact .btn-form-submit:hover {
  background: #94c11f none repeat scroll 0 0 !important;
  border-color: #94c11f !important;
}

.has-error .form-control {
  color: #f11a1a !important;
  border: 2px solid #f11a1a !important;
}

.help-block.with-errors li {
  color: #f11a1a;
  margin-top: -30px;
  margin-bottom: 0;
}

.text-danger {
  color: #f11a1a;
  font-size: 14px;
  font-weight: 700;
}

#msgSubmit.h3 {
  font-size: 14px;
  margin-top: 5px;
}

.contact-info {
  margin-top: 50px;
}

.contact-info .contacts {
  background: #f1f1f1 none repeat scroll 0 0;
  padding: 33px;
  text-align: center;
}

.contact-info img {
  max-width: 100px;
  margin-left: 0;
  margin-bottom: 20px;
}

.contact-info-title i {
  color: #000000;
  font-size: 24px;
  margin-right: 10px;
}

.info {
  margin-bottom: 20px;
}

.info.last {
  margin-bottom: 0;
}
.cont-logo > a {
  color: #000000;
  display: inline-block;
  font-family: Montserrat;
  font-size: 36px;
  font-weight: 700;
  margin-bottom: 20px;
  text-transform: uppercase;
}
.contact-info-title {
  color: #000000;
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 10px;
}
.contact-info.contact-page-area-info {
  padding-top: 45px;
}
.no-padding-right {
  padding-right: 0;
}
.contact-page-area-form {
  padding-bottom: 32px;
}
.contact-info-text {
  margin-bottom: 40px;
}
#work.related-wk {
  padding-bottom: 50px;
}
a.contact-info-text {
  font-weight: 400;
}
.contact-info .contacts {
  text-align: center;
}
#contact.full-width #contactForm {
  width: 100%;
}
/*=======================
 15. Team area
 ========================*/
.team-info {
  border: 5px solid #f1f1f1;
  margin-bottom: 50px;
}

.team img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  max-width: 100%;
}

.team-rounded img {
  border: 0;
  border-radius: 100%;
  width: 220px;
  height: 220px;
  margin-bottom: 30px;
}

.team-title {
  color: #000000;
  font-size: 24px;
  text-align: center;
  margin-top: 15px;
  margin-bottom: 3px;
}

.team-role {
  text-align: center;
  font-size: 12px;
}

/*=======================
 16. Clients area
 ========================*/
#clients {
  background-color: #f1f1f1;
  padding-top: 60px;
  padding-bottom: 40px;
}

.client {
  margin-bottom: 20px;
  opacity: 0.5;
}

/*=======================
 17. Blog area
 ========================*/
.blog-header {
  margin-bottom: 20px;
}

.blog-post-small {
  margin: 50px 0;
}

.blog-post-small .post-title {
  font-size: 20px;
  margin-bottom: 5px;
}

.blog-post-small .post-meta {
  font-size: 12px;
  margin-bottom: 7px;
}

.blog-post-small .post-meta-link {
  font-weight: 700;
}

.blog-post-small .post-excerpt {
  font-size: 14px;
}
.blog-post-small .read-more {
  font-size: 14px;
  font-weight: 700;
  margin: 10px 0;
  padding: 9px 27px;
  text-transform: uppercase;
}
.blog-post-small .carousel-control {
  text-shadow: none;
  background-color: rgba(0, 0, 0, 0.1);
}

.blog-post-small .embed-responsive-item {
  background-color: #f1f1f1;
}

.blog-post-small .embed-responsive-16by9 {
  padding-bottom: 9.1%;
}

/*=======================
 18. Shop area
 ========================*/
#shop {
  margin-top: 70px;
}

.product {
  margin-bottom: 70px;
  text-align: center;
}

.product img {
  width: 95%;
}

.product img:hover {
  opacity: 0.8;
}

.product-price {
  color: white;
  background: #000000;
  border-radius: 100%;
  width: 70px;
  height: 70px;
  line-height: 44px;
  padding: 15px 20px;
  font-size: 18px;
  position: absolute;
  top: -25px;
  right: 0px;
  font-weight: 700;
  text-align: center;
  z-index: 99;
}

.product-title {
  color: #000000;
  font-size: 24px;
  padding-top: 20px;
  text-align: center;
}

a .product-title:hover {
  opacity: 0.6;
  -moz-transition: 0.2s ease-in;
  -o-transition: 0.2s ease-in;
  -webkit-transition: 0.2s ease-in;
  -ms-transition: 0.2s ease-in;
  transition: 0.2s ease-in;
}

/*=======================
 19. Cart area
 ========================*/
.shopping-cart {
  margin-top: 50px;
}

table {
  margin: 0 0 30px;
  width: 100%;
}

.shopping-cart thead {
  background: #f1f1f1;
}

.shopping-cart thead th {
  color: #000000;
  padding: 10px 0;
  font-size: 16px;
  line-height: 30px;
}

.shopping-cart tbody td {
  color: #000000;
  padding: 10px 0;
  vertical-align: middle;
  font-size: 14px;
}

.shopping-cart img {
  max-width: 50px;
}

.cart-item {
  border-bottom: 1px solid #f1f1f1;
}

.cart-item a img:hover {
  opacity: 0.6;
}

.qty input[type="number"] {
  max-width: 50px;
  max-height: 50px;
  padding: 14px 4px 10px 8px;
  float: left;
  outline: none !important;
}

.x-remove {
  padding: 0 3px !important;
  font-size: 15px;
  line-height: 14px;
  border-radius: 100% !important;
  float: right;
}

.coupon {
  margin: 30px 0;
  float: left;
}

.coupon #coupon-code {
  color: #777777 !important;
  font-weight: 700;
  letter-spacing: 0.5px;
  border: 2px solid #f1f1f1;
  border-radius: 5px;
  padding: 10px 20px;
  min-height: 50px;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.coupon .btn {
  min-height: 50px;
  margin-top: 0;
  margin-bottom: 0;
  margin-left: 20px !important;
  border-radius: 5px !important;
  font-size: 14px !important;
}

.update-cart {
  margin: 30px 0;
}

.update-cart .btn {
  float: right;
  min-height: 50px;
  margin-top: 0;
  margin-right: 5px;
  border-radius: 5px !important;
  font-size: 14px !important;
}

#checkout {
  margin-top: 70px;
  margin-bottom: 50px;
}

#checkout .title {
  padding-bottom: 20px;
  margin-bottom: 10px;
  border-bottom: 1px solid #f1f1f1;
}

#checkout p {
  font-weight: 700;
  margin: 30px 0;
}

#checkout p span {
  font-weight: 400;
  font-size: 14px;
}

#checkoutForm .form-control {
  color: #000000 !important;
  font-weight: 700;
  letter-spacing: 0.5px;
  border: 2px solid #f1f1f1;
  border-radius: 5px;
  margin-bottom: 30px;
  padding: 10px 20px;
  min-height: 50px;
  -webkit-box-shadow: none;
  box-shadow: none;
}

#checkoutForm .btn-form-submit {
  border-radius: 5px;
  margin: 0;
  padding: 13px;
  width: 100%;
}
#home {
  top: 0;
}

.scroll-to-top {
  background: #000000;
  color: white;
  width: 35px;
  height: 35px;
  bottom: 20px;
  right: 20px;
  font-size: 30px !important;
  line-height: 32px;
  border: 2px solid #000000;
  border-radius: 5px;
  position: fixed;
  text-align: center;
  font-size: 24px !important;
  z-index: 99;
}

.scroll-to-top:hover {
  background: #000000;
  color: white;
  border: 2px solid #000000;
}
/*=======================
 20. Single Pages
 ========================*/
.single-post-content {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 20px;
}

.single-post-content .post-meta {
  padding: 20px 0;
  margin-bottom: 0;
}

.single-post-content .post-content {
  padding: 30px 20px;
  margin-bottom: 50px;
}

.single-post-content .first-post-paragraph:first-child:first-letter {
  float: left;
  color: #000000;
  font-size: 65px;
  line-height: 50px;
  padding: 3px 6px 8px 6px;
}

.single-post-content .social-share {
  margin-bottom: 100px;
  padding-left: 0;
}

.single-post-content .social-share i {
  margin-right: 10px;
}

.single-post-content .social-share a {
  color: white;
  background-color: #000000;
  padding: 10px 15px 10px 15px;
  margin-top: 20px;
  margin-right: 10px;
  border-radius: 5px;
  float: left;
}

.post-nav {
  width: 90%;
  margin: 0 auto 50px auto;
}

.post-nav .left {
  float: left;
}

.post-nav .right {
  float: right;
}

.post-nav .left i {
  margin-right: 10px;
  font-size: 12px;
}
.basic-testimonial-area {
  background: #ffffff none repeat scroll 0 0;
  padding-bottom: 0px;
  padding-top: 25px;
}
.post-nav .right i {
  margin-left: 10px;
  font-size: 12px;
}

.single-post-content .social-share a:hover {
  background-color: #000000;
}

.single-post-content .skills {
  margin: 30px 0 0 0;
}

#single-project .single-post-content {
  width: 100% !important;
}

#single-project .single-post-content .post-content {
  padding: 20px 0;
}

#single-project .about-project {
  background: #f1f1f1;
  padding: 20px;
  margin-bottom: 10px;
}

#single-project .project-info {
  padding: 0px 20px 8px 20px;
  margin-bottom: 10px;
}

#single-project .single-post-content h3 {
  margin: 30px 0;
}

#single-project2 .single-post-content {
  width: 100% !important;
}

#single-project2 .single-post-content .post-content {
  padding: 20px 0;
}

#single-project2 .about-project {
  background: #f1f1f1;
  padding: 20px;
  margin-bottom: 10px;
}

#single-project2 .project-info {
  padding: 20px;
  margin-bottom: 10px;
}

#single-project2 .single-post-content h3 {
  margin: 30px 0;
}
.info-text {
  margin-bottom: 10px;
}

.info-text span {
  font-weight: 700;
}

#single-product {
  margin-top: 50px;
}

#single-product .product {
  margin-bottom: 30px;
}

#single-product .product-title {
  text-align: left;
  padding-top: 0;
  margin-bottom: 25px;
}

.product-text {
  margin-top: 50px;
}

#single-product .product img {
  width: 100%;
}

#single-product .product-description {
  background: #f1f1f1;
  padding: 20px;
  text-align: left;
}

p.product-button {
  text-align: left;
  margin: 30px 0;
}
.add-to-cart i {
  margin-right: 20px;
}
#scrollUp {
  background: #94c11f none repeat scroll 0 0;
  border-radius: 5px;
  bottom: 15px;
  box-shadow: 0 0 10px hsla(0, 0%, 0%, 0.05);
  color: hsl(0, 0%, 100%);
  font-size: 17px;
  height: 40px;
  line-height: 45px;
  position: fixed;
  right: 15px;
  text-align: center;
  transition: all 0.3s ease 0s;
  width: 40px;
  z-index: 200;
}
#scrollUp:hover {
  background: #000000 none repeat scroll 0 0;
}
.demo-parallax-header {
  background-image: url("../images/demo-header.jpg");
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
  background-attachment: fixed;
  background-position: center;
  text-align: center;
}

#demo-header .header-content {
  margin: 95px 0;
}

header#demo-header h2 {
  margin-top: 0;
  font-size: 30px;
  margin-bottom: 20px;
}

.demo-top-space {
  margin-top: 100px;
}

#demos h3 {
  background-color: #f3f3f3;
  color: #777;
  padding: 20px;
  font-size: 16px;
  margin-top: 0;
}

#demos a img:hover {
  opacity: 0.8;
}
.footer-info .logo a {
  color: #000000;
  font-family: Montserrat;
  font-size: 36px;
  font-weight: 700;
  text-transform: uppercase;
}
.social-icon a {
  background: #000000 none repeat scroll 0 0;
  border: 1px solid #000000;
  border-radius: 5px;
  color: #fff;
  display: inline-block;
  height: 35px;
  line-height: 33px;
  margin: 0 5px;
  text-align: center;
  width: 35px;
}
.social-icon a:hover {
  background: #94c11f;
  border-color: #94c11f;
  color: #fff;
}
footer.footer-bg {
  background: #fff none repeat scroll 0 0;
  border-top: 0 solid #000000;
  padding: 69px 0 78px;
}
.footer-bottom {
  margin-top: 23px;
}

/*=======================
 21. Responsive Style
 ========================*/
/* Min Widths */
@media only screen and (min-width: 992px) {
}
@media only screen and (min-width: 768px) {
  #wrapper {
    padding-left: 250px;
  }

  #wrapper.toggled {
    padding-left: 0;
  }

  #sidebar-wrapper {
    width: 255px;
  }

  #wrapper.toggled #sidebar-wrapper {
    width: 0;
  }
}
/* Max Widths */
@media only screen and (max-width: 991px) {
  .freelancer-image {
    position: relative;
    height: 420px;
  }
}
@media only screen and (max-width: 768px) {
  .parallax {
    background-attachment: scroll !important;
    -webkit-background-size: auto;
    -moz-background-size: auto;
    background-size: auto;
  }

  .demo-parallax-header {
    background-attachment: scroll !important;
    -webkit-background-size: auto;
    -moz-background-size: auto;
    background-size: auto;
  }

  .parallax-header {
    background-attachment: scroll !important;
    -webkit-background-size: auto;
    -moz-background-size: auto;
    background-size: auto;
  }

  .parallax-project-header {
    background-attachment: scroll !important;
    -webkit-background-size: auto;
    -moz-background-size: auto;
    background-size: auto;
  }

  .about-header {
    background-attachment: scroll !important;
    -webkit-background-size: auto;
    -moz-background-size: auto;
    background-size: auto;
  }

  .services-header {
    background-attachment: scroll !important;
    -webkit-background-size: auto;
    -moz-background-size: auto;
    background-size: auto;
  }

  .portfolio-header {
    background-attachment: scroll !important;
    -webkit-background-size: auto;
    -moz-background-size: auto;
    background-size: auto;
  }

  .shop-header {
    background-attachment: scroll !important;
    -webkit-background-size: auto;
    -moz-background-size: auto;
    background-size: auto;
  }

  .cart-header {
    background-attachment: scroll !important;
    -webkit-background-size: auto;
    -moz-background-size: auto;
    background-size: auto;
  }

  .blog-header {
    background-attachment: scroll !important;
    -webkit-background-size: auto;
    -moz-background-size: auto;
    background-size: auto;
  }

  .contact-header {
    background-attachment: scroll !important;
    -webkit-background-size: auto;
    -moz-background-size: auto;
    background-size: auto;
  }

  .freelancer-header {
    background-attachment: scroll !important;
    -webkit-background-size: auto;
    -moz-background-size: auto;
    background-size: auto;
  }

  #image-slider .slide1 {
    background-attachment: scroll !important;
    -webkit-background-size: auto;
    -moz-background-size: auto;
    background-size: auto;
    padding: 260px 0;
  }

  #image-slider .slide2 {
    background-attachment: scroll !important;
    -webkit-background-size: auto;
    -moz-background-size: auto;
    background-size: auto;
    padding: 260px 0;
  }

  #image-slider .slide3 {
    background-attachment: scroll !important;
    -webkit-background-size: auto;
    -moz-background-size: auto;
    background-size: auto;
    padding: 260px 0;
  }

  #image-slider .slide4 {
    background-attachment: scroll !important;
    -webkit-background-size: auto;
    -moz-background-size: auto;
    background-size: auto;
    padding: 260px 0;
  }

  #image-slider .carousel-caption {
    top: -80px;
  }

  .scroll-down {
    margin-top: 110px;
  }
}
@media only screen and (max-width: 767px) {
  #menu-toggle {
    background: rgba(245, 245, 245, 0.8) none repeat scroll 0 0 !important;
    display: block;
    font-size: 30px;
    margin-left: 30px;
    margin-top: 30px;
    padding: 4px;
    position: absolute;
  }

  .menu-footer {
    position: relative;
    margin-top: 60px;
  }

  #contact #contactForm {
    width: 100%;
  }
}
@media only screen and (max-width: 575px) {
  #image-slider .carousel-caption {
    top: 0;
    position: relative;
    left: 0;
    padding: 0;
  }

  #image-slider .slider-content {
    padding: 30px;
  }

  #image-slider .slide1 {
    padding: 180px 0;
  }

  #image-slider .slide2 {
    padding: 180px 0;
  }

  #image-slider .slide3 {
    padding: 180px 0;
  }

  #image-slider .slide4 {
    padding: 180px 0;
  }
}
@media only screen and (max-width: 560px) {
  #call-to-action p {
    margin-bottom: 0;
    text-align: center;
  }

  .cta-content .btn {
    float: none;
    margin: 20px auto;
  }
}
@media only screen and (max-width: 480px) {
  .portfolio-items .col-xs-6 {
    width: 100%;
  }

  .post-nav {
    text-align: center;
  }

  .post-nav .left {
    float: none;
    margin-top: 50px;
    margin-bottom: 30px;
  }

  .post-nav .right {
    float: none;
  }

  #map.big {
    height: 300px;
  }
}
/* Bootstrap Elements */
/* Jumbotron */
.jumbotron {
  background-color: #f1f1f1;
}
.single-post-content .social-share a:hover {
  background: #000000;
}
.jumbotron h1 {
  color: #000000;
}

/* Page Header */
.page-header {
  padding-bottom: 3px;
  margin: 50px 0 30px;
  text-align: center;
  position: relative;
  border-bottom: 0;
}

.page-header h2 {
  font-size: 35px;
  margin-bottom: 5px;
  text-transform: uppercase;
}

/* Buttons */
.btn {
  font-weight: 700;
  letter-spacing: 0.5px;
  border-radius: 5px;
  padding: 10px 44px;
  margin: 0px 5px 5px 5px;
  -moz-transition: 0.2s ease-in;
  -o-transition: 0.2s ease-in;
  -webkit-transition: 0.2s ease-in;
  -ms-transition: 0.2s ease-in;
  transition: 0.2s ease-in;
}

.btn-sm {
  font-weight: 700;
  letter-spacing: 0.5px;
  border-radius: 5px;
  padding: 8px 20px;
}

.btn-md {
  padding: 10px 27px;
}

.btn-default {
  color: white;
  background-color: #777777;
  border-color: #777777;
}

.btn-default:hover,
.btn-default:focus {
  color: white;
  background-color: #000000;
  border-color: #000000;
  outline: none;
}

.btn-primary {
  color: white;
  background-color: #000000 !important;
  border-color: #000000 !important;
}

.btn-primary:hover,
.btn-primary:focus {
  color: white;
  background-color: #2c8376 !important;
  border-color: #2c8376 !important;
  outline: none;
}

.btn-success {
  color: white;
  background-color: #42a6ba;
  border-color: #42a6ba;
}

.btn-success:hover,
.btn-success:focus {
  color: white;
  background-color: #42a6ba;
  border-color: #42a6ba;
  outline: none;
}

.btn-info {
  color: white;
  background-color: #009eef;
  border-color: #009eef;
}

.btn-info:hover,
.btn-info:focus {
  color: white;
  background-color: #0084c9;
  border-color: #0084c9;
  outline: none;
}

.btn-warning {
  color: white;
  background-color: #ffbf25;
  border-color: #ffbf25;
}

.btn-warning:hover,
.btn-warning:focus {
  color: white;
  background-color: #eeab09;
  border-color: #eeab09;
  outline: none;
}

.btn-danger {
  color: white;
  background-color: #f11a1a;
  border-color: #f11a1a;
}

.btn-danger:hover,
.btn-danger:focus {
  color: white;
  background-color: #d90707;
  border-color: #d90707;
  outline: none;
}

.btn-link {
  color: #000000;
  background-color: transparent;
  border-color: transparent;
}

.btn-link:hover,
.btn-link:focus {
  color: #000000;
  background-color: transparent;
  border-color: transparent;
  text-decoration: none;
  outline: none;
}

/* Thumbnails */
.img-thumbnail {
  padding: 0;
  background-color: transparent;
  border: none;
  border-radius: 0;
  margin-right: 20px;
  margin-bottom: 20px;
}

.center {
  text-align: center;
}

/* Labels */
.label {
  padding: 12px 24px;
  font-size: 0.5em;
  font-weight: 700;
  color: white;
  border-radius: 5px;
}

.label-default {
  background-color: #777777;
}

.label-primary {
  background-color: #000000;
}

.label-success {
  background-color: #86d244;
}

.label-info {
  background-color: #009eef;
}

.label-warning {
  background-color: #ffbf25;
}

.label-danger {
  background-color: #f11a1a;
}

h1 .label,
h2 .label,
h3 .label,
h4 .label,
h5 .label,
h6 .label,
p .label {
  line-height: 40px;
}

/* Badges */
.nav-pills > li.active > a,
.nav-pills > li.active > a:focus,
.nav-pills > li.active > a:hover {
  color: white;
  background-color: #000000;
}

.list-group-item.active > .badge,
.nav-pills > .active > a > .badge {
  color: #000000;
}

.badge {
  color: white;
  background-color: #000000;
}

/* Alerts */
.alert-success {
  color: white;
  background-color: #86d244;
  border-color: #68b624;
}

.alert-info {
  color: white;
  background-color: #009eef;
  border-color: #0084c9;
}

.alert-warning {
  color: white;
  background-color: #ffbf25;
  border-color: #eeab09;
}

.alert-danger {
  color: white;
  background-color: #f11a1a;
  border-color: #d90707;
}

/* Progress Bars */
.progress-title span {
  float: right;
}

.progress {
  height: 20px;
  margin-bottom: 20px;
  background-color: #f1f1f1;
  border-radius: 3px;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.progress-bar-default {
  background-color: #777777;
}

.progress-bar {
  background-color: #000000;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.progress-bar-success {
  background-color: #86d244;
}

.progress-bar-info {
  background-color: #009eef;
}

.progress-bar-warning {
  background-color: #ffbf25;
  -webkit-transition-delay: 2s;
  transition-delay: 2s;
  -webkit-transition-duration: 10s;
  transition-duration: 10s;
}

.progress-bar-danger {
  background-color: #f11a1a;
}
/* Animations */
.animated {
  -webkit-animation-duration: 1.5s !important;
  animation-duration: 1.5s !important;
}

.second.animated {
  -webkit-animation-duration: 2.5s !important;
  animation-duration: 2.5s !important;
}

.third.animated {
  -webkit-animation-duration: 2.6s !important;
  animation-duration: 2.6s !important;
}

.fourth.animated {
  -webkit-animation-duration: 2.8s !important;
  animation-duration: 2.8s !important;
}

.fifth.animated {
  -webkit-animation-duration: 3s !important;
  animation-duration: 3s !important;
}

.sixth.animated {
  -webkit-animation-duration: 3.2s !important;
  animation-duration: 3.2s !important;
}

.seventh.animated {
  -webkit-animation-duration: 3.4s !important;
  animation-duration: 3.4s !important;
}

.eighth.animated {
  -webkit-animation-duration: 3.5s !important;
  animation-duration: 3.5s !important;
}

.nineth.animated {
  -webkit-animation-duration: 3.6s !important;
  animation-duration: 3.6s !important;
}
/* List Groups */
.list-group-item.active,
.list-group-item.active:focus,
.list-group-item.active:hover {
  color: white;
  background-color: #000000;
  border-color: #000000;
}

.list-group-item.active .list-group-item-text,
.list-group-item.active:focus .list-group-item-text,
.list-group-item.active:hover .list-group-item-text {
  color: #cccccc;
}

/* Panels */
.panel-default > .panel-heading {
  color: white;
  background-color: #777777;
  border-color: #000000;
}

.panel-default {
  border-color: #000000;
}

.panel-primary > .panel-heading {
  color: white;
  background-color: #000000;
  border-color: #000000;
}

.panel-primary {
  border-color: #000000;
}

.panel-success > .panel-heading {
  color: white;
  background-color: #86d244;
  border-color: #68b624;
}

.panel-success {
  border-color: #68b624;
}

.panel-info > .panel-heading {
  color: white;
  background-color: #009eef;
  border-color: #0084c9;
}

.panel-info {
  border-color: #0084c9;
}

.panel-warning > .panel-heading {
  color: white;
  background-color: #ffbf25;
  border-color: #eeab09;
}

.panel-warning {
  border-color: #eeab09;
}
.panel-danger > .panel-heading {
  color: white;
  background-color: #f11a1a;
  border-color: #d90707;
}
.panel-danger {
  border-color: #d90707;
}
.well {
  min-height: 19px;
  padding: 20px;
  margin-bottom: 20px;
  background-color: #f1f1f1;
  border: 1px solid #cccccc;
  border-radius: 4px;
  -webkit-box-shadow: none;
  box-shadow: none;
}
.carousel-control {
  font-size: 34px;
}
.carousel-control.left,
.carousel-control.right {
  background-image: none !important;
}
.carousel-control .lnr-chevron-left {
  position: absolute;
  top: 50%;
  left: 15%;
  z-index: 5;
  display: inline-block;
  margin-top: -10px;
  float: left;
}

.carousel-control .lnr-chevron-right {
  position: absolute;
  color: white;
  top: 50%;
  right: 15%;
  z-index: 5;
  display: inline-block;
  margin-top: -10px;
}

.carousel-indicators li {
  width: 10px;
  height: 10px;
  margin: 8px;
  border: 1px solid white;
  background-color: white;
}
.carousel-indicators li.active {
  width: 12px;
  height: 12px;
  margin: 7px;
  border-width: 2px;
  background-color: transparent;
}

/* Normal desktop :992px. */
@media (min-width: 992px) and (max-width: 1200px) {
}

/* Tablet desktop :768px. */
@media (min-width: 768px) and (max-width: 991px) {
  .product-price {
    font-size: 12px;
    height: 50px;
    line-height: 21px;
    padding: 15px 10px;
    width: 50px;
  }
  .product-title {
    font-size: 18px;
  }
}

/* small mobile :320px. */
@media (max-width: 767px) {
  .container {
    /*width: 100%;*/
  }

  .cta-content .btn {
    float: none;
  }
  .cta-text {
    display: block;
    padding: 30px 0;
    text-align: center;
  }
  #image-slider .carousel-caption h2 {
    font-size: 32px;
  }
  #image-slider .carousel-caption {
    margin-top: -24px;
  }
  .slider-content .btn.btn-primary.sm.page-scroll {
    font-size: 14px;
    margin-top: 25px;
    padding: 13px 29px;
  }
  .portfolio-filter li {
    margin-bottom: 15px;
  }
  .post-nav {
    display: none;
  }
  #video-post {
    padding-bottom: 90px;
  }
}

/* Large Mobile :480px. */
@media only screen and (min-width: 480px) and (max-width: 767px) {
  .container {
    /*width: 100%;*/
  }
  .facts-title {
    font-size: 14px;
  }
  .carousel-caption {
    left: 3%;
  }

  .post-nav {
    display: none;
  }
  #video-post {
    padding-bottom: 90px;
  }
}
#work.basic-portfolio-area.hm-p-area {
  padding-bottom: 0;
}

.testimonial-box blockquote {
  background: #95c11e none repeat scroll 0 0;
  border: medium none;
  border-radius: 5px;
  box-shadow: 0 0 4px 1px rgba(0, 0, 0, 0.05);
  font-size: 14px;
  font-style: normal;
  line-height: 21px;
  margin: 0;
  padding: 30px 15px 30px 15px;
  position: relative;
  text-align: center;
}
/*.testimonial-box blockquote:after {
  -moz-border-bottom-colors: none;
  -moz-border-left-colors: none;
  -moz-border-right-colors: none;
  -moz-border-top-colors: none;
  border-color: #fff transparent transparent;
  border-image: none;
  border-style: solid;
  border-width: 8px;
  bottom: -16px;
  content: "";
  display: block;
  height: 0;
  left: 50%;
  margin-left: -4px;
  position: absolute;
  right: 0;
  width: 0;
}*/
.testimonial-content {
  margin-top: 20px;
  position: relative;
}
.testimonial-name {
  font-size: 14px;
  margin: 0;
}
.testimonial-pos {
  font-size: 12px;
}
.testimonial-content {
  margin-top: 20px;
  position: relative;
  text-align: center;
}
#facts.funfact {
  background: rgba(0, 0, 0, 0) url("../images/fun_factBg.jpg") no-repeat scroll
    center center / cover;
  padding-bottom: 53px;
}
.page-header-area h2 {
  font-size: 20px;
  margin-bottom: 0;
  margin-top: 29px;
}
.container-area-sblog .single-post-content {
  margin-top: 91px;
  width: 100%;
}
#work.basic-portfolio-area.page-portfolio {
  padding-bottom: 0;
}
.viewmore .btn.btn-primary.sm.cta-right.page-scroll {
  display: inline-block;
  float: none;
  text-transform: uppercase;
}
.viewmore {
  display: block;
  margin-bottom: -22px;
  margin-top: 20px;
  overflow: hidden;
  text-align: center;
}
.portfolio-pg-area {
  background: hsl(0, 0%, 98%) none repeat scroll 0 0;
  padding-bottom: 107px;
}
.portfolio-pg-area #work {
  background: transparent;
  padding: 31px 0 119px;
}
.single-project {
  margin-top: 0px;
}
#single-project .single-post-content h3 {
  font-size: 22px;
  margin: 30px 0;
  text-transform: uppercase;
}
#work.related-wk {
  background: hsl(0, 0%, 98%) none repeat scroll 0 0;
  padding-bottom: 69px;
  padding-top: 135px;
}
#single-project .about-project {
  background: hsl(0, 0%, 98%) none repeat scroll 0 0;
  margin-bottom: 10px;
  padding: 21px 20px 54px;
}
.about-project .btn.btn-primary.md {
  margin: 0;
}
.single-post-content .pricing-table-button {
  padding-bottom: 0;
}

.no-gutte .portfolio-item {
  padding: 0;
  margin: 0;
}
.no-gutte .row-portfolio {
  margin: 0 15px;
}
.owl-carousel .owl-nav div {
  background: rgba(255, 255, 255, 0.8) none repeat scroll 0 0;
  height: 40px;
  left: 20px;
  line-height: 40px;
  opacity: 0;
  position: absolute;
  text-align: center;
  top: 50%;
  transform: translateY(-50%);
  transition: all 0.3s ease 0s;
  visibility: hidden;
  width: 40px;
}
.owl-carousel .owl-nav div.owl-next {
  left: auto;
  right: 20px;
}
.owl-carousel:hover .owl-nav div {
  opacity: 1;
  visibility: visible;
}
.error-area .btn.btn-primary.sm.cta-right.page-scroll {
  float: inherit;
  text-transform: uppercase;
}
.error-text {
  display: block;
  overflow: hidden;
  padding-bottom: 43px;
  padding-top: 60px;
  text-align: center;
}
#pricing.price-area.error-area {
  padding-top: 0;
}
.error-text > h1 {
  font-size: 145px;
}
.error-area h2 {
  font-size: 40px;
  margin-bottom: 33px;
  text-transform: uppercase;
}
.error-text > p {
  margin-bottom: 39px;
}
#feature.home-services {
  padding-top: 33px;
}
.home-services .page-header {
  margin-bottom: 0;
}
#about-freelancer.h2-c-ifo .company-info {
  float: right;
  padding: 56px 61px 54px;
}
.h2-c-ifo .freelancer-image {
  left: 0;
}
#work.h2-pading-pro {
  padding-top: 1px;
}
footer.footer-bg.gray-footer {
  background: hsl(0, 0%, 98%) none repeat scroll 0 0;
}
.basic-testimonial-area .page-header {
  margin-bottom: 49px;
}
.page-header {
  border-bottom: 0 none;
  margin-top: 60px;
  margin-bottom: 1px;
  padding-bottom: 3px;
  position: relative;
  text-align: center;
}
.basic-portfolio-area .page-header {
  margin-bottom: 40px;
}
#pricing.price-area.h4-price {
  padding-top: 32px;
}
.h4-price .page-header {
  padding-bottom: 22px;
}
.contact-info.h4-contact.contact-page-area-info {
  margin: 0;
  padding: 25px 0 0;
}
.h4-contact .page-header {
  margin-bottom: 55px;
}
.basic-mobile-menu .mean-nav li {
  margin: 0;
}

/*------------------------------------------------------------------
[17.Preloader]
*/

.page-loader {
  background: #fff none repeat scroll 0 0;
  bottom: 0;
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
  z-index: 9998;
}

.loader {
  background: #019875;
  position: absolute;
  display: inline-block;
  height: 40px;
  width: 40px;
  left: 50%;
  top: 50%;
  margin: -20px 0 0 -20px;
  text-indent: -9999em;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation: ball-scale 1s 0s ease-in-out infinite;
  animation: ball-scale 1s 0s ease-in-out infinite;
}

@-webkit-keyframes ball-scale {
  0% {
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes ball-scale {
  0% {
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}
/*new css */
.slider-content > h3 {
  color: #fff;
}
.slider-content.text-white p {
  color: #fff;
  width: 50%;
}
.slider_button a:hover {
  background: #000000 none repeat scroll 0 0;
  border: 1px solid #000000;
}
.slider_button2 a:hover {
  background: #000000 none repeat scroll 0 0;
  border: 1px solid #000000;
}
.slider_button3 a:hover {
  background: #000000 none repeat scroll 0 0;
  border: 1px solid #000000;
}
.slider-screen {
  padding: 150px 0 246px;
}
.hm_4 .slider-screen {
  padding: 217px 0 160px;
}
.hm_4 .slider-content.text-white h2 span {
  font-size: 90px;
  margin-top: 19px;
  text-transform: uppercase;
}
.hm_4 .cd-words-wrapper b {
  top: -10px;
}
.hm_4 .slider-content.text-white {
  text-align: center;
}
.hm_4 .slider-content.text-white .cd-words-wrapper b {
  color: #fff;
}

.loader {
  background: #94c11f none repeat scroll 0 0;
}
#service {
  margin-bottom: 60px;
  padding-bottom: 15px;
  padding-top: 32px;
}
.btn-primary:hover,
.btn-primary:focus {
  /*background-color: #94c11f !important;*/
  /*border-color: #94c11f !important;*/
}
#call-to-action.stacked {
  padding: 51px 0;
}
.cd-words-wrapper b {
  color: #94c11f;
}
.about_home_one .freelancer-image {
  left: auto !important;
}
.about_home_one .freelancer-image {
  right: -15px !important;
}
ul.basic-menu li.menu-p-right a i {
  position: relative;
  top: 5px;
  transform: rotate(180deg);
}

/* css end here */

/* ====================================================

====================================================== 


/*
   *******************************************
   Eigene Anpassungen
   *******************************************
*/

header .logo img {
  margin-left: -15px;
  margin-right: 0;
}

@media only screen and (min-width: 768px) {
  header .logo {
    padding: 18px 0 0 0;
  }
}

.slider-section {
  /* damit es nicht unter das mobile menü rutscht */
  margin-top: 91px;
}

/* --- Aufzählungspunkte und icons auch bei laengeren Texten bündig mit Text statt bündig mit icon --- */
.info-text {
  display: flex;
  align-items: flex-start; /* Icons und Text oben ausrichten */
}

.info-text i {
  margin-right: 10px; /* Abstand zwischen Icon und Text */
  flex-shrink: 0; /* Verhindert, dass das Icon schrumpft */
}

.text-align {
  display: block; /* Macht den Textblock eigenständig */
}
/* --- Ende: Aufzählungspunkte und icons auch bei laengeren Texten bündig mit Text statt bündig mit icon --- */

/*
  -----------------------------------------------------------
  Carousel Sldier von CMF
  -----------------------------------------------------------
  */

.cmf_carousel_wrapper {
  display: flex;
  justify-content: center;
  background-color: #f4f4f4;
  font-size: 18px;
  padding: 0 10px; /* Hinzufügen von Innenabstand für den Hauptcontainer */
  box-sizing: border-box; /* Sorgt dafür, dass das Padding korrekt eingerechnet wird */
  padding: 20px 0px 50px 0px;
}
.cmf_carousel {
  text-align: left;
  width: 100%;
  /*max-width: 960px;*/ /* Maximale Breite des Carousels */
  margin: 0 auto; /* Zentriert das Carousel */
  box-sizing: border-box;
}

.cmf_carousel .arrows {
  display: flex;
  justify-content: center;
  margin-bottom: 20px;
}

.cmf_carousel .arrow {
  width: 190px;
  height: 70px;
  margin-right: 5px;
  background-color: #e7e7e7;
  clip-path: polygon(0 0, 92% 0, 100% 50%, 92% 100%, 0 100%);
  border-radius: 10px;
  display: flex;
  align-items: center;
  padding-right: 25px;
  padding-left: 15px;
}

.cmf_carousel .arrow:last-child {
  margin-right: 0;
}

.cmf_carousel .arrow.active {
  background-color: #95c11e;
  color: white;
  font-weight: 600;
}

.cmf_carousel .arrow:hover {
  cursor: pointer;
}

/* Wrapper für Slides und Navigationstasten */
.cmf_carousel .slide-wrapper {
  display: flex;
  flex-direction: column; /* Vertikale Anordnung */
  align-items: center;
  max-width: 1170px;
  margin: 0 auto;
  width: 100%; /* Nimmt die volle Breite des Containers ein */
}

.cmf_carousel .slide-container {
  width: 100%; /* Immer volle Breite */
  background: white;
  border-radius: 10px;
  padding: 20px;
  margin-bottom: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box; /* Verhindert Überlauf bei Padding */
}

.cmf_carousel .slide {
  width: 100%;
  background: white;
  font-size: 24px;
  display: flex;
  align-items: center;
  justify-content: left;
  padding: 35px;
  border-radius: 10px;
}

.cmf_carousel .nav-button {
  background-color: #cfe09b;
  border: none;
  font-size: 32px;
  padding-bottom: 5px;
  cursor: pointer;
  width: 60px;
  height: 40px;
  border-radius: 8px; /* Leicht abgerundet */
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 5px; /* Abstand zwischen den Buttons */
}

.cmf_carousel .nav-buttons-wrapper {
  display: flex;
  justify-content: center;
  margin-top: 15px;
}

.cmf_carousel .slide-container p,
.cmf_carousel .slide-container ul li {
  font-size: 16px;
  text-align: left;
}

.cmf_carousel .slide-container h2 {
  font-size: 22px;
}

/* Mobile Anpassungen für Bildschirme unter 1024px */
@media (max-width: 1024px) {
  .cmf_carousel .slide-wrapper {
    padding: 0;
    text-align: center;
  }

  .cmf_carousel .slide-container {
    margin: 0; /* Entfernt den Rand in der mobilen Ansicht */
    width: 100%; /* Volle Breite für die mobile Ansicht */
  }

  .cmf_carousel .arrows {
    flex-wrap: wrap;
    width: 100%; /* Volle Breite für mobile Ansicht */
    padding: 0 10px; /* Außenabstand zum Rand */
    box-sizing: border-box; /* Stellt sicher, dass Padding korrekt berücksichtigt wird */
  }

  .cmf_carousel .arrow {
    margin: 5px 0;
  }

  .cmf_carousel .nav-button {
    width: 50px;
    height: 35px;
    font-size: 18px;
    border-radius: 8px;
  }

  .cmf_carousel .slide {
    height: auto;
    font-size: 18px;
    padding: 20px;
  }

  .cmf_carousel .slide-container p,
  .cmf_carousel .slide-container ul li {
    font-size: 14px;
  }

  .cmf_carousel .slide-container h2 {
    font-size: 18px;
    text-align: left;
  }
  .icon-section {
    display: none;
  }
}

/* Zusätzliche Anpassungen für sehr kleine Geräte (unter 480px) */
@media (max-width: 480px) {
  .cmf_carousel .arrows {
    flex-direction: column;
    align-items: flex-start;
    width: 100%; /* Volle Breite für sehr kleine Geräte */
    padding: 0 10px; /* Gleicher Außenabstand */
  }

  .cmf_carousel .arrow {
    width: 100%;
    padding: 10px;
    font-size: 16px;
    margin: 5px 0;
    flex: 1 1 100%; /* Lässt die Pfeile die volle Breite einnehmen */
  }

  .cmf_carousel .slide {
    padding: 10px;
    font-size: 14px;
  }

  .cmf_carousel .nav-button {
    width: 40px;
    height: 30px;
    font-size: 16px;
  }

  .cmf_carousel .slide-container h2 {
    font-size: 16px;
  }

  .cmf_carousel .slide-container p,
  .cmf_carousel .slide-container ul li {
    font-size: 16px;
    line-height: 20px;
  }
}