You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

90 lines
1.3 KiB

.content {
/*display: flex;*/
justify-content: center;
padding: 3rem;
}
.main {
display: grid;
grid-template-areas:
"off_btn search"
"our_port sites"
"servers sites";
grid-template-columns: 1fr 2fr;
grid-template-rows: auto auto;
}
.off_btn {
grid-area: off_btn;
background: #ff5a5a;
align-content: center;
border-radius: 0.4rem;
padding-left: 1rem;
padding-right: 1rem;
border-style: hidden;
font-size: 1rem;
width: calc(100% - 0.5rem);
height: 100%;
}
.off_btn:active {
background-color: #c85000;
box-shadow: rgba(0, 0, 0, .06) 0 2px 4px;
transform: scale(.96);
}
.our_port {
grid-area: our_port;
background: #53f453;
align-content: center;
border-radius: 0.4rem;
padding-left: 1rem;
padding-right: 1rem;
margin-right: 0.5rem;
margin-top: 0.4rem;
}
.servers {
grid-area: servers;
}
.serv_elem {
background: #fff454;
align-content: center;
border-radius: 0.4rem;
padding-left: 1rem;
min-height: 2.2rem;
margin-top: 0.4rem;
margin-right: 0.5rem;
}
.sites {
grid-area: sites;
}
.sites_elem {
background: #abd4f9;
align-content: center;
border-radius: 0.4rem;
padding-left: 1rem;
min-height: 2.2rem;
margin-top: 0.4rem;
}
.search {
grid-area: search;
}
/* Действия при разрешении телефона */
@media (max-width: 900px) {
.content {
display: flex;
padding: 0;
}
}