html {
    font-family: sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    font-size: 62.5%;
    -webkit-tap-highlight-color: rgba(0,0,0,0)
}

body {
    margin: 0;
    font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
    font-size: 21px;
    line-height: 1.42857143;
    color: #333;
    background-color: #fff
}

a {
    background: 0 0
}

a:active,a:hover {
    outline: 0
}

strong {
    font-weight: 700;
    color: #000
}

h1.result {
    font-size: 180px;
    line-height: 240px
}

small {
    font-size: 75%
}

input {
    color: inherit;
    font: inherit;
    margin: 0;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit
}

button::-moz-focus-inner,input::-moz-focus-inner {
    border: 0;
    padding: 0
}

@media print {
    * {
        text-shadow: none!important;
        color: #000!important;
        background: 0 0!important;
        box-shadow: none!important
    }

    a,a:visited {
        text-decoration: underline
    }

    a[href]:after {
        content: " (" attr(href) ")"
    }

    h2,h3,p {
        orphans: 3;
        widows: 3
    }

    h2,h3 {
        page-break-after: avoid
    }
}

*,:after,:before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

a {
    color: #222;
    text-decoration: none
}

a:focus,a:hover {
    color: #000;
    text-decoration: underline
}

a:focus {
    outline: thin dotted;
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px
}

h1,h2,h3 {
    line-height: 1.1;
    color: inherit
}

h1 {
    letter-spacing: -3px;
    font-weight: 700;
    font-size: 76px;
    margin: 80px 0 0;
    font-family: 'Open Sans'
}

h2,h3 {
    font-family: inherit;
    font-weight: 400;
    font-size: 25px;
    margin: 0
}

.weather h2 {
    width: 80%;
    margin: 0 auto;
}

h3 {
    font-weight: 500;
    font-size: 23px;
    margin: 80px 0 5px
}

p {
    margin: 0 0 15px
}

.container {
    margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px
}

@media (min-width:768px) {
    .container {
        width: 750px
    }
}

@media (min-width:992px) {
    .container {
        width: 970px
    }
}

@media (min-width:1200px) {
    .container {
        width: 1170px
    }
}

.row {
    margin-left: -15px;
    margin-right: -15px
}

.col-md-12 {
    position: relative;
    min-height: 1px;
    padding-left: 15px;
    padding-right: 15px
}

@media (min-width:992px) {
    .col-md-12 {
        float: left;
        width: 100%
    }
}

.form-control::-moz-placeholder {
    color: #999;
    opacity: 1
}

.form-control:-ms-input-placeholder {
    color: #999
}

@-ms-viewport {
    width:device-width
}

body .container {
    max-width: 920px
}

.center {
    text-align: center;
    margin: 15px 0
}

input.city {
    line-height: normal;
    width: 380px;
    border: 0;
    margin: 0 0 0 3px;
    padding: 0;
    border-radius: 0;
    -webkit-border-radius: 0;
    -webkit-appearance: none;
    letter-spacing: -3px
}

@media (max-width:991px) {
    body {
        font-size: 19px
    }

    h1 {
        font-size: 65px;
        margin-top: 60px
    }

    h2 {
        font-size: 23px;
    }

    h3 {
        font-size: 21px;
        margin-top: 70px
    }

    input.city {
        width: 282px
    }
}

@media (max-width:768px) {
    body {
        font-size: 18px
    }

    h1 {
        font-size: 44px;
        margin-top: 50px
    }

    h2 {
        font-size: 21px;
        max-width: 90%;
        margin-left: auto;
        margin-right: auto
    }

    h3 {
        font-size: 19px;
        margin-top: 60px
    }

    input.city {
        width: 190px
    }
}

@media (max-width:500px) {
    body {
        font-size: 16px
    }

    h1 {
        font-size: 34px;
        margin-top: 0
    }

    h2,h3 {
        font-size: 18px
    }

    h2 {
        max-width: 95%
    }

    h3 {
        margin-top: 50px
    }

    input.city {
        width: 115px
    }
}

@font-face {
    font-family:'Open Sans';font-style:normal;font-weight:400;src:local('Open Sans'),local('OpenSans'),url(//fonts.gstatic.com/s/opensans/v10/cJZKeOuBrn4kERxqtaUH3aCWcynf_cDxXwCLxiixG1c.ttf) format('truetype')
}

@font-face {
    font-family:'Open Sans';font-style:normal;font-weight:700;src:local('Open Sans Bold'),local('OpenSans-Bold'),url(//fonts.gstatic.com/s/opensans/v10/k3k702ZOKiLJc3WVjuplzInF5uFdDttMLvmWuJdhhgs.ttf) format('truetype')
}