forked from M-Labs/web2019
113 lines
2.0 KiB
SCSS
113 lines
2.0 KiB
SCSS
.hero {
|
|
height: 230px;
|
|
background: none;
|
|
}
|
|
.hero2, .hero3 {
|
|
//height: 130px;
|
|
background: none;
|
|
}
|
|
|
|
.card h5,
|
|
h5 {
|
|
color: $brand-color;
|
|
}
|
|
|
|
h3, h2, h1 {
|
|
color: $color-secondary;
|
|
}
|
|
|
|
.shadow.sticky-top {
|
|
background: #fff;
|
|
}
|
|
|
|
.logos-centered {
|
|
p {
|
|
display: flex;
|
|
flex-direction: row;
|
|
justify-content: center;
|
|
align-content: center;
|
|
align-items: center;
|
|
flex-wrap: wrap;
|
|
img {
|
|
width: 150px;
|
|
padding: .8rem;
|
|
}
|
|
}
|
|
}
|
|
|
|
.card-img-top {
|
|
padding: .4rem; }
|
|
|
|
// Small devices (landscape phones, 576px and up)
|
|
@media (min-width: 576px) {
|
|
|
|
}
|
|
|
|
// Medium devices (tablets, 768px and up)
|
|
@media (min-width: 768px) {
|
|
}
|
|
|
|
// Large devices (desktops, 992px and up)
|
|
@media (min-width: 992px) {
|
|
.hero {
|
|
// height: 692px;
|
|
height: calc(100vh - 300px);
|
|
background: url("../images/hero@2x.png") repeat-x top center;
|
|
-webkit-background-size: contain;
|
|
-moz-background-size: contain;
|
|
-o-background-size: contain;
|
|
background-size: contain;
|
|
|
|
h1 {
|
|
color: $background-color;
|
|
margin-bottom: 30px;
|
|
margin-top: -100px;
|
|
}
|
|
}
|
|
|
|
.hero2 {
|
|
height: 380px;
|
|
background: url("../images/hero2@2x.png") repeat-x top center;
|
|
-webkit-background-size: contain;
|
|
-moz-background-size: contain;
|
|
-o-background-size: contain;
|
|
background-size: contain;
|
|
}
|
|
|
|
.hero3 {
|
|
height: 380px;
|
|
background: url("../images/hero3@2x.png") repeat-x top center;
|
|
-webkit-background-size: contain;
|
|
-moz-background-size: contain;
|
|
-o-background-size: contain;
|
|
background-size: contain;
|
|
}
|
|
|
|
.hero + main {
|
|
margin-top: -150px;
|
|
}
|
|
|
|
.shadow-lg {
|
|
box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important;
|
|
}
|
|
|
|
.card-artiq {
|
|
background: #fff url("../images/artiq@2x.png") no-repeat top right;
|
|
}
|
|
|
|
.card-gateware {
|
|
background: #fff url("../images/gateware@2x.png") no-repeat top right;
|
|
}
|
|
|
|
.logos-centered {
|
|
p {
|
|
img {
|
|
width: 200px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// Extra large devices (large desktops, 1200px and up)
|
|
@media (min-width: 1200px) {
|
|
} |