/*
Theme Name: Agiliway Basic Theme
Theme URI: https://agiliway.com/
Description: Basic Theme. If you have questions visit our <a href="https://agiliway.com/">website</a>.
Author: Agiliway Team
Author URI: https://agiliway.com
Version: 1.0
Tags: responsive, bootstrap, agiliway

License: Attribution-ShareAlike 3.0 Unported (CC BY-SA 3.0)
License URI: https://creativecommons.org/licenses/by-sa/3.0/
*/

/* My Styles */
*:focus {
	outline: none;
	outline: 0px auto -webkit-focus-ring-color;
	outline-offset: 0px;
	-webkit-box-shadow: inset 0 0px 0px rgba(0,0,0,.125);
	box-shadow: inset 0 0px 0px rgba(0,0,0,.125);
}
body {
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 18px;
	color: #000000;
}
.display-1 {
	font-weight: 700;
	font-size: 48px;
	line-height: 48px;
}
.display-2 {
	font-weight: 700;
	font-size: 40px;
	line-height: 40px;
	text-transform: uppercase;
	color: #0E4D8D;
}
.display-3 {
	font-weight: 700;
	font-size: 30px;
	line-height: 40px;
	text-transform: uppercase;
	color: #0E4D8D;
}
.display-4 {
	font-weight: 700;
	font-size: 24px;
	line-height: 30px;
	text-transform: uppercase;
	color: #0E4D8D;
}
.display-5 {
	font-weight: 700;
	font-size: 21px;
	line-height: 24px;
	text-transform: uppercase;
	color: #E53312;
}
.display-6 {
	font-weight: 700;
	font-size: 18px;
	line-height: 20px;
	text-transform: uppercase;
	color: #0E4D8D;
}
p, li, dd {
	font-weight: 300;
	font-size: 18px;
	line-height: 24px;
	color: #000000;
}
a {
	color: #E53312;
}
.btn {
	position: relative;
	font-weight: 700;
	font-size: 16px;
	line-height: 20px;
	text-transform: uppercase;
	padding: 11px 50px 7px;
	border-radius: 19px;
}
.btn-danger {
	background-color: #E53312;
    border-color: #E53312;
}
.btn-danger:hover, .btn-danger:focus {
	background-color: #0E4D8D;
    border-color: #0E4D8D;
}
.btn-primary {
    background-color: #0E4D8D;
    border-color: #0E4D8D;
}
.btn-primary:hover, .btn-primary:focus {
	background-color: #E53312;
    border-color: #E53312;
}
.btn-danger:before, .btn-primary:before, .btn-outline-primary:hover:before, .btn-outline-primary:focus:before {
    content: '';
    position: absolute;
    right: 15px;
    top: 14px;
    width: 20px;
    height: 10px;
    background: url(/wp-content/themes/agiliway/image/arrow-next-white.svg) no-repeat center center;
}
.btn-outline-primary {
	color: #0E4D8D;
    border-color: #0E4D8D;
}
.btn-outline-primary:hover, .btn-outline-primary:focus {
	color: #fff;
	background-color: #0E4D8D;
    border-color: #0E4D8D;
}
.btn-link {
	font-weight: 400;
	text-transform: none;
	text-decoration: none;
	padding-left: 0px;
}
.btn-link:before, .btn-outline-primary:before {
    content: '';
    position: absolute;
    right: 15px;
    top: 14px;
    width: 20px;
    height: 10px;
    background: url(/wp-content/themes/agiliway/image/arrow-next-blue.svg) no-repeat center center;
}

/* header */
.service-block {
	background: rgba(14, 77, 141, 0.05);
}
.header-search, .header-lang {
	display: inline-block;
}
.lang-item {
	display: inline-block;
	line-height: 16px;
	padding: 7px 0 0;
	height: 30px;
}
.lang-item a {
	font-weight: 400;
	font-size: 14px;
	line-height: 16px;
	height: 16px;
	color: #0E4D8D;
	text-transform: uppercase;
	text-decoration: none;
	padding: 0 5px 0 10px;
	vertical-align: top;
}
.lang-item:last-child a {
	border-left: 1px solid #0E4D8D;
}
.lang-item.current-lang a, .lang-item a:hover, .lang-item a:focus {
	color: #E53312;
}
.navbar.bg-light {
    background-color: #fff!important;
}
.navbar-brand {
	display: flex;
    flex-wrap: wrap;
	align-items: center!important;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-right: 0px;
}
.navbar-brand img {
	margin-right: 10px;
}
.navbar-brand div { 
	font-weight: 500;
	font-size: 14px;
	line-height: 16px;
	text-transform: uppercase;
	color: #0E4D8D;
	padding-left: 10px;
	border-left: 1px solid #0E4D8D;
}
.navbar-toggler {
    padding: 10px;
    line-height: 30px;
    border: 0px solid transparent;
    border-radius: 0px;
}
.navbar-toggler:focus {
	background: rgba(14, 77, 141, 0.05);
    box-shadow: 0 0 0 0rem;
}
.navbar-toggler-icon {
    width: 30px;
    height: 30px;
    background: url(/wp-content/themes/agiliway/image/ico-menu.svg) no-repeat center center;
}
.nav-link {
    font-weight: 400;
	font-size: 18px;
	line-height: 20px;
	text-transform: uppercase;
	color: #0E4D8D;
}
.nav-link:focus, .nav-link:hover, .active .nav-link {
    color: #E53312;
}

/* Search*/
.screen-reader-text {
	display: none;
}
.search-form {
	display: flex;
}
.search-field {
	background-color: transparent;
	border: 0px solid #fff;
	border-radius: 0px;
}
[type=search] {
    outline-offset: 0px;
}
.service-block .btn-link {
	width: 30px;
    height: 30px;
	padding: 0px;
    border-radius: 15px;
}
.service-block .btn-link:before {
    content: '';
    position: absolute;
    right: 0px;
    top: 0px;
    width: 30px;
    height: 30px;
    background: url(/wp-content/themes/agiliway/image/ico-search.svg) no-repeat center center;
}
.btn.btn-link.search:focus {
    outline: 0;
    box-shadow: 0 0 0 0rem rgba(13,110,253,0);
}
.search-icon,
.search-submit {
    background: url(/wp-content/themes/agiliway/image/ico-search.svg) no-repeat center center;
    color: transparent;
    border: 0;
    display: block;
    width: 30px;
    height: 30px;
    cursor: pointer;
}
.dropstart .dropdown-menu[data-bs-popper] {
    top: 0px !important;
    right: 10px;
    left: auto;
    margin-top: 0;
    margin-right: 0;
	padding: 0px;
	width: 200px;
	height: 40px;
	background-color: #f8f9fb;
	border: 1px solid #dfe3e7;
	border-radius: 20px;
}
.dropstart .dropdown-toggle::before {
    margin-right: 0px;
    vertical-align: 0px;
    border-top: 0px solid transparent;
    border-right: 0px solid;
    border-bottom: 0px solid transparent;
}
.dropstart .dropdown-menu .search-form {
	/* position: relative;
	display: flex; */
}
.dropstart .dropdown-menu .search-form label .screen-reader-text {
	font-size: 0px;
}
.dropstart .dropdown-menu .search-field {
	width: 150px;
	line-height: 38px;
	padding-left: 10px;
	background-color: transparent;
    border: 0px solid #fff;
}
.modal-body .search-submit, .dropstart .dropdown-menu .search-submit {
    position: absolute;
    right: 0px;
    top: 0px;
	padding: 0;
	background: url(image/ico-search.svg) no-repeat center center;
    color: transparent;
    border: 0;
    display: block;
    width: 38px;
    height: 38px;
    cursor: pointer;
}

/* home-slide */
.home-slide {
	position: relative;
    height: 800px;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 100%), url(/wp-content/themes/agiliway/image/home-slide.jpg) no-repeat center center;
    background-size: auto 100%;
	overflow: hidden;
}
.home-slide .container > p {
	font-size: 18px;
	line-height: 0px;
	margin-bottom: 0px;
}
.home-slide .title {
	position: relative;
}
.home-slide .title:before {
    content: '';
    position: absolute;
    left: -50px;
    top: -135px;
    width: 600px;
    height: 600px;
    background: rgba(14, 77, 141, 0.5);
	border-radius: 50%;
}
.home-slide .title h1, .home-slide .title p {
	position: relative;
	color: #fff;
}
.home-slide .contact {
	position: relative;
}
.home-slide .contact:before {
    content: '';
    position: absolute;
    left: -75px;
    top: -115px;
    width: 400px;
    height: 400px;
    background: rgba(255, 255, 255, 0.5);
	border-radius: 50%;
}
.home-slide .contact p {
	position: relative;
	color: #0E4D8D;
	font-weight: 400;
	text-transform: uppercase;
}
.home-slide .contact p a {
	color: #0E4D8D;
	text-decoration: none;
}
.home-slide .contact p a:hover {
	color: #E53312;
}
.location, .phone, .email {
	position: relative;
	padding-left: 40px;
}
.location:before, .phone:before, .email:before {
    content: '';
    position: absolute;
    left: 0px;
    top: 0px;
    width: 30px;
    height: 30px;
	border-radius: 50%;
}
.location:before {
	background: #fff url(/wp-content/themes/agiliway/image/ico-pin.svg) no-repeat center center;
}
.phone:before {
	background: #fff url(/wp-content/themes/agiliway/image/ico-phone.svg) no-repeat center center;
}
.email:before {
	background: #fff url(/wp-content/themes/agiliway/image/ico-email.svg) no-repeat center center;
}

/* products */
.product-photo {
	position: relative;
}
.product-photo:before {
    content: '';
    position: absolute;
    left: 0px;
    bottom: -40px;
    width: 360px;
    height: 360px;
    background: rgba(14, 77, 141, 0.05);
	border-radius: 50%;
}
.product dt, .product dd {
	margin-bottom: 0px;
	padding-top: 5px;
	padding-bottom: 5px;
	border-top: 1px dashed rgba(14, 77, 141, 0.3);
}
.product dt {
	font-weight: 700;
	font-size: 18px;
	line-height: 20px;
	text-align: right;
	color: #0E4D8D;
}

/* construction */
.construction {
	position: relative;
	background-color: rgba(14, 77, 141, 0.05);
}
.construction .display-2, .construction .photo {
	position: relative;
	/* z-index: +1; */
}
.construction ol li {
	position: relative;
	padding: 10px 15px;
	font-weight: bold;
	text-transform: uppercase;
}
.construction ol li:after {
	position: absolute;
	left: -32px;
	top: 4px;
	display: block;
	content: '';
	width: 36px;
	height: 36px;
	background-color: #E53312;
	border-radius: 18px;
	z-index: -1;
}
.construction ol li::marker {
	color: #fff;
	font-weight: bold;
	background-color: #E53312;
}
.construction .description-01 {
    position: absolute;
    right: 50%;
    top: 280px;
    width: 40%;
    height: 100px;
	padding-right: 280px;
}
.construction .description-01:before {
	content: '';
    position: absolute;
    right: 120px;
    top: -150px;
    width: 300px;
    height: 300px;
   /*background-color: #fff; */
	border-radius: 50%;
}
.construction .description-01 p {
	position: relative;
}
.construction .number-01 {
	position: absolute;
    left: calc(50% - 50px);
    top: 275px;   
	z-index: +1;
}
.construction .number-01:before {
	content: '';
    position: absolute;
    right: 30px;
    top: 20px;
    width: 220px;
    height: 1px;
    background-color: #E53312;
}
.construction .number-01:after {
	content: '';
    position: absolute;
    right: 250px;
    top: 15px;
    width: 10px;
    height: 10px;
    background-color: #E53312;
	border-radius: 50%;
}
.construction .number-01 p {
	display: block;
	width: 40px;
    height: 40px;
	margin: 0 auto;
	text-align: center;
	line-height: 40px;
	color: #fff;
	background-color: #E53312;
	border-radius: 50%;	
}
.construction .description-02 {
    position: absolute;
    left: 50%;
    top: 240px;
    width: 40%;
    height: 100px;
	padding-left: 280px;
}
.construction .description-02:before {
	content: '';
    position: absolute;
    left: 150px;
    top: -125px;
    width: 250px;
    height: 250px;
    /* background-color: #fff; */
	border-radius: 50%;
}
.construction .description-02 p {
	position: relative;
}
.construction .number-02 {
	position: absolute;
    left: calc(50% + 20px);
    top: 235px;
	z-index: +1;
}
.construction .number-02:before {
	content: '';
    position: absolute;
    left: 30px;
    top: 20px;
    width: 210px;
    height: 1px;
    background-color: #E53312;
}
.construction .number-02:after {
	content: '';
    position: absolute;
    left: 240px;
    top: 15px;
    width: 10px;
    height: 10px;
    background-color: #E53312;
	border-radius: 50%;
}
.construction .number-02 p {
	display: block;
    width: 40px;
    height: 40px;
	margin: 0 auto;
	text-align: center;
	line-height: 40px;
	color: #fff;
	background-color: #E53312;
	border-radius: 50%;
}
.construction .description-03 {
    position: absolute;
    right: 50%;
    top: 450px;
    width: 40%;
    height: 100px;
	padding-right: 280px;
}
.construction .description-03:before {
	content: '';
    position: absolute;
    right: 170px;
    top: -90px;
    width: 200px;
    height: 200px;
    /* background-color: #fff; */
	border-radius: 50%;
}
.construction .description-03:after {
	content: '';
    position: absolute;
    right: calc(50% - 30px);
    top: -127px;
    width: 1px;
    height: 145px;
	background-color: #E53312;
}
.construction .description-03 p {
	position: relative;
}
.construction .number-03 {
	position: absolute;
    left: calc(50% + 120px);
    top: 305px;
	z-index: +1;
}
.construction .number-03:before {
	content: '';
    position: absolute;
    right: 35px;
    top: 20px;
    width: 390px;
    height: 1px;
    background-color: #E53312;
}
.construction .number-03:after {
	content: '';
    position: absolute;
    right: 420px;
    top: 155px;
    width: 10px;
    height: 10px;
    background-color: #E53312;
	border-radius: 50%;
}
.construction .number-03 p {
	display: block;
    width: 40px;
    height: 40px;
	text-align: center;
	line-height: 40px;
	color: #fff;
	background-color: #E53312;
	border-radius: 50%;
}
.construction .description-04 {
    position: absolute;
    left: 50%;
    top: 460px;
    width: 40%;
    height: 100px;
	padding-left: 280px;
}
.construction .description-04:before {
	content: '';
    position: absolute;
    left: 190px;
    top: -65px;
    width: 150px;
    height: 150px;
    /* background-color: #fff; */
	border-radius: 50%;
}
.construction .description-04 p {
	position: relative;
}
.construction .number-04 {
	position: absolute;
    left: calc(50% + 100px);
    top: 455px;
	z-index: +1;
}
.construction .number-04:before {
	content: '';
    position: absolute;
    left: 30px;
    top: 20px;
    width: 130px;
    height: 1px;
    background-color: #E53312;
}
.construction .number-04:after {
	content: '';
    position: absolute;
    left: 160px;
    top: 15px;
    width: 10px;
    height: 10px;
    background-color: #E53312;
	border-radius: 50%;
}
.construction .number-04 p {
	display: block;
    width: 40px;
    height: 40px;
	margin: 0 auto;
	text-align: center;
	line-height: 40px;
	color: #fff;
	background-color: #E53312;
	border-radius: 50%;
}

/* realisations */
.realisation a img {
	width: 100%;
}
.realisation p {
	position: relative;
	padding-left: 20px;
}
.realisation p:after {
	content: '';
    position: absolute;
    left: 0px;
    top: 10px;
    width: 6px;
    height: 6px;
    background-color: #E53312;
	border-radius: 50%;
}
.realisation p a {
	font-size: 20px;
	color: #0E4D8D;
	text-decoration: none;
}
.realisation p a:hover {
	color: #E53312;
}

/* about-slide */
.slide {
	position: relative;
    height: 800px;
	overflow: hidden;
}
.about.slide {
	background: linear-gradient(0deg, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), url(/wp-content/themes/agiliway/image/about-slide.jpg) no-repeat center center;
    background-size: auto 100%;
}
.projection.slide {
	background: linear-gradient(0deg, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), url(/wp-content/themes/agiliway/image/projection-slide.jpg) no-repeat center center;
    background-size: auto 100%;
}
.slide .content {
	position: relative;
}
.slide .content:before {
    content: '';
    position: absolute;
    left: -150px;
    top: -200px;
    width: 900px;
    height: 900px;
    background: rgba(14, 77, 141, 0.5);
	border-radius: 50%;
}
.about.slide .btn-link:before {
    background: url(/wp-content/themes/agiliway/image/arrow-next-white.svg) no-repeat center center;
}
.projection.slide .content:before {
    top: -325px;
}
.slide .content h1, .slide .content p {
	position: relative;
	color: #fff;
}
.slide .content h1:before {
    content: '';
    position: absolute;
    left: -20px;
    top: 17px;
    width: 6px;
    height: 6px;
    background-color: #E53312;
    border-radius: 50%;
}
.slide .content .btn-link {
	color: #fff;
	padding-left: 0px;
}
.slide .photo {
	position: relative;
}
.slide .photo:before {
    content: '';
    position: absolute;
    left: -10px;
    top: -50px;
    width: 700px;
    height: 700px;
    background: rgba(255, 255, 255, 0.5);
	border-radius: 50%;
}
.slide .photo:after {
    content: '';
    position: absolute;
    right: -75px;
    top: 150px;
    width: 300px;
    height: 300px;
    background: #E53312;
	border-radius: 50%;
}
.slide .photo div {
	position: relative;
	z-index: +1;
}
.slide .photo img {
	border-radius: 50%;
}

/* content */
.content .display-2, .content .display-3 {
	position: relative;
}
.content .display-2:before, .content ul li:before {
    content: '';
    position: absolute;
    left: -20px;
    top: 17px;
    width: 6px;
    height: 6px;
    background-color: #E53312;
    border-radius: 50%;
}
.content ul li {
	position: relative;
	padding: 7px 0px 10px;
}

/* news */
.news .article, .objects .article {
    padding: 0px;
    margin-bottom: 24px;
	background: rgba(14, 77, 141, 0.05);
}
.news .article .post-thumbnail .attachment-thumbnail, .new .article .post-thumbnail .attachment-full, .objects .article .post-thumbnail .attachment-thumbnail {
	width: 100%;
}
.products .article .post-thumbnail, .product .article .post-thumbnail {
	position: relative;
}
.products .article .post-thumbnail .attachment-medium, .product .article .post-thumbnail .attachment-full {
	width: 100%;
	height: auto;
}
.products .article .post-thumbnail:before {
    content: '';
    position: absolute;
    left: calc(50% - 180px);
    bottom: -40px;
    width: 360px;
    height: 360px;
    background: rgba(14, 77, 141, 0.05);
    border-radius: 50%;
}
.product .article .post-thumbnail:before {
    content: '';
    position: absolute;
    left: calc(50% - 290px);
    bottom: -40px;
    width: 580px;
    height: 580px;
    background: rgba(14, 77, 141, 0.05);
    border-radius: 50%;
}
.products .article .display-5 {
	position: relative;
}
.news .article h3, .objects .article h3 {
	position: relative;
	font-weight: 400;
	font-size: 21px;
	line-height: 24px;
	color: #0E4D8D;
	margin-bottom: 10px;
    border-bottom: 0px solid #eaecef;
}
.news .article h3 a, .objects .article h3 a {
    color: #0E4D8D;
    text-decoration: none;
}
.products .article h3 a {
	text-decoration: none;
}
.objects .article h3:after {
    content: '';
    position: absolute;
    left: 10px;
    top: 10px;
    width: 6px;
    height: 6px;
    background-color: #E53312;
    border-radius: 50%;
}
.date {
	position: relative;
	font-weight: 400;
	font-size: 16px;
	line-height: 26px;
	color: #E53312;
	padding-left: 15px;
	margin-bottom: 10px;
}
.date:before {
    content: '';
    position: absolute;
    left: 10px;
    top: 10px;
    width: 6px;
    height: 6px;
    background-color: #E53312;
    border-radius: 50%;
}
.new .article .entry {
	background: rgba(14, 77, 141, 0.05);
}
.category-item .article .entry p {
	font-weight: 300;
	font-size: 18px;
	line-height: 1.2;
}
.products dt, .products dd, .product dt, .product dd {
    margin-bottom: 0px;
    padding-top: 5px;
    padding-bottom: 5px;
    border-top: 1px dashed rgba(14, 77, 141, 0.3);
}
.products dt, .product dt {
    font-weight: 700;
    font-size: 18px;
    line-height: 20px;
    text-align: right;
    color: #0E4D8D;
}
.advantages {
	background: rgba(14, 77, 141, 0.05);
}
.advantages ul li {
    position: relative;
    padding: 7px 0px 10px;
}
.advantages ul li:before {
    content: '';
    position: absolute;
    left: -20px;
    top: 17px;
    width: 6px;
    height: 6px;
    background-color: #E53312;
    border-radius: 50%;
}

/* forms */
.forms {
	background: rgba(14, 77, 141, 0.05);
}
.form-control, .form-select {
    padding: 9px 15px;
    font-size: 18px;
    font-weight: 300;
    line-height: 30px;
    color: #000;
    background-color: #fff;
    border: 1px solid #fff;
    border-radius: 0px;
}

/* foogallery */
.foogallery {
	display: flex;
    flex-wrap: wrap;
}
.fg-item {
	flex: 0 0 auto;
    width: calc(33.33333333% - 20px);
}
.foogallery .fg-image {
	width: 100% !important;
	height: auto !important;
}

/* footer */
#footer {
	padding: 50px 0;
	background-color: #0E4D8D;
}
#footer p, #footer p a {
	font-size: 16px;
	color: #fff;
}
.widget {
    margin: 0px !important;
}
#footer .btn {
    padding: 9px 40px 9px 15px;
}
.social a {
	display: inline-block;
	width: 32px;
	height: 32px;
	line-height: 30px;
	margin-top: 5px;
	border: 1px solid #0E4D8D;
	border-radius: 50%;
}
.social a:hover {
	border: 1px solid #fff;
}
#footer .btn-danger:hover, #footer .btn-danger:focus {
    border-color: #fff;
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) { ... }

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
	.construction .photo {
		margin-top: 50px;
		margin-bottom: 50px;
	}
	.construction .description-01, .construction .description-02, .construction .description-03, .construction .description-04 {
	    width: 49%;
	}
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
	.construction .description-03:after {
	    right: 265px;
	}
}

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
}

/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) {
	.construction .description-01, .construction .description-02, .construction .description-03, .construction .description-04 {
	    width: 40%;
	}
	.construction .number-03:before {
		width: 390px;
	}
	.construction .number-03:after {
		right: 420px;
		top: 155px;
	}
	.construction .description-03:after {
	    right: 265px;
	}
}

/* `xxl` applies to x-large devices (large desktops, less than 1400px) */
@media (max-width: 1399.98px) {
	.products .article .post-thumbnail:before {
		left: calc(50% - 160px);
		width: 320px;
		height: 320px;
	}
	.construction .number-03 {
	    left: calc(50% + 120px);
	}
}

/* `xl` applies to large devices (desktops, less than 1200px) */
@media (max-width: 1199.98px) {
	.navbar-nav .menu-item {
		border-top: 1px solid rgba(14, 77, 141, 0.15);
	}
	.products .article .post-thumbnail:before {
		left: calc(50% - 140px);
		width: 280px;
		height: 280px;
	}
	.construction .description-01, .construction .description-03 {
		padding-right: 220px;
	}
	.construction .description-02, .construction .description-04 {
		padding-left: 220px;
	}
	.construction .description-01:before {
		right: 65px;
	}
	.construction .description-02:before {
		left: 85px;
	}
	.construction .description-03:before {
		right: 115px;
	}
	.construction .description-04:before {
		left: 135px;
	}
	.construction .number-01:before {
	    width: 160px;
	}
	.construction .number-02:before {
	    width: 160px;
	}
	.construction .number-04:before {
	    width: 70px;
	}
	.construction .number-03:before {
		width: 340px;
	    right: 25px;
	}
	.construction .number-01:after {
	    right: 190px;
	}
	.construction .number-03:after {
	    right: 360px;
	}
	.construction .number-02:after {
	    left: 180px;
	}
	.construction .number-04:after {
	    left: 100px;
	}
	.construction p {
	    font-size: 16px;
		line-height: 20px;
	}
	.construction .display-4 {
	    font-size: 22px;
		line-height: 24px;
	}
}

/* `lg` applies to medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) {
	.home-slide .title:before {
		left: -75px;
		top: -95px;
	}
	.construction .description-03 {
	    top: 510px;
	}
	.construction .description-01, .construction .description-03 {
		padding-right: 210px;
	}
	.construction .description-02, .construction .description-04 {
		padding-left: 210px;
	}
	.construction .description-01:before {
		right: 65px;
		top: -130px;
		width: 260px;
    	height: 260px;
	}
	.construction .description-02:before {
		left: 65px;
    	top: -110px;
		width: 220px;
    	height: 220px;
	}
	.construction .description-03:before {
		right: 95px;
    	top: -60px;
		width: 180px;
    	height: 180px;
	}
	.construction .description-04:before {
		left: 115px;
    	top: -60px;
		width: 140px;
    	height: 140px;
	}
	.construction .number-01:before {
	    width: 160px;
	}
	.construction .number-02:before {
	    width: 140px;
	}
	.construction .number-04:before {
	    width: 60px;
	}
	.construction .number-03:before {
		width: 325px;
		right: 30px;
	}
	.construction .number-01:after {
	    right: 180px;
	}
	.construction .number-03:after {
	    right: 350px;
	    top: 215px;
	}
	.construction .number-02:after {
	    left: 170px;
	}
	.construction .number-04:after {
	    left: 90px;
	}
	.construction .description-03:after {
		right: calc(50% + 5px);
		top: -187px;
		height: 200px;
	}
}

/* `md` applies to small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
	.display-1 {
	    font-size: 36px;
		line-height: 36px;
	}
	.display-2 {
    	font-size: 32px;
		line-height: 32px;
	}
	.home-slide .title:before {
		left: calc(50% - 270px);
		top: -125px;
		width: 540px;
		height: 540px;
	}
	.home-slide .contact:before {
		left: calc(50% - 180px);
		top: -125px;
		width: 360px;
		height: 360px;
	}
	.slide .photo {
		display: none;
	}
	.products .article .post-thumbnail:before {
		left: calc(50% - 120px);
		width: 240px;
		height: 240px;
	}
	.construction .photo {
		margin-top: 225px;
		margin-bottom: 200px;
	}
	.construction .photo img {
		height: 580px;
	}
	.construction .description-01, .construction .description-02, .construction .description-03, .construction .description-04 {
	    width: 100%;
		padding-left: 30px;
		padding-right: 30px;
	}
	.construction .description-01 {
		right: 0%;
		top: 150px;
	}
	.construction .description-02 {
		left: 0%;
		top: 250px;
	}
	.construction .description-03 {
		right: 0%;
		top: auto;
		bottom: 125px;
	}
	.construction .description-04 {
		left: 0%;
		top: auto;
		bottom: 0px;
	}
	.construction .description-01:before, .construction .description-02:before, .construction .description-03:before, .construction .description-04:before {
    	width: 10px;
		height: 10px;
		background-color: #E53312;
	}
	.construction .description-01:before {
		right: 10px;
		top: 7px;
	}
	.construction .description-02:before {
		left: 10px;
		top: 7px;
	}
	.construction .description-03:before {
		right: 10px;
		top: 7px;
	}
	.construction .description-03:after {
		display: none;
	}
	.construction .description-04:before {
		left: 10px;
		top: 7px;
	}
	.construction .number-01 {
		top: 445px;
    	left: -20px;
		width: calc(100% + 20px);
	}
	.construction .number-02 {
		top: 485px;
    	left: 70px;
		width: calc(100% - 70px);
	}
	.construction .number-03 {
		top: 475px;
    	left: calc(75% - 20px);
		width: calc(25% + 20px);
	}
	.construction .number-04 {
		top: 625px;
    	left: 100px;
		width: calc(100% - 100px);
	}
	.construction .number-01:after {
		right: 14px;
		top: -287px;
		width: 1px;
		height: 307px;
		border-radius: 0px;
	}
	.construction .number-02:after {
		left: -56px;
		top: -228px;
		width: 1px;
		height: 248px;
		border-radius: 0px;
	}
	.construction .number-03:after {
		right: 14px;
		top: 20px;
		width: 1px;
		height: 445px;
		border-radius: 0px;
	}
	.construction .number-04:after {
		left: -86px;
		top: 20px;
		width: 1px;
		height: 425px;
		border-radius: 0px;
	}
	.construction .number-01:before {
		right: 14px;
		width: calc(50% - 20px);
	}
	.construction .number-02:before {
		left: -56px;
    	width: calc(50% + 70px);
	}
	.construction .number-03:before {
		right: 14px;
		width: calc(100% - 20px);
	}
	.construction .number-04:before {
		left: -86px;
    	width: calc(50% + 80px);
	}
	.fg-item {
		width: calc(50% - 20px);
	}
}

/* `sm` applies to x-small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {
	.home-slide .title:before {
		left: calc(50% - 240px);
		top: -75px;
		width: 480px;
		height: 480px;
	}
	.construction .photo {
		margin-top: 250px;
		margin-bottom: 250px;
	}
	.construction .photo img {
		height: 510px;
	}
	.construction .description-01 {
		top: 175px;
	}
	.construction .description-02 {
		top: 300px;
	}
	.construction .description-03 {
		bottom: 180px;
	}
	.construction .description-04 {
		bottom: 25px;
	}
	.construction .number-01 {
		top: 490px;
		left: -30px;
		width: calc(100% + 30px);
	}
	.construction .number-02 {
		top: 530px;
	}
	.construction .number-03 {
		top: 510px;
		left: calc(85% - 20px);
   		width: calc(15% + 20px);
	}
	.construction .number-04 {
		top: 710px;
	}
	.construction .number-01:after {
		right: 14px;
		top: -300px;
		width: 1px;
		height: 320px;
		border-radius: 0px;
	}
	.construction .number-02:after {
		left: -56px;
		top: -222px;
		width: 1px;
		height: 242px;
		border-radius: 0px;
	}
	.construction .number-03:after {
		right: 14px;
		top: 20px;
		width: 1px;
		height: 400px;
		border-radius: 0px;
	}
	.construction .number-04:after {
		left: -86px;
		top: 20px;
		width: 1px;
		height: 355px;
		border-radius: 0px;
	}
	.construction .number-01:before {
		right: 14px;
		width: calc(50% - 20px);
	}
	.construction .number-02:before {
		left: -56px;
    	width: calc(50% + 50px);
	}
	.construction .number-03:before {
		right: 14px;
		width: calc(100% - 20px);
	}
	.construction .number-04:before {
		left: -86px;
    	width: calc(50% + 100px);
	}
	.foogallery {
		display: block;
	}
	.fg-item {
		width: 100%;
	}
}