@import url(https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800|Roboto+Slab:400,100,300,700);
		@import url('https://fonts.googleapis.com/css?family=Exo:400,700');

		body {
			/* min-height: 2000px; */
			font-family: 'Exo', sans-serif;
			/* background-color: rgb(240, 236, 223); */
			/* padding : 10px ;*/
			background: url(../images/background/bg1.jpg) no-repeat center center fixed;
			background-position: center center;
			background-repeat: no-repeat;
			background-attachment: fixed;
			-webkit-background-size: cover;
			-moz-background-size: cover;
			-o-background-size: cover;
			background-size: cover;
			margin:0;
			padding:0;
		}

		.desktop-screen {
			display: block;
		}

		.mobile-screen {
			display: none;
		}

		@media only screen and (max-width: 576px) {
			.desktop-screen {
				display: none;
			}

			.mobile-screen {
				display: block
			}
		}

		.masthead {
			height: 80px;
			/*background-color: rgb(240, 236, 223);*/
			background: url(../images/background/bg1.jpg) no-repeat center center fixed;
			font-family: 'Exo', sans-serif;
		}

		.navbar {
			background-color: transparent !important;
			background: transparent !important;
			border-color: transparent !important;
			margin: 0 0 1px 0 !important;
			z-index: 999 !important;
			margin-bottom: 0 !important;
			padding-bottom: 0 !important;			
		}

		.navbar-collapse {
			padding-right: 15px !important;
			padding-left: 0px !important;
		}

		.navbar li {
			color: #000
		}

		.navbar-brand {
			font-family: 'Exo', sans-serif;
		}


		.navbar-default {
			/* background-color: indianred !important; */
			/*BB background: linear-gradient(to left, #e66465, #9198e5) !important; */
			background: linear-gradient(to left, #FFC000, orange) !important;
			border: none !important;
			border-radius: 0 !important;
			margin-bottom: 0 !important;
		}

		.navbar-default .navbar-nav>.active>a {
			color: #FFFFFF !important;
			/* background-color: coral !important; */
			background: linear-gradient(to left, #f76d61, #f99991);
		}

		.navbar-default .navbar-nav>li>a {
			color: #FFFFFF !important;
			font-weight: bold !important;
		}

		.navbar-default .navbar-nav>li>a:hover {
			color: #FFFFFF !important;
			/* background-color: coral !important;  oranged */
			background: linear-gradient(to left, #f76d61, #f99991);
		}

		.navbar-default .navbar-nav>.active>a:hover {
			color: #FFFFFF !important;
			/* background-color: coral !important; oranged */
			background: linear-gradient(to left, #f76d61, #f99991);
		}

		.main-logo {
			width: 80px;
			height: 80px;
			margin-top: 0px;
			text-indent: 120%;
			text-align: center;
			padding-top: 16px;
			white-space: nowrap;
			overflow: visible;
			background: url('../images/logo/color-logo-t.png') no-repeat;
			background-size: 100%;
			background-color: transparent !important;
			font-family: 'Exo', sans-serif;
		}

		.navbar-default .navbar-nav>.open>a,
		.navbar-default .navbar-nav>.open>a:focus,
		.navbar-default .navbar-nav>.open>a:hover {
			color: #FFFFFF !important;
			/* background-color: coral !important; */
			background: linear-gradient(to left, #f76d61, #f99991);
		}

		.jumbotron {
			background-color: #FFE5B4;

		}

		/* bootstrap 3 helpers */
		#nav.affix {
			position: fixed;
			top: 0;
			width: 100%;
			z-index: 10;
		}

		#sidebar.affix-top {
			position: static;
		}

		#sidebar.affix {
			position: fixed;
			top: 80px;
		}

		.dropdown-submenu {
			position: relative;
		}

		.dropdown-submenu>.dropdown-menu {
			top: 0;
			left: 100%;
			margin-top: -6px;
			margin-left: -1px;
			-webkit-border-radius: 0 6px 6px 6px;
			-moz-border-radius: 0 6px 6px 6px;
			border-radius: 0 6px 6px 6px;
		}

		.dropdown-submenu>a:after {
			display: block;
			content: " ";
			float: right;
			width: 0;
			height: 0;
			border-color: transparent;
			border-style: solid;
			border-width: 5px 0 5px 5px;
			border-left-color: #cccccc;
			margin-top: 5px;
			margin-right: -10px;
		}

		.dropdown-submenu:hover>a:after {
			border-left-color: #555;
		}

		.dropdown-submenu.pull-left {
			float: none;
		}

		.dropdown-submenu.pull-left>.dropdown-menu {
			left: -100%;
			margin-left: 10px;
			-webkit-border-radius: 6px 0 6px 6px;
			-moz-border-radius: 6px 0 6px 6px;
			border-radius: 6px 0 6px 6px;
		}

		/**/
		.dropdown:hover .dropdown-menu {
			display: block;
			margin-top: 0;
		}

		.dropdown-menu>.active>a,
		.dropdown-menu>.active>a:focus,
		.dropdown-menu>.active>a:hover {
			background: linear-gradient(to left, #f76d61, #f99991);
		}

		@media (min-width: 768px) {}

		@media (min-width: 992px) {}

		@media (min-width: 1200px) {}

		/**/

		ul.tabs {
			margin: 0px;
			padding: 0px;
			list-style: none;
		}

		ul.tabs li {
			border-radius: 4px 4px 0 0;
			background: none;
			color: #222;
			display: inline-block;
			padding: 10px 15px;
			cursor: pointer;
		}

		ul.tabs li.current {
			/* background: #ededed; */
			/* color: #222; */
			color: white;
			background-color: #428bca;
			font-size: 16px;
		}

		.tab-content {
			display: none;
			/* background: #ededed; */
			/* color : white; */
			background-color: #428bca;
			padding: 15px;
		}

		.tab-content.current {
			display: inherit;
		}

		a:hover {
			color: white;
			text-decoration: none;
		}

		.dropdown-menu>li>a:hover {
			background-image: none;
			/* background-color: coral !important; */
			background: linear-gradient(to left, #f76d61, #f99991);
			color: white;
		}

		body::-webkit-scrollbar {
			width: 12px;
			/* width of the entire scrollbar */
		}

		body::-webkit-scrollbar-track {
			background: white;
			/* color of the tracking area */
		}

		body::-webkit-scrollbar-thumb {
			background-color: darkgray;
			/* color of the scroll thumb */
			border-radius: 20px;
			/* roundness of the scroll thumb */
			border: 3px solid white;
			/* creates padding around scroll thumb */
		}


		label {
			margin-left: 20px;
		}

		#datepicker {
			margin: 0 20px 20px 20px;
		}

		#datepicker>span:hover {
			cursor: pointer;
		}

		.datepicker table tr td.new,
		.datepicker table tr td.old {
			height: 0;
			line-height: 0;
			visibility: hidden;
		}


		/* change border radius for the tab , apply corners on top*/

		#exTab3 .nav-pills>li>a {
			border-radius: 4px 4px 0 0;
		}

		#exTab3 .tab-content {
			color: white;
			background-color: #428bca;
			padding: 5px 15px;
		}


		html,
		body {
			height: 100%;
		}

		.carousel,
		.item,
		.active {
			height: 100%;
		}


		.carousel-inner {
			height: 100%;
			background: #000;
		}

		.carousel-caption {
			padding-bottom: 80px;
		}

		.carousel-inner>.item>img,
		.carousel-inner>.item>a>img {
			min-height: 600px;
			/* Set slide height here */
			max-height: 600px !important;
		}

		h2 {
			font-size: 60px;
		}

		p {
			padding: 10px
		}

		/* Background images are set within the HTML using inline CSS, not here */

		.fill {
			width: 100% !important;
			height: 100% !important;
			background-position: center !important;
			-webkit-background-size: cover !important;
			-moz-background-size: cover !important;
			background-size: cover !important;
			-o-background-size: cover !important;
			opacity: 0.6 !important;
		}

		/* Button */
		.btn-transparent {
			background: transparent;
			color: #fff;
			border: 2px solid #fff;
		}

		.btn-transparent:hover {
			background-color: #fff;
		}

		.btn-rounded {
			border-radius: 70px;
		}

		.btn-large {
			padding: 11px 45px;
			font-size: 18px;
		}

		/**
		 * Change animation duration
		 **/
		.animated {
			-webkit-animation-duration: 1.5s;
			animation-duration: 1.5s;
		}

		@-webkit-keyframes fadeInRight {
			from {
				opacity: 0;
				-webkit-transform: translate3d(100px, 0, 0);
				transform: translate3d(100px, 0, 0);
			}

			to {
				opacity: 1;
				-webkit-transform: none;
				transform: none;
			}
		}

		@keyframes fadeInRight {
			from {
				opacity: 0;
				-webkit-transform: translate3d(100px, 0, 0);
				transform: translate3d(100px, 0, 0);
			}

			to {
				opacity: 1;
				-webkit-transform: none;
				transform: none;
			}
		}

		.fadeInRight {
			-webkit-animation-name: fadeInRight;
			animation-name: fadeInRight;
		}

		/*
			inspired from http://codepen.io/Rowno/pen/Afykb 
			https://stackoverflow.com/questions/26770055/bootstrap-carousel-fade-no-longer-working-with-maxcdn-3-3-bootstrap-min-css
		*/
		.carousel-fade .carousel-inner .item {
			opacity: 0;
			transition-property: opacity;
			transition-duration: .6s;
			transition-timing-function: linear;
		}

		.carousel-fade .carousel-inner .active {
			opacity: 1;
		}

		.carousel-fade .carousel-inner .active.left,
		.carousel-fade .carousel-inner .active.right {
			left: 0;
			opacity: 0;
			z-index: 1;
		}

		.carousel-fade .carousel-inner .next.left,
		.carousel-fade .carousel-inner .prev.right {
			opacity: 1;
		}

		.carousel-fade .carousel-control {
			z-index: 2;
		}

		/*
		WHAT IS NEW IN 3.3: "Added transforms to improve carousel performance in modern browsers."
		now override the 3.3 new styles for modern browsers & apply opacity
		*/
		@media all and (transform-3d),
		(-webkit-transform-3d) {

			.carousel-fade .carousel-inner>.item.next,
			.carousel-fade .carousel-inner>.item.active.right {
				opacity: 0;
				-webkit-transform: translate3d(0, 0, 0);
				transform: translate3d(0, 0, 0);
			}

			.carousel-fade .carousel-inner>.item.prev,
			.carousel-fade .carousel-inner>.item.active.left {
				opacity: 0;
				-webkit-transform: translate3d(0, 0, 0);
				transform: translate3d(0, 0, 0);
			}

			.carousel-fade .carousel-inner>.item.next.left,
			.carousel-fade .carousel-inner>.item.prev.right,
			.carousel-fade .carousel-inner>.item.active {
				opacity: 1;
				-webkit-transform: translate3d(0, 0, 0);
				transform: translate3d(0, 0, 0);
			}
		}

		.carousel-fade .carousel-item.active,
		.carousel-fade .carousel-item-next.carousel-item-left,
		.carousel-fade .carousel-item-prev.carousel-item-right {
			opacity: 1;
		}

		.carousel-fade .active.carousel-item-left,
		.carousel-fade .active.carousel-item-right {
			opacity: 0;
		}

		.carousel-fade .carousel-item-next,
		.carousel-fade .carousel-item-prev,
		.carousel-fade .carousel-item.active,
		.carousel-fade .active.carousel-item-left,
		.carousel-fade .active.carousel-item-prev {
			transform: translateX(0);
			transform: translate3d(0, 0, 0);
		}


		/* New line added for multi-column menu */

		.dropdown-menu {
			min-width: 250px;
		}

		.dropdown-menu.columns-2 {
			min-width: 500px;
		}

		.dropdown-menu.columns-3 {
			min-width: 700px;
		}

		.dropdown-menu li a {
			padding: 5px 15px;
			font-weight: 300;
		}

		.multi-column-dropdown {
			list-style: none;
			margin: 0px;
			padding: 0px;
		}

		.multi-column-dropdown li a {
			display: block;
			clear: both;
			line-height: 1.428571429;
			color: #333;
			white-space: normal;
		}

		.multi-column-dropdown li a:hover {
			text-decoration: none;
			/*BB color: #262626; */
			/*BB background-color: #999; */
			color: white !important;
			background: linear-gradient(to left, #f76d61, #f99991) !important;
		}

		@media (max-width: 767px) {
			.dropdown-menu.multi-column {
				min-width: 240px !important;
				overflow-x: hidden;
			}
		}

		/*********/

		.button,
		input[type="submit"],
		button[type="submit"] {
			font-size: 1.6rem;
			padding: 10px !important;
			margin: 10px !important;
			text-align: center;
			border: 0;
			cursor: pointer;
			color: #ffffff;
			background-color: indianred !important;
			border: 0.1rem solid transparent;
			transition: all 0.3s ease-out;
			border-radius: 0.6rem;
		}

		.default-btn:hover {
			color: #FFFFFF !important;
			background-color: coral !important;
			background-position: 100% 0;
			-moz-transition: all .4s ease-in-out;
			-o-transition: all .4s ease-in-out;
			-webkit-transition: all .4s ease-in-out;
			transition: all .4s ease-in-out;
		}


		.cta-btn {
			position: relative;
			display: inline-block;
			margin: 20px 0 0 20px;
			color: #fff;
			box-shadow: 4px 5px 27px 4px rgba(220, 120, 184, 0.85);
			border-radius: 10px !important;
			overflow: hidden;
			padding: 12px 21px;
			transition: box-shadow.3s ease-in-out;
			text-decoration: none;
		}

		/* These are the two backgrounds, absolutely positioned to cover. */
		.cta-btn::before,
		.cta-btn::after {
			content: '';
			display: block;
			position: absolute;
			left: 0;
			top: 0;
			bottom: 0;
			right: 0;
			background-image: linear-gradient(to right, #2ab3ff, #ff2d00);
			border-radius: 10px !important;
			z-index: -1;
		}

		.cta-btn::after {
			opacity: 0;
			background-image: linear-gradient(to right, #FF2A67, #FF5D3A);
			transition: opacity.3s ease-in-out;
		}

		/* On hover, transtiion the shadow of the anchor, and fade in the after element to show the new background. */
		.cta-btn:hover {
			box-shadow: 4px 5px 27px 4px rgba(255, 45, 45, 0.85);
		}

		.cta-btn:hover::after {
			opacity: 1;
		}


		.footer {
			width: 100%;
			/* background-color: indianred !important; */
			/*BB background: linear-gradient(to left, #e66465, #9198e5); */
			background: linear-gradient(to left, #FFC000, orange) !important;
		}

		.footer .col {
			width: 190px;
			height: auto;
			float: left;
			box-sizing: border-box;
			padding: 20px;
		}

		.footer .col h2 {
			margin: 0;
			padding: 0;
			font-size: 15px;
			font-weight: bold;
			line-height: 17px;
			padding: 10px 0;
			color: white;
			text-transform: uppercase;
			font-family: 'Exo', sans-serif;
		}

		.footer .col ul {
			list-style-type: none;
			padding: 0;
		}

		.footer .col ul li {
			color: white;
			font-size: 12px;
			padding: 5px 0px;
			font-family: 'Exo', sans-serif;
		}

		.address ul li {
			display: inline-block;
			padding-right: 5px !important;
		}

		.footer .col ul li:hover {
			cursor: pointer;
			color: black;
			/* lightgray; */
			font-weight: normal;
		}

		.clearfix {
			clear: both;
		}

		@media only screen and (min-width: 1280px) {
			.contain {
				width: 1200px;
				margin: 0 auto;
			}
		}

		@media only screen and (max-width: 1139px) {
			.contain .address {
				width: 1000px;
				display: block;
			}

			.address h2 {
				margin: 0px;
			}
		}

		@media only screen and (max-width: 950px) {
			.footer .col {
				width: 33%;
			}

			.footer .col h2 {
				font-size: 14px;
			}

			.footer .col ul li {
				font-size: 13px;
			}
		}

		@media only screen and (max-width: 500px) {
			.footer .col {
				width: 50%;
			}

			.footer .col h2 {
				font-size: 14px;
			}

			.footer .col ul li {
				font-size: 13px;
			}
		}

		@media only screen and (max-width: 340px) {
			.footer .col {
				width: 100%;
			}
		}



		#myBtn {
			display: none;
			/* Hidden by default */
			position: fixed;
			/* Fixed/sticky position */
			bottom: 20px;
			/* Place the button at the bottom of the page */
			right: 30px;
			/* Place the button 30px from the right */
			z-index: 99;
			/* Make sure it does not overlap */
			border: none;
			/* Remove borders */
			outline: none;
			/* Remove outline */
			background-color: red;
			/* Set a background color */
			color: white;
			/* Text color */
			cursor: pointer;
			/* Add a mouse pointer on hover */
			padding: 15px;
			/* Some padding */
			border-radius: 10px;
			/* Rounded corners */
			font-size: 18px;
			/* Increase font size */
		}

		#myBtn:hover {
			background-color: #555;
			/* Add a dark-grey background on hover */
		}


		/* [1] The container */
		.img-hover-zoom {
			height: 400px;
			/* [1.1] Set it as per your need */
			overflow: hidden;
			/* [1.2] Hide the overflowing of child elements */
		}

		/* [2] Transition property for smooth transformation of images */
		.img-hover-zoom img {
			transition: transform .5s ease;
		}

		/* [3] Finally, transforming the image when container gets hovered */
		.img-hover-zoom:hover img {
			transform: scale(1.5);
		}


		/* The Image container */
		.img-hover-zoom {
			height: 400px;
			/* Modify this according to your need */
			overflow: hidden;
			/* Removing this will break the effects */
		}



		/* Accordion */

		.accordion {
			margin: auto;
			width: 100% !important;
			/* width: 400px; */
		}

		.accordion input {
			display: none;
		}

		.box {
			position: relative;
			background: #FFF5EE;
			/*BB white; */
			height: 64px;
			transition: all .15s ease-in-out;
		}

		.box::before {
			content: '';
			position: absolute;
			display: block;
			top: 0;
			bottom: 0;
			left: 0;
			right: 0;
			pointer-events: none;
			box-shadow: 0 -1px 0 #e5e5e5, 0 0 2px rgba(0, 0, 0, .12), 0 2px 4px rgba(0, 0, 0, .24);
		}

		header.box {
			background: #00BCD4;
			z-index: 100;
			cursor: initial;
			box-shadow: 0 -1px 0 #e5e5e5, 0 0 2px -2px rgba(0, 0, 0, .12), 0 2px 4px -4px rgba(0, 0, 0, .24);
		}

		header .box-title {
			margin: 0;
			font-weight: normal;
			font-size: 20pt;
			color: white;
			cursor: initial;
		}

		.box-title {
			width: calc(100% - 40px);
			height: 64px;
			line-height: 64px;
			padding: 0 20px;
			display: inline-block;
			cursor: pointer;
			-webkit-touch-callout: none;
			-webkit-user-select: none;
			-khtml-user-select: none;
			-moz-user-select: none;
			-ms-user-select: none;
			user-select: none;
		}

		.box-content {
			width: calc(100% - 40px);
			padding: 30px 20px;
			font-size: 11pt;
			color: rgba(0, 0, 0, .54);
			display: none;
		}

		.box-close {
			position: absolute;
			height: 64px;
			width: 100%;
			top: 0;
			left: 0;
			cursor: pointer;
			display: none;
		}

		input:checked+.box {
			height: auto;
			margin: 16px 0;
			box-shadow: 0 0 6px rgba(0, 0, 0, .16), 0 6px 12px rgba(0, 0, 0, .32);
		}

		input:checked+.box .box-title {
			border-bottom: 1px solid rgba(0, 0, 0, .18);
		}

		input:checked+.box .box-content,
		input:checked+.box .box-close {
			display: inline-block;
		}

		.arrows section .box-title {
			padding-left: 44px;
			width: calc(100% - 64px);
		}

		.arrows section .box-title:before {
			position: absolute;
			display: block;
			content: '\203a';
			font-size: 18pt;
			left: 20px;
			top: -2px;
			transition: transform .15s ease-in-out;
			color: rgba(0, 0, 0, .54);
		}

		input:checked+section.box .box-title:before {
			transform: rotate(90deg);
		}