/*========== Desktop First Method ==========*/
/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {
html{
font-size: 15px;
}
.section_about .img_wrap{
margin-top: 100px;
}
.carousel-item{
height: 450px;
}
.section_expirience .image_wrap .content{
left: 0%;
right: 0%;
top: 0%;
bottom: 0%;
}
.review_bottom h3{
text-align: center;
}
.review_bottom h2{
text-align: center;
margin-bottom: 30px;
}
}
/* Medium Devices, Desktops */
@media only screen and (max-width : 992px) {
html{
font-size: 14px;
}
.section_about{
text-align: center;
}
.section_about .img_wrap{
margin: 80px 0;
}
.section_about img{
width: 450px;
height: 320px;
margin-left: 50px;
}
.main_form input{
margin-bottom: 15px;
}
.single-item .content{
margin-top: 50px;
}
.single-item .content img{
width: 70%;
height: 300px;
}
.single-item .slick-arrow{
font-size: 50px;
}
}
/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {
html{
font-size: 13px;
}
.main_head .header_content p{
padding-left: 50px;
padding-right: 50px;
}
.main_head .header_content .button{
margin-left: 15px;
margin-right: 15px;
margin-top: 30px;
}
.section_about{
padding: 0;
}
.section_about img{
max-width: 90%;
height: auto;
margin-left: 0;
}
.section_expirience .image_wrap .content{
left: 5%;
right: 5%;
top: 5%;
bottom: 5%;
}
}
@media only screen and (max-width : 576px){
html{
font-size: 13px;
}
.main_head .header_top .toggle-mnu {
margin-right: 40px;
}
.main_head .header_top .logo {
left: 40px;
top: 0;
}
.main_head .header_top .hidden_menu ul{
margin-top: 60px;
}
.section_about:after{
display: none;
}
.section_expirience .image_wrap{
max-width: 320px;
margin: auto;
margin-bottom: 50px;
}
.section_expirience .image_wrap img{
width: 320px;
height: 280px;
}
.section_expirience .image_wrap .content{
padding-top: 50px;
}
}
/* Extra Small Devices, Phones */
@media only screen and (max-width : 480px) {
html{
font-size: 12px;
}
.main_head .header_content h1{
font-size: 4.5rem;
}
.main_head .header_content p{
margin-bottom: 60px;
padding-left: 30px;
padding-right: 30px;
}
.main_head .header_content .button{
display: block;
width: 70%;
margin: auto;
margin-top: 30px;
}
.section_price .table thead th{
text-transform: none;
}
.main_form .col-6{
width: 100%;
max-width: 100%;
flex: 0 0 100%;
}
.main_form input{
margin-bottom: 20px;
}
}
Comments