/*

[Responsive Stylesheet]

Project: DomainWalls - Responsive Web Hosting and WHMCS Template
Version: 1.1
Author : themelooks.com

[Table of contents]

1. MEDIA QUERIES
    1.1. LARGE DEVICES, WIDE SCREENS
    1.2. MEDIUM DEVICES, DESKTOPS
    1.3. SMALL DEVICES, TABLETS
    1.4. SMALL DEVICES, SMARTPHONES
    1.5. CUSTOM, IPHONE RETINA

*/

/*------------------------------------*\
    1. MEDIA QUERIES
\*------------------------------------*/
/* 1.1. LARGE DEVICES, WIDE SCREENS */
@media screen and (max-width: 1200px) {
    /* DOMAIN SEARCH AREA */
    #domainSearch:before {
        width: 970px;
    }
}

/* 1.2. MEDIUM DEVICES, DESKTOPS */
@media screen and (max-width: 991px) {
    /* HEADER */
    .header--navbar {
        padding-top: 0;
        padding-bottom: 0;
    }
    .header--navbar .navbar-toggle {
        display: block;
        margin-top: 13px;
        margin-right: 0;
        padding-left: 0;
        padding-right: 0;
    }
    #header .navbar-toggle .icon-bar {
        background-color: #ff4719;
    }
    #header .navbar-toggle.collapsed .icon-bar {
        background-color: #fff;
    }
    #header.sticky .navbar-toggle.collapsed .icon-bar {
        background-color: #232c3b;
    }
    .header--navbar .navbar-header {
        float: none;
        padding: 15px 0;
        -webkit-transition: padding .25s ease-in-out;
                transition: padding .25s ease-in-out;
    }
    #header.sticky .navbar-header {
        padding: 0;
    }

    .header--login-btn {
        display: none;
    }

    #headerNav {
        background-color: #232c3b;
        -webkit-transition: background-color .25s ease-in-out;
                transition: background-color .25s ease-in-out;
    }
    #header.sticky #headerNav {
        background-color: #fff;
    }

    #headerNav.collapse {
        display: none !important;
    }

    #headerNav.collapsing {
        display: block !important;
    }

    #headerNav.in {
        display: block !important;
        overflow-y: auto !important;
    }

    #headerNav .nav {
        float: none !important;
        margin: 0;
        padding: 10px 0;
        border-top: 1px solid #fff;
    }

    #headerNav .nav > li {
        float: none;
    }

    #headerNav .nav > li > a {
        padding: 10px 0;
    }

    #headerNav .nav > .dropdown > .dropdown-menu {
        position: relative;
        float: none;
        background-color: rgba(34, 34, 34, 0.2);
        box-shadow: none;
        border-radius: 0;
    }

    #headerNav .nav > .dropdown > .dropdown-menu > li > a {
        color: #fff;
        padding-left: 15px;
    }
    #header.sticky .nav > .dropdown > .dropdown-menu > li > a {
        color: #232c3b;
    }
    #header.sticky .nav > .dropdown > .dropdown-menu > li > a:hover,
    #header.sticky .nav > .dropdown > .dropdown-menu > li > a:focus,
    #header.sticky .nav > .dropdown > .dropdown-menu > li.active > a {
        color: #fff;
    }

    /* BANNER AREA */
    .banner--img {
        display: none;
    }

    /* DOMAIN SEARCH AREA */
    #domainSearch:before {
        display: none;
    }

    #domainSearch .section--title h2 {
        padding-bottom: 0;
        border-bottom: none;
    }

    .service--img {
        margin-bottom: 60px;
    }
    
    /* FEATURES AREA */
    .feature--item-h {
        margin-bottom: 80px;
    }
    .feature--item-h:last-child {
        margin-bottom: 0;
    }

    /* ABOUT DESCRIPTION AREA */
    #aboutDesc > .container > .row > div {
        display: block;
    }

    .about-desc--content {
        margin-bottom: 50px;
    }

    /* PRICING AREA */
    .pricing--item-h {
        margin-bottom: 30px;
        overflow: hidden;
    }
    .pricing--item-h:last-child {
        margin-bottom: 0;
    }

    .pricing--item {
        margin-top: 50px;
    }

    /* PRICING 2 AREA */
    .pricing-2--item {
        margin-bottom: 30px;
    }
    .pricing-2--item:last-child {
        margin-bottom: 0;
    }

    /* PRICE DETAILS AREA */
    .price-details--item.head {
        display: none;
    }
    .price-details--item.body {
        margin-bottom: 30px;
    }
    .price-details--item.body:last-child {
        margin-bottom: 0;
    }
    .price-details--item .heading h3 {
        padding-right: 20px;
        border-left-width: 1px;
        color: #222;
        background-color: #fff;
        font-size: 18px;
        text-align: right;
    }
    .price-details--item.body .content li {
        border-left: 1px solid #e9e9e9;
        text-align: right;
    }
    .price-details--item.body .content li .labelText {
        float: left;
    }
    .price-details--item.body .content .action-btn {
        border-left: 1px solid #e9e9e9;
    }
    
    /* PRICE DETAILS 2 AREA */
    .price-details-2--content table {
        border: 0;
    }
    .price-details-2--content table thead {
        display: none;
    }
    .price-details-2--content table tr {
        margin-bottom: 30px;
        display: block;
        border-bottom: 2px solid #ddd;
        background-color: #fff;
    }
    .price-details-2--content table tr:last-child {
        margin-bottom: 0;
    }
    .price-details-2--content table tbody tr:nth-child(even) td {
        background-color: #fff;
    }
    .price-details-2--content table td {
        display: block;
        text-align: right;
        font-size: 13px;
        border-bottom: 1px dotted #ccc;
    }
    .price-details-2--content table td:last-child {
        border-bottom: 0;
    }
    .price-details-2--content table td span.labelText {
        float: left;
        text-transform: uppercase;
        font-weight: bold;
    }

    /* FAQ AREA */
    .faq--categories {
        margin-bottom: 40px;
    }
    .faq--categories .nav {
        overflow: hidden;
    }
    .faq--categories .nav > li {
        float: left;
    }
    .faq--categories ul li a {
        margin-right: 6px;
    }

    /* BLOG AREA */
    .blog--content + .blog--sidebar,
    .blog--sidebar + .blog--content {
        margin-top: 80px;
    }

    .blog--post-footer .share {
        margin-top: 38px;
        text-align: left;
    }
    .blog--post-footer .share li:first-child {
        margin-left: 0;
    }

    .blog--post-comments ul ul {
        padding: 0;
    }

    /* CONTACT AREA */
    .contact--address {
        margin-bottom: 50px;
    }

    .contact--form {
        padding-left: 15px;
    }
    
    .contact-social-links {
        margin-bottom: 40px;
    }

    /* FOOTER AREA */
    #footer {
        padding-top: 138px;
    }
}

/* 1.3. SMALL DEVICES, TABLETS */
@media screen and (max-width: 767px) {
    /* HEADER AREA */
    .header--navbar .navbar-toggle {
        padding-left: 15px;
        padding-right: 15px;
    }

    #headerNav .nav {
        border: 0;
    }

    /* ABOUT DESCRIPTION */
    #aboutDesc .row {
        display: block;
    }
    #aboutDesc > .container > .row > div {
        display: block;
    }
    .about-desc--img {
        margin-bottom: 35px;
    }

    /* TEAM AREA */
    .team--social-links ul {
        overflow: hidden;
    }
    .team--social-links ul li {
        float: left;
    }

    /* FOOTER AREA */
    .footer--social .nav {
        margin-left: 0;
        margin-right: 0;
        overflow: hidden;
    }
    .footer--social .nav > li {
        float: left;
    }
}

/* 1.4. SMALL DEVICES, SMARTPHONES */
@media screen and (max-width: 480px) {
    /* DOMAIN SEARCH AREA */
    .domain-search--form .input--radio {
        overflow: hidden;
    }

    .domain-search--form .input--radio .radio-inline {
        display: block;
        float: left;
        width: 50%;
        line-height: 28px;
    }

    /* CONTACT INFO AREA */
    .contact-info--item {
        float: none;
        width: 100%;
    }

    /* FOOTER AREA */
    #footer {
        padding-top: 224px;
    }
}

/* 1.5. CUSTOM, IPHONE RETINA */
@media screen and (max-width: 380px) {
}
