html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;}body{margin:0;}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block;}audio,canvas,progress,video{display:inline-block;vertical-align:baseline;}audio:not([controls]){display:none;height:0;}[hidden],template{display:none;}a{background-color:transparent;}a:active,a:hover{outline:0;}abbr[title]{border-bottom:1px dotted;}b,strong{font-weight:bold;}dfn{font-style:italic;}h1{font-size:2em;margin:.67em 0;}mark{background:#ff0;color:#000;}small{font-size:80%;}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}sup{top:-0.5em;}sub{bottom:-0.25em;}img{border:0;}svg:not(:root){overflow:hidden;}figure{margin:1em 40px;}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0;}pre{overflow:auto;}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em;}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0;}button{overflow:visible;}button,select{text-transform:none;}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer;}button[disabled],html input[disabled]{cursor:default;}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0;}input{line-height:normal;}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto;}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em;}legend{border:0;padding:0;}textarea{overflow:auto;}optgroup{font-weight:bold;}table{border-collapse:collapse;border-spacing:0;}td,th{padding:0;}html{font-size:62.5%;}body{font-size:1.5em;line-height:1.6;font-weight:400;font-family:"Raleway","HelveticaNeue","Helvetica Neue",Helvetica,Arial,sans-serif;color:#222;}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:2rem;font-weight:300;}h1{font-size:4rem;line-height:1.2;letter-spacing:-.1rem;}h2{font-size:3.6rem;line-height:1.25;letter-spacing:-.1rem;}h3{font-size:3rem;line-height:1.3;letter-spacing:-.1rem;}h4{font-size:2.4rem;line-height:1.35;letter-spacing:-.08rem;}h5{font-size:1.8rem;line-height:1.5;letter-spacing:-.05rem;}h6{font-size:1.5rem;line-height:1.6;letter-spacing:0;}@media(min-width:550px) {
    h1 {
        font-size: 5rem;
    }

    h2 {
        font-size: 4.2rem;
    }

    h3 {
        font-size: 3.6rem;
    }

    h4 {
        font-size: 3rem;
    }

    h5 {
        font-size: 2.4rem;
    }

    h6 {
        font-size: 1.5rem;
    }
}

p {
    margin-top: 0;
}

.button, button, input[type="submit"], input[type="reset"], input[type="button"] {
    display: inline-block;
    height: 38px;
    padding: 0 30px;
    color: #555;
    text-align: center;
    font-size: 11px;
    font-weight: 600;
    line-height: 38px;
    letter-spacing: .1rem;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #bbb;
    cursor: pointer;
    box-sizing: border-box;
}

    .button:hover, button:hover, input[type="submit"]:hover, input[type="reset"]:hover, input[type="button"]:hover, .button:focus, button:focus, input[type="submit"]:focus, input[type="reset"]:focus, input[type="button"]:focus {
        color: #333;
        border-color: #888;
        outline: 0;
    }

    .button.button-primary, button.button-primary, input[type="submit"].button-primary, input[type="reset"].button-primary, input[type="button"].button-primary {
        color: #FFF;
        background-color: #33c3f0;
        border-color: #33c3f0;
    }

        .button.button-primary:hover, button.button-primary:hover, input[type="submit"].button-primary:hover, input[type="reset"].button-primary:hover, input[type="button"].button-primary:hover, .button.button-primary:focus, button.button-primary:focus, input[type="submit"].button-primary:focus, input[type="reset"].button-primary:focus, input[type="button"].button-primary:focus {
            color: #FFF;
            background-color: #1eaedb;
            border-color: #1eaedb;
        }

.container {
    margin-top: 50px;
}

.block {
    display: block;
}

.text-center {
    text-align: center;
}

.text-left {
    text-align: left;
}

.text-right {
    text-align: right;
}

.m-none {
    margin: 0;
}

.button, button, input[type="submit"], input[type="reset"], input[type="button"] {
    height: auto;
    line-height: 1.6;
}

[class^="flaticon-"]:before, [class*=" flaticon-"]:before, [class^="flaticon-"]:after, [class*=" flaticon-"]:after {
    margin-left: 0;
}

.feedback-categories {
    display: inline-block;
    width: 100%;
}

.feedback-category {
    float: left;
    text-align: center;
    width: 18%;
    margin: 0 .7%;
    padding: 0;
    border-radius: 4px;
    border: 1px solid #bbb;
    cursor: pointer;
}

    .feedback-category:hover {
        border-color: #888;
    }

.emotion a {
    text-decoration: none;
    text-color: #393939;
}

.emotion__icon {
    width: 50%;
    margin: 0 auto;
}

.emotion .emotion__icon:after, .emotion .emotion__icon:before {
    font-size: 8rem;
}

.emotion__counter {
    display: block;
    font-size: 1.7rem;
}

.emotion--happy .emotion__icon {
    color: #f77070;
}

.emotion--happy svg {
    fill: #f77070;
}

.emotion--happy:hover {
    border-color: #f77070;
}

.emotion--indifferent .emotion__icon {
    color: #79c8a0;
}

.emotion--indifferent svg {
    fill: #79c8a0;
}

.emotion--indifferent:hover {
    border-color: #79c8a0;
}

.emotion--amused .emotion__icon {
    color: #5e7aa3;
}

.emotion--amused svg {
    fill: #5e7aa3;
}

.emotion--amused:hover {
    border-color: #5e7aa3;
}

.emotion--excited .emotion__icon {
    color: #a66ec3;
}

.emotion--excited svg {
    fill: #a66ec3;
}

.emotion--excited:hover {
    border-color: #a66ec3;
}

.emotion--angry .emotion__icon {
    color: #d0cf66;
}

.emotion--angry svg {
    fill: #d0cf66;
}

.emotion--angry:hover {
    border-color: #d0cf66;
}

.emotion--description {
    text-transform: uppercase;
}

.emotion .emotion__icon {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -moz-osx-font-smoothing: grayscale;
    -webkit-transition-duration: .3s;
    transition-duration: .3s;
    -webkit-transition-property: transform;
    transition-property: transform;
}

.emotion:hover .emotion__icon {
    -webkit-transform: scale(1.07);
    transform: scale(1.07);
}

.reaction-text {
    text-transform: uppercase;
    font-weight: 600;
}

.powered {
    color: #636363;
    font-size: 1.3rem;
}

.hvr-radial-out {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    box-shadow: 0 0 1px rgba(0,0,0,0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    overflow: hidden;
    background: transparent;
    -webkit-transition-property: color;
    transition-property: color;
    -webkit-transition-duration: .3s;
    transition-duration: .3s;
}

    .hvr-radial-out:before {
        content: "";
        position: absolute;
        z-index: -1;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: #2098d1;
        border-radius: 100%;
        -webkit-transform: scale(0);
        transform: scale(0);
        -webkit-transition-property: transform;
        transition-property: transform;
        -webkit-transition-duration: .3s;
        transition-duration: .3s;
        -webkit-transition-timing-function: ease-out;
        transition-timing-function: ease-out;
    }

    .hvr-radial-out:hover {
        color: white;
    }

        .hvr-radial-out:hover svg, .hvr-radial-out:focus svg, .hvr-radial-out:active svg {
            fill: white;
        }

        .hvr-radial-out:hover:before, .hvr-radial-out:focus:before, .hvr-radial-out:active:before {
            -webkit-transform: scale(2);
            transform: scale(2);
        }

.emotion--happy.hvr-radial-out:before {
    background: #f77070;
}

.emotion--happy.active {
    background: #f77070;
    color: #fff;
}

    .emotion--happy.active svg {
        fill: #fff;
    }

.emotion--indifferent.hvr-radial-out:before, .emotion--indifferent.active {
    background: #79c8a0;
}

.emotion--indifferent.active {
    background: #79c8a0;
    color: #fff;
}

    .emotion--indifferent.active svg {
        fill: #fff;
    }

.emotion--amused.hvr-radial-out:before, .emotion--amused.active {
    background: #5e7aa3;
}

.emotion--amused.active {
    background: #5e7aa3;
    color: #fff;
}

    .emotion--amused.active svg {
        fill: #fff;
    }

.emotion--excited.hvr-radial-out:before, .emotion--excited.active {
    background: #a66ec3;
}

.emotion--excited.active {
    background: #a66ec3;
    color: #fff;
}

    .emotion--excited.active svg {
        fill: #fff;
    }

.emotion--angry.hvr-radial-out:before, .emotion--angry.active {
    background: #d0cf66;
}

.emotion--angry.active {
    background: #d0cf66;
    color: #fff;
}

    .emotion--angry.active svg {
        fill: #fff;
    }

@media(max-width:400px) {
    .emotion--description {
        font-size: 1rem;
    }
}

@media(min-width:400px) {
    .emotion--description {
        font-size: 1.2rem;
    }
}

@media(min-width:550px) {
    .emotion--description {
        font-size: 1.2rem;
    }
}

@media(min-width:750px) {
    .emotion--description {
        font-size: 1.4rem;
    }

    .feedback-category {
        width: 18.2%;
        margin: 0 .7%;
    }
}

@media(min-width:1000px) {
    .feedback-category {
        width: 18.35%;
        margin: 0 .7%;
    }
}