Files
GEOVizor_PHP/assets/less/responsive.less
2023-11-07 19:51:49 +06:00

163 lines
3.3 KiB
Plaintext

/* Extra small devices (phones, less than 768px) */
@media (max-width: 767px) {
.navbar-collapse {
border-top: none;
.box-shadow(none);
width: 100%;
left: 0;
top: 60px;
position: absolute;
background: darken(@text-color, 15%);
z-index: 40;
}
.header .main-nav .navbar-collapse .nav-item.active a {
color: @color-primary;
}
.header.header-scrolled .main-nav .navbar-collapse .nav-item.active a {
border: none;
color: @color-primary;
}
.main-nav .navbar-collapse .nav-item {
margin-right: 0;
}
.main-nav .navbar-collapse .nav-item a {
text-align: center;
}
.pricing-wrapper .item-inner {
min-height: inherit;
}
.pricing-wrapper .price-desc {
min-height: inherit;
}
.hero-section .figure-image {
width: 300px;
}
.hero-carousel .carousel-inner .heading {
font-size: 26px;
}
.hero-carousel .carousel-inner .item-content-inner {
padding-top: 100px;
}
.hero-section .figure-holder .figure-image {
width: inherit;
bottom: 0;
top: inherit;
right: inherit;
left:15px;
max-width: 320px;
}
.technologies li {
margin-bottom: 15px;
}
.members-wrapper .item {
margin-bottom: 30px;
&:last-child {
margin-bottom: 0;
}
}
.hero-carousel {
height: 660px;
}
.hero-section .carousel-inner {
height: 660px;
}
.hero-carousel .carousel-inner .item {
height: 660px;
}
.testimonials-section .item .profile-image {
width: 60px;
height: 60px;
}
.testimonials-section .item .quote {
margin-left: 85px;
padding: 15px;
}
.testimonials-section .item.item-reversed .quote {
margin-right: 85px;
}
.team-section .item-inner {
min-height: inherit;
}
}
/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
.feature-nav {
text-align: left;
padding-left: 30px;
}
.feature-nav > li {
font-size: 15px;
}
.hero-section .figure-holder .figure-image {
width: 400px;
bottom: inherit;
top: 130px;
}
.hero-carousel .carousel-inner .item-content-inner {
max-width: 300px;
padding-top: 120px;
}
.team-section .item-inner {
min-height: 515px;
}
}
/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
.feature-nav {
margin-top: 30px;
padding-left: 15px;
}
.feature-nav > li {
font-size: 16px;
}
.feature-nav > li > a {
padding: 15px 0;
}
.feature-nav > li.active > a {
padding: 15px 0;
}
.hero-section .figure-holder .figure-image {
width: 420px;
bottom: inherit;
top: 130px;
}
.hero-carousel .carousel-inner .item-content-inner {
max-width: 500px;
}
.team-section .item-inner {
min-height: 490px;
}
}
/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
.hero-section .figure-holder .figure-image {
width: 570px;
bottom: 0;
top: inherit;
}
}