/*START : CSS Fonts */
	@font-face {
	    font-family: 'Ageone';
	    src: url('../fonts/Ageone.ttf') format('truetype');
	}
	
	@font-face {
	    font-family: 'Chronicle-Italic';
	    src: url('../fonts/ChronicleTextG1Italic.otf') format('opentype');
	}
	@font-face {
	    font-family: 'Chronicle-Roman';
	    src: url('../fonts/ChronicleTextG1Roman.otf') format('opentype');
	}
	@font-face {
	    font-family: 'Chronicle-SemiBold';
	    src: url('../fonts/ChronicleTextG1SemiBold.otf') format('opentype');
	}
/*END : CSS Fonts */

/*START : Base CSS */
	:root {
		--bg-footer : #ccc6bb;
	}
	*{margin :0px; padding: 0px; }
	p, span{
		line-height: 1.5;
		font-size: 10pt;
		font-family: 'Chronicle-Roman';
		color: #404040;
	}

	a, a:hover{
		text-decoration: none;
		cursor: pointer;
		color: inherit; 
	}

	.breadcumb{
		list-style: none;
		display: flex;
		-ms-display : flex;
		-moz-display : flex;
		-webkit-display : flex;

		font-family: 'Chronicle-Roman';
		font-size: 10pt;
		color: #888888;
		text-transform: uppercase;
	}
	.breadcumb li:last-child::after{
		display: none;
	}
	.breadcumb li:after{
		content: "|";
		margin: 0 10px;
	}

	.title{
		font-size: 20pt;
		font-family: 'Chronicle-Roman';
		margin: 15px 0 0;
	}
	.title-info{
		display: block;
		font-size: 10pt;
		color: #888888;
		margin-bottom: 15px;
	}
	.tagline{
		text-transform: uppercase;
		font-family: 'Chronicle-Italic';
		font-size: 10pt;
		color: #888888;
		margin: 25px 0;
	}

	.btn-get-to-know button:hover{cursor: pointer; text-decoration: none;}
	.btn-get-to-know button{
		min-width: 250px;
		background: var(--bg-footer);
		color: #404040;
		font-family: 'Chronicle-Roman';
		font-size: 10pt;
		border: none;
		margin: 50px 15px 10px;
		padding: 15px 15px;
		letter-spacing: 2px;
	}

	.tbl-article-info{
		font-size: 10pt;
		width: 100%;
		margin: 25px 0;
		border: none;
		border-collapse: collapse;
		border-top: 1px solid #999;
	}
	.tbl-article-info tr:first-child td{padding-top: 25px;}
	.tbl-article-info tr td:first-child{
		color: #404040;
		font-family: 'Chronicle-Roman';
		text-transform: uppercase;
		width: 120px;
	}
	.tbl-article-info tr td:last-child{
		font-family: 'Chronicle-Italic';
		color: #808080;
	}

	.bg-image{
		width: 100%;
		height: 360px;
		overflow: hidden;
	}
	.bg-image-medium{
		width: 100%;
		height: 400px;
		overflow: hidden;
	}

	.bg-image-big{
		width: 100%;
		height: 600px;
		overflow: hidden;
	}

	.bg-image-big-full{
		width: 100%;
		height: 350px;
		overflow: hidden;
	}

	.bg-image-sm{
		width: 100%;
		height: 200px;
		overflow: hidden;
	}

	.bg-image-auto{
		width: 100%;
		height: auto;
	}

	.bg-image img, .bg-image-big img, .bg-image-sm img, .bg-image-medium img, .bg-image-auto img{
		width: 100%; 
		min-height: 100%;
		height: auto;
	}

	.modal-content{
		border-radius: 0px;
	}
/*END : Base CSS */


/*START : CSS For Home Pages */
	.home-wrapper{
		width: 100%;
		height: 100vh;
		background: url('../image/bg-home-top.png') top center, url('../image/bg-home-bottom.png') bottom center, #575757;
		background-size: cover;
		display: flex;
		-ms-display : flex;
		-moz-display : flex;
		-webkit-display : flex;

		flex-direction: column;
		-ms-flex-direction: column;
		-moz-flex-direction: column;
		-webkit-flex-direction: column;
	}
	.main-page-home{ 
		flex-grow: 1;
		-ms-flex-grow: 1;
		-moz-flex-grow: 1;
		-webkit-flex-grow: 1;

		position: relative;
		padding: 10px 20px;}
	.main-page-home > .container-fluid{ height: 100%;}
	.content-home{
		width: 100%; 
		text-align: center;
		font-family: 'Chronicle-Roman';
		color: #fff;
	}
	.content-home h1{
		font-size: 50pt;
		font-family: 'Ageone';
	}
	.content-home h2{
		font-size: 20pt;
		text-transform: uppercase;
		letter-spacing: 10px;
	}
	.content-home h3 span{
		font-size: 20pt;
		letter-spacing: 3px; 
		margin: 0 3px;
	}
	
	.content-home span{
		color: #ffffff;
		font-size: 10pt;
	}
	.content-home a:hover{
		text-decoration: underline;
	}
	.logo-home{
		width: 100px;
		margin-bottom: 15px;
		height: auto;

		position: absolute;
		left: 20px;
		bottom: -25px
	}
/*END	: CSS For Home Pages */



/*START : CSS For About Us Pages */
	.image-aboutus-wrapper img{
		width: 100%;
		height: auto;
		display: block;
	}
/*END : CSS For About Us Pages */



/*START : CSS For Menu Bar*/
	.menu{
		left: 0px;
		background: url('../image/bg-menu.png') repeat; 
	}
	.navbar{
		padding: 15px 20px;
		margin : 0px;
	}
	.menu a{
		font-family: 'Chronicle-Roman';
		font-size: 12pt;
		color: #fff;
		text-transform: uppercase;
		letter-spacing: 2px;
	}
	.navbar-brand{margin: 0px; padding: 0px;}
	.navbar-brand-home img{ opacity: 0; }
	.logo-menu{
		width: 100px;
		margin: 0px; padding: 0px;
		height: auto;
	}
	.menu-about a{
		color: #737070 !important;
	}
/*END : CSS For Menu */



/*START : CSS For Footer*/
	.footer{
		padding: 10px 20px;
		margin-top: 30px;
		background: var(--bg-footer);

		color: #808080;
		font-size: 11pt;
		font-family: 'Chronicle-Roman';
	}

	.footer .newsletter span{
		display: block;
		text-align: right;
		text-transform: uppercase;
	}
	.footer form .newsletter-form{
		padding: 3px;
		width: 250px !important;
		border-bottom: 1px solid #404040;
		display: flex;
		-ms-display : flex;
		-moz-display : flex;
		-webkit-display : flex;
	}
	.footer form .newsletter-form input{
		height: 20px;
		padding: 0px;
		border: 0px;
		background: none;
		color: #404040;

		flex-grow: 1;
		-ms-flex-grow: 1;
		-moz-flex-grow: 1;
		-webkit-flex-grow: 1;

		font-size: 8pt;
		font-family: 'Chronicle-Roman';
	}
	.footer form .newsletter-form button{
		height: 20px;
		padding: 0px;
		color: #404040;
		background: none;
		border: none;
		font-size: 8pt;
		text-transform: uppercase;
	}


	.footer form .newsletter-form input::placeholder{color: #404040;}
	.footer form .newsletter-form button:focus, .footer form .newsletter-form button:active,
	.footer form .newsletter-form input:focus, .footer form .newsletter-form input:hover{
		background: none !important;
		color: #404040 !important;
		outline: none !important;
	}
/*END : CSS For Footer */

/*START : CSS get to know */
	.header-get-know{
		background: url('../image/get-know/hero1.jpg') fixed no-repeat center top;
		background-size: contain;
		height: 375px;
	}

	.get-know-wrapper{ background: #f8f8f8; }

	.main-page-get-know{
		width: 100%;
		height: auto;
	}

	.title-section{
		color: #ae9364;
		font-size: 20pt;
		margin-bottom: 25px;
		font-family: 'Chronicle-Roman';
	}

	.title-section span{
		color: #ae9364;
		text-transform: uppercase;
		display: block;
		margin-top: 5px;
		font-size: 12px;
	}

	.gk{
		padding: 15px 0px;
	}
	.gk-1{
		text-align: center;
		margin: 50px 0px 35px;
	}
	.gk-10{text-align: center;}

	.item-relief-wrapper{
		display: flex; /* set height 100% for children */
		-ms-display : flex;
		-moz-display : flex;
		-webkit-display : flex;

		flex: 1 1 100%;  
		-ms-flex: 1 1 100%;  
		-moz-flex: 1 1 100%;  
		-webkit-flex: 1 1 100%;  

		margin: 15px 0;
	}
	.item-relief{
		background: #ffffff;
		padding: 10px;
		height: 100%;
		width: 100%;
	}

	.item-relief h3{
		color: #96959f;
		font-size: 10pt;
		text-transform: uppercase;
		font-family: 'Chronicle-Roman';
		margin: 25px 0 15px;
	}

	.get-to-know-middle{
		padding: 15px 0;
		margin: 15px 0;
		background: #eee9e0;
	}

	.experience{
		background: #ae9364;
		padding: 50px 0;
		margin-bottom: -30px; 

		text-align: center;
	}

	.experience .title-section, .experience .title-section span, .experience p{
		color: #fff;
	}

	.experience .btn-get-to-know button{
		margin: 0px; 
		margin-bottom: 50px;
		background: #fff;
		color: #ae9364;
	}

	.main-page-get-know .gk-1 .btn-get-to-know button{
		background: #ae9364;
		color: #fff;
	}
/*END : CSS get to know */


/*END : CSS JQuery Slider - Get To Know */
	#imageGallery li{
		display: flex !important;
		-ms-display: flex !important;
		-moz-display: flex !important;
		-webkit-display: flex !important;

		align-items: stretch;
		-ms-align-items: stretch;
		-moz-align-items: stretch;
		-webkit-align-items: stretch;

		justify-content: flex-start;
		-ms-justify-content: flex-start;
		-moz-justify-content: flex-start;
		-webkit-justify-content: flex-start;
	}

	#imageGallery li img{
		flex-grow: 1;
		-ms-flex-grow: 1;
		-moz-flex-grow: 1;
		-webkit-flex-grow: 1;
	}

	.imageGalleryWrapper .lSSlideWrapper  .lSAction > .lSNext {
	    right: calc(30% + 10px) !important;
	}

	#imageGallery li .caption p{
		color: #000 !important;
	}

	#imageGallery li .caption{
		padding: 15px;
		background: #fff;
		z-index: 1;
		text-align: left;
		width: 30%;
	}
/*END : CSS JQuery Slider - Get To Know */



/*Start : CSS Button Back To Top */
	#button-back-to-top {
		display: inline-block;
		background-color: #FF9800;
		
		text-align: center;
		border-radius: 4px;
		position: fixed;
		bottom: 30px;
		right: 30px;
		transition: background-color .3s, 
		opacity .5s, visibility .5s;
		opacity: 0;
		visibility: hidden;
		z-index: 1000;

		padding: 15px !important;

		font-weight: normal;
		font-style: normal;
		font-size: 2em;
		line-height: 0;
	}
	#button-back-to-top span{color: #fff;}
	#button-back-to-top:hover {
		cursor: pointer;
		background-color: #333;
	}
	#button-back-to-top:active {
		background-color: #555;
	}
	#button-back-to-top.show, #button-go-experience.show {
		opacity: 1;
		-ms-opacity: 1;
		-moz-opacity: 1;
		-webkit-opacity: 1;
		visibility: visible;
	}

/*END : CSS Button Back To Top */


/*START : CSS Carousel Top New About Us */
	.multi-item-carousel {
	  overflow: hidden;
	}
	.multi-item-carousel img {
	  height: auto;
	  width: 100%;
	}
	.multi-item-carousel .carousel-control-next span{
		right: calc(100% + 15px);
		position: absolute;
		cursor: pointer;
	}
	.multi-item-carousel .carousel-control-prev span{
		left: calc(100% + 15px);
		position: absolute;
		cursor: pointer;
	}

	.multi-item-carousel .carousel-control-prev, 
	.multi-item-carousel .carousel-control-next {
		background: #fff;
		opacity: 0.5;
		-ms-opacity: 0.5;
		-moz-opacity: 0.5;
		-webkit-opacity: 0.5;
	    width: 15%;
	}
	.multi-item-carousel .carousel-inner {
	  width: 210%;
	  left: -55%;
	}
	.carousel-inner > .carousel-item.next, 
	.carousel-inner > .carousel-item.active.right {
	    -webkit-transform: translate3d(33%, 0, 0);
	    -moz-transform: translate3d(33%, 0, 0);
	    -ms-transform: translate3d(33%, 0, 0);
	    transform: translate3d(33%, 0, 0);
	}
	.carousel-inner > .carousel-item.prev, 
	.carousel-inner > .carousel-item.active.left {
	    -webkit-transform: translate3d(-33%, 0, 0);
	    -moz-transform: translate3d(-33%, 0, 0);
	    -ms-transform: translate3d(-33%, 0, 0);
	    transform: translate3d(-33%, 0, 0);
	}
	.item__third {
	  float: left;
	  position: relative;  /* captions can now be added */
	  width: 33.33333333%;
	}
/*END : CSS Carousel Top New About Us */



/*START : CSS New About US */
	.header-new-about-us{
		background: url('../image/about-us/bg-top.jpg') fixed no-repeat center top;
		background-size: contain;
		height: 400px;
	}

	.new-about-us{ background: #f8f8f8; }

	.ab-1, .ab-3{
		padding: 50px 0px;
		text-align: center;
	}

	.ab-2, .ab-4{
		background: #eee9e0;
		padding: 50px 0px;
	}

	.ab-4{
		text-align: center;
		margin-bottom: -30px;
	}

	.ab-4 a{
		color: #ae9364 !important; 
		text-decoration: none !important;
	}

	/*END : CSS JQuery Slider - Get To Know */
		.imageGalleryAboutUsWrapper{
			position: relative;
			display: flex;
			-ms-display : flex;
			-moz-display : flex;
			-webkit-display : flex;

		    justify-content: center;
		    -ms-justify-content: center;
		    -moz-justify-content: center;
		    -webkit-justify-content: center;
		}
		.imageGalleryAboutUsWrapper .lSPager{
		    position: absolute;
		    bottom: 20px;
		    margin: 0px auto;
		}
		.imageGalleryAboutUsWrapper .lSPager li a{
			background: transparent none !important;
			height: 3px;
			width: 3px;
			border : 1px solid #fff;
		}
		.imageGalleryAboutUsWrapper .lSPager li.active a{background: #fff !important;}

		#imageGallery li .caption p{
			color: #000 !important;
		}

		#imageGallery li .caption{
			padding: 15px;
			background: #fff;
			z-index: 1;
			text-align: left;
			width: 30%;
		}
	/*END : CSS JQuery Slider - Get To Know */

/*START : CSS New About US */



/*START : CSS Responsive For Mobile */
	@media only screen and (max-width: 768px) {
		/*START : Home Responsive */
			.home-wrapper{ max-height: auto; min-height: 100vh; }
			.main-page-home{margin-top: 25px;}
			.content-home h1{ font-size: 30pt; }
			.content-home h2{
				font-size: 13pt;
				letter-spacing: 5px;
			}
			.content-home h3 span{ font-size: 11pt; }
			.logo-home{ width: 70px; }
		/*End : Home Responsive */



		/*START : Footer Responsive */
			.footer .newsletter span{
				text-align: center;
			}
		/*End : Menu Responsive */



		/*START : Menu Responsive */
			.logo-menu{
				width: 70px;
				height: auto;
			}
			.menu .navbar-toggler{
				background: #f0f0f0;
				color: #808080;
			}
			.menu .navbar-collapse{
				background: url('../image/bg-transparant-black.png') repeat; 
				border-radius: 10px;
				margin-top: 15px;
			}
			.menu .navbar-collapse .navbar-nav{
				padding: 5px;
			}
			.menu .navbar-collapse .navbar-nav a{
				font-size: 10pt;
				padding: 10px;
				border-bottom: 1px solid #999;
			}
			.menu .navbar-collapse .navbar-nav a:last-child{
				border-bottom: none;
			}
		/*End : Menu Responsive */

		/*START : Get To Know Responsive */
			.bg-image, .bg-image-medium{
				height: auto !important;
			}
		/*END : Get To Know Responsive */

		/*END : CSS JQuery Slider - Get To Know */
			#imageGallery li{
				flex-direction: column;
				-ms-flex-direction: column;
				-moz-flex-direction: column;
				-webkit-flex-direction: column;

				width: 100%;
			}

			#imageGallery li img{
				width: 100%;
				height: 300px;
			}

			.imageGalleryWrapper .lSSlideWrapper .lSAction > .lSPrev{ left: 10px; top : 30px;}
			.imageGalleryWrapper .lSSlideWrapper .lSAction > .lSNext { right: 10px !important; top : 30px; }

			#imageGallery{background: #fff;}
			#imageGallery li .caption{  
				width: 100% !important;
				height: auto !important;
			}
		/*END : CSS JQuery Slider - Get To Know */
		
		.header-get-know, .header-new-about-us{
			height: auto;
			background-size: cover;
			background-attachment: unset;
		}

	}
/*END : CSS Responsive For Mobile */

/*END : CSS Responsive For Medium */
	@media only screen and (max-width: 992px) and (min-width: 768px){
		/*START : Get To Know Responsive */
			.bg-image{
				height: 200px !important;
			}
		/*END : Get To Know Responsive */
	}
/*END : CSS Responsive For Medium */