95 lines
1.5 KiB
SCSS
95 lines
1.5 KiB
SCSS
///////////////////
|
||
// //
|
||
// MAIN //
|
||
// //
|
||
///////////////////
|
||
|
||
.home-lists {
|
||
|
||
@include breakpoint(desktop) {
|
||
display: inline-flex;
|
||
flex-flow: row;
|
||
flex-wrap: wrap;
|
||
overflow: visible;
|
||
width: 100%; // set the container width
|
||
|
||
dt {
|
||
flex: 0 0 39%;
|
||
word-wrap: anywhere;
|
||
}
|
||
|
||
dd {
|
||
flex: 0 0 59%;
|
||
margin-left: auto;
|
||
text-align: left;
|
||
}
|
||
}
|
||
|
||
@include breakpoint(laptop) {
|
||
display: inline-flex;
|
||
flex-flow: row;
|
||
flex-wrap: nowrap;
|
||
flex-wrap: wrap;
|
||
overflow: visible;
|
||
margin-left: 3rem;
|
||
|
||
dt {
|
||
flex: 0 0 30%;
|
||
word-wrap: anywhere;
|
||
}
|
||
|
||
dd {
|
||
flex: 0 0 59%;
|
||
margin-left: auto;
|
||
text-align: left;
|
||
}
|
||
}
|
||
|
||
@include breakpoint(mobile) {
|
||
display: flex;
|
||
flex-direction: column;
|
||
place-items: center;
|
||
}
|
||
|
||
@include breakpoint(tablet) {
|
||
display: flex;
|
||
flex-direction: column;
|
||
place-items: center;
|
||
}
|
||
|
||
dd {
|
||
margin-left: .5rem;
|
||
}
|
||
|
||
dt::after {
|
||
content: ' :';
|
||
}
|
||
|
||
}
|
||
|
||
.contents {
|
||
padding: 0;
|
||
}
|
||
|
||
.apps {
|
||
display: flex;
|
||
place-items: center;
|
||
justify-content: space-evenly;
|
||
flex-wrap: wrap;
|
||
gap: 2rem 5rem;
|
||
margin-top: 2rem;
|
||
|
||
img {
|
||
max-width: 60%;
|
||
}
|
||
}
|
||
|
||
.home {
|
||
background: url("images/assets/overlay.png"), url("images/assets/intro.jpg");
|
||
background-size: 256px 256px, cover;
|
||
background-attachment: fixed, fixed;
|
||
background-position: top left, bottom center;
|
||
background-repeat: repeat, no-repeat;
|
||
background-blend-mode: difference;
|
||
}
|