.index_background
{
	position:absolute;
	top:0;
	width:100vw;
	height:100%;
	background:#fff;
}


.demo_website_mockup
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background-size:cover !important;
	background-position:center top !important;
	background-repeat:no-repeat !important;
}

.demo_website_mockup_overlay
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background-size:cover !important;
	background-position:center top !important;
	background-repeat:no-repeat !important;
}


.index_border
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}

.index_border.block_border
{
	border-top:none;
}









.index_hero
{
	height:auto;
	z-index:99;
	padding:150px 0 150px 0;
}

@media screen and (max-width: 800px) 
{
	.index_hero
	{
		padding:120px 0 100px 0;
	}
}

.index_hero .background
{
	position:absolute;
	top:0;
	width:100vw;
	height:100%;
	overflow:hidden;
	background:#cfc8b8;
	background-size:cover;
}

.index_hero .background .video 
{
    position:absolute;
    left:50%;
    bottom:0;
    width:auto;
    height:100%;
    min-width:100vw;
    transform:translateX(-50%);
}

@media screen and (max-width: 800px) 
{
	.index_hero .background .video 
	{
	    width:auto;
	    height:100%;
    	transform:translateX(-40%);
	}
}

.index_hero .background .overlay
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.2);
}

.index_hero .background .underlay_shape
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:url('../img/hero_underlay.png') bottom center no-repeat;
	background-size:100% auto;
}

.index_hero .background .overlay_shape
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:url('../img/hero_overlay.png') bottom center no-repeat;
	background-size:100% auto;
}

.index_hero .background .overlay_color
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:#cfc8b8;
	opacity:0.2;
}

.index_hero .background .overlay_color_gradient
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:linear-gradient(90deg,rgba(255,255,255,0) 0%, #cfc8b8 100%);
	opacity:0.4;
}

.index_hero .background .overlay_dark
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.2);
}

.background .lines
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	border-left:1px solid #fff;
	opacity:0.1;
}

.background .lines .line
{
	width:25%;
	height:100%;
	border-right:1px solid #fff;
}

.background .lines.dark
{
	border-left:1px solid #393939;
	opacity:0.05;
}

.background .lines.dark .line
{
	border-right:1px solid #393939;
}

.background .lines.full
{
	opacity:1;
}

@media screen and (max-width: 800px) 
{
	.background .lines .line
	{
		width:50%;
	}
}








.demo_waves
{
	position:fixed;
	bottom:40px;
	right:120px;
	width:120vw;
	height:120vw;
	transform:translate(50%,50%);
	background-size:cover;
}

.demo_waves .wave
{
	position:absolute;
	left:40px;
	top:40px;
	width:calc(100% - 80px);
	height:calc(100% - 80px);
	border:1px solid rgba(255,255,255,0.1);
	border-radius:50%;
	box-shadow:inset 0 0 30px rgba(255,255,255,0.05);
}




.index_separator
{
	width:100vw;
	height:10px;
	background:#fff;
}

.index_separator.dark
{
	background:#cfc8b8;
}





.index_hero .content_holder
{
	height:auto;
}

@media screen and (max-width: 800px) 
{
   	.index_hero .content_holder
	{

	}
}

.index_hero .icon
{
	width:40px;
	height:40px;
	background:url('../img/321med_logo_light.png') center center no-repeat;
	background-size:cover;
	margin-bottom:30px;
}

.index_hero .title
{
	font-weight:700;
	font-size:52px;
	line-height:65px;
	text-align:center;
	margin:0;
	color:#fff;
	max-width:700px;
}

@media screen and (max-width: 800px) 
{
   	.index_hero .title
	{
		font-size:30px;
		line-height:39px;
	}
}

.index_hero .subtitle
{
	font-weight:500;
	font-size:25px;
	line-height:35px;
	text-align:center;
	margin:0;
	color:#fff;
	max-width:650px;
}

@media screen and (max-width: 800px) 
{
   	.index_hero .subtitle
	{
		font-size:19px;
		line-height:29px;
	}
}

.index_hero .pretitle
{
	font-weight:800;
	font-size:21px;
	line-height:30px;
	text-align:center;
	text-transform:uppercase;
	color:#fff;
}

@media screen and (max-width: 800px) 
{
   	.index_hero .pretitle
	{
		width:100%;
		font-size:17px;
		line-height:26px;
		text-align:center;
	}
}


.index_hero .features
{

}

.index_hero .features .feature
{
	width:auto;
	padding:0 0 0 35px;
	font-weight:500;
	font-size:21px;
	line-height:30px;
	color:#fff;
	margin:0 0 10px 0;
}

.index_hero .features .feature:before {
    content: "";
    position: absolute;
    left: 0px;
    top: 50%;
    width: 20px;
    height: 20px;
    background:url(../img/blob_check_icon_green.png) center center no-repeat;
    background-size:cover;
    margin-top: -10px;
}

@media screen and (max-width: 800px) 
{
   	.index_hero .features .feature
	{
		font-size:16px;
		line-height:25px;
	}
}





.index_hero_images
{
	width:calc(80% + 80px);
}

.index_hero_images .image
{
	width:calc(50% - 80px);
	background-size:cover !important;
	background-position:center center !important;
	background-repeat:no-repeat !important;
	margin:0 40px 0 40px;
    box-shadow: 0 50px 100px -20px rgb(50 50 93 / 25%), 0 30px 60px -30px rgb(0 0 0 / 30%);
}

.index_hero_images .image.second
{
	margin:80px 40px 0 40px;
}

.index_hero_images .image:before
{
	content:"";
	padding-top:70%;
	display:block;
}

@media screen and (max-width: 800px) 
{
   	.index_hero_images
	{
		width:100%;
	}

	.index_hero_images .image
	{
		width:90%;
		margin:20px 0 20px 0;
	}

	.index_hero_images .image.second
	{
		margin:20px 0 20px 10%;
	}
}



















.infoanimation
{
	max-width:600px;
	background:#fff;
	margin:0 0 0 0;
	overflow:hidden;
    box-shadow: 0 50px 100px -20px rgb(50 50 93 / 25%), 0 30px 60px -30px rgb(0 0 0 / 30%);
    overflow:visible;
}


.infoanimation .animation
{
    background:#fff url('../img/for_patients.gif') right center no-repeat;
    background-size:auto 100%;
	margin:0 0 0 0;
}

.infoanimation .animation:before
{
	content:"";
	display:block;
	padding-top:56.25%;
}

.infoanimation .animation .overlay
{
	position:absolute;
	left:0;
	bottom:0;
	width:100%;
	height:100%;
    background:url('../img/infoanimation_overlay.png') center center no-repeat;
    background-size:cover;
	margin:0 0 0 0;
}


.infoanimation .animation_header
{
	width:100%;
	height:60px;
	background:#cfc8b8;
	margin:0 0 0 0;
	padding:0 20px 0 20px;
	line-height:60px;
	font-size:19px;
	color:#fff;
	font-weight:300;
}

.infoanimation .animation_header .circles
{
	position:absolute;
	right:15px;
	top:20px;
	width:80px;
	height:20px;
}

.infoanimation .animation_header .circles .circle
{
	width:20px;
	height:20px;
	border-radius:50%;
	border:1px solid rgba(255,255,255,0.4);
	margin:0 5px 0 0;
}

@media screen and (max-width: 800px) 
{
   	.infoanimation
	{
		position:relative !important;
		left:0 !important;
		width:100% !important;
		height:auto !important;
		margin:30px 0 30px 0 !important;
   	 	transform:translate(0,0) !important;
	}
}

.index_hero .button_holder
{
	width:50%;
	height:40px;
}
r
.index_hero .button_holder .button_left
{
	width:calc(50% - 50px);
	height:34px;
	font-size:15px;
	font-weight:800;
	line-height:34px;
	text-align:left;
	margin:0 50px 0 0;
    border-radius:20px;
    cursor:pointer;
    padding:0 35px 0 20px;
    background:#fff url('../img/arrow_right_dark.png') right 15px center no-repeat;
    background-size:12px auto;
}

.index_hero .button_holder .button_left:hover
{
	opacity:0.9;
}

.index_hero .button_holder .button_right
{
	width:calc(50% - 50px);
	height:34px;
	font-size:15px;
	font-weight:800;
	line-height:34px;
	text-align:left;
	margin:0 50px 0 0;
    border-radius:20px;
    cursor:pointer;
    padding:0 35px 0 20px;
    background:#fff url('../img/arrow_right_dark.png') right 15px center no-repeat;
    background-size:12px auto;
}

.index_hero .button_holder .button_right:hover
{
	opacity:0.9;
}

@media screen and (max-width: 800px) 
{
	.button_holder
	{
		display:none;
	}
}


.main_features
{
	margin:30px 0 0 0;
}

.main_features .feature
{
	width:auto;
    margin: 0 0 10px 0;
    padding: 0 0 0 30px;
    font-weight: 400;
    font-size: 20px;
    line-height: 30px;
    text-align: left;
    color:#393939;
    background:url(../img/check_icon_color.png) left center no-repeat;
    background-size: 18px auto;
}

@media screen and (max-width: 800px) 
{
	.main_features
	{
		width:100%;
		margin:0 0 30px 0;
	}
}






.index_hero .banner
{
	position:absolute;
	bottom:0;
	left:0;
	width:100%;
	height:auto;
	padding:20px 0 20px 0;
}

.index_hero .banner .background
{
	position:absolute;
	top:0;
	width:100vw;
	height:100%;
	overflow:hidden;
	background:#cfc8b8;
	background-size:cover;
}

.index_hero .banner .text
{
	width:100%;
	max-width:650px;
	font-weight:300;
	font-size:21px;
	line-height:27px;
	text-align:center;
	color:#fff;
	margin:0;
}














.demo_hero
{
	height:100vh;
}

.demo_hero .background
{
	position:absolute;
	top:0;
	width:100vw;
	height:100%;
	overflow:hidden;
	background:#fff center top no-repeat;
	background-size:cover;
}

.demo_hero .background .frame
{
	position:absolute;
	top:0;
	width:100vw;
	height:100%;
	filter:blur(4px);
}

.demo_hero.demo_domain_set .background .frame
{
	filter:blur(0px);
}

.demo_hero .background .overlay
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:linear-gradient(-90deg,rgba(0,0,0,0.5) 0%, rgba(0,0,0,0) 30%);
	pointer-events:none;
}

.demo_hero.demo_domain_set .background .overlay
{
	box-shadow:inset 0 0 100px rgba(0,0,0,0.4);
}

.demo_hero .content_holder
{
	height:auto;
}

.demo_hero.demo_domain_set .content_holder
{
}

.demo_hero .explanation_holder
{
	max-width:500px;
	background:#fff;
	padding:40px;
	border-radius:20px;
	box-shadow:0 5px 30px -3px rgba(0,0,0,0.2);
}

.demo_hero .title
{
	font-weight:800; 
	font-size:25px;
	line-height:35px;
	text-align:left;
	margin:0 0 20px 0;
	color:#393939;
}

@media screen and (max-width: 800px) 
{
   	.demo_hero .title
	{
	}
}

.demo_hero .text
{
	font-family:"500"; 
	font-size:16px;
	line-height:25px;
	text-align:left;
	color:#393939;
}

.demo_hero .button_holder
{
	position:absolute;
	right:0;
	top:0;
	width:110px;
	height:100%;
	z-index:99999999;
}

.demo_hero .button_holder .button
{
	position:absolute;
	right:50px;
	bottom:50px;
	background:#fff;
	width:60px;
	height:60px;
	border-radius:50%;
	box-shadow:0 5px 20px -5px rgba(52,52,52,0.2);
}

.demo_hero .domain_input_holder
{
	width:80%;
	max-width:400px;
	height:60px;
}

.demo_hero .domain_input
{
	width:100%;
	height:60px;
	font-size:12px;
	line-height:56px;
	letter-spacing:1px;
	font-weight:700;
	text-align:center;
	text-transform:uppercase;
    background:transparent;
	color:#fff;
	border:2px solid #fff;
    border-radius:35px;
    background:rgba(255,255,255,0.2);
    cursor:pointer;
}

.demo_hero .domain_submit
{
	position:absolute;
	top:15px;
	right:15px;
	width:30px;
	height:30px;
	border-radius:50%;
	background:#cfc8b8 url('../img/view_icon_light.png') center center no-repeat;
	background-size:12px auto;
	font-size:0;
	color:#cfc8b8;
}











.simulation_holder
{
	height:100vh;
}

.simulation_holder .background
{
	position:absolute;
	top:0;
	width:100vw;
	height:100%;
	overflow:hidden;
	background:#fff url('../img/simulation_holder.jpg') center top no-repeat;
	background-size:cover;
}

.simulation_holder .background .frame
{
	position:absolute;
	top:40px;
	width:100vw;
	height:calc(100% - 40px);
}

.simulation_holder .background .overlay
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0);
	box-shadow:inset 0 0 100px rgba(0,0,0,0.4);
	pointer-events:none;
}

.simulation_holder .content_holder
{
	height:auto;
}

.simulation_holder.demo_domain_set .content_holder
{
	display:none;
}

.simulation_holder .title
{
	font-weight:600; 
	font-size:35px;
	line-height:40px;
	text-align:center;
	margin:0 0 40px 0;
	color:#fff;
}

@media screen and (max-width: 800px) 
{
   	.simulation_holder .title
	{
	}
}

.simulation_holder .text
{
	max-width:700px;
	font-weight:300; 
	font-size:25px;
	line-height:35px;
	text-align:center;
	margin:0 0 40px 0;
	color:#fff;
}

@media screen and (max-width: 800px) 
{
   	.simulation_holder .text
	{
		font-weight:200;
		font-size:25px;
		line-height:35px;
		text-align:center;
		margin:0 0 40px 0;
		color:#fff;
	}
}

.simulation_holder .button_holder
{
	position:absolute;
	left:0;
	bottom:0;
	width:100vw;
	height:110px;
}

.simulation_holder .button_holder .button
{
	position:absolute;
	right:50px;
	bottom:50px;
	background:#fff;
	width:60px;
	height:60px;
	border-radius:50%;
	box-shadow:0 5px 20px -5px rgba(52,52,52,0.2);
}

.simulation_holder .domain_input_holder
{
	width:80%;
	max-width:400px;
	height:60px;
}

.simulation_holder .domain_input
{
	width:100%;
	height:60px;
	font-size:12px;
	line-height:56px;
	letter-spacing:1px;
	font-weight:700;
	text-align:center;
	text-transform:uppercase;
    background:transparent;
	color:#fff;
	border:2px solid #fff;
    border-radius:35px;
    background:rgba(255,255,255,0.2);
    cursor:pointer;
}

.simulation_holder .domain_submit
{
	position:absolute;
	top:15px;
	right:15px;
	width:30px;
	height:30px;
	border-radius:50%;
	background:#cfc8b8 url('../img/view_icon_light.png') center center no-repeat;
	background-size:12px auto;
	font-size:0;
	color:#cfc8b8;
}







.details_block .large_button_holder
{
	width:auto;
	height:50px;
	margin:40px 0 40px 0;
}

.details_block .large_button_holder .button
{
	width:300px;
	height:50px;
	font-size:15px;
	font-weight:800;
	line-height:50px;
	text-align:center;
	margin:0 10px 0 10px;
    border-radius:25px;
    cursor:pointer;
    padding:0 35px 0 20px;
    background:#cfc8b8 url('../img/arrow_right_light.png') right 15px center no-repeat;
    background-size:12px auto;
    box-shadow: 0 10px 25px -10px rgb(50 50 93 / 25%), 0 5px 30px -15px rgb(0 0 0 / 30%);
    color:#fff;
}

@media screen and (max-width: 800px) 
{
   	.details_block .large_button_holder
	{
		width:250px;
		height:120px;
	}

	.details_block .large_button_holder .button_left
	{
		margin:0 0 20px 0;
	}

	.details_block .large_button_holder .button_right
	{
		margin:0;
	}
}






.details_block .system_mockup
{
	margin:40px 0 0 0;
	background:#fff;
	box-shadow:0 2px 20px -2px rgba(52,52,52,0.2);
	border-radius:20px;
}

.details_block .system_mockup .system_block
{
	width:32%;
	padding:30px 50px 30px 50px;
	border-left:2px solid rgba(52,52,52,0.05);
	border-right:2px solid rgba(52,52,52,0.05);
}

.details_block .system_mockup .benefit_block
{
	width:34%;
	padding:30px 50px 30px 50px;
}

.details_block .system_mockup .connector
{
	width:5%;
	padding:20px;
}

.details_block .system_mockup .icon
{
	width:80px;
	height:80px;
	border-radius:30%;
	background:#fff;
	margin-bottom:20px;
	background-size:cover !important;
	background-position:center center !important;
	background-repeat:no-repeat !important;
	box-shadow:0 2px 20px -2px rgba(52,52,52,0.2), inset 0 0 0 4px #fff;
	margin-top:0px;
}

.details_block .system_mockup .title
{
	font-weight:800 !important;
	font-size:20px;
	line-height:20px;
	text-align:center;
	color:#393939;
	margin:0 0 20px 0;
}

.details_block .system_mockup .title.system
{
	font-weight:800 !important;
	font-size:30px;
	line-height:30px;
	text-align:center;
	text-transform:uppercase;
	color:#393939;
	margin:0 0 30px 0;
}

.details_block .system_mockup .title span
{
	float:none;
	display:inline;
	font-weight:200 !important;
	font-size:inherit;
	line-height:inherit;
	text-align:inherit;
	text-transform:inherit;
	color:inherit;
}

.details_block .system_mockup .text
{
	max-width:none;
	font-weight:300;
	font-size:16px;
	line-height:25px;
	text-align:center;
	opacity:0.4;
	color:#393939;
}

.details_block .system_mockup .feature 
{
    margin: 0 0 10px 0;
    padding: 0 0 0 30px;
    font-weight: 400;
    font-size: 16px;
    line-height: 23px;
    text-align: left;
    color: rgba(57,57,57,0.4);
    background: url(../img/check_icon_color.png) left center no-repeat;
    background-size: 18px auto;
}

.details_block .system_mockup .module
{
	height:50px;
    margin: 0 0 10px 0;
    padding: 0 0 0 40px;
    font-weight: 800;
    font-size: 14px;
    line-height: 50px;
    text-align: left;
    color: #393939;
    background:rgba(52,52,52,0.05) url(../img/check_icon_color.png) left 10px center no-repeat;
    background-size: 18px auto;
    border-radius:10px;
}

.details_block .system_mockup .connector_button_left
{
	position:absolute;
	top:50%;
	left:34%;
	width:40px;
	height:40px;
	border-radius:50%;
    margin:-20px 0 0 -20px;
    background:#cfc8b8 url(../img/exchange_arrows.svg) center center no-repeat;
    background-size: 18px auto;
}

.details_block .system_mockup .connector_button_right
{
	position:absolute;
	top:50%;
	left:66%;
	width:40px;
	height:40px;
	border-radius:50%;
    margin:-20px 0 0 -20px;
    background:#cfc8b8 url(../img/exchange_arrows.svg) center center no-repeat;
    background-size: 18px auto;
}











.details_block
{
	padding:80px 0 80px 0;
}

.details_block.half_content_block
{
	padding:50px 0 50px 0;
}

.details_block.mockup_background
{
	padding:100px 0 60vh 0;
}

.details_block .background
{
	position:absolute;
	top:0;
	width:100vw;
	height:100%;
	overflow:hidden;
	background-position:left center !important;
	background-repeat:no-repeat !important;
	background-size:auto 100% !important;
}

.details_block .background.right
{
	background-position:right center !important;
}

.details_block .background.wide
{
	background-size:100% auto !important;
	background-position:center top !important;
}

.details_block .background.wide_inverted
{
	background-size:100% auto !important;
	background-position:center bottom !important;
}

@media screen and (max-width: 800px) 
{

	.details_block .background, .details_block .background.right, .details_block .background.wide
	{
		background-size:cover !important;
		background-position:center center !important;
	}
}

.details_block.mockup_background .background
{
	position:absolute;
	top:0;
	width:100vw;
	height:100%;
	overflow:hidden;
	background-position:center bottom -20vh !important;
	background-repeat:no-repeat !important;
	background-size:cover !important;
}

.details_block .background .overlay_dark
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.2);
}

.details_block .background .overlay_color
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:#cfc8b8;
	opacity:0.2;
}

.details_block .background .overlay_color_gradient
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:linear-gradient(90deg,rgba(0,0,0,0) 0%, #cfc8b8 100%);
	opacity:0.4;
}

.details_block .background .overlay_red
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:#c75146;
	opacity:0.2;
}

.details_block .background .overlay_red_gradient
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:linear-gradient(90deg,rgba(0,0,0,0) 0%, #c75146 100%);
	opacity:0.4;
}

.details_block .background .overlay_green
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:#84a98c;
	opacity:0.2;
}

.details_block .background .overlay_green_gradient
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:linear-gradient(90deg,rgba(0,0,0,0) 0%, #84a98c 100%);
	opacity:0.4;
}

.details_block .background .overlay
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:linear-gradient(90deg,rgba(0,0,0,0.1) 0%, rgba(207,200,184,1) 80%);
}

.details_block .background .overlay .line
{
	width:16.66%;
	height:100%;
	border-right:2px solid #fff;
	opacity:0.075;
}





.hero_sticker
{
    line-height: 30px;
    font-size: 20px;
    font-weight: 700;
    width: auto;
    margin: 0 0 0 50%;
    color: #fff;
    background: #cfc8b8;
    text-align: left;
    transform: translateX(-50%) rotate(-3deg);
    padding: 20px 30px 20px 30px;
    box-shadow: 0 10px 60px -20px #333;
    -webkit-box-shadow: 0 10px 60px -20px #333;
    text-transform: uppercase;
}





.details_block .content_holder
{
	height:auto;
}

.details_block.half_content_block .content_holder
{
	width:50%;
}

.details_block.half_content_block.content_left .content_holder
{
	margin-left:0;
	padding:0 40px 0 0;
}

.details_block.half_content_block.content_right .content_holder
{
	margin-left:50%;
	padding:0 0 0 40px;
}

.details_block.half_content_block .half_background
{
	position:absolute;
	top:0;
	width:50vw;
	height:100%;
	overflow:hidden;
	background-repeat:no-repeat !important;
	background-size:cover !important;
	background-color:#cfc8b8 !important;
	background-position:center center !important;
}

.details_block.half_content_block .half_background.patients
{
	background-image:url('../img/improvement_patients.png');
}

.details_block.half_content_block .half_background.facilities
{
	background-image:url('../img/improvement_facilities.png');
}

.details_block.half_content_block.content_left .half_background
{
	left:50%;
}

.details_block.half_content_block.content_right .half_background
{
	left:50%;
	margin-left:-50vw;
}

.details_block .pretitle
{
	font-weight:800;
	font-size:19px;
	line-height:25px;
	text-align:center;
	margin:0 0 20px 0;
	color:#cfc8b8;
	text-transform:uppercase;
	letter-spacing:1px;
}



.details_block .title
{
	font-weight:700;
	font-size:47px;
	line-height:60px;
	text-align:center;
	margin:0 0 20px 0;
	color:#393939;
}

.details_block .title span
{
	font-weight:700;
	width:auto;
	font-size:inherit;
	line-height:inherit;
	text-align:center;
	letter-spacing:inherit;
	text-transform:inherit;
	display:inline;
	float:none;
	color:inherit;
}

@media screen and (max-width: 800px) 
{
   	.details_block .title
	{
		font-size:22px;
		line-height:32px;
		text-align:center;
		margin:0 0 20px 0;
	}
}

.details_block .pretitle_small
{
	font-weight: 800;
    font-size: 17px;
    line-height: 23px;
    text-align: center;
    margin: 0 0 10px 0;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.details_block .title_small
{
	max-width:600px;
	font-weight:700;
	font-size:21px;
	line-height:32px;
	text-align:center;
    margin: 0 0 20px 0;
}

@media screen and (max-width: 800px) 
{
   	.details_block .title_small
	{
		font-size:16px;
		line-height:25px;
	}
}

.details_block .text
{
	font-weight:400;
	font-size:20px;
	line-height:31px;
	text-align:center;
	opacity:0.8;
}

.details_block .text span
{
	font-weight:800;
	width:auto;
	font-size:inherit;
	line-height:inherit;
	text-align:center;
	letter-spacing:inherit;
	text-transform:inherit;
	display:inline;
	float:none;
	color:inherit;
}

@media screen and (max-width: 800px) 
{
   	.details_block .text
	{
		font-weight:400;
		font-size:16px;
		line-height:25px;
		text-align:center;
	}
}
















.details_block .videos_holder
{
	width:calc(100% + 40px);
}



.details_block .videos_holder .video
{
	width:calc(50% - 40px);
	max-width:700px;
	background:#fff;
	border-radius:20px;
	overflow:hidden;
	margin:20px;
	padding:40px;
	transition:transform 0.1s ease-in-out;
}

.details_block .videos_holder .video:hover
{
	transform:scale(1.02);
	box-shadow:0 4px 24px 0 rgb(0 0 0 / 12%);
}

.details_block .videos_holder .video .video_icon
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:url('../img/demovideo_background.jpg') center center no-repeat;
	background-size:cover;
}

.details_block .videos_holder .video .video_icon .overlay
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:linear-gradient(120deg,rgba(207,200,184,0) 0%, rgba(207,200,184,1) 50%);
}

.details_block .videos_holder .video .start_title
{
	height:60px;
	line-height:30px;
	font-size:20px;
	font-weight:600;
	padding-top:40px;
	background:url('../img/play_icon_light.png') top center no-repeat;
	background-size:30px auto;
	color:#fff;
	text-align:center;
}









.details_block .demo_holder
{
	width:calc(100vw - 80px);
	box-shadow: 0 50px 100px -20px rgb(50 50 93 / 25%), 0 30px 60px -30px rgb(0 0 0 / 30%);
	background:#fff;
	border-radius:10px;
	overflow:hidden;
	transform:translateX(-50%) scale(0.8) !important;
	margin-top:-80px;
	margin-bottom:-80px;
}

.details_block .demo_holder:before
{
	content:"";
	display:block;
	padding-top:65% !important;
}

@media screen and (max-width: 800px) 
{
	.details_block .demo_holder
	{
		width:calc(120vw - 80px);
		transform:translateX(-50%) scale(0.8) !important;
	}
   	.details_block .demo_holder:before
	{
		content:"";
		display:block;
		padding-top:177.77% !important;
	}
}

.details_block .demo_holder .demo
{
	position:absolute !important;
	left:10px !important;
	top:10px !important;
	width:calc(100% - 20px) !important;
	height:calc(100% - 20px) !important;
}









.details_block .video_actions
{
	width:auto;
	height:40px;
	margin-top:40px;
}

.details_block .video_actions .video_action
{
	width:auto;
	height:34px;
	font-size:15px;
	font-weight:800;
	line-height:34px;
	text-align:left;
	margin:0 5px 0 5px;
    border-radius:20px;
    cursor:pointer;
    padding:0 35px 0 20px;
    background:#fff url('../img/arrow_right_dark.png') right 15px center no-repeat;
    background-size:12px auto;
    box-shadow: 0 10px 25px -10px rgb(50 50 93 / 25%), 0 -10px 25px -10px rgb(50 50 93 / 25%), 0 5px 30px -15px rgb(0 0 0 / 30%), 0 -5px 30px -15px rgb(0 0 0 / 30%);
}

.details_block .video_actions .video_action:hover
{
	opacity:0.9;
}










.details_block .check
{
    margin: 10px 0 0 0;
    padding: 0 0 0 35px;
    font-weight: 300;
    font-size: 17px;
    line-height: 28px;
    text-align: left;
    color: #393939;
}

.details_block .check:before
{
	content:"";
	position:absolute;
	left:0px;
	top:50%;
	width:20px;
	height:20px;
    background:#cfc8b8 url(../img/check_icon_light.png) center center no-repeat;
    background-size:40% auto;
    border-radius:50%;
    margin-top:-10px;
}

.details_block .check.bad:before
{
    background:#BE554A url(../img/check_icon_light.png) center center no-repeat;
}

.details_block .check.good:before
{
    background:#84a98c url(../img/check_icon_light.png) center center no-repeat;
}







.details_block .arrow
{
	width:calc(100% - 20px);
    margin: 10px 0 0 20px;
    padding: 0 0 0 25px;
    font-weight: 300;
    font-size: 17px;
    line-height: 26px;
    text-align: left;
    color: #393939;
}

.details_block .arrow:before
{
	content:"";
	position:absolute;
	left:0px;
	top:50%;
	width:20px;
	height:20px;
    background:url(../img/arrow_right_darker.png) left center no-repeat;
    background-size:60% auto;
    margin-top:-10px;
}




















.infographic
{
	max-width:450px;
	margin-top:60px;
    background:url(../img/index_infographic.png) center center no-repeat;
    background-size:cover;
}

.infographic:before
{
    content:"";
    display:block;
    padding-top:80%;
}









.details_block .text_action
{
	color:#393939;
	font-size:25px;
	font-weight:800;
	line-height:40px;
	text-align:center;
	margin:20px 0 20px 0;
	text-decoration:underline;
}



.details_block .signature_holder
{
	margin-top:40px;
	max-width:500px;
}

.details_block .signature
{
	width:150px;
	height:70px;
	margin:0 0 10px 0; 
	background-size:contain !important;
	background-position:left center !important;
	background-repeat:no-repeat !important;
	background:url('../img/signature.png');
}

.details_block .person
{
	width:calc(100% - 150px);
	height:70px;
	padding:0 0 0 100px;
}

.details_block .signature_avatar
{
	position:absolute;
	left:0;
	top:0;
	width:70px;
	height:70px;
	background-size:cover !important;
	background-position:center center !important;
	background-repeat:no-repeat !important;
	background:#fff url('../img/avatar.jpg');
	border-radius:50%;
	border:2px solid #fff;
}

.details_block .signature_name
{
	font-weight:600;
	font-size:18px;
	line-height:30px;
	text-align:left;
	color:#fff;
}

.details_block .signature_explainer
{
	font-weight:600;
	font-size:12px;
	line-height:16px;
	text-align:left;
	color:#fff;
	opacity:0.6;
}

.details_block .action_button
{
	width:350px;
	height:60px;
	color:#fff;
	font-size:21px;
	font-weight:800;
	line-height:60px;
	text-align:center;
    background:transparent;
	margin:0;
	background:#BE554A;
	background-size:20px auto !important;
	background-position:left 25px center !important;
	background-repeat:no-repeat !important;
	cursor:pointer;
	border-radius:35px;
	box-shadow:0 5px 20px -10px rgba(52,52,52,0.2);
}

@media screen and (max-width: 800px) 
{
   	.details_block .action_button
	{
		width:100%;
	}
}

.details_block .action_button.dark
{
	background:#cfc8b8;
	color:#fff;
}

.details_block .action_button.play
{
	background-image:url('../img/play_icon_light.png');
}

.details_block .action_button.dark.play
{
	background-image:url('../img/play_icon_light.png');
}

.details_block .action_button.demo
{
	background-image:url('../img/demo_icon_light.png');
}

.details_block .action_button.dark.demo
{
	background-image:url('../img/demo_icon_light.png');
}

.details_block .action_button:hover
{
	box-shadow:0 5px 30px -3px rgba(52,52,52,0.3);
}

.details_block .action_button.center_horizontal:hover
{
	transform:translate(-50%,-1px) !important;
}

.details_block .list
{
	max-width:700px;
}

.details_block .list .item
{
	font-weight:300;
	font-size:18px;
	line-height:30px;
	text-align:left;
	margin:0 0 10px 0;
	color:#fff;
	padding:0 0 0 30px;
}

.details_block .list .item:before
{
	content:"";
	display:block;
	position:absolute;
	left:0;
	top:12px;
	width:6px;
	height:6px;
	background:#fff;
	border-radius:50%;
}

@media screen and (max-width: 800px) 
{
   	.details_block .list
	{
		font-weight:300;
		font-size:18px;
		line-height:30px;
		text-align:left;
		margin:0 0 40px 0;
		color:#fff;
	}
}

.details_block .image
{
	max-width:600px;
	margin:20px 0 -100px 0; 
	background-size:contain !important;
	background-position:center bottom !important;
	background-repeat:no-repeat !important;
}

.details_block .image:before
{
	content:"";
	display:block;
	padding-top:60%;
}

.details_block .large_image
{
	width:60vw;
	margin:-10vw 0 -100px 0; 
	background-size:100% auto !important;
	background-position:center top !important;
	background-repeat:no-repeat !important;
	pointer-events:none;
}

.details_block .large_image:before
{
	content:"";
	display:block;
	padding-top:80%;
}

.details_block .integration_mockup
{
	margin:0; 
	background-color:#fff !important;
	background-size:100% 100% !important;
	background-position:center center !important;
	background-repeat:no-repeat !important;
	border-radius:20px;
	box-shadow:0 5px 20px -10px rgba(52,52,52,0.2);
	margin:60px 0 0 0;

}

.details_block .integration_mockup:before
{
	content:"";
	display:block;
	padding-top:60%;
}




.demo_321med_holder
{
	margin:0;
}

.demo_321med_holder .demo_container_321med
{
    height:calc(100% - 120px);
    max-width: 374px;
    background: rgb(255, 255, 255);
    border-radius: 20px;
    overflow: hidden;
    box-shadow: rgb(0 0 0 / 30%) 0px 3px 30px -3px;
    transform:translate(-50%,0) scale(0.8) !important;
}

.demo_321med_holder .demo_container_321med:before
{
    content:"";
    padding-top:184%;
    display:block;
}





.details_block .consulting_form
{
	margin-top:60px;
}

.details_block .form_headline
{
	max-width:600px;
	font-weight:800;
	font-size:20px;
	line-height:30px;
	text-align:center;
	margin:0 0 30px 0;
	color:#fff;
}

.details_block .onboarding_form
{
	margin-top:60px;
}







.details_block .details
{
	
}

.details_block .details .item
{
	width:33.3333%;
	border-right:2px solid rgba(255,255,255,0.2);
	padding:80px 40px 40px 40px;
	color:#fff;
	text-align:center;
	font-weight:300;
	font-size:16px;
	line-height:25px;
}

.details_block .details .item.no_border
{
	border:none;
}

.details_block .details .item .icon
{
	position:absolute;
	top:25px;
	width:35px;
	height:35px;
	background-size:contain !important;
	background-position:center center !important;
	background-repeat:no-repeat !important;
}






.details_block .procedure
{
	
}

.details_block .procedure .item
{
	width:33.3333%;
	border-right:2px solid rgba(255,255,255,0.2);
	padding:90px 40px 40px 40px;
	color:#fff;
	text-align:center;
	font-weight:300;
	font-size:16px;
	line-height:25px;
}

.details_block .procedure .item.no_border
{
	border:none;
}

.details_block .procedure .item .icon
{
	position:absolute;
	top:25px;
	width:45px;
	height:45px;
	line-height:45px;
	font-size:20px;
	font-weight:800;
	color:#fff;
	text-align:center;
	border:1px solid #fff;
	border-radius:50%
}















.details_block .actions
{
	width:calc(100% + 80px);
	margin-top:80px;
}

.details_block .action_item
{
	width:calc(50% - 80px);
	margin:0 40px 0 40px;
	background:#fff !important;
	padding:40px;
	border-radius:20px;
	box-shadow:0 5px 20px -10px rgba(52,52,52,0.2);
}

.details_block .action_item .icon
{
	width:35px;
	height:35px;
	background-size:contain !important;
	background-position:center center !important;
	background-repeat:no-repeat !important;
	margin-bottom:20px;
}

.details_block .action_item .title
{
	font-weight:800;
	font-size:20px;
	line-height:30px;
	text-align:center;
	text-transform:uppercase;
	margin:0 0 20px 0;
	color:#393939;
}

.details_block .action_item .title span
{
	float:none;
	width:auto;
	font-weight:800;
	font-size:inherit;
	line-height:inherit;
	display:inline;
	text-transform:inherit;
}

.details_block .action_item .text
{
	max-width:none;
	font-weight:300;
	font-size:16px;
	line-height:25px;
	text-align:center;
	color:#393939;
	opacity:0.4;
}

.details_block .action_item .button
{
	width:100%;
	height:40px;
	color:#fff;
	font-size:12px;
	font-weight:800;
	line-height:40px;
	letter-spacing:1px;
	text-align:center;
	text-transform:uppercase;
    background:transparent;
	margin:30px 0 0 0;
	background:#cfc8b8;
	border-radius:25px;
}

.details_block .action_item .button:hover
{
	opacity:0.9;
}












.details_block .pricing_items
{
	width:100%;
	max-width:600px;
	margin-top:60px;
	border-radius:20px;
	box-shadow:0 3px 30px -3px rgba(52,52,52,0.2);
	background:#fff !important;
}

.details_block .plus
{
	position:absolute;
	left:50%;
	top:50%;
	width:40px;
	height:40px;
	font-size:40px;
	line-height:40px;
	font-weight:800;
	text-align:center;
	margin:-20px 0 0 -20px;
	opacity:0.2;
}

.details_block .pricing_item
{
	width:50%;
	padding:30px 20px 30px 20px;
}

@media screen and (max-width: 800px) 
{
   	.details_block .pricing_item
	{
		width:calc(100% - 40px);
		margin:0 20px 20px 20px;
		border-right:none;
		border-bottom:1px solid rgba(52,52,52,0.05);
	}
}

.details_block .pricing_item .icon
{
	width:35px;
	height:35px;
	background-size:contain !important;
	background-position:center center !important;
	background-repeat:no-repeat !important;
	margin-bottom:20px;
}

.details_block .pricing_item .title
{
	font-weight:800;
	font-size:16px;
	line-height:20px;
	text-align:center;
	margin:0 0 10px 0;
	color:#393939;
}

.details_block .pricing_item .title span
{
	float:none;
	width:auto;
	font-weight:300;
	font-size:16px;
	line-height:20px;
	display:inline;
	text-transform:none;
}

.details_block .pricing_item .text
{
	max-width:none;
	font-weight:300;
	font-size:16px;
	line-height:22px;
	text-align:center;
	color:#393939;
	opacity:0.4;
}

.details_block .pricing_item .info
{
	max-width:none;
	font-weight:300;
	font-size:14px;
	line-height:22px;
	text-align:center;
	color:#393939;
	opacity:0.4;
}

.details_block .pricing_item .feature
{
	margin:0 0 10px 0;
	padding:0 0 0 40px;
	font-weight:300;
	font-size:16px;
	line-height:25px;
	text-align:left;
	color:rgba(57,57,57,0.4);
	background:url('../img/check_icon_color.png') left center no-repeat;
	background-size:18px auto;
}

.details_block .pricing_item .price
{
	max-width:none;
	font-weight:600;
	font-size:30px;
	line-height:30px;
	text-align:center;
	color:#393939;
	margin:0 0 10px 0;
}

.details_block .pricing_item .price span
{
	float:none;
	width:auto;
	font-weight:200;
	font-size:inherit;
	line-height:inherit;
	display:inline;
	text-transform:inherit;
	opacity:0.4;
}

.details_block .pricing_item .button
{
	width:100%;
	height:40px;
	color:#fff;
	font-size:12px;
	font-weight:800;
	line-height:40px;
	letter-spacing:1px;
	text-align:center;
	text-transform:uppercase;
    background:transparent;
	margin:40px 0 0 0;
	background:#cfc8b8;
	border-radius:25px;
}

.details_block .pricing_item .button:hover
{
	opacity:0.9;
}













.details_background
{
	position:absolute;
	top:0;
	width:100vw;
	height:100%;
	background:#fff;
}

.details_hero
{
	padding:20vh 0 15vh 0;
}

.details_hero .background
{
	position:absolute;
	top:0;
	width:100vw;
	height:100%;
	background:#cfc8b8;
	overflow:hidden;
}

@media screen and (max-width: 800px) 
{
   	.details_hero .background
	{
		overflow:hidden;
	}
}

.details_hero .background .overlay
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:#000;
	opacity:0.5;
}

.details_hero .background .colorlayer
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:#CFC8B8;
	background:rgba(207,200,184,0.7);
	background:radial-gradient(circle, rgba(207,200,184,1) 0%, rgba(207,200,184,0.7) 100%);
	opacity:0.3;
}

.details_hero .title
{
	font-weight:200;
	font-size:30px;
	line-height:40px;
	text-align:center;
	letter-spacing:2px;
	text-transform:uppercase;
	color:#9F9F9F;
	padding:0 0 30px 0;
	margin:0 0 30px 0;
}

.details_hero .title span
{
	font-weight:700;
	width:auto;
	font-size:inherit;
	line-height:inherit;
	text-align:center;
	letter-spacing:inherit;
	text-transform:inherit;
	display:inline;
	float:none;
	color:inherit;
}

.details_hero .title:before
{
	content:"";
	position:absolute;
	left:50%;
	bottom:0;
	width:40px;
	height:2px;
	background:#fff;
	margin-left:-20px;
}

.details_hero .text
{
	font-weight:300;
	font-size:25px;
	line-height:35px;
	text-align:center;
	color:#fff;
	margin:0 0 80px 0;
}

@media screen and (max-width: 800px) 
{
	.details_hero
	{
		padding:15vh 0 15vh 0;
	}

	.details_hero .title
	{
		font-weight:200;
		font-size:20px;
		line-height:30px;
	}

   	.details_hero .text
	{
		font-weight:200;
		font-size:20px;
		line-height:30px;
		text-align:center;
		margin:0 0 40px 0;
		color:#fff;
	}
}

.details_hero .button_holder
{
	width:auto;
	height:50px;
}

.details_hero .button_holder .button_left
{
	width:250px;
	height:50px;
	font-size:12px;
	font-weight:700;
	line-height:50px;
	letter-spacing:1px;
	text-align:center;
	text-transform:uppercase;
	margin:0 10px 0 0;
    background:#fff;
}

.details_hero .button_holder .button_right
{
	width:250px;
	height:50px;
	font-size:12px;
	line-height:46px;
	letter-spacing:1px;
	font-weight:700;
	text-align:center;
	text-transform:uppercase;
    background:transparent;
	margin:0 0 0 10px;
	color:#fff;
	border:2px solid #fff;
}

@media screen and (max-width: 800px) 
{
   	.details_hero .button_holder
	{
		width:250px;
		height:120px;
	}

	.details_hero .button_holder .button_left
	{
		margin:0 0 20px 0;
	}

	.details_hero .button_holder .button_right
	{
		margin:0;
	}
}
















.mockup_holder
{
	width:100vw;
	height:50vh;
	background: #cfc8b8;
	background: linear-gradient(#cfc8b8 0%, #ffffff 100%);
}


.mockup_holder .mockup
{
	position:absolute;
	left:50%;
	top:50%;
	width:80%;
	transform:translate(-50%,-55%) scale(0.5);
}

.mockup_holder .mockup:before
{
	content:"";
	padding-top:100%;
	display:block;
}

@media screen and (max-width: 800px) 
{
   	.mockup_holder .mockup
	{
		width:100vh;
	}
}

.mockup_holder .mockup .circle
{
	position:absolute;
	left:50%;
	top:50%;
	border-radius:50%;
	box-shadow:inset 0 0 50px rgba(255,255,255,1);
	transform:translate(-50%,-50%);
	opacity:0.5;
	border:2px solid rgba(255,255,255,1);
}

.mockup_holder .mockup .circle:before
{
	content:"";
	padding-top:100%;
	display:block;
}

.mockup_holder .mockup .circle_1
{
	width:45%;
	opacity:0.5;
}

.mockup_holder .mockup .circle_2
{
	width:60%;
	opacity:0.45;
}

.mockup_holder .mockup .circle_3
{
	width:75%;
	opacity:0.4;
}

.mockup_holder .mockup .circle_4
{
	width:90%;
	opacity:0.35;
}

.mockup_holder .mockup .circle_5
{
	width:105%;
	opacity:0.3;
}

.mockup_holder .mockup .circle_6
{
	width:120%;
	opacity:0.25;
}

.mockup_holder .mockup .circle_7
{
	width:135%;
	opacity:0.2;
}

.mockup_holder .mockup .circle_8
{
	width:150%;
	opacity:0.15;
}

.mockup_holder .mockup .circle_9
{
	width:165%;
	opacity:0.1;
}

.mockup_holder .mockup .circle_10
{
	width:185%;
	opacity:0.05;
}

.mockup_holder .mockup .page
{
	position:absolute;
	left:50%;
	top:50%;
	width:30%;
	background:#fff;
	transform:translate(-50%,-50%);
	overflow:hidden;
	border-radius:30%;
}

.mockup_holder .mockup .page:before
{
	content:"";
	padding-top:100%;
	display:block;
}

.mockup_holder .mockup .page .image
{
	position:absolute;
	left:0;
	top:-5%;
	width:100%;
	height:100%;
	background-color:#fff;
    background-position:center center !important;
    background-repeat:no-repeat !important;
    background-size:30% auto !important;
}

.mockup_holder .mockup .page .label
{
	position:absolute;
	top:65%;
	left:0;
	width:100%;
	height:24px;
	line-height:24px;
	font-size:24px;
	text-align:center;
	text-transform:uppercase;
	font-weight:800;
	color:#393939;
	letter-spacing:2px;
	opacity:0.2;
}

.mockup_holder .mockup .module
{
	position:absolute;
	left:50%;
	top:50%;
	width:100%;
	transform:translate(-50%,-50%);
	opacity:1;
}

.mockup_holder .mockup .module:before
{
	content:"";
	padding-top:100%;
	display:block;
}

.mockup_holder .mockup .module .line
{
	position:absolute;
	left:50%;
	top:0;
	width:8px;
	height:50%;
	background:#fff;
	opacity:0.2;
	margin-left:-4px;
}

.mockup_holder .mockup .module.module_1
{
	transform:translate(-50%,-50%) rotate(0deg);
}

.mockup_holder .mockup .module.module_2
{
	transform:translate(-50%,-50%) rotate(45deg);
}

.mockup_holder .mockup .module.module_3
{
	width:150%;
	transform:translate(-50%,-50%) rotate(90deg);
}

.mockup_holder .mockup .module.module_4
{
	transform:translate(-50%,-50%) rotate(135deg);
}

.mockup_holder .mockup .module.module_5
{
	transform:translate(-50%,-50%) rotate(180deg);
}

.mockup_holder .mockup .module.module_6
{
	transform:translate(-50%,-50%) rotate(225deg);
}

.mockup_holder .mockup .module.module_7
{
	width:150%;
	transform:translate(-50%,-50%) rotate(270deg);
}

.mockup_holder .mockup .module.module_8
{
	transform:translate(-50%,-50%) rotate(315deg);
}

.mockup_holder .mockup .module .icon
{
	position:absolute;
	left:50%;
	top:0;
	width:10%;
	background:#fff;
	border-radius:30%;
    background-position:center center !important;
    background-repeat:no-repeat !important;
    background-size:25% auto !important;
	transform:translate(-50%,0);
	border:10px solid #fff;
	box-shadow:0 10px 50px -10px rgba(57,57,57,0);
}

.mockup_holder .mockup .module.module_1 .icon
{
	transform:translate(-50%,0) rotate(0deg);
}

.mockup_holder .mockup .module.module_2 .icon
{
	transform:translate(-50%,0) rotate(-45deg);
}

.mockup_holder .mockup .module.module_3 .icon
{
	width:15%;
	transform:translate(-50%,0) rotate(-90deg);
    background-size:cover !important;
}

.mockup_holder .mockup .module.module_4 .icon
{
	transform:translate(-50%,0) rotate(-135deg);
}

.mockup_holder .mockup .module.module_5 .icon
{
	transform:translate(-50%,0) rotate(-180deg);
}

.mockup_holder .mockup .module.module_6 .icon
{
	transform:translate(-50%,0) rotate(-225deg);
}

.mockup_holder .mockup .module.module_7 .icon
{
	width:15%;
	transform:translate(-50%,0) rotate(-270deg);
    background-size:cover !important;
}

.mockup_holder .mockup .module.module_8 .icon
{
	transform:translate(-50%,0) rotate(-315deg);
}

.mockup_holder .mockup .module .icon:before
{
	content:"";
	padding-top:100%;
	display:block;
}






















.details_features
{
	width:90vw;
	max-width:900px;
	padding:40px 0 40px 0;
}

.details_features .background
{
	position:absolute;
	top:0;
	width:100vw;
	height:100%;
	overflow:hidden;
	background:#fff;
}

.details_features .hero_text
{
	font-weight:300;
	font-size:30px;
	line-height:40px;
	text-align:center;
	color:#393939;
	margin:0 0 40px 0;
	padding:0 0 40px 0;
}

.details_features .hero_text:before
{
	content:"";
	position:absolute;
	left:50%;
	bottom:0;
	width:40px;
	height:2px;
	margin:0 0 0 -20px;
	background:#393939;
}

.details_features .stream
{
	position:absolute;
	left:50%;
	top:0;
	width:4px;
	height:100%;
	background:#fff;
	margin:0 0 0 -2px;
	opacity:0.2;
}

.details_features .hero
{
	width:100vw;
	height:80px;
	background:#CFC8B8;
	line-height:80px;
	font-size:25px;
	font-weight:700;
	letter-spacing:4px;
	color:rgba(0,0,0,0.2);
	text-align:center;
	margin-bottom:120px;
	text-transform:uppercase;
}

.details_features .item_holder
{
	width:calc(100% + 40px);
}

.details_features .item
{
	width:calc(50% - 40px);
	margin:20px;
	background:rgba(57,57,57,0.03);
	padding:40px;
}

.details_features .item .content
{
  	margin-left:0;
	width:100%;
	min-height:0;
	padding:40px;
}

.details_features .item .title
{
	font-family:"500";
	font-size:20px;
	line-height:20px;
	text-align:center;
	margin:0;
	padding:0 0 20px 0;
	margin:0 0 20px 0;
	text-transform:uppercase;
	letter-spacing:2px;
}

.details_features .item .title:before
{
	content:"";
	position:absolute;
	left:50%;
	bottom:0;
	width:40px;
	height:2px;
	margin:0 0 0 -20px;
	background:#393939;
}

.details_features .item .text
{
	font-weight:300;
	font-size:16px;
	line-height:25px;
	text-align:center;
	margin:0;
	opacity:0.4;
}

.details_features .item .button_holder
{
	width:auto;
	height:40px;
	margin:30px 0 0 0;
}

.details_features .item .button_holder .button
{
	width:160px;
	height:40px;
	color:#fff;
	font-size:10px;
	font-weight:800;
	line-height:36px;
	letter-spacing:1px;
	text-align:center;
	text-transform:uppercase;
    background:transparent;
    border:2px solid #fff;
	margin:0 20px 0 0;
}

.details_features .item .button:hover
{
	opacity:0.8;
}









.details_modules
{
	width:90vw;
	max-width:900px;
	padding:80px 0 80px 0;
}

.details_modules .background
{
	position:absolute;
	top:0;
	width:100vw;
	height:100%;
	overflow:hidden;
	background:#393939;
}

.details_modules .hero_text
{
	font-weight:300;
	font-size:30px;
	line-height:40px;
	text-align:center;
	color:#CFC8B8;
	margin:0 0 60px 0;
	padding:0 0 40px 0;
}

.details_modules .hero_text:before
{
	content:"";
	position:absolute;
	left:50%;
	bottom:0;
	width:40px;
	height:2px;
	margin:0 0 0 -20px;
	background:#CFC8B8;
}

.details_modules .item_holder
{
}

.details_modules .item
{
	margin:0 0 40px 0;
	background:#fff !important;
	padding:40px;
}

.details_modules .item .content
{
  	margin-left:0;
	width:100%;
	min-height:0;
	padding:40px;
}

.details_modules .item .title
{
	font-weight:300;
	font-size:20px;
	line-height:30px;
	text-align:center;
	text-transform:uppercase;
	margin:0 0 20px 0;
}

.details_modules .item .title span
{
	float:none;
	width:auto;
	font-weight:700;
	font-size:inherit;
	line-height:inherit;
	display:inline;
	text-transform:inherit;
}

.details_modules .item .text
{
	font-weight:300;
	font-size:16px;
	line-height:25px;
	text-align:center;
	opacity:0.4;
}

.details_modules .item .button_holder
{
	width:auto;
	height:40px;
	margin:30px 0 0 0;
}

.details_modules .item .button_holder .button
{
	width:160px;
	height:40px;
	color:#fff;
	font-size:10px;
	font-weight:800;
	line-height:36px;
	letter-spacing:1px;
	text-align:center;
	text-transform:uppercase;
    background:transparent;
    border:2px solid #fff;
	margin:0 20px 0 0;
}

.details_modules .item .button:hover
{
	opacity:0.8;
}










.details_pricing
{
	width:90vw;
	max-width:900px;
	padding:80px 0 80px 0;
}

.details_pricing .background
{
	position:absolute;
	top:0;
	width:100vw;
	height:100%;
	overflow:hidden;
	background:rgba(57,57,57,0.03);
}

.details_pricing .hero_title
{
	font-weight:300;
	font-size:30px;
	line-height:40px;
	text-align:center;
	color:#393939;
	margin:0 0 30px 0;
	padding:0 0 20px 0;
}

.details_pricing .hero_title:before
{
	content:"";
	position:absolute;
	left:50%;
	bottom:0;
	width:40px;
	height:2px;
	margin:0 0 0 -20px;
	background:#393939;
}

.details_pricing .hero_text
{
	font-weight:300;
	font-size:18px;
	line-height:30px;
	text-align:center;
	color:#393939;
	margin:0 0 60px 0;
	opacity:0.4;
}

.details_pricing .item_holder
{
}


.details_pricing .hero_item
{
	margin:60px 0 2px 0;
}

.details_pricing .hero_item .subitem
{
	width:calc(33.33% - 2px);
	margin:0 2px 0 0;
	padding:20px;
	height:70px;
	background:#cfc8b8 !important;
}

.details_pricing .hero_item .title
{
	font-weight:700;
	font-size:14px;
	line-height:30px;
	text-align:center;
	text-transform:uppercase;
	color:#fff !important;
	letter-spacing:1px;
}

.details_pricing .separator
{
	width:calc(100% - 2px);
	height:40px;
	line-height:40px;
	margin:0 0 2px 0;
	background:#393939 !important;
	font-weight:800;
	font-size:12px;
	text-align:center;
	text-transform:uppercase;
	color:#fff !important;
	letter-spacing:1px;
}

.details_pricing .item
{
	margin:0 0 2px 0;
	background:transparent !important;
}

.details_pricing .item.no_border, 
.details_pricing .subitem.no_border
{
	border:none !important;
}

.details_pricing .item .subitem
{
	width:calc(33.33% - 2px);
	margin:0 2px 0 0;
	padding:40px;
	height:110px;
	background:#fff;
}


.details_pricing .item .title
{
	font-weight:300;
	font-size:18px;
	line-height:30px;
	text-align:left;
	text-transform:uppercase;
	color:#393939;
}

.details_pricing .item .title span
{
	float:none;
	width:auto;
	font-weight:700;
	font-size:inherit;
	line-height:inherit;
	display:inline;
	text-transform:inherit;
}


.details_pricing .item .price
{
	font-weight:700;
	font-size:18px;
	line-height:30px;
	text-align:center;
	text-transform:none;
}

.details_pricing .item .price span
{
	float:none;
	width:auto;
	font-weight:300;
	font-size:inherit;
	line-height:inherit;
	display:inline;
	text-transform:inherit;
}

.details_pricing .item .text
{
	position:absolute;
	width:calc(100% - 80px);
	height:auto;
	left:50%;
	top:50%;
	transform:translate(-50%,-50%);
	font-weight:300;
	font-size:14px;
	line-height:20px;
	text-align:left;
	opacity:0.4;
	color:#393939;
}

.details_pricing .item .button_holder
{
	width:auto;
	height:40px;
	margin:30px 0 0 0;
}

.details_pricing .item .button_holder .button
{
	width:160px;
	height:40px;
	color:#fff;
	font-size:10px;
	font-weight:800;
	line-height:36px;
	letter-spacing:1px;
	text-align:center;
	text-transform:uppercase;
    background:transparent;
    border:2px solid #fff;
	margin:0 20px 0 0;
}

.details_pricing .item .button:hover
{
	opacity:0.8;
}





.onboarding_holder
{
	height:auto;
	min-height:100vh;
	z-index:99;
}

.onboarding_holder .background
{
	position:absolute;
	top:0;
	width:100vw;
	height:100%;
	overflow:hidden;
	background:#cfc8b8;
	background-size:cover;
}

.onboarding_holder .background .overlay
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.2);
}

.onboarding_holder .background .overlay_shape
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:url('../img/hero_overlay.png') bottom center no-repeat;
	background-size:100% auto;
}

.onboarding_holder .background .overlay_color
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:#cfc8b8;
	opacity:0.2;
}

.onboarding_holder .background .overlay_color_gradient
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:linear-gradient(90deg,rgba(255,255,255,0) 0%, #cfc8b8 100%);
	opacity:0.4;
}

.onboarding_holder .background .overlay_dark
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.2);
}








.onboarding_box_large
{
	max-width:370px;
	background:#fff;
	padding:30px;
	margin:20px 0 20px 0;
    box-shadow: 0 50px 100px -20px rgb(50 50 93 / 25%), 0 30px 60px -30px rgb(0 0 0 / 30%);
    border-radius:10px;
}



.onboarding_box_large .hero
{
	width:calc(100% + 60px);
	font-weight:800;
	font-size:20px;
	line-height:30px;
	text-align:center;
	margin:-30px 0 30px 0;
	color:#fff;
	background:#cfc8b8;
	padding:30px;
	border-radius:10px 10px 0 0;
}

.form_input
{
	height:40px;
	color:#393939;
	font-size:15px;
	font-weight:400;
	line-height:40px;
	text-align:center;
	margin:0 0 20px 0;
	background:rgba(52,52,52,0.05);
	padding:0 15px 0 15px;
	cursor:pointer;
	border-radius:5px;
}

.form_button
{
	height:40px;
	color:#fff;
	font-size:15px;
	font-weight:800;
	line-height:40px;
	text-align:center;
    background:transparent;
	background-size:20px auto !important;
	background-position:left 25px center !important;
	background-repeat:no-repeat !important;
	cursor:pointer;
	border-radius:5px;
	background-color:#cfc8b8;
}

.form_button:hover
{
	transform:translate(0,-1px) !important;
}



























.info_block
{
	padding:100px 0 110px 0;
}

.info_block.mockup_background
{
	padding:100px 0 60vh 0;
}

.info_block .background
{
	position:absolute;
	top:0;
	width:100vw;
	height:100%;
	overflow:hidden;
	background-position:center center !important;
	background-repeat:no-repeat !important;
	background-size:100% auto !important;
}

.info_block.mockup_background .background
{
	position:absolute;
	top:0;
	width:100vw;
	height:100%;
	overflow:hidden;
	background-position:center bottom -20vh !important;
	background-repeat:no-repeat !important;
	background-size:100vh auto !important;
}

.info_block .background .overlay
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:linear-gradient(-180deg,rgba(0,0,0,0.1) 0%, rgba(207,200,184,1) 80%);
}

.info_block .background .overlay .line
{
	width:16.66%;
	height:100%;
	border-right:2px solid #fff;
	opacity:0.075;
}





.info_block .content_holder
{
	width:50%;
}

.info_block .title
{
	font-weight:800;
	font-size:35px;
	line-height:40px;
	text-align:center;
	margin:0 0 30px 0;
	color:#fff;
}

.info_block .title span
{
	font-weight:700;
	width:auto;
	font-size:inherit;
	line-height:inherit;
	text-align:center;
	letter-spacing:inherit;
	text-transform:inherit;
	display:inline;
	float:none;
	color:inherit;
}

@media screen and (max-width: 800px) 
{
   	.info_block .title
	{
		font-weight:800;
		font-size:25px;
		line-height:35px;
		text-align:center;
		margin:0 0 30px 0;
		color:#fff;
	}
}

.info_block .subtitle
{
	font-weight:800 !important;
	font-size:22px;
	line-height:25px;
	text-align:left;
	color:#cfc8b8;
	margin:60px 0 10px 0;
	padding:0 0 0 20px;
	border-left:2px solid #cfc8b8;
}

.info_block .explainer_holder
{
	margin:5vw 0 5vw 0;
}

.info_block .explainer
{
	font-weight:300;
	font-size:25px;
	line-height:40px;
	text-align:center;
	margin:0 0 0 0;
	color:#fff;
}

.info_block .text
{
	max-width:none;
	font-weight:300;
	font-size:20px;
	line-height:30px;
	text-align:center;
	margin:0 0 0 0;
	color:#fff;
}

.info_block .text a
{
	float:none;
	display:inline;
	font-size:inherit;
	line-height:inherit;
	width:auto;
	color:inherit;
	font-weight:800;
	color:#cfc8b8;
	cursor:pointer;
	margin:0;
	padding:0;
}

.info_block .subtext
{
	max-width:none;
	font-weight:300;
	font-size:18px;
	line-height:26px;
	text-align:left;
	margin:0 0 0 0;
	color:#fff;
	padding:0 0 0 20px;
}

.info_block .subtext a
{
	float:none;
	display:inline;
	font-size:inherit;
	line-height:inherit;
	width:auto;
	color:inherit;
	font-weight:800;
	color:#cfc8b8;
	cursor:pointer;
	margin:0;
	padding:0;
}

.info_block .subtext li
{
	font-size:inherit;
	line-height:inherit;
	color:inherit;
	font-weight:inherit;
	padding-left:20px;
	margin:10px 0 0 0;
}

.info_block .subtext li:before
{
	content:"·";
	position:absolute;
	left:0;
	top:0;
	width:10px;
	font-size:20px;
	font-weight:800;
	line-height:26px;
	text-align:left;
}

@media screen and (max-width: 800px) 
{
   	.info_block .text
	{
		font-weight:300;
		font-size:20px;
		line-height:30px;
		text-align:center;
		margin:0 0 0 0;
		color:#fff;
	}
}







.index_features
{

}

.index_features .feature
{
	width:25%;
	margin:0;
}

@media screen and (max-width: 800px) 
{

	.index_features
	{
		margin-bottom:-40px;
	}

	.index_features .feature
	{
		width:100%;
		margin:20px 0 20px 0;
	    padding:0 20px 0 20px;
	}

}

.index_features .feature .title
{
	font-weight:800;
	font-size:21px;
	line-height:30px;
	text-align:left;
	margin:0 0 10px 0;
	color:#cfc8b8;
	padding:0 0 0 20px;
	border-left:2px solid #cfc8b8;
}

.index_features .feature .text
{
	font-weight:300;
	font-size:17px;
	line-height:28px;
	text-align:left;
	margin:0;
	padding:0 10px 0 20px;
}









.index_checks
{
	max-width:800px;
}

.index_checks .check
{
	width:auto;
	margin:0;
	font-weight:300;
	font-size:21px;
	line-height:32px;
	text-align:left;
	margin:0;
	padding:0 10px 0 30px;
	color:#393939;
}

.index_checks .check:before
{
	content:"";
	position:absolute;
	left:0px;
	top:15px;
	width:20px;
	height:20px;
    background:#fff url(../img/check_icon_green.png) center center no-repeat;
    background-size:50% auto;
    border-radius:50%;
	box-shadow: 0 8px 17px -3px rgb(50 50 93 / 25%), 0 5px 10px -5px rgb(0 0 0 / 30%);
}

.index_checks .check_separator
{
	width:100%;
	height:10px;
	background:transparent;
	opacity:0;
}

.index_checks .check.dark
{
	color:#393939;
}

.index_checks .check.dark:before
{
    border:1px solid rgba(52,52,52,0.1);
}

.index_checks .check.bad:before
{
	content:"";
	position:absolute;
	left:0px;
	top:15px;
	width:20px;
	height:20px;
    background:#fff url(../img/cross_icon.png) center center no-repeat;
    background-size:50% auto;
    border-radius:50%;
}

@media screen and (max-width: 800px) 
{


	.index_checks .check
	{
		font-size:17px;
		line-height:28px;
	}

	.index_checks .check:before
	{
		top:15px;
		width:16px;
		height:16px;
	}

}















.index_checkboxes
{
	width:calc(100% + 80px);
}

.index_checkbox
{
	width:calc(50% - 80px);
	margin:0 40px 0 40px;
	background:#fff;
	border-radius:10px;
	padding:30px;
	box-shadow: 0 50px 100px -20px rgb(50 50 93 / 25%), 0 30px 60px -30px rgb(0 0 0 / 30%);
}

.index_checkbox .title
{
	font-weight:800;
	font-size:25px;
	line-height:34px;
	text-align:center;
	margin:0 0 15px 0;
}

.index_checkbox .check
{
	margin:0;
	font-weight:300;
	font-size:19px;
	line-height:28px;
	text-align:left;
	margin:0 0 10px 0;
	padding:0 10px 0 30px;
	color:#393939;
}

.index_checkbox .check:before
{
	content:"";
	position:absolute;
	left:0px;
	top:15px;
	width:20px;
	height:20px;
    background:#fff url(../img/check_icon_green.png) center center no-repeat;
    background-size:50% auto;
    border-radius:50%;
	box-shadow: 0 8px 17px -3px rgb(50 50 93 / 25%), 0 5px 10px -5px rgb(0 0 0 / 30%);
}

.index_checkbox .check_separator
{
	width:100%;
	height:10px;
	background:transparent;
	opacity:0;
}

.index_checkbox .check.dark
{
	color:#393939;
}

.index_checkbox .check.dark:before
{
    border:1px solid rgba(52,52,52,0.1);
}

.index_checkbox .check.bad:before
{
	content:"";
	position:absolute;
	left:0px;
	top:15px;
	width:20px;
	height:20px;
    background:#fff url(../img/cross_icon.png) center center no-repeat;
    background-size:50% auto;
    border-radius:50%;
}

@media screen and (max-width: 800px) 
{
	.index_checkbox
	{
		width:calc(100% - 80px);
		margin:0 40px 40px 40px;
	}

	.index_checkbox .check
	{
		font-size:17px;
		line-height:28px;
	}

	.index_checkbox .check:before
	{
		top:15px;
		width:16px;
		height:16px;
	}
}










.checklists
{
	width:calc(100% + 80px);
	max-width:900px;
}

.checklists .checklist
{
	width:calc(50% - 80px);
	background:#fff;
	margin:0 40px 0 40px;
    box-shadow: 0 50px 100px -20px rgb(50 50 93 / 25%), 0 30px 60px -30px rgb(0 0 0 / 30%);
    padding:30px;
}

.checklists .checklist.second
{
	margin:80px 40px 0 40px;
}

.checklists .title
{
	font-weight:200;
	font-size:21px;
	line-height:30px;
	text-align:center;
	margin:0 0 15px 0;
	color:rgba(52,52,52,0.4);
	border-bottom:1px solid rgba(52,52,52,0.1);
	padding:0 0 25px 0;
}

.checklists .title span
{
	font-weight:800;
	font-size:inherit;
	line-height:inherit;
	text-align:inherit;
	margin:0;
	color:rgba(52,52,52,1);
	text-transform:uppercase;
}

.checklists .check
{
    margin: 15px 0 0 0;
    padding: 0 0 0 35px;
    font-weight: 300;
    font-size: 17px;
    line-height: 25px;
    text-align: left;
    color: #393939;
}

.checklists .check.bad:before
{
	content:"";
	position:absolute;
	left:0px;
	top:50%;
	width:20px;
	height:20px;
    background:#fff url(../img/cross_icon.png) center center no-repeat;
    background-size:50% auto;
    border-radius:50%;
    margin-top:-10px;
    border:1px solid rgba(52,52,52,0.1);
}

.checklists .check:before
{
	content:"";
	position:absolute;
	left:0px;
	top:50%;
	width:20px;
	height:20px;
    background:#cfc8b8 url(../img/check_icon_light.png) center center no-repeat;
    background-size:40% auto;
    border-radius:50%;
    margin-top:-10px;
}

@media screen and (max-width: 800px) 
{
   	.checklists
	{
		width:100%;
	}

	.checklists .checklist
	{
		width:100%;
		margin:20px 0 20px 0;
		padding:25px;
	}

	.checklists .checklist.second
	{
		margin:20px 0 20px 0;
	}

	.checklists .check
	{
	    margin: 10px 0 0 0;
	    padding: 0 0 0 35px;
	    font-weight: 300;
	    font-size: 15px;
	    line-height: 25px;
	    text-align: left;
	    color: #393939;
	}
}





.customers
{
	width:100%;
}

.customers .customer
{
	width:calc(25% - 40px);
	margin:20px;
	padding:12px 10px 12px 30px;
	background:#fff;
	box-shadow: 0 25px 50px -10px rgb(50 50 93 / 25%), 0 15px 30px -15px rgb(0 0 0 / 30%);
	border-radius:10px;
	overflow:hidden;
}

.customers .customer .color
{
	position:absolute;
	left:15px;
	top:12px;
	width:5px;
	height:calc(100% - 24px);
}

@media screen and (max-width: 800px) 
{
	.customers
	{
		width:calc(100% + 40px);
	}

	.customers .customer
	{
		width:calc(50% - 40px);
	}

}

.customers .customer .title
{
	font-weight:700 !important;
	font-size:11px !important;
	line-height:11px !important;
	text-align:left !important;
	margin:0 0 5px 0 !important;
	color:#393939 !important;
	overflow:hidden;
	white-space:nowrap;
	text-overflow: ellipsis;
}

.customers .customer .city
{
	font-weight:300 !important;
	font-size:11px !important;
	line-height:11px !important;
	text-align:left !important;
	margin:0 !important;
	color:#393939 !important;
	opacity:0.5;
}

.customers .customer.more
{
	background:rgba(52,52,52,0.05);
	box-shadow:none;
}

.customers .customer.more .title
{
	opacity:0.4;
}

.customers .customer.more .city
{
	opacity:0.4;
}



















.customers_spinner
{
	width:100%;
	overflow:hidden;
}

.customers_spinner .gradient_left
{
	position:absolute;
	left:0;
	top:0;
	width:100px;
	height:100%;
	background:linear-gradient(-90deg,rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
}

.customers_spinner .gradient_right
{
	position:absolute;
	right:0;
	top:0;
	width:100px;
	height:100%;
	background:linear-gradient(90deg,rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
}

.customers_spinner .customers_holder
{
	width:400%;
	animation-name: spinner;
  	animation-duration:30s;
  	animation-iteration-count: infinite;
  	animation-timing-function: linear;
}

.customers_spinner .customer
{
	width:calc(6.25% - 20px);
	margin:0 10px 0 10px;
	padding:12px 10px 12px 30px;
	background:#fff;
	box-shadow:inset 0 0 0 1px rgba(52,52,52,0.15);
	border-radius:14px;
	overflow:hidden;
	filter:grayscale(1);
	opacity:0.8;
	transition: all 0.1s ease-in-out;
}

.customers_spinner .customer:hover
{
	filter:grayscale(0);
	opacity:1;
}

.customers_spinner .customer .color
{
	position:absolute;
	left:15px;
	top:12px;
	width:5px;
	height:calc(100% - 24px);
}

@media screen and (max-width: 800px) 
{

	.customers_spinner
	{
		width:calc(100% + 40px);
	}

	.customers_spinner .customers_holder
	{
		width:800%;
		animation-name: spinner_mobile;
	  	animation-duration:50s;
	  	animation-iteration-count: infinite;
	  	animation-timing-function: linear;
	}

	.customers .customer
	{
		width:calc(50% - 40px);
	}

}

.customers_spinner .customer .title
{
	font-weight:800 !important;
	font-size:13px !important;
	line-height:13px !important;
	text-align:left !important;
	margin:0 0 5px 0 !important;
	color:#393939 !important;
	overflow:hidden;
	white-space:nowrap;
	text-overflow: ellipsis;
}

.customers_spinner .customer .city
{
	font-weight:300 !important;
	font-size:13px !important;
	line-height:13px !important;
	text-align:left !important;
	margin:0 !important;
	color:#393939 !important;
	opacity:0.4;
}

.customers_spinner .customer.more
{
	background:rgba(52,52,52,0.05);
	box-shadow:none;
}

.customers_spinner .customer.more .title
{
	opacity:0.4;
}

.customers_spinner .customer.more .city
{
	opacity:0.4;
}

@keyframes spinner 
{
  from {margin-left:0;}
  to {margin-left:-300%;}
}

@keyframes spinner_mobile 
{
  from {margin-left:0;}
  to {margin-left:-700%;}
}



















.features_spinner
{
	width:100%;
	padding:40px 0 40px 0;
	overflow:hidden;
}

.features_spinner .gradient_left
{
	position:absolute;
	left:0;
	top:0;
	width:100px;
	height:100%;
	background:linear-gradient(-90deg,rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
	cursor:pointer;
}

.features_spinner .gradient_left:before
{
	content:"";
	position:absolute;
	left:0;
	top:50%;
	width:50px;
	height:50px;
	background:url('../img/arrow_right_dark.png') center center no-repeat;
	background-size:30px auto;
	margin-top:-25px;
	display:block;
	transform:rotate(180deg);
}

.features_spinner .gradient_right
{
	position:absolute;
	right:0;
	top:0;
	width:100px;
	height:100%;
	background:linear-gradient(90deg,rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
	cursor:pointer;
}

.features_spinner .gradient_right:before
{
	content:"";
	position:absolute;
	right:0;
	top:50%;
	width:50px;
	height:50px;
	background:url('../img/arrow_right_dark.png') center center no-repeat;
	background-size:30px auto;
	margin-top:-25px;
	display:block;
}

.features_spinner .features_holder
{
	width:100%;
}

.features_spinner .feature, .features_spinner .placeholder
{
	position:absolute;
	left:0;
	top:0;
	width:calc(100% - 200px);
	margin:0 100px 0 100px;
	padding:50px 40px 50px 40px;
	background:#fff;
	border-radius:25px;
	overflow:hidden;
	display:none;
	transition:transform 0.1s ease-in-out;
}

.features_spinner .feature:hover
{
	transform:scale(1.02);
	box-shadow:0 4px 24px 0 rgb(0 0 0 / 12%);
}

.features_spinner .placeholder
{
	position:relative !important;
	box-shadow:none !important;
	background:rgba(255,255,255,0) !important;;
	opacity:0 !important;
	display:block !important;
	pointer-events:none;
}

.features_spinner .feature:first-child
{
	display:block;
}

.features_spinner .feature .image
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	max-width:none;
	height:100%;
	background-size:auto 120% !important;
	background-position:left center !important;
	background-repeat:no-repeat !important;
	margin:0;
}

.features_spinner .feature .gradient
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:linear-gradient(120deg,rgba(207,200,184,0) 0%, rgba(207,200,184,1) 50%);
}

.features_spinner .feature .title, .features_spinner .placeholder .title
{
	font-weight:600;
	font-size:30px;
	line-height:40px;
	overflow:hidden;
	margin:0 !important;
	color:#fff;
	padding-top:60px;
	background:url('../img/play_icon_light.png') top center no-repeat;
	background-size:40px auto;
}

.features_spinner .placeholder .title
{
	color:rgba(255,255,255,0) !important;
	opacity:0 !important;
}

.features_spinner .feature .text, .features_spinner .placeholder .text
{
	max-width:400px;
	font-weight:400;
	font-size:17px;
	line-height:27px;
	overflow:hidden;
	margin:0 !important;
	color:#fff;
	opacity:1;
}

.features_spinner .placeholder .text
{
	color:rgba(255,255,255,0) !important;
	opacity:0 !important;
}


@media screen and (max-width: 800px) 
{

	.features_spinner
	{
		width:100%;
		padding:40px 0 40px 0;
		overflow:hidden;
	}

	.features_spinner .gradient_left
	{
		position:absolute;
		left:0;
		top:0;
		width:40px;
		height:100%;
		background:linear-gradient(-90deg,rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
		cursor:pointer;
	}

	.features_spinner .gradient_left:before
	{
		content:"";
		position:absolute;
		left:0;
		top:50%;
		width:40px;
		height:40px;
		background:url('../img/arrow_right_dark.png') right center no-repeat;
		background-size:20px auto;
		margin-top:-25px;
		display:block;
		transform:rotate(180deg);
	}

	.features_spinner .gradient_right
	{
		position:absolute;
		right:0;
		top:0;
		width:40px;
		height:100%;
		background:linear-gradient(90deg,rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
		cursor:pointer;
	}

	.features_spinner .gradient_right:before
	{
		content:"";
		position:absolute;
		right:0;
		top:50%;
		width:40px;
		height:40px;
		background:url('../img/arrow_right_dark.png') right center no-repeat;
		background-size:20px auto;
		margin-top:-25px;
		display:block;
	}

	.features_spinner .features_holder
	{
		width:100%;
	}

	.features_spinner .feature, .features_spinner .placeholder
	{
		position:absolute;
		left:0;
		top:0;
		width:calc(100% - 80px);
		margin:0 40px 0 40px;
		padding:120px 35px 35px 35px;
		background:#fff;
		border-radius:25px;
		box-shadow: 0 1px 1px 0 rgb(0 0 0 / 12%), 0 4px 24px 0 rgb(0 0 0 / 8%);
		overflow:hidden;
		display:none;
	}

	.features_spinner .feature .image
	{
		position:absolute;
		left:0;
		top:0;
		width:100%;
		max-width:none;
		height:100%;
		background-size:120% auto !important;
		background-position:center top !important;
		background-repeat:no-repeat !important;
		margin:0;
	}

	.features_spinner .placeholder
	{
		position:relative !important;
		box-shadow:none !important;
		background:rgba(255,255,255,0) !important;;
		opacity:0 !important;
		display:block !important;
	}

	.features_spinner .feature:first-child
	{
		display:block;
	}

	.features_spinner .feature .gradient
	{
		position:absolute;
		left:0;
		top:0;
		width:100%;
		height:100%;
		background:linear-gradient(170deg,rgba(207,200,184,0) 0%, rgba(207,200,184,1) 50%);
	}

	.features_spinner .feature .title, .features_spinner .placeholder .title
	{
		font-weight:600;
		font-size:22px;
		line-height:32px;
		overflow:hidden;
		margin:0 !important;
		color:#fff;
	}

	.features_spinner .feature .text, .features_spinner .placeholder .text
	{
		max-width:400px;
		font-weight:400;
		font-size:15px;
		line-height:23px;
		overflow:hidden;
		margin:0 !important;
		color:#fff;
		opacity:1;
	}

}


















.hero_video
{
	width:calc(100% - 100px);
	margin:0 50px 0 50px;
	padding:100px 40px 100px 40px;
	background:#fff;
	border-radius:25px;
	overflow:hidden;
	transition:transform 0.1s ease-in-out;
	cursor:pointer;
}

.hero_video:hover
{
	transform:scale(1.02);
	box-shadow:0 4px 24px 0 rgb(0 0 0 / 12%);
}

.hero_video .image
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	max-width:none;
	height:100%;
	background-size:auto 120% !important;
	background-position:left center !important;
	background-repeat:no-repeat !important;
	margin:0;
}

.hero_video .dark
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.3);
}

.hero_video .gradient
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:linear-gradient(120deg,rgba(207,200,184,0) 0%, rgba(207,200,184,1) 60%);
}

.hero_video .title
{
	max-width:450px;
	font-weight:600;
	font-size:35px;
	line-height:45px;
	overflow:hidden;
	margin:0 !important;
	color:#fff;
	padding-top:60px;
	background:url('../img/play_icon_light.png') top center no-repeat;
	background-size:40px auto;
}

.hero_video .text
{
	max-width:400px;
	font-weight:400;
	font-size:15px;
	line-height:22px;
	overflow:hidden;
	margin:0 !important;
	color:#fff;
	opacity:0.6;
}





@media screen and (max-width: 800px) 
{

	.hero_video
	{
		width:calc(100% - 0px);
		margin:0;
		padding:150px 30px 50px 30px;
		background:#fff;
		border-radius:25px;
		overflow:hidden;
		transition:transform 0.1s ease-in-out;
	}

	.hero_video:hover
	{
		transform:scale(1.02);
		box-shadow:0 4px 24px 0 rgb(0 0 0 / 12%);
	}

	.hero_video .image
	{
		position:absolute;
		left:0;
		top:0;
		width:100%;
		max-width:none;
		height:100%;
		background-size:auto 80% !important;
		background-position:top center !important;
		background-repeat:no-repeat !important;
		margin:0;
	}

	.hero_video .gradient
	{
		position:absolute;
		left:0;
		top:0;
		width:100%;
		height:100%;
		background:linear-gradient(170deg,rgba(207,200,184,0) 0%, rgba(207,200,184,1) 50%);
	}

	.hero_video .title
	{
		font-weight:600;
		font-size:25px;
		line-height:35px;
		overflow:hidden;
		margin:0 !important;
		color:#fff;
		padding-top:60px;
		background:url('../img/play_icon_light.png') top center no-repeat;
		background-size:40px auto;
	}

	.hero_video .text
	{
		max-width:400px;
		font-weight:400;
		font-size:14px;
		line-height:20px;
		overflow:hidden;
		margin:0 !important;
		color:#fff;
		opacity:0.6;
	}

}

















.demo_tabs
{

}

.demo_tabs .tab_selection
{
	float:right;
	width:40%;
}

.demo_tabs .tab_selection .item
{
	padding:0 40px 0 40px;
	border-left:2px solid #cfc8b8;
	max-height:40px;
	overflow:hidden;
	margin:20px 0 20px 0;
	cursor:pointer;
	opacity:0.6;
}

.demo_tabs .tab_selection .item:last-child
{

}

.demo_tabs .tab_selection .item.open
{
	max-height:10000px;
	opacity:1;
}

.demo_tabs .tab_selection .item .title
{
	font-weight:600;
	font-size:22px;
	line-height:40px;
	overflow:hidden;
	margin:0 0 5px 0 !important;
	text-align:left;
}

.demo_tabs .tab_selection .item .text
{
	max-width:400px;
	font-weight:400;
	font-size:16px;
	line-height:27px;
	overflow:hidden;
	margin:0 !important;
	opacity:0.6;
	text-align:left;
}

.demo_tabs .tab_holder
{
	float:right;
	width:60%;
}

.demo_tabs .tab_holder:before
{
	content:"";
	display:block;
	padding-top:56.25%;
}

.demo_tabs .tab_holder .item
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background-color:#fff;
	border-radius:5px;
	box-shadow: 0 1px 3px 0 rgb(0 0 0 / 10%), 0 1px 24px 0 rgb(0 0 0 / 8%);
	display:none;
	background-size:cover !important;
	background-position:right bottom !important;
	background-repeat:no-repeat !important;
}

.demo_tabs .tab_holder .item:first-child
{
	display:block;
}



@media screen and (max-width: 800px) 
{
	.demo_tabs
	{

	}

	.demo_tabs .tab_selection
	{
		float:left;
		width:100%;
		margin-top:20px;
	}

	.demo_tabs .tab_selection .item
	{
		padding:0 30px 0 30px;
		border-left:2px solid #cfc8b8;
		max-height:40px;
		overflow:hidden;
		margin:15px 0 15px 0;
		cursor:pointer;
		opacity:0.6;
	}

	.demo_tabs .tab_selection .item:last-child
	{

	}

	.demo_tabs .tab_selection .item.open
	{
		max-height:10000px;
		opacity:1;
	}

	.demo_tabs .tab_selection .item .title
	{
		font-weight:600;
		font-size:20px;
		line-height:30px;
		overflow:hidden;
		margin:0 0 5px 0 !important;
		text-align:left;
	}

	.demo_tabs .tab_selection .item .text
	{
		max-width:400px;
		font-weight:400;
		font-size:15px;
		line-height:25px;
		overflow:hidden;
		margin:0 !important;
		opacity:0.6;
		text-align:left;
	}

	.demo_tabs .tab_holder
	{
		float:left;
		width:100%;
	}

	.demo_tabs .tab_holder:before
	{
		content:"";
		display:block;
		padding-top:56.25%;
	}

	.demo_tabs .tab_holder .item
	{
		position:absolute;
		left:0;
		top:0;
		width:100%;
		height:100%;
		background-color:#fff;
		border-radius:5px;
		box-shadow: 0 1px 3px 0 rgb(0 0 0 / 10%), 0 1px 24px 0 rgb(0 0 0 / 8%);
		display:none;
		background-size:cover !important;
		background-position:right bottom !important;
		background-repeat:no-repeat !important;
	}

	.demo_tabs .tab_holder .item:first-child
	{
		display:block;
	}
}












.compact_features
{
	width:calc(100% + 40px);
}



.compact_features .column
{
	width:50%
}


.compact_features .item
{
	width:calc(50% - 40px);
	background:#fff url(../img/321med_logo.png) right 30px top 30px no-repeat;
    background-size: auto 20px;
    margin:20px;
    box-shadow: 0 50px 100px -20px rgb(50 50 93 / 25%), 0 30px 60px -30px rgb(0 0 0 / 30%);
    padding:30px;
}


@media screen and (max-width: 800px) 
{
	.compact_features
	{
		width:100%
	}

	.compact_features .item
	{
		width:100%;
   		margin:20px 0 20px 0;
	}
}

.compact_features .item .title
{
	font-weight:800 !important;
    font-size: 21px;
    line-height: 30px;
    text-align: left;
    color: #cfc8b8;
    margin:0 0 10px 0;
}

.compact_features .item .title span
{
	font-weight:200;
	font-size:inherit;
	line-height:inherit;
	text-align:inherit;
	margin:0;
	color:inherit;
}

.compact_features .item .text
{
	font-weight:300;
	font-size:17px;
	line-height:25px;
	text-align:left;
	color:#393939;
	margin:0;
}









.usecases
{
	width:calc(100% + 60px);
}



.usecases .column
{
	width:50%
}


.usecases .item
{
	width:calc(50% - 60px);
	background:#fff url(../img/321med_logo.png) right 30px top 30px no-repeat;
    background-size: auto 20px;
    margin:30px;
    box-shadow: 0 50px 100px -20px rgb(50 50 93 / 25%), 0 30px 60px -30px rgb(0 0 0 / 30%);
    padding:30px;
}


@media screen and (max-width: 800px) 
{
	.usecases
	{
		width:100%
	}

	.usecases .item
	{
		width:100%;
   		margin:20px 0 20px 0;
	}
}

.usecases .item .title
{
	font-weight:800 !important;
    font-size: 21px;
    line-height: 30px;
    text-align: left;
    color: #cfc8b8;
    margin:0 0 10px 0;
}

.usecases .item .title span
{
	font-weight:200;
	font-size:inherit;
	line-height:inherit;
	text-align:inherit;
	margin:0;
	color:inherit;
}

.usecases .item .text
{
	font-weight:300;
	font-size:17px;
	line-height:25px;
	text-align:left;
	color:#393939;
	margin:0;
}















.scroll_button_small
{
	width:300px;
	height:50px;
	color:#fff;
	font-size:16px;
	font-weight:800;
	line-height:50px;
	text-align:center;
    background:transparent;
	margin:0;
	background:#cfc8b8;
	background-size:20px auto !important;
	background-position:left 25px center !important;
	background-repeat:no-repeat !important;
	cursor:pointer;
	border-radius:12px;
	margin-top:0;
	z-index:999;
    box-shadow: 0 0 1px 0 rgb(0 0 0 / 8%), 0 1px 4px 0 rgb(0 0 0 / 12%);
}

@media screen and (max-width: 800px) 
{
   	.scroll_button_small
	{
		max-width:100%;
	}
}

.scroll_button_small:after
{
	content:"";
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	border-radius:12px;
    animation: pulse_small 1.2s linear infinite;
}

.scroll_button_small:before
{
	content:"";
	position:absolute;
	left:50%;
	top:100%;
	width:20px;
	height:20px;
	margin-left:-10px;
	background:url('../img/scroll_down_icon_light.png') center center no-repeat;
	background-size:cover;
    animation: up_down 1.2s linear infinite;
}





@keyframes pulse 
{ 
	0% { box-shadow:0 0 0 0 #cfc8b8; opacity: 0.2; } 
	70% { box-shadow:0 0 0 15px #cfc8b8; opacity:0; } 
	100% { box-shadow:0 0 0 0 #cfc8b8; opacity: 0; }
}

@keyframes up_down 
{ 
	0% { margin-top:10px; opacity:0.4; } 
	70% { margin-top:20px; opacity:0; } 
	100% { margin-top:10px; opacity: 0; }
}



@keyframes pulse_small 
{ 
	0% { box-shadow:0 0 0 0 #fff; opacity: 0.2; } 
	70% { box-shadow:0 0 0 15px #fff; opacity:0; } 
	100% { box-shadow:0 0 0 0 #fff; opacity: 0; }
}







.onboarding_features
{
	width:calc(100% + 60px);
}



.onboarding_features .column
{
	width:50%
}


.onboarding_features .item
{
	width:calc(33.33% - 60px);
	background:#fff url(../img/321med_logo.png) right 30px top 30px no-repeat;
    background-size: auto 20px;
    margin:30px;
    box-shadow: 0 50px 100px -20px rgb(50 50 93 / 25%), 0 30px 60px -30px rgb(0 0 0 / 30%);
    padding:30px;
}


@media screen and (max-width: 800px) 
{
	.onboarding_features
	{
		width:100%
	}

	.onboarding_features .item
	{
		width:100%;
   		margin:20px 0 20px 0;
	}
}

.onboarding_features .item .title
{
	font-weight:800 !important;
    font-size: 21px;
    line-height: 30px;
    text-align: left;
    color: #cfc8b8;
    margin:0 0 10px 0;
}

.onboarding_features .item .title span
{
	font-weight:200;
	font-size:inherit;
	line-height:inherit;
	text-align:inherit;
	margin:0;
	color:inherit;
}

.onboarding_features .item .text
{
	font-weight:300;
	font-size:17px;
	line-height:25px;
	text-align:left;
	color:#393939;
	margin:0;
}






.cta_buttons
{
	position:fixed;
	width:auto;
	height:34px;
	right:20px;
	bottom:20px;
}

.cta_buttons .cta_button
{
	width:120px;
	height:34px;
	border-radius:17px;
	line-height:34px;
	margin:0 0 0 10px;
	background:#cfc8b8;
	color:#fff;
	font-weight:800;
	text-align:center;
	padding:0 0 0 10px;
	font-size:15px;
   	background-image:url('../img/arrow_right_light.png') !important;
   	background-repeat:no-repeat !important;
   	background-size:10px auto !important;
   	background-position:left 12px center !important;
    box-shadow: 0 20px 40px -7px rgb(50 50 93 / 25%), 0 10px 20px -10px rgb(0 0 0 / 30%);
}






.cta_holder
{
	width:calc(80% + 40px);
	max-width:600px;
}

.cta_holder .cta_button
{
	width:calc(50% - 40px);
	height:50px;
	margin:0 20px 0 20px;
	color:#393939;
	font-size:17px;
	font-weight:800;
	line-height:50px;
	text-align:center;
    background:transparent;
	background:#fff;
	background-size:20px auto !important;
	background-position:left 25px center !important;
	background-repeat:no-repeat !important;
	cursor:pointer;
	border-radius:25px;
    box-shadow: 0 25px 50px -10px rgb(50 50 93 / 25%), 0 15px 30px -15px rgb(0 0 0 / 30%);
}

.cta_holder .cta_button.start
{
	background:#BE554A !important;
	color:#fff;
}

@media screen and (max-width: 800px) 
{
   	.cta_holder .cta_button
	{
		width:calc(100% - 40px);
		margin:0 20px 20px 20px;
	}

   	.cta_holder .cta_button.start
	{
		margin:0 20px 0 20px;
	}
}

.cta_holder .cta_button:after
{
	content:"";
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	border-radius:35px;
    animation: pulse 1.2s linear infinite;
}

.cta_holder .cta_button:before
{
	content:"";
	position:absolute;
	left:50%;
	top:100%;
	width:20px;
	height:20px;
	margin-left:-10px;
	background:url('../img/scroll_down_icon_light.png') center center no-repeat;
	background-size:cover;
    animation: up_down 1.2s linear infinite;
}














.price_box
{
	max-width:300px;
	background:#fff url(../img/321med_logo.png) center top 30px no-repeat;
    background-size: auto 20px;
    box-shadow: 0 50px 100px -20px rgb(50 50 93 / 25%), 0 30px 60px -30px rgb(0 0 0 / 30%);
    padding:60px 30px 30px 30px;
}


@media screen and (max-width: 800px) 
{
	
}

.price_box .title
{
	font-weight:800 !important;
    font-size: 21px;
    line-height: 30px;
    text-align: center;
    color: #cfc8b8;
    margin:0;
}

.price_box .title span
{
	font-weight:200;
	font-size:inherit;
	line-height:inherit;
	text-align:inherit;
	margin:0;
	color:inherit;
}

.price_box .feature
{
	font-weight:300;
	font-size:17px;
	line-height:25px;
	text-align:left;
	margin:0 0 10px 0;
	padding:0 10px 0 30px;
	color:#393939;
}

.price_box .feature:before
{
	content:"";
	position:absolute;
	left:0px;
	top:50%;
	width:20px;
	height:20px;
	margin-top:-10px;
    background:#fff url(../img/check_icon_green.png) center center no-repeat;
    background-size:50% auto;
    border-radius:50%;
	box-shadow: 0 8px 17px -3px rgb(50 50 93 / 25%), 0 5px 10px -5px rgb(0 0 0 / 30%);
}

.price_box .price
{
	font-weight:800 !important;
    font-size: 21px;
    line-height: 30px;
    text-align:center;
    color: #cfc8b8;
    margin:0 0 10px 0;
}

.price_box .price span
{
	font-weight:300;
	font-size:15px;
	line-height:21px;
	text-align:inherit;
	margin:0;
	color:inherit;
}







.onboarding_signature
{
	width:220px;
	height:120px;
}

.onboarding_signature .avatar
{
	position:absolute;
	right:0;
	top:0;
	width:60px;
	height:60px;
	border-radius:50%;
	background:url('../img/avatar_baringer.jpg') top center no-repeat;
	background-size:cover;
}

.onboarding_signature .signature
{ 
	position:absolute;
	left:0;
	top:0;
	width:220px;
	height:80px;
	background:url('../img/signature.png') left center no-repeat;
	background-size:contain;
}

.onboarding_signature .name
{
	position:absolute;
	left:0;
	bottom:0;
	font-size:14px; 
	line-height:20px;
	color:#fff;
	font-weight:800;
	text-align:center;
}

.onboarding_signature .name span
{
	width:auto;
	float:none;
	font-weight:300;
	font-size:inherit;
	line-height:inherit;
	text-align:inherit;
	color:inherit;
	display:inline;
}







.main_citation
{
	padding:0;
}

.main_citation .avatar
{
	max-width:450px;
	background:url('../img/citation.png') top center no-repeat;
	background-size:cover;
}

.main_citation .avatar:before
{
	content:"";
	display:block;
	padding-top:37.5%;
}

.main_citation .citation
{
	width:100%;
	padding:15px 20px 15px 20px;
	background:rgba(255,255,255,0.2);
	border-radius:20px 20px 2px 20px;
	font-size:25px;
	line-height:34px;
	font-weight:800;
	text-align:center;
}






.onboarding_box
{
	max-width:400px;
    box-shadow: 0 50px 100px -20px rgb(50 50 93 / 25%), 0 30px 60px -30px rgb(0 0 0 / 30%);
    background:#fff;
    border-radius:10px;
    overflow:hidden;
}

.onboarding_box .onboarding_input
{
	height:60px;
	font-size:17px;
	line-height:60px;
	text-align:center;
	padding:0 15px 0 15px;
	color:#393939;
	font-weight:400;
	border-bottom:1px solid rgba(52,52,52,0.1);
}

.onboarding_box .onboarding_select
{
	height:60px;
	font-size:17px;
	line-height:60px;
	text-align:center;
	padding:0 15px 0 15px;
	color:#393939;
	font-weight:400;
	border-bottom:1px solid rgba(52,52,52,0.1);
	background-image: url(../img/select_icon_dark.png) !important;
    background-position: right 10px center !important;
    background-repeat: no-repeat !important;
    background-size: 10px auto !important;
}

.onboarding_box .onboarding_button
{
	width:100%;
	height:60px;
	font-size:15px;
	line-height:60px;
	text-align:center;
	padding:0 15px 0 15px;
	color:#fff;
	font-weight:800;
	background:#BE554A;
	cursor:pointer;
}

.onboarding_box .onboarding_button:hover
{
	opacity:0.95;
}

.onboarding_notification
{
	padding:15px;
	max-width:600px;
	border-radius:11px;
	border:1px solid #c75146;
	text-align:center;
	font-size:14px;
	font-weight:700;
	line-height:23px;
}

.onboarding_notification .background
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:#c75146;
	opacity:0.1;
}































.onboarding_hero
{
	height:auto;
	z-index:99;
}

.onboarding_hero .background
{
	position:absolute;
	top:0;
	width:100vw;
	height:100%;
	overflow:hidden;
	background:#cfc8b8;
	background-size:cover;
}

.onboarding_hero .background .overlay
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.2);
}

.onboarding_hero .background .overlay_shape
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:url('../img/hero_overlay.png') bottom center no-repeat;
	background-size:100% auto;
}

.onboarding_hero .background .overlay_color
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:#cfc8b8;
	opacity:0.2;
}

.onboarding_hero .background .overlay_color_gradient
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:linear-gradient(90deg,rgba(255,255,255,0) 0%, #cfc8b8 100%);
	opacity:0.4;
}

.onboarding_hero .background .overlay_dark
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.2);
}








.onboarding_hero .content_holder
{
	height:auto;
}

@media screen and (max-width: 800px) 
{
   	.onboarding_hero .content_holder
	{

	}
}

.onboarding_hero .title
{
	font-weight:800;
	font-size:45px;
	line-height:56px;
	text-align:center;
	margin:0 0 30px 0;
	color:#fff;
}

.onboarding_hero .text
{
	font-weight:400;
	font-size:25px;
	line-height:36px;
	text-align:center;
	margin:0;
	color:#fff;
}





.onboarding_mail
{
	width:auto;
	line-height:28px;
	font-size:15px;
	font-weight:800;
	text-align:center;
	background:url('../img/arrow_right_dark') right center no-repeat;
	background-size:10px auto;
	padding:0 15px 0 0;
	opacity:0.4;
}

.onboarding_mail:hover
{
	opacity:1;
}











.explainer_item
{

}

.explainer_item .explainer_box
{
	width:70%;
}

.explainer_item .explainer_tripple_holder
{
	width:calc(100% + 40px);
}

.explainer_item .explainer_tripple_holder .explainer_box
{
	width:calc(33.33% - 40px);
	min-height:100px;
	padding:30px;
	box-shadow: 0 50px 100px -20px rgb(50 50 93 / 25%), 0 30px 60px -30px rgb(0 0 0 / 30%);
	border-radius:10px;
	background:#fff;
	z-index:10;
	margin:0 20px 0 20px;
}

.explainer_item .explainer_images
{
	max-width:700px;
}

.explainer_item .explainer_images .image
{
	width:40%;
	background-position:center center !important;
	background-repeat:no-repeat !important;
	background-size:cover !important;
	margin:0;
}

.explainer_item .explainer_images .image_wide
{
	width:100%;
	background-position:center center !important;
	background-repeat:no-repeat !important;
	background-size:cover !important;
}

.explainer_item .explainer_images .image .image_title
{
	position:absolute;
	left:50%;
	top:0;
	width:auto;
	height:40px;
	background:#fff;
	padding:0 15px 0 15px;
	font-size:15px;
	line-height:40px;
	font-weight:800;
	text-align:center;
	box-shadow: 0 20px 50px -10px rgb(50 50 93 / 70%), 0 15px 30px -15px rgb(0 0 0 / 80%);
	white-space:nowrap;
	transform:translate(-50%,0) rotate(-3deg);
}

.explainer_item .explainer_images .image:before
{
	content:"";
	display:block;
	padding-top:100%;
}

.explainer_item .explainer_images .image_wide:before
{
	content:"";
	display:block;
	padding-top:40%;
}

.explainer_item .explainer_images .separator
{
	width:20%;
}

.explainer_item .explainer_images .separator:before
{
	content:"";
	display:block;
	padding-top:200%;
}

.explainer_item .explainer_images .separator:after
{
	position:absolute;
	left:50%;
	top:50%;
	content:"";
	display:block;
	width:30px;
	height:30px;
	background:url('../img/two_directions_icon_dark') center center no-repeat;
	background-size:cover;
	opacity:0.1;
	margin:-15px 0 0 -15px;
}

@media screen and (max-width: 800px) 
{
   	.explainer_item .explainer_box
	{
		width:100%;
	}

	.explainer_item .explainer_images .image
	{
		width:80%;
		max-width:300px;
		margin-left:50%;
		transform:translateX(-50%);
	}

	.explainer_item .explainer_images .separator
	{
		width:80%;
		max-width:300px;
		margin-left:50%;
		transform:translateX(-50%);
	}

	.explainer_item .explainer_images .separator:before
	{
		content:"";
		display:block;
		padding-top:20%;
	}

	.explainer_item .explainer_images .separator:after
	{
		width:24px;
		height:24px;
		transform:rotate(90deg);
		margin:-12px 0 0 -12px;
	}
}

.explainer_item .explainer_box .explainer_icon
{
	width:24px;
	height:24px;
	background-size:cover;
	background-position:center center;
	background-repeat:no-repeat;
}

.explainer_item .explainer_box .explainer_pretitle
{
	font-weight: 800;
    font-size: 15px;
    line-height: 23px;
    text-align: center;
    margin: 0 0 10px 0;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.explainer_item .explainer_box .explainer_title
{
	font-size:21px;
	line-height:21px;
	font-weight:800;
	text-align:center;
	margin-bottom:10px;
}

.explainer_item .explainer_tripple_holder .explainer_box .explainer_title
{
	text-align:center;
}

.explainer_item .explainer_box .explainer_text
{
	font-size:15px;
	line-height:21px;
	font-weight:400;
	text-align:center;
	color:rgba(52,52,52,0.6);
}

.explainer_item .explainer_tripple_holder .explainer_box .explainer_text
{
	text-align:center;
}

.explainer_item .explainer_box .explainer_text span
{
	float:none;
	width:auto;
	display:inline;
	font-size:inherit;
	line-height:inherit;
	font-weight:800;
	text-align:inherit;
	color:rgba(52,52,52,1);
}

.explainer_item .explainer_box .explainer_resume
{
	font-size:21px;
	line-height:21px;
	font-weight:800;
	text-align:center;
	margin-top:10px;
}




.explainer_item .explainer_box .check
{
	font-weight:400;
	font-size:15px;
	line-height:21px;
	text-align:left;
	margin:10px 0 0 0;
	padding:0 10px 0 30px;
	color:rgba(52,52,52,0.6);
}

.explainer_item .explainer_box .check span
{
	width:auto;
	float:none;
	display:inline;
	font-weight:800;
	font-size:inherit;
	line-height:inherit;
	text-align:inherit;
	color:rgba(52,52,52,0.8);
}

.explainer_item .explainer_box .check:before
{
	content:"";
	position:absolute;
	left:0px;
	top:1px;
	width:19px;
	height:19px;
    background:#fff url(../img/check_icon_green.png) center center no-repeat;
    background-size:50% auto;
    border-radius:50%;
	box-shadow: 0 8px 17px -3px rgb(50 50 93 / 25%), 0 5px 10px -5px rgb(0 0 0 / 30%);
	margin-top:0;
}

.explainer_item .explainer_box .check.bad:before
{
	content:"";
	position:absolute;
	left:0px;
	top:1px;
	width:19px;
	height:19px;
    background:#fff url(../img/cross_icon.png) center center no-repeat;
    background-size:50% auto;
    border-radius:50%;
	margin-top:0;
}










.function_explainer
{
	width:calc(100% + 40px);
	z-index:999;
}

.function_explainer .function
{
	width:calc(33.3333% - 40px);
	padding:30px;
	box-shadow: 0 1px 1px 0 rgb(0 0 0 / 12%), 0 4px 24px 0 rgb(0 0 0 / 8%);
	border-radius:22px;
	background:#fff;
	margin:0 20px 0 20px;
}

.function_explainer .sign
{
	position:absolute;
	width:40px;
	height:40px;
	left:33.3333%;
	top:50%;
	font-size:31px;
	line-height:40px;
	font-weight:800;
	text-align:center;
	opacity:0.4;
	margin:-20px 0 0 -20px;
}

.function_explainer .sign.second
{
	left:66.6666%;
}

@media screen and (max-width: 800px) 
{
   	.function_explainer
	{
		width:100%;
	}

	.function_explainer .function
	{
		width:100%;
		padding:30px;
		box-shadow: 0 50px 100px -20px rgb(50 50 93 / 25%), 0 30px 60px -30px rgb(0 0 0 / 30%);
		border-radius:10px;
		background:#fff;
		margin:0;
	}

	.function_explainer .sign
	{
		position:relative;
		width:100%;
		height:60px;
		left:0;
		top:auto;
		font-size:31px;
		line-height:60px;
		font-weight:800;
		text-align:center;
		opacity:0.4;
		margin:0;
	}

	.function_explainer .sign.second
	{
		left:0;
	}
}

.function_explainer .function .function_icon
{
	width:24px;
	height:24px;
	background-size:cover;
	background-position:center center;
	background-repeat:no-repeat;
}

.function_explainer .function .function_title
{
	width:100%;
	font-size:21px;
	line-height:21px;
	font-weight:800;
	text-align:center;
	margin-bottom:10px;
}

.function_explainer .function .function_explainer
{
	width:100%;
	font-size:15px;
	line-height:21px;
	font-weight:400;
	text-align:center;
	opacity:0.4;
}














.video_container
{
	width:70%;
	max-width:400px;
	background:#fff;
    box-shadow:0 50px 100px -20px rgb(50 50 93 / 25%), 0 30px 60px -30px rgb(0 0 0 / 30%);
    border-radius:10px;
    overflow:hidden;
}

.video_container:before
{
	content:"";
	display:block;
	padding-top:56.25%;
}

.video_container .video
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}

.video_container .video .video_frame
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}

.video_container .video .video_overlay
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background-size:cover !important;
	background-position:center center !important;
	background-repeat:no-repeat !important;
}

.video_container .video .video_overlay .overlay
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.3);
	box-shadow:inset 0 0 0 7px #fff;
}

.video_container .video .video_overlay .label
{
	position:absolute;
	width:100%;
	height:auto;
	top:50%;
	line-height:40px;
	font-size:21px;
	line-break:no-wrap;
	color:#fff;
	text-shadow:0 0 40px rgba(0,0,0,0.5);
	font-weight:800;
	padding-top:45px;
	background:url('../img/play_icon_light.png') center top no-repeat;
	background-size:40px;
	transform:translateY(-50%);
	text-align:center;
}





.vertical_connector
{
	height:30px;
	opacity:0.2;
}

@media screen and (max-width: 800px) 
{
   	.vertical_connector
	{
		height:60px;
	}
}

.vertical_connector .connector
{
	position:absolute;
	left:50%;
	top:0;
	width:6px;
	height:100%;
	margin-left:-3px;
	background:#cfc8b8;
}






.tripple_connector
{
	height:30px;
}

@media screen and (max-width: 800px) 
{
   	.tripple_connector
	{
		display:none;
	}
}

.tripple_connector .horizontal_connector
{
	position:absolute;
	left:16.6666%;
	top:0;
	width:calc(66.6666% + 6px);
	height:6px;
	margin-left:-3px;
	background:#cfc8b8;
	border-radius:6px 6px 0 0;
	opacity:0.2;
}

.tripple_connector .vertical_connector
{
	position:absolute;
	top:6px;
	width:6px;
	height:24;
	margin-left:-3px;
	background:#cfc8b8;
	opacity:0.2;
}

.tripple_connector.reversed
{
	transform:rotate(180deg);
}





.feature_table
{

}


.feature_table .entry
{
	padding:20px 20px 20px 20px;
	border-radius:14px;
	background:#fff;
	box-shadow: 0 1px 1px 0 rgb(0 0 0 / 12%), 0 4px 24px 0 rgb(0 0 0 / 8%);
    margin:0 0 20px 0;
    cursor:pointer;
    transition:all 0.1s ease-in-out;
}

.feature_table .entry:hover
{
    transform:scale(1.01);
}

.feature_table .entry.legend
{1
	padding:10px 10px 10px 20px;
	border-radius:10px;
	background:transparent;
	box-shadow:inset 0 0 0 1px rgba(52,52,52,0.1);
}

.feature_table .entry.legend .feature
{
	opacity:0.4 !important;
}

.feature_table .entry .feature
{
	width:22%;
	line-height:20px;
	font-size:13px;
	font-weight:400;
	color:rgba(52,52,52,0.6);
}

.feature_table .entry .feature.bold
{
	font-weight:700;
	color:rgba(52,52,52,1);
}

.feature_table .entry .feature.extra_bold
{
	font-weight:900;
	font-size:15px;
	color:#84a98c;
}

.feature_table .entry .feature.small
{
	width:12%;
}


@media screen and (max-width: 800px) 
{
	.feature_table .entry .feature
	{
		width:60%;
	}

	.feature_table .entry .feature.small
	{
		width:40%;
	}

	.feature_table .entry .feature.hide_on_mobile
	{
		display:none;
	}
}

.feature_table .entry .video_icon
{
	position:absolute;
	right:0;
	top:0;
	width:106px;
	height:60px;
	background:url('../img/video_overlay.gif') center center no-repeat;
	background-size:cover;
	border-radius:0 14px 14px 0;
	overflow:hidden;
}

.feature_table .entry .video_icon .overlay
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.2) url('../img/play_icon_light.png') center center no-repeat;
	background-size:auto 50%;
}

.feature_table .entry:hover .video_icon .overlay
{
	background:rgba(0,0,0,0.4) url('../img/play_icon_light.png') center center no-repeat;
	background-size:auto 50%;
}





.customers_spinner_block
{
	z-index:999;
	padding:80px 0 80px 0;
}

@media screen and (max-width: 800px) 
{
	.customers_spinner_block
	{
		padding:40px 0 60px 0;
	}
}









.onboarding_title
{
	font-weight:700;
	font-size:37px;
	line-height:50px;
	text-align:center;
	margin:0 0 20px 0;
	color:#393939;
}

@media screen and (max-width: 800px) 
{
	.onboarding_title
	{
		font-weight:700;
		font-size:22px;
		line-height:35px;
		text-align:center;
		margin:0 0 20px 0;
		color:#393939;
	}
}













.functions_spinner
{
	width:100%;
	padding:40px 0 40px 0;
	overflow:hidden;
}

.functions_spinner .gradient_left
{
	position:absolute;
	left:0;
	top:0;
	width:100px;
	height:100%;
	background:linear-gradient(-90deg,rgba(255,255,255,0) 0%, rgba(245,244,240,1) 100%);
	cursor:pointer;
}

.functions_spinner .gradient_left:before
{
	content:"";
	position:absolute;
	left:0;
	top:50%;
	width:50px;
	height:50px;
	background:url('../img/arrow_right_dark.png') center center no-repeat;
	background-size:30px auto;
	margin-top:-25px;
	display:block;
	transform:rotate(180deg);
}

.functions_spinner .gradient_right
{
	position:absolute;
	right:0;
	top:0;
	width:100px;
	height:100%;
	background:linear-gradient(90deg,rgba(255,255,255,0) 0%, rgba(245,244,240,1) 100%);
	cursor:pointer;
}

.functions_spinner .gradient_right:before
{
	content:"";
	position:absolute;
	right:0;
	top:50%;
	width:50px;
	height:50px;
	background:url('../img/arrow_right_dark.png') center center no-repeat;
	background-size:30px auto;
	margin-top:-25px;
	display:block;
}

.functions_spinner .functions_holder
{
	width:100%;
}

.functions_spinner .function, .functions_spinner .placeholder
{
	position:absolute;
	left:0;
	top:0;
	width:calc(100% - 200px);
	margin:0 100px 0 100px;
	padding:50px 40px 50px 40px;
	background:#fff;
	border-radius:40px;
	overflow:hidden;
	display:none;
	transition:transform 0.1s ease-in-out;
	box-shadow: 0 1px 1px 0 rgb(0 0 0 / 12%), 0 4px 24px 0 rgb(0 0 0 / 8%);
}

.functions_spinner .placeholder
{
	position:relative !important;
	box-shadow:none !important;
	background:rgba(255,255,255,0) !important;;
	opacity:0 !important;
	display:block !important;
	pointer-events:none;
}

.functions_spinner .function:first-child
{
	display:block;
}

.functions_spinner .function .mockup, .functions_spinner .placeholder .mockup
{
	width:calc(100% - 40px);
	max-width:220px;
	background-size:cover !important;
	background-position:left center !important;
	background-repeat:no-repeat !important;
	margin:0;
	border-radius:20px 20px 0 0;
	box-shadow:0 0 0 15px rgba(52,52,52,0.05);
	margin-bottom:-50px;
}

.functions_spinner .function .mockup:before, .functions_spinner .placeholder .mockup:before
{
	content:"";
	display:block;
	padding-top:180%;
}

.functions_spinner .function .gradient
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:linear-gradient(120deg,rgba(207,200,184,0) 0%, rgba(207,200,184,1) 50%);
}

.functions_spinner .function .pretitle, .functions_spinner .placeholder .pretitle
{
	font-weight:800;
	font-size:14px;
	line-height:20px;
	overflow:hidden;
	margin:0 !important;
	text-transform:uppercase;
}

.functions_spinner .placeholder .pretitle
{
	color:rgba(255,255,255,0) !important;
	opacity:0 !important;
}

.functions_spinner .function .title, .functions_spinner .placeholder .title
{
	font-weight:600;
	font-size:30px;
	line-height:40px;
	overflow:hidden;
	margin:0 !important;
}

.functions_spinner .placeholder .title
{
	color:rgba(255,255,255,0) !important;
	opacity:0 !important;
}

.functions_spinner .function .text, .functions_spinner .placeholder .text
{
	max-width:600px;
	font-weight:400;
	font-size:17px;
	line-height:27px;
	overflow:hidden;
	margin:0 !important;
	opacity:1;
}

.functions_spinner .placeholder .text
{
	color:rgba(255,255,255,0) !important;
	opacity:0 !important;
}


.functions_spinner .function .timetable, .functions_spinner .placeholder .timetable
{

}

.functions_spinner .placeholder .text
{
	opacity:0 !important;
}

.functions_spinner .function .timetable .item, .functions_spinner .placeholder .timetable .item
{
	width:25%;
	line-height:30px;
	font-size:14px;
	font-weight:500;
	text-align:center;
	color:rgba(52,52,52,0.6);
}

.functions_spinner .function .timetable .item span, .functions_spinner .placeholder .timetable .item span
{
	line-height:inherit;
	font-size:inherit;
	font-weight:700;
	text-align:center;
	color:rgba(52,52,52,1);
}

.functions_spinner .function .timetable .item.timesavings
{
	color:#5ebaa8;
	font-weight:800;
}

.functions_spinner .function .timetable .item.timesavings span
{
	color:rgba(52,52,52,1);
	font-weight:700;
}


@media screen and (max-width: 800px) 
{

	.functions_spinner
	{
		width:100%;
		padding:40px 0 40px 0;
		overflow:hidden;
	}

	.functions_spinner .gradient_left
	{
		position:absolute;
		left:0;
		top:0;
		width:30px;
		height:100%;
		background:linear-gradient(-90deg,rgba(255,255,255,0) 0%, rgba(245,244,240,1) 100%);
		cursor:pointer;
	}

	.functions_spinner .gradient_left:before
	{
		content:"";
		position:absolute;
		left:0;
		top:50%;
		width:30px;
		height:40px;
		background:url('../img/arrow_right_dark.png') right center no-repeat;
		background-size:15px auto;
		margin-top:-20px;
		display:block;
		transform:rotate(180deg);
	}

	.functions_spinner .gradient_right
	{
		position:absolute;
		right:0;
		top:0;
		width:30px;
		height:100%;
		background:linear-gradient(90deg,rgba(255,255,255,0) 0%, rgba(245,244,240,1) 100%);
		cursor:pointer;
	}

	.functions_spinner .gradient_right:before
	{
		content:"";
		position:absolute;
		right:0;
		top:50%;
		width:30px;
		height:40px;
		background:url('../img/arrow_right_dark.png') right center no-repeat;
		background-size:15px auto;
		margin-top:-20px;
		display:block;
	}

	.functions_spinner .functions_holder
	{
		width:100%;
	}

	.functions_spinner .function, .functions_spinner .placeholder
	{
		position:absolute;
		left:0;
		top:0;
		width:calc(100% - 60px);
		margin:0 30px 0 30px;
		padding:35px 35px 35px 35px;
		background:#fff;
		border-radius:25px;
		box-shadow: 0 1px 1px 0 rgb(0 0 0 / 12%), 0 4px 24px 0 rgb(0 0 0 / 8%);
		overflow:hidden;
		display:none;
	}

	.functions_spinner .function .mockup, .functions_spinner .placeholder .mockup
	{
		width:calc(100% - 40px);
		max-width:250px;
		background-size:cover !important;
		background-position:left center !important;
		background-repeat:no-repeat !important;
		margin:0;
		border-radius:20px 20px 0 0;
		box-shadow:0 0 0 10px rgba(52,52,52,0.05);
		margin-bottom:-35px;
	}

	.functions_spinner .function .mockup:before, .functions_spinner .placeholder .mockup:before
	{
		content:"";
		display:block;
		padding-top:180%;
	}

	.functions_spinner .placeholder
	{
		position:relative !important;
		box-shadow:none !important;
		background:rgba(255,255,255,0) !important;;
		opacity:0 !important;
		display:block !important;
	}

	.functions_spinner .function:first-child
	{
		display:block;
	}

	.functions_spinner .function .gradient
	{
		position:absolute;
		left:0;
		top:0;
		width:100%;
		height:100%;
		background:linear-gradient(170deg,rgba(207,200,184,0) 0%, rgba(207,200,184,1) 50%);
	}

	.functions_spinner .function .pretitle, .functions_spinner .placeholder .pretitle
	{
		font-weight:800;
		font-size:12px;
		line-height:20px;
		overflow:hidden;
		margin:0 !important;
		text-transform:uppercase;
	}

	.functions_spinner .function .title, .functions_spinner .placeholder .title
	{
		font-weight:600;
		font-size:22px;
		line-height:32px;
		overflow:hidden;
		margin:0 !important;
	}

	.functions_spinner .function .text, .functions_spinner .placeholder .text
	{
		max-width:400px;
		font-weight:400;
		font-size:15px;
		line-height:23px;
		overflow:hidden;
		margin:0 !important;
		opacity:1;
	}

	.functions_spinner .function .timetable, .functions_spinner .placeholder .timetable
	{

	}

	.functions_spinner .placeholder .text
	{
		opacity:0 !important;
	}

	.functions_spinner .function .timetable .item, .functions_spinner .placeholder .timetable .item
	{
		width:100%;
		line-height:25px;
		font-size:13px;
		font-weight:500;
		text-align:center;
		margin-bottom:10px;
	}

	.functions_spinner .function .timetable .item span, .functions_spinner .placeholder .timetable .item span
	{
		line-height:inherit;
		font-size:inherit;
		font-weight:700;
		text-align:center;
	}

}








.frontend_onboarding_box
{
	width:100%;
	border-radius:0 0 25px 25px;
	overflow:hidden;
	padding:80px 40px 100px 40px;
	background: linear-gradient(180deg,rgba(207,200,184,0) 0%, rgba(207,200,184,1) 100%);
}

.frontend_onboarding_box .frontend_onboarding_headline
{
	max-width:600px;
	font-size:40px;
	line-height:50px;
	font-weight:700;
	text-align:center;
}

.frontend_onboarding_box .frontend_onboarding_button
{
	left:50%;
	width:300px;
	height:60px;
	line-height:60px;
	font-size:20px;
    font-weight: 700;
    background: #fff;
    padding: 0 15px 0 15px;
    box-shadow: 0 0 1px 0 rgb(0 0 0 / 8%), 0 1px 4px 0 rgb(0 0 0 / 12%);
    color: rgba(52,52,52,0.8);
    transition: all 0.1s ease-in-out;
    border-radius:14px;
    text-align:center;
    cursor:pointer;
    margin-left:-150px;
}

.frontend_onboarding_box .frontend_onboarding_button:hover
{
	transform:scale(1.02);
    color:rgba(52,52,52,1);
}







.onboarding_flow
{
	padding:40px 0 0 0;
}

.onboarding_flow .progress_bar
{
	position:absolute;
	left:5px;
	top:0;
	width:5px;
	height:100%;
	background:rgba(52,52,52,0.1);
	border-radius:3px;
}

.onboarding_flow .flow_box
{
	padding:40px;
	box-shadow: 0 50px 100px -20px rgb(50 50 93 / 25%), 0 30px 60px -30px rgb(0 0 0 / 30%);
}

.onboarding_flow .flow_box .flow_label
{
	position:absolute;
	width:auto;
	left:-10px;
	top:10px;
	height:34px;
	line-height:34px;
	font-size:14px;
	font-weight:700;
	border-radius:7px;
	padding:0 15px 0 15px;
	color:#fff;
}

.onboarding_flow .flow_box .flow_dot
{
	position:absolute;
	left:-40px;
	top:50%;
	width:15px;
	height:15px;
	border-radius:50%;
	transform:translate(0,-50%);
	box-shadow:inset 0 0 0 3px #fff, 0 0 1px 0 rgb(0 0 0 / 8%), 0 1px 4px 0 rgb(0 0 0 / 12%);
}

.onboarding_flow .flow_box .flow_title
{
	line-height:35px;
	font-size:25px;
	font-weight:700;
	text-align:center;
}

.onboarding_flow .flow_box .flow_subtitle
{
	line-height:30px;
	font-size:18px;
	font-weight:800;
	text-align:center;
}

.onboarding_flow .flow_box .flow_text
{
	max-width:600px;
	line-height:30px;
	font-size:19px;
	font-weight:400;
	opacity:0.4;
	text-align:center;
}

.onboarding_flow .flow_box .flow_text span
{
	width:auto;
	height:inherit;
	line-height:inherit;
	font-size:inherit;
	color:inherit;
	font-weight:800;
	display:inline;
	float:none;
}

.onboarding_flow .flow_box .flow_button
{
	width:200px;
	height:40px;
	line-height:40px;
	font-size:13px;
	font-weight:700;
	color:#fff;
	text-align:center;
	border-radius:7px;
	margin:0 0 20px 0;
}

.onboarding_flow .flow_box .flow_notification
{
	width:auto;
	line-height:22px;
	font-size:14px;
	font-weight:400;
	border-radius:7px;
	border:1px solid #BE554A;
	margin:0 0 20px 0;
	padding:20px;
	overflow:hidden;
}

.onboarding_flow .flow_box .flow_notification .background
{
	position:absolute;
	left:0;
	top: 0;
	width: 100%;
	height: 100%;
	opacity:0.1;
	background:#BE554A;
}

.onboarding_flow .flow_box .flow_status
{
	width:auto;
	line-height:25px;
	font-size:16px;
	font-weight:600;
	border-radius:7px;
	border:1px solid #fff;
	margin:0 0 20px 0;
	padding:20px;
	overflow:hidden;
}

.onboarding_flow .flow_box .flow_video
{
	max-width:450px;
	box-shadow: 0 0 1px 0 rgb(0 0 0 / 8%), 0 1px 4px 0 rgb(0 0 0 / 12%);
    border-radius: 13px;
    background: #fff;
    overflow:hidden;
	transition:all 0.1s ease-in-out;
	cursor:pointer;
}

.onboarding_flow .flow_box .flow_video:hover
{
	box-shadow: 0 5px 30px -10px rgb(50 50 93 / 25%), 0 7px 20px -10px rgb(0 0 0 / 30%);
	transform:translate(-50%,0) scale(1.01) !important;
}

.onboarding_flow .flow_box .flow_video:before
{
	content:"";
	display:block;
	padding-top:56.25%;
}

.onboarding_flow .flow_box .flow_video .background 
{
    position: absolute;
    left: 7px;
    top: 7px;
    width: calc(100% - 14px);
    height: calc(100% - 14px);
    background: #fff;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    border-radius: 13px;
}

.onboarding_flow .flow_box .flow_video .background:before 
{
    content: "";
    display: block;
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.05) radial-gradient(circle, rgba(0,0,0,0.2) 0%, rgba(0,0,0,0) 100%);
}

.onboarding_flow .flow_box .flow_video .overlay
{
    position: absolute;
    left: 7px;
    top: 7px;
    width: calc(100% - 14px);
    height: calc(100% - 14px);
    background: url(../img/play_icon_light.png) center center no-repeat;
    background-size: 50px auto;
}

.onboarding_flow .flow_box .flow_status .background
{
	position:absolute;
	left:0;
	top: 0;
	width: 100%;
	height: 100%;
	opacity:0.1;
}

.flow_contactpersons
{
	width:auto;
}

.flow_contactpersons .contactperson
{
	margin:0 20px 0 20px;
	width:160px;
	display:table-cell;
}

.flow_contactpersons .contactperson .avatar
{
	width:80px;
	height:80px;
	background:rgba(52,52,52,0.1);
	background-size: cover !important;
	background-repeat: no-repeat !important;
	background-position: center top !important;
	border-radius:50%;
	margin:0 0 20px 0;
}

.flow_contactpersons .contactperson .name
{
	line-height:20px;
	font-size:14px;
	font-weight:700;
	margin:0 0 5px 0;
	text-align:center;
}

.flow_contactpersons .contactperson .info
{
	line-height:20px;
	font-size:14px;
	font-weight:400;
	margin:0 0 20px 0;
	opacity:0.4;
	text-align:center;
}

.flow_contactpersons .contactperson .buttons
{
	width:calc(100% + 10px);
}

.flow_contactpersons .contactperson .button
{
	width:calc(50% - 10px);
	margin:0 5px 0 5px;
	height:34px;
	line-height:34px;
	font-size:13px;
	font-weight:700;
	color:#fff;
	text-align:center;
	border-radius:7px;
}
