208 lines
		
	
	
		
			2.4 KiB
		
	
	
	
		
			SCSS
		
	
	
	
	
	
			
		
		
	
	
			208 lines
		
	
	
		
			2.4 KiB
		
	
	
	
		
			SCSS
		
	
	
	
	
	
| body {
 | |
| 	font-family: sans-serif;
 | |
| 	text-align: center;
 | |
|   font-size: 1.4rem;
 | |
| }
 | |
| 
 | |
| body {
 | |
|   font-family: Roboto, helvetica;
 | |
|   font-family: Poppins, helvetica;
 | |
| }
 | |
| 
 | |
| 
 | |
| .font-4xl {
 | |
|   font-size: 3rem;
 | |
| }
 | |
| 
 | |
| .font-xl {
 | |
|   font-size: 1.7rem;
 | |
| }
 | |
| 
 | |
| .line-1 {
 | |
|   line-height: 1rem;
 | |
| }
 | |
| 
 | |
| .color-gray {
 | |
|   color: gray
 | |
| }
 | |
| 
 | |
| ol {
 | |
|   list-style-type: decimal;
 | |
| }
 | |
| 
 | |
| .row {
 | |
|   display: flex;
 | |
|   flex-direction: row;
 | |
| }
 | |
| 
 | |
| .wrap {
 | |
|   flex-wrap: wrap;
 | |
| }
 | |
| 
 | |
| .column {
 | |
|   display: flex;
 | |
|   flex-direction: column;
 | |
| }
 | |
| 
 | |
| .items-center {
 | |
|   align-items: center;
 | |
| }
 | |
| 
 | |
| .justify-center {
 | |
|   justify-content: center;
 | |
| }
 | |
| 
 | |
| .margin-x-1 {
 | |
|   margin-left: 1rem;
 | |
|   margin-right: 1rem;
 | |
| }
 | |
| 
 | |
| .margin-y-4 {
 | |
|   margin-top: 4rem;
 | |
|   margin-bottom: 4rem;
 | |
| }
 | |
| 
 | |
| .margin-x-3 {
 | |
|   margin-left: 3rem;
 | |
|   margin-right: 3rem;
 | |
| }
 | |
| 
 | |
| .margin-y-25vh {
 | |
|   margin-top: 25vh;
 | |
|   margin-bottom: 25vh;
 | |
| }
 | |
| 
 | |
| .margin-3 {
 | |
|   margin: 3rem;
 | |
| }
 | |
| 
 | |
| .max-width-900 {
 | |
|   max-width: 900px;
 | |
| }
 | |
| 
 | |
| .margin-x-auto {
 | |
|   margin-left: auto;
 | |
|   margin-right: auto;
 | |
| }
 | |
| 
 | |
| .card-list {
 | |
|   text-align: left;
 | |
|   justify-content: center;
 | |
|   display: flex;
 | |
|   flex-wrap: wrap;
 | |
| 
 | |
|   .card {
 | |
|     flex: 1;
 | |
|     min-width: 250px;
 | |
|     max-width: 400px;
 | |
|     margin: 30px;
 | |
|     display: flex;
 | |
|     flex-direction: column;
 | |
| 
 | |
|     .spacer {
 | |
|       flex-grow: 1;
 | |
|     }
 | |
| 
 | |
|     .border-bottom {
 | |
|       border-bottom: solid 2px #F0F0F0;
 | |
|     }
 | |
| 
 | |
|     h3 {
 | |
|       text-align: center;
 | |
|       margin-bottom: 1rem;
 | |
|       margin-top: 2rem;
 | |
|       margin-left: 1rem;
 | |
|       margin-right: 1rem;
 | |
|       min-height: 55px;
 | |
|       font-size: 2rem;
 | |
|     }
 | |
| 
 | |
|     ul {
 | |
|       list-style-type: disc;
 | |
|       padding-right: 15px;
 | |
|       li {
 | |
|         padding-bottom: 10px;
 | |
|       }
 | |
|     }
 | |
|   }
 | |
| }
 | |
| 
 | |
| .md-container {
 | |
|   max-width: 800px;
 | |
|   margin: auto;
 | |
| }
 | |
| 
 | |
| .text-left {
 | |
|   text-align: left;
 | |
| }
 | |
| 
 | |
| .text-center {
 | |
|   text-align: center;
 | |
| }
 | |
| 
 | |
| .list-style-none {
 | |
|   list-style-type: none;
 | |
| }
 | |
| 
 | |
| ol.huge-list-markers li{
 | |
|   margin-bottom: 5rem;
 | |
|   &::marker {
 | |
|     font-size: 3rem;
 | |
|     font-weight: 800;
 | |
|     margin: 2rem;
 | |
|   }
 | |
| }
 | |
| 
 | |
| @media (min-width: 900px) {
 | |
| .text-2x {
 | |
|   font-size: 2rem;
 | |
| }
 | |
| 
 | |
| .text-3x {
 | |
|   font-size: 3.5rem;
 | |
| }
 | |
| 
 | |
| .text-4x {
 | |
|   font-size: 4rem;
 | |
| }
 | |
| }
 | |
| 
 | |
| .font-bold {
 | |
|   font-weight: 800;
 | |
| }
 | |
| 
 | |
| .font-600 {
 | |
|   font-weight: 600;
 | |
| }
 | |
| 
 | |
| 
 | |
| .max-width-400 {
 | |
|   max-width: 400px;
 | |
| }
 | |
| 
 | |
| .height-110 {
 | |
|   height: 110px;
 | |
| }
 | |
| 
 | |
| .bg-light, body {
 | |
|   background-color: #F8F9F1;
 | |
| }
 | |
| 
 | |
| .btn-dark {
 | |
|   background-color: #007488;
 | |
|   color: #FFF;
 | |
| }
 | |
| 
 | |
| .btn {
 | |
|   border: none;
 | |
|   padding: 0.7rem 1rem;
 | |
|   border-radius: 0.75rem;
 | |
|   font-weight: 700;
 | |
|   font-size: inherit;
 | |
|   text-transform: capitalize;
 | |
|   cursor: pointer;
 | |
|   &:hover {
 | |
|     background-color: #007488CC;
 | |
|   }
 | |
| }
 |