@media only screen and (max-width:320px){
	
}

@media only screen and (max-width:400px) and (min-width:360px) {
	::-webkit-scrollbar-thumb {background: transparent;}
	.mobile-hide {display: none;}
	.desktop-hide {	display: block;}
	.msconstruction-cookie-banner img {width: 80%; margin-top: 20%;}
	.left {display: none; position: relative;}
	.right {position: relative; width: 100%; padding: 0; margin-left: 0;}
	.right .banner .header {flex-wrap: wrap-reverse;}
	.head-logo {width: 35%; height: auto; display: table; padding: 0 10px 0 20px;}
	.head-logo img {width: auto; height: auto; display: block; margin: 0 auto;}
	.right .banner .header .head-right {width: 65%; padding: 0 10px 0 35px;}
	.right .banner .header .head-right::before {width: 50px; height: 50px; margin: 2px 10px 0 -20px;}
	.right .banner .header .head-right h3 {font-size: 1.3rem;}
	.right .banner .header .head-right p {font-size: 1rem;}
	.right .banner .header .head-left {width: 100%; padding: 15px 20px 0 20px; margin: 25px 0 0 0; border-top: 1px dashed #ccc;}
	.right .banner .header .head-left h1 {font-size: 1.6rem; margin: 0 0 20px 0; line-height: 3rem;}
	.contact-form {padding: 50px 20px;}
	.contact-form h4 {font-size: 1.3rem;}
	.contact-form h4:before {margin: -2px 0 0 20px;}
	.contact-form .form-control {height: 60px; font-size: 1rem;}
	.contact-form .form-field-icon i::before {margin: 14px 5px 0 0;}
	.contact-form .butn {padding: 15px 0; font-size: 20px;}
	.contact-form .intl-tel-input .flag-dropdown .selected-flag {padding: 20px 20px 12px 8px;}
	.about {background-size: 90%; background-position: center calc(10px + 2%); padding: 90px 0 0 0;}
	.about .container {padding: 50px 20px 0 20px;}
	.about-col {width: 100%; padding: 0;}
	.about-col h2 {font-size: 2rem;}
	
	.price {background-size: 90%; background-position: center calc(10px + 1%); padding: 60px 0 0 0;}
	.price .container {height: auto; padding: 50px 20px;}
	.price-head {padding: 20px 0 0 0;}
	.price-head h2 {font-size: 2rem;}
	.price-choose-col {width: 100%; padding: 20px 0;}
	.price-icon {width: 40%;}
	
	.price-choose-col-inner-right h3 {font-size: 1.5rem;}
	/*.premium-sec .price-icon {width: 45%;}
	.premium-sec h3 {font-size: 1.8rem;}*/
	.price-choose-col-inner-right p {font-size: 1.1rem;}
	.specification-content {width: 90%; border: 20px solid #FFF;}
	.specification-row {margin: 10px auto;}
	.specification-col1 {width: 100%; float: none;}
	.specification-col2 {width: 100%; float: none;}
	.specification-col2 li {margin: 0 20px 0 30px;}
	.specification-col2 li:before {left: -15px; width: 40px; height: 25px; margin-top: 2px; background-size: 35px 25px;}
	.specification-close-btn {top: 18px; right: 10px; font-size: 1.2rem; padding: 0px 10px;}
	.tab-btn {width: 30%; margin: 20px 0 0 0; font-size: 0.9rem;}
	
	.projects .container {padding: 30px 20px;}
	.projects-col {width: 100%; padding: 0;}
	.projects-col h2 {font-size: 2rem;}
	.projects-col p {margin: 0 0 30px 0;}
	.pro-img {padding: 5px 5px 0 0;}	
	.services {padding: 100px 0 0 0;}
	.services .container {height: auto; padding: 30px 20px;}
	.services-col {width: 100%; padding: 0;}
	.services-col h2 {font-size: 2rem;}
	.service-icon-col {width: 50%; padding: 10px 10px 10px 0;}
	.services-col button {display: block; margin: 30px auto 50px auto;}	
	.why {background-size: 90%; background-position: center calc(10px + 1%); padding: 60px 0 0 0;}
	.why .container {height: auto; padding: 50px 20px;}
	.why-head {padding: 20px 0 0 0;}
	.why-head h2 {font-size: 2rem;}
	.why-choose-col {width: 100%; padding: 20px 0;}	
	.contact .container {padding: 10px 20px; flex-wrap: wrap-reverse;}
	.contact-col.contact-col-img {height: auto; padding: 20px 0 0 0;}
	.contact-col {width: 100%; padding: 0;}
	.contact-img {padding: 0 0 30px 0;}
	.map {height: 350px;}
	.contact-col h2 {font-size: 2rem;}
	.contact-col p {font-size: 1rem;}
	.bottom {padding: 10px 0 0 0;}
	
	.modal-content2 {width: 90%;}
	.modal-content2 h3 {font-size: 1.3rem;}
}

@media only screen and (max-width:667px) and (min-width:400px) {
	::-webkit-scrollbar-thumb {background: transparent;}
	.mobile-hide {display: none;}
	.desktop-hide {	display: block;}
	.msconstruction-cookie-banner img {width: 80%; margin-top: 20%;}
	.left {display: none; position: relative;}
	.right {position: relative; width: 100%; padding: 0; margin-left: 0;}
	.right .banner .header {flex-wrap: wrap-reverse;}
	.head-logo {width: 35%; height: auto; display: table; padding: 0 10px 0 20px;}
	.head-logo img {width: auto; height: auto; display: block; margin: 0 auto;}
	.right .banner .header .head-right {width: 65%; padding: 10px 10px 0 45px;}
	.right .banner .header .head-right::before {width: 55px; height: 55px; margin: 2px 10px 0 -20px;}
	.right .banner .header .head-right h3 {font-size: 1.5rem;}
	.right .banner .header .head-right p {font-size: 1.2rem;}
	.right .banner .header .head-left {width: 100%; padding: 15px 20px 0 20px; margin: 25px 0 0 0; border-top: 1px dashed #ccc;}
	.right .banner .header .head-left h1 {font-size: 1.8rem; margin: 0 0 20px 0;}
	.contact-form {padding: 50px 20px;}
	.contact-form h4 {font-size: 1.5rem;}
	.contact-form h4:before {margin: -2px 0 0 20px;}
	.contact-form .form-control {height: 60px; font-size: 1rem;}
	.contact-form .form-field-icon i::before {margin: 14px 5px 0 0;}
	.contact-form .butn {padding: 20px 0; font-size: 20px;}
	.contact-form .intl-tel-input .flag-dropdown .selected-flag {padding: 20px 20px 12px 8px;}
	.about {background-size: 90%; background-position: center calc(10px + 2%); padding: 90px 0 0 0;}
	.about .container {padding: 50px 20px 0 20px;}
	.about-col {width: 100%; padding: 0;}
	.about-col h2 {font-size: 2rem;}
	
	.price {background-size: 90%; background-position: center calc(10px + 1%); padding: 60px 0 0 0;}
	.price .container {height: auto; padding: 50px 20px;}
	.price-head {padding: 20px 0 0 0;}
	.price-head h2 {font-size: 2rem;}
	.price-choose-col {width: 100%; padding: 20px 0;}
	.price-icon {width: 40%;}	
	.price-choose-col-inner-right h3 {font-size: 1.8rem;}
	/*.premium-sec .price-icon {width: 45%;}
	.premium-sec h3 {font-size: 2rem;}*/
	.price-choose-col-inner-right p {font-size: 1.1rem;}
	.specification-content {width: 90%; border: 20px solid #FFF;}
	.specification-row {margin: 10px auto;}
	.specification-col1 {width: 100%; float: none;}
	.specification-col2 {width: 100%; float: none;}
	.specification-content h2 {font-size: 1.4rem;}
	.specification-col2 li {margin: 0 20px 0 30px;}
	.specification-col2 li:before {left: -15px; width: 40px; height: 25px; margin-top: 2px; background-size: 35px 25px;}
	.specification-close-btn {top: 18px; right: 10px; font-size: 1.2rem; padding: 0px 10px;}
	.tab-btn {width: 30%; margin: 20px 0 0 0;}
	
	.projects .container {padding: 30px 20px;}
	.projects-col {width: 100%; padding: 0;}
	.projects-col h2 {font-size: 2rem;}
	.projects-col p {margin: 0 0 30px 0;}
	.pro-img {padding: 5px 5px 0 0;}	
	.services {padding: 100px 0 0 0;}
	.services .container {height: auto; padding: 30px 20px;}
	.services-col {width: 100%; padding: 0;}
	.services-col h2 {font-size: 2rem;}
	.service-icon-col {width: 50%; padding: 10px 10px 10px 0;}
	.services-col button {display: block; margin: 30px auto 50px auto;}	
	.why {background-size: 90%; background-position: center calc(10px + 1%); padding: 60px 0 0 0;}
	.why .container {height: auto; padding: 50px 20px;}
	.why-head {padding: 20px 0 0 0;}
	.why-head h2 {font-size: 2rem;}
	.why-choose-col {width: 100%; padding: 20px 0;}	
	.contact .container {padding: 10px 20px; flex-wrap: wrap-reverse;}
	.contact-col.contact-col-img {height: auto; padding: 20px 0 0 0;}
	.contact-col {width: 100%; padding: 0;}
	.contact-img {padding: 0 0 30px 0;}
	.map {height: 350px;}
	.contact-col h2 {font-size: 2rem;}
	.contact-col p {font-size: 1rem;}
	.bottom {padding: 10px 0 0 0;}
	
	.modal-content2 {width: 90%;}
	.modal-content2 h3 {font-size: 1.3rem;}
}

@media only screen and (max-width:736px) and (min-width:410px) {
	
}


@media only screen and (max-width:768px) and (min-width:482px) {
	
}

@media only screen and (max-width:960px) and (min-width:730px) {
	
}

@media only screen and (max-width:1024px) and (min-width:800px){
	
}

@media only screen and (max-width:1200px) and (min-width:1024px){
	
}

@media screen and (max-height: 740px) and (min-width: 1024px) {
	.left {padding: 10px 20px;}
	.left .logo img {width: 40%;}	
	.left .menu {padding: 20px 0;}
	.left .menu .menu-top {padding: 5px 0;}
	.left .menu li {font-size: 0.9rem; padding: 15px 0 10px 0;}
	.contact-form {padding: 5px 0;}
	.contact-form h4 {padding: 5px;}
	.contact-form .form-control {margin: 10px 0 0 0;}	
	
	.right .banner .header .head-right h3 {font-size: 1.8rem;}
	.right .banner .header .head-left h1 {font-size: 1.8rem;}
	.pro-img {padding: 5px 10px;}
	.services-col {padding: 20px 30px;}
	.services-col h2 {padding: 5px 0;}
	.services-col p {font-size: 0.9rem; margin: 0 0 10px 0;}
	.map {height: 530px;}
}