@font-face{
    src: url(../fonts/OpenSans-Light.ttf);
    font-family: "open-sans-light";
}

@font-face{
    src: url(../fonts/OpenSans-Regular.ttf);
    font-family: "open-sans-regular";
}

@font-face{
    src: url(../fonts/OpenSans-Medium.ttf);
    font-family: "open-sans-medium";
}

@font-face{
    src: url(../fonts/OpenSans-SemiBold.ttf);
    font-family: "open-sans-semibold";
}

@font-face{
    src: url(../fonts/OpenSans-Bold.ttf);
    font-family: "open-sans-bold";
}

@font-face{
    src: url(../fonts/OpenSans-ExtraBold.ttf);
    font-family: "open-sans-extrabold";
}

:root{
    --black-txt-color: #000;
    --white-txt-color: #fff;
    --orange-txt-color: #ffb30c;
    --dark-olive-grey-txt-color: #655e4f;
    --light-grey-txt-color: #7d7d7d;
    --red-txt-color: red;
    --black-back-color: #000;
    --black-back-color-2: #272626;
    --white-back-color: #fff;
    --orange-back-color: #ffb30c;
    --dark-olive-grey-back-color: #655e4f;
    --light-grey-back-color: #f6f5f5;
    --transparent-back: transparent;
    --font-size: 17px;
}

*, *::before, *::after{
    box-sizing: border-box;
}

html{
    font-size: var(--font-size);
}

body{
    font-size: inherit;
    margin: 0;
    background-color: var(--white-back-color);
    color: var(--black-txt-color);
    font-family: "open-sans-regular", sans-serif;
}

h1, h2, h3, h4, h5, h6, p, label, input, a, 
button, figure, strong, b, textarea, ul, ol{
	font-weight: 400;
	margin: 0;
	padding: 0;
}

ol, ul{
    list-style-type: none;
}

a{
    text-decoration: none;
}

a, button{
    color: var(--black-txt-color);
}

button{
    border: unset;
    background-color: transparent;
}

.wrapper-title h1{
    font-size: 3em;
    line-height: 1.2;
    font-family: "open-sans-bold", sans-serif;
}

.wrapper-title h2{
    font-size: 2.3em;
    line-height: 1.3;
    font-family: "open-sans-bold", sans-serif;
}

.wrapper-title h3{
    font-size: 1.45em;
    line-height: 1.45;
    font-family: "open-sans-bold", sans-serif;
}

.wrapper-text{
    margin-top: 1.5em;
}

.wrapper-text p{
    font-size: 1em;
    margin-bottom: 1em;
    line-height: 1.7;
}

.wrapper-text p:last-child{
    margin-bottom: 0;
}

.small-text{
    margin-bottom: 0.5em;
}

.small-text p{
    font-family: "open-sans-bold", sans-serif;
    color: var(--orange-txt-color);
    text-transform: uppercase;
}

.wrapper-btn{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-top: 2em;
}

.wrapper-btn a, .wrapper-btn button{
    border-width: 0.1em;
    border-style: solid;
    padding: 0.3em 1.2em 0.3em 0.3em;
    font-size: 0.9em;
    border-radius: 2em;
    font-family: "open-sans-semibold", sans-serif;
    display: inline-flex;
    align-items: center;
    line-height: 1.7;
}

/* .wrapper-btn a:last-child, .wrapper-btn button:last-child{
    margin-right: 0;
    margin-bottom: 0;
} */

.wrapper-btn a span:first-child, .wrapper-btn button span:first-child{
    width: 2.5em;
    height: 2.5em;
    border-radius: 50%;
    margin-right: 1em;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.wrapper-btn a span:first-child svg, .wrapper-btn button span:first-child svg{
    font-size: 1em;
}

.wrapper-btn a span:last-child, .wrapper-btn button span:last-child{
    font-size: 1.1em;
}

.wrapper-img img{
    width: 100%;
    display: block;
    object-fit: cover;
}

.wrapper-list li img{
    margin-right: 0.5em;
}

.height-100pct{
    height: 100%;
}

.height-100vh{
    height: 100vh;
}

.container{
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1.2rem;
    padding-right: 1.2rem;
}

.container-2{
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1.2rem;
    padding-right: 1.2rem;
}

.row{
    display: flex;
    flex-wrap: wrap;
    margin: 0 -1.2rem;
}

.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, 
.col-xs-11, .col-xs-12, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, 
.col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, 
.col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, 
.col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-xl-1, .col-xl-2, 
.col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, 
.col-xxl-1, .col-xxl-2, .col-xxl-3, .col-xxl-4, .col-xxl-5, .col-xxl-6, .col-xxl-7, .col-xxl-8, .col-xxl-9, 
.col-xxl-10, .col-xxl-11, .col-xxl-12, .col-xxxl-1, .col-xxxl-2, .col-xxxl-3, .col-xxxl-4, .col-xxxl-5, .col-xxxl-6, 
.col-xxxl-7, .col-xxxl-8, .col-xxxl-9, .col-xxxl-10, .col-xxxl-11, .col-xxxl-12{
    position: relative;
    min-height: 0.05em;
    width: 100%;
    padding-left: 1.2rem;
    padding-right: 1.2rem;
}

.flex{
    display: flex;
}

.flex-wrap{
    display: flex;
    flex-wrap: wrap;
}

.inline-flex{
    display: inline-flex;
}

.block{
    display: block;
}

.inline-block{
    display: inline-block;
}

.inline{
    display: inline;
}

.none{
    display: none;
}

.relative{
    position: relative;
}

.absolute{
    position: absolute;
}

.fixed{
    position: fixed;
}

.aling-start{
    align-items: flex-start;
}

.align-center{
    align-items: center;
}

.align-end{
    align-items: flex-end;
}

.align-content-start{
    align-content: flex-start;
}

.align-content{
    align-content: center;
}

.align-content-end{
    align-content: flex-end;
}

.justify-center{
    justify-content: center;
}

.justify-start{
    justify-content: flex-start;
}

.justify-between{
    justify-content: space-between;
}

.justify-around{
    justify-content: space-around;
}

.justify-evenly{
    justify-content: space-evenly;
}

.justify-end{
    justify-content: flex-end;
}

.direction-row{
    flex-direction: row;
}

.direction-row-reverse{
    flex-direction: row-reverse;
}

.direction-column{
    flex-direction: column;
}

.direction-column-reverse{
    flex-direction: column-reverse;
}

.text-left{
    text-align: left;
}

.text-center{
    text-align: center;
}

.text-right{
    text-align: right;
}

.pointer{
    cursor: pointer;
}

.black-text{
    color: var(--black-txt-color);
}

.white-text{
    color: var(--white-txt-color);
}

.orange-text{
    color: var(--orange-txt-color);
}

.dark-olive-grey-text{
    color: var(--dark-olive-grey-txt-color);
}

.light-grey-text{
    color: var(--light-grey-txt-color);
}

.black-back{
    background-color: var(--black-back-color);
}

.black-back-2{
    background-color: var(--black-back-color-2);
}

.white-back{
    background-color: var(--white-back-color);
}

.orange-back{
    background-color: var(--orange-back-color);
}

.dark-olive-grey-back{
    background-color: var(--dark-olive-grey-back-color);
}

.light-grey-back{
    background-color: var(--light-grey-back-color);
}

.red-text{
    color: var(--red-txt-color);
}

.transparent-back{
    background-color: var(--transparent-back);
}

.black-border{
    border-color: var(--black-back-color);
}

.white-border{
    border-color: var(--white-back-color);
}

.orange-border{
    border-color: var(--orange-back-color);
}

.dark-olive-grey-border{
    border-color: var(--dark-olive-grey-back-color);
}

.light-grey-border{
    border-color: var(--light-grey-back-color);
}

/* .orange-white-gradient{
    background-image: linear-gradient(to right, hsl(41.08deg 88.1% 50.59%) 5%, hsl(0deg 1% 15% / 0%) 100%);
    background-color: transparent;
}

.white-orange-gradient{
    background-image: linear-gradient(to left, hsl(41.08deg 88.1% 50.59%) 0%, hsl(0 0% 95% / 1) 100%);
    background-color: transparent;
} */

.z-index-5{
    z-index: 5;
}

.overflow, aside{
    transition: all 0.3s ease;
}

.overflow{
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: hsla(0deg 0% 0% / 50%);
    z-index: -1;
    opacity: 0;
}

aside{
    max-width: 300px;
    width: 100%;
    z-index: 999999;
    top: 0;
    bottom: 0;
    left: -100%;
    padding: 1.5em;
}

aside .wrapper-icon svg{
    font-size: 2.5em;
    width: 1em;
}

aside .aside-links{
    margin-top: 3em;
}

aside .aside-links ul li{
    margin-bottom: 1.5em;
}

aside .aside-links ul li:last-child{
    margin-bottom: 0;
}

aside .aside-links ul li a{
    font-size: 1.2em;
}

aside .location p svg, aside .working-time p svg, aside .call-us a svg{
    margin-right: 0.6em;
    width: 1.2em;
}

aside .location, aside .working-time, aside .call-us{
    font-size: 1.1em;
}

aside hr{
    border-bottom: unset;
    border-right: unset;
    border-left: unset;
    border-top: 0.10em solid #e3e3e3;
    margin: 2.5em 0;
}

.aside-info > div{
    margin-bottom: 1.5em;
}

.aside-info > div:last-child{
    margin-bottom: 0;
}

header{
    z-index: 99999;
    top: 0;
    left: 0;
    right: 0;
    transition: all 0.5s ease;
    border-bottom: unset;
}

.top-header{
    padding: 0.7em 0;
    background-color: var(--black-back-color-2);
}

.top-left-header .location{
    margin-right: 1.5em;
}

.top-left-header .location p svg, .top-left-header .working-time p svg{
    margin-right: 0.6em;
}

.top-left-header .location, .top-left-header .working-time, .top-right-header .wrapper-btn{
    font-size: 0.95em;
}

.top-right-header .wrapper-btn{
    margin-top: 0;
}

.top-right-header .wrapper-btn a{
    border: unset;
    padding: 0;
}

.top-right-header .wrapper-btn a svg{
    margin-right: 0.6em;
}

.top-right-header .faq-link{
    margin-left: 2em;
    font-family: "open-sans-semibold", sans-serif;
    line-height: 1.1;
}

.bottom-header{
    padding: 0.7em 0;
}

.bottom-left-header .wrapper-text{
    margin-top: 0;
}

.bottom-left-header .wrapper-text p{
    font-size: 1.8em;
    font-family: "open-sans-medium", sans-serif;
}

.bottom-right-header .navigation-links{
    margin-right: 2em;
}

.bottom-right-header .navigation-links a{
    margin: 0 1em;
    font-size: 1.1em;
    font-family: "open-sans-medium", sans-serif;
}

.bottom-right-header .wrapper-btn{
    margin-top: 0;
}

.bottom-right-header .hamburger svg{
    font-size: 2.5em;
}

.main-section{
    background-image: url(../images/abschleppdienst-wien.jpg);
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: cover;
}

.main-section::after{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    /* background-color: hsl(0, 0%, 0%, 0.1); */
    background-image: linear-gradient(to right, hsl(98deg 0% 5% / 75%) 60%, transparent 130%);
}

.main-section .main-bottom-part{
    width: 100%;
    z-index: 2;
    padding-top: 6em;
    /* background-image: linear-gradient(to top, hsl(0deg 0% 7% / 90%) 55%, transparent 100%); */
}

.main-section .main-bottom-part h1, .main-section .main-bottom-part p, .main-section .main-bottom-part .wrapper-list li{
    text-shadow: 1px 1px 4px #000000;
}

.main-section .main-bottom-part .wrapper-list{
    margin-top: 2.5em;
}

.main-section .main-bottom-part .wrapper-list li{
    margin-bottom: 0.7em;
    font-size: 1.1em;
}

.main-section .main-bottom-part .wrapper-list li:last-child{
    margin-bottom: 0;
}

.main-section .main-bottom-part .wrapper-list li img{
    width: 1.2em;
    margin-right: 0.7em;
}

.main-section .wrapper-btn{
    margin-top: 3em;
}

.main-section .wrapper-btn a, .main-section .wrapper-btn button{
    margin-right: 1em;
    margin-bottom: 1em;
}

.section-assistance, .section-our-support, .section-gallery,
.section-contact, .section-about-us{
    padding: 5em 0;
}

.section-services{
    padding-top: 6em;
    background-color: var(--white-back-color);
}

.section-services .row-title-services,
.section-prices .row-prices-title{
    margin-bottom: 4em;
}

.section-services .col-service{
    width: 100%;
    min-height: 1px;
    position: relative;
    /* padding: 4em 3em 0 3em; */
    overflow: hidden;
    aspect-ratio: 16 / 11.5;
}

.section-services .col-service::before{
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-color: hsl(0deg 0% 7% / 15%);
    z-index: 0;
}

.section-services .col-service-1, .section-services .col-service-2, .section-services .col-service-3{
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.section-services .col-service-1{
    background-image: url("../images/auto-abschleppen.jpg");
}

.section-services .col-service-3{
    background-image: url("../images/abschleppwagen.jpg");
}

.section-services .service-card{
    color: #fff;
    background-color: hsl(0deg 1% 15% / 92%);
    width: 100%;
    opacity: 0;
    transition: all 0.5s ease;
    /* border-top-left-radius: 1.5em;
    border-top-right-radius: 1.5em; */
    /* padding: 2em; */
    /* position: absolute;
    bottom: 0;
    left: 0;
    right: 0; */
}

.section-services .service-card .service-hidden{
    display: none;
    padding-bottom: 0.8em;
}

.section-services .service-card .wrapper-title, .section-services .service-card .wrapper-text, .section-services .service-card .wrapper-btn{
    padding: 1em 1.5em;
}

.section-services .service-card .wrapper-title, .section-services .service-card .wrapper-text{
    text-shadow: 0 0 10px #000000;
}

.section-services .service-card .wrapper-title h3{
    font-size: 1.5em;
}

.section-services .service-card .wrapper-text, .section-services .service-card .wrapper-btn{
    opacity: 0;
    margin: 0;
    transition: all 0.5s ease;
}

.section-services .service-card .wrapper-text{
    padding-top: 0.2em;
}

.section-services .service-card .wrapper-btn{
    padding-top: 0.5em;
}

.section-assistance, .section-our-support{
    background-color: #fbf9f4;
}

.section-assistance .wrapper-content{
    padding-left: 2em;
}

.section-our-support .wrapper-content{
    padding-right: 2em;
}

.section-our-support .wrapper-img{
    right: 0;
}

.section-prices{
    padding: 6em 0;
    background-color: var(--light-grey-back-color);
}

.section-prices .price-card{
    box-shadow: 0 0 1em 0.08em var(--light-grey-back-color);
    border-radius: 0.5em;
    overflow: hidden;
}

.section-prices .price-card .wrp-price:first-child{
    background-color: var(--light-grey-back-color);
}

.section-prices .price-card .wrapper-text{
    margin-top: 0.5em;
}

.section-prices .price-card .wrapper-text p:only-child{
    font-family: "open-sans-medium", sans-serif;
}

.section-prices .wrp-price{
    padding: 1.5em 1em;
}

.section-prices .wrp-price .wrapper-title{
    margin-bottom: 0.8em;
}

.section-prices .wrp-price .wrapper-text{
    margin-top: 0;
}

.section-prices .wrp-price .wrapper-text p{
    margin-bottom: 0.4em;
}

.section-prices .wrp-price .wrapper-text p:last-child{
    margin-bottom: 0;
}

.section-prices .wrp-price .wrapper-btn a span:last-child{
    font-size: 1.15em;
}

.section-contact-us{
    /* background-image: url(../images/schnelles-und-sicheres-abschleppen.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover; */
    padding: 5em 0;
}

/* .section-contact-us::after{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: hsl(0, 0%, 0%, 0.7);
} */

/* .section-contact-us .wrapper-text p{
    text-shadow: 0 0 10px #000000;
} */

.section-faq{
    padding: 6em 0;
}

.section-faq .row-faq-title{
    margin-bottom: 3em;
}

.section-faq .ui.styled.accordion{
    background-color: var(--transparent-back);
}

.section-faq .wrapper-faq .faq-item{
    background-color: var(--white-back-color);
    border-radius: 0.5em;
    margin-bottom: 1.5em;
    box-shadow: 0 0 1em 0.08em #e7e7e7;
}

.section-faq .wrapper-faq .faq-item:last-child{
    margin-bottom: 0;
}

.section-faq .wrapper-faq .faq-item .wrapper-title{
    padding: 1.2em;
}

.section-faq .wrapper-faq .faq-item .wrapper-title h2{
    font-size: 1.2em;
}

.section-faq .wrapper-faq .faq-item .wrapper-title svg{
    right: 1.2em;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1.1em;
}

.section-faq .wrapper-faq .faq-item .wrapper-title h3{
    padding-right: 1.2em;
    font-size: 1.2em;
    font-family: "open-sans-bold", sans-serif;
}

.section-faq .wrapper-faq .faq-item .wrapper-text{
    margin-top: 0;
    padding: 0 1.2em 1.2em;
}

.section-gallery{
    background-color: #f7f6f6;
}

.section-gallery .col-gallery{
    margin-top: 2.4rem;
}

.section-gallery .wrapper-img img{
    border-radius: 0.2em;
}

.section-gallery .col-gallery .wrapper-img .small-img{
    aspect-ratio: 16 / 11;
}

.section-gallery .col-gallery .wrapper-img .large-img{
    aspect-ratio: 16 / 11.3;
}

.section-map iframe{
    width: 100%;
}

.section-contact .row-input-field{
    margin: 0 -0.6rem;
}

.section-contact .col-input-field{
    padding-left: 0.6rem;
    padding-right: 0.6rem;
}

.section-contact .wrapper-text{
    margin-top: 1em;
}

.section-contact .col-contact-item{
    margin-top: 2em;
}

.section-contact .contact-item{
    font-size: 1.1em;
}

.section-contact .contact-item .wrp-icon{
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    box-shadow: 0 0 10px 2px #e5e5e5;
    width: 3em;
    height: 3em;
    background-color: var(--white-back-color);
}

.section-contact .contact-item .wrp-icon svg{
    font-size: 1.3em;
    width: 1em;
}

.section-contact .contact-item .wrapper-email, .section-contact .contact-item .wrapper-phone,
.section-contact .contact-item .wrapper-location, .section-contact .contact-item .wrapper-time{
    margin-left: 1em;
}

.section-contact .contact-item .wrapper-email p:first-child, .section-contact .contact-item .wrapper-phone p:first-child,
.section-contact .contact-item .wrapper-location p:first-child, .section-contact .contact-item .wrapper-time p:first-child{
    margin-bottom: 0.3em;
}

.section-contact .contact-item p:nth-child(2){
    margin-bottom: 0.3em;
    font-size: 1.1em;
}

.section-contact .contact-item p:last-child, .section-contact .contact-item a:last-child{
    font-size: 0.9em;
}

.section-contact .col-form-title{
    margin-bottom: 2.5em;
}

.section-contact .col-form-title .wrapper-title h3{
    font-size: 2.3em;
    font-family: "open-sans-semibold", sans-serif;
}

.section-contact form{
    box-shadow: 0 0 1em 0.08em var(--light-grey-back-color);
    padding: 2em 1.5em;
    border-radius: 0.5em;
}

.section-contact form .input-field{
    margin-top: 1.5em;
}

.section-contact form .input-field label{
    margin-bottom: 0.3em;
    font-size: 0.95em;
    font-family: "open-sans-semibold", sans-serif;
}

.section-contact form .input-field input, .section-contact form .input-field textarea{
    padding: 0.8em;
    border: 0.1em solid var(--light-grey-back-color);
    border-radius: 0.2em;
    font-size: 1em;
}

.section-contact form .input-field input::placeholder, .section-contact form .input-field textarea::placeholder{
    font-size: 0.95em;
    font-family: "open-sans-regular", sans-serif;
}

.section-contact form .input-field input:focus, .section-contact form .input-field textarea:focus{
    outline: none;
}

.section-contact form .input-field textarea{
    height: 8em;
    resize: vertical;
}

.section-breadcrumb{
    background-image: url(../images/breadcrumb-background.jpg);
    background-position: left center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 4em 0 4.5em 0;
}

.section-breadcrumb::after{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: hsl(0, 0%, 0%, 0.7);
}

.section-breadcrumb .wrapper-content .wrapper-title h1,
.section-breadcrumb .wrapper-content .wrapper-text p{
    text-shadow: 1px 1px 4px #000000;
}


.section-breadcrumb .wrapper-content .breadcrumb{
    display: flex;
    align-items: center;
    margin-top: 1.5em;
    background-image: linear-gradient(to right, hsl(41deg 88% 51% / 70%) 0%, hsl(0deg 1% 15% / 0%) 70%);
    padding: 0.5em 1em;
    line-height: 1.7;
    border-radius: 0.4em;
}

.section-breadcrumb .wrapper-content .breadcrumb span{
    margin: 0 0.8em;
}

.section-about-services{
    padding: 4.5em 0 8.5em 0;
    background-color: #f7f6f6;
}

.section-about-services .wrapper-img img{
    width: 50%;
    box-shadow: rgba(0, 0, 0, 0.5) 0px 3px 15px;
    border-radius: 0.5em;
}

.section-about-services .wrapper-img img:first-child{
    transform: translateX(4em) translateY(4em);
}

.section-about-us .wrapper-img{
    padding-right: 2em;
}

.section-about-us .wrapper-img img{
    border-radius: 0.5em;
}

.section-why-we{
    padding: 2em 0 5em 0;
}

.section-why-we .wrapper-card-number{
    box-shadow: 0 0 1em 0.08em var(--light-grey-back-color);
    border-radius: 0.5em;
    padding: 1.5em 1.2em;
    height: 100%;
}

.section-why-we .wrapper-card-number .wrapper-img{
    margin-bottom: 0.5em;
}

.section-why-we .wrapper-card-number .wrapper-img img{
    width: 4.5em;
    margin-left: auto;
    margin-right: auto;
}

.section-why-we .wrapper-card-number .wrapper-title h3{
    font-size: 1.3em;
}

.section-why-we .wrapper-card-number .wrapper-text{
    margin-top: 0.5em;
}

.section-why-we .wrapper-card-number .wrapper-text p{
    font-size: 1em;
}

footer{
    padding: 4em 0 1.5em 0;
}

footer .footer-content .wrapper-title h2{
    font-size: 1.6em;
    font-family: "open-medium", sans-serif;
}

footer .footer-content .wrapper-title h3{
    font-size: 1.1em;
}

footer .footer-content .wrapper-text{
    margin-top: 1em;
}

footer .footer-content .wrapper-list{
    margin-top: 1.3em;
}

footer .footer-content .wrapper-list li{
    margin-bottom: 1.1em;
}

footer .footer-content .wrapper-list li:last-child{
    margin-bottom: 0;
}

footer .footer-content .wrapper-list li p svg, footer .footer-content .wrapper-list li a svg{
    margin-right: 0.8em;
    width: 1.4em;
    height: 1.4em;
    font-size: 0.6em;
    padding: 0.6em;
    border-radius: 50%;
}

footer .footer-content .social-media{
    margin-top: 1em;
}

footer .footer-content .social-media a{
    font-size: 1.1em;
    margin-right: 0.4em;
    width: 2.1em;
    height: 2.1em;
    border-radius: 50%;
    border-width: 0.07em;
    border-style: solid;
}

footer .footer-address, footer .footer-other-col{
    display: flex;
    flex-direction: column;
}

footer .footer-address .footer-content .wrapper-list li a,
footer .footer-address .footer-content .wrapper-list li p{
    display: inline-flex;
    align-items: center;
    line-height: 1.1;
}

footer .col-copyright{
    margin-top: 3.5em;
}

footer .col-copyright .wrapper-copyright{
    border-top: 0.07em solid #e7e7e7;
    padding-top: 1.5em;
}

footer .fixed-phone-btn, footer .scroll-to-top{
    width: 3em;
    height: 3em;
    right: 2em;
    border-radius: 50%;
    z-index: 999991;
}

footer .fixed-phone-btn{
    bottom: 5.7em;
}

footer .scroll-to-top{
    bottom: 2em;
}

footer .fixed-phone-btn svg, footer .scroll-to-top svg{
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

footer .fixed-phone-btn svg{
    font-size: 1.2em;
}

footer .scroll-to-top svg{
    font-size: 1.7em;
}

@media screen and (min-width: 100px){
    html{
        font-size: calc(var(--font-size) - 3px);
    }
    .bottom-right-header .hamburger svg{
        display: block;
    }
    .col-xs-1{
        max-width: 8.33%;
        flex-basis: 8.33%;
    }
    .col-xs-2{
        max-width: 16.66%;
        flex-basis: 16.66%;
    }
    .col-xs-3{
        max-width: 25%;
        flex-basis: 25%;
    }
    .col-xs-4{
        max-width: 33.33%;
        flex-basis: 33.33%;
    }
    .col-xs-5{
        max-width: 41.66%;
        flex-basis: 41.66%;
    }
    .col-xs-6{
        max-width: 50%;
        flex-basis: 50%;
    }
    .col-xs-7{
        max-width: 58.33%;
        flex-basis: 58.33%;
    }
    .col-xs-8{
        max-width: 66.66%;
        flex-basis: 66.66%;
    }
    .col-xs-9{
        max-width: 75%;
        flex-basis: 75%;
    }
    .col-xs-10{
        max-width: 83.33%;
        flex-basis: 83.33%;
    }
    .col-xs-11{
        max-width: 91.66%;
        flex-basis: 91.66%;
    }
    .col-xs-12{
        max-width: 100%;
        flex-basis: 100%;
    }
    .section-services .col-service{
        flex-basis: 100%;
        max-width: 100%;
    }
}

@media screen and (min-width: 576px){
    html{
        font-size: calc(var(--font-size) - 1.5px);
    }
    .container{
        max-width: 560px;
    }
    .container-2{
        max-width: 560px;
    }
    .col-sm-1{
        max-width: 8.33%;
        flex-basis: 8.33%;
    }
    .col-sm-2{
        max-width: 16.66%;
        flex-basis: 16.66%;
    }
    .col-sm-3{
        max-width: 25%;
        flex-basis: 25%;
    }
    .col-sm-4{
        max-width: 33.33%;
        flex-basis: 33.33%;
    }
    .col-sm-5{
        max-width: 41.66%;
        flex-basis: 41.66%;
    }
    .col-sm-6{
        max-width: 50%;
        flex-basis: 50%;
    }
    .col-sm-7{
        max-width: 58.33%;
        flex-basis: 58.33%;
    }
    .col-sm-8{
        max-width: 66.66%;
        flex-basis: 66.66%;
    }
    .col-sm-9{
        max-width: 75%;
        flex-basis: 75%;
    }
    .col-sm-10{
        max-width: 83.33%;
        flex-basis: 83.33%;
    }
    .col-sm-11{
        max-width: 91.66%;
        flex-basis: 91.66%;
    }
    .col-sm-12{
        max-width: 100%;
        flex-basis: 100%;
    }
}

@media screen and (min-width: 768px){
    html{
        font-size: var(--font-size);
    }
    .container{
        max-width: 740px;
    }
    .container-2{
        max-width: 740px;
    }
    .col-md-1{
        max-width: 8.33%;
        flex-basis: 8.33%;
    }
    .col-md-2{
        max-width: 16.66%;
        flex-basis: 16.66%;
    }
    .col-md-3{
        max-width: 25%;
        flex-basis: 25%;
    }
    .col-md-4{
        max-width: 33.33%;
        flex-basis: 33.33%;
    }
    .col-md-5{
        max-width: 41.66%;
        flex-basis: 41.66%;
    }
    .col-md-6{
        max-width: 50%;
        flex-basis: 50%;
    }
    .col-md-7{
        max-width: 58.33%;
        flex-basis: 58.33%;
    }
    .col-md-8{
        max-width: 66.66%;
        flex-basis: 66.66%;
    }
    .col-md-9{
        max-width: 75%;
        flex-basis: 75%;
    }
    .col-md-10{
        max-width: 83.33%;
        flex-basis: 83.33%;
    }
    .col-md-11{
        max-width: 91.66%;
        flex-basis: 91.66%;
    }
    .col-md-12{
        max-width: 100%;
        flex-basis: 100%;
    }
}

@media screen and (min-width: 992px){
    html{
        font-size: calc(var(--font-size) - 5.2px);
    }
    .bottom-right-header .hamburger svg{
        display: none;
    }
    .container{
        max-width: 930px;
    }
    .container-2{
        max-width: 980px;
    }
    .col-lg-1{
        max-width: 8.33%;
        flex-basis: 8.33%;
    }
    .col-lg-2{
        max-width: 16.66%;
        flex-basis: 16.66%;
    }
    .col-lg-3{
        max-width: 25%;
        flex-basis: 25%;
    }
    .col-lg-4{
        max-width: 33.33%;
        flex-basis: 33.33%;
    }
    .col-lg-5{
        max-width: 41.66%;
        flex-basis: 41.66%;
    }
    .col-lg-6{
        max-width: 50%;
        flex-basis: 50%;
    }
    .col-lg-7{
        max-width: 58.33%;
        flex-basis: 58.33%;
    }
    .col-lg-8{
        max-width: 66.66%;
        flex-basis: 66.66%;
    }
    .col-lg-9{
        max-width: 75%;
        flex-basis: 75%;
    }
    .col-lg-10{
        max-width: 83.33%;
        flex-basis: 83.33%;
    }
    .col-lg-11{
        max-width: 91.66%;
        flex-basis: 91.66%;
    }
    .col-lg-12{
        max-width: 100%;
        flex-basis: 100%;
    }
    .section-services .col-service{
        flex-basis: 33.33%;
        max-width: 33.33%;
    }
}

@media screen and (min-width: 1200px){
    html{
        font-size: calc(var(--font-size) - 4px);
    }
    .container{
        max-width: 1100px;
    }
    .container-2{
        max-width: 1150px;
    }
    .col-xl-1{
        max-width: 8.33%;
        flex-basis: 8.33%;
    }
    .col-xl-2{
        max-width: 16.66%;
        flex-basis: 16.66%;
    }
    .col-xl-3{
        max-width: 25%;
        flex-basis: 25%;
    }
    .col-xl-4{
        max-width: 33.33%;
        flex-basis: 33.33%;
    }
    .col-xl-5{
        max-width: 41.66%;
        flex-basis: 41.66%;
    }
    .col-xl-6{
        max-width: 50%;
        flex-basis: 50%;
    }
    .col-xl-7{
        max-width: 58.33%;
        flex-basis: 58.33%;
    }
    .col-xl-8{
        max-width: 66.66%;
        flex-basis: 66.66%;
    }
    .col-xl-9{
        max-width: 75%;
        flex-basis: 75%;
    }
    .col-xl-10{
        max-width: 83.33%;
        flex-basis: 83.33%;
    }
    .col-xl-11{
        max-width: 91.66%;
        flex-basis: 91.66%;
    }
    .col-xl-12{
        max-width: 100%;
        flex-basis: 100%;
    }
    .section-services .col-service{
        flex-basis: 33.33%;
        max-width: 33.33%;
    }
}

@media screen and (min-width: 1440px){
    html{
        font-size: calc(var(--font-size) - 2px);
    }
    .container{
        max-width: 1250px;
    }
    .container-2{
        max-width: 1350px;
    }
    .col-xxl-1{
        max-width: 8.33%;
        flex-basis: 8.33%;
    }
    .col-xxl-2{
        max-width: 16.66%;
        flex-basis: 16.66%;
    }
    .col-xxl-3{
        max-width: 25%;
        flex-basis: 25%;
    }
    .col-xxl-4{
        max-width: 33.33%;
        flex-basis: 33.33%;
    }
    .col-xxl-5{
        max-width: 41.66%;
        flex-basis: 41.66%;
    }
    .col-xxl-6{
        max-width: 50%;
        flex-basis: 50%;
    }
    .col-xxl-7{
        max-width: 58.33%;
        flex-basis: 58.33%;
    }
    .col-xxl-8{
        max-width: 66.66%;
        flex-basis: 66.66%;
    }
    .col-xxl-9{
        max-width: 75%;
        flex-basis: 75%;
    }
    .col-xxl-10{
        max-width: 83.33%;
        flex-basis: 83.33%;
    }
    .col-xxl-11{
        max-width: 91.66%;
        flex-basis: 91.66%;
    }
    .col-xxl-12{
        max-width: 100%;
        flex-basis: 100%;
    }
    .section-services .col-service{
        flex-basis: 33.33%;
        max-width: 33.33%;
    }
}

@media screen and (min-width: 1920px){
    html{
        font-size: var(--font-size);
    }
    .container{
        max-width: 1420px;
    }
    .container-2{
        max-width: 1800px;
    }
    .col-xxxl-1{
        max-width: 8.33%;
        flex-basis: 8.33%;
    }
    .col-xxxl-2{
        max-width: 16.66%;
        flex-basis: 16.66%;
    }
    .col-xxxl-3{
        max-width: 25%;
        flex-basis: 25%;
    }
    .col-xxxl-4{
        max-width: 33.33%;
        flex-basis: 33.33%;
    }
    .col-xxxl-5{
        max-width: 41.66%;
        flex-basis: 41.66%;
    }
    .col-xxxl-6{
        max-width: 50%;
        flex-basis: 50%;
    }
    .col-xxxl-7{
        max-width: 58.33%;
        flex-basis: 58.33%;
    }
    .col-xxxl-8{
        max-width: 66.66%;
        flex-basis: 66.66%;
    }
    .col-xxxl-9{
        max-width: 75%;
        flex-basis: 75%;
    }
    .col-xxxl-10{
        max-width: 83.33%;
        flex-basis: 83.33%;
    }
    .col-xxxl-11{
        max-width: 91.66%;
        flex-basis: 91.66%;
    }
    .col-xxxl-12{
        max-width: 100%;
        flex-basis: 100%;
    }
    .section-services .col-service{
        flex-basis: 33.33%;
        max-width: 33.33%;
    }
}

@media screen and (max-width: 1439px){
    .section-assistance .wrapper-content{
        padding-left: 2em;
    }
}

@media screen and (max-width: 1199px){
    .section-our-support .wrapper-content{
        padding-right: 2em;
    }
}

@media screen and (max-width: 991px) and (orientation: portrait){
    .main-section{
        height: 93vh;
    }
    /*.main-section .main-bottom-part{*/
    /*    padding-bottom: 5em;*/
    /*}*/
}

@media screen and (max-width: 991px){
    .top-right-header .wrapper-btn{
        display: none;
    }
    .wrapper-title h1{
        font-size: 2.6em;
    }
    .bottom-right-header .navigation-links{
        display: none;
    }
    .bottom-right-header .hamburger{
        margin-left: 1.5em;
    }
    .section-prices .col-prices-1, .section-prices .col-prices-2, .footer-main-col, .footer-address{
        margin-bottom: 3em;
    }
    .section-prices .row-prices{
        justify-content: center;
    }
    .section-about-services .col-about-services{
        margin-bottom: 5em;
    }
    .section-about-services .wrapper-img img:first-child{
        transform: translateX(0) translateY(3em);
        width: 55%;
    }
    .section-about-services .wrapper-img img:last-child{
        transform: translateX(-4.8em);
        width: 55%;
    }
    .section-assistance{
        padding-top: 0;
    }
    .section-assistance .wrapper-img{
        position: static;
        width: 100%;
        padding-bottom: 4.5em;
    }
    .section-assistance .row-assistance{
        justify-content: flex-start;
    }
    .section-assistance .wrapper-content{
        padding-left: 0;
    }
    .section-our-support .wrapper-content{
        padding-right: 0;
    }
    .section-our-support{
        display: flex;
        flex-wrap: wrap;
        padding-top: 0;
    }
    .section-our-support .container-2{
        order: 2;
    }
    .section-our-support .wrapper-img{
        position: static;
        width: 100%;
        order: 1;
        padding-bottom: 4.5em;
    }
    .section-about-us .col-about-us-img{
        margin-top: 3.5em;
    }
    .section-about-us .wrapper-img{
        padding-right: 0;
    }
    .section-why-we .col-number-1, .section-why-we .col-number-2{
        margin-bottom: 2em;
    }
    .section-contact .row-contact-wrapper{
        justify-content: flex-start;
    }
    .section-contact .col-contact-form{
        margin-top: 4em;
    }
    footer .footer-row{
        justify-content: space-between;
    }
    footer .footer-address{
        align-items: flex-start;
    }
}

@media screen and (max-width: 767px){
    .top-left-header .location, .top-right-header .wrapper-btn{
        display: none;
    }
    .wrapper-title h1{
        font-size: 2.4em;
    }
    .wrapper-title h2{
        font-size: 2.1em;
    }
    /* .main-section .main-bottom-part .wrapper-list{
        flex-wrap: wrap;
        margin-right: 0;
    }
    .main-section .main-bottom-part .wrapper-list li{
        margin-bottom: 1em;
        width: 50%;
        margin-right: 0;
        padding-right: 1em;
    } */
    footer .footer-navigation{
        margin-bottom: 3em;
    }
    footer .col-copyright .wrapper-copyright{
        text-align: left;
    }
}

@media screen and (max-width: 575px){
    .wrapper-text p{
        font-size: 1.05em;
    }
    .bottom-right-header .wrapper-btn a{
        padding: 0;
    }
    .bottom-right-header .wrapper-btn a span{
        background-color: var(--orange-back-color);
    }
    .bottom-right-header .wrapper-btn a span svg{
        color: var(--white-txt-color);
    }
    .bottom-right-header .wrapper-btn a span:first-child{
        margin-right: 0;
    }
    .bottom-right-header .wrapper-btn a span:last-child{
        display: none;
    }
    .wrapper-title h1{
        font-size: 2.3em;
    }
    .wrapper-title h2{
        font-size: 1.9em;
    }
    .section-about-services .wrapper-img img:last-child{
        transform: translateX(-2.9em);
    }
    .section-why-we .row{
        justify-content: center;
    }
    footer .footer-address, footer .footer-navigation, footer .footer-other-col{
        font-size: 1.1em;
    }
}


@media screen and (max-width: 500px){
    .section-why-we .col-number-1, .section-why-we .col-number-2, .section-why-we .col-number-3, .section-why-we .col-number-4{
        flex-basis: 75%;
        max-width: 75%;
    }
    .section-why-we .col-number-3{
        margin-bottom: 2em;
    }
}

@media screen and (max-width: 400px){
    html{
        font-size: calc(var(--font-size) - 4px);
    }
}

@media screen and (max-width: 380px){
    html{
        font-size: calc(var(--font-size) - 5px);
    }
}

@media screen and (max-width: 360px){
    html{
        font-size: calc(var(--font-size) - 4.3px);
    }
}