@font-face {
    font-family: 'Open Sans Light';
    font-style: normal;
    font-weight: 300;
    src: local('Open Sans Light'), local('OpenSans-Light'), url(https://fonts.gstatic.com/s/opensans/v13/DXI1ORHCpsQm3Vp6mXoaTXhCUOGz7vYGh680lGh-uXM.woff) format('woff');
}

@font-face {
    font-family: OpenSans-Regular;
    font-style: normal;
    font-weight: 400;
    src: local('Open Sans'), local('OpenSans'), url(https://fonts.gstatic.com/s/opensans/v13/cJZKeOuBrn4kERxqtaUH3T8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
}

@font-face {
    font-family: 'Open Sans Semibold';
    font-style: normal;
    font-weight: 600;
    src: local('Open Sans Semibold'), local('OpenSans-Semibold'), url(https://fonts.gstatic.com/s/opensans/v13/MTP_ySUJH_bn48VBG8sNSnhCUOGz7vYGh680lGh-uXM.woff) format('woff');
}


.fonth1 {
    font-family: OpenSans-Regular;
    font-size: 36px;
    font-weight: bold;
    color: #565656;
}

.fonth2 {
    font-family: OpenSans-Regular;
    font-size: 16px;
    color: #565656;
}

button {
    font-family: 'Open Sans Semibold';
    border: none;
    color: white;
    padding: 16px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    transition-duration: 0.4s;
    cursor: pointer;
    line-height: 0;
    width: 210px;
    height: 35px;
}

.button1 {
    background-image: linear-gradient(#FFA174, #FAAF1C);
    color: white;
    text-align: center;
}

    .button1:hover {
        background-image: linear-gradient(#FFC388, #FAAF1C);
        color: white;
    }

    .button1:active {
        background-image: linear-gradient(#F39550, #FAAF1C);
        color: white;
    }

.button2 {
    background-color: white;
    color: #565656;
    border: 1px solid #565656;
}

    .button2:hover {
        background-color: #E0E0E0;
        color: #565656;
        border: 1px solid #565656;
    }

    .button2:active {
        background-color: #B4B4B4;
        color: #565656;
        border: 1px solid #565656;
    }