/* large Desktops and laptops ----------- */
@media only screen and (min-width: 1225px) and (max-width: 2500px) {
	.container {
		max-width: 1200px
	}
}







/* Desktops and laptops  */
@media only screen and (min-width: 992px) and (max-width: 1224px) {
	.container {
		max-width: 960px;
	}
}








/* TABLETS (portrait and landscape) */
@media only screen and (min-width: 768px) and (max-width: 991px) {
	.container {
		max-width: 720px
	}
}








/* TABLETS - SMARTPHONES LANDSCAPE (portrait and landscape)  */
@media only screen and (min-width: 481px) and (max-width: 767px) {
	.container {
		max-width: 640px;
	}

	.headerUp .left .phone a{
		font-size: 11px!important;
	}

	.header .menu {
		position: fixed;
		right: 0;
		top: 0;
		background: #fff;
		width: 100%;
		height: 100%;
		z-index: 99999;
		transform: rotateY(90deg);
		transform-origin: right;
		transition: 0.5s all ease;
	}

	.header .menu.active {
		transform: rotateY(0);
	}

	.header .menu ul {
		flex-direction: column;
		padding: 30px;
	}

	.header .container .menu ul li {
		padding: 10px 0px;
	}

	.icon-close2 {
		position: absolute;
		top: 10px;
		right: 10px;
		font-size: 22px;
		z-index: 99999;
		display: block!important;
		color: #df0424;
	}

	.icon-menu {
		font-size: 28px;
		display: block!important;
		margin-left: 15px;
		color: #df0424;
		cursor: pointer;
	}

	.title{
		font-size: 22px!important;
		margin-bottom: 15px!important;
	}
	.para{
		font-size: 12px!important;
		line-height: 22px!important;
		margin-bottom: 15px!important;
	}
	.aboutUs .left ul li{
		gap: 5px!important;
		font-size: 11px!important;
	}
	.aboutUs .left ul{
		gap: 5px!important;
		margin-bottom: 15px!important;
	}
	.explore .productList{
		grid-template-columns: repeat(2, 1fr)!important;
	}
	.slides .sinSlide.active{
		width: 80%!important;
	}
	.slides .sinSlide .info h2{
		transform: rotate(-90deg);
		transform-origin: left;
		font-size: 18px!important;
	}
	.slides .sinSlide.active .info h2{
		transform: rotate(0deg);
		transform-origin: left;
		font-size: 18px!important;
	}
	.slides .sinSlide .info p{
		font-size: 10px!important;
		line-height: 18px!important;
	}
	.history .shape1 ,
	.history .shape2{
		width: 200px!important;
	}
	.history span {
		font-size: 20px!important;
		width: 25px!important;
		height: 25px!important;
		padding: 15px!important;
	}
	.history h2 {
		font-size: 18px!important;
	}
	.history h5 {
		font-size: 9px!important;
	}
	.glimg .gallry .singleSer{
		width: calc(33% - 30px)!important;
	}


	.logoMenu .menu>ul>li>ul {
		left: -165%!important;
		top: 100%!important;
		width: 300px!important;
		padding: 0!important;
	}
	.logoMenu .menu>ul>li>ul>li {
		padding: 10px 15px!important;
	}


}








/* Smartphones (portrait and landscape)  */
@media only screen and (min-width: 320px) and (max-width: 480px) {
	.smb15 {
		margin-bottom: 15px;
	}

	
	.smdnone ,
	.smd {
        display: none !important;
    }

	.container {
		max-width: 360px;
	}

	.flex-wrap {
		flex-wrap: wrap;
	}

	.column {
		flex-direction: column;
	}

	.full {
		width: 100% !important;
	}

	.smdnone {
		display: none;
	}


	.headerUp .left .phone:nth-child(2){
		border-right: none;
	}


	.header .menu {
		position: fixed;
		right: 0;
		top: 0;
		background: #fff;
		width: 100%;
		height: 100%;
		z-index: 99999;
		transform: rotateY(90deg);
		transform-origin: right;
		transition: 0.5s all ease;
	}

	.header .menu.active {
		transform: rotateY(0);
	}

	.header .menu ul {
		flex-direction: column;
		padding: 30px;
	}

	.header .container .menu ul li {
		padding: 10px 0px;
	}

	.icon-close2 {
		position: absolute;
		top: 10px;
		right: 20px;
		font-size: 22px;
		z-index: 99999;
		display: block!important;
		color: #df0424;
	}

	.icon-menu {
		font-size: 28px;
		display: block!important;
		margin-left: 15px;
		color: #df0424;
		cursor: pointer;
	}

	.logoMenu .logo{
		width: 17%!important;
	}
	.logoMenu .contact .help i {
		font-size: 35px!important;
	}

	.logoMenu .contact .help h4 {
		font-size: 10px!important;
		margin-bottom: 3px!important;
	}
	.logoMenu .contact .help h4 {
		font-size: 18px!important;
	}


	.logoMenu .menu>ul>li{
		text-align: left!important;
		width: 100%!important;
	}
	.logoMenu .menu>ul>li>ul {
		left: 0%!important;
		top: 100%!important;
		width: 300px!important;
		padding: 0!important;
	}
	.logoMenu .menu>ul>li>ul>li {
		padding: 10px 15px!important;
	}

	.hero{
		height: 70vh!important;
	}


	.hero .left{
	    padding: 15px !important;
		width: calc(100% - 30px) !important;
	}

	.carousel {
		height: 70vh!important;
	}
	.carousel .carousel-item .carDetails {
		height: 70vh!important;
	}

	.hero .left h4{
		text-align: center;
		font-size: 28px!important;
	}
	.hero .left h1{
		text-align: center;
		font-size: 16px!important;
		line-height: 28px!important;
	}
	.hero .left p{
		font-size: 12px;
		font-weight: 500;
		line-height: 26px;
		margin-bottom: 20px;
		color: #fff;
		text-align: center;
	}




	.carousel .carousel-actions {
		display: none!important;
	}

	.title{
		font-size: 28px!important;
		margin-bottom: 15px;
	}

	.aboutUs .right{
		margin-top: 30px;
	}
	.aboutUs .right .exp{
		width: 60%;
	}
	.explore .productList {
		grid-template-columns: repeat(1, 1fr)!important;
	}
	.slides .sinSlide.active{
		width: 100%!important;
	}
	.slides .sinSlide .info h2{
		transform: rotate(-90deg);
		transform-origin: left;
		font-size: 18px!important;
	}
	.slides .sinSlide.active .info h2{
		transform: rotate(0deg);
		transform-origin: left;
		font-size: 18px!important;
	}
	.slides .sinSlide .info p{
		font-size: 10px!important;
		line-height: 18px!important;
	}
	.services .container{
		grid-template-columns: repeat(1, 1fr)!important;
	}
	.services .container .sinService:nth-child(even) img{
		order: 2;
	}
	

	.aboutUs .right{
		width: calc(100% - 15px)!important;
		gap: 15px!important;
	}


	.contactUs .details .sin{
		width: calc(100% - 60px)!important;
	}


	.contactUs .right form .flex-between-center.column{
		margin-bottom: 0px!important;
	}

	.contactUs .right form .submit{	}


	.contactUs .right form .input-control{
		margin-bottom: 10px;
	}


	.conlocHo {
		padding: 30px 0 0 0;
	}
	.conlocHo .sinCon {
		width: calc(100% - 40px);
		padding: 20px;
		margin-bottom: 20px;
	}
	.contactUs {
		padding: 15px 0px 30px 0px;
	}
	.contactUs .contactData .conRight form .name {
		flex-direction: column;
		margin-bottom: 0;
	}
	.contactUs .contactData .conRight form input[type="text"],
	.contactUs .contactData .conRight form input[type="submit"],
	.contactUs .contactData .conRight form textarea ,
	.contactUs .contactData .conRight form input[type="email"]{
		width: calc(100% - 20px);
		padding: 8px 10px;
		margin-bottom: 10px;
	}
	.contactUs .contactData .conRight form input[type="submit"]{
		width: 100%;
	}
	.contactUs .contactData .conRight {
		width: 100%;
	}



	.bannerSlider .item ,
	.bannerSlider .item img {
        height: 45vh;
        object-fit: cover;
    }


	.Gallery{
		padding: 30px 0px!important;
	}
	.glimg .gallry .singleSer{
		width: calc(100% - 30px)!important;
	}

	.category .container{
        grid-template-columns: repeat(1, 1fr)!important;
        gap:20px!important;
    }
}

/*	Retina media query.
	Overrides styles for devices with a 
	device-pixel-ratio of 2+, such as iPhone 4.
-----------------------------------------------    */

@media only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (min-device-pixel-ratio: 2) {}