@import url('https://fonts.googleapis.com/css?family=Nunito:300,300i,400,400i');

body {
	padding-top: 70px;
  	background-color:#ecece4;
	font-family: 'Nunito', sans-serif;
	color:#5b5a4c;
	/* font-size:16px; */
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: 'Nunito', sans-serif;
    font-weight: 300;
    line-height: 1.1;
}

h1 {
	margin-bottom: 15px;
}

h2, h4 {
	color:#9d894c;
}

h2 {
	margin-top: 30px;
}

h4 {
	font-style:italic;
	line-height:22px;
	padding-bottom:15px;
}


a {
	color:#777777;
	text-decoration:none;
}

a:hover {
	color:#444444;
	text-decoration:none;
}

.kb-content {
	background-color:#ffffff;
	padding:20px;
}

@media (min-width: 768px) { 
	.kb-content {
		padding:40px;
	}
}

.kb-container-main {
	margin-top:20px;
}

@media (min-width: 830px) { 
	.kb-container-main {
		margin-top:50px;
	}
}

.quote-color {
	color:#9d894c;
}

.kb-quote {
	font-size:16px;
	line-height: 22px;
	padding-top: 20px;
}

.kb-quote-credit {
	font-size:16px;
	line-height: 22px;
	font-style:italic;
	padding-bottom:15px;
}


.home-container {
	background-color:#ffffff;
	padding:20px;
}

.filter li a {
	/* font-style:italic; */
}

.navbar-toggle {
	/* margin-top: 42px; */
	/* margin-top: 30px; */
	margin-top: 20px;
    margin-bottom: 20px;
}

.navbar-default {
	background-color: #ffffff;
}

.navbar-brand {
	padding: 0px;
	padding-left:15px;
	line-height: 20px;
	padding-top:6px;
}

.nav {
	/* margin-top:47px; */
	margin-top: 30px;
}

.submenu {
	list-style:none;
	padding:0;
	margin:0; 
}

.submenu li {
	display:inline;
	line-height: 20px;
}

.active {
	background-color: #ff0000;
}

.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
	color: #555555;
	background-color: #ecece4;
}

.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus {
	color: #444444;
}

.navbar-collapse .navbar-nav.navbar-right:last-child {
	margin-right: 20px;
}

.navbar-nav > li > a {
	padding-top: 13px;
}

.portfolio_tag {
	padding-top:6px;
	padding-bottom:12px; 
}

.thing a {
	color:#777777;
	text-decoration:none;
}

.thing a:hover {
	color:#444444;
	text-decoration:none;
}

#pipe {
	text-align:center;
}

#pipe ul {
	margin-left: 0;
	padding-left: 0;
	display: inline;
} 

#pipe ul li {
	margin-left: 0;
	padding: 10px 6px;
	list-style: none;
	display: inline;
	line-height: 30px;
}

.project_photos img {
	margin:0 auto;
	margin-bottom:20px;	
}

.project-video {
	margin-bottom:20px;	
}

@media (min-width: 768px) { 
	.project_photos img {
		margin:0 auto;
		margin-bottom:40px;	
	}
	.project-video {
		margin-bottom:40px;	
	}
}

.project_photos img.last {
	margin-bottom:0px;	
}

.port_img {
	width:320px;
}

@media (min-width: 768px) { 
	.port_img {
		width:150px;
	}
	.navbar-nav > li > a {
    	padding-top: 13px;
    	padding-bottom: 10px;
	}
	.home-container {
		padding:40px;
	}
}

@media (min-width: 992px) {
	.port_img {
		width:200px;
	}
	#footer {
		margin-top:50px;
	}
}

@media (min-width: 1200px) {
	.port_img {
		width:240px;
	}
}

.press-content img {
	padding-bottom:15px;
}

@media (min-width: 768px) {
.press-content img {
	padding-bottom:30px;
}
}

.press-details {
	padding-bottom:30px;
}


/* ------------------------------------------------------------------------------------ */
/* footer */
/* ------------------------------------------------------------------------------------ */

#footer {
	margin-top:10px;
	margin-bottom:20px;
}

.footer_info {
	text-align:center;
	color:#777777;
	font-size:12px;
}

a.footer-social-fb:hover {
    color: #3c579a;
}

a.footer-social-instagram:hover {
    color: #2e5d87;
}

a.footer-social-pin:hover {
    color: #C92228;
}

a.footer-social-houzz:hover {
    color: #7ac143;
}

a.footer-social-linkedin:hover {
    color: #0077B5;
}

a.footer-social-youtube:hover {
    color: #ff0000;
}

.footer_info {
    line-height: 20px;
}
@media (min-width: 992px) {
	#footer {
    	margin-top: 15px;
	}
}

.fa-2x {
    font-size: 2.5em !important;
    padding: 10px;
}

.houzz-icon {
	padding-right:20px;
	padding-left:10px;
	text-decoration:none;
}

a svg:hover #path14{ 
  fill: #53B848;
}


/* ------------------------------------------------------------------------------------ */
/* change mobile menu breakpoint */
/* ------------------------------------------------------------------------------------ */

@media (max-width: 991px) {
    .navbar-header {
        float: none;
    }
    .navbar-left,.navbar-right {
        float: none !important;
    }
    .navbar-toggle {
        display: block;
    }
    .navbar-collapse {
        border-top: 1px solid transparent;
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
    }
    .navbar-fixed-top {
        top: 0;
        border-width: 0 0 1px;
    }
    .navbar-collapse.collapse {
        display: none!important;
    }
    .navbar-nav {
        float: none!important;
        margin-top: 7.5px;
        text-align: center;
        margin:0px;
        padding-top: 30px;
    	padding-bottom: 30px;
    }
    .navbar-nav>li {
        float: none;
    }
    .navbar-nav>li>a {
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .collapse.in{
        display:block !important;
    }
}


/* ------------------------------------------------------------------------------------ */
/* fade in and up animation */
/* ------------------------------------------------------------------------------------ */

.slide-up-fade-in{
    animation: slide-up-fade-in ease 1s;
    animation-iteration-count: 1;
    transform-origin: 50% 50%;
    animation-fill-mode:forwards; /*when the spec is finished*/
    -webkit-animation: slide-up-fade-in ease 1s;
    -webkit-animation-iteration-count: 1;
    -webkit-transform-origin: 50% 50%;
    -webkit-animation-fill-mode:forwards; /*Chrome 16+, Safari 4+*/ 
    -moz-animation: slide-up-fade-in ease 1s;
    -moz-animation-iteration-count: 1;
    -moz-transform-origin: 50% 50%;
    -moz-animation-fill-mode:forwards; /*FF 5+*/
    -o-animation: slide-up-fade-in ease 1s;
    -o-animation-iteration-count: 1;
    -o-transform-origin: 50% 50%;
    -o-animation-fill-mode:forwards; /*Not implemented yet*/
    -ms-animation: slide-up-fade-in ease 1s;
    -ms-animation-iteration-count: 1;
    -ms-transform-origin: 50% 50%;
    -ms-animation-fill-mode:forwards; /*IE 10+*/
    opacity:0;
    opacity: 1\9;
}

@keyframes slide-up-fade-in{
    0% {
        opacity:0;
        transform:  translate(0px,40px)  ;
    }
    100% {
        opacity:1;
        transform:  translate(0px,0px)  ;
    }
}

@-moz-keyframes slide-up-fade-in{
    0% {
        opacity:0;
        -moz-transform:  translate(0px,40px)  ;
    }
    100% {
        opacity:1;
        -moz-transform:  translate(0px,0px)  ;
    }
}

@-webkit-keyframes slide-up-fade-in {
    0% {
        opacity:0;
        -webkit-transform:  translate(0px,40px)  ;
    }
    100% {
        opacity:1;
        -webkit-transform:  translate(0px,0px)  ;
    }
}

@-o-keyframes slide-up-fade-in {
    0% {
        opacity:0;
        -o-transform:  translate(0px,40px)  ;
    }
    100% {
        opacity:1;
        -o-transform:  translate(0px,0px)  ;
    }
}

@-ms-keyframes slide-up-fade-in {
    0% {
        opacity:0;
        -ms-transform:  translate(0px,40px)  ;
    }
    100% {
        opacity:1;
        -ms-transform:  translate(0px,0px)  ;
    }
} 

