/* =================================================================== */
/* 
/*  Puremedia v1.0 Main Stylesheet
/*  url:styleshout.com
/*  10-10-2014
/*
/*  ------------------------------------------------------------------ 

    TOC: 
    a. Webfonts and Iconfonts
    b. Document Setup
    c. Forms  
    d. Preloader
    e. Buttons
    f. Other Components
    g. Header Styles
    h. Content Styles
    i. Footer Styles
    j. Common and shared styles
    k. Hero Section
    l. Portfolio Section
    m. Services Section
    n. About Section
    o. Journal Section
    p. Contact Section
    q. Blog Entry
    r. Portfolio Entry

/* =================================================================== */

/* 
/* a. Webfonts and Iconfonts
/* =================================================================== */
@import url("fonts.css");
@import url("font-awesome/css/font-awesome.min.css");
@import url("simple-line-icons/simple-line-icons.css");

/* 
/* b. Document Setup
/* =================================================================== */

/* Body
---------------------------------------------------------------------- */
body {
	background: white;
	font: 15px/30px "Open Sans";
	font-weight: normal;
	color: #575859;
}


/* scroll stop when popup arise */
.noscroll{
	overflow: hidden;
}

/* Links
---------------------------------------------------------------------- */
a, a:visited {
	color: #028c4c;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
a:hover, a:focus {
	color: black;
}

.logo-link {
	height: 110px;
}
.logo_desktop{
	height:110px;
	max-width: unset;
}

/* Typography
--------------------------------------------------------------------- */
h1, h2, h3, h4, h5, h6 {
	font-family: "Open Sans";
	color: #252525;
	font-style: normal;
	font-weight: 800;
	text-rendering: optimizeLegibility;
	margin: 18px 0 15px;
}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
	font-weight: inherit;
}
h1 {
	font-size: 30px;
	line-height: 36px;
	margin-top: 0;
	letter-spacing: -1px;
}
h2 {
	font-size: 24px;
	line-height: 30px;
}
h3 {
	font-size: 20px;
	line-height: 30px;
}
h4 {
	font-size: 17px;
	line-height: 30px;
}
h5 {
	font-size: 14px;
	line-height: 30px;
	margin-top: 15px;
	text-transform: uppercase;
	letter-spacing: 1px;
}
h6 {
	font-size: 13px;
	line-height: 30px;
	margin-top: 15px;
	text-transform: uppercase;
	letter-spacing: 1px;
}
p {
	margin: 15px 0 15px 0;
}
p img {
	margin: 0;
}
p.lead {
	font: 17px/33px "Open Sans";
	font-weight: 400;
	color: #707273;
}
em {
	font: 15px/30px "Open Sans";
	font-style: italic;
	font-style: normal;
}
strong, b {
	/* font: 15px/30px "Open Sans"; */
	font-weight: normal;
}
small {
	font-size: 11px;
	line-height: inherit;
}
blockquote {
	margin: 18px 0px;
	padding-left: 40px;
	position: relative;
}
blockquote:before {
	content: "\201C";
	opacity: 0.45;
	font-size: 80px;
	line-height: 0px;
	margin: 0;
	font-family: "Open Sans";
	position: absolute;
	top: 30px;
	left: 0;
}
blockquote p {
	font-family: "Open Sans";
	font-style: italic;
	padding: 0;
	font-size: 18px;
	line-height: 30px;
}
blockquote cite {
	display: block;
	font-size: 12px;
	font-style: normal;
	line-height: 18px;
}
blockquote cite:before {
	content: "\2014 \0020";
}
blockquote cite a, blockquote cite a:visited {
	color: #707273;
	border: none;
}
abbr {
	font-family: "Open Sans";
	font-variant: small-caps;
	text-transform: lowercase;
	letter-spacing: .5px;
	color: #7d7e80;
	font-weight: 800;
}
pre, code {
	font-family: "Open Sans";
}
pre {
	white-space: pre;
	white-space: pre-wrap;
	word-wrap: break-word;
}
code {
	padding: 3px;
	background: #ecf0f1;
	color: #707273;
	border-radius: 3px;
}
del {
	text-decoration: line-through;
}
abbr[title], dfn[title] {
	border-bottom: 1px dotted;
	cursor: help;
}
mark {
	background: #FFF49B;
	color: #000;
}
hr {
	border: solid white;
	border-width: 1px 0 0;
	clear: both;
	margin: 23px 0 12px;
	height: 0;
}

/* Lists
--------------------------------------------------------------------- */
ul, ol {
	margin-top: 15px;
	margin-bottom: 15px;
}
ul {
	list-style: disc;
	margin-left: 17px;
}
dl {
	margin: 0 0 15px 0;
}
dt {
	margin: 0;
	color: #028c4c;
}
dd {
	margin: 0 0 0 20px;
}

.mt-3 {
	margin-top: 3rem
}

/* Floated Image
--------------------------------------------------------------------- */
img.pull-right {
	margin: 12px 0px 0px 18px;
}
img.pull-left {
	margin: 12px 18px 0px 0px;
}

/* 
/* c. Forms
/* =================================================================== */
form {
	margin-bottom: 24px;
}
fieldset {
	margin: 0 0 24px 0;
	padding: 0;
	border: none;
}
input, button {
	-webkit-font-smoothing: antialiased;
}
input[type="text"], 
input[type="password"], 
input[type="email"], 
textarea, 
select {
	display: block;
	padding: 12px 15px;
	margin: 0 0 12px 0;
	border: 0;
	outline: none;
	vertical-align: middle;
	color: #white;
	font-family: "Open Sans";
	font-size: 14px;
	line-height: 24px;
	border-radius: 3px;
	max-width: 100%;
	width: 100%;
}
textarea {
	min-height: 162px;
}
input[type="text"]:focus, 
input[type="password"]:focus, 
input[type="email"]:focus, 
textarea:focus {
	background: white;
}
label, legend {
	font: 16px/30px "Open Sans";
	margin: 12px 0;
	color: #252525;
	display: block;
	font-weight: 600;
}
label span, legend span {
	color: #575859;
	font: 15px/30px "Open Sans";
}
input[type="checkbox"], input[type="radio"] {
	font-size: 15px;
	color: #575859;
}
input[type="checkbox"] {
	display: inline;
}

/* 
/* d. Preloader
/* =================================================================== */
#preloader {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: #12151b;
	z-index: 99999;
	height: 100%;
}
.no-js #preloader {
	display: none;
}

#status {
	position: absolute;
	left: 50%;
	top: 50%;
	width: 60px;
	height: 60px;
	margin: -30px 0 0 -30px;
	padding: 0;
}
#status img {
	display: none;
}

.loader {
	margin: 0 auto;
	font-size: 10px;
	position: relative;
	text-indent: -9999em;
	border-top: 1.1em solid rgba(255, 255, 255, 0.2);
	border-right: 1.1em solid rgba(255, 255, 255, 0.2);
	border-bottom: 1.1em solid rgba(255, 255, 255, 0.2);
	border-left: 1.1em solid #028c4c;
	-webkit-animation: load 1.1s infinite linear;
	animation: load 1.1s infinite linear;
}
.loader, .loader:after {
	border-radius: 50%;
	width: 60px;
	height: 60px;
}
@-webkit-keyframes load {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}
@keyframes load {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

/* for ie8 */
.ie8 #status img {
	display: block;
}
.ie8 .loader {
	display: none;
}


/* 
/* e. Buttons
/* =================================================================== */
.button, 
.button:visited, 
button, 
input[type="submit"], 
input[type="reset"], 
input[type="button"] {
	display: inline-block;
	font: 15px/30px "Open Sans";
	font-weight: 800;
	padding: 9px 16px;
	margin: 0 3px 6px 0;
	background: #818fab;
	color: white;
	text-decoration: none;
	cursor: pointer;
	height: auto;
	text-align: center;
	border: none;
	border-radius: 3px;
	-webkit-appearance: none;
	-webkit-font-smoothing: inherit;	
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.button:hover, 
button:hover, 
input[type="submit"]:hover, 
input[type="reset"]:hover, 
input[type="button"]:hover {
	background: #647495;
	color: white;
}
.button.primary, button.primary {
	background: #028c4c;
}
.button.primary:hover, button.primary:hover {
	background: #028c4c;
}
button.medium, .button.medium {
	font: 15px/30px "Open Sans";
	padding: 12px 18px !important;
	font-weight: 800;
}
button.large, .button.large {
	font: 15px/30px "Open Sans";
	padding: 15px 20px !important;
	font-weight: 800;
}
button.round, .button.round {
	padding-left: 20px !important;
	padding-right: 20px !important;
	border-radius: 1000px;
	background-clip: padding-box;
}
button.stroke, .button.stroke {
	background: transparent !important;
	border: 2px solid transparent;
}
button.full-width, .button.full-width {
	width: 100%;
	margin-right: 0;
}

.button.pink {
	background: #ffadcb;
}
.button.pink:hover {
	background: #ff94bb;
}
.button.blue {
	background: #72bbf0;
}
.button.blue:hover {
	background: #5bb0ee;
}
.button.black {
	background: #2e3236;
}
.button.black:hover {
	background: #222528;
}
.button.yellow {
	background: #ffd900;
}
.button.yellow:hover {
	background: #f0cc00;
}
.button.red {
	background: #ff6163;
}
.button.red:hover {
	background: #ff474a;
}
.button.green {
	background: #9bc724;
}
.button.green:hover {
	background: #8ab120;
}
.button.grey {
	background: #8d8e91;
}
.button.grey:hover {
	background: #808184;
}
.button.purple {
	background: #b482c9;
}
.button.purple:hover {
	background: #a970c1;
}
.button.orange {
	background: #f5731c;
}
.button.orange:hover {
	background-color: #ed650a;
}
.button.stroke.pink {
	border-color: #ffadcb;
	color: #ffadcb;
}
.button.stroke.pink:hover {
	background: #ffadcb !important;
	color: #fff;
}
.button.stroke.blue {
	border-color: #72bbf0;
	color: #72bbf0;
}
.button.stroke.blue:hover {
	background: #72bbf0 !important;
	color: #fff;
}
.button.stroke.black {
	border-color: #2e3236;
	color: #2e3236;
}
.button.stroke.black:hover {
	background: #2e3236 !important;
	color: #fff;
}
.button.stroke.yellow {
	border-color: #ffd900;
	color: #ffd900;
}
.button.stroke.yellow:hover {
	background: #ffd900 !important;
	color: #fff;
}
.button.stroke.red {
	border-color: #ff6163;
	color: #ff6163;
}
.button.stroke.red:hover {
	background: #ff6163 !important;
	color: #fff;
}
.button.stroke.green {
	border-color: #028c4c;
	color: #028c4c;
}
.button.stroke.green:hover {
	background: #028c4c !important;
	color: #fff;
}
.button.stroke.grey {
	border-color: #8d8e91;
	color: #8d8e91;
}
.button.stroke.grey:hover {
	background: #8d8e91 !important;
	color: #fff;
}
.button.stroke.purple {
	border-color: #b482c9;
	color: #b482c9;
}
.button.stroke.purple:hover {
	background: #b482c9 !important;
	color: #fff;
}
.button.stroke.orange {
	border-color: #f5731c;
	color: #f5731c;
}
.button.stroke.orange:hover {
	background: #f5731c !important;
	color: #fff;
}
button::-moz-focus-inner, input::-moz-focus-inner {
	border: 0;
	padding: 0;
}


/* 
/* f. Other Components
/* ================================================================== */

/* Alert Boxes
/* ------------------------------------------------------------------ */
.alert-box {
	padding: 21px 40px 21px 30px;
	position: relative;
	margin-bottom: 24px;
	border-radius: 3px;
	background-clip: padding-box;
	font-family: "Open Sans";
	font-weight: 700;
}
.error {
	color: #dc2626;
	font-size: 13px;
	line-height: 0;
}
.success {
	background-color: #c8e675;
	color: #758c36;
}
.info {
	background-color: #d7ecfb;
	color: #4a95cc;
}
.notice {
	background-color: #fff099;
	color: #c16527;
}
.close {
	position: absolute;
	right: 18px;
	top: 18px;
	cursor: pointer;
}

/* Drop Cap
/* ------------------------------------------------------------------ */
.drop-cap:first-letter {
	float: left;
	margin: 0;
	padding: 14px 6px 0 0;
	font-size: 84px;
	font-family: "Open Sans";
	font-weight: 800;
	line-height: 60px;
	text-indent: 0;
	background: transparent;
	color: inherit;
}

/* Line Definition Style Markup
/* ------------------------------------------------------------------ */
.lining dt, .lining dd {
	display: inline;
	margin: 0;
}
.lining dt + dt:before, .lining dd + dt:before {
	content: "\A";
	white-space: pre;
}
.lining dd + dd:before {
	content: ", ";
}
.lining dd + dd:before {
	content: ", ";
}
.lining dd:before {
	content: ":";
	margin-left: -0.2em;
}

/* Dictionary Definition Style Markup
/* ------------------------------------------------------------------ */
.dictionary-style dt {
	display: inline;
	counter-reset: definitions;
}
.dictionary-style dt + dt:before {
	content: ", ";
	margin-left: -0.2em;
}
.dictionary-style dd {
	display: block;
	counter-increment: definitions;
}
.dictionary-style dd:before {
	content: counter(definitions, decimal) ". ";
}

/* 
/*  Pull Quotes Markup
/*

<aside class="pull-quote">
<blockquote>
<p></p>
</blockquote>
</aside>

/*
/* --------------------------------------------------------------------- */
.pull-quote {
	position: relative;
	padding: 18px 30px 18px 0px;
}
.pull-quote:before, .pull-quote:after {
	height: 1em;
	opacity: 0.45;
	position: absolute;
	font-size: 80px;
	font-family: "Open Sans";
}
.pull-quote:before {
	content: "\201C";
	top: 33px;
	left: 0;
}
.pull-quote:after {
	content: '\201D';
	bottom: -33px;
	right: 0;
}
.pull-quote blockquote {
	margin: 0;
}
.pull-quote blockquote:before {
	content: none;
}

/* 
/*  Stats Tab Markup

<ul class="stats-tabs">
<li><a href="#">[value]<em>[name]</em></a></li>
</ul>


/*
/* --------------------------------------------------------------------- */
.stats-tabs {
	padding: 0;
	margin: 24px 0;
}
.stats-tabs li {
	display: inline-block;
	margin: 0 10px 18px 0;
	padding: 0 10px 0 0;
	border-right: 1px solid #ccc;
}
.stats-tabs li:last-child {
	margin: 0;
	padding: 0;
	border: none;
}
.stats-tabs li a {
	display: inline-block;
	font-size: 24px;
	font-family: "Open Sans";
	border: none;
	color: #252525;
	font-weight: 800;
}
.stats-tabs li a:hover {
	color: #028c4c;
}
.stats-tabs li a em {
	display: block;
	margin: 6px 0 0 0;
	font-size: 14px;
	font-family: "Open Sans";
	color: #7d7e80;
}

/* Pagination
/* ------------------------------------------------------------------ */
.pagination {
	margin: 30px auto;
	text-align: center;
}
.pagination ul li {
	display: inline-block;
	margin: 0;
	padding: 0;
}
.pagination .page-numbers {
	font: 15px/24px "Open Sans";
	display: inline-block;
	padding: 6px 12px;
	font-weight: 800;
	height: 36px;
	margin-right: 3px;
	margin-bottom: 6px;
	color: #707273;
	background-color: #dde4e6;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	border-radius: 3px;
	background-clip: padding-box;
}
.pagination .page-numbers:hover {
	background: #94aab0;
	color: white;
}
.pagination .current, .pagination .current:hover {
	background-color: #028c4c;
	color: white;
}
.pagination .inactive, .pagination .inactive:hover {
	background-color: #ecf0f1;
	color: #a3a4a6;
}

/* 
/* g. Header Styles
/* =================================================================== */
header {
	height: 90px;
	width: 100%;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 990;
	text-align: center;
	background: white;
	-moz-transition: background 0.5s ease-in-out;
	-o-transition: background 0.5s ease-in-out;
	-webkit-transition: background 0.5s ease-in-out;
	-ms-transition: background 0.5s ease-in-out;
	transition: background 0.5s ease-in-out;
	box-shadow: 4px 5px 14px -6px rgba(0, 0, 0, 0.75);
	 -webkit-box-shadow: 4px 5px 14px -6px rgba(0, 0, 0, 0.75);
}
header .logo {
	display: inline-block;
	vertical-align: middle;
	margin: 0;
	padding: 0;
	margin-right: 15px;

	/* add position relative since z-index only applies to
	elements that have been given an explicit position */
	position: relative;
	z-index: 992;
}
header .logo > a {
	display: block;
	margin: 0 0px 0 0;
	padding: 0;
	border: none;
	outline: none;
	font: 0/0 a;
	text-shadow: none;
	color: transparent;
	/* width: 126px; */
	/* height: 12px; */
	background-repeat: no-repeat;
	background-position: 0 0;
	background-image: url("/frontend/images/logo2.png");
}
@media (-webkit-min-device-pixel-ratio:2), (min-resolution:192dpi) {
	header .logo > a {
		background-image: url("/frontend/images/logo2x.html");
		-webkit-background-size: 126px 12px;
		-moz-background-size: 126px 12px;
		background-size: 126px 12px;
	}
}
.opaque {
	background: #fff;
	border-bottom: 1px solid #eee;
}

.navbar-items {
	display: flex;
	align-items: center;
	height: 100%;
}

.hidden-sm, .header_row {
	height: 100%;
}
.header_row {
    justify-content: space-evenly;
}

/* primary navigation
--------------------------------------------------------------------- */
#nav-wrap, #nav-wrap ul, #nav-wrap li, #nav-wrap a {
	margin: 0;
	padding: 0;
	border: none;
	outline: none;
}

/* nav-wrap */
#nav-wrap {
	font: 11px "Open Sans";
	text-transform: uppercase;
	letter-spacing: 1.5px;
	font-weight: 800;
	display: inline-block;
}

/* hide toggle button */
#nav-wrap > a {
	display: none;
}
ul#nav {
	min-height: 72px;
	width: auto; 

	/* left align the menu */
	text-align: left;
}
ul#nav li {
	position: relative;
	list-style: none;
	height: 72px;
	display: inline-block;
}
ul#nav li a {
	display: inline-block;
	padding: 17px 12px;
	line-height: 38px;
	text-decoration: none;
	color: #fff;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	-webkit-transition: all 0.2s ease-in-out;
	-ms-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}
.opaque ul#nav li a {
	color: #000;
}
.text-primary {
	color: #028c4c;
}
ul#nav li a:hover {
	color: #028c4c;
}
ul#nav li a:active {
	background-color: transparent !important;
}
ul#nav li.current a {
	color: #028c4c;
}
ul#nav li.current a:after {
    content: '';
    width: 100%;
    height: 2px;
    background-color: #028c4c;
    display: block;
}


/* 
/* h. Content Styles
/* =================================================================== */

#content {
	background: white;
	padding-top: 66px;
	padding-bottom: 102px;
}
#content #main {
	padding-top: 6px;
}
#content #sidebar {
	padding-top: 12px;
	padding-left: 30px;
}


/* sibebar styles
-------------------------------------------------------------------- */
#sidebar h5 {
	font: 14px/24px "Open Sans";
	text-transform: uppercase;
	letter-spacing: 1px;
	margin-top: 0;
}
#sidebar .widget {
	margin-bottom: 15px;
}

/* search */
#sidebar .widget_search {
	padding-top: 0;
	margin-bottom: 24px;
}
#sidebar .widget_search h5 {
	display: none;
}
#sidebar .widget_search form {
	position: relative;
	margin: 0;
}
#sidebar .widget_search .text-search {
	padding-right: 40px;
	width: 100%;
	min-width: 150px;
	border-radius: 3px;
	background: white;
}
#sidebar .widget_search .submit-search {
	display: none;
}

/* link list */
#sidebar .widget_categories ul {
	margin-top: 15px;
	margin-bottom: 18px;
}
#sidebar .link-list {
	padding: 0;
	margin: 15px 10px 24px 0;
	font-weight: 800;
	list-style: none;
}
#sidebar .link-list li {
	font: 14px/24px "Open Sans";
	padding: 8px 0 8px 3px;
	margin: 0;
}
#sidebar .link-list li a {
	color: #7d7e80;
}
#sidebar .link-list li a:hover {
	color: #028c4c;
}

/* tag cloud */
#sidebar .tagcloud {
	margin: 18px 0 24px -12px;
	padding: 0;
	font-size: 17px;
}
#sidebar .tagcloud a {
	font: 12px/24px "Open Sans" !important;
	display: inline-block;
	font-weight: 800;
	float: left;
	margin: 0 0 12px 12px;
	padding: 6px 15px;
	position: relative;
	text-transform: uppercase;
	letter-spacing: 1px;
	border-radius: 3px;
	background: #ecf0f1;
	text-decoration: none;
	letter-spacing: .5px;
	color: #707273;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	-webkit-transition: all 0.2s ease-in-out;
	-ms-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}
#sidebar .tagcloud a:hover {
	color: white;
	background: #028c4c;
}

/* photostream */
#sidebar .photostream {
	list-style: none;
	margin: 15px 0 24px -15px;
	padding: 0;
	overflow: hidden;
}
#sidebar .photostream li {
	display: inline-block;
	margin: 0 0 12px 12px;
	padding: 0;
}
#sidebar .photostream li a {
	display: block;
	height: 66px;
	width: 66px;
	background: #fff;
	padding: 9px;
	border: 1px solid #e3e9eb;
	border-radius: 3px;
}
#sidebar .photostream li a img {
	vertical-align: bottom;
}


/* 
/* i. Footer Styles
/* =================================================================== */
footer {
	padding-top: 36px;
	padding-bottom: 42px;
	font-size: 13px;
	line-height: 24px;
	position: relative;
	color: #898f93;	
}
footer a, footer a:visited {
	color: #028c4c;
}
footer a:hover, footer a:focus {
	color: black;
}
footer h3 {
	font: 13px/24px "Open Sans";
	font-weight: 800;
	margin-bottom: 0;
	color: black;
	text-transform: uppercase;
	letter-spacing: 1px;
}
footer p {
	margin: 12px 0;
	color:black;
	font-size: 14px;
}
footer span{
	font-size: 14px;
	color:black

}

footer .footer-about {
	padding-right: 60px;
}
footer .right-cols .columns {
	width: 50%;
	word-wrap: break-word;
}
footer ul {
	margin: 12px 0;
	padding: 0;
	list-style: none;
}
footer ul li {
	margin: 0;
	padding-left: 0;
	line-height: 24px;
}
footer ul li a, footer ul li a:visited {
	color: black;
}
footer ul li a:hover {
	color: #028c4c;
}
footer .copyright {
	margin: 0;
	padding: 24px 18px 6px 18px;
	clear: both;
}

/* back to top */
footer #go-top {
	position: fixed;
	bottom: 0;
	right: 30px;
	z-index: 900;
	display: none;
}
footer #go-top a {
	display: block;
	padding: 12px 30px;
	background: #028c4c;
	color: white;
	text-align: center;
	font-weight: 800;
	font: 12px/24px "Open Sans";
	text-transform: uppercase;
	letter-spacing: 2px;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	-webkit-transition: all 0.2s ease-in-out;
	-ms-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}
footer #go-top a span {
	margin-right: 10px;
}
footer #go-top a:hover {
	background: #14ff1a;
	color: #252525;
}


/* 
/* j. Common and shared styles
/* =================================================================== */

hr {
	border: solid #028c4c;
	border-width: 3px 0 0;
	width: 90px;
	margin: 11px auto 15px;
	height: 0;
	clear: both;
	text-align: center;
}

/* section head
---------------------------------------------------------------------- */
.section-head {
	text-align: center;
}

.section-head h2 {
    font-weight: 700;
    font-size: 2rem;
}
.section-head h1 span {
	color: #028c4c;
}
.section-head p {
	font: 18px/36px "Open Sans";
	font-weight: 400;
	color: #707273;
	margin-left: auto;
	margin-right: auto;
}

/* page title
---------------------------------------------------------------------- */
#page-title {
	background: #12151b url(/frontend/images/hero-bg.jpg) no-repeat center center fixed;
	-webkit-background-size: cover !important;
	-moz-background-size: cover !important;
	background-size: cover !important;
	padding-top: 108px;
	padding-bottom: 60px;
	text-align: center;
}
#page-title .row {
	max-width: 724px;
}
#page-title h1 {
	font: 54px/1.3 "Open Sans";
	font-weight: 800;
	color: white;
	letter-spacing: -1px;
	margin-bottom: 0;
	text-shadow: 0 0px 5px rgba(0, 0, 0, 0.5);	
}
#page-title h1 span {
	color: #028c4c;
}
#page-title p {
	color: #cfd9db;
	margin: 0;
	text-shadow: 0 0px 5px rgba(0, 0, 0, 0.5);
}

/* entry
---------------------------------------------------------------------- */
.entry {
	padding-bottom: 12px;
	margin-bottom: 24px;
}
.entry header {
	height: auto;
	position: static;
	background: transparent;
	text-align: left;
}
.entry header h1 {	
	font: 30px/36px "Open Sans";
	font-weight: 800;
	margin-bottom: 6px;
}
.entry header h1 a {
	color: #252525;
}
.entry .entry-meta ul {
	margin: 0 0 6px 3px;
	color: #8f9091;
	line-height: 24px;
}
.entry .entry-meta ul li {
	display: inline;
	margin: 0;
	padding: 0;
	font-size: 11px;
	letter-spacing: 1px;
	font-family: "Open Sans";
	text-transform: uppercase;
}
.entry .entry-meta ul li a {
	color: #8f9091;
}
.entry .entry-meta ul .meta-sep {
	margin: 0 5px;
	color: #c0cdd1;
}
.entry .entry-content-media {
	margin: 24px 0 18px;
}

/* pagenav
---------------------------------------------------------------------- */
.pagenav {
	margin: 18px 0 6px;
	padding: 12px 0 0 0;
	font: 15px/30px "Open Sans";
}
.pagenav a {
	font: 0/0 a;
	text-shadow: none;
	color: transparent;
}
.pagenav a[rel="next"]:after, 
.pagenav a[rel="prev"]:before {
	float: left;
	text-align: center;
	display: inline-block;
	background: transparent;
	color: #028c4c;
	border-radius: 3px;
	border: 3px solid #028c4c;
	font-family: 'FontAwesome';
	font-size: 16px;
	padding: 21px 15px;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.pagenav a[rel="next"]:after {
	content: "\f054";
}
.pagenav a[rel="prev"]:before {
	content: "\f053";
	margin-right: 6px;
}
.pagenav a[rel="next"]:hover:after, .pagenav a[rel="prev"]:hover:before {
	color: white;
	background: #028c4c;
}
.entries .pagenav {
	margin-top: -18px;
}

/* 
/* k. Hero Section
/* =================================================================== */
#hero {
	background: url(https://img1.wsimg.com/isteam/videos/uA41GmyyG8IMaxXdb) no-repeat center center;
	-webkit-background-size: cover !important;
	-moz-background-size: cover !important;
	background-size: cover !important;
	padding-top: 66px;
	padding-bottom: 90px;
	width: 100%;
	text-align: center;
	position: relative;
	background-attachment: scroll; /* Change from fixed to scroll */
}
.ie8 #hero { background: #12151b; }

/* Flex slider settings
/* ------------------------------------------------------------------ */
.flexslider a:active, .flexslider a:focus {
	outline: none;
}
.slides, .flex-control-nav, .flex-direction-nav {
	margin: 0;
	padding: 0;
	list-style: none;
}
.slides li {
	margin: 0;
	padding: 0;
}

/* Necessary Styles */
.flexslider {
	position: relative;
	zoom: 1;
	margin: 0;
	padding: 0;
}
.flexslider .slides {
	zoom: 1;
}
.flexslider .slides > li {
	position: relative;
}

/* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides > li {
	/* display: none; */
	-webkit-backface-visibility: hidden;
}

/* Suggested container for slide animation setups. Can replace this with your own */
.flex-container {
	zoom: 1;
	position: relative;
}

/* Clearfix for .slides */
.slides:before, .slides:after {
	content: " ";
	display: table;
}
.slides:after {
	clear: both;
}

/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
* include js that eliminates this class on page load */
.no-js .slides > li:first-child {
	display: block;
}

/* Slider Styles */
.slides {
	zoom: 1;
}
.slides > li {
	overflow: hidden;
}

/* hero slider
/* ------------------------------------------------------------------ */
#hero-slider {
	margin: 108px auto 30px;
}
#hero-slider .flex-caption {
	margin: 0 15%;
	padding: 36px 12px;
}
#hero-slider .flex-caption h1 {
	font: 36px/1.3 "Open Sans";
	font-weight: 700;
	color: white;
	letter-spacing: -1px;
	margin-bottom: 10px;
	text-shadow: 0 0px 5px rgba(0, 0, 0, 0.5);
}
#hero-slider .flex-caption h1 span, 
#hero-slider .flex-caption h1 a {
	color: white;
	display: inline-block;
	border-bottom: 1px solid #028c4c;
}
#hero-slider .flex-caption h1 span:hover, 
#hero-slider .flex-caption h1 a:hover {
	border-color: #9a9103;
}
#hero-slider .flex-caption .button.stroke, #about-section .button.stroke {
	margin: 0;
	padding: 9px 20px;
	width: 275px;
	text-transform: uppercase;
	letter-spacing: 1.5px;
	border-color: #028c4c;
	color: white;
	white-space: break-spaces;
	text-shadow: 0 0px 5px black;
	-webkit-box-shadow: 0 0px 5px 0px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 0 0px 5px 0px rgba(0, 0, 0, 0.5);
	box-shadow: 0 0px 5px 0px rgba(0, 0, 0, 0.5);
}
#hero-slider .flex-caption .button.stroke:hover, #about-section .button.stroke:hover {
	color: white;
	text-shadow: none;
	background: #028c4c !important;
}

/* Slider Control Nav */
.hero-content .flex-control-nav {
	width: 80%;
	margin: 0 auto;
	display: block;
	z-index: 889;
	position: relative;
}
.hero-content .flex-control-nav li {
	margin: 0 6px;
	display: inline-block;
	zoom: 1;
	*display: inline;
}
.hero-content .flex-control-paging li a {
	width: 15px;
	height: 15px;
	display: block;
	cursor: pointer;
	border-radius: 100%;
	border: 2px solid white;
	background: transparent;
	box-shadow: none !important;
	font: 0/0 a;
	text-shadow: none;
	color: transparent;
	-webkit-box-shadow: 0 0px 5px 0px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 0 0px 5px 0px rgba(0, 0, 0, 0.5);
	box-shadow: 0 0px 5px 0px rgba(0, 0, 0, 0.5);
}
.hero-content .flex-control-paging li a:hover {
	border-color: #028c4c;
}
.hero-content .flex-control-paging li a.flex-active {
	border-color: #028c4c;
	cursor: default;
}

/* 
/* l. Portfolio Section
/* =================================================================== */
#portfolio {
	background: white;
	padding-top: 120px;
}
.ie #portfolio .row.items {
	width: 1140px;
}
#portfolio .row.items {
	max-width: 1200px;
}

/* Portfolio wrapper */
#portfolio-wrapper {
	margin-top: 36px;
}

/* portfolio items */
.item .item-wrap {
	overflow: hidden;
	position: relative;
}
.item .item-wrap a {
	display: block;
	cursor: pointer;
}
.item .item-wrap .overlay {
	background: #ed560e;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	filter: alpha(opacity=0);
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	opacity: 0;
	zoom: 1;
	-moz-transition: opacity 0.3s ease-in-out;
	-o-transition: opacity 0.3s ease-in-out;
	-webkit-transition: opacity 0.3s ease-in-out;
	-ms-transition: opacity 0.3s ease-in-out;
	transition: opacity 0.3s ease-in-out;	
}
.item .item-wrap img {
	vertical-align: bottom;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.item .item-wrap .portfolio-item-meta {
	position: absolute;
	top: 10%;
	left: 10%;
	filter: alpha(opacity=0);
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	opacity: 0;
	zoom: 1;
	-moz-transition: opacity 0.3s ease-in-out;
	-o-transition: opacity 0.3s ease-in-out;
	-webkit-transition: opacity 0.3s ease-in-out;
	-ms-transition: opacity 0.3s ease-in-out;
	transition: opacity 0.3s ease-in-out;
}
.item .item-wrap .portfolio-item-meta h5 {
	font: 15px/21px "Open Sans";
	font-weight: 800;
	margin: 0;
	color: white;
	word-wrap: break-word;
}
.item .item-wrap .portfolio-item-meta p {
	font: 14px/18px "Open Sans";
	font-weight: 700;
	color: #fbcab3;
	margin: 0;
}

/* on item hover */
.item:hover .overlay {
	filter: alpha(opacity=100);
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	opacity: 1;
	zoom: 1;
}
.item:hover .portfolio-item-meta {
	filter: alpha(opacity=100);
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	opacity: 1;
	zoom: 1;
}
.item:hover .item-wrap img {
	-moz-transform: scale(1.2);
	-o-transform: scale(1.2);
	-webkit-transform: scale(1.2);
	-ms-transform: scale(1.2);
	transform: scale(1.2);
}

/* 
/*  m. Services Section
/* =================================================================== */
.service-list {
	margin: 15px -10px 0 -10px;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
}
.service-list .bgrid {
	width: 100%;
	margin-top: 15px;
	margin-bottom: 15px;
	padding: 0 10px;
	display: flex;
    align-items: stretch;
}

.service-list .bgrid .inner {
	border: 1px solid #cfcfcf;
	display: flex;
    flex-direction: column;
}

.service-list .icon-part {
	background: #028c4c;
	color: white;
	width: 72px;
	padding: 15px 3px;
	font-size: 40px;
	border-radius: 3px;
	margin: 0 auto;
}
.service-list h3 {
	font: 16px/24px "Open Sans";
	font-weight: 800;
	background-color: #cfcfcf;
    margin: 0;
    padding: 10px 0;
	text-transform: uppercase;
}
.service-list .service-content {
	padding: 0 22px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	height: 100%;
	text-align: justify;
	padding-bottom: 1.5rem;
}
.service-list p {
	color: #707273;
	position: relative;
	top: -6px;
}

/* 
/*  m2. privacy Section
/* =================================================================== */
#privacy{
	background: #fff;
	padding-top: 45px;
	padding-bottom: 45px;
	text-align: center;
}
.privacy-copy li{
	margin-left: 20px;
	font-size: 10px;
}
#privacy li {
	font: 16px / 36px "Open Sans";
	font-weight: 400;
	color: #000;
}
#privacy ol, #privacy ul{
	padding-left: 3.3rem;
}

#privacy ul p{
	margin-left: 0;
	margin-right: 0;
}

/* 
/*  m2. cookies Section
/* =================================================================== */
#cookies-policy{
	background: #ecf0f1;
	padding-top: 45px;
	padding-bottom: 45px;
	text-align: center;
}
.cookies-policy-copy li{
	margin-left: 20px;
	font-size: 10px;
}

#cookies-policy li {
	font: 16px / 36px "Open Sans";
	font-weight: 400;
	color: #000;
}
#cookies-policy ol {
	padding-left: 5rem;
}

#cookies-policy ul{
	padding-left: 3.3rem;
}

#cookies-policy table {
	font: 16px / 26px "Open Sans";
	font-weight: 400;
    width: 100%;
    border-collapse: collapse;
    border-width: 1px;
    border-color: rgb(209, 213, 219);
	margin-left: 2.5rem;
	margin-bottom: 2rem;
}

#cookies-policy table th {
    background-color: rgb(243, 244, 246);
    text-align: left;
}

#cookies-policy table th, #cookies-policy table td {
    border: 1px solid;
    border-color: rgb(209, 213, 219);
    padding: 0.5rem;
}


/* 
/*  n. About Section
/* =================================================================== */

#about {
	background: white;
	padding-top: 45px;
	padding-bottom: 45px;
}
#about .about-content {
	/* max-width: 934px; */
}
#about h3 {
	font: 16px/36px "Open Sans";
	font-weight: 800;
	text-transform: none;
	padding: 0;
	margin-bottom: 0;
}
#about p {
	color: #707273;
}
#about .left {
	padding-right: 30px;
}
#about .right {
	padding-left: 30px;
}

/* Team Section
/* -------------------------------------------------------------------- */
#about #team {
	background: #ecf0f1;
	margin-top: 66px;
	padding-top: 78px;
	padding-bottom: 120px;
}
#team-wrapper {
	margin: 24px -18px 0 -18px;
}
#team-wrapper .bgrid {
	padding: 0 18px;
}
#team-wrapper .member {
	margin-top: 18px;
	margin-bottom: 36px;
}
#team-wrapper .member-header {
	position: relative;
	margin-bottom: 15px;
}
#team-wrapper .member-pic {
	width: 78px;
	height: 78px;
	display: inline-block;
	position: relative;
	top: 12px;
}
#team-wrapper .member-pic img {
	border-radius: 100%;
}
#team-wrapper .member-name {
	display: inline-block;
	padding-top: 9px;
	margin-left: 12px;
}
#team-wrapper .member-name h3 {
	line-height: 24px;
	margin-top: 0;
	margin-bottom: 6px;
}
#team-wrapper .member-name span {
	position: relative;
	top: -6px;
	font-size: 13px;
	line-height: 18px;
	color: #028c4c;
	display: block;
}
#team-wrapper .member-social {
	font-size: 18px;
	font-weight: normal;
	line-height: 24px;
	margin: 12px 0 0 0;
	padding: 0;
}
#team-wrapper .member-social li {
	display: inline-block;
	margin-right: 15px;
}
#team-wrapper .member-social li a {
	color: #252525;
}
#team-wrapper .member-social li a:hover {
	color: #028c4c;
}


/* 
/*  o. Journal Section
/* =================================================================== */
#journal {
	background: #028c4c url(/frontend/images/blog-bg.jpg) no-repeat bottom center fixed;
	-webkit-background-size: cover !important;
	-moz-background-size: cover !important;
	background-size: cover !important;
	padding-top: 45px;
	padding-bottom: 45px;
	width: 100%;
}
#journal h1, #journal h3, #journal h3 a {
	color: white;
}
#journal h3 {
	font: 16px/27px "Open Sans";
	font-weight: 800;
	padding: 0;
	margin: 0;
}
#journal h5 {
	font-size: 13px;
	color: #028c4c;
	margin: 0;
}
#journal p {
	color: #fffcfb;
}
#journal #blog-wrapper {
	margin: 24px 0 0 0;
}
#journal #blog-wrapper .bgrid {
	padding: 0 18px;
}
#journal #blog-wrapper article {
	margin-bottom: 24px;
}


/* 
/*  p. Contact Section
/* =================================================================== */
#contact {
	padding-top: 45px;
	padding-bottom: 45px;
	overflow: hidden;
}
#contact .row {
	max-width: 784px;
}
#contact h1 {
	color: white;
}

/* contact form */
#contact form {
	margin-top: 30px;
	margin-bottom: 30px;
}
#contact label {
	font: 16px/30px "Open Sans";
	font-weight: 800;
	color: #7d7e80;
	display: none;
}
#contact label span {
	color: #028c4c;
	display: inline-block;
}
#contact input, 
#contact textarea, 
#contact select {
	padding: 18px 20px;
	margin-bottom: 0;
	font-size: 15px;
	width: 100%;
	background: #12151b;
	border: 3px solid #77797a;
}
#contact .columns {
	margin-bottom: 42px;
}
#contact textarea {
	height: 90px;
	min-height: unset;
}
#contact input:focus, 
#contact textarea:focus, 
#contact select:focus {
	color: white;
	border-color: white;
}
#contact button.submit {
	text-transform: uppercase;
	letter-spacing: 3px;
	padding: 18px 20px;
	margin-bottom: 36px;
	line-height: 24px;
	display: block;
	border: 2px solid #028c4c;
	color: #028c4c;
	background: transparent;
}
#contact button.submit:hover {
	color: white;
	background: #028c4c;
}

/* for ie9 and lower */
.ie #contact label {
	display: block;
}
.ie #contact input, .ie #contact select {
	margin-bottom: 6px;
}
.ie #contact textarea {
	margin-bottom: 48px;
}

/* messages */
#message-warning, #message-success {
	display: none;
	background: black;
	padding: 24px 24px;
	margin-bottom: 42px;
	border-radius: 3px;
}
#message-warning {
	color: #ff6163;
}
#message-success {
	color: #ffd900;
}
#message-warning i, #message-success i {
	margin-right: 10px;
}
#image-loader {
	display: none;
	text-align: center;
}
#image-loader img {
	height: 44px;
	width: 44px;
}

/* Style Placeholder Text */
::-webkit-input-placeholder {
	color: #575859;
}
:-moz-placeholder {
	/* Firefox 18- */
	color: #575859;
}
::-moz-placeholder {
	/* Firefox 19+ */
	color: #575859;
}
:-ms-input-placeholder {
	color: #575859;
}
.placeholder {
	color: #575859 !important;
}


/* 
/* q. Blog Entry
/* =================================================================== */

.entry .tags {
	margin-top: 18px;
	font-family: "Open Sans";
	color: #707273;
}
.entry .tags a {
	font-family: "Open Sans";
	font-weight: 800;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #028c4c;
}
.entry .tags a:hover {
	color: #12151b;
}

/* comments
-------------------------------------------------------------------- */
#comments {
	padding-top: 12px;
	padding-bottom: 12px;
}
#comments h3 {
	font: 20px/30px "Open Sans";
	font-weight: 800;
	margin-bottom: 6px;
}
.commentlist {
	margin: 30px 0 54px 0;
	padding: 0;
}
.commentlist > li {
	position: relative;
	list-style: none;
	margin: 0;
	padding: 18px 0 18px 0;
	padding-left: 14%;
}
.commentlist li .avatar {
	position: absolute;
	left: 0px;
	display: block;
	height: 48px;
	width: 48px;
}
.commentlist li .avatar img {
	margin-top: 6px;
	height: 48px;
	width: 48px;
	border-radius: 100%;
}
.commentlist li .comment-info cite {
	font-weight: 800;
	font: 14px/30px "Open Sans";
	color: #252525;
}
.commentlist li .comment-info .comment-meta {
	font-size: 13px;
	line-height: 24px;
	display: block;
	color: #707273;
}
.commentlist li .comment-info .comment-meta .reply {
	font-weight: 800;
	font-family: "Open Sans";
}
.commentlist li .comment-info .comment-meta .sep {
	margin: 0 5px;
	color: #7d7e80;
}
.commentlist li .comment-text {
	clear: both;
	margin: 18px 0 0 0;
	padding: 0;
}
.commentlist li ul.children {
	margin: 0;
	padding: 18px 0 0 0;
	list-style: none;
}
.commentlist li ul.children li {
	padding-left: 5%;
	padding-top: 18px;	
}

/* comment form
-------------------------------------------------------------------- */
#comments form {
	margin-top: 36px;
}
#comments form fieldset {
	padding: 0;
}
#comments form label {
	padding-left: 24px;
	width: 41.66667%;
	float: right;
}
#comments form div {
	margin: 12px 0 18px 0;
}
#comments form input, 
#comments form textarea, 
#comments form select {
	width: 58.33333%;
	float: left;
}
#comments form .message label {
	display: none;
}
#comments form textarea {
	width: 100%;
}
#comments form span.required {
	color: #028c4c;
	font-size: 15px;
}
#comments form button {
	padding-left: 24px;
	padding-right: 24px;
	color: #028c4c !important;
	border-color: #028c4c !important;
	text-transform: uppercase;
	letter-spacing: 1px;
	margin: 0;
}
#comments form button:hover {
	color: white !important;
	background: #028c4c !important;
}


/* 
/* r. Portfolio Entry
/* =================================================================== */

.portfolio-content .entry header {
	text-align: center;
}
.portfolio-content .entry .entry-content-media {
	margin: 30px 0 0;
}
.portfolio-content .entry .entry-content-media img {
	margin-bottom: 24px;
}
.portfolio-content .entry .pagenav {
	margin-top: 0;
}
.portfolio-content .entry .pagenav a[rel="next"]:after {
	float: right;
}

/* more projects
/* ------------------------------------------------------------------- */
.more-projects {
	margin-top: 60px;
}
.more-projects h1 {
	font: 30px/36px "Open Sans";
	font-weight: 800;
	text-align: center;
	margin-bottom: 0;
}
.more-projects .portfolio-wrapper {
	text-align: left;
}

/* cookies */

#cookies-notification {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	background-color: #333;
	color: #fff;
	padding: 10px 20px;
	box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.2);
	z-index: 999;
	display: none; 
}

#cookies-notification p {
	margin: 0;
}

#cookies-notification a {
	text-decoration: underline;
}

#cookies-notification button {
	background-color: #028c4c;
	border: none;
	color: white;
	padding: 4px 15px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	font-size: 16px;
	margin: 4px 2px;
	cursor: pointer;
}

#cookie-popup {
	display: none;
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background-color: #fff;
	border: 1px solid #ccc;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
	z-index: 1000;
	max-height: 100%;
	height: 90%;
	width: 40%;
	/* overflow-y: auto; */
}

#cookie-popup .cookie-content{
	padding: 20px;
	overflow-y: auto;
	max-height: calc(100% - 100px);
}

#cookie-popup h2 {
	margin-top: 0;
	font-size: 18px;
}

#cookie-popup p {
	margin: 0;
	line-height: 1.6;
	font-size: 12px;
}

#cookie-popup p a{
	text-decoration: underline;
}

#cookie-popup p a:hover{
	color: #028c4c;
}

#cookie-popup h4 {
	font-size: 16px;
}

#cookie-popup button {
	background-color: #028c4c;
	color: white;
	padding: 4px 15px;
	margin-top: 10px;
	border: none;
	cursor: pointer;
	font-size: 0.85em;
}

#cookie-popup .button-container{
	display: flex;
	justify-content: end;
	padding: 18px;
}

.popup-footer{
	position: absolute;
	bottom: 0; 
	left: 0;
	width: 100%;
	z-index: 1000;
	background-color: white;
}
  .popup-line{
	width: 100%;
	margin: 0 0 0 0;
  }


/* accordian cookies preferences */
.accordion {
	font-size: 1rem;
	width: 100%;
	border-radius: 2px;
	border: 1px solid black;
  }
  
  .accordion-header,
  .accordion-body {
	background: white;
  }
  
  .cookie-content .accordion-header {
	padding: 0.5em 0.75em;
	color: black;
	cursor: pointer;
	font-size: 1em;
	letter-spacing: .1em;
	transition: all .3s;
	text-transform: uppercase;
	
  }

  .accordion-header-text{
	display: flex;
	justify-content: space-between;
	align-items: center;
  }
  
  
  .accordion__item {
	  border-bottom: 1px solid black;
  }
  
  .accordion__item .accordion__item {
	border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  }
  
  .accordion-header:hover {
	/* background: #2D3D99; */
	position: relative;
	z-index: 5;
  }
  
  .accordion-body {
	background: #fcfcfc;
	color: #353535;
	display: none;
  }
  
  .accordion-body__contents {
	padding: 1.5em 1.5em;
	font-size: 1.2em;  
	line-height: 1.8;
	background-color: white;
}
  
  .accordion__item.active:last-child .accordion-header {
	border-radius: none;
  }
  
  .accordion:first-child > .accordion__item > .accordion-header {
	border-bottom: 1px solid transparent;
  }
  
  .accordion__item > .accordion-header:before {
	content: "+";
	font-family: IonIcons;
	font-size: 1.2em;
	float: left;
	position: relative;
	margin: 0 1em;
	top: 0;
	transition: .3s all;
	transform: rotate(0deg);
  }

  .accordion__item.active > .accordion-header:before {
	content: "-";
  }
  
  .accordion__item.active > .accordion-header:after {
	transform: rotate(-180deg);
  }
  
  /* .accordion__item.active .accordion-header {
	background: #2D3D99;
  } */
  
  .accordion__item .accordion__item .accordion-header {
	background: #f1f1f1;
	color: #353535;
  }
  
 
/* switch */

.switch {
	position: relative;
	display: inline-block;
	width: 55px;
	height: 28px;
	margin: 0;
  }
  
  .switch input { 
	opacity: 0;
	width: 0;
	height: 0;
  }
  
  .slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #ccc;
	-webkit-transition: .4s;
	transition: .4s;
  }
  
  .slider:before {
	position: absolute;
	content: "";
	height: 20px;
	width: 20px;
	left: 4px;
	bottom: 4px;
	background-color: white;
	-webkit-transition: .4s;
	transition: .4s;
  }
  
  input:checked + .slider {
	background-color: #028c4c;
  }
  
  input:focus + .slider {
	box-shadow: 0 0 1px #028c4c;
  }
  
  input:checked + .slider:before {
	-webkit-transform: translateX(26px);
	-ms-transform: translateX(26px);
	transform: translateX(26px);
  }
  
  /* Rounded sliders */
  .slider.round {
	border-radius: 34px;
  }
  
  .slider.round:before {
	border-radius: 50%;
  }

.modal {
    display: none; /* Hidden by default */
    position: fixed;
    z-index: 2;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0, 0, 0, 0.4); /* Black with opacity */
}

.modal-content {
    background-color: #fefefe;
    padding: 20px;
    border: 1px solid #888;
    width: 80%;
    max-width: 500px;
    box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.3);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); /* Center the modal */
}

.modal .close {
    color: #aaa;
    float: right;
    font-size: 20px;
    font-weight: 800;
    cursor: pointer;
    right: 7px;
    top: -3px;
}

.modal .close:hover,
.modal .close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}

.modal p {
	text-align: justify;
}

.modal button.btn-close {
    background-color: #028c4c;
    color: white;
    padding: 2px 15px;
    margin: 0px;
    border: none;
    cursor: pointer;
    font-size: 0.85em;
}

.service-content a.btn:hover {
    color: white;
    background: #028c4c;
}

.service-content a.btn {
    text-transform: uppercase;
    width: 100%;
    line-height: 24px;
    display: block;
    border: 2px solid #028c4c;
    color: #028c4c;
    background: transparent;
	padding: 9px 16px;
	text-align: center;
	border-radius: 3px;
	font: 15px / 30px "Open Sans";
	font-weight: 700;
}

#contact-form ::-webkit-input-placeholder {
	color: #898f93;
}
#contact-form :-moz-placeholder {
	/* Firefox 18- */
	color: #898f93;
}
#contact-form ::-moz-placeholder {
	/* Firefox 19+ */
	color: #898f93;
}
#contact-form :-ms-input-placeholder {
	color: #898f93;
}
#contact-form .placeholder {
	color: #898f93 !important;
}
.d-flex {
	display: flex;
}
.justify-center {
	justify-content: center;
}
.align-items-center {
	align-items: center;
}
.tel {
	color: #028c4c;
	font-weight: 800;
	font-size: 26px;
	font-family: "Open Sans";
}
.tel i {
	color: #231f20;
}
.flex-1 {
	flex: 1;
}
.mb-2 {
	margin-bottom: 1rem;
}
.mb-4 {
	margin-bottom: 2rem;
}

.flex-center-sm {
	display: none;
}
#who-we-are-list h3 {
	text-transform: uppercase;
}
@keyframes rotate {
	100% {
		transform: rotate(1turn);
	}
}
.rainbow {
	position: relative;
	z-index: 0;
	font-weight: 700 !important;
    width: 275px !important;
    white-space: break-spaces !important;
	overflow: hidden;
	
	margin: 0;
	padding: 9px 20px;
	width: auto;
	text-transform: uppercase;
	letter-spacing: 1.5px;
	color: white;
	white-space: nowrap;
	text-shadow: 0 0px 5px black;
	-webkit-box-shadow: 0 0px 5px 0px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 0 0px 5px 0px rgba(0, 0, 0, 0.5);
	box-shadow: 0 0px 5px 0px rgba(0, 0, 0, 0.5);
	
	
	&::before {
		content: '';
		position: absolute;
		z-index: -2;
		left: -200%;
		top: -200%;
		width: 500%;
		height: 500%;
		
		background-color: #399953;
		background-repeat: no-repeat;

		background-size: 50% 50%, 50% 50%;  
		background-position: 0 0, 100% 0, 100% 100%, 0 100%;
		background-image: linear-gradient(#028c4c, #028c4c), linear-gradient(#028c4c, #028c4c), linear-gradient(#028c4c, #028c4c), linear-gradient(#fff, #fff);
		animation: rotate 4s linear infinite;
	}
	
	&::after {
		content: '';
		position: absolute;
		z-index: -1;
		left: 2px;
		top: 2px;
		width: calc(100% - 4px);
		height: calc(100% - 4px);
		background: black;
		
		border-radius: 2px;
	}
}

.rainbow:hover::after {
	color: white;
	text-shadow: none;
	background: #028c4c !important;
}


@keyframes opacityChange {
	50% {
		opacity:1;
	}
	100% {
		opacity: .5;
	}
}

.sra-sm {
	display: none;
}

.custom-check {
	display: block;
	position: relative;
	padding-left: 26px;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	font-size: 18px;
    font-weight: 700;
	color:white;
	background: white;
    border-radius: 6px;
    padding: 10px 34px;
    color: black;
	margin:0px;
	text-align: center;
}

.custom-check input {
	position: absolute;
	opacity: 0;
	cursor: pointer;
}

.custom-check .checkmark {
	position: absolute;
	top: 6px;
	left: 0;
	height: 20px;
	width: 20px;
	background-color: white;
	border-radius: 50%;
}

.custom-check:hover input~.checkmark {
	background-color: #eeeeee;
}

.custom-check input:checked~.checkmark {
	background-color: #028c4c;
}

.custom-check .checkmark:after {
	content: "";
	position: absolute;
	display: none;
}

.custom-check input:checked~.checkmark:after {
	display: block;
}

.custom-check .checkmark:after {
	top: 6px;
    left: 6px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: white;
}
.dark-card{
	background: #001e40;
    padding: 3rem;
    border-radius: 20px;
	width:100%;
}
.dark-card button{
	border-radius: 6px;
}

.grey-card{
	background: #f9f9f9;
    padding: 3rem;
    border-radius: 20px;
}
.grey-card h2{
	font-weight: 700;
    font-size: 18px;
    line-height: 23px;
    margin-top: 2rem;
    margin-bottom: 1rem;
}

.grey-card p{
	font-weight: 300;
    font-size: 17px;
    line-height: 22px;
    color: black;
}
.step-card{
    padding: 2rem;
    border-radius: 53px;
}
.step-text{
    color: #03b57a;
    font-weight: 700;
    font-size: 63px;
}
.step-card h2{
    color: black;
    font-weight: 700;
    font-size: 18px;
	text-align: center;
}

.grey-card i{
    font-size: 52px;
}
.white-card{
	background: white;
    padding: 3rem;
    border-radius: 20px;
}
.white-card i{
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 53px;
		color: #00b67a;
}
.white-card h2{
	font-size: 18px;
    font-weight: 700;
	text-align: center;
}

.custon-check-label{
	position: relative;
    color: black;
    font-weight: 800;
    font-size: 18px;
}
.check-round{
	border-radius: 50%;
    padding: 5px 9px;
	height: 32px;
	margin-top: 5px;
}
.btn-div{
    display: flex;
    display: flex;
    justify-content: center;
    grid-gap: 16px;
	flex-wrap: wrap;
}