/*Color list = #03738C  #0DA697  #1FBFA2 #96D9CC #F2F2F2 */

body {

}

img {
    width: 100%;
}

.container {
    max-width: 960px;
    margin: 0 auto;
}

.h1 {
    color: #03738c;
    font-family: operetta-12, serif;
    font-weight: 700;
    font-style: normal;    
}
        
.h2 {
    color: blue;
    font-family: operetta-12, serif;
    font-weight: 700;
    font-style: normal;
}
.tips {
     color: blue;
}
li {
    color: #0DA697;
    font-family: atten-new, sans-serif;
    font-weight: 400;
    font-style: normal;
}
p {
    color: #0DA697 ;
    font-family: atten-new, sans-serif;
    font-weight: 400;
    font-style: normal;
}

h3 {
    color: #03738C;
    font-family: operetta-12, serif;
    font-weight: 700;
    font-style: normal;
}

h4 {
   color: #03738C;
    font-family: operetta-12, serif;
    font-weight: 700;
    font-style: normal; 
}

body {
    background-color:#F2F2F2;
}

img {
    border-style: outset;
    border-color: #0DA697;
}

/*style the tab */
.tab {
    overflow: hidden;
    border:none;
    background-color: #96D9CC;
    font-family: operetta-12, serif;
    font-weight: 700;
    font-style: normal;
}

/* Style buttons */
.tab button {
    background-color: #0DA697;
    float: left;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 14px 16px;
    transition: 0.3s;
}

/* change hover color tab */
.tab button:hover {
    background-color: #F2F2F2;
}

/* active/current tab */
.tab button.active {
    background-color: #fff;
}

/* Style content */
.tabcontent {
    display: none;
    padding: 6px 12px;
    border: 1px solid #ccc;
    border-top: none;
}

/* display the first tabcontent*/
.first_tabcontent {
    display: block;
}

.tabcontent p {
    max-width: 600px;
    margin-left: 20px;
}

.tabcontent li {
    max-width: 600px;
    margin-left: 20px;
}

/*image code*/ 

.img {
    width: 100%;
}

footer {
    text-align: center;
    padding: 40px;
}