/*FONTS*/


@font-face {
font-family: 'Playfair';
    src:url('/fonts/PlayfairDisplay-Regular.eot'),
		url('/fonts/PlayfairDisplay-Regular.woff2') format('woff2'),
		url('/fonts/PlayfairDisplay-Regular.woff') format('woff'),
		url('/fonts/PlayfairDisplay-Regular.ttf') format('truetype');

}

@font-face {
    font-family: 'Poppins';
    src:url('/fonts/Poppins-Regular.eot');
    src:url('/fonts/Poppins-Regular.eot?#iefix') format('embedded-opentype'),
        url('/fonts/Poppins-Regular.woff') format('woff'),
        url('/fonts/Poppins-Regular.ttf') format('truetype');
}


h1, h2, h3 {color: #000; font-family: Playfair;}
p, tr, td {font-family: Poppins; font-size: 18px;}
h1 {font-size: 4em; text-align: center; margin: 0; font-weight: 600;}
h2 {font-size: 3.5em; font-weight: 600;}
h3 {font-size: 2.5em; font-weight: 600;}
h4 {font-family: Poppins; font-size: 1.5em;}

a {text-decoration: none; color:white;}
a:hover {color:#ffa5a5;}
a.menu-link {transition: 0.3s; padding: 0.25em 0 0; color: black; font-family: Poppins;} 
a.menu-link:hover {border-bottom: 2px solid;} 
.fab {color: white;  }
.fas {font-size: 1.5em;}
.section-title {text-align:center;}

ul {font-family: Poppins; padding: 0; list-style-type: square;}
li {line-height: 2em;}
li.sub-list {margin-left: 2em; list-style-type: none;}


body { background-color: white; margin: 0; font-size: 14px;}
header {height: auto; }
.nav-top {display: flex; background: #4f6d6b;  padding: 5px;  color: white;   font-weight: bold;   letter-spacing: 1px;}
.topinfo {display: inline-block;margin: 0 0.5em;  font-family: 'Poppins';  text-transform: uppercase;    font-size: 0.875em; line-height: 1em;}
.logo-wrap {margin: 0.5em auto -0.5em;/*width: 50%;*/text-align: center;}
.menu {text-align:center; display: flex; margin: auto;width: max-content;}
.menu-item {margin: 1em; font-family: Poppins;
      font-weight: bold;   font-size: 1em;text-transform: uppercase;
    letter-spacing: 1px; width: 33%;}

main { }

#intro {background: url('/images/pinkbg.jpg') no-repeat;height: 60vh;}

.intro-box {float:right; width: 60%; padding: 2em; margin-top: 10vh;}
.sub-tag {    text-align: center; text-transform: uppercase; letter-spacing: 0.25em;}
.intro-box p {font-size: 1.25em; font-weight: 800; margin: 0 auto; width: 60%;}
.em-button {margin: 0.5em auto;    text-align: center;    background: #ffa5a5;    width: 60%;
    padding: 1%;    font-size: 1.25em;    font-weight: bold;    font-family: 'Poppins';}
a.sub-tag:hover {color: black;}

#banner {height: auto; background: #4f6d6b; text-align: center; }
.banner-txt {text-transform: uppercase;padding: 1em;font-weight: bold; color: white; letter-spacing: 0.25em; margin-top: -10px;}
#services {
	/*background: url('/images/marble-bg.jpg') repeat-y; background-size: cover; */
    background: url(/images/toolbg.jpg);
    background-size: cover;
    padding: 4em 2em;
    height: 100vh;
    background-attachment: fixed;
    background-repeat: no-repeat;
    /* background: white; */
background-position: center;}
	
h2.section-title {margin: -1em 0 0.25em 0; padding-top: 1em; } 
td {border-bottom: 1px solid black; padding: 0.5em; width: 50%; text-transform: uppercase; font-weight: 600;font-size: 0.875em;}
table {border-spacing: 0px;}
.row {margin-top: 2em;}
.service-table {width: 90%; margin: 0 auto;}
.service-section {
	min-height: 600px;
    padding: 2em 1em;
	border-radius: 5px;
    background: #f2f2f2;
    box-shadow: 20px 20px 60px #bebebe, -20px -20px 60px #ffffff;
	text-align:center;
}
.service-table {width: 90%;margin: 0 auto;}
.guideline-box {width: 50%; 
	margin: 2em auto; 
	padding : 2em;
	}

#products {background: url(/images/plants.jpg) no-repeat;
    height: 400px;
    background-attachment: fixed;
    background-size: contain;
    background-position: center;}

#consultation {width: 50%; margin: 0 auto;}
	
.lightbox-gallery {padding: 4em 1em;}	
	
/*.contact-form {width: 45%; float: right;}*/
.contact-info-box {height: 70vh; background-image: url(/images/contactchair.jpg); background-size: cover; background-repeat: no-repeat;}
.contact-info-box-txt {padding: 2em; background: #4f6d6b; color: white; font-size: 0.875em;}
h4.contact-info { }
.bottom-sign {background: url('/images/plants.jpg')}
.brandingWrapper {display: none !important;}

/* FORMS */
fieldset {padding: 2EM; BACKGROUND: #f9f9f9; margin-bottom: 1em;}
legend {font-family: Playfair; font-size: 2em;}

.form-example {font-family: poppins; font-weight: 200; font-size: 0.8em;}
label {    font-family: poppins; margin-bottom: 0px; margin-top: 10px; font-size: 1.5em;}
#form-messages {font-family: 'Poppins'; font-size: 1.25em; font-weight: bold; padding: 0.5em; text-align: center;}
.form-control {border-radius: 0px; border-color: #4f6d6b;}
.g-recaptcha {margin-top: 5px;}
	
/*BUTTONS*/
.btn-primary {background-color: #4f6d6b; font-family: 'Poppins'; text-transform: uppercase;  letter-spacing: 1px;transition: 0.3s;border:none;margin-top: 5px;}
.btn-primary:hover {background: #ffa5a5;}
.btn {border-radius: 0px; padding: 1em 2em;}

/*BUTTON TO TOP*/
.scroll { color: #fff; margin-top: 100px}
#toTopBtn {
    position: fixed;
    bottom: 26px;
    right: 39px;
    z-index: 98;
    padding: 21px;
    background-color: hsla(5, 76%, 62%, .8)
}

.js .cd-top--fade-out { opacity: .5}

.js .cd-top--is-visible {visibility: visible; opacity: 1}

.js .cd-top { visibility: hidden; opacity: 0; transition: opacity .3s, visibility .3s, background-color .3s}

.cd-top {
    position: fixed;
    bottom: 20px;
    bottom: var(--cd-back-to-top-margin);
    right: 20px;
    right: var(--cd-back-to-top-margin);
    display: inline-block;
    height: 40px;
    height: var(--cd-back-to-top-size);
    width: 40px;
    width: var(--cd-back-to-top-size);
    box-shadow: 0 0 10px rgba(0, 0, 0, .05) !important;
    background: url(https://res.cloudinary.com/dxfq3iotg/image/upload/v1571057658/cd-top-arrow.svg) no-repeat center 50%;
    background-color: hsla(5, 76%, 62%, .8);
    background-color: hsla(var(--cd-color-3-h), var(--cd-color-3-s), var(--cd-color-3-l), 0.8)
}

.height { height: 3000px}


/*RESPONSIVE*/

@media only screen and (min-device-width: 769px) and (max-device-width: 1024px){
td {font-size: 14px;}

}
@media screen and (max-width: 768px) {

body {width: 100%;}
.intro-box p {width: 80%; margin-top: 0;}
#services {height: auto;}
.col-4 {padding-left: 0.25em;}
.service-section {width: auto; height: auto; margin: 0.25em; padding: 0.5em;}
td {font-size: 14px;}
#consultation {width: 75%; margin: 0 auto;}

}



@media screen and (max-width: 425px) {
h1 {line-height: 0.875em;}
.fab {color: white;  }
.nav-top {
    display: flex;
    margin-right: 0;
    margin: 0 auto;
    width: auto;
    background: black;
    padding: 5px 10px;
    color: white;
    line-height: 1;
}
.menu{width: 95%;    font-size: 0.8em;}
#intro {height: 55vh; }
.intro-box {float: none; width: auto; padding: 2em 1em; background: #ffffffbd; height: 55vh; margin-top: 0;}
.sub-tag {font-weight: 800; margin-top: 1em;}
.intro-box p {width: 90%; text-align:center; margin-top: 1em;}
/*#services-boxes {display: block;}*/
.col-4 {width: 95%; margin: 2em auto;}
.service-section { padding: 1em 1.5em 2em;}
#products {background-size: contain;background-attachment: scroll; height: 200px;}
.guideline-box {width: 80%;}
.contact-info-box {width: 100%; float: none;}
#em-contact {padding: 1em;}
#consultation {width: 90%; margin: 0 auto;}
	
}