Files
RaderHealthWeb/public/assets/sass/_base/_typography.scss
T
CHIEFSOFT\ameye 0429395219 first commit
2024-06-18 14:00:40 -04:00

190 lines
3.3 KiB
SCSS

html {
font-size: 18px;
scroll-behavior: smooth;
}
body {
padding: 0;
margin: 0;
font-size: 18px;
color: $body-color;
line-height: $lh-p;
overflow-x: hidden;
font-family: $body;
background: #f0f5fc;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-weight: 700;
margin: 0;
line-height: 1.3;
color: $title-color;
font-family: $heading;
a {
color: $title-color;
&:hover {
color: $theme-color;
}
}
}
h1 {
font-size: 42px;
}
h2 {
font-size: 36px;
line-height: 46px;
margin-top: -16px;
}
h3 {
font-size: 28px;
line-height: 38px;
margin-top: -14px;
font-weight: 600;
}
h4 {
font-size: 24px;
line-height: 28px;
margin-top: -9px;
font-weight: 600;
}
h5 {
font-size: 20px;
line-height: 26px;
margin-top: -9px;
font-weight: 600;
}
h6 {
font-size: 18px;
margin-top: -7px;
font-weight: 500;
}
p {
margin-top: -12px;
&:last-child {
margin-bottom: -7px !important;
}
a {
color: $theme-color;
&:hover {
color: $theme-color;
}
}
@include breakpoint(max-sm) {
font-size: 16px;
}
}
@include breakpoint (md) {
h1 {
font-size: 80px;
}
h2 {
font-size: 54px;
line-height: 64px;
margin-top: -20px;
}
h3 {
font-size: 36px;
line-height: 46px;
margin-top: -16px;
}
h4 {
font-size: 28px;
line-height: 38px;
margin-top: -14px;
}
h5 {
font-size: 24px;
line-height: 28px;
margin-top: -9px;
}
h6 {
font-size: 20px;
line-height: 26px;
margin-top: -9px;
}
}
a {
display: inline-block;
@include transition($transition);
text-decoration: none;
&:hover {
text-decoration: none;
color: inherit;
}
}
ul {
margin: 0;
padding: 0;
li {
list-style: none;
padding: 5px 0;
}
}
select,
input,
textarea,
button {
width: 100%;
background-color: $white-color;
border: 1px solid $border-color;
outline: none;
}
textarea {
height: 200px;
resize: none;
padding: 10px;
}
input,
button,
select {
height: 50px;
color: $body-color;
}
label,
button,
select {
cursor: pointer;
}
input {
background: #f4f4f4;
border: 1px solid transparent;
@include border-radius(5px);
padding-left: 10px;
&:focus {
border: 1px solid $theme-one;
}
&[type="submit"] {
cursor: pointer;
background-color: $primary-color;
color: $white-color;
font-weight: 700;
padding: 0;
}
}
.bg_img {
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
}
.bg_auto{
background-size: auto;
}
.bg_cover{
background-size: cover !important;
}
.right_center {background-position: right center;}
.left_center {background-position: left center;}
.bottom_center {background-position: bottom center;}
.bottom_left {background-position: bottom left;}
.bottom_right {background-position: bottom right;}
.top_center {background-position: top center;}
.top_left {background-position: top left;}
.top_right {background-position: top right;}
.bg_contain {background-size: contain}