Files
agroexpert/frontend/src/styles/pages/main.css

437 lines
7.1 KiB
CSS
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

.content {
display: grid;
margin-top: 0.3rem;
grid-template-columns: 36.4rem 1fr 36.3rem;
grid-template-areas: 'left middle right';
}
.content-left {
grid-area: left;
}
.content-middle {
grid-area: middle;
}
.content-right {
grid-area: right;
}
.content-right__link-item {
font-weight: 500;
}
ul.wp-block-list li{
display: block;
padding: 4px 0;
}
.about p {
margin-bottom: 1em;
}
.content-middle picture,
.content-middle img,
.content-middle picture img {
max-width: 100%;
height: auto;
display: block;
}
.news-list-picture{
height: 21rem !important;
object-fit: cover;
width: 100%;
}
.article-single IMG{
max-width: 100%;
}
.image-caption{
margin: 12px 0;
text-align: center;
}
.allnews-container{
width: 100%;
max-width: 100%;
}
.allnews{
display: flex; /* включаем flex-контейнер */
justify-content: center; /* по горизонтали по центру */
align-items: center;
padding: 1rem;
background: var(--primary);
font-weight: 700;
font-size: 1.6rem;
line-height: 1.8rem;
color: #fff;
-webkit-transition: 0.3s;
transition: 0.3s;
border-radius: .5rem;
border-right: 2px solid var(--secondary);
border-bottom: 2px solid var(--secondary);
width: 250px;
}
.allnews:hover{
background: var(--secondary);
}
.partner-logo IMG{
height: auto;
display: block;
width: 150px;
max-width: 150px;
}
/** @media (max-width: 1439px) { */
@media (min-width: 768px) and (max-width: 1024px) {
.content {
grid-template-columns: 36.4rem 1fr;
grid-template-areas:
'left middle'
'right right';
}
.content.content__search {
grid-template-areas:
'middle middle'
'right right';
}
}
@media (max-width: 767px) {
.content {
grid-template-columns: 1fr;
grid-template-areas:
'middle'
'left'
'right';
}
.content-right {
margin: 0 -2rem;
padding-bottom: 3rem;
}
}
.content-sidebar {
background: white;
}
.content-sidebar-top {
padding: 2.5rem 3.3rem;
}
.content-sidebar-top.no-top {
padding-top: 0;
}
.content-sidebar__title {
text-align: center;
margin-bottom: 1.6rem;
}
.upcoming-events {
max-width: 28.8rem;
}
.upcoming-events__title {
margin-top: 1.6rem;
}
.articles-preview {
display: flex;
flex-wrap: wrap;
}
.articles-wrapper {
border-left: 0.1rem solid var(--gray);
border-right: 0.1rem solid var(--gray);
display: flex;
flex-direction: column;
}
.frontpage-next{
padding: 1.8rem 0 1.7rem;
grid-column: span 2;
width: 100%;
text-align: center;
border-top: 0.1rem solid var(--gray);
margin-top: -1px;
font-family: 'Raleway', sans-serif;
font-weight: bold;
transition: 0.3s;
font-size: 1.4em;
display: flex;
justify-content: center;
}
.frontpage-next a{
color: var(--secondary);
}
.frontpage-next a:hover{
color: var(--primary);
}
.articles-preview__show-next {
padding: 1.8rem 0 1.7rem;
grid-column: span 2;
width: 100%;
text-align: center;
border-top: 0.1rem solid var(--gray);
margin-top: -1px;
font-family: 'Raleway', sans-serif;
transition: 0.3s;
font-size: 1.4em;
display: flex;
justify-content: center;
}
.articles-preview__show-next:hover {
color: var(--primary);
}
.articles__spacer-container {
position: relative;
border-top: 1px solid var(--gray);
width: 100%;
height: 100%;
display: flex;
flex-grow: 1;
}
.articles__spacer {
height: 100%;
width: 50%;
}
.articles__spacer:first-of-type {
border-right: 1px solid var(--gray);
}
.item-video__name {
padding: 2.5rem 3.8rem;
display: block;
transition: 0.3s;
}
.item-video__name:hover {
color: var(--primary);
}
.item-video__video-wrapper {
position: relative;
height: 20.8rem;
}
.item-video__video-wrapper>img {
width: 100%;
height: 100%;
max-width: 100%;
max-height: 100%;
object-fit: cover;
}
.item-video__video-wrapper>img {
max-width: 100%;
max-height: 100%;
object-fit: cover;
}
.item-video__button {
position: absolute;
display: flex;
align-items: center;
color: white;
gap: 1.5rem;
left: 3.9rem;
bottom: 1.8rem;
background: rgba(0, 0, 0, 0.5); /* Черный фон с 50% прозрачностью */
border-radius: 0.5rem; /* закруглим углы */
width: 200px;
padding-left: 4px;
}
.banner-left {
margin: 2.5rem auto 0;
/*height: 40rem;*/
width: 24rem;
}
.banner-left a {
display: flex;
width: 100%;
height: 100%;
}
.banner-middle {
height: 12rem;
max-height: 12rem;
width: 100%;
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
}
.banner-middle img {
width: 100%;
}
.content-right {
border-top: 0.1rem solid var(--gray);
}
.law {
padding: 2.5rem 3.8rem;
border-top: 0.1rem solid var(--gray);
background: #fff;
}
.content-right__most-read {
border-bottom: 1px solid var(--gray);
}
@media (max-width: 768px) {
.banner-middle {
height: 8rem;
}
.articles__spacer-container {
display: none;
}
.banner-left {
width: 24rem;
margin: 2.5rem auto 0;
}
.subscribe-form__input {
width: 100%;
box-sizing: border-box;
}
}
@media (max-width: 767px) {
.banner-middle {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
overflow: hidden;
position: relative;
}
.banner-middle img {
width: auto;
position: absolute;
left: 50%;
top: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
max-height: 100%;
}
.content-right__most-read {
display: none;
}
.articles-wrapper {
border: 0;
}
.content-videos {
margin: 0 -2rem;
}
.item-video__video-wrapper {
height: auto;
}
.item-video__video-wrapper>img {
position: relative;
}
.articles-preview__show-next {
border-bottom: 1px solid var(--gray);
/* margin-bottom: 2.7rem; */
width: calc(100% + 4rem);
margin-left: -2rem;
}
.content-sidebar {
margin: 0 -2rem;
}
}
.event-calendar-mobile {
width: 100%;
display: flex;
flex-direction: column;
background-color: var(--white);
border-bottom: 1px solid var(--gray);
}
@media (max-width: 767px) {
.event-calendar-mobile {
margin: 0 -2rem;
width: calc(100% + 4rem);
}
}
.event-calendar__header {
display: flex;
padding: 15px 24px 13px;
align-items: flex-start;
justify-content: space-between;
}
.event-calendar__wrapper {
display: none;
}
.event-calendar__wrapper.is-active {
display: flex;
justify-content: center;
}
.event-calendar__header.is-active svg {
transform: rotate(180deg);
}
@media (max-width: 767px) {
.event-single {
margin: 0 -2rem;
}
}
.w-full {
width: 100%;
}
.article-single__content * {
font: revert;
}
.wp-block-gallery.has-nested-images.columns-default figure.wp-block-image:not(#individual-image):first-child:nth-last-child(2),
.wp-block-gallery.has-nested-images.columns-default figure.wp-block-image:not(#individual-image):first-child:nth-last-child(2)~figure.wp-block-image:not(#individual-image) {
width: 100%;
}
@media (max-width: 767px) {
.no-mobile-border {
border: none;
}
}