/* ---------------- Fonts ------------------ */

@font-face {
    font-family: 'TT Commons';
    src: url('../fonts/TTCommons-DemiBoldItalic.ttf') format('truetype');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'TT Commons';
    src: url('../fonts/TTCommons-DemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'TT Commons';
    src: url('../fonts/TTCommons-ExtraBoldItalic.ttf') format('truetype');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'TT Commons';
    src: url('../fonts/TTCommons-ExtraLightItalic.ttf') format('truetype');
    font-weight: 200;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'TT Commons';
    src: url('../fonts/TTCommons-ExtraBold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'TT Commons';
    src: url('../fonts/TTCommons-ExtraLight.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'TT Commons';
    src: url('../fonts/TTCommons-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'TT Commons';
    src: url('../fonts/TTCommons-LightItalic.ttf') format('truetype');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'TT Commons';
    src: url('../fonts/TTCommons-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'TT Commons';
    src: url('../fonts/TTCommons-MediumItalic.ttf') format('truetype');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'TT Commons';
    src: url('../fonts/TTCommons-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'TT Commons';
    src: url('../fonts/TTCommons-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'TT Commons';
    src: url('../fonts/TTCommons-ThinItalic.ttf') format('truetype');
    font-weight: 100;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'TT Commons';
    src: url('../fonts/TTCommons-Thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'TT Commons';
    src: url('../fonts/TTCommons-BlackItalic.ttf') format('truetype');
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'TT Commons';
    src: url('../fonts/TTCommons-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'TT Commons';
    src: url('../fonts/TTCommons-BoldItalic.ttf') format('truetype');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'TT Commons';
    src: url('../fonts/TTCommons-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}



/* ---------------- Basic css ------------------ */

html{
	font-size: 62.5%;
}

:root {
	scroll-behavior: unset;

	/* Font Family */
	--bodyFont: 'TT Commons';

	/* Colors */
	--black: #000000;
	--dark: #0F1921;
	--yellow: #FFD600;
	--white: #ffffff;
	--gary-100: #F5F5F5;
	--gary-200: #F0F0F0;
	--gary-300: #D5D5D5;
}

html,
body,
div,
span,
h1,
h2,
h3,
h4,
h5,
h6,
p,
a,
strong,
i,
ol,
ul,
li,
form,
label,
footer,
header,
menu,
nav,
section {
	margin: 0;
	padding: 0;
}

ol,
ul {
	list-style: none;
}

a{
	text-decoration: none;
	-webkit-transition: 200ms;
	-o-transition: 200ms;
	transition: 200ms;
	color: inherit;
}

button:focus,
a:focus,
input:focus,
textarea:focus {
	outline: none;
}

/* body */
body {
	color: var(--black);
	font-family: var(--bodyFont);
	font-size: 2.8rem;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	letter-spacing: 0.5px;
}

/* container */
.container{
	padding-left: 1.5rem;
	padding-right: 1.5rem;
}


/* Title */
h1, h2, h3, h4, h5, h6{
	color: var(--dark);
	font-family: var(--bodyFont);
	font-weight: 700;
	letter-spacing: 0.5px;
	line-height: normal;
}

.title_xl{
	font-size: 7rem;
}

.title_lg{
	font-size: 6rem;
}

.title_md{
	font-size: 4rem;
}

.title_sm{
	font-size: 3.2rem;
}


/* Button */

.button{
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	gap: 0 1rem;
	font-size: 2.6rem;
	font-weight: 600;
	font-family: var(--bodyFont);
	line-height: normal;
	-webkit-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	transition: all 300ms ease;
	border: none;
	border-radius: 10rem;
	padding: 1.4rem 3rem 1.5rem 3rem;
	color: var(--black);
	background-color: var(--yellow);
	letter-spacing: 0;
}

.button:hover{
	color: var(--black);
	background: var(--gary-300);
}

.button span{
	display: inline-block;
	-webkit-transform: translateY(-.17rem);
	    -ms-transform: translateY(-.17rem);
	        transform: translateY(-.17rem);
}

.button_arrow{
	width: 1rem;
	-webkit-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	transition: all 300ms ease;
}

.button:hover .button_arrow{
	-webkit-transform: translateX(.6rem);
	    -ms-transform: translateX(.6rem);
	        transform: translateX(.6rem);
}

.button_secondary{
	background: var(--gary-300);
}

.button_secondary:hover{
	background: var(--yellow);
}

.button_white{
	background: var(--white);
}

.button_white:hover{
	background: var(--gary-300);
}



/* ---------------- Site Header ------------------ */

.site_header {
	position: sticky;
	top: 0;
	left: 0;
	z-index: 1024;
	width: 100%;
	padding: 2rem 0;
	background: var(--white);
}

/*sticky*/
.site_header.sticky {
    -webkit-animation: 500ms ease-in-out 0s normal none 1 running fadeInDown;
            animation: 500ms ease-in-out 0s normal none 1 running fadeInDown;
    -webkit-box-shadow: 0 .2rem .5rem 0 rgba(0, 0, 0, .05);
            box-shadow: 0 .2rem .5rem 0 rgba(0, 0, 0, .05);
}

.site_logo{
	display: block;
	width: 13.5rem;
}

/* menu */
.menu {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	gap: 3rem;
	margin-right: 3rem;
}

.menu li a {
	color: var(--black);
	font-size: 2.4rem;
	font-weight: 500;
	line-height: 1;
}

.menu li a:hover{
	color: var(--yellow);
}


/* Hamburgermenu */

.Hamburgermenu{
	padding: 0;
	border: none;
	background: transparent;
	width: 2.4rem;
}

.Hamburgermenu img{
	width: 100%;
}

.Hamburgermenu img:nth-child(2){
	display: none;
}

.Hamburgermenu.active img:nth-child(1){
	display: none;
}

.Hamburgermenu.active img:nth-child(2){
	display: block;
}

/* Mobile Menu */

.mobileMenu{
	position: fixed;
	top: 8.7rem;
	left: -105vw;
	width: 100vw;
	height: calc(100vh - 8.7rem);
	overflow: auto;
	background: #303030;
	z-index: -1;
	text-align: left;
	padding: 5rem 0;
	-webkit-transition: 300ms ease;
	-o-transition: 300ms ease;
	transition: 300ms ease;
}

.mobileMenu.show{
	left: 0;
}

.mobileMenu .container>div{
	padding-bottom: 5rem;
}

.mobileMenu h5{
	color: var(--yellow);
	font-size: 2.6rem;
	line-height: 177%;
}

.mobileMenu ul li a{
	color: var(--white);
	font-size: 2.6rem;
	line-height: 177%;
	font-weight: 400;
}

/* ---------------- Hero Section ------------------ */

.banner_inner_section{
	position: relative;
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: (1fr)[2];
	grid-template-columns: repeat(2, 1fr);
	/* max-width: 1440px; */
	margin-left: auto;
	margin-right: auto;
}

.banner_img{
	width: 100%;
}

.banner_content{
	background-color: #0F1921;
	padding: 10rem 6.2rem;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
}

.bg_img{
	background-size: cover !important;
	background-repeat: no-repeat !important;
	background-position: center !important;
}

.banner_content_inner{
	max-width: 56.5rem;
}

.banner_item.overlay{
	position: relative;
}

.banner_item.overlay::before{
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: #0F1921;
	opacity: .7;
}

.banner_content .title_xl{
	color: var(--yellow);
	padding-bottom: 5rem;
}

.banner_content p{
	color: var(--white);
	padding-bottom: 1.5rem;
}

.banner_content ul{
	padding-left: 2.5rem;
}

.banner_content ul li{
	color: var(--white);
	list-style: disc;
	font-weight: 300;
}

.banner_content ul li:not(:last-child){
	padding-bottom: 1.5rem;
}

.banner_content ul li::marker{
	color: var(--yellow);
}

.banner_content .button{
	margin-top: 4.5rem;
}

.scroll_down{
	position: absolute;
	left: 50%;
	-webkit-transform: translateX(-50%);
	    -ms-transform: translateX(-50%);
	        transform: translateX(-50%);
	bottom: -3rem;
	width: 6rem;
	height: 6rem;
	border-radius: 50%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	background: var(--gary-300);
	z-index: 2;
}

.scroll_down:hover{
	background: var(--yellow);
}

.scroll_down img{
	width: 1.6rem;
}


/* Slider */

.heroSlider .owl-stage{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.heroSlider .item{
	height: 100%;
}

.heroSlider .banner_item{
	height: 100%;
}

.heroSlider .banner_img{
	height: 100%;
	-o-object-fit: cover;
	   object-fit: cover;
} 




/* ---------------- About Section ------------------ */

.about_section{
	padding: 16.5rem 0 10.5rem;
}

.about_section .title_box{
	max-width: 95.6rem;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

.about_section .title_box .title_xl{
	padding-bottom: 4rem;
}

.about_section .separator{
	width: 12.5rem;
	height: 0.5rem;
	background: var(--yellow);
	margin-left: auto;
	margin-right: auto;
	margin-top: 6rem;
	margin-bottom: 10rem;
}

.about_section .row{
	--bs-gutter-x: 2.3rem;
	--bs-gutter-y: 2rem;
}

/* icon box */

.icon_box{
	background: var(--gary-200);
	text-align: center;
	padding: 3.5rem 1rem 5rem 1rem;
	-webkit-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	transition: all 300ms ease;
}

.icon_box:hover{
	-webkit-transform: translateY(-1rem);
	    -ms-transform: translateY(-1rem);
	        transform: translateY(-1rem);
}

.icon_box.bg_yellow{
	background: var(--yellow);
}

.icon_box .icon{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-webkit-box-align: end;
	    -ms-flex-align: end;
	        align-items: end;
	height: 10rem;
}

.herkeuring_icon{
	width: 7.8rem;
}

.reconditionering_icon{
	width: 7.8rem;
}

.vernietiging_icon{
	width: 7rem;
}

.icon_box .title_md{
	padding: 1.7rem 0 2.5rem;
}

.icon_box p{
	font-size: 2.2rem;
}

.icon_box .button{
	padding: 1rem 2rem;
	font-size: 1.7rem;
	gap: .7rem;
	margin-top: 3.5rem;
}

.icon_box .button:hover{
	background: var(--yellow);
}

.icon_box.bg_yellow .button:hover{
	background: #D5D5D5;
}

.icon_box .button span {
	-webkit-transform: translateY(-.1rem);
	    -ms-transform: translateY(-.1rem);
	        transform: translateY(-.1rem);
}

.icon_box .button_arrow{
	width: 0.6rem;
}



/* ---------------- Info Section ------------------ */

.info_section{
	position: relative;
	padding: 16rem 0rem;
}

.info_section .bg{
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
	background: var(--gary-200);
	width: 100%;
	height: 67rem;
	z-index: -1;
}

.info_section .bg::before{
	content: '';
	position: absolute;
	left: 50%;
	top: 50%;
	-webkit-transform: translate(-50%, -50%);
	    -ms-transform: translate(-50%, -50%);
	        transform: translate(-50%, -50%);
	width: 72rem;
	height: 72rem;
	background: -o-radial-gradient(50% 50%, 50% 50%, rgba(138, 138, 138, 0.60) 0%, rgba(240, 240, 240, 0.00) 100%), -o-radial-gradient(50% 50%, 50% 50%, rgba(138, 138, 138, 0.60) 0%, rgba(240, 240, 240, 0.00) 100%);
	background: radial-gradient(50% 50% at 50% 50%, rgba(138, 138, 138, 0.60) 0%, rgba(240, 240, 240, 0.00) 100%), radial-gradient(50% 50% at 50% 50%, rgba(138, 138, 138, 0.60) 0%, rgba(240, 240, 240, 0.00) 100%);
}

/* img box */

.img_box{
	background: var(--white);
}

.img_box .box_body{
	padding: 3.3rem 3.5rem 3.5rem 3.5rem;
}

.img_box .title_md{
	line-height: 1;
	padding-bottom: 1rem;
}

.box_img{
	overflow: hidden;
}

.box_img img{
	-webkit-transition: 300ms ease;
	-o-transition: 300ms ease;
	transition: 300ms ease;
}

.img_box:hover .box_img img{
	-webkit-transform: scale(1.1);
	    -ms-transform: scale(1.1);
	        transform: scale(1.1);
}

/* owl dots */
.owl-dots{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	gap: 1.6rem;
	margin-top: 2.9rem;
	width: calc(100% + 20rem);
}

.owl-dot{
	padding: 0;
	width: 1.4rem;
	height: 1.4rem;
	border-radius: 50%;
	background: #444444;
	opacity: .3;
}

.owl-dot.active{
	opacity: 1;
}



/* ---------------- FAQ Section ------------------ */

.faq_section{
	padding: 10rem 0rem 30rem;
	overflow: hidden;
}

.faq_banner_img{
	width: 100%;
	margin-top: 3rem;
}

.faq_section .row{
	--bs-gutter-x: 8rem;
}

.faq_wrapper{
	position: relative;
	background: var(--yellow);
	padding: 4rem;
	padding-bottom: 17.5rem;
	margin-top: -27rem;
}

.faq_wrapper .title_sm{
	padding: 2.5rem 0 2.2rem;
}

.faq_wrapper .bottle{
	position: absolute;
	right: 4.3rem;
	bottom: -14.7rem;
	width: 31.8rem;
}

.accordion-item{
	padding: 1.4rem 0 1.6rem;
	border: none;
	border-bottom: 1px solid rgba(0, 0, 0, 0.15);
	background: transparent;
	border-radius: 0 !important;
}

.accordion-item:first-child{
	border-top: 1px solid rgba(0, 0, 0, 0.15);
}

.accordion_button{
	position: relative;
	display: block;
	width: 100%;
	padding: 0;
	padding-right: 2rem;
	background: transparent;
	border: none;
	text-align: left;
	font-weight: 700;
	font-size: 2rem;
	line-height: 132%;
	color: var(--black);
}

.accordion_button::after{
	content: '';
	position: absolute;
	right: 0;
	top: .2rem;
	width: 2.4rem;
	height: 2.4rem;
	background: url(../img/icon-plus.svg) no-repeat center;
	background-size: 100% 100%;
}

.accordion_button:not(.collapsed):after{
	background: url(../img/icon-minus.svg) no-repeat center;
	background-size: 100% 100%;
}

.accordion_content{
	font-size: 2rem;
	font-weight: 500;
	line-height: 132%; 
	padding-top: 1.6rem;
}


.faq_info_content{
	padding-top: 5rem;
}

.faq_info_content p{
	padding-top: 2rem;
}




/* ---------------- Service Section ------------------ */

.service_section {
	overflow: hidden;	
}

.service_section_inner{
	max-width: 1440px;
	margin-left: auto;
	margin-right: auto;
}

.service_content_box{
	max-width: 52.6rem;
	margin: 5rem;
}

.service_content_box .txt{
	padding: 4rem 0 3.4rem;
}

.check_list_group li{
	background: url(../img/checkmark-green.svg) no-repeat left .4rem;
	background-size: 2.4rem;
	padding-left: 3.5rem;
	margin-top: 1rem;
}

.service_img{
	width: 100%;
	min-height: 65rem;
	-o-object-fit: cover;
	   object-fit: cover;
}



/* ---------------- Contact Section ------------------ */

.contact_section{
	background: #F5F5F5;
	padding: 28rem 0 18rem;
}

.contact_section .title_box{
	padding-bottom: 5.5rem;
}

.contact_section .title_box .title_xl{
	padding-bottom: 0.5rem;
}

.contact_section .title_sm{
	font-size: 3rem;
	color: #444;
}

.form_group{
	padding-bottom: 2rem;
}

.label{
	display: block;
	font-size: 2rem;
	font-weight: 700;
	line-height: 160%;
	color: #444;
}


.desiredService_group{
	padding-bottom: 5rem;
}

.desiredService_group .label{
	padding-bottom: 1rem;
}


/* radio */

.radiobox:not(:last-child){
	padding-bottom: 2.2rem;
}

.radio{
	position: relative;
	-webkit-user-select: none;
	   -moz-user-select: none;
	    -ms-user-select: none;
	        user-select: none;
	padding-left: 4.4rem;
	cursor: pointer;
	font-size: 2.2rem;
	color: #444444;
}

.radio input{
	display: none;
}

.radio input + .icon_mark{
	position: absolute;
	top: 0;
	left: 0;
	width: 2.8rem;
	height: 2.8rem;
	border-radius: 50%;
	outline: .1rem solid #B5BBC6;
	border: .4rem solid #ffffff;
	background: #FFF;
}

.radio input:checked + .icon_mark{
	background: #71D38E;
}


/* Input */

.input_box{
	width: 100%;
	height: 6rem;
	border-radius: 1rem;
	border: 1px solid rgba(9, 30, 66, 0.30);
	background-color: #FFF;
	padding: 0 1.2rem;
	font-size: 2.2rem;
	font-family: var(--bodyFont);
	font-weight: 400;
	color: #444444;
	-webkit-transition: 200ms;
	-o-transition: 200ms;
	transition: 200ms;
}

.input_box::-webkit-input-placeholder{
	opacity: 1;
	color: #939393;
}

.input_box::-moz-placeholder{
	opacity: 1;
	color: #939393;
}

.input_box:-ms-input-placeholder{
	opacity: 1;
	color: #939393;
}

.input_box::-ms-input-placeholder{
	opacity: 1;
	color: #939393;
}

.input_box::placeholder{
	opacity: 1;
	color: #939393;
}

.input_box:focus{
	border-color: var(--yellow);
}


/* Select */

.select_box{
	-webkit-appearance: none;
	background-image: url(../img/arrow-selectbox.svg);
	background-repeat: no-repeat;
	background-position: calc(100% - 1.8rem) center;
	background-size: 2.4rem;
	outline: none;
	line-height: 5.5rem;
}

.select_box .list{
	width: 100%;
	box-shadow: none;
	border: 1px solid var(--yellow);
}

.nice-select::after{
	display: none;
}


.contact_form .row{
	--bs-gutter-x: 2.5rem;
}

.captcha_wrapper{
	padding: 3rem 0 5rem;
}

.captcha_wrapper .title_sm{
	padding-bottom: 1.3rem;
}




/* drag zone wrapper */

.drop_zone_wrapper{
	padding-top: 4.5rem;
	padding-bottom: 7.5rem;
}

.drop_zone_wrapper .title_sm{
	padding-bottom: 1.4rem;
}

.drop-zone {
    width: 100%;
    height: 27rem;
    border: 1px dashed #666;
    border-radius: 1rem;
	background: var(--white);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    -webkit-transition: background-color 0.3s;
    -o-transition: background-color 0.3s;
    transition: background-color 0.3s;
    cursor: pointer;
    margin-bottom: 2.7rem;
	-webkit-transition: 200ms;
	-o-transition: 200ms;
	transition: 200ms;
}

.drop-zone.dragging{
	border-color: var(--yellow);
}

.generic_icon{
	width: 3.6rem;
}

.drop-zone-inner p{
	color: #444444;
	font-size: 2.2rem;
	line-height: 145%;
	padding: .5rem 0 1rem;
}

.drop_btn{
	display: inline-block;
	color: var(--black);
	font-weight: 700;
	font-size: 1.7rem;
	line-height: normal;
	padding: 1rem 1.8rem;
	border-radius: 6.8rem;
	border: 1px solid var(--black);
	-webkit-transition: 200ms;
	-o-transition: 200ms;
	transition: 200ms;
}

.drop-zone:hover .drop_btn,
.drop-zone.dragging .drop_btn{
	background: var(--yellow);
	border-color: var(--yellow);
}

.drop-zone-inner .line{
	width: 56.5rem;
	height: 1.7rem;
	border-radius: 10rem;
	margin: auto;
	margin-top: 3rem;
	background: var(--gary-100);
}


/* Image grid */

.image-grid {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 2.4rem 1fr 2.4rem 1fr 2.4rem 1fr;
    grid-template-columns: repeat(4, 1fr);
    gap: 2.4rem;
}

.image-container {
    width: 100%;
    height: 22.4rem;
    background-color: rgba(217, 217, 217, 0.30);
	background-image: url(../img/picture.svg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 3.1rem;
    border-radius: 1rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    position: relative;
	overflow: hidden;
}

.image-container img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
}

.delete-button {
    position: absolute;
    bottom: 1rem;
    right: 1rem;
	background: var(--white);
    border: none;
    border-radius: 50%;
    width: 2.7rem;
    height: 2.7rem;
    display: none;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
}

.delete-button:hover{
	background: #f1f1f1;
}

.delete-button img{
	width: 1.4rem;
	height: 1.7rem;
}

.image-container img + .delete-button {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}




/* ---------------- Site Footer ------------------ */

.footer_widgets{
	padding: 7.8rem 0 4.7rem;
	background: #303030;
}

.footer_widget h5{
	font-size: 2.4rem;
	font-weight: 700;
	color: var(--white);
	line-height: normal;
	padding-bottom: 1.7rem;
}

.footer_widget li{
	line-height: 1;
	color: var(--white);
}

.footer_widget p,
.footer_widget a{
	color: var(--white);
	font-size: 1.8rem;
	line-height: 177%;
}

.footer_widget ul a{
	-webkit-transition: 100ms;
	-o-transition: 100ms;
	transition: 100ms;
	display: block;
}

.footer_widget ul a:hover{
	color: var(--yellow);
	margin-left: 0.6rem;
}

.social_icons{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	gap: .8rem;
	padding-top: 0.9rem;
}

.social_icons a{
	width: 2rem;
	display: inline-block;
	-webkit-transition: 300ms;
	-o-transition: 300ms;
	transition: 300ms;
}

.social_icons a:hover{
	-webkit-transform: scale(1.15);
	    -ms-transform: scale(1.15);
	        transform: scale(1.15);
}

.social_icons a img{
	width: 100%;
}

.copyright{
	padding: 2rem 0;
	font-size: 1.8rem;
	color: #303030;
	line-height: 144%;
}

.copyright>.container{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
}

.copyright ul{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	gap: 4.4rem;
	padding-left: 4.4rem;
}

.copyright ul a:hover{
	color: var(--yellow);
}





/* -------------- preloader ------------ */

#preloader{
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	background: var(--white);
	z-index: 9999;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
}

.preloader_logo{
	width: 24rem;
	margin-left: 0.5rem;
}

.loading_dots{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	gap: 1rem;
	padding-top: .5rem;
}

.loading{
	width: 1rem;
	height: 1rem;
	background:#FFF;
	border-radius:100%;
}

.loading-0{
    -webkit-animation:bounce 1s infinite;
    -webkit-animation-delay:.1s;
    background: rgb(255, 214, 0, 0.4);
  
}

.loading-1{
    -webkit-animation:bounce 1s infinite;
    -webkit-animation-delay:.3s;
    background: rgb(255, 214, 0, 0.7);
}

.loading-2{
    -webkit-animation:bounce 1s infinite ease;
    -webkit-animation-delay:.5s;
    background: #FFD600;
}

@-webkit-keyframes bounce {
	0%, 100% {
		opacity:1;
	}
	60% {
		opacity:.0;
	
	}
}


/* -------------- Back to top ------------ */

.back-to-top {
	width: 5rem;
	height: 5rem;
	line-height: 4.1rem;
	text-align: center;
	display: none;
	position: fixed;
	bottom: 4.5rem;
	right: 4rem;
	background: #D9D9D9;
	z-index: 1000;
	-webkit-transition: 200ms;
	-o-transition: 200ms;
	transition: 200ms;
}

.back-to-top:hover{
	background: var(--yellow);
}

.back-to-top img{
	width: 2.6rem;
}