* {
    margin  : 0;
    padding : 0;
    }

body, html {
    height      : 100%;
    font-family : 'Open Sans', sans-serif;
    }

body {
    background-image        : url('background_new.jpg');
    background-repeat       : no-repeat;
    -webkit-background-size : cover;
    background-size         : cover;
    background-attachment   : fixed;
    overflow-y              : scroll;
    }

.wrapper {
    -moz-box-sizing         : border-box;
    -webkit-box-sizing      : border-box;
    box-sizing              : border-box;
    display                 : table;
    width                   : 100%;
    height                  : 100%;
    background-image        : url('hand-fr.png');
    background-repeat       : no-repeat;
    background-position     : 81% 100%;
    -webkit-background-size : 31%;
    background-size         : 31%;
    }

.header img {
    width      : 130px;
    margin-top : 10%;
    }

.header {
    max-width   : 420px;
    margin-left : 14%;
    text-align  : left;
    }

.content {
    display : table-row;
    height  : 100%;
    color   : #fff;
    }

.content i {
    font-size : 27px;
    }

.content div {
    max-width         : 420px;
    margin-left       : 14%;
    margin-top        : 6%;
    -webkit-transform : translateY(-11%);
    -moz-transform    : translateY(-11%);
    -ms-transform     : translateY(-11%);
    -o-transform      : translateY(-11%);
    transform         : translateY(-11%);
    }

.content span {
    display       : block;
    margin-top    : 6%;
    margin-bottom : 6%;
    }

.content div a img {
    display      : inline-block;
    width: 130px;
    margin-right : 5px;
    margin-top   : 3%;
    }
a {
    text-decoration: none;
    }

.footer {
    display          : table-row;
    height           : 80px;
    background-color : #21262c;
    text-align       : center;
    color            : #76797c;
    font-size        : 12px;
    }

.footer span {
    margin-top : 21px;
    display    : inline-block;
    }

@media (max-width : 1024px) {
    .header img {
        margin-top: 10%;
        }
    .content div {
        max-width  : 460px;
        margin-top : 11%;
        }

    .header {
        max-width : 460px;
        }

    .content i {
        font-size : 35px;
        }

    .content span {
        font-size : 20px;
        }

    .wrapper {
        -webkit-background-size : 45%;
        background-size         : 45%;
        }

    .content div {
        margin-top : 8%;
        }
    .content i {
        font-size: 27px;
        }
    }

@media (max-width : 768px) {
    .content div {
        margin-top : 10%;
        }
    }

@media (max-width : 570px) {
    .content div {
        margin     : 0 auto;
        margin-top : 10%;
        }

    .header img {
        /*margin-left : 60px;*/
        margin-top : 10%;
        }

    .header {
        margin : 0 auto;
        }
    .wrapper {
        background-size         : 41%;

        }
    }

@media (max-width : 435px) {
    .content div {
        margin        : 0 auto;
        padding-left  : 20px;
        padding-right : 20px;
        margin-top    : 15%;
        }

    .content i {
        font-size : 17px;
        }

    .content span {
        font-size : 13px;
        }

    .content div a img {
        display : block;
        width: 115px !important;

        }

    .wrapper {
        background-position     : 81% 90%;
        -webkit-background-size : 65%;
        background-size         : 45%;
        }

    .header {
        margin        : 0 auto;
        padding-left  : 20px;
        padding-right : 20px;
        }
    }

@media (max-height : 435px) {
    .content div {
        margin-top : 10%;
        }

    .content i {
        font-size : 29px;
        }

    .content span {
        font-size : 15px;
        }

    .wrapper {
        -webkit-background-size : 35%;
        background-size         : 35%;
        background-position     : 96% 93%;
        }

    .header img {
        /*margin-left : 20px;*/
        }
    }