/* 

1. Add your custom Css styles below
2. Place the this code in your template: 

 <link href="css/custom.css" rel="stylesheet">

*/

		.alert { z-index: 1; }
		.dark .header-extras a { color: #ffffff; }
		#main-logo { width: 50vw; }
		#banner-logo { height: 65px; }
		.no-overlay { cursor: initial; }
		.portfolio-description .btn i.icon-play,
		.portfolio-description .btn:hover i.icon-play {
			height: initial;
			width: initial;
			background: none;
			border: 0px;
			color: inherit;
			line-height: initial !important;
		}
		#valuesSection p { font-size: 1.2rem; }
		#testimonials div.container::after,
		#testimonials div.container-fluid::after {
			content: "";
  			/*background-image: url({{ landerAssetFolder }}/homepages/nature/images/6.jpg);*/
  			background-image: url(/images/wicosuta-overhead.jpg);
  			background-size: cover;
  			background-position: 50% 50%;
  			background-attachment: fixed;
			opacity: 0.1;
			top: 0;
			left: 0;
			bottom: 0;
			right: 0;
			position: absolute;
			z-index: -1; 
		}
		.flickity-page-dots { bottom: initial; }
		.testimonial .testimonial-item > span ~ span { color: #797878; }
		.flickity-page-dots .dot:after { background-color: #797878; }
		.tab-pane li {
			margin-left: 1.25rem;
			list-style-type: square;
		}
		label.error { color: #ff0000; font-weight: bold; }

		@media (max-width: 768px) {
			.heading-text-3c h3 {
				margin-top: 2rem;
				font-size: 50px;
			}
			.px-sm-3 {
				padding-left: 1rem !important;
				padding-right: 1rem !important;
			}
			.image-block .col-lg-6 {
				padding: 1rem;
			}
		}

		@media (width: 768px) {
			.portfolio-item-wrap .p-l-60.p-r-60 {
				padding-left: 10px !important;
				padding-right: 10px !important;
			}
			.portfolio-item-wrap .h1 {
				font-size: 2.8em;
			}
		}

		@media (min-width: 768px) {
			.p-md-100 { padding: 100px !important; }
			.p-md-150 { padding: 150px !important; }
		}

		@media (width: 1024px) {
			#logo {
				text-align: left !important;
				left: 3% !important;
			}
			.header-extras {
				float: right;
			}
			.portfolio-item-wrap .p-l-60.p-r-60 {
				padding-left: 20px !important;
				padding-right: 20px !important;
			}
			.p-md-100 { padding: 60px !important; }
		}

		/* wicosuta branding */
		.logo-default { color: #006e50 !important; }

		button.btn.btn-primary,
		.btn:not(.close):not(.mfp-close).btn-primary,
		a.btn:not([href]):not([tabindex]).btn-primary {
			background-color: #006e50;
			border-color: #006e50;
    	}

		button.btn.btn-outline,
		.btn:not(.close):not(.mfp-close).btn-outline,
		a.btn:not([href]):not([tabindex]).btn-outline {
			border-color: #006e50;			
			color: #006e50;
			background-color: #ffffff8c;
		}

		button.btn.btn-outline:hover,
		button.btn.btn-outline:focus,
		button.btn.btn-outline:active,
		button.btn.btn-outline.active,
		.btn:not(.close):not(.mfp-close).btn-outline:hover,
		.btn:not(.close):not(.mfp-close).btn-outline:focus,
		.btn:not(.close):not(.mfp-close).btn-outline:active,
		.btn:not(.close):not(.mfp-close).btn-outline.active,
		a.btn:not([href]):not([tabindex]).btn-outline:hover,
		a.btn:not([href]):not([tabindex]).btn-outline:focus,
		a.btn:not([href]):not([tabindex]).btn-outline:active,
		a.btn:not([href]):not([tabindex]).btn-outline.active {
			background-color: #004e1d;
			border-color: #004e1d;
		}

		button.btn.btn-primary:hover,
		button.btn.btn-primary:focus,
		button.btn.btn-primary:not(:disabled):not(.disabled):active,
		button.btn.btn-primary:not(:disabled):not(.disabled).active,
		.btn:not(.close):not(.mfp-close).btn-primary:hover,
		.btn:not(.close):not(.mfp-close).btn-primary:focus,
		.btn:not(.close):not(.mfp-close).btn-primary:not(:disabled):not(.disabled):active,
		.btn:not(.close):not(.mfp-close).btn-primary:not(:disabled):not(.disabled).active,
		a.btn:not([href]):not([tabindex]).btn-primary:hover,
		a.btn:not([href]):not([tabindex]).btn-primary:focus,
		a.btn:not([href]):not([tabindex]).btn-primary:not(:disabled):not(.disabled):active,
		a.btn:not([href]):not([tabindex]).btn-primary:not(:disabled):not(.disabled).active {
			background-color: #004e1d;
			border-color: #004e1d;
		}    	

    	.pricing-table.colored .plan-header { background-color: #006e50; }

		.heading-text.heading-section > h2:before,
		.heading-text.heading-line h1:before,
		.heading-text.heading-line h2:before,
		.heading-text.heading-line h3:before,
		.heading-text.heading-line h4:before,
		.heading-text.heading-line h5:before,
		.heading-text.heading-line h6:before {
			background-color: #006e50;
		}

		.tabs.tabs-vertical .nav-tabs .nav-link.active {
			color: #006e50;
			background-color: transparent;
			border-right: 2px solid #006e50;
		}

		a:not(.btn):not(.badge):hover,
		a:not(.btn):not(.badge):focus,
		a:not(.btn):not(.badge):active {
			color: #006e50;
		}
