@charset "utf-8";
/* CSS Document */

/* Table of Contents
-----------------------------------------------------------------------------
	1. Mobile
	2. Large Mobile
	3. iPad
	4. large desktop
	5. Other
*/

/* 1. Mobile responsive css 640px
------------------------------------------------------------------------------*/
@media (max-width:640px) {
	/*--------- home page ------------*/
	h1, .h1{ font-size: 22px; line-height: 26px; margin-bottom: 25px; }
	h2, .h2{ font-size: 22px; line-height: 26px; margin-bottom: 25px; }
	p{ font-size: 16px; line-height: 24px; margin-bottom: 15px; }
	input[type="text"], input[type="password"], input[type="email"], input[type="tel"], input[type="search"]{ height: 35px; }
	input[type="submit"], input[type="button"], input[type="reset"]{ padding: 8px 20px; }
	label{ font-size: 14px; line-height: 21px; margin-bottom: 5px; }
	ul li{ font-size: 16px; line-height: 25px; }

	.about-side-img{ max-width: 100% !important; margin: 0 0 25px 0px; }
	header .container{ padding: 8px 15px; box-sizing: border-box; }
	.logo{ width: 100px; margin-right: 15px; }
	.navigation{ display: none; }
	.banner{ height: calc(100vh - 120px); }
	.banner-slider{ height: calc(100vh - 120px); }
	.banner-slider .item{ height: calc(100vh - 120px); }
	.banner-slider-cell{ height: calc(100vh - 120px); }
	.container{ padding: 0 20px; box-sizing: border-box; }
	.inner-sec{ padding: 40px 0 30px 0; }
	.inner-sec ul li{ margin-bottom: 25px; }
	.container{ padding: 0 20px; box-sizing: border-box; }
	.inner-sec{ padding: 45px 0 30px 0; }
	.team-cell-grp{ padding-top: 30px; }
	.inner-sec ul li{ margin-bottom: 20px; }
	.inner-sec ul li:last-child{ margin-bottom: 0; }
	.team-cell figure{ width: 100px; }
	.team-cell p{ width: calc(100% - 110px); }
	.box-info h2{ padding-top: 15px; }
	.team-cell-grp .team-cell:last-child{ margin-bottom: 0; }
	.map-cell{ height: 400px; }
	.footer-extra-text .in-container{ padding: 0 15px; box-sizing: border-box; }
	.map-sec h1{ margin-bottom: 17px; font-size: 17px; line-height: 22px; }
	.footer-extra-text p{ font-size: 13px; line-height: 18px; margin-bottom: 20px; }
	.footer-extra-text .in-container .center-text{ margin-bottom: 20px; }
	.footer-extra-text{ padding: 20px 0 5px 0; }
	.gallery-sec{ padding: 40px 0 20px 0; }
	.gallery-center-cell{ margin-bottom: 50px; }
	.center-img{ padding-top: 0px; }
	.two-img .two-col{ flex-wrap: wrap; }
	.two-img .two-col .col-left{ width: 100%; height: 250px; margin-bottom: 20px; }
	.two-img .two-col .col-right{ width: 100%; height: 250px; }
	.inner-sec.faq-sec{ padding: 45px 0 10px 0; }
	.contact-sec .three-col .col-left{ width: 100%; padding-right: 0px; margin-bottom: 10px; }
	.contact-sec .three-col .col-mid{ width: 100%; padding-right: 0px; box-sizing: border-box; margin-bottom: 20px; }
	.contact-sec .three-col .col-right{ width: 100%; }
	.form-area{ width: 100%; }
	.contact-sec .three-col .col-left h2{ font-size: 20px;  margin-bottom: 7px; line-height: 28px; }
	.contact-sec .three-col .col-left .contact-info p{ font-size: 16px; line-height: 23px; }
	.contact-sec{ padding: 40px 0 0 0; box-sizing: border-box; }
	.contact-sec .three-col{ flex-wrap: wrap; }
	.form-area .field-set{ margin-bottom: 15px; }

	.mb-toggled.mb-closed{ display: inline-flex; text-align: right; border-radius: 4px; background: rgba(0, 0, 0, 0.35); cursor: pointer; line-height: 1.125em; margin: 5px 5px 6px; padding: 0.3em 0.5em; align-items: center; }
	.mb-button span{ margin: 2px 0px 3px 0px; }
	.mobile-menu{ text-align: right; }
	.mb-button span:first-child{ margin-top: 0; }
	.mb-button span:last-child{ margin-bottom: 0; }
	.mb-button{ position: relative; }
	.text-menu{ font-size: 15px; line-height: 20px; margin-right: 13px; color: #fff; text-transform: uppercase; font-weight: bold; }
	header.site-header{ position: relative; width: 100%; }
	.mobile-menu{ display: block; padding: 5px 0; }
	.mobile-title{ display: block; width: 100%; margin-bottom: 25px; }
	.mobile-title h2{ font-size: 28px; line-height: 30px; color: #1a2124; font-family: Playfair Display; text-align: center; margin-bottom: 0; font-weight: bold; }

}

/* 2. Large Mobile responsive css 640px
------------------------------------------------------------------------------*/
@media (min-width:641px) and (max-width:767px){
	h1, .h1{ font-size: 22px; line-height: 26px; margin-bottom: 25px; }
	h2, .h2{ font-size: 22px; line-height: 26px; margin-bottom: 25px; }
	p{ font-size: 17px; line-height: 25px; margin-bottom: 15px; }
	input[type="text"], input[type="password"], input[type="email"], input[type="tel"], input[type="search"]{ height: 35px; }

	.about-side-img{ max-width: 250px !important; margin: 0 0 25px 25px; }
	header .container{ padding: 8px 15px; box-sizing: border-box; }
	.logo{ width: 100px; margin-right: 15px; }
	.navigation{ display: none; }
	.banner{ height: calc(100vh - 53px); }
	.banner-slider{ height: calc(100vh - 53px); }
	.banner-slider .item{ height: calc(100vh - 53px); }
	.banner-slider-cell{ height: calc(100vh - 53px); }
	.container{ padding: 0 20px; box-sizing: border-box; }
	.inner-sec{ padding: 50px 0 40px 0; }
	.team-cell-grp{ padding-top: 30px; }
	.inner-sec ul li{ margin-bottom: 30px; }
	.map-cell{ height: 500px; }
	.footer-extra-text .in-container{ padding: 0 20px; box-sizing: border-box; }
	.map-sec h1{ margin-bottom: 17px; font-size: 17px; line-height: 22px; }
	.footer-extra-text p{ font-size: 13px; line-height: 18px; margin-bottom: 20px; }
	.footer-extra-text .in-container .center-text{ margin-bottom: 20px; }
	.footer-extra-text{ padding: 20px 0 5px 0; }
	.gallery-sec{ padding: 40px 0 20px 0; }
	.gallery-center-cell{ margin-bottom: 50px; }
	.center-img{ padding-top: 0px; }
	.two-img .two-col .col-left{ width: 48%; height: 250px; }
	.two-img .two-col .col-right{ width: 48%; height: 250px; }
	.contact-sec .three-col .col-left{ width: 100%; padding-right: 30px; margin-bottom: 20px; }
	.contact-sec .three-col .col-mid{ width: 100%; padding-right: 30px; box-sizing: border-box; margin-bottom: 20px; }
	.contact-sec .three-col .col-right{ width: 100%; }
	.form-area{ width: 100%; }
	.contact-sec .three-col .col-left h2{ font-size: 20px;  margin-bottom: 7px; line-height: 28px; }
	.contact-sec .three-col .col-left .contact-info p{ font-size: 16px; line-height: 23px; }
	.contact-sec{ padding: 40px 0; box-sizing: border-box; }
	.contact-sec .three-col{ flex-wrap: wrap; }

	.mb-toggled.mb-closed{ display: inline-flex; text-align: right; border-radius: 4px; background: rgba(0, 0, 0, 0.35); cursor: pointer; line-height: 1.125em; margin: 5px 5px 6px; padding: 0.5em 0.7em; align-items: center; }
	.mobile-menu{ text-align: right; }
	.mb-button span:first-child{ margin-top: 0; }
	.mb-button span:last-child{ margin-bottom: 0; }
	.mb-button{ position: relative; }
	.text-menu{ font-size: 18px; line-height: 21px; margin-right: 13px; color: #fff; text-transform: uppercase; font-weight: bold; }
	header.site-header{ position: relative; width: 100%; }
	.mobile-menu{ display: block; }
	.mobile-title{ display: block; width: 100%; margin-bottom: 25px; }
	.mobile-title h2{ font-size: 28px; line-height: 30px; color: #1a2124; font-family: Playfair Display; text-align: center; margin-bottom: 0; font-weight: bold; }

}

/* 3. iPad responsive css 768px to 1023px
------------------------------------------------------------------------------*/
@media (min-width:768px) and (max-width:1023px){
	h1, .h1{ font-size: 22px; line-height: 26px; margin-bottom: 25px; }
	h2, .h2{ font-size: 22px; line-height: 26px; margin-bottom: 25px; }

	input[type="text"], input[type="password"], input[type="email"], input[type="tel"], input[type="search"]{ height: 35px; }

	p{ font-size: 17px; line-height: 25px; margin-bottom: 15px; }
	.about-side-img{ max-width: 300px !important; }
	header .container{ padding: 0 20px; box-sizing: border-box; }
	.logo{ width: 100px; margin-right: 15px; }
	nav ul li a{ padding: 15px 9px; }
	nav ul li{ font-size: 17px; line-height: 24px; }
	li.sub-menu ul{ top: 37px; }
	li.sub-menu ul li{ padding: 0 9px; }
	.banner{ height: calc(100vh - 53px); }
	.banner-slider{ height: calc(100vh - 53px); }
	.banner-slider .item{ height: calc(100vh - 53px); }
	.banner-slider-cell{ height: calc(100vh - 53px); }
	.container{ padding: 0 20px; box-sizing: border-box; }
	.inner-sec{ padding: 55px 0 40px 0; }
	.team-cell-grp{ padding-top: 50px; }
	.map-cell{ height: 500px; }
	.footer-extra-text .in-container{ padding: 0 20px; box-sizing: border-box; }
	.map-sec h1{ margin-bottom: 17px; font-size: 17px; line-height: 22px; }
	.footer-extra-text p{ font-size: 13px; line-height: 18px; margin-bottom: 20px; }
	.footer-extra-text .in-container .center-text{ margin-bottom: 20px; }
	.footer-extra-text{ padding: 20px 0 15px 0; }
	.gallery-sec{ padding: 40px 0 20px 0; }
	.gallery-center-cell{ margin-bottom: 50px; }
	.center-img{ padding-top: 0px; }
	.two-img .two-col .col-left{ width: 48%; height: 300px; }
	.two-img .two-col .col-right{ width: 48%; height: 300px; }
	.contact-sec .three-col .col-left{ width: 40%; padding-right: 30px; }
	.contact-sec .three-col .col-mid{ width: 40%; padding-right: 30px; box-sizing: border-box; }
	.contact-sec .three-col .col-right{ width: 20%; }
	.form-area{ width: 100%; }
	.contact-sec .three-col .col-left h2{ font-size: 20px;  margin-bottom: 7px; line-height: 28px; }
	.contact-sec .three-col .col-left .contact-info p{ font-size: 16px; line-height: 23px; }
	.contact-sec{ padding: 40px 0; box-sizing: border-box; }

}

/* 4. large desktop responsive css 1024px to 1199px
------------------------------------------------------------------------------*/
@media (min-width:1024px) and (max-width:1199px){	
	h1, .h1{ font-size: 24px; line-height: 26px; margin-bottom: 35px; }
	h2, .h2{ font-size: 24px; line-height: 26px; margin-bottom: 35px; }
	p{ font-size: 17px; line-height: 25px; margin-bottom: 15px; }

	header .container{ padding: 0 20px; box-sizing: border-box; }
	.container{ padding: 0 20px; box-sizing: border-box; }
	.inner-sec{ padding: 55px 0 40px 0; }
	.map-cell{ height: 600px; }
	.footer-extra-text .in-container{ padding: 0 20px; box-sizing: border-box; }
	.contact-sec .three-col .col-left{ width: 30%; padding-right: 30px; }
	.contact-sec .three-col .col-mid{ width: 36%; padding-right: 30px; box-sizing: border-box; }
	.contact-sec .three-col .col-right{ width: 34%; }
	.form-area{ width: 100%; }
	.contact-sec .three-col .col-left h2{ font-size: 20px;  margin-bottom: 7px; line-height: 28px; }
	.contact-sec .three-col .col-left .contact-info p{ font-size: 16px; line-height: 23px; }

}

/* 5. Other media-query
------------------------------------------------------------------------------*/

@media (min-width:1500px) and (max-width:1740px){	
	header .container{ padding: 0 20px; box-sizing: border-box; }
	.container{ padding: 0 20px; box-sizing: border-box; }
	.footer-extra-text .in-container{ padding: 0 20px; box-sizing: border-box; }
}

@media (min-width:1380px) and (max-width:1499px){	
	header .container{ padding: 0 20px; box-sizing: border-box; }
	.container{ padding: 0 20px; box-sizing: border-box; }
	.footer-extra-text .in-container{ padding: 0 20px; box-sizing: border-box; }
	.contact-sec .three-col .col-left{ width: 30%; padding-right: 50px; }
	.contact-sec .three-col .col-mid{ width: 36%; }
	.contact-sec .three-col .col-right{ width: 34%; }
}

@media (min-width:1300px) and (max-width:1379px){	
	header .container{ padding: 0 20px; box-sizing: border-box; }
	.container{ padding: 0 20px; box-sizing: border-box; }
	.footer-extra-text .in-container{ padding: 0 20px; box-sizing: border-box; }

	.contact-sec .three-col .col-left{ width: 30%; padding-right: 50px; }
	.contact-sec .three-col .col-mid{ width: 36%; }
	.contact-sec .three-col .col-right{ width: 34%; }
}

@media (min-width:1200px) and (max-width:1299px){	
	header .container{ padding: 0 20px; box-sizing: border-box; }
	.container{ padding: 0 20px; box-sizing: border-box; }
	.footer-extra-text .in-container{ padding: 0 20px; box-sizing: border-box; }

	.contact-sec .three-col .col-left{ width: 30%; padding-right: 50px; }
	.contact-sec .three-col .col-mid{ width: 36%; padding-right: 50px; box-sizing: border-box; }
	.contact-sec .three-col .col-right{ width: 34%; }
	.form-area{ width: 100%; }
}