/*!
Theme Name: GrayHouse Crazycafe
Theme URI: http://underscores.me/
Author: CrazyCafe
Author URI: http://crazycafe.net
Description: CrazyCafe WordPress Theme
License: GNU General Public License v2 or laterafe WordPress Theme
Version: 1.0.1
License URI: LICENSE
Text Domain: grayhouse-crazycafe
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Base CSS
# Header CSS
# Navigation CSS
# Content CSS
# Breadcroumb CSS
# Footer CSS
# Preloader CSS
# Responsive CSS
--------------------------------------------------------------*/

/* Base CSS */

h1, h2, h3, h4, h5, h6 {
	font-weight: 400;
    color: #282c30
}

body {
    font-size: 15px;
    line-height: 1.9;
    color: #757e87
}

img {
    max-width: 100%;
    height: auto;
}

.grayhouse-boxed-layout {
    max-width: 1140px;
    margin: 20px auto;
    overflow: hidden;
}

.grayhouse-btn {
    display: inline-block;
    padding: 8px 20px;
    border-radius: 3px;
}

input[type=submit]:hover, button[type=submit]:hover {
    background-color: #000;
    color: #fff;
}

/* Header CSS */

.site-header {
	/*background-image: url(assets/img/header-bg.jpg);*/
}



.site-header {
    position: relative;
    z-index: 9;
    background-size: cover;
    background-position: center top;
    background-color: #666;
}

.site-header:after, .single-grayhouse-slide-item:after {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    content: "";
    background: #23272a;
    z-index: -1;
    display: block;
    opacity: .6;
}

.header-bottom-area {
    position: relative;
    z-index: 2;
    color: #fff;
    padding: 22px 0;
}
.header-bottom-area p:last-child {
    margin-bottom: 0;
}

.header-bottom-area:before {
    position: absolute;
    left: 0;
    top: 0;
    height: 1px;
    width: 100%;
    content: "";
    background: #fff;
    opacity: .1;
}

.header-bottom-area a {
    color: #fed40d;
}

.main-navigation {
    margin: 20px 0;
}

.site-logo {
    display: inline-block;
    padding: 23px 0;
}

.site-title {
    font-size: 30px;
    margin: 30px 0;
}

.site-title a {
    color: #fff;
}

.site-header.absolute-header {
    position: absolute;
    left: 0;
    width: 100%;
    top: 0;
    /*background: transparent;*/
}


.site-header.absolute-header:after {
    display: none;
}



/* Navigation CSS */

.main-navigation .btn > a, .grayhouse-btn {
    background: #fed40d;
    color: #000;
}

.main-navigation ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.main-navigation ul li {
    position: relative;
    display: inline-block;
}
.main-navigation ul li:hover > a {
    color: #fed40d;
    text-decoration: none;
}

.main-navigation ul li a {
    display: block;
    padding: 13px 20px;
    border-radius: 3px;
    margin-left: 10px;
    color: #fff;
}

.main-navigation ul li.btn {
    padding: 0;
}

.main-navigation ul li ul {
    position: absolute;
    left: 15px;
    top: 84px;
    width: 250px;
    background: #333;
    text-align: left;
    z-index: 9;
    opacity: 0;
    visibility: hidden;
    transition: .3s;
}

.main-navigation ul li ul a {
    padding-left: 15px;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-left: 0;
}

.main-navigation ul li li {
    display: block;
}

.main-navigation ul li li:hover > a {
    color: #333;
    background-color: #fed40d;
    border-radius: 0;
    text-decoration: none;
}

.main-navigation ul li:hover ul {
    opacity: 1;
    visibility: visible;
    top: 54px;
}

.main-navigation ul li.menu-item-has-children > a:after {
    content: "\f107";
    font-family: fontawesome;
    padding-left: 10px;
}

.main-navigation ul li ul ul {
    left: 250px;
}

.main-navigation ul li:hover ul ul {
    opacity: 0;
    visibility: hidden;
}

.main-navigation ul li:hover ul li:hover ul {
    opacity: 1;
    visibility: visible;
    top: 0;
}

.main-navigation ul ul li.menu-item-has-children > a:after {
    float: right;
    content: "\f105";
}

.responsive-menu-wrap {display: none}

.responsive-menu-wrap {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 9;
}

.slicknav_menu .slicknav_menutxt {
    display: none;
}

.slicknav_btn {
    background: none;
    padding: 18px;
}

.slicknav_menu {
    padding: 0;
    background: none;
}

.slicknav_menu .slicknav_icon-bar {
    box-shadow: 0 0 0;
}

.slicknav_nav {
    background: #333;
    width: 250px;
}

.slicknav_nav .slicknav_row:hover, .slicknav_nav a:hover {
    background: #fff;
    color: #333;
    text-decoration: none;
    border-radius: 0;
}

.slicknav_nav .slicknav_row:hover a {
    color: #333;
}

.slicknav_nav .slicknav_row, .slicknav_nav a {
    margin: 0;
}

.slicknav_nav li {
    padding: 0px;
    text-align: left;
    font-size: inherit;
    line-height: inherit;
    border: none;
}

.main-navigation .btn > a:hover {
    background-color: #333;
    color: #fff;
}

.news-ticker-title {
    float: left;
    margin-right: 15px;
    font-weight: 600;
}

.news-ticker-wrap {

}

.news-ticker-wrap ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.news-ticker-wrap a {
    color: #fff;
}



/* Breadcroumb CSS */

.page-heading-wrap {
    background: #f4f6f9;
    padding-top: 90px;
    padding-bottom: 20px;
    color: #626871;
}

.page-heading-wrap h2 {
    color: #282c30;
}

span[typeof="ListItem"] a.home {
    display: inline-block;
    position: relative;
    padding-right: 10px;
}

span[typeof="ListItem"] a {
    padding-right: 10px;
}

span[typeof="ListItem"] a.home span {
    display: none;
}

span[typeof="ListItem"] a.home:before {
    content: "\f015";
    font-family: fontawesome;
    color: #9ca5b1;
    font-size: 115%;
}

span[typeof="ListItem"] {
    padding-left: 10px;
}

/* Content CSS */

.content-area {
    background-color: #f4f6f9;
}
.grayhouse-v-composer-disabled {
    padding-bottom: 80px;
}

.site-blog-content-area {
    padding-bottom: 80px;
}

a.grayhouse-btn:hover {
    background-color: #000;
    color: #fff;
    border-color: #333;
    text-decoration: none;
}

.site-blog-content-area article a.grayhouse-btn {
    margin-top: 15px;
}
.site-blog-content-area article a.grayhouse-btn:hover {
    color: #fff;
}

/* Footer CSS */

.footer-top-area {
    background: #272c30;
    padding-bottom: 50px;
    padding-top: 20px;
}

.footer-top-area, .footer-top-area a {
    color: #acb0b4;
}

.footer-top-area strong,
 .footer-top-area h2 {
    color: #fff;
}




.footer-top-area .col.widget.widget_nav_menu {
    flex-basis: 7%;
}

.footer-top-area h2 {
    font-size: 24px;
    margin-bottom: 30px;
}

.footer-top-area ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.footer-top-area .widget {
    background: transparent;
    box-shadow: 0 0 0;
    padding: 70px 15px 0;
}

.site-footer {
    font-size: 90%;
}

.site-info {
    background: #24282c;
    padding: 20px 0;
}

.site-info p:last-child {
    margin-bottom: 0;
}

.site-info, .site-info a {
    color: #acb0b4;
}

.site-info a {
    text-decoration: underline;
}


/* Preloader CSS */

.site-preloader-wrap {
    position: fixed;
    z-index: 99;
    height: 100%;
    width: 100%;
    background: #272c30;
    top: 0;left: 0
}

.site-preloader-wrap .spinner {
    background-color: #ffd83f;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -20px;
    margin-top: -20px;
}

.spinner {
  width: 40px;
  height: 40px;

  border-radius: 100%;  
  -webkit-animation: sk-scaleout 1.0s infinite ease-in-out;
  animation: sk-scaleout 1.0s infinite ease-in-out;
}

@-webkit-keyframes sk-scaleout {
  0% { -webkit-transform: scale(0) }
  100% {
    -webkit-transform: scale(1.0);
    opacity: 0;
  }
}

@keyframes sk-scaleout {
  0% { 
    -webkit-transform: scale(0);
    transform: scale(0);
  } 100% {
    -webkit-transform: scale(1.0);
    transform: scale(1.0);
    opacity: 0;
  }
}




/* Responsive CSS */



/* Medium Layout: 1280px. */
@media only screen and (min-width: 992px) and (max-width: 1200px) { 
    .main-navigation ul li a {
        padding: 13px 10px;
    }  
    .footer-top-area .col.widget.widget_nav_menu {
        flex-basis: 0%;
    }
    .grayhouse-slides .owl-dots {width: 926px} 
    .news-ticker-wrap {
        max-width: 75%;
    }
    .grayhouse-boxed-layout {
        max-width: 960px;
    }
    
}
/* Tablet Layout: 768px. */
@media only screen and (min-width: 768px) and (max-width: 991px) { 
.service-box-content {
    font-size: 13px;
    padding: 10px 20px;
}  
.cta-overlay.vc_column_container .vc_column-inner > .wpb_wrapper {
    padding: 48px 0px;
    padding-right: 0;
}  
.grayhouse-boxed-layout {
    max-width: 750px;
}
    
}
/* Tablet & Mobile Layout: 768px. */
@media only screen and (max-width: 991px) { 
.site-title {
    margin: 15px 0;
} 
.main-navigation {
    display: none;
}
.news-ticker-wrap {
    float: none;
    max-width: 100%;
}
.news-ticker-title {
    float: none;
    margin-right: 0;
}
.header-bottom-area {
    text-align: center;
}
.header-bottom-area .text-right {
    text-align: center !important;
}
.slider-right-content {
    position: relative;
    background: #333;
    color: #fff;
    padding: 30px;
}
.grayhouse-service-box, .grayhouse-single-project {
    margin-bottom: 30px;
}
.cta h2 {
    font-size: 30px;
    line-height: 42px;
}
.footer-top-area .widget {
    flex-basis: 100%;
    padding: 0 15px;
    margin-bottom: 0;
}
.footer-top-area {
    padding-top: 50px;
}
.footer-top-area .col.widget.widget_nav_menu {
    flex-basis: 100%;
}

.responsive-menu-wrap {
    display: block;
}
.page-heading-wrap .text-right {
    text-align: left !important;
}
.service-text {
    padding-left: 0;
}
.site-blog-content-area article, .widget {
    padding: 15px;
}
.nav-links {
    margin-bottom: 25px;
}
.nav-links a {
    margin-bottom: 5px;
}
.single-project .entry-content {
    max-width: 100%;
}
.site-logo {
    padding: 10px 0;
}
.slider-right-content {
    bottom: 0
}
.cta-overlay.vc_column_container .vc_column-inner {
    margin-left: 0;
    margin-right: 0;
}
.grayhouse-slides .owl-dots {
    width: 100%;
    text-align: center;
}
.slider-right-content .text-right {
    text-align: center !important;
}
.grayhouse-slide-text {
    padding-top: 120px;
}
.cta-overlay.vc_column_container .vc_column-inner {
    width: 100%;
}
.padding-fix .vc_column-inner {
    padding-left: 15px !important;
}
    
}
/* Mobile Layout: 320px. */
@media only screen and (max-width: 767px) { 
.grayhouse-boxed-layout {
    max-width: 90%;
} 
.padding-fix .vc_column-inner {
    padding-top: 0 !important;
}
    
}
/* Wide Mobile Layout: 480px. */
@media only screen and (min-width: 480px) and (max-width: 767px) { 
.grayhouse-boxed-layout {
    max-width: 90%;
}    

}
.vidbg-container{background-color:unset!important;}