/*------------------------------------------------------------------

[Main Stylesheet]

Project     :   ColorHost - Responsive HTML5 Web Hosting and WHMCS Template
Version     :   2.9
Author      :   ThemeLooks
Author URL  :   https://themeforest.net/user/themelooks


NOTE:
------
PLEASE DO NOT EDIT THIS CSS, YOU MAY NEED TO USE "custom-style.css" FILE FOR WRITING YOUR CUSTOM CSS.
WE MAY RELEASE FUTURE UPDATES SO IT WILL OVERWRITE THIS FILE. IT'S BETTER AND SAFER TO USE "custom-style.css".


[TABLE OF CONTENTS]

1. GENERAL STYLES
    1.1. SECTION TITLE
    1.2. SECTION TITLE OPTIONS
    1.3. SECTION FOOTER
    1.4. BACKGROUND IMAGE
    1.5. BACKGROUND OVERLAY
    1.6. BACKGROUND COLORS
    1.7. BORDERS
    1.8. CUSTOM BUTTONS
    1.9. PRELOADER
    1.10. BACK TO TOP BUTTON

2. HEADER AREA
    2.1. HEADER NAVBAR
    2.2. HEADER NAVBAR TOGGLE BUTTON
    2.3. HEADER NAVBAR BRAND
    2.4. HEADER NAV
    2.5. HEADER CUSTOM BUTTON

3. PAGE HEADER AREA
    3.1. PAGE HEADER TITLE
    3.2. PAGE HEADER BREADCRUMB

4. BANNER AREA
    4.1. BANNER SLIDER
    4.2. BANNER ITEM
    4.3. BANNER CONTENT
    4.4. BANNER SLIDER NAV

5. PRICING AREA
    5.1. PRICING SLIDER ITEM
    5.2. PRICING ITEM
    5.3. PRICING POPULAR TAG
    5.4. PRICING HEADER
    5.5. PRICING BODY
    5.6. PRICING FOOTER

6. PRICE DETAILS AREA
    6.1. PRICE DETAILS ITEM
    6.2. PRICE DETAILS HEAD
    6.3. PRICE DETAILS BODY
    6.4. PRICE DETAILS TABLE

7. VPS PRICING AREA
    7.1. VPS SLIDER

8. DOMAIN SEARCH AREA
    8.1. DOMAIN SEARCH FORM
    8.2. OPTIONS

9. EXTENSION PRICE AREA
    9.1. EXTENSION PRICE ITEM

10. SERVICES AREA
    10.1. SERVICE ITEM
    10.2. SERVICE ICON
    10.3. SERVICE CONTENT

11. FEATURES AREA
    11.1. FEATURES IMAGE
    11.2. FEATURES ITEMS
    11.3. FEATURES ITEM

12. COUNTER AREA
    12.1. COUNTER ITEM
    12.2. COUNTER NUMBER
    12.3. COUNTER TITLE

13. TESTIMONIAL AREA
    13.1. TESTIMONIAL SLIDER
    13.2. TESTIMONIAL CONTENT

14. BLOG AREA
    14.1. POST ITEM
    14.2. POST CONTENT
    14.3. POST TITLE
    14.4. POST META
    14.5. POST EXCEPT
    14.6. POST FULL CONTENT
    14.7. BLOG CONTENT
    14.8. BLOG SIDEBAR
    14.9. BLOG WIDGET
    14.10. BLOG WIDGET TITLE
    14.11. BLOG SEARCH WIDGET
    14.12. BLOG RECENT POSTS WIDGET
    14.13. BLOG LINKS WIDGET
    14.14. BLOG TAGS WIDGET
    14.15. POST COMMENTS TITLE
    14.16. POST COMMENTS
    14.17. POST COMMENT FORM

15. ABOUT DESCRIPTION AREA
    15.1. ABOUT DESCRIPTION IMAGE

16. TEAM AREA
    16.1. TEAM ITEM
    16.2. TEAM SOCIAL

17. FAQ AREA
    17.1. FAQ CATEGORIES
    17.2. FAQ CONTENT
    17.3. FAQ PANEL SIMPLE

18. LOGIN AREA
    18.1. LOGIN FORM

19. CONTACT AREA
    19.1. CONTACT FORM

20. MAP AREA

21. 404 AREA
    21.1. 404 CONTENT
    21.2. 404 SEARCH BAR

22. FOOTER AREA
    22.1. FOOTER WIDGETS
    22.2. FOOTER COPYRIGHT

23. HELPER CLASSES
    23.1. RESET-GUTTER
    23.2. RESET-MARGIN
    23.3. RESET-PADDING
    23.4. VERTICAL-CENTERING
    23.5. COLUMN CENTERING

-------------------------------------------------------------------*/

/*--------------------------------
    1. GENERAL STYLES
--------------------------------*/
html,
body {
    height: 100%;
}

body {
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #737373;
}

h1, h2, h3, h4, h5, h6, blockquote {
    font-family: 'Oswald', sans-serif;
    font-weight: 400;
}

.wrapper {
    height: 100%;
}

a,
a:link,
a:visited,
a:hover,
a:active {
    color: #737373;
    text-decoration: none;
    outline: 0;
}

p:last-child {
    margin-bottom: 0;
}

.fa.fm {
    margin-right: 10px;
}

/* 1.1. SECTION TITLE */
.section--title {
    margin-bottom: 60px;
    text-align: center;
}

.section--title h2 {
    position: relative;
    margin: -9px 0 20px;
    padding-bottom: 25px;
    color: #303030;
    font-size: 60px;
    line-height: 68px;
}

.section--title h2:before {
    content: " ";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    width: 60px;
    height: 2px;
    margin: 0 auto;
    background-color: #ff4718;
}

/* 1.2. SECTION TITLE OPTIONS */
.section--title.hide--border h2 {
    margin-bottom: -7px;
    padding-bottom: 0;
}

.section--title.hide--border h2:before {
    display: none;
}

/* 1.3. SECTION FOOTER */
.section--footer {
    margin-top: 60px;
}

.section--footer .btn--default {
    color: #303030;
    border-color: #303030;
}

/* 1.4. BACKGROUND IMAGE */
.bg--img {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

/* 1.5. BACKGROUND OVERLAY */
.bg--overlay {
    position: relative;
    z-index: 0;
}

.bg--overlay:before {
    content: " ";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: -webkit-linear-gradient(left, rgba(2, 18, 78, 0.6) 0%, rgba(255, 71, 24, 0.6) 100%);
    background: linear-gradient(to right, rgba(2, 18, 78, 0.6) 0%, rgba(255, 71, 24, 0.6) 100%);
    z-index: -1;
}

/* 1.6. BACKGROUND COLORS */
.bg--lightgrey {
    background-color: #f0f0f0;
}

.bg--lightergrey {
    background-color: #f8f8f8;
}

.bg--vermilion {
    background-color: #ff4718;
}

.bg--dark {
    background-color: #303030;
}

/* 1.7. BORDERS */
.bd--bottom {
    border-bottom: 1px solid #e9e9e9;
}

.bd--top-bottom {
    border-style: solid;
    border-width: 1px 0;
    border-color: #e9e9e9;
}

/* 1.8. CUSTOM BUTTONS */
.btn--default,
a.btn--default {
    display: inline-block;
    padding: 10px 25px;
    color: #fff;
    border: 1px solid #fff;
    border-radius: 100px;
    font-family: 'Oswald', sans-serif;
    -webkit-transition: color .25s ease, border-color .25s ease;
            transition: color .25s ease, border-color .25s ease;
    outline: 0;
}

.btn--default.hover:hover,
a.btn--default.hover:hover {
    color: #ff4718;
    border-color: #ff4718;
}

.btn--primary,
a.btn--primary {
    background-color: #ff4718;
    border-color: #ff4718;
}

/* 1.9. PRELOADER */
#preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #ff4718;
    z-index: 9999999999;
}

.preloader--spinners {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 40px;
    height: 40px;
    margin-top: -20px;
    margin-left: -20px;
    -webkit-animation: preloaderRotate 2s infinite linear;
            animation: preloaderRotate 2s infinite linear
}

.preloader--spinner {
    width: 60%;
    height: 60%;
    display: inline-block;
    position: absolute;
    top: 0;
    background-color: #fff;
    border-radius: 100%;
    -webkit-animation: preloaderBounce 2s infinite ease-in-out;
            animation: preloaderBounce 2s infinite ease-in-out
}

.preloader--spinner-2 {
    top: auto;
    bottom: 0;
    -webkit-animation-delay: -1s;
            animation-delay: -1s
}

@-webkit-keyframes preloaderRotate {
    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes preloaderRotate {
    100% {
        -webkit-transform: rotate(360deg);
                transform: rotate(360deg);
    }
}

@-webkit-keyframes preloaderBounce {
    0%, 100% {
        -webkit-transform: scale(0);
    }

    50% {
        -webkit-transform: scale(1);
    }
}

@keyframes preloaderBounce {
    0%,100% {
        -webkit-transform: scale(0);
                transform: scale(0);
    }

    50% {
        -webkit-transform: scale(1);
                transform: scale(1);
    }
}

/* 1.10. BACK TO TOP BUTTON */
#backToTop {
    position: fixed;
    right: 30px;
    bottom: 45px;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        filter: alpha(opacity=0);
       opacity: 0;
    -webkit-transition: opacity .25s ease-in-out;
            transition: opacity .25s ease-in-out;
    z-index: 999;
}

body.scrolled #backToTop {
    opacity: 1;
}

#backToTop a {
    display: block;
    min-width: 50px;
    padding: 8px 0 10px;
    color: #fff;
    background-color: #737373;
    border-radius: 50%;
    font-size: 24px;
    line-height: 32px;
    text-align: center;
}

/*--------------------------------
   2. HEADER AREA
--------------------------------*/
/* 2.1. HEADER NAVBAR */
#header .navbar {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    min-height: 0;
    padding-top: 10px;
    margin-bottom: 0px;
    border: none;
    border-radius: 0;
    font-family: 'Oswald', sans-serif;
    -webkit-transition-property: padding, background-color, box-shadow;
            transition-property: padding, background-color, box-shadow;
    -webkit-transition-duration: .25s;
            transition-duration: .25s;
    -webkit-transition-timing-function: ease-in-out;
            transition-timing-function: ease-in-out;
    z-index: 999;
}

body.scrolled #header .navbar {
    padding-top: 0;
    background-color: #303030;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.14), 0 2px 4px rgba(0, 0, 0, 0.28);
}

/* 2.2. HEADER NAVBAR TOGGLE BUTTON */
#header .navbar-toggle {
    margin-bottom: 0;
    border-color: #ff4718;
    border-radius: 50px;
    -webkit-transition: border-color .25s ease;
            transition: border-color .25s ease;
}
#header .navbar-toggle.collapsed {
    border-color: #fff;
}

#header .navbar-toggle .icon-bar {
    background-color: #ff4718;
    -webkit-transition: background-color .25s ease;
            transition: background-color .25s ease;
}
#header .navbar-toggle.collapsed .icon-bar {
    background-color: #fff;
}

/* 2.3. HEADER NAVBAR BRAND */
#header a.navbar-brand {
    height: auto;
    padding-top: 12px;
    padding-bottom: 11px;
    color: #fff;
    font-size: 26px;
    line-height: 34px;
}

#header a.navbar-brand h1 {
    margin: 0;
    font-size: inherit;
    line-height: inherit;
    font-weight: 700;
}

#header a.navbar-brand h1 span {
    color: #ff4718;
}

/* 2.4. HEADER NAV */
#headerNav .nav {
    font-family: 'Roboto', sans-serif;
}

#headerNav .nav > li > a {
    margin-left: 5px;
    padding: 18px 10px;
    color: #fff;
    border-bottom: 2px solid transparent;
    -webkit-transition: border-color .25s ease, padding .25s ease-in-out;
            transition: border-color .25s ease, padding .25s ease-in-out;
}

#headerNav .nav > li > a:hover,
#headerNav .nav > li.open > a,
#headerNav .nav > li.active > a {
    border-bottom-color: #fff;
}

#headerNav .nav > li > a:hover,
#headerNav .nav > li > a:focus,
#headerNav .nav > li.open > a,
#headerNav .nav > li.open > a:hover,
#headerNav .nav > li.open > a:focus {
    background-color: transparent;
}

#headerNav .nav > li > a > .caret {
    margin-left: 8px;
}

#headerNav .nav > .dropdown > .dropdown-menu {
    margin: 0;
    border: none;
    border-radius: 0;
}

#headerNav .nav > .dropdown > .dropdown-menu > li > a {
    padding: 8px 15px;
    font-size: 16px;
    line-height: 24px;
    font-weight: 300;
    -webkit-transition: color .25s ease-in-out, background-color .25s ease-in-out;
            transition: color .25s ease-in-out, background-color .25s ease-in-out;
}

#headerNav .nav > .dropdown > .dropdown-menu > li > a:hover,
#headerNav .nav > .dropdown > .dropdown-menu > li > a:focus,
#headerNav .nav > .dropdown > .dropdown-menu > li.active > a {
    color: #fff;
    background-color: #ff4718;
}

/* 2.5. HEADER CUSTOM BUTTON */
.header--custom-btn {
    float: right;
    margin-top: 8px;
    margin-left: 35px;
}

.header--custom-btn.btn--default {
    padding-top: 8px;
    padding-bottom: 8px;
}

#header .navbar-header .header--custom-btn {
    display: none;
}

/*--------------------------------
   3. PAGE HEADER AREA
--------------------------------*/
#pageHeader {
    padding: 154px 0 113px;
    text-align: center;
}

/* 3.1. PAGE HEADER TITLE */
.page-header--title h2 {
    position: relative;
    margin: 0;
    padding-bottom: 25px;
    color: #fff;
    font-size: 60px;
    line-height: 68px;
}

.page-header--title h2:before {
    content: " ";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    width: 60px;
    height: 2px;
    margin: 0 auto;
    background-color: #ff4718;
}

/* 3.2. PAGE HEADER BREADCRUMB */
.page-header--breadcrumb ul {
    margin-top: 25px;
    padding: 0;
    margin-bottom: 0;
    background-color: transparent;
}

.page-header--breadcrumb ul > li,
.page-header--breadcrumb ul > li:before {
    color: #fff;
}

.page-header--breadcrumb ul > li > a {
    color: #fff;
    -webkit-transition: color .25s ease;
    transition: color .25s ease;
}

.page-header--breadcrumb ul > li.active,
.page-header--breadcrumb ul > li > a:hover {
    color: #ff4718;
}

/*--------------------------------
   4. BANNER AREA
--------------------------------*/
#banner {
    position: relative;
    height: 100%;
}

/* 4.1. BANNER SLIDER */
.banner--slider {
    height: 100%;
}

.banner--slider .owl-wrapper-outer,
.banner--slider .owl-wrapper,
.banner--slider .owl-item {
    height: 100%;
}

/* 4.2. BANNER ITEM */
.banner--item {
    height: 100%;
}

/* 4.3. BANNER CONTENT */
.banner--content {
    color: #fff;
    text-align: center;
}

.banner--content h2 {
    margin: 15px 0;
    font-size: 60px;
    line-height: 68px;
    font-weight: 700;
}

.banner--content h3 {
    font-family: 'Roboto', sans-serif;
    margin: 15px 0;
    font-size: 30px;
    line-height: 38px;
    font-weight: 300;
}

.banner--content .btn--default {
    margin-top: 12px;
}

/* 4.4. BANNER SLIDER NAV */
.banner--slider-nav {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    font-family: 'Oswald', sans-serif;
    z-index: 0;
}

.banner--slider-nav ul > li {
    float: left;
    width: 33.33333333%;
    padding: 24px 0 26px;
    color: #303030;
    background-color: #fff;
    border-right: 1px solid #e9e9e9;
    border-bottom: 1px solid #e9e9e9;
    font-size: 30px;
    line-height: 38px;
    font-weight: 500;
    text-align: center;
    -webkit-transition: color .25s ease, border-color .25s ease, background-color .25s ease-in-out;
            transition: color .25s ease, border-color .25s ease, background-color .25s ease-in-out;
    cursor: pointer;
}

.banner--slider-nav ul > li:hover,
.banner--slider-nav ul > li.active {
    color: #fff;
    background-color: #ff4718;
    border-color: #ff4718;
}

.banner--slider-nav ul > li:before,
.banner--slider-nav ul > li:after {
    content: " ";
    position: absolute;
    left: 0;
    right: 0;
    width: 0;
    height: 0;
    margin: 0 auto;
    display: none;
    border-style: solid;
    z-index: -1;
}

.banner--slider-nav.has--bs ul > li:before,
.banner--slider-nav.has--ps ul > li:after {
    display: block;
}

.banner--slider-nav ul > li:before {
    top: 0;
    border-width: 0 15px 15px 15px;
    border-color: transparent transparent #ff4718 transparent;
    -webkit-transition: top .25s ease-in-out;
            transition: top .25s ease-in-out;
}

.banner--slider-nav ul > li:after {
    bottom: 0;
    border-width: 15px 15px 0 15px;
    border-color: #ff4718 transparent transparent transparent;
    -webkit-transition: bottom .25s ease-in-out;
            transition: bottom .25s ease-in-out;
}

.banner--slider-nav ul > li:hover:before,
.banner--slider-nav ul > li.active:before {
    top: -15px;
}

body.scrolled .banner--slider-nav.has--bs.has--ps ul > li:hover:before,
body.scrolled .banner--slider-nav.has--bs.has--ps ul > li.active:before {
    top: 0;
}

body.scrolled .banner--slider-nav.has--bs.has--ps ul > li:hover:after,
body.scrolled .banner--slider-nav.has--bs.has--ps ul > li.active:after {
    bottom: -15px;
}

/*--------------------------------
   5. PRICING AREA
--------------------------------*/
#pricing {
    padding: 80px 0;
}

.pricing--wrapper {
    padding-top: 45px;
    overflow: hidden;
}

/* 5.1. PRICING SLIDER ITEM */
.pricing--slider-item {
    padding-top: 45px;
}

/* 5.2. PRICING ITEM */
.pricing--item {
    padding: 40px;
    background-color: #fff;
    border-right: 1px solid #e9e9e9;
    -webkit-transition: box-shadow .25s ease-in-out;
            transition: box-shadow .25s ease-in-out;
    text-align: center;
    z-index: 0;
}

.pricing--item:hover,
.pricing--item.popular {
    box-shadow: 0 16px 24px 2px rgba(0,0,0,.14),0 6px 30px 5px rgba(0,0,0,.12),0 8px 10px -5px rgba(0,0,0,.2);
    z-index: 1;
}
.pricing--item:hover{
    z-index: 2;
}

.pricing--item:last-child {
    border-right: none;
}

.pricing--item.popular {
    margin-top: -45px;
    color: #fff;
    background-color: #ff4718;
    border-color: #ff4718;
}

/* 5.3. PRICING POPULAR TAG */
.pricing--popular-tag {
    display: inline-block;
    margin-bottom: 30px;
    padding: 9px 30px;
    color: #ff4718;
    background-color: #fff;
    font-family: 'Oswald', sans-serif;
    font-size: 36px;
    line-height: 44px;
}

/* 5.4. PRICING HEADER */
.pricing--header h2 {
    margin: -4px 0 0;
    color: #303030;
    font-size: 36px;
    line-height: 40px;
}

.pricing--item.popular .pricing--header h2 {
    color: #fff;
}

/* 5.5. PRICING BODY */
.pricing--body {
    padding-left: 30px;
    padding-right: 30px;
}

.pricing--body h3 {
    margin: 0;
    padding: 18px 0 15px;
    color: #303030;
    font-size: 16px;
    line-height: 20px;
}

.pricing--item.popular .pricing--body h3 {
    color: #fff;
}

.pricing--body h3 strong {
    display: block;
    margin-top: 5px;
    color: #ff4718;
    font-size: 48px;
    line-height: 56px;
}

.pricing--item.popular .pricing--body h3 strong {
    color: #fff;
}

/* 5.6. PRICING FOOTER */
.pricing--footer {
    margin-top: 26px;
}

.pricing--footer .btn--default {
    color: #303030;
    border-color: #303030;
}

.pricing--item.popular .pricing--footer .btn--default {
    color: #fff;
    border-color: #fff;
}

/*--------------------------------
   6. PRICE DETAILS AREA
--------------------------------*/
.price--details {
    padding: 80px 0;
}

/* 6.1. PRICE DETAILS ITEM */
.price-details--item .heading {
    color: #303030;
    min-height: 74px;
    padding: 20px 0;
    font-family: 'Oswald', sans-serif;
    font-size: 24px;
    line-height: 32px;
    text-align: center;
}

/* 6.2. PRICE DETAILS HEAD */
.price-details--item.head .content,
.price-details--item.body .content {
    border-top: 1px solid #e9e9e9;
}

.price-details--item.head .content ul,
.price-details--item.body .content ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.price-details--item.head .content li {
    padding: 10px 20px;
    border-style: solid;
    border-width: 0 1px 1px;
    border-color: #e9e9e9;
    background-color: #fff;
    font-family: 'Oswald', sans-serif;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.price-details--item.head .content li:nth-child(even) {
    background-color: #f8f8f8;
}

/* 6.3. PRICE DETAILS BODY */
.price-details--item.body .heading {
    margin-left: -1px;
    background-color: #fff;
    border-top: 1px solid #e9e9e9;
    border-left: 1px solid #e9e9e9;
}

.price-details--item.body:last-child .heading {
    border-right: 1px solid #e9e9e9;
}

.price-details--item.body .content li {
    border: 0;
    padding: 10px 20px;
    background-color: #fff;
    border-right: 1px solid #e9e9e9;
    border-bottom: 1px solid #e9e9e9;
    text-align: center;
    overflow: hidden;
}

.price-details--item.body .content li:nth-child(even) {
    background-color: #f8f8f8;
}

.price-details--item.body .content li strong {
    display: none;
}

.price-details--item.body .content .action-btn {
    padding: 20px 0;
    background-color: #fff;
    border-style: solid;
    border-width: 0 1px 1px 0;
    border-color: #e9e9e9;
    text-align: center;
}

.price-details--item.body:nth-child(2) .content .action-btn {
    border-left: 1px solid #e9e9e9;
}

.price-details--item .btn--default {
    color: #303030;
    border-color: #303030;
}

/* 6.4. PRICE DETAILS TABLE */
.price-details--table table {
    width: 100%;
    background-color: #fff;
    text-align: center;
}

.price-details--table.text-left table {
    text-align: left;
}

.price-details--table table th {
    text-align: center;
}

.price-details--table.text-left table th {
    text-align: left;
}

.price-details--table thead {
    color: #fff;
    background-color: #303030;
    font-family: 'Oswald', sans-serif;
}

.price-details--table thead th {
    padding: 15px;
}

.price-details--table tbody {
    border-style: solid;
    border-width: 0 1px 1px;
    border-color: #e9e9e9;
}

.price-details--table tbody tr {
    border-bottom: 1px dotted #e9e9e9;
}

.price-details--table tbody tr:last-child {
    border-bottom: none;
}

.price-details--table tbody td {
    padding: 20px 15px;
}

.price-details--table tbody td:first-child {
    font-family: 'Oswald', sans-serif;
    font-weight: 700;
}

.price-details--table tbody td .btn--default {
    min-width: 106px;
    color: #303030;
    border-color: #303030;
}

.price-details--table tbody td strong {
    display: none;
}

/*--------------------------------
   7. VPS PRICING AREA
--------------------------------*/
#vpsPricing {
    padding: 218px 0 150px;
}

#vpsPricing .section--title h2 {
    color: #fff;
}

/* 7.1. VPS SLIDER */
.vps-pricing--slider-holder {
    position: relative;
    padding: 40px 60px;
    background-color: rgba(255, 255, 255, 0.9);
    border-radius: 4px;
}

.vps-pricing--slider-holder .pips {
    position: absolute;
    left: 60px;
    right: 60px;
    height: 10px;
    overflow: hidden;
}

.vps-pricing--slider-holder .pip {
    position: absolute;
    top: 2px;
    left: 0;
    width: 5px;
    height: 5px;
    background-color: #fff;
    border-radius: 50%;
    z-index: 2;
}

.vps-pricing--slider-holder .pip:first-child {
    margin-left: -5px;
}

.vps-pricing--slider {
    height: 10px;
    background-color: #303030;
    border: none;
    border-radius: 20px;
    cursor: pointer;
}

.vps-pricing--slider .ui-slider-range {
    background-color: #303030;
    border-radius: 20px;
}

.vps-pricing--slider .ui-slider-handle {
    position: relative;
    left: 33.3333%;
    top: -9px;
    width: auto;
    height: auto;
    margin-left: -7px;
    background-color: transparent;
    border: none;
    outline: 0;
    cursor: pointer;
}

.vps-pricing--slider .ui-slider-handle:before {
    content: " ";
    position: absolute;
    left: -1px;
    width: 0;
    height: 0;
    border-style: solid;
}

.vps-pricing--slider .ui-slider-handle:before {
    top: -30px;
    border-width: 10px 10px 0 10px;
    border-color: #ff4718 transparent transparent transparent;
}

.vps-pricing--slider .ui-slider-handle i.fa {
    position: relative;
    color: #ff4718;
    font-size: 24px;
    line-height: 26px;
    z-index: 0;
}

.vps-pricing--slider .fa-map-marker:after {
    content: " ";
    position: absolute;
    top: 8px;
    left: 4px;
    width: 11px;
    height: 11px;
    background-color: #fff;
    z-index: -1;
}

.vps-pricing--slider .ui-slider-handle i.fa-circle:after {
    content: " ";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 5px;
    height: 5px;
    margin: -2px 0 0 -3px;
    background-color: #fff;
    border-radius: 50%;
}

.vps-pricing--slider .ui-slider-handle em {
    display: block;
    position: absolute;
    top: -70px;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: 80px;
    padding: 8px 0;
    color: #fff;
    background-color: #ff4718;
    border-radius: 50px;
    font-style: normal;
    text-align: center;
}

.vps-pricing--features {
    margin-top: 10px;
    background-color: rgba(255, 255, 255, 0.9);
    border-radius: 4px;
}

.vps-pricing--feature {
    padding-top: 20px;
    padding-bottom: 18px;
    color: #303030;
    border-right: 1px solid #e9e9e9;
}

.vps-pricing--features > .row > div:nth-last-child(2) {
    border-right: none;
}

.vps-pricing--feature i.fa {
    display: block;
    float: left;
    height: 100%;
    margin-left: 18px;
    color: #ff4718;
    font-size: 40px;
    line-height: 44px;
}

.vps-pricing--feature-name,
.vps-pricing--feature-value {
    display: block;
    margin-left: 75px;
}

.vps-pricing--feature-name {
    font-family: 'Oswald', sans-serif;
    font-weight: 400;
}

.vps-pricing--action-btn {
    margin-top: 20px;
    text-align: right;
}

.vps-pricing--action-btn .btn--default {
    margin-right: 15px;
    color: #303030;
    background-color: transparent;
    border-color: #303030;
}

/*--------------------------------
   8. DOMAIN SEARCH AREA
--------------------------------*/
#domainSearch {
    padding: 80px 0;
}

#domainSearch.bg--img .section--title,
#domainSearch.bg--img .section--title h2 {
    color: #fff;
}

/* 8.1. DOMAIN SEARCH FORM */
.ds--form-input {
    position: relative;
}

.ds--form-input .text--input {
    width: 100%;
    min-height: 56px;
    padding: 15px 20px;
    color: #fff;
    background-color: transparent;
    border: 1px solid #fff;
    border-radius: 50px;
    outline: 0;
}

.ds--form-input .btn--default {
    position: absolute;
    top: 0;
    right: 0;
    margin: 5px;
    padding-left: 60px;
    padding-right: 60px;
}

.ds--form-ext {
    margin-top: 22px;
    margin-bottom: -7px;
}

.ds--form-ext label {
    display: table-cell;
    width: 1%;
    margin-bottom: 0;
    color: #fff;
    font-size: 22px;
    line-height: 30px;
    font-weight: 300;
    text-align: center;
}

.ds--form-ext label input {
    display: none;
}

.ds--form-ext label span {
    position: relative;
    padding-left: 25px;
    cursor: pointer;
}

.ds--form-ext label span:before {
    content: " ";
    position: absolute;
    bottom: 5px;
    left: 0;
    width: 18px;
    height: 18px;
    border: 2px solid #fff;
    border-radius: 50%;
    -webkit-transition: background-color .25s ease-in-out;
            transition: background-color .25s ease-in-out;
}

.ds--form-ext label input:checked + span:before {
    background-color: #fff;
}

/* 8.2. OPTIONS */
#domainSearch.ds--lg {
    padding: 217px 0 151px;
}

/*--------------------------------
   9. EXTENSION PRICE AREA
--------------------------------*/
#extPrice {
    padding: 50px 0;
}

/* 9.1. EXTENSION PRICE ITEM */
.ext-price--item {
    padding-top: 15px;
    padding-bottom: 20px;
    color: #fff;
    border-right: 1px solid rgba(255, 255, 255, 0.3);
    font-size: 28px;
    line-height: 36px;
    text-align: center;
}

.ext-price--item:last-child {
    border-right: none;
}

.ext-price--item span,
.ext-price--item strong {
    display: block;
}

.ext-price--item span {
    padding-bottom: 7px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}

.ext-price--item strong {
    padding-top: 9px;
    font-family: 'Oswald', sans-serif;
}

.ext-price--item strong em {
    font-style: normal;
}

/*--------------------------------
   10. SERVICES AREA
--------------------------------*/
#services {
    padding: 80px 0 20px;
}

/* 10.1. SERVICE ITEM */
.service--item {
    margin-bottom: 60px;
    text-align: center;
}

/* 10.2. SERVICE ICON */
.service--icon {
    display: inline-block;
    min-width: 86px;
    min-height: 86px;
    margin-bottom: 15px;
    padding: 23px 10px;
    color: #303030;
    border: 1px solid #303030;
    border-radius: 50%;
    font-size: 38px;
    line-height: 0;
    -webkit-transition: color .25s ease, border-color .25s ease;
            transition: color .25s ease, border-color .25s ease;
}

.service--item:hover .service--icon {
    color: #ff4718;
    border-color: #ff4718;
}

/* 10.3. SERVICE CONTENT */
.service--content {
    padding: 0 20px;
}

.service--content h3 {
    margin: 0 0 9px;
    color: #303030;
    font-size: 28px;
    line-height: 36px;
    -webkit-transition: color .25s ease;
            transition: color .25s ease;
}

.service--item:hover .service--content h3 {
    color: #ff4718;
}

/*--------------------------------
   11. FEATURES AREA
--------------------------------*/
#features {
    padding: 80px 0;
}

/* 11.1. FEATURES IMAGE */
.features--img img {
    display: block;
    width: 100%;
}

/* 11.2. FEATURES ITEMS */
.features--items {
    margin: 0;
    padding: 0;
    list-style: none;
}

/* 11.3. FEATURES ITEM */
.features--item {
    position: relative;
    margin-bottom: 30px;
}

.features--item:last-child {
    margin-bottom: 0;
}

.features--item.dot:before,
.features--item.dot:after {
    content: " ";
    position: absolute;
    background-color: #ff4718;
}

.features--item.dot:before {
    top: 5px;
    left: -155px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
}

.features--item.dot:after {
    top: 16px;
    right: 100%;
    width: 120px;
    height: 3px;
    margin-right: 20px;
}

.features--item.dot--1:before {
    left: -32%;
}

.features--item.dot--1:after {
    width: 26%;
}

.features--item.dot--2:before {
    left: -56%;
}

.features--item.dot--2:after {
    width: 51%;
}

.features--item.dot--3:before {
    left: -70%;
}

.features--item.dot--3:after {
    width: 65%;
}

.features--item h3 {
    margin: 0 0 10px;
    color: #303030;
    font-size: 28px;
    line-height: 36px;
}

/*--------------------------------
   12. COUNTER AREA
--------------------------------*/
#counter {
    padding: 80px 0 20px;
}

/* 12.1. COUNTER ITEM */
.counter--item {
    margin-bottom: 60px;
    color: #fff;
    text-align: center;
}

/* 12.2. COUNTER NUMBER */
.counter--num {
    position: relative;
    margin-top: -9px;
    margin-bottom: 19px;
    padding-bottom: 19px;
    font-family: 'Oswald', sans-serif;
    font-size: 66px;
    line-height: 74px;
}

.counter--num:before {
    content: " ";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    width: 45px;
    height: 1px;
    margin: 0 auto;
    background-color: #ff4718;
}

/* 12.3. COUNTER TITLE */
p.counter--title {
    margin-bottom: -4px;
}

/*--------------------------------
   13. TESTIMONIAL AREA
--------------------------------*/
#testimonial {
    padding: 80px 0;
}

/* 13.1. TESTIMONIAL SLIDER */
.testimonial--slider .owl-controls {
    margin-bottom: 50px;
}

.testimonial--slider .owl-controls .owl-pagination {
    font-size: 0;
    line-height: 0;
    text-align: center;
}

.testimonial--slider .owl-controls .owl-page {
    display: inline-block;
    max-width: 100px;
    margin: 0 5px;
    opacity: 0.5;
    -webkit-transition: opacity .25s ease-in-out;
            -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
            transition: opacity .25s ease-in-out;
}

.testimonial--slider .owl-controls .owl-page.active {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.testimonial--slider .owl-controls .owl-page img {
    display: block;
    max-width: 100%;
    border-radius: 50%;
}

/* 13.2. TESTIMONIAL CONTENT */
.testimonial--content {
    color: #303030;
    text-align: center;
}

.testimonial--content blockquote {
    margin-top: -6px;
    margin-bottom: 0;
    padding: 0;
    border: none;
    font-size: 36px;
    line-height: 44px;
    font-weight: 300;
}

.testimonial--citation {
    margin-top: 30px;
}

/*--------------------------------
   14. BLOG AREA
--------------------------------*/
#blog {
    padding: 80px 0 20px;
}

/* 14.1. POST ITEM */
.post--item {
    margin-bottom: 60px;
}

/* 14.2. POST CONTENT */
.post--content-border {
    border: 1px solid #e2e2e2;
    background-color: #fff;
}

.post--content blockquote {
    margin-bottom: 10px;
    background-color: #f8f8f8;
    font-weight: 300;
    font-style: italic;
}

.post--content blockquote:last-child {
    margin-bottom: 0;
}

/* 14.3. POST TITLE */
.post--title h2 {
    color: #303030;
    margin: 0;
    padding: 25px 0 24px;
    font-size: 28px;
    line-height: 36px;
}

.post--content-border .post--title h2 {
    padding-left: 15px;
    padding-right: 15px;
}

.post--title h2 a {
    display: block;
    color: #303030;
    -webkit-transition: color .25s ease;
            transition: color .25s ease;
}

.post--title h2 a:hover {
    color: #ff4718;
}

/* 14.4. POST META */
.post--meta {
    padding: 10px 0;
    border-style: solid;
    border-width: 1px 0;
    border-color: #e2e2e2;
    font-family: 'Oswald', sans-serif;
    font-size: 14px;
    line-height: 22px;
}

.post--content-border .post--meta {
    padding-left: 16px;
    padding-right: 16px;
}

.post--meta a {
    -webkit-transition: color .25s ease;
            transition: color .25s ease;
}

.post--meta a:hover {
    color: #ff4718;
}

.post--meta a + a:before {
    content: "/";
    margin: 0 8px;
    color: #737373;
    font-weight: 300;
}

/* 14.5. POST EXCEPT */
.post--except {
    padding: 25px 15px 28px;
}

.post--except-footer {
    position: relative;
    padding: 11px 15px 10px;
    border-top: 1px solid #e2e2e2;
    font-family: 'Oswald', sans-serif;
    font-size: 14px;
    line-height: 22px;
    font-weight: 300;
}

.post--except-footer:before,
.post--except-footer:after {
    content: ' ';
    display: table;
}

.post--except-footer:after {
    clear: both;
}

.post--except-footer a {
    display: block;
    -webkit-transition: color .25s ease-in-out;
            transition: color .25s ease-in-out;
}

.post--except-footer a:hover {
    color: #ff4718;
}

.post--except-footer a.more {
    float: left;
}

.post--except-footer a.comments {
    float: right;
}

.post--except-footer a i.fa {
    margin-right: 5px;
    vertical-align: top;
    line-height: 20px;
}

/* 14.6. POST FULL CONTENT */
.post--full-content {
    padding: 25px 0 28px;
}

.post--full-content-footer {
    padding: 25px 0;
    border-style: solid;
    border-width: 1px 0;
    border-color: #e2e2e2;
}

.post--full-content-footer h4 {
    float: left;
    margin: 0 15px 0 0;
    color: #303030;
    font-size: 16px;
    line-height: 24px;
}

.post--full-content-footer ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.post--full-content-footer ul li {
    float: left;
}

.post--full-content-footer ul li + li {
    margin-left: 15px;
}

.post--full-content-footer ul li a {
    -webkit-transition: color .25s ease;
            transition: color .25s ease;
}

.post--full-content-footer ul li a:hover {
    color: #ff4718;
}

.post--full-content-footer .tags ul li:after {
    content: ",";
}

.post--full-content-footer .tags ul li:last-child:after {
    content: "";
}

.post--full-content-footer .tags + .social {
    margin-top: 20px;
}

.post--full-content-footer .social ul li + li {
    margin-left: 20px;
}

/* 14.7. BLOG CONTENT */
.blog--content {
    padding-bottom: 60px;
}

.blog--content .post--item:last-child {
    margin-bottom: 0;
}

/* 14.8. BLOG SIDEBAR */
.blog--sidebar {
    padding-bottom: 60px;
}

/* 14.9. BLOG WIDGET */
.blog--widget {
    margin-bottom: 60px;
}

.blog--widget:last-child {
    margin-bottom: 0;
}

/* 14.10. BLOG WIDGET TITLE */
.blog-widget--title h3 {
    position: relative;
    margin: -5px 0 25px;
    padding-bottom: 12px;
    color: #303030;
    font-size: 24px;
    line-height: 32px;
    font-weight: 700;
}

.blog-widget--title h3:before {
    content: " ";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 40px;
    height: 2px;
    background-color: #ff4718;
}

/* 14.11. BLOG SEARCH WIDGET */
.blog--search-widget .input--text {
    position: relative;
    display: table-cell;
    vertical-align: middle;
    z-index: 0;
}

.blog--search-widget .input--text input {
    float: none;
    display: block;
    border: none;
    box-shadow: none;
    border-radius: 0;
    background-color: transparent;
    border-bottom: 1px solid #303030;
    height: auto;
    padding: 8px 0;
}

.blog--search-widget .input--text .highlight {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    height: 2px;
    background-color: #ff4718;
    -webkit-transition: width 0.55s ease-in-out, background-color 0.25s ease-in-out;
            transition: width 0.55s ease-in-out, background-color 0.25s ease-in-out;
    z-index: 3;
}

.blog--search-widget .input--text input:focus + .highlight,
.blog--search-widget .input--text input.error + .highlight {
    width: 100%;
}

.blog--search-widget .input--text input.valid + .highlight {
    background-color: #5cb85c;
}

.blog--search-widget .input-group-addon {
    padding: 0;
    background-color: transparent;
    border: none;
}

.blog--search-widget .btn--default {
    color: #303030;
    background-color: transparent;
    border-color: #303030;
}

/* 14.12. BLOG RECENT POSTS WIDGET */
.blog--recent-posts-widget ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.blog--recent-posts-widget ul li {
    margin-bottom: 25px;
}

.blog--recent-posts-widget ul li:last-child {
    margin-bottom: 0;
}

.blog--recent-posts-widget ul li h4 {
    margin: 0 0 10px;
    color: #303030;
    line-height: 26px;
    font-weight: 900;
}

.blog--recent-posts-widget ul li h4 a {
    color: #303030;
    -webkit-transition: color 0.25s ease;
            transition: color 0.25s ease;
}

.blog--recent-posts-widget ul li h4 a:hover,
.blog--recent-posts-widget ul li h4 a:focus {
    color: #ff4718;
}

.blog--recent-posts-widget .time {
    padding: 5px 0;
    border-style: solid;
    border-width: 1px 0;
    border-color: #e9e9e9;
    font-family: 'Oswald', sans-serif;
    font-weight: 300;
}

/* 14.13. BLOG LINKS WIDGET */
.blog--links-widget ul {
    margin: -10px 0 0;
    padding: 0;
    list-style: none;
}

.blog--links-widget ul ul {
    padding-left: 20px;
}

.blog--links-widget ul li a {
    display: block;
    padding-top: 10px;
    padding-bottom: 10px;
    color: #303030;
    border-bottom: 1px dotted #303030;
    -webkit-transition: color .25s ease, border-color .25s ease;
            transition: color .25s ease, border-color .25s ease;
}

.blog--links-widget ul li a:hover {
    color: #ff4718;
    border-color: #ff4718;
}

/* 14.14. BLOG TAGS WIDGET */
.blog--tags-widget .blog-widget--title h3 {
    margin-bottom: 15px;
}

.blog--tags-widget ul {
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: 0;
}

.blog--tags-widget ul li {
    display: inline-block;
    padding: 10px 25px 0 0;
    cursor: pointer;
}

.blog--tags-widget ul li a {
    display: block;
    color: #737373;
    font-size: 16px;
    line-height: 24px;
    -webkit-transition: color 0.25s ease;
            transition: color 0.25s ease;
}

.blog--tags-widget ul li a:hover,
.blog--tags-widget ul li a:focus {
    color: #ff4718;
}

/* 14.15. POST COMMENTS TITLE */
.post--comments-title h3,
.post--comment-form-title h3 {
    position: relative;
    margin: -5px 0 30px;
    padding-bottom: 12px;
    color: #303030;
    font-size: 24px;
    line-height: 32px;
    font-weight: 700;
}

.post--comments-title h3:before,
.post--comment-form-title h3:before {
    content: " ";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 40px;
    height: 2px;
    background-color: #ff4718;
}

/* 14.16. POST COMMENTS */
.post--comments ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.post--comments ul ul {
    padding-left: 30px;
}

.post--comment {
    margin-bottom: 30px;
    padding-bottom: 30px;
    border-bottom: 1px solid #e9e9e9;
}

.post--comment-img {
    display: table-cell;
    vertical-align: middle;
}

.post--comment-meta {
    padding-left: 15px;
    display: table-cell;
    vertical-align: middle;
    font-family: 'Oswald', sans-serif;
    font-weight: 300;
}

.post--comment-meta a {
    color: #737373;
    font-weight: 400;
    -webkit-transition: color 0.25s ease;
            transition: color 0.25s ease;
}

.post--comment-meta a:hover,
.post--comment-meta a:focus {
    color: #ff4718;
}

.post--comment-body {
    padding: 15px 0;
}

.post--comment-footer .btn--default {
    padding: 8px 20px;
    color: #303030;
    background-color: transparent;
    border-color: #303030;
    font-size: 14px;
    line-height: 22px;
}

/* 14.17. POST COMMENT FORM */
.post--comment-form-title {
    margin-top: -31px;
    padding-top: 30px;
    border-top: 1px solid #e9e9e9;
}

.post--comment-form-group .form-control {
    margin-bottom: 30px;
    padding: 0;
    border-width: 0 0 1px;
    border-color: #e9e9e9;
    border-radius: 0;
    box-shadow: none;
    resize: none;
    outline: 0;
}

.post--comment-form-group .input--text {
    position: relative;
}

.post--comment-form-group .input--text .highlight {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 2px;
    background-color: #ff4718;
    -webkit-transition: width 0.55s ease-in-out, background-color 0.25s ease-in-out;
            transition: width 0.55s ease-in-out, background-color 0.25s ease-in-out;
}

.post--comment-form-group input:focus + .highlight,
.post--comment-form-group textarea:focus + .highlight,
.post--comment-form-group input.error + .highlight,
.post--comment-form-group textarea.error + .highlight {
    width: 100%;
}

.post--comment-form-group input.valid + .highlight,
.post--comment-form-group textarea.valid + .highlight {
    background-color: #5cb85c;
}

.post--comment-form-group .btn--default {
    color: #303030;
    background-color: transparent;
    border-color: #303030;
}

/*--------------------------------
   15. ABOUT DESCRIPTION AREA
--------------------------------*/
#aboutDesc {
    padding: 80px 0;
}

#aboutDesc .row-vc > div {
    float: none;
    display: table-cell;
    vertical-align: middle;
}

/* 15.1. ABOUT DESCRIPTION IMAGE */
.about-desc--img img {
    width: 100%;
}

/*--------------------------------
   16. TEAM AREA
--------------------------------*/
#team {
    padding: 80px 0 50px;
}

/* 16.1. TEAM ITEM */
.team--item {
    margin-bottom: 30px;
}

.team--name {
    margin: 0;
    padding: 20px 0 10px;
    font-weight: 900;
    text-align: center;
}

.team--name a {
    color: #303030;
    -webkit-transition: color 0.25s ease;
            transition: color 0.25s ease;
}

.team--item:hover .team--name a {
    color: #ff4718;
}

.team--role {
    margin: 0;
    color: #737373;
    font-weight: 400;
    text-align: center;
}

/* 16.2. TEAM SOCIAL */
.team--social-links {
    margin-top: 10px;
    margin-bottom: -7px;
    text-align: center;
}

.team--social-links ul {
    display: inline-block;
    font-size: 0;
    float: none;
}

.team--social-links ul li a {
    font-size: 25px; /* Hier */
    color: #acacac;
    padding: 0px 15px;
    -webkit-transition: color 0.25s ease;
            transition: color 0.25s ease;
}

.team--social-links ul li a:hover,
.team--social-links ul li a:focus {
    color: #ff4718;
    background-color: transparent;
}

/*--------------------------------
   17. FAQ AREA
--------------------------------*/
#faq {
    padding: 80px 0;
}

/* 17.1. FAQ CATEGORIES */
.faq--categories h3 {
    position: relative;
    margin: -5px 0 0;
    color: #303030;
    font-size: 20px;
    line-height: 28px;
    font-weight: 900;
    padding-bottom: 10px;
}

.faq--categories h3:before {
    content: " ";
    position: absolute;
    bottom: 0px;
    width: 40px;
    height: 2px;
    background-color: #ff4718;
}

.faq--categories ul {
    margin-top: 25px;
}

.faq--categories ul li a {
    margin-top: 6px;
    color: #303030;
    background-color: #e9e9e9;
    font-family: 'Oswald', sans-serif;
    font-weight: 900;
    -webkit-transition: color 0.25s ease, background-color 0.25s ease-in-out;
            transition: color 0.25s ease, background-color 0.25s ease-in-out;
}

.faq--categories ul li a:hover,
.faq--categories ul li.active a {
    color: #fff;
    background-color: #ff4718;
}

/* 17.2. FAQ CONTENT */
.faq--content .panel-group {
    margin-bottom: 0;
}

.faq--content .accordion .panel {
    border-radius: 0;
    box-shadow: none;
}

.faq--content .accordion .panel-heading {
    padding: 0;
}

.faq--content .accordion .panel-heading a {
    display: block;
    padding: 10px 15px;
    color: #fff;
    background-color: #ff4719;
    text-transform: capitalize;
}

.faq--content .accordion .panel-heading a.collapsed {
    background-color: #232c3b;
}

.faq--content .accordion .panel-heading a h4 {
    font-size: 14px;
    line-height: 22px;
    font-weight: 900;
    overflow: hidden;
}

.faq--content .accordion .panel-heading a h4 i.fa-minus {
    float: right;
    margin-top: 5px;
    color: #fff;
}

.faq--content .accordion .panel-heading a.collapsed i.fa-minus:before {
    content: "\f067";
}

/* 17.3. FAQ PANEL SIMPLE */
.faq--panel-simple {
    padding-bottom: 30px;
    border: none;
}

.faq--panel-simple:last-child {
    padding-bottom: 0;
}

.faq--panel-simple .panel-title {
    margin-top: -5px;
    margin-bottom: 10px;
    color: #303030;
    font-size: 24px;
    line-height: 32px;
    font-weight: 900;
    text-transform: capitalize;
}

.faq--panel-simple .panel-body {
    padding: 0;
}

/*--------------------------------
   18. LOGIN AREA
--------------------------------*/
#login {
    padding: 80px 0;
}

/* 18.1. LOGIN FORM */
.login--form {
    max-width: 380px;
    margin: 0 auto;
    padding: 30px;
    background-color: #fff;
    border-radius: 4px;
    font-family: 'Oswald', sans-serif;
    font-size: 0;
    line-height: 0;
}

.login--form .form-group {
    position: relative;
}

.login--form label {
    font-size: 16px;
    line-height: 24px;
}

.login--form input.form-control {
    box-shadow: none;
    border-radius: 0;
    height: auto;
    min-height: 38px;
    background-color: transparent;
    border-width: 0 0 1px;
    padding-left: 0;
    font-family: 'Roboto', sans-serif;
}

.login--form input.form-control:focus {
    border-color: #ccc;
}

.login--form .form-group .highlight {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    height: 2px;
    background-color: #ff4718;
    -webkit-transition: width 0.25s ease-in-out, background-color 0.25s ease-in-out;
            transition: width 0.25s ease-in-out, background-color 0.25s ease-in-out;
}

.login--form .form-group input:focus + .highlight,
.login--form .form-group input.error + .highlight {
    width: 100%;
}

.login--form .form-group input.valid + .highlight {
    background-color: #5cb85c;
}

.login--form .btn--default {
    margin-top: 15px;
    margin-right: 15px;
    color: #737373;
    background-color: transparent;
    border-color: #737373;
    font-size: 16px;
    line-height: 24px;
    vertical-align: middle;
}

/*--------------------------------
   19. CONTACT AREA
--------------------------------*/
#contact {
    padding: 80px 0;
}

/* 19.1. CONTACT FORM */
.contact--form {
    text-align: center;
}

.contact--form-status .alert {
    padding: 15px 30px;
    border-radius: 50px;
}

.contact--form label {
    font-weight: 400;
}

.contact--form .form-group {
    position: relative;
}

.contact--form .form-control {
    margin-bottom: 30px;
    border: none;
    box-shadow: none;
    border-radius: 0;
    background-color: transparent;
    border-bottom: 1px solid #e9e9e9;
    height: auto;
    padding: 8px 0;
}

.contact--form textarea.form-control {
    min-height: 172px;
    resize: none;
}

.contact--form .highlight {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    height: 2px;
    background-color: #ff4718;
    -webkit-transition: width 0.55s ease-in-out, background-color 0.25s ease-in-out;
            transition: width 0.55s ease-in-out, background-color 0.25s ease-in-out;
}

.contact--form input:focus + .highlight,
.contact--form textarea:focus + .highlight,
.contact--form input.error + .highlight,
.contact--form textarea.error + .highlight {
    width: 100%;
}

.contact--form input.valid + .highlight,
.contact--form textarea.valid + .highlight {
    background-color: #5cb85c;
}

.contact--form .btn--default {
    min-width: 100px;
    color: #303030;
    background-color: transparent;
    border-color: #303030;
}

/*--------------------------------
    20. Map Area
--------------------------------*/
#map {
    position: relative;
    min-height: 400px;
    z-index: 0;
}

#map:before {
    content: " ";
    position: absolute;
    top: 0;
    left: 0;
    display: none;
    width: 100%;
    height: 100%;
    z-index: 1;
}

/*--------------------------------
   21. 404 AREA
--------------------------------*/
/* 21.1. 404 CONTENT */
.f0f--content h2 {
    font-size: 120px;
    line-height: 148px;
}

/* 21.2. 404 SEARCH BAR */
.f0f--search-bar {
    max-width: 320px;
    margin: 0 auto;
}

.f0f--search-bar .input--text {
    position: relative;
}

.f0f--search-bar .form-control {
    margin-top: 40px;
    margin-bottom: 40px;
    border: none;
    box-shadow: none;
    border-radius: 0;
    color: #fff;
    background-color: transparent;
    border-bottom: 1px solid #fff;
    height: auto;
    padding: 8px 0;
}

.f0f--search-bar .highlight {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    height: 2px;
    background-color: #ff4718;
    -webkit-transition: width 0.55s ease-in-out, background-color 0.25s ease-in-out;
            transition: width 0.55s ease-in-out, background-color 0.25s ease-in-out;
}

.f0f--search-bar input:focus + .highlight,
.f0f--search-bar input.error + .highlight {
    width: 100%;
}

.f0f--search-bar input.valid + .highlight {
    background-color: #5cb85c;
}

.f0f--search-bar .btn--default {
    background-color: transparent;
    min-width: 120px;
    margin: 10px 5px 0;
    vertical-align: middle;
}

/*--------------------------------
   22. FOOTER AREA
--------------------------------*/
#footer {
    color: #fff;
}

/* 22.1. FOOTER WIDGETS */
.footer--widgets {
    padding-top: 50px;
}

.footer--widget {
    padding-bottom: 50px;
}

.footer--widget h4 {
    position: relative;
    margin: -5px 0 25px;
    padding-bottom: 12px;
    font-size: 24px;
    line-height: 32px;
    font-weight: 700;
}

.footer--widget h4:before {
    content: " ";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 40px;
    height: 2px;
    background-color: #ff4718;
}

.footer--widget ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.footer--widget ul ul {
    padding-left: 20px;
}

.footer--widget ul li a {
    display: block;
    padding-bottom: 10px;
    color: #fff;
    -webkit-transition: color .25s ease;
            transition: color .25s ease;
}

.footer--widget ul li a:hover {
    color: #ff4718;
}

.fw--about a.more {
    color: #ff4718;
    font-family: 'Oswald', sans-serif;
    font-weight: 700;
}

.fw--about-social {
    margin-top: 15px;
}

.fw--about-social ul {
    position: relative;
    margin: 0 -15px;
}

.fw--about-social ul:before,
.fw--about-social ul:after {
    content: " ";
    display: table;
}

.fw--about-social ul:after {
    clear: both;
}

.fw--about-social ul li {
    float: left;
}

.fw--about-social ul li a {
    display: block;
    padding: 0 15px;
    font-size: 22px; /* Hier Icon-Größe einstellen */
}

.fw--links ul {
    margin-top: -10px;
}

.fw--links li a {
    padding-top: 10px;
    border-bottom: 1px dotted #fff;
}

.fw--links li a:hover {
    border-color: #ff4718;
}

.footer--widget.fw--links li a {
    -webkit-transition: color .25s ease, border-color .25s ease;
            transition: color .25s ease, border-color .25s ease;
}

/* 22.2. FOOTER COPYRIGHT */
.footer--copyright {
    padding: 25px 0;
    background-color: #222;
    text-align: center;
}

.footer--copyright a {
    color: #ff4718;
    font-family: 'Oswald', sans-serif;
}

/*--------------------------------
   23. HELPER CLASSES
--------------------------------*/
/* 23.1. RESET-GUTTER */
.reset-gutter {
    margin-left: 0;
    margin-right: 0;
}

.reset-gutter > [class*='col-'] {
    padding-left: 0;
    padding-right: 0;
}

/* 23.2. RESET-MARGIN */
.reset-margin {
    margin-right: 0;
    margin-left: 0;
}

/* 23.3. RESET-PADDING */
.reset-padding {
    padding-right: 0;
    padding-left: 0;
}

/* 23.4. VERTICAL-CENTERING */
.vc-parent {
    width: 100%;
    height: 100%;
    display: table;
}

.vc-child {
    display: table-cell;
    vertical-align: middle;
}

.vc-child-bottom {
    display: table-cell;
    vertical-align: bottom;
}

/* 23.5. COLUMN CENTERING */
.col--center > div {
    float: none;
    display: table-cell;
    vertical-align: middle;
}
