Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
Scribd
Upload
95 views

Style - CSS#: Text-Decoration Margin Padding

This document contains the CSS stylesheet for styling elements on a webpage. It includes selectors for general elements like body and paragraphs as well as more specific elements like the navigation menu, sections, and footer. Styles like colors, fonts, sizing, and positioning are defined.

Uploaded by

Nofrinto Flory
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
95 views

Style - CSS#: Text-Decoration Margin Padding

This document contains the CSS stylesheet for styling elements on a webpage. It includes selectors for general elements like body and paragraphs as well as more specific elements like the navigation menu, sections, and footer. Styles like colors, fonts, sizing, and positioning are defined.

Uploaded by

Nofrinto Flory
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 6

Style.

css#

* {
    text-decoration: none;
    margin: 0px;
    padding: 0px;
}
body {
    margin: 0px;
    padding: 0px;
    font-family: 'open sans',sans-serif;
}

.wrapper {
    width: 1100px;
    margin: auto;
    position: relative;
}

.logo a {
    font-size: 50px;
    font-weight: 800;
    float: left;
    font-family: courier;
    color: 364f6b;
}

.menu {
    float: right;
}

nav {
    width: 100%;
    margin: auto;
    display: flex;
    line-height: 80px;
    position: sticky;
    position: -webkit-sticky;
    top: 0;
    background: #ffffff;
    z-index: 1;
    border-bottom: 1px solid #364f6b;
}
nav ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;

nav ul li {
    float: left;
}

nav ul li a{
    color: black;
    font-weight: bold;
    text-align: center;
    padding: 0px 16px 0px 16px;
    text-decoration: none;

}
nav ul li a:hover{
    text-decoration: underline;
}

section {
    margin: auto;
    display: flex;
    margin-bottom: 5opx;
}

.colom {
    margin: 50px;
    margin-bottom: 50px;
}

.colom .deskripsi {
font-size: 20px;
font-weight: bold;
font-family: 'comic sans ms';
color: #364f6b;
}

h2 {
    font-family: 'comic sans ms';
    font-weight: 800;
    font-size: 45px;
    margin-bottom: 20px;
    color: #364f6b;
    width: 100%;
    line-height: 50px;  
}

a.tbl-biru {
    background: #3f72af;
    border-radius:20px ;
    margin-top:20px ;
    padding: 15px 20px 15px 20px;
    color: #ffffff;
    cursor: pointer;
    font-weight: bold;
}

a.tbl-biru:hover {
    background: #fc5185;
    text-decoration: none;
}

a.tbl-pink {
   
    background: #fc5185;
    border-radius:20px ;
    margin-top:20px ;
    padding:15px 20px 15px 20px;
    color: #ffffff;
    cursor: pointer;
    font-weight: bold; 
}

a.tbl-pink:hover {
    background: #3f72af;
    text-decoration: none;
}

p {
    margin: 10px 0px 10px 0px;
    padding: 10px 0px 10px 0px;
}

.tengah {
    text-align: center;
    width: 100%;
}

.tutors-list {
    width: 100%;
    position: relative;
    display: flex;
    flex-wrap: wrap;
}

.kartu-tutor {
    width: 20%;
    margin: 0 auto;
}

.kartu-tutor img {
    width: 80%;
    border-radius: 50%;
}

.kartu-tutor p {
    font-family: 'comic sans ms';
    font-weight: 800;
    font-size: 25px;
    text-align: center;
    color: #364f6b;

.partners-list {
    width: 100%;
    position: relative;
    display: flex;
    flex-wrap: wrap;
}

.kartu-partners {
    width: 20%;
    margin:0 auto;
}

.kartu-partners img {
width: 150px;
border-radius: 50%;
}
#contact {
    background: #dedede;
    padding:50px 0px 50px 0px;
}

.footer {
    width: 100%;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    margin: auto;
}

.footer-section {
    width: 20%;
    margin:0 auto;
}

h3 {
    font-family: 'comic sans ms';
    font-weight: 800;
    font-size: 30px;
    margin-bottom: 20px;
    color: #364f6b;
    width: 100%;
    line-height: 50px;
}

#copyright {
    text-align: center;
    width: 100%;
    padding: 50px 0px 50px 0px;
    margin-top: 50px;
}

@media screen and (max-width: 991.98px) {
    .wrapper {
        width: 90%;
    }
}

.logo a {
    display: block;
    width: 100%;
    text-align: center;
}

nav .menu {
    width: 100%;
    margin: 0;
}

nav .menu ul {
    text-align: center;
    margin: auto;
    line-height: 60px;
}

nav .menu ul li {
    display: inline-block;
    float: none;
}

section {
    display: block;
}

section img {
    display: block;
    width: 100%;
    height: auto;
}

.kartu-tutor {
    width: 50%;
}

.kartu-partners {
    width: 50%;
}

You might also like