web2019/sass/css/_layout.scss

66 lines
1.1 KiB
SCSS

.hero {
height: 230px;
background: none;
}
.card h5,
h5 {
color: $brand-color;
}
h3 {
color: $color-secondary;
}
.shadow.sticky-top {
background: #fff;
}
// 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;
}
}
.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;
}
}
// Extra large devices (large desktops, 1200px and up)
@media (min-width: 1200px) {
}