@font-face {
    font-family: 'Source Sans Pro';
    src: url('../fonts/SourceSansPro-BoldItalic.woff2') format('woff2'),
        url('../fonts/SourceSansPro-BoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('../fonts/SourceSansPro-BlackItalic.woff2') format('woff2'),
        url('../fonts/SourceSansPro-BlackItalic.woff') format('woff');
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('../fonts/SourceSansPro-Bold.woff2') format('woff2'),
        url('../fonts/SourceSansPro-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('../fonts/SourceSansPro-Black.woff2') format('woff2'),
        url('../fonts/SourceSansPro-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('../fonts/SourceSansPro-ExtraLight.woff2') format('woff2'),
        url('../fonts/SourceSansPro-ExtraLight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('../fonts/SourceSansPro-SemiBoldItalic.woff2') format('woff2'),
        url('../fonts/SourceSansPro-SemiBoldItalic.woff') format('woff');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('../fonts/SourceSansPro-SemiBold.woff2') format('woff2'),
        url('../fonts/SourceSansPro-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('../fonts/SourceSansPro-LightItalic.woff2') format('woff2'),
        url('../fonts/SourceSansPro-LightItalic.woff') format('woff');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('../fonts/SourceSansPro-ExtraLightItalic.woff2') format('woff2'),
        url('../fonts/SourceSansPro-ExtraLightItalic.woff') format('woff');
    font-weight: 200;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('../fonts/SourceSansPro-Regular.woff2') format('woff2'),
        url('../fonts/SourceSansPro-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('../fonts/SourceSansPro-Light.woff2') format('woff2'),
        url('../fonts/SourceSansPro-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('../fonts/SourceSansPro-Italic.woff2') format('woff2'),
        url('../fonts/SourceSansPro-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

#about h3 {
	font-size: 1.25rem;
}

#about h4 {
	font-size: 1.25rem;
	font-weight: 400;
}

.googlemap {
	width: 100%;
	height: 100%;
}

.map img {
	width: 100% !important;
	height: auto !important;
}

 .hidden {
	 display: none;
 }
 
 .callout .container {
	 background: rgba(60, 60, 60, 0.9);
 }
 
 .btn-whatsapp {
	 background: #25D366 !important;
	 color: #fff;
	 border: 0;
 }

 .btn-whatsapp:hover {
	background: #2ebe63 !important;
	color: #fff;
	border: 0;
}
 
 .btn-facebook {
	 background: #3b5998 !important;
	 border: 0;
 }
 
 .new-shadow {
	 text-shadow: #FFF 0px 0px 5px, #FFF 0px 0px 10px, 2px 2px 2px rgba(255, 255, 255, 0.25);
 }

 body,
 html {
	 width: 100%;
	 height: 100%
 }
 
 body {
	 font-family: 'Source Sans Pro'
 }
 
 .btn-xl {
	 padding: 1.25rem 2.5rem
 }
 
 .content-section {
	 padding-top: 1.5rem;
	 padding-bottom: 1.5rem
 }
 
 .content-section-heading h2 {
	 font-size: 3rem
 }
 
 .content-section-heading h3 {
	 font-size: 1rem;
	 text-transform: uppercase
 }
 
 h1,
 h2,
 h3,
 h4,
 h5,
 h6 {
	 font-weight: 700
 }
 
 .text-faded {
	 color: rgba(255, 255, 255, .7)
 }
 
 .map {
	 height: 30rem
 }
 
 @media (max-width:992px) {
	 .map {
		 height: 75%
	 }
 }
 
 .map iframe {
	 pointer-events: none
 }
 
 .scroll-to-top {
	 position: fixed;
	 left: 25%;
	 bottom: 15px;
	 display: none;
	 width: 100px;
	 height: 50px;
	 text-align: center;
	 color: #fff;
	 background: rgba(52, 58, 64, .5);
	 line-height: 45px
 }
 
 .scroll-to-top:focus,
 .scroll-to-top:hover {
	 color: #fff
 }
 
 .scroll-to-top:hover {
	 background: #343a40
 }
 
 .scroll-to-top i {
	 font-weight: 800
 }
 
 .masthead {
	 position: relative;
	 display: table;
	 width: 100%;
	 height: auto;
	 padding-top: 1rem;
	 padding-bottom: 1rem;
	 /*background: linear-gradient(90deg, rgba(255, 255, 255, .1) 0, rgba(255, 255, 255, .1) 100%), url(../img/bg-masthead.jpg);
	 background-position: top center;
	 background-repeat: no-repeat;
	 background-size: 100%;*/
 }
 
 .masthead h1 {
	 font-weight: 700;
	 font-size: 2rem;
	 margin: 0;
	 padding: 0
 }

 .masthead h2 {
	font-weight: 400;
	font-size: 1.5rem;
	margin: 0;
	padding: 0
}

.masthead h3 {
	font-weight: 400;
	font-size: 1.5rem;
	margin: 0;
	padding: 0
}
 
 @media (min-width:992px) {
	 .masthead h1 {
		 font-size: 5.5rem
	 }
 }
 
 #sidebar-wrapper {
	 position: fixed;
	 z-index: 2;
	 right: 0;
	 width: 250px;
	 height: 100%;
	 transition: all .4s ease 0s;
	 transform: translateX(250px);
	 background: #ecb807;
	 border-left: 1px solid rgba(255, 255, 255, .1)
 }
 
 .sidebar-nav {
	 position: absolute;
	 top: 0;
	 width: 250px;
	 margin: 0;
	 padding: 0;
	 list-style: none
 }
 
 .sidebar-nav li.sidebar-nav-item a {
	 display: block;
	 text-decoration: none;
	 color: #fff;
	 padding: 15px
 }
 
 .sidebar-nav li a:hover {
	 text-decoration: none;
	 color: #fff;
	 background: rgba(255, 255, 255, .2)
 }
 
 .sidebar-nav li a:active,
 .sidebar-nav li a:focus {
	 text-decoration: none
 }
 
 .sidebar-nav>.sidebar-brand {
	 font-size: 1.2rem;
	 background: rgba(52, 58, 64, .1);
	 height: 80px;
	 line-height: 50px;
	 padding-top: 15px;
	 padding-bottom: 15px;
	 padding-left: 15px
 }
 
 .sidebar-nav>.sidebar-brand a {
	 color: #fff
 }
 
 .sidebar-nav>.sidebar-brand a:hover {
	 color: #fff;
	 background: 0 0
 }
 
 #sidebar-wrapper.active {
	 right: 250px;
	 width: 250px;
	 transition: all .4s ease 0s
 }
 
 .menu-toggle {
	 position: fixed;
	 right: 15px;
	 top: 15px;
	 width: 50px;
	 height: 50px;
	 text-align: center;
	 color: #fff;
	 background: rgba(52, 58, 64, .5);
	 line-height: 50px;
	 z-index: 999
 }
 
 .menu-toggle:focus,
 .menu-toggle:hover {
	 color: #fff
 }
 
 .menu-toggle:hover {
	 background: #343a40
 }
 
 .service-icon {
	 background-color: #fff;
	 color: #ecb807;
	 height: 7rem;
	 width: 7rem;
	 display: block;
	 line-height: 7.5rem;
	 font-size: 2.25rem;
	 box-shadow: 0 3px 3px 0 rgba(0, 0, 0, .1)
 }
 
 .callout {
	 padding: 25rem 0;
	 background: linear-gradient(90deg, rgba(255, 255, 255, .1) 0, rgba(255, 255, 255, .1) 100%), url(../img/bg-callout.jpg);
	 background-position: center center;
	 background-repeat: no-repeat;
	 background-size: cover
 }
 
 .callout h2 {
	 font-size: 3.5rem;
	 font-weight: 700;
	 display: block;
	 max-width: 30rem
 }
 
 .portfolio-item {
	 display: block;
	 position: relative;
	 overflow: hidden;
	 max-width: 530px;
	 margin: auto auto 1rem
 }
 
 .portfolio-item .caption {
	 display: flex;
	 height: 100%;
	 width: 100%;
	 background-color: rgba(33, 37, 41, .2);
	 position: absolute;
	 top: 0;
	 bottom: 0;
	 z-index: 1
 }
 
 .portfolio-item .caption .caption-content {
	 color: #fff;
	 margin: auto 2rem 2rem
 }
 
 .portfolio-item .caption .caption-content h2 {
	 font-size: .8rem;
	 text-transform: uppercase
 }
 
 .portfolio-item .caption .caption-content p {
	 font-weight: 300;
	 font-size: 1.2rem
 }
 
 @media (min-width:992px) {
	 .portfolio-item {
		 max-width: none;
		 margin: 0
	 }
	 .portfolio-item .caption {
		 -webkit-transition: -webkit-clip-path .25s ease-out, background-color .7s;
		 -webkit-clip-path: inset(0);
		 clip-path: inset(0)
	 }
	 .portfolio-item .caption .caption-content {
		 transition: opacity .25s;
		 margin-left: 5rem;
		 margin-right: 5rem;
		 margin-bottom: 5rem
	 }
	 .portfolio-item img {
		 -webkit-transition: -webkit-clip-path .25s ease-out;
		 -webkit-clip-path: inset(-1px);
		 clip-path: inset(-1px)
	 }
	 .portfolio-item:hover img {
		 -webkit-clip-path: inset(2rem);
		 clip-path: inset(2rem)
	 }
	 .portfolio-item:hover .caption {
		 background-color: rgba(230, 200, 80, .9);
		 -webkit-clip-path: inset(2rem);
		 clip-path: inset(2rem)
	 }
 }
 
 footer.footer {
	 padding-top: 5rem;
	 padding-bottom: 5rem
 }
 
 footer.footer .social-link {
	 display: block;
	 height: 4rem;
	 width: 4rem;
	 line-height: 4.3rem;
	 font-size: 1.5rem;
	 background-color: #ecb807;
	 transition: background-color .15s ease-in-out;
	 box-shadow: 0 3px 3px 0 rgba(0, 0, 0, .1)
 }
 
 footer.footer .social-link:hover {
	 background-color: #155d74;
	 text-decoration: none
 }
 
 a {
	 color: #ecb807
 }
 
 a:active,
 a:focus,
 a:hover {
	 color: #155d74
 }
 
 .btn-primary {
	 background-color: #ecb807;
	 border-color: #ecb807;
	 color: #fff!important
 }
 
 .btn-primary:active,
 .btn-primary:focus,
 .btn-primary:hover {
	 background-color: #155d74;
	 border-color: #155d74;
 }
 
 .btn-secondary {
	 background-color: #ecb807!important;
	 border-color: #ecb807!important;
	 color: #fff!important
 }
 
 .btn-secondary:active,
 .btn-secondary:focus,
 .btn-secondary:hover {
	 background-color: #ba9106!important;
	 border-color: #ba9106!important
 }
 
 .btn-dark {
	 color: #fff!important
 }
 
 .btn {
	 box-shadow: 0 3px 3px 0 rgba(0, 0, 0, .1);
	 font-weight: 700
 }
 
 .bg-primary {
	 background-color: #ecb807!important
 }
 
 .text-primary {
	 color: #ecb807!important
 }
 
 .text-secondary {
	 color: #ecb807!important
 }
 
 .chess {
	 height: 30px;
	 background: #333;
	 background: linear-gradient(135deg, transparent 75%, rgba(255, 255, 255, 1) 0%) 0 0, linear-gradient(-45deg, transparent 75%, rgba(255, 255, 255, 1) 0%) 15px 15px, linear-gradient(135deg, transparent 75%, rgba(255, 255, 255, 1) 0%) 15px 15px, linear-gradient(-45deg, transparent 75%, rgba(255, 255, 255, 1) 0%) 0 0, #333;
	 background-size: 30px 30px;
 }
 
 .bg-primary {
	 background: #333 !important;
 }
 
 .masthead .container {
	 margin: 0 auto 0 auto !important;
	 padding: 0;
 }