* {
    padding: 0;
    margin: 0;
}

body { background-color: #189ada; }

.cls-pt-1 { padding-top: 10px; }
.cls-pt-2 { padding-top: 20px; }
.cls-pt-3 { padding-top: 30px; }
.cls-pt-4 { padding-top: 40px; }

.cls-pb-1 { padding-bottom: 10px; }
.cls-pb-2 { padding-bottom: 20px; }
.cls-pb-3 { padding-bottom: 30px; }
.cls-pb-4 { padding-bottom: 40px; }

.cls-pl-1 { padding-left: 10px; }
.cls-pl-2 { padding-left: 20px; }
.cls-pl-3 { padding-left: 30px; }
.cls-pl-4 { padding-left: 40px; }

.cls-pr-1 { padding-right: 10px; }
.cls-pr-2 { padding-right: 20px; }
.cls-pr-3 { padding-right: 30px; }
.cls-pr-4 { padding-right: 40px; }

.cls-d-flex { display: flex; }

.cls-fd-column { flex-direction: column; }

.cls-jc-center { justify-content: center; }
.cls-ai-center { align-items: center; }

.cls-w-100-vw { width: 100vh; }
.cls-h-100-vh { height: 100vh; }

.cls-w-100-per { width: 100%; }
.cls-h-100-per { height: 100%; }

.cls-w-100-px { width: 150px; }
.cls-h-100-px { height: 150px; }

.cls-w-500-px { width: 500px; }
.cls-h-500-px { height: 500px; }

.cls-mw-500-px { max-width: 500px; }

.cls-mh-auto { max-height: auto; }

.cls-c-white { color: #fff; }

.cls-ff-lato { font-family: 'Lato', sans-serif; }
.cls-fs-17-rem { font-size: 1.7rem; }
.cls-fw-400 { font-weight: 400; }

.cls-text-center { text-align: center; }