@charset "utf-8";
/* CSS Document */

/******************************

[Table of Contents]

1. Fonts
2. Body and some general stuff
3. Header
4. Menu
5. Home
6. Services
7. Boxes
8. Tabs
9. Footer
@charset "utf-8";
/* CSS Document */

.super_container {
	height: 100%;
	min-height: 500px;
	max-height: 600px;
	margin-top: 1em; 
	padding: 1em;
	/*
	background-image:url(../img/box_1.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	*/
}

/*********************************
6. Services
*********************************/

.services
{
	width: 100%;
	background: #FFFFFF;
	padding-top: 99px;
	padding-bottom: 102px;
}
.icon_boxes_row
{
	margin-top: 100px;
}
.icon_box
{
	margin-bottom: 85px;
}
.icon_box_icon
{
	width: 49px;
	height: 49px;
}
.icon_box_icon img
{
	max-width: 100%;
}
.icon_box_title
{
	font-size: 20px;
	font-weight: 600;
	color: #404040;
	padding-left: 25px;
}
.icon_box_text
{
	font-size: 14px;
	font-weight: 500;
	color: #838383;
	line-height: 2.14;
	margin-top: 21px;
}
.services_button
{
	margin-top: 4px;
}

/*********************************
7. Boxes
*********************************/

.boxes-wrap {
	background-image:url(../img/box_1.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

.boxes
{
	width: 100%;
}

.box
{
	/*background-color: #5CAB0E;*/
	padding-top: 15px;
	padding-left: 15px;
	padding-bottom: 15px;
	padding-right: 15px;
}

.box_title
{
	font-size: 2.4em;
	font-weight: 600;
	color: #FFFFFF;
	line-height: 1.2;
	align-items: center;
}
.box_subtitle
{
	font-size: 1em;
	font-weight: 600;
	color: #FFFFFF;
	text-transform: uppercase;
	line-height: 0.75;
	margin-top: 16px;
	padding-left: 1px;
}
.box_text
{
	margin-top: 60px;
	font-size: 14px;
	font-weight: 500;
	color: rgba(255,255,255,0.66);
	line-height: 2.14;
	padding-left: 3px;
}
.box_button
{
	margin-top: 77px;
}


@media (min-width: 767px) and (max-width: 991px)
{
	.box {
		height: 100%;
		font-size: 0.8em;
		min-height: 600px;
		max-height: 600px;
		margin-top: 1em; 
		padding: 1em;
	}
}

@media only screen and (max-width: 766px)
{
	.box {
		min-height: 350px;
		max-height: 350px;
	}

	.box_text {
		font-size: 1em;
	}
}

/*********************************
8. Tabs
*********************************/

.tabs_container
{
	width: 100%;
	background: #FFFFFF;
	padding-top: 100px;
	padding-bottom: 97px;
}
.tab
{
	width: 100%;
	padding-left: 29px;
	padding-top: 23px;
	padding-bottom: 25px;
	padding-right: 29px;
	background: #f8fafc;
	cursor: pointer;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.tab:not(:last-child)
{
	margin-bottom: 2px;
}
.tab::after
{
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 6px;
	height: 100%;
	content: '';
	background: #dfdfdf;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.tab:hover::after,
.tab.active::after
{
	background: #404040;
}
.tab:hover,
.tab.active
{
	background: #32c69a;
}
.tab:hover .tab_title,
.tab:hover .tab_text,
.tab.active .tab_title,
.tab.active .tab_text
{
	color: #FFFFFF;
}
.tab_panel
{
	display: none !important;
	width: 100%;
	height: 100%;
	-webkit-animation: fadeEffect 1s;
    animation: fadeEffect 1s;
}
/* Fade in tabs */
@-webkit-keyframes fadeEffect {
    from {opacity: 0;}
    to {opacity: 1;}
}

@keyframes fadeEffect {
    from {opacity: 0;}
    to {opacity: 1;}
}
.tab_panel.active
{
	display: block !important;
}
.tab_list
{
	padding-top: 31px;
}
.tab_list ul li:not(:last-child)
{
	margin-bottom: 41px;
}
.tab_image
{
	width: 100%;
}
.tab_image img
{
	max-width: 100%;
}
.tab_title
{
	font-size: 20px;
	font-weight: 700;
	color: #404040;
	line-height: 1.2;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.tab_text
{
	font-size: 14px;
	font-weight: 500;
	color: #b1b1b1;
	margin-top: 7px;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.tab_list_title
{
	font-size: 20px;
	font-weight: 600;
	color: #404040;
}
.tab_list_text
{
	margin-top: 8px;
}