formspree/formspree/scss/grid.scss

129 lines
1.4 KiB
SCSS

.row {
width: 100%;
&:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
}
.container {
max-width: 950px;
margin: 0 auto;
&:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
&.narrow {
@media (min-width: 760px) {
max-width: 600px;
}
}
@media (max-width: 760px) {
max-width: 100% !important;
}
}
@mixin col {
float: left;
padding: 0 20px;
@media (max-width: 760px) {
width: 100% !important;
margin-bottom: 20px !important;
}
}
.col-1-1 {
@include col;
width: 100%;
}
.col-1-2 {
@include col;
width: 50%;
}
.col-1-3 {
@include col;
width: 33.33%;
}
.col-2-3 {
@include col;
width: 66.66%;
}
.col-1-4 {
@include col;
width: 25%;
}
.col-3-4 {
@include col;
width: 75%;
}
.col-2-5 {
@include col;
width: 40%;
}
.col-3-5 {
@include col;
width: 60%;
}
.col-5-12 {
@include col;
width: 41.67%;
}
.col-5-6 {
@include col;
width: 83.33%;
}
.col-1-6 {
@include col;
width: 16.67%;
}
@media print {
.col-1-1 {
width: 100% !important;
}
.col-1-2 {
width: 50% !important;
}
.col-1-4 {
width: 25% !important;
}
.col-1-3 {
width: 33.33% !important;
}
.col-2-3 {
width: 66.66% !important;
}
.col-5-12 {
width: 41.67% !important;
}
}