body {
	font-family: "RF Dewi", sans-serif;
	font-feature-settings: 'liga' 1, 'calt' 1;
	color: #4C4C4C;
	font-synthesis: none;
	-moz-font-feature-settings: 'kern';
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* Blog  */

.avatar {
	border-radius: 50%;
}

:where(body .is-layout-constrained)>* {
	margin-block-start: 2rem;
	margin-block-end: 0;
}

.post-link {
	display: block;
	background: #fff;
	text-decoration: none;
	color: #4C4C4C;
	box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.15);
	transition: all .2 ease;
}

.post-link:hover {
	text-decoration: none;
	box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.25);
}

/* Search Form */
.search-form {
	background: #fff;
	border-radius: .25rem;
}

/* Posts */
.post {
	line-height: 1.7;
}

.post h1,
.post h2,
.post h3,
.post h4,
.post h5,
.post h6 {
	color: #121f26;
	font-weight: 600;
	letter-spacing: -.01em;
	margin-top: 2.75rem;
}

.post p {
	margin-top: 1.75rem;
}

.post li {
	margin-bottom: .5rem;
}

.pagination {
	justify-content: center;
}

input::placeholder,
textarea::placeholder {
	font-style: italic;
	color: #ccc;
}

img {
	max-width: 100%;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	letter-spacing: -.01em;
}

.headline {
	letter-spacing: -.03em;
}

.w-initial {
	max-width: initial;
}

.lead {
	font-weight: normal;
}

/* Hide Google Recapcha */
.grecaptcha-badge {
	visibility: hidden;
}

/* Links */
a,
.btn-link {
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

.btn:hover,
.nav-link:hover,
.dropdown-item:hover {
	text-decoration: none;
}

.homepage-hero {
	background: linear-gradient(180deg, #000 0%, #848493 100%);
}

.homepage-hero-effects {
	background: center center / cover no-repeat url('/wp-content/themes/Crank-IT/assets/images/hero-bg.svg');
}

.homepage-slide {
	box-shadow: 0 30px 60px -12px rgba(50, 50, 93, 0.4), 0 18px 36px -18px rgba(0, 0, 0, 0.5);
}

.slide-graphic {
	height: 300px;
}

@media (min-width: 992px) {
	.slide-graphic {
		height: 530px;
	}
}


.embla {
	overflow: hidden;
}

.embla__container {
	display: flex;
}

.embla__slide {
	flex: 0 0 85%;
	min-width: 0;
	margin: 0 .5rem;
}

@media (min-width: 576px) {
	.embla__slide {
		flex: 0 0 500px;
	}
}

@media (min-width: 768px) {
	.embla__slide {
		flex: 0 0 700px;
	}
}

@media (min-width: 992px) {
	.embla__slide {
		flex: 0 0 920px;
		margin: 0 1rem;
	}
}

@media (min-width: 1200px) {
	.embla__slide {
		flex: 0 0 1140px;
	}
}

@media (min-width: 1400px) {
	.embla__slide {
		flex: 0 0 1320px;
	}
}

/* Overrides */
.form-control:focus {
	box-shadow: none;
}

/* Header Primary Navigation */
.site-header {
	background: rgba(26, 26, 26, .9);
	backdrop-filter: blur(6px);
}

.nav-header .nav-link {
	color: #D2CECE;
	border-radius: .25rem;
	font-size: .875rem;
	margin: 0 .1rem;
}

.nav-header .nav-link:hover {
	color: #fff;
	background: rgba(255, 255, 255, .1);
}

/* Active States */
.page-id-20 .nav-header .page-services,
.page-id-22 .nav-header .page-company,
.page-id-24 .nav-header .page-partners,
.blog .nav-header .page-news {
	color: #fff;
	background: rgba(255, 255, 255, .2);
}

/* Mobile Navigation */
.mobile-menu .modal-content {
	background: rgba(0, 0, 0, 0.9);
}

.mobile-menu .modal-dialog {
	background: none;
}

.btn-close-menu {
	position: absolute;
	top: 1.5rem;
	right: 1.5rem;
	padding: .75rem;
	background: rgba(255, 255, 255, .2);
	backdrop-filter: blur(6px);
	font-size: 1.6rem;
	display: inline-block;
	color: #fff;
	border: none;
	border-radius: 50%;
	transition: all .2s ease;
	line-height: 1;
}

.btn-close-menu:hover {
	background: rgba(255, 255, 255, .5);
}

.mobile-nav-items a {
	display: block;
	font-size: 3rem;
	text-align: center;
	color: #fff;
	font-weight: 500;
	letter-spacing: -.02em;
	transition: all .2s ease;
	margin-bottom: 1.5rem;
	line-height: 1.2;
}

.mobile-nav-items a:hover {
	text-decoration: none;
	opacity: .6;
}

.mobile-nav-items a small {
	font-size: 1rem;
	letter-spacing: normal;
	color: #D2CECE;
}

.mobile-sub-nav a {
	display: inline-block;
	padding: .25rem 1rem;
	color: #fff;
	opacity: .8;
	transition: all .3s ease;
	font-weight: bold;
}

.mobile-sub-nav a:hover {
	opacity: .95;
}

/* Panels */
.action-panel .bg-effects {
	background: center center/cover no-repeat url(/wp-content/themes/Crank-IT/assets/images/bg-action-panel.svg);
}

.img-panel {
	position: relative;
	overflow: hidden;
	border-radius: .5rem;
	background: #f1f1f1;
	height: 620px;
}

.img-panel-content {
	max-width: 420px;
	background: rgba(0, 0, 0, .9);
	backdrop-filter: blur(10px);
	border-radius: .5rem;
	position: absolute;
	bottom: 0;
	right: 0;
}

/* Scroll Tiles */
.scroll-tile {
	background: rgba(77, 77, 77, 0.5);
	backdrop-filter: blur(10px);
	border-radius: .5rem;
	min-width: 243px;
	max-width: 243px;
	margin-right: .5rem;
	padding: .75rem;
}

/* Draggable Container */
.draggable {
	cursor: pointer;
	transition: all .2s;
	will-change: transform;
	user-select: none;
}

.draggable.active {
	cursor: grabbing;
}

.draggable-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(255, 255, 255, .5);
}

.fade-left {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 60px;
	background: linear-gradient(to right, rgba(255, 255, 255, 1) 25%, rgba(255, 255, 255, 0) 100%);
}

.fade-right {
	position: absolute;
	top: 0;
	right: 0;
	height: 100%;
	width: 60px;
	background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 75%);
}

/* Tags */
.tag {
	display: inline-block;
	padding: .2rem .5rem;
	background: rgba(4, 4, 4, 0.30);
	border-radius: .25rem;
	color: #fff;
}

/* Subpage Features */
.subpage-feature {
	background: #000;
	color: #D0D0D0;
}

.subpage-feature .container {
	height: 650px;
	position: relative;
}

.feature-content {
	position: absolute;
	bottom: 0;
	left: 0;
}

/* Accordians */
.accordion-button:focus,
.accordion-button:active {
	outline: none;
}

.accordion-button:focus {
	box-shadow: inset 0 calc(-1 * 1px) 0 #fff;
}

.accordion-flush .accordion-body,
.accordion-flush .accordion-button {}

.accordion-light .accordion-button {
	color: #fff;
}

.accordion-light .accordion-button:after {
	color: #fff;
	background-image: url("data:image/svg+xml,<svg viewBox='0 0 16 16' fill='%23fff' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z' clip-rule='evenodd'/></svg>");
	fill: #fff;
}

.accordion-light .accordion-item {
	color: inherit;
}

/* Btns */
.btn {
	transition: all .1s ease;
	padding: 0.375rem 1rem;
	border-radius: .25rem;
}

.btn-primary {
	background: #FF8000;
	border-color: #FF8000;
}

.btn-primary:hover,
.btn-primary:active {
	background: #E47302;
	border-color: #E47302;
}

.btn-light {
	background: rgba(255, 255, 255, .9);
	border: none;
}

.btn-light:hover,
.btn-light:active {
	background: #fff;
}

.btn-ghost-light {
	color: #CDCDCD;
	border: none;
}

.btn-ghost-light:hover,
.btn-ghost-light:active {
	background: rgba(255, 255, 255, .2);
	color: #FF8000;
}

.btn-dark {
	background: rgba(26, 26, 26, .9);
	border: none;
}

.btn-dark:hover,
.btn-dark:active {
	background: #1a1a1a;
	color: #FF8000;
}

.bg-orange {
	background-color: #FF8000 !important;
}

.bg-dark {
	background-color: #121f26 !important;
}

.bg-light {
	background-color: #F1F3F5 !important;
}

.bg-dark-blue {
	background-color: #1F299C;
}

.bg-light-blue {
	background-color: #47C7FC;
}

.bg-gradient-orange {
	background: linear-gradient(113deg, #FF8000 29.07%, #FFF 98.96%);
}

.bg-gradient-dark-blue {
	background: linear-gradient(113deg, #1F299C 29.07%, #FFF 98.96%);
}

.bg-gradient-light-blue {
	background: linear-gradient(104deg, #DFF6FF 10.68%, #47C7FC 98.83%);
}


.text-orange {
	color: #FF8000 !important;
}

.text-light-blue {
	color: #47C7FC !important;
}

.text-dark-blue {
	color: #1F299C !important;
}

.text-dark {
	color: #1C1C1C !important;
}

.text-gradient-orange {
	background: linear-gradient(90deg, #FF8000 12.69%, #FFA72C 93.78%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

.shadow-xl {
	box-shadow: .4rem 1rem 3rem rgba(2, 6, 23, .65);
}

/* Opacity */
.opacity-10 {
	opacity: .1;
}

.opacity-20 {
	opacity: .2;
}

.opacity-30 {
	opacity: .3;
}

.opacity-40 {
	opacity: .4;
}

.opacity-50 {
	opacity: .5;
}

.opacity-60 {
	opacity: .6;
}

.opacity-70 {
	opacity: .7;
}

.opacity-80 {
	opacity: .8;
}

.opacity-90 {
	opacity: .9;
}