* {
    box-sizing: border-box;
}
a,
body,
div,
h1,
h2,
h3,
h4,
h5,
h6,
html,
img,
li,
ol,
p,
span,
ul {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    background: transparent;
}
html,
body,
#page,
#content-container,
#content,
#body-wrapper {
    height: 100%;
}
body {
    background: white;
    color: #0d0d0d;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    white-space: inherit;
    overflow: inherit;
    text-overflow: inherit;
    -webkit-font-smoothing: antialiased;
}
#header {
    height: 56px;
    padding: 16px 24px;
    background-color: rgba(256, 256, 256, 0.98);
    position: relative;
}
a {
    text-decoration: none;
    cursor: pointer;
}
#logo-icon {
    position: absolute;
    top: 18px;
    left: 24px;
}
.rtl #logo-icon {
    left: initial;
    right: 24px;
}
#body-wrapper {
    height: auto;
    min-height: 100%;
    padding-bottom: 65px;
    position: relative;
}
#main-content {
    max-width: 1068px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -178px 0 0 -534px;
}
.rtl #main-content {
    left: initial;
    right: 50%;
    margin: -178px -534px 0 0;
}
#main-content.gt-four-browsers {
    margin-top: -254px;
}
#art {
    display: inline-block;
    float: left;
}
.rtl #art {
    float: right;
}
#info {
    display: inline-block;
    margin-left: 48px;
    max-width: 592px;
}
.rtl #info {
    margin-left: inherit;
    margin-right: 48px;
}
h1 {
    font-weight: 500;
    margin-bottom: 16px;
    font-size: 32px;
    line-height: 48px;
}
p {
    margin-bottom: 24px;
    line-height: 21px;
}
#browsers-list {
    list-style: none;
}
.browser {
    display: inline-block;
    width: 136px;
    height: 136px;
    margin: 0 16px 16px 0;
    background: #f3f3f3;
    border-radius: 4px;
}
.rtl .browser {
    margin: 0 0 16px 16px;
}
.browser.last {
    margin-right: 0;
}
.rtl .browser.last {
    margin-right: inherit;
    margin-left: 0;
}
.browser > a {
    display: block;
    width: 100%;
    height: 100%;
    padding: 16px;
    color: #0d0d0d;
}
.browser > a:visited {
    color: #0d0d0d;
}
.browser img {
    margin: 0 16px 8px 16px;
}
.browser h3 {
    font-size: 14px;
    font-weight: 500;
    line-height: 16px;
    text-align: center;
}
@media (max-width: 1127px) {
    #main-content {
        max-width: 1030px;
    }
    #art {
        width: 390px;
        height: 260px;
    }
}
@media (max-width: 1069px) {
    #main-content {
        position: relative;
        top: inherit;
        left: inherit;
        margin: 0 auto;
        max-width: 640px;
        text-align: center;
    }
    .rtl #main-content {
        right: inherit;
        margin: 0 auto;
    }
    #main-content.gt-four-browsers {
        margin-top: 0;
    }
    #art,
    .rtl #art {
        float: none;
    }
    #info {
        margin-bottom: 24px;
        margin-left: 0;
    }
    .rtl #info {
        margin-left: inherit;
        margin-right: 0;
    }
}
@media (max-width: 647px) {
    #main-content {
        margin: 16px auto;
        max-width: 440px;
    }
    #art {
        width: 360px;
        height: 240px;
    }
    #browsers-list {
        margin-right: -16px;
        text-align: left;
    }
    .rtl #browsers-list {
        margin-right: inherit;
        margin-left: -16px;
        text-align: right;
    }
    #footer {
        position: relative;
    }
}
@media (max-width: 491px) {
    #main-content {
        max-width: 288px;
    }
    h1 {
        font-size: 32px;
        line-height: 40px;
    }
    #art {
        width: 300px;
        height: 200px;
    }
}