/*`xxl` applies to x-large devices (large desktops, less than 1400px)*/

@media (max-width: 1399.98px) { ... }



/*`xl` applies to large devices (desktops, less than 1200px)*/

@media (max-width: 1199.98px) { ... }



/*lg` applies to medium devices (tablets, less than 992px)*/

@media (max-width: 991.98px) {

	:root{

	    --px-content: 3%;

	    --py-content: 28px;

	}



	.navbar{

		border-bottom: 2px solid var(--cl-y);

	}

	.navbar-main{

	    padding-top: 0.5rem;

	    padding-bottom: 0.5rem;

	}



	.logo{

		width: 12rem;

	    transition: all .3s ease-in-out;

	}



	.navbar-fixed .logo{

		width: 11rem;

	}







	.navbar-nav{

		align-items: flex-start;

		gap: 12px;

	}

	.navbar-nav .nav-item .nav-link{

		padding: 0.2rem;

		color: #000;

		justify-content: flex-start;

	}

	.navbar-nav .nav-item .nav-link a{

		color: #000;

	}

	.navbar-nav .nav-item .nav-link.active:before{

		content: unset;

	}



	.dropdown-item{

		white-space: normal;

	}


	.translate .lang-item{
		width: 2rem;
		height: 2rem;
	}


	.offcanvas{

		max-width: 40%;

		background-color: #fff;

	}



	.banner{

	    height: 500px;

	}



	.banner .swiper-slide .banner-slide{

		width: 80%;

	}



	.footer .img-cover-1{

	    top: -7%;

	    width: 5rem;

	}



	.footer .img-cover-2{

	    top: 50%;

	    width: 5rem;

	}



	.footer-bottom{

		padding-top: 0.5rem;

		padding-bottom: 0.5rem;

	}



	.logo-footer{

		width: 15rem;

	}



}

/*`md` applies to small devices (landscape phones, less than 768px)*/

@media (max-width: 767.98px) {

	:root{

	    --px-content: 1%;

	    --py-content: 24px;

	}

	body{

	  	font-size: 14px;

	}



	.offcanvas{

		max-width: 60%;

	}



	.logo{

		width: 9rem;

	}



	.navbar-fixed .logo{

		width: 8rem;

	}

	

	.banner {

	    height: 400px;

	}



	.banner .swiper-slide .banner-slide{

		width: 80%;

	}



	.wrapper{

		transform: scale(0.8);

	}





	/**/



}

/*`sm` applies to x-small devices (portrait phones, less than 576px)*/

@media (max-width: 575.98px) {



}



/* Small devices (landscape phones, 576px and up)*/

@media (min-width: 576px) {  }

/* Medium devices (tablets, 768px and up)*/

@media (min-width: 768px) {  }

/* Large devices (desktops, 992px and up)*/

@media (min-width: 992px) {

	.navbar-nav .dropdown .dropdown-menu{

	    max-width: 320px;

	    width: 320px;

	}

	.navbar-nav .nav-item .nav-link.active:before{

	    content: "\f0de";

	    position: absolute;

	    left: 50%;

	    bottom: 0;

	    transform: translateX(-50%);

	    font-family: "Font Awesome 6 Pro";

	    line-height: 0;

	}

	.navbar-nav .nav-item .nav-link.active:after{

	    content: "";

	    position: absolute;

	    bottom: 0px;

	    left: 0;

	    width: 100%;

	    height: 0.25rem;

	    background: var(--cl-grd);

	}

}

/* X-Large devices (large desktops, 1200px and up)*/

@media (min-width: 1200px) {  }

/* XX-Large devices (larger desktops, 1400px and up)*/

@media (min-width: 1400px) {  }