@import url(//fonts.googleapis.com/css?family=Nunito+Sans);
@import url(//fonts.googleapis.com/css?family=Nunito+Sans:800);
@import url(//fonts.googleapis.com/css?family=MedievalSharp);
@import url(//fonts.googleapis.com/css?family=Lobster);
@import url(//fonts.googleapis.com/css?family=Anton);

.menu ul a,
a,
p {
    text-decoration: none
}

#contactfield,
:focus {
    outline: 0 !important
}

h6,
h6 i {
    color: #f5f5f5 !important
}

.header li a:hover,
.menu ul a:hover {
    -moz-transition: all .2s ease-in;
    -o-transition: all .2s ease-in
}

*,
::after,
::before {
    box-sizing: border-box
}

body {
    margin: 0;
    background-color: #fffcf5;
    font-family: 'Nunito Sans', sans-serif;
    overflow-x: hidden;
    position: relative;
    z-index: 0
}

.header .menu,
.menu__content>ul,
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: Lobster, cursive !important
}

a {
    color: inherit;
    font-weight: 700
}

p {
    font-size: 16px;
    font-weight: 500;
    color: #7c5247;
    text-decoration-color: none;
    text-decoration-style: none
}

@media (max-width:421px) {
    p {
        font-size: 15px !important;
        font-weight: 500 !important;
        color: #7c5247;
        text-decoration: none;
        text-decoration-color: none;
        text-decoration-style: none
    }
}

.btnPurple.btnFloat:before,
.button,
.homebutton,
.instabutton,
a.button,
a.homebutton,
a.instabutton {
    text-decoration-style: none !important
}

h1,
h2,
h3,
h4,
h5 {
    font-size: 34px !important;
    color: #7c5247 !important
}

h1,
h2 {
    font-weight: 800
}

h3,
h4,
h5,
h6 {
    font-weight: 600
}

h5 {
    text-align: left
}

h6 {
    font-size: 28px !important
}

@media (max-width:480px) {

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        font-family: Lobster, cursive !important;
        font-size: 22px !important
    }

    h1,
    h2,
    h3,
    h4,
    h5 {
        color: #7c5247 !important
    }

    h1,
    h2 {
        font-weight: 800
    }

    h3,
    h4,
    h5,
    h6 {
        font-weight: 600
    }

    h5 {
        text-align: left
    }

    h6 {
        color: #f5f5f5 !important
    }
}

canvas {
    position: fixed;
    z-index: -1;
    top: 0;
    left: 0
}

.header,
.menu--fade {
    z-index: 9;
    position: fixed
}

.active-page {
    color: #f8fc27 !important
}

@media (min-width:835px) {
    #logo1 {
        display: none
    }

    .header {
        margin-top: -16px !important;
        background-image: url(img/MediumDrips.png);
        background-repeat: no-repeat;
        background-size: cover;
        position: fixed;
        width: 100%;
        z-index: 99999999;
        text-align: center !important
    }
}

@media (max-width:834px) {
    .logo2 {
        display: none !important
    }
}

.header .logo,
.header .logo2,
.header li a {
    display: block;
    text-decoration: none
}

.header {
    background-image: url(img/MediumDrips.png);
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    text-align: center !important
}

.header .logo,
.header .logo2,
.menu ul a,
.menu--fade,
.menu__content,
.menu__content>ul {
    text-align: center
}

.logo img {
    margin-top: -4% !important;
    max-width: 98px
}

.logo2 img {
    max-width: 165px !important
}

.header ul {
    margin: 0;
    padding: 0;
    list-style: none;
    overflow: hidden
}

.header li a {
    padding: 20px;
    color: #e8ffa8d8
}

.header li a:hover {
    color: #f8e978c4;
    text-shadow: 0 0 1px #f8e978c4;
    -webkit-transition: all .2s ease-in;
    transition: all .2s ease-in
}

.header .menu-btn:hover,
.header li a:hover {
    background-color: transparent
}

.header .logo {
    font-size: 2em;
    padding: 1%;
    margin-bottom: -4px
}

@media (max-width:480px) {
    .header .logo {
        display: block;
        font-size: 2em;
        text-decoration: none;
        margin-bottom: -10% !important
    }
}

.header .logo2 {
    float: left;
    font-size: 2em;
    padding: 2px 10px;
    margin-bottom: -4px
}

.header .menu {
    clear: both;
    max-height: 0;
    transition: max-height .2s ease-out;
    padding-top: 5px;
    font-size: 20px
}

@media (max-width:480px) {
    .header .menu {
        clear: both;
        max-height: 0;
        transition: max-height .3s ease-out;
        margin-bottom: 3%;
        font-size: 20px !important
    }
}

#creamwave,
#creamwave4 {
    margin-bottom: -1px !important
}

.header .menu-icon {
    cursor: pointer;
    display: inline-block;
    float: right;
    padding: 18px;
    margin-top: -12px;
    position: relative;
    user-select: none
}

.header .menu-icon .navicon {
    background: #f3ffd2;
    display: block;
    height: 2px;
    position: relative;
    transition: background .2s ease-out;
    width: 26px
}

.header .menu-icon .navicon:after,
.header .menu-icon .navicon:before {
    background: #f3ffd2;
    content: '';
    display: block;
    height: 100%;
    position: absolute;
    transition: all .2s ease-out;
    width: 100%
}

.header .menu-icon .navicon:before {
    top: 5px
}

.header .menu-icon .navicon:after {
    top: -5px
}

.header .menu-btn {
    display: none
}

.header .menu-btn:checked~.menu {
    max-height: 500px !important
}

.header .menu-btn:checked~.menu-icon .navicon {
    background: 0 0
}

.header .menu-btn:checked~.menu-icon .navicon:before {
    transform: rotate(-45deg)
}

.header .menu-btn:checked~.menu-icon .navicon:after {
    transform: rotate(45deg)
}

.header .menu-btn:checked~.menu-icon:not(.steps) .navicon:after,
.header .menu-btn:checked~.menu-icon:not(.steps) .navicon:before {
    top: 0
}

@media (min-width:481px) and (max-width:991px) {
    .header .menu-icon {
        cursor: pointer;
        display: inline-block;
        float: right;
        padding: 12px;
        margin-top: -55px;
        position: relative;
        user-select: none
    }

    .header .menu-icon .navicon {
        background: #f3ffd2;
        display: block;
        height: 2px;
        position: relative;
        transition: background .2s ease-out;
        width: 26px
    }
}

@media (min-width:991px) {
    .header li {
        float: left
    }

    .header li a {
        padding: 30px 50px
    }

    .header .menu {
        clear: none;
        max-height: none;
        display: inline-block;
        list-style-type: none
    }

    .dropin,
    .header .menu-icon {
        display: none
    }
}

.menu--fade {
    bottom: 0;
    right: 0;
    width: 0;
    height: 0;
    overflow: hidden;
    color: #eeffc1;
    -webkit-transition: opacity .3s, -webkit-transform .3s;
    transition: opacity .5s, transform .3s;
    -webkit-transform: scale(.98);
    -ms-transform: scale(.98);
    transform: scale(.98);
    opacity: 0
}

.menu ul a {
    color: #fff88f9d
}

.menu ul a:hover {
    color: #fdec6ee7;
    text-shadow: 0 0 2px #fdec6ede;
    -webkit-transition: all .2s ease-in;
    transition: all .2s ease-in
}

.menu__content {
    background: #15B5BB;
    width: 100%;
    height: 100%;
    position: relative
}

.menu__content>ul {
    font-size: 2em;
    padding: 8%;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.menu__content>ul a:hover {
    -moz-transition: all .2s ease-in;
    -o-transition: all .2s ease-in;
    transition: all .2s ease-in;
    -webkit-filter: brightness(100%);
    -webkit-transition: all .2s ease-in
}

.btnFloat:before,
.button,
.homebutton,
.instabutton,
a.button,
a.homebutton,
a.instabutton {
    transition: all .2s;
    text-decoration-color: none !important
}

.menu__close {
    z-index: 9999999999999;
    position: absolute;
    top: -15px;
    right: 10px;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    color: #eeffc1;
    text-decoration: none !important
}

.menu__close:active,
.menu__close:focus,
.menu__close:hover {
    text-decoration: none
}

#contactinfo,
#contactinfo a,
#contactinfo p,
#contactinfoc,
#contactinfoc a,
#contactinfoc p,
.btnPurple.btnFloat:before,
.button,
.homebutton,
.instabutton,
.wrapper2 a,
.wrapper2 p,
a.button,
a.homebutton,
a.instabutton {
    text-decoration: none !important
}

.menu__close:after {
    content: "+";
    font-size: 4rem;
    z-index: 9999999999999
}

#creamwave2,
#creamwave3 {
    content: url(img/creamwave2.png)
}

#creamwave,
#creamwave4,
#creamwavec {
    content: url(img/creamwave.png)
}

#menu-fade:target {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    opacity: 1;
    width: 100%;
    height: 100%
}

@media (max-width:991px) {
    .hero {
        background-image: url(img/teacup.png);
        background-size: cover;
        background-position: center;
        background-repeat: none !important;
        width: 100%;
        height: 90vh;
        z-index: 0
    }
}

@media (min-width:992px) and (max-width:1599px) {
    .hero {
        background-image: url(img/teacup.png);
        background-size: cover;
        background-repeat: none !important;
        background-position: center;
        width: 100%;
        height: 80vh;
        z-index: 9999999 !important
    }
}

@media (min-width:1600px) and (max-width:3001px) {
    .hero {
        background-image: url(img/teacup.png);
        background-size: cover;
        background-repeat: none !important;
        background-position: center;
        width: 100%;
        height: 100vh;
        z-index: 9999999 !important
    }
}

#whitedrip,
#whitedrip2 {
    z-index: 4;
    position: relative
}

#creamwave,
#creamwave2 {
    z-index: 3;
    position: relative;
    left: 0
}

@media (min-width:992px) {
    .herovhr {
        width: 30%;
        height: 2px solid;
        color: #7c5247 !important
    }

    #heroverse {
        position: relative;
        font-family: MedievalSharp, cursive;
        font-size: 1.5rem !important;
        font-weight: 500 !important;
        top: 20% !important;
        left: -20%;
        text-align: center;
        color: #57413b
    }
}

@media (max-width:480px) {

    #heroverse,
    .herovhr {
        color: #7c5247 !important
    }

    #heroverse {
        position: absolute;
        font-family: MedievalSharp, cursive;
        font-size: 1.3rem !important;
        font-weight: 500 !important;
        top: 2% !important;
        text-align: center;
        left: 1%
    }

    .herovhr {
        width: 40%;
        height: 2px solid
    }
}

@media (min-width:481px) and (max-width:991px) {

    #heroverse,
    .herovhr {
        color: #7c5247 !important
    }

    #heroverse {
        position: absolute;
        font-family: MedievalSharp, cursive;
        font-size: 1.3rem !important;
        font-weight: 500 !important;
        top: 2% !important;
        text-align: center;
        left: 5%
    }

    .herovhr {
        width: 40%;
        height: 2px solid
    }
}

.content,
.text {
    font-family: Montserrat, sans-serif
}

#whitedrip {
    content: url(http://www.sylwiasicecream.com/img/whitedrip.png);
    width: 100%;
    margin-bottom: -6% !important
}

#whitedrip2 {
    content: url(http://www.sylwiasicecream.com/img/whitedrip2.png);
    width: 100%;
    margin-top: -2%
}

@media (max-width:480px) {
    #cone {
        z-index: 3;
        height: auto;
        width: 100%;
        max-width: 60px !important;
        position: absolute;
        top: 76.5% !important;
        left: 0
    }
}

@media (min-width:481px) and (max-width:767px) {
    #cone {
        z-index: 3;
        height: auto;
        width: 100%;
        max-width: 120px;
        position: absolute;
        top: 60%;
        left: 0
    }
}

@media (min-width:768px) and (max-width:991px) {
    #cone {
        z-index: 3;
        height: auto;
        width: 100%;
        max-width: 180px;
        position: absolute;
        top: 40%;
        left: 0
    }
}

@media (min-width:992px) and (max-width:1199px) {
    #cone {
        z-index: 3;
        height: auto;
        width: 100%;
        max-width: 220px;
        position: absolute;
        top: 38%;
        left: 0
    }
}

@media (min-width:1200px) and (max-width:1999px) {
    #cone {
        z-index: 2;
        height: auto;
        width: 100%;
        max-width: 300px;
        position: absolute;
        top: 18%;
        left: 0
    }
}

@media (min-width:300px) and (max-width:360px) {
    #cone2 {
        z-index: 3;
        height: auto;
        width: 100%;
        max-width: 100px;
        position: absolute;
        top: 72%;
        right: 0
    }
}

@media (min-width:361px) and (max-width:380px) {
    #cone2 {
        z-index: 3;
        height: auto;
        width: 100%;
        max-width: 115px;
        position: absolute;
        top: 72.5% !important;
        right: 0
    }
}

@media (min-width:381px) and (max-width:480px) {
    #cone2 {
        z-index: 3;
        height: auto;
        width: 100%;
        max-width: 110px;
        position: absolute;
        top: 73%;
        right: 0
    }
}

@media (min-width:481px) and (max-width:767px) {
    #cone2 {
        z-index: 3;
        height: auto;
        width: 100%;
        max-width: 220px;
        position: absolute;
        top: 75.5%;
        right: 0
    }
}

@media (min-width:768px) and (max-width:991px) {
    #cone2 {
        z-index: 3;
        height: auto;
        width: 100%;
        max-width: 180px;
        position: absolute;
        top: 77%;
        right: 0
    }
}

@media (min-width:992px) and (max-width:1199px) {
    #cone2 {
        z-index: 3;
        height: auto;
        width: 100%;
        max-width: 215px;
        position: absolute;
        top: 72%;
        right: 0
    }
}

@media (min-width:1200px) and (max-width:1399px) {
    #cone2 {
        z-index: 1;
        height: auto;
        width: 100%;
        max-width: 240px;
        position: absolute;
        top: 72%;
        right: 0
    }
}

@media (min-width:1400px) and (max-width:1599px) {
    #cone2 {
        z-index: 1;
        height: auto;
        width: 100%;
        max-width: 350px;
        position: absolute;
        top: 69%;
        right: 0
    }
}

@media (min-width:1600px) and (max-width:1799px) {
    #cone2 {
        z-index: 1;
        height: auto;
        width: 100%;
        max-width: 350px;
        position: absolute;
        top: 69%;
        right: 0
    }
}

@media (min-width:1800px) and (max-width:1999px) {
    #cone2 {
        z-index: 1;
        height: auto;
        width: 100%;
        max-width: 350px;
        position: absolute;
        top: 69%;
        right: 0
    }
}

@media (min-width:2000px) and (max-width:3000px) {
    #cone2 {
        z-index: 2;
        height: auto;
        width: 100%;
        max-width: 350px;
        position: absolute;
        top: 69%;
        right: 0
    }
}

#creamwave {
    width: 100%
}

#creamwave2 {
    width: 100%;
    margin-top: -3px !important
}

#creamwave3 {
    z-index: 99999;
    width: 100%;
    position: absolute;
    left: 0;
    margin-top: -2px !important
}

#creamwave4 {
    z-index: 9999999999;
    width: 100%;
    position: relative;
    left: 0
}

#creamwavec {
    z-index: 1;
    width: 100%;
    left: 0;
    position: absolute
}

.content {
    display: block;
    position: relative;
    background-color: transparent;
    z-index: 1;
    padding: 5rem 4rem;
    text-align: left
}

@media (max-width:480px) {

    .content,
    .content p {
        display: block;
        position: relative;
        background-color: transparent;
        z-index: 1;
        padding: .1rem .5rem !important;
        text-align: left;
        color: #7c5247 !important;
        font-family: Montserrat, sans-serif;
        font-size: 15px !important
    }

    .content {
        font-weight: 500
    }
}

.btnFloat:before,
.btnTeal.btnFloat:before,
.button,
.homebutton,
a.button,
a.homebutton {
    font-family: Lobster, cursive !important
}

.wrapper,
.wrapper2 {
    max-width: 90%;
    border: 1px solid #fff;
    background-color: rgba(255, 130, 224, .192);
    box-shadow: 0 0 10px rgba(0, 0, 0, .1);
    overflow: hidden
}

.text {
    color: #fff;
    text-shadow: 0 0 1rem rgba(0, 0, 0, .25);
    position: absolute;
    bottom: 2rem
}

.wrapper {
    margin: 40px auto;
    padding: 5rem 14rem;
    height: 600px
}

@media (max-width:480px) {
    .wrapper {
        width: 400px !important;
        margin: 10px auto !important;
        padding: 10px !important;
        height: 530px !important;
        border: 1px solid #fff;
        background-color: rgba(255, 130, 224, .192);
        box-shadow: 0 0 10px rgba(0, 0, 0, .1);
        overflow: hidden
    }
}

@media (min-width:481px) and (max-width:767px) {
    .wrapper {
        width: 520px !important;
        margin: 10px auto !important;
        padding: 10px !important;
        height: 530px !important;
        border: 1px solid #fff;
        background-color: rgba(255, 130, 224, .192);
        box-shadow: 0 0 10px rgba(0, 0, 0, .1);
        overflow: hidden
    }
}

@media (min-width:768px) and (max-width:991px) {
    .wrapper {
        width: 700px !important;
        margin: 10px auto !important;
        padding: 10px !important;
        height: 530px !important;
        border: 1px solid #fff;
        background-color: rgba(255, 130, 224, .192);
        box-shadow: 0 0 10px rgba(0, 0, 0, .1);
        overflow: hidden
    }
}

@media (min-width:992px) and (max-width:1199px) {
    .wrapper {
        max-width: 90%;
        margin: 40px auto;
        padding: 4rem 10rem;
        height: 600px;
        border: 1px solid #fff;
        background-color: rgba(255, 130, 224, .192);
        box-shadow: 0 0 10px rgba(0, 0, 0, .1);
        overflow: hidden
    }
}

@media (min-width:1200px) and (max-width:2000px) {
    .wrapper {
        max-width: 90%;
        margin: 40px auto;
        padding: 5rem 10rem;
        height: 600px;
        border: 1px solid #fff;
        background-color: rgba(255, 130, 224, .192);
        box-shadow: 0 0 10px rgba(0, 0, 0, .1);
        overflow: hidden
    }
}

@media (min-width:2001px) and (max-width:3000px) {
    .wrapper {
        max-width: 90%;
        margin: 40px auto;
        padding: 10rem 15rem;
        height: 700px;
        border: 1px solid #fff;
        background-color: rgba(255, 130, 224, .192);
        box-shadow: 0 0 10px rgba(0, 0, 0, .1);
        overflow: hidden
    }
}

.wrapper2 {
    margin: 40px auto;
    padding: 5rem 14rem
}

.wrapper2 a,
.wrapper2 p {
    color: #6e575a !important
}


.btnFloat:before,
.btnFloat:hover,
.btnFloat:hover:before,
.btnTeal.btnFloat:before {
    color: #f5f5f5 !important;
    text-align: center;
    text-decoration: none !important;
    text-decoration-style: none !important
}

@media (max-width:480px) {
    .wrapper2 {
        width: 400px !important;
        margin: 10px auto !important;
        padding: 10px !important;
        height: 665px !important;
        border: 1px solid #fff;
        background-color: rgba(255, 130, 224, .192);
        box-shadow: 0 0 10px rgba(0, 0, 0, .1);
        overflow: hidden
    }
}

@media (min-width:481px) and (max-width:767px) {
    .wrapper2 {
        width: 520px !important;
        margin: 10px auto !important;
        padding: 10px !important;
        height: 720px !important;
        border: 1px solid #fff;
        background-color: rgba(255, 130, 224, .192);
        box-shadow: 0 0 10px rgba(0, 0, 0, .1);
        overflow: hidden
    }
}

@media (min-width:768px) and (max-width:991px) {
    .wrapper2 {
        width: 700px !important;
        margin: 10px auto !important;
        padding: 10px !important;
        height: 1000px !important;
        border: 1px solid #fff;
        background-color: rgba(255, 130, 224, .192);
        box-shadow: 0 0 10px rgba(0, 0, 0, .1);
        overflow: hidden
    }
}

@media (min-width:992px) and (max-width:1199px) {
    .wrapper2 {
        max-width: 90%;
        margin: 40px auto;
        padding: 4rem 10rem;
        height: 1000px;
        border: 1px solid #fff;
        background-color: rgba(255, 130, 224, .192);
        box-shadow: 0 0 10px rgba(0, 0, 0, .1);
        overflow: hidden
    }
}

@media (min-width:1200px) and (max-width:2000px) {
    .wrapper2 {
        max-width: 90%;
        margin: 40px auto;
        padding: 5rem 10rem;
        height: 1150px;
        border: 1px solid #fff;
        background-color: rgba(255, 130, 224, .192);
        box-shadow: 0 0 10px rgba(0, 0, 0, .1);
        overflow: hidden
    }
}

@media (min-width:2001px) and (max-width:3000px) {
    .wrapper2 {
        max-width: 90%;
        margin: 40px auto;
        padding: 10rem 15rem;
        height: 1080px;
        border: 1px solid #fff;
        background-color: rgba(255, 130, 224, .192);
        box-shadow: 0 0 10px rgba(0, 0, 0, .1);
        overflow: hidden
    }
}

.btnFloat:before,
.button {
    font-weight: 500;
    font-size: 26px !important;
    border-radius: 2px
}

.btnFloat:before {
    display: block;
    position: absolute;
    top: 0;
    width: 150px !important;
    height: 40px !important;
    box-shadow: 0 0 0 0 rgba(0, 0, 0, .4)
}

.button,
a.button {
    display: block;
    position: relative;
    padding: 0;
    line-height: 40px
}

.btnPurple.btnFloat:before {
    background: #8D336A !important;
    text-align: center;
    text-decoration-color: none !important
}

.btnTeal.btnFloat:before {
    background-color: #00979c !important;
    font-size: 26px !important;
    font-weight: 500
}

.btnFloat:hover,
.btnFloat:hover:before {
    font-family: Lobster, cursive !important;
    font-size: 26px !important;
    font-weight: 500;
    margin-top: -2px;
    margin-left: 0;
    transform: scale(1.1, 1.1) !important;
    -ms-transform: scale(1.1, 1.1) !important;
    -webkit-transform: scale(1.1, 1.1) !important;
    box-shadow: 0 5px 5px -2px rgba(0, 0, 0, .25);
    text-decoration-color: none !important
}

a.button,
a.homebutton {
    margin: 10px 20px 10px 0
}

a.button {
    width: 120px;
    font-weight: 600;
    color: #FFF !important;
    border-radius: 5px;
    text-align: center
}

.button {
    width: 150px !important;
    color: #FFF;
    border: none;
    text-align: center;
    background-color: #32b3d3 !important
}

.homebutton,
a.homebutton {
    display: block;
    position: relative;
    padding: 0;
    font-weight: 500;
    font-size: 24px !important;
    line-height: 40px;
    text-align: center
}

.homebutton,
.instabutton {
    border-radius: 2px;
    background: #8D336A !important
}

a.homebutton {
    width: 120px;
    color: #FFF !important;
    border-radius: 2px
}

.homebutton {
    width: 150px !important;
    color: #FFF;
    border: none
}

@media (max-width:480px) {

    .homebutton,
    a.homebutton {
        font-family: Lobster, cursive !important;
        display: block;
        position: relative;
        padding: 0;
        font-weight: 500;
        font-size: 24px !important;
        line-height: 40px;
        border-radius: 2px;
        transition: all .2s;
        text-align: center;
        text-decoration: none !important;
        text-decoration-style: none !important;
        text-decoration-color: none !important
    }

    a.homebutton {
        width: 120px;
        margin: 0 auto;
        color: #FFF !important
    }

    .homebutton {
        width: 150px !important;
        color: #FFF;
        border: none;
        background: #8D336A !important
    }
}

.instabutton,
a.instabutton {
    padding: 0;
    font-weight: 600;
    text-align: center;
    display: block;
    position: relative
}

.instabutton {
    margin-top: 2%;
    width: 170px !important;
    color: #FFF;
    border: none
}

.parallax_img,
.parallax_img1 {
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% auto
}

a.instabutton {
    width: 120px;
    color: #FFF !important;
    border-radius: 2px
}

@media (max-width:480px) {

    #icecream1,
    #icecream2,
    #icecream3,
    #icecream4,
    #icecream5,
    #icecream6 {
        z-index: 3;
        text-align: left;
        font-size: 15px !important;
        font-weight: 500 !important;
        color: #7c5247 !important;
        width: 280px
    }

    #scoop {
        height: auto;
        width: 100%;
        max-width: 155px;
        z-index: 3;
        margin-top: 1% !important;
        margin-bottom: -110rem !important
    }

    #icecream1 {
        margin: 77rem auto 0
    }

    #icecream2,
    #icecream3,
    #icecream4,
    #icecream5,
    #icecream6 {
        margin: 0 auto;
        padding-top: 2%
    }

    .icecreams {
        z-index: 1;
        text-align: center;
        background-color: #f9ffe3;
        width: 100%;
        height: 1680px !important;
        padding-top: 5%
    }
}

@media (min-width:481px) and (max-width:767px) {

    #icecream1,
    #icecream2,
    #icecream3,
    #icecream4,
    #icecream5,
    #icecream6 {
        float: left;
        z-index: 3;
        font-size: 15px !important;
        font-weight: 500 !important;
        color: #7c5247 !important;
        width: 550px
    }

    #scoop {
        height: auto;
        width: 100%;
        max-width: 200px;
        margin-top: 75% !important;
        z-index: 3;
        text-align: center
    }

    #icecream1 {
        margin-top: -130em !important
    }

    #icecream2 {
        margin-top: -122em !important
    }

    #icecream3 {
        margin-top: -116em !important
    }

    #icecream4 {
        margin-top: -110em !important
    }

    #icecream5 {
        margin-top: -104em !important
    }

    #icecream6 {
        margin-top: -94em !important
    }

    .icecreams {
        z-index: 1;
        background-color: #f9ffe3;
        width: 100%;
        height: 1600px !important;
        padding: 2rem 4rem !important
    }
}

@media (min-width:768px) and (max-width:800px) {

    #icecream1,
    #icecream3,
    #icecream5 {
        float: left
    }

    #icecream2,
    #icecream4,
    #icecream6 {
        float: right
    }

    #icecream1,
    #icecream2 {
        margin-top: -50rem !important
    }

    #icecream1,
    #icecream2,
    #icecream3,
    #icecream4,
    #icecream5,
    #icecream6 {
        z-index: 3;
        font-size: 16px !important;
        font-weight: 500 !important;
        color: #7c5247 !important;
        width: 220px
    }

    #scoop {
        height: auto;
        width: 100%;
        max-width: 280px;
        margin-top: -170px !important;
        z-index: 3;
        text-align: center
    }

    #icecream3 {
        margin-top: -34rem !important
    }

    #icecream4 {
        margin-top: -40rem !important
    }

    #icecream5 {
        margin-top: -22rem !important
    }

    #icecream6 {
        margin-top: -25rem !important
    }

    .icecreams {
        z-index: 1;
        background-color: #f9ffe3;
        width: 100%;
        height: 1270px !important;
        padding: 2rem 3rem !important
    }
}

@media (min-width:801px) and (max-width:991px) {

    #icecream1,
    #icecream3,
    #icecream5 {
        float: left
    }

    #icecream2,
    #icecream4,
    #icecream6 {
        float: right
    }

    #icecream1,
    #icecream2 {
        margin-top: -50rem !important
    }

    #icecream1,
    #icecream2,
    #icecream3,
    #icecream4,
    #icecream5,
    #icecream6 {
        z-index: 3;
        font-size: 16px !important;
        font-weight: 500 !important;
        color: #7c5247 !important;
        width: 220px
    }

    #scoop {
        height: auto;
        width: 100%;
        max-width: 280px;
        margin-top: -170px !important;
        z-index: 3;
        text-align: center
    }

    #icecream3 {
        margin-top: -34rem !important
    }

    #icecream4 {
        margin-top: -40rem !important
    }

    #icecream5 {
        margin-top: -22rem !important
    }

    #icecream6 {
        margin-top: -25rem !important
    }

    .icecreams {
        z-index: 1;
        background-color: #f9ffe3;
        width: 100%;
        height: 1270px !important;
        padding: 2rem 3rem !important
    }
}

@media (min-width:992px) and (max-width:1024px) {

    #icecream1,
    #icecream2,
    #icecream3,
    #icecream4,
    #icecream5,
    #icecream6 {
        z-index: 3;
        font-size: 16px !important;
        font-weight: 500 !important;
        color: #7c5247 !important;
        width: 280px
    }

    #scoop {
        height: auto;
        width: 100%;
        max-width: 300px;
        margin-top: -400px !important;
        z-index: 3;
        text-align: center
    }

    #icecream1 {
        float: left;
        margin-top: -45%
    }

    #icecream2 {
        float: right;
        margin-top: -47%
    }

    #icecream3 {
        float: left;
        margin-top: -23%
    }

    #icecream4 {
        float: right;
        margin-top: -34%
    }

    #icecream5 {
        float: left;
        margin-top: -5%
    }

    #icecream6 {
        float: right;
        margin-top: -12%
    }

    .icecreams {
        z-index: 1;
        background-color: #f9ffe3;
        width: 100%;
        height: 1180px;
        padding: 2rem !important
    }
}

@media (min-width:1025px) and (max-width:1199px) {

    #icecream1,
    #icecream2,
    #icecream3,
    #icecream4,
    #icecream5,
    #icecream6 {
        z-index: 3;
        font-size: 16px !important;
        font-weight: 500 !important;
        color: #7c5247 !important;
        width: 250px
    }

    #scoop {
        height: auto;
        width: 100%;
        max-width: 300px;
        margin-top: -45% !important;
        z-index: 3;
        text-align: center
    }

    #icecream1 {
        float: left;
        margin-top: -42%
    }

    #icecream2 {
        float: right;
        margin-top: -42%
    }

    #icecream3 {
        float: left;
        margin-top: -18%
    }

    #icecream4 {
        float: right;
        margin-top: -28%
    }

    #icecream5 {
        float: left;
        margin-top: -1%
    }

    #icecream6 {
        float: right;
        margin-top: -5%
    }

    .icecreams {
        z-index: 1;
        background-color: #f9ffe3;
        width: 100%;
        height: 1280px;
        padding: 4rem 6rem !important
    }
}

@media (min-width:1200px) and (max-width:1500px) {

    #icecream3,
    #icecream4 {
        z-index: 3;
        font-size: 16px !important;
        font-weight: 500 !important;
        color: #7c5247 !important;
        width: 370px
    }

    #icecream2,
    #icecream6 {
        float: right;
        margin-right: -3% !important
    }

    #icecream5,
    #icecream6 {
        z-index: 3;
        font-size: 16px !important;
        font-weight: 500 !important;
        color: #7c5247 !important;
        margin-top: -7rem !important
    }

    #scoop {
        height: auto;
        width: 100%;
        max-width: 300px;
        margin-top: -420px !important;
        z-index: 3;
        text-align: center
    }

    #icecream1 {
        float: left;
        margin-left: -1% !important;
        z-index: 3;
        font-size: 16px !important;
        font-weight: 500 !important;
        color: #7c5247 !important;
        width: 380px;
        margin-top: -28rem !important
    }

    #icecream2 {
        z-index: 3;
        font-size: 16px !important;
        font-weight: 500 !important;
        color: #7c5247 !important;
        width: 410px;
        margin-top: -25rem !important
    }

    #icecream3 {
        float: left;
        margin-left: 3% !important;
        margin-top: -15rem !important
    }

    #icecream4 {
        float: right;
        margin-right: 5% !important;
        margin-top: -16rem !important
    }

    #icecream5 {
        float: left;
        margin-left: -3% !important;
        width: 430px
    }

    #icecream6 {
        width: 440px
    }

    .icecreams {
        z-index: 1;
        background-color: #f9ffe3;
        width: 100%;
        height: 1100px;
        padding: 2rem 6rem
    }
}

@media (min-width:1501px) and (max-width:2000px) {

    #icecream3,
    #icecream4 {
        z-index: 3;
        font-size: 16px !important;
        font-weight: 500 !important;
        color: #7c5247 !important;
        width: 370px
    }

    #icecream5,
    #icecream6 {
        z-index: 3;
        font-size: 16px !important;
        font-weight: 500 !important;
        color: #7c5247 !important;
        margin-top: -7rem !important
    }

    #scoop {
        height: auto;
        width: 100%;
        max-width: 300px;
        margin-top: -420px !important;
        z-index: 3;
        text-align: center
    }

    #icecream1 {
        float: left;
        margin-left: 5% !important;
        z-index: 3;
        font-size: 16px !important;
        font-weight: 500 !important;
        color: #7c5247 !important;
        width: 400px;
        margin-top: -27rem !important
    }

    #icecream2 {
        float: right;
        margin-right: 3% !important;
        z-index: 3;
        font-size: 16px !important;
        font-weight: 500 !important;
        color: #7c5247 !important;
        width: 410px;
        margin-top: -24rem !important
    }

    #icecream3 {
        float: left;
        margin-left: 10% !important;
        margin-top: -15rem !important
    }

    #icecream4 {
        float: right;
        margin-right: 11% !important;
        margin-top: -16rem !important
    }

    #icecream5 {
        float: left;
        margin-left: 3% !important;
        width: 460px
    }

    #icecream6 {
        float: right;
        margin-right: -3% !important;
        width: 530px
    }

    .icecreams {
        z-index: 1;
        background-color: #f9ffe3;
        width: 100%;
        height: 1200px;
        padding: 2rem 9rem
    }
}

@media (min-width:2001px) and (max-width:3000px) {

    #icecream3,
    #icecream4 {
        z-index: 3;
        font-size: 16px !important;
        font-weight: 500 !important;
        color: #7c5247 !important;
        width: 370px
    }

    #icecream5,
    #icecream6 {
        z-index: 3;
        font-size: 16px !important;
        font-weight: 500 !important;
        color: #7c5247 !important;
        margin-top: -7rem !important
    }

    #scoop {
        height: auto;
        width: 100%;
        max-width: 300px;
        margin-top: -420px !important;
        z-index: 3;
        text-align: center
    }

    #icecream1 {
        float: left;
        margin-left: 10% !important;
        z-index: 3;
        font-size: 16px !important;
        font-weight: 500 !important;
        color: #7c5247 !important;
        width: 400px;
        margin-top: -27rem !important
    }

    #icecream2 {
        float: right;
        margin-right: 10% !important;
        z-index: 3;
        font-size: 16px !important;
        font-weight: 500 !important;
        color: #7c5247 !important;
        width: 410px;
        margin-top: -24rem !important
    }

    #icecream3 {
        float: left;
        margin-left: 12% !important;
        margin-top: -15rem !important
    }

    #icecream4 {
        float: right;
        margin-right: 15% !important;
        margin-top: -16rem !important
    }

    #icecream5 {
        float: left;
        margin-left: 9% !important;
        width: 460px
    }

    #icecream6 {
        float: right;
        margin-right: 2% !important;
        width: 560px
    }

    .icecreams {
        z-index: 1;
        background-color: #f9ffe3;
        width: 100%;
        height: 1100px;
        padding: 2rem 20rem
    }
}

.content2,
.icecreams p {
    z-index: 1;
    text-align: center
}

.icecreams p {
    width: 100%;
    height: 500px;
    padding: 2rem 10rem
}

@media screen and (max-width:480px) {
    .icecreams p {
        z-index: 1;
        width: 100%;
        height: 500px;
        text-align: center;
        padding: 1rem !important
    }
}

@media (min-width:481px) and (max-width:767px) {
    .icecreams p {
        z-index: 1;
        width: 100%;
        height: 500px;
        text-align: center;
        padding: 2rem
    }
}

@media (min-width:768px) and (max-width:991px) {
    .icecreams p {
        z-index: 1;
        width: 100%;
        height: 500px;
        text-align: center;
        padding: 2rem
    }
}

.content2 {
    display: block;
    position: relative;
    background-color: transparent;
    padding: 5rem 4rem;
    font-family: Montserrat, sans-serif;
    color: #7c5247 !important
}

.youtube {
    width: 100%;
    max-width: 700px
}

@media screen and (max-width:480px) {
    .content2 {
        display: block;
        position: relative;
        background-color: transparent;
        z-index: 1;
        padding: 4rem .5rem !important;
        text-align: center;
        color: #7c5247 !important;
        font-family: Montserrat, sans-serif
    }

    .youtube {
        margin-top: 20% !important;
        width: 100%;
        max-width: 400px
    }
}

@media (min-width:481px) and (max-width:767px) {
    .youtube {
        width: 100%;
        max-width: 500px
    }
}

@media (min-width:768px) and (max-width:991px) {
    .youtube {
        width: 100%;
        max-width: 520px
    }
}

@media (min-width:992px) and (max-width:1199px) {
    .content2 {
        display: block;
        position: relative;
        background-color: transparent;
        z-index: 1;
        padding: 2rem !important;
        text-align: center;
        color: #7c5247 !important;
        font-family: Montserrat, sans-serif
    }

    .youtube {
        width: 100%;
        max-width: 800px !important
    }
}

@media (min-width:1200px) and (max-width:3000px) {
    .youtube {
        width: 100%;
        max-width: 600px
    }
}

@media (max-width:480px) {

    .lord,
    .verse {
        font-family: MedievalSharp, cursive;
        text-align: center;
        color: #7c5247 !important
    }

    .lord {
        font-size: 1.3rem !important;
        font-weight: 600 !important;
        margin-top: 5% !important
    }

    .verse {
        font-size: 1.2rem !important;
        font-weight: 700 !important
    }
}

@media (min-width:481px) and (max-width:767px) {

    .lord,
    .verse {
        font-family: MedievalSharp, cursive;
        text-align: center;
        color: #7c5247 !important
    }

    .lord {
        font-size: 1.3rem !important;
        font-weight: 600 !important;
        margin-top: 73% !important
    }

    .verse {
        font-size: 1.2rem !important;
        font-weight: 700 !important
    }
}

@media (min-width:768px) and (max-width:991px) {

    .lord,
    .verse {
        font-family: MedievalSharp, cursive;
        text-align: center;
        color: #7c5247 !important
    }

    .lord {
        font-size: 1.5rem !important;
        font-weight: 600 !important;
        margin-top: 70% !important
    }

    .verse {
        font-size: 1.4rem !important;
        font-weight: 700 !important
    }
}

@media (min-width:992px) and (max-width:1199px) {

    .lord,
    .verse {
        font-family: MedievalSharp, cursive;
        text-align: center;
        color: #7c5247 !important
    }

    .lord {
        font-size: 1.8em !important;
        font-weight: 600 !important;
        margin-top: 52% !important
    }

    .verse {
        font-size: 1.7em !important;
        font-weight: 700 !important
    }
}

@media (min-width:1200px) and (max-width:1500px) {

    .lord,
    .verse {
        font-family: MedievalSharp, cursive;
        text-align: center;
        color: #7c5247 !important
    }

    .lord {
        font-size: 2.2em !important;
        font-weight: 600 !important;
        margin-top: 50% !important
    }

    .verse {
        font-size: 2em !important;
        font-weight: 700 !important
    }
}

@media (min-width:1501px) and (max-width:2000px) {

    .lord,
    .verse {
        font-family: MedievalSharp, cursive;
        text-align: center;
        color: #7c5247 !important
    }

    .lord {
        font-size: 1.8rem !important;
        font-weight: 600 !important;
        margin-top: 48% !important
    }

    .verse {
        font-size: 1.7rem !important;
        font-weight: 700 !important
    }
}

@media (min-width:2001px) and (max-width:3000px) {

    .lord,
    .verse {
        font-family: MedievalSharp, cursive;
        text-align: center;
        color: #7c5247 !important
    }

    .lord {
        font-size: 1.8rem !important;
        font-weight: 600 !important;
        margin-top: 52% !important
    }

    .verse {
        font-size: 1.7rem !important;
        font-weight: 700 !important
    }
}

#contactdrip {
    content: url(http://www.sylwiasicecream.com/img/contactdrip.png);
    width: 100%;
    z-index: 4;
    position: relative;
    margin-bottom: -1% !important
}

@media (max-width:480px) {
    .contact {
        z-index: 9999999999999;
        background-color: #f9ffe3;
        width: 100%;
        height: 950px;
        padding: 3rem;
        margin-bottom: -5% !important
    }
}

@media (min-width:481px) and (max-width:767px) {
    .contact {
        z-index: 1;
        background-color: #f9ffe3;
        width: 100%;
        height: 640px;
        padding: 3rem 4rem;
        margin-bottom: -60% !important
    }
}

@media (min-width:768px) and (max-width:991px) {
    .contact {
        z-index: 1;
        background-color: #f9ffe3;
        width: 100%;
        height: 650px;
        padding: 2rem 6rem !important;
        margin-bottom: -5% !important
    }
}

@media (min-width:992px) and (max-width:1199px) {
    .contact {
        z-index: 1;
        background-color: #f9ffe3;
        width: 100%;
        height: 800px;
        padding: 5rem 6rem !important;
        margin-bottom: -6% !important
    }
}

@media (min-width:1200px) and (max-width:1399px) {
    .contact {
        z-index: 1;
        background-color: #f9ffe3;
        width: 100%;
        height: 800px !important;
        padding: 5rem 10rem !important;
        margin-bottom: -4% !important
    }
}

@media (min-width:1400px) and (max-width:1600px) {
    .contact {
        z-index: 1;
        background-color: #f9ffe3;
        width: 100%;
        height: 800px;
        padding: 5rem 14rem !important;
        margin-bottom: -4% !important
    }
}

@media (min-width:1601px) and (max-width:1800px) {
    .contact {
        z-index: 1;
        background-color: #f9ffe3;
        width: 100%;
        height: 800px;
        padding: 5rem 20rem !important;
        margin-bottom: -4% !important
    }
}

@media (min-width:1801px) and (max-width:2000px) {
    .contact {
        z-index: 1;
        background-color: #f9ffe3;
        width: 100%;
        height: 800px;
        padding: 6rem 26rem !important;
        margin-bottom: -4% !important
    }
}

@media (min-width:2001px) and (max-width:2500px) {
    .contact {
        z-index: 1;
        background-color: #f9ffe3;
        width: 100%;
        height: 800px;
        padding: 6rem 32rem !important;
        margin-bottom: -4% !important
    }
}

@media (min-width:2501px) and (max-width:3000px) {
    .contact {
        z-index: 1;
        background-color: #f9ffe3;
        width: 100%;
        height: 800px;
        padding: 10rem 30rem !important;
        margin-bottom: -4% !important
    }
}

@media (min-width:667px) {

    #contactinfo,
    #contactinfo a,
    #contactinfo p {
        text-decoration: none !important;
        color: #6e575a !important
    }

    #contactinfo {
        text-align: left;
        float: left;
        width: 100%;
        max-width: 360px;
        text-decoration-color: none;
        text-decoration-style: none
    }

    #contactform {
        float: right;
        color: #6e575a !important;
        font-weight: 500 !important;
        font-size: 15px !important
    }
}

@media (max-width:480px) {

    #contactinfo,
    #contactinfo a,
    #contactinfo p {
        text-decoration: none !important;
        color: #6e575a !important
    }

    #contactinfo {
        text-align: left !important;
        width: 100%;
        max-width: 320px !important;
        text-decoration-style: none;
        text-decoration-color: none
    }
}

@media (min-width:481px) and (max-width:767px) {

    #contactinfo,
    #contactinfo a,
    #contactinfo p {
        text-decoration: none !important;
        color: #6e575a !important
    }

    #contactinfo {
        text-align: left;
        float: left;
        width: 100%;
        max-width: 300px !important;
        text-decoration-color: none;
        text-decoration-style: none
    }
}

@media (min-width:768px) and (max-width:991px) {

    #contactinfo,
    #contactinfo a,
    #contactinfo p {
        text-decoration: none !important;
        color: #6e575a !important
    }

    #contactinfo {
        text-align: left;
        float: left;
        width: 100%;
        max-width: 305px !important;
        text-decoration-color: none;
        text-decoration-style: none
    }
}

#contactinfo,
#contactinfo a,
#contactinfo p {
    color: #6e575a !important
}

#contactinfo p,
#marker {
    text-decoration: none;
    text-decoration-style: none;
    text-decoration-color: none
}

#contactinfo p {
    font-size: 15px !important;
    margin-bottom: -3px !important
}

.form-control:focus {
    -webkit-box-shadow: none !important;
    box-shadow: none !important
}

@media (max-width:480px) {

    #contactfield,
    #contactform {
        outline: 0 !important;
        color: #6e575a !important;
        font-weight: 500 !important;
        font-size: 15px !important
    }

    #contactfield,
    #contactform,
    #contactinfo p {
        font-size: 15px !important
    }

    #contactinfo p {
        margin-bottom: -3px !important;
        text-decoration: none;
        text-decoration-color: none;
        text-decoration-style: none
    }

    #contactform {
        margin-left: 3% !important
    }

    #contactfield {
        padding-bottom: 5px;
        padding-top: 5px;
        border-radius: 1px !important
    }

    #contactform p {
        float: left
    }
}

#contactfield {
    padding-bottom: 5px;
    padding-top: 5px;
    border-radius: 1px !important;
    color: #6e575a !important;
    font-weight: 500 !important;
    font-size: 15px !important
}

#contactform p {
    text-align: left
}

@media (min-width:300px) and (max-width:375px) {
    .form-control {
        background-color: #faffee !important;
        width: 280px !important;
        outline: 0 !important;
        color: #6e575a !important;
        font-weight: 500 !important;
        font-size: 15px !important
    }
}

@media (min-width:376px) and (max-width:480px) {
    .form-control {
        background-color: #faffee !important;
        width: 320px !important;
        border-radius: 2px !important;
        outline: 0 !important;
        color: #6e575a !important;
        font-weight: 500 !important;
        font-size: 15px !important
    }
}

@media (min-width:481px) and (max-width:767px) {
    .form-control {
        background-color: #faffee !important;
        width: 250px !important;
        border-radius: 2px !important;
        outline: 0 !important;
        color: #6e575a !important;
        font-weight: 500 !important;
        font-size: 15px !important
    }
}

@media (min-width:768px) and (max-width:991px) {
    .form-control {
        background-color: #faffee !important;
        width: 280px !important;
        outline: 0 !important;
        color: #6e575a !important;
        font-weight: 500 !important;
        font-size: 15px !important
    }
}

@media (min-width:992px) and (max-width:1199px) {
    .form-control {
        background-color: #faffee !important;
        width: 400px !important;
        border-radius: 2px !important;
        outline: 0 !important;
        color: #6e575a !important;
        font-weight: 500 !important;
        font-size: 15px !important
    }
}

@media (min-width:1200px) and (max-width:3000px) {
    .form-control {
        background-color: #faffee !important;
        width: 480px !important;
        border-radius: 2px !important;
        outline: 0 !important;
        color: #6e575a !important;
        font-weight: 500 !important;
        font-size: 15px !important
    }
}

#ourlogo,
#rainbowwave {
    width: 100%
}

#marker {
    color: #00979c !important
}

@media (min-width:300px) and (max-width:320px) {
    #drip2 {
        content: url(img/mediumdrips3.png);
        z-index: 3;
        width: 100%;
        position: relative;
        left: 0;
        bottom: 20%
    }
}

@media (min-width:321px) and (max-width:380px) {
    #drip2 {
        z-index: 3;
        content: url(img/mediumdrips3.png);
        width: 100%;
        position: relative;
        left: 0;
        bottom: 10% !important;
        margin-bottom: -1px !important
    }
}

@media (min-width:381px) and (max-width:480px) {
    #drip2 {
        z-index: 2;
        content: url(img/mediumdrips3.png);
        width: 100%;
        position: relative;
        left: 0;
        bottom: 10% !important;
        margin-bottom: -7px !important
    }
}

@media (min-width:481px) and (max-width:767px) {
    #drip2 {
        z-index: 2;
        content: url(img/mediumdrips3.png);
        width: 100%;
        position: relative;
        left: 0;
        bottom: 10% !important;
        margin-bottom: -7px
    }
}

@media (min-width:768px) and (max-width:991px) {
    #drip2 {
        z-index: 3;
        content: url(img/mediumdrips3.png);
        width: 100%;
        position: relative;
        left: 0;
        bottom: 10% !important;
        margin-bottom: -10px
    }
}

@media (min-width:992px) and (max-width:1199px) {
    #drip2 {
        z-index: 2;
        content: url(img/mediumdrips3.png);
        width: 100%;
        position: relative;
        left: 0;
        bottom: 10% !important;
        margin-bottom: -5px
    }
}

@media (min-width:1200px) and (max-width:3000px) {
    #drip2 {
        z-index: 3;
        content: url(img/mediumdrips3.png);
        width: 100%;
        position: relative;
        left: 0;
        margin-bottom: -12px !important
    }
}

#yourdiv:hover {
    color: #f8ed9779;
    text-shadow: 0 0 1px #f8ed9779;
    -moz-transition: all .2s ease-in;
    -o-transition: all .2s ease-in;
    -webkit-transition: all .2s ease-in;
    transition: all .2s ease-in
}

@media (max-width:480px) {

    #si,
    i {
        color: #6e575a !important
    }

    #si,
    #yourdiv {
        display: inline-block;
        padding: 1%;
        font-weight: 600
    }

    .footer {
        z-index: 3;
        background-color: #15B5BB;
        width: 100%;
        height: 195px;
        bottom: 0 !important
    }

    #footerlogo {
        width: 200px;
        margin-top: 2%
    }

    #si {
        font-size: 1.5em;
        text-decoration: none
    }

    #fmenu {
        text-align: center
    }

    #yourdiv {
        font-family: Lobster, cursive !important;
        color: #e8ffa8d8;
        font-size: 20px !important
    }
}

@media (min-width:481px) and (max-width:767px) {

    #si,
    i {
        color: #6e575a !important
    }

    #si,
    #yourdiv {
        display: inline-block;
        padding: 1%;
        font-weight: 600
    }

    .footer {
        z-index: 3;
        background-color: #15B5BB;
        width: 100%;
        height: 210px;
        bottom: 0 !important
    }

    #footerlogo {
        width: 200px;
        margin-top: 2%
    }

    #si {
        font-size: 1.5em;
        text-decoration: none
    }

    #fmenu {
        text-align: center
    }

    #yourdiv {
        font-family: Lobster, cursive !important;
        color: #e8ffa8d8;
        font-size: 20px !important
    }
}

@media (min-width:768px) and (max-width:991px) {

    #si,
    i {
        color: #6e575a !important
    }

    #si,
    #yourdiv {
        display: inline-block;
        padding: 1%;
        font-weight: 600
    }

    .footer {
        z-index: 3;
        background-color: #15B5BB;
        width: 100%;
        height: 210px;
        bottom: 0 !important
    }

    #footerlogo {
        width: 200px;
        margin-top: 2%
    }

    #si {
        font-size: 1.5em;
        text-decoration: none
    }

    #fmenu {
        text-align: center
    }

    #yourdiv {
        font-family: Lobster, cursive !important;
        color: #e8ffa8d8;
        font-size: 20px !important
    }
}

@media (min-width:992px) and (max-width:1199px) {

    #si,
    i {
        color: #6e575a !important
    }

    #si,
    #yourdiv {
        display: inline-block;
        padding: 1%;
        font-weight: 600
    }

    .footer {
        z-index: 3;
        background-color: #15B5BB;
        width: 100%;
        height: 255px;
        bottom: 0 !important
    }

    #footerlogo {
        width: 200px;
        margin-top: 2%
    }

    #si {
        font-size: 1.5em;
        text-decoration: none
    }

    #fmenu {
        text-align: center
    }

    #yourdiv {
        font-family: Lobster, cursive !important;
        color: #e8ffa8d8;
        font-size: 20px !important
    }
}

@media (min-width:1200px) and (max-width:1500px) {

    #si,
    i {
        color: #6e575a !important
    }

    #si,
    #yourdiv {
        display: inline-block;
        padding: 1%;
        font-weight: 600
    }

    .footer {
        z-index: 3;
        background-color: #15B5BB;
        width: 100%;
        height: 250px;
        bottom: 0 !important;
        text-decoration: none !important
    }

    #footerlogo {
        width: 200px;
        margin-top: 2%
    }

    #si {
        font-size: 1.5em;
        text-decoration: none
    }

    #fmenu {
        text-align: center
    }

    #yourdiv {
        font-family: Lobster, cursive !important;
        color: #e8ffa8d8;
        font-size: 20px !important
    }
}

@media (min-width:1501px) and (max-width:3000px) {

    #si,
    i {
        color: #6e575a !important
    }

    #si,
    #yourdiv {
        display: inline-block;
        padding: 1%;
        font-weight: 600
    }

    .footer {
        z-index: 3;
        background-color: #15B5BB;
        width: 100%;
        height: 285px;
        bottom: 0 !important
    }

    #footerlogo {
        width: 200px;
        margin-top: 2%
    }

    #si {
        font-size: 1.5em;
        text-decoration: none
    }

    #fmenu {
        text-align: center
    }

    #yourdiv {
        font-family: Lobster, cursive !important;
        color: #e8ffa8d8;
        font-size: 20px !important
    }
}

#ourlogo {
    max-width: 320px;
    margin: 0
}

#story {
    text-align: left !important;
    margin-top: 10% !important
}

@media (max-width:480px) {

    #story1,
    #storyl {
        max-width: 420px
    }

    .content3 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 45%;
        z-index: -1;
        margin-top: -10% !important;
        padding: 2rem;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important
    }

    #story1,
    #story2,
    #storyl {
        text-align: left
    }

    #story {
        text-align: left !important;
        margin-top: 10% !important
    }

    #story1 {
        margin-top: -3% !important
    }

    #profilepic {
        max-width: 200px !important
    }

    #historydiv {
        padding-top: 10%;
        padding-bottom: 10% !important
    }

    #story2 {
        max-width: 1200px;
        margin-top: 12% !important
    }
}

@media (min-width:481px) and (max-width:767px) {
    .content3 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 60%;
        z-index: -1;
        margin-top: -10% !important;
        padding: 2rem;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important
    }

    #story1,
    #storyl {
        float: left;
        text-align: left;
        max-width: 650px;
        margin-bottom: 10%
    }

    #historydiv {
        padding-top: 10%;
        padding-bottom: 12% !important
    }

    #profilepic {
        max-width: 200px
    }

    #story2 {
        text-align: left;
        max-width: 1300px
    }
}

@media (min-width:768px) and (max-width:991px) {

    #story2,
    #storyl {
        max-width: 1200px
    }

    .content3 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 45%;
        z-index: -1;
        margin-top: -10% !important;
        padding: 2rem;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important
    }

    #story1,
    #story2,
    #storyl {
        text-align: left
    }

    #story1 {
        max-width: 420px
    }

    #profilepic {
        float: right;
        max-width: 200px !important;
        margin-top: -30% !important
    }

    #historydiv {
        padding-top: 10%;
        padding-bottom: 10% !important
    }

    #storyl {
        margin-top: 1% !important;
        margin-bottom: 10% !important
    }
}

@media (min-width:992px) and (max-width:1199px) {

    #story1,
    #storyl {
        float: left;
        margin-bottom: 10%
    }

    #story2,
    #storyl {
        max-width: 1300px
    }

    .content3 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 30% !important;
        z-index: -1;
        margin-top: -10% !important;
        padding: 10rem;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important
    }

    #story1,
    #story2,
    #storyl {
        text-align: left
    }

    #story1 {
        max-width: 500px
    }

    #historydiv {
        padding-top: 10%;
        padding-bottom: 60% !important
    }

    #profilepic {
        float: right;
        max-width: 200px;
        margin-top: 10% !important
    }
}

@media (min-width:1200px) and (max-width:1500px) {

    #story2,
    #storyl {
        max-width: 1300px
    }

    .content3 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 45% !important;
        z-index: -1;
        margin-top: -10% !important;
        padding: 4rem 12rem;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important
    }

    #story1,
    #story2,
    #storyl {
        text-align: left
    }

    #story1 {
        float: left;
        max-width: 500px;
        margin-bottom: 5%
    }

    #historydiv {
        padding-top: 10%;
        padding-bottom: 45%
    }

    #profilepic {
        float: right;
        max-width: 350px
    }

    #storyl {
        float: left;
        margin-bottom: 10%
    }
}

@media (min-width:1501px) and (max-width:2000px) {

    #story1,
    #storyl {
        float: left;
        margin-bottom: 10%
    }

    #story2,
    #storyl {
        max-width: 1500px
    }

    .content3 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 45% !important;
        z-index: -1;
        margin-top: -10% !important;
        padding: 10rem 15rem;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important
    }

    #story1,
    #story2,
    #storyl {
        text-align: left
    }

    #story1 {
        max-width: 670px
    }

    #historydiv {
        padding-top: 10%;
        padding-bottom: 35%
    }

    #profilepic {
        float: right;
        max-width: 350px
    }
}

@media (min-width:2001px) and (max-width:3000px) {

    #story1,
    #storyl {
        float: left;
        margin-bottom: 10%
    }

    #story2,
    #storyl {
        max-width: 1500px
    }

    .content3 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 45% !important;
        z-index: -1;
        margin-top: -10% !important;
        padding: 10rem 28rem;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important
    }

    #story1,
    #story2,
    #storyl {
        text-align: left
    }

    #story1 {
        max-width: 670px
    }

    #historydiv {
        padding-top: 10%;
        padding-bottom: 35%
    }

    #profilepic {
        float: right;
        max-width: 350px
    }
}

#menuice1,
#menuice2,
#menuicecreams {
    margin: 0 auto;
    width: 100%;
    margin-bottom: -5% !important
}

#menuicecreams {
    max-width: 200px
}

#menuice1 {
    max-width: 116px
}

#menuice2 {
    max-width: 120px
}

@media (max-width:480px) {

    #menuice1,
    #menuice2,
    #menuicecreams {
        margin: 0 auto;
        width: 100%
    }

    #menuice1,
    #menuice2 {
        margin-bottom: 5% !important
    }

    #menuice1 {
        max-width: 65px
    }

    #menuicecreams {
        max-width: 115px;
        margin-bottom: -5% !important
    }

    #menuice2 {
        max-width: 68px
    }

    .content5 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 45%;
        z-index: -1;
        padding: 2rem;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important;
        font-weight: 600;
        margin-top: -10% !important
    }
}

@media (min-width:481px) and (max-width:767px) {
    .content5 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 60%;
        z-index: -1;
        margin-top: -10% !important;
        padding: 2rem;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important
    }
}

@media (min-width:768px) and (max-width:991px) {
    .content5 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 45%;
        z-index: -1;
        margin-top: -10% !important;
        padding: 2rem;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important
    }
}

@media (min-width:992px) and (max-width:1199px) {
    .content5 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 30% !important;
        z-index: -1;
        margin-top: -10% !important;
        padding: 10rem 4rem;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important
    }
}

@media (min-width:1200px) and (max-width:1500px) {
    .content5 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 45% !important;
        z-index: -1;
        margin-top: -10% !important;
        padding: 10rem 12rem;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important
    }
}

@media (min-width:1501px) and (max-width:3000px) {
    .content5 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 45% !important;
        z-index: -1;
        margin-top: -10% !important;
        padding: 10rem;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important
    }
}

@media (max-width:480px) {
    .content6 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 45%;
        z-index: 1;
        padding: 2rem;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important
    }
}

@media (min-width:481px) and (max-width:767px) {
    .content6 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 60%;
        z-index: 1;
        padding: 2rem;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important
    }
}

@media (min-width:768px) and (max-width:991px) {
    .content6 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 45%;
        z-index: 1;
        padding: 2rem;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important
    }
}

@media (min-width:992px) and (max-width:1199px) {
    .content6 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 30% !important;
        z-index: 1;
        padding: 10rem 4rem;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important
    }
}

@media (min-width:1200px) and (max-width:1500px) {
    .content6 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 45% !important;
        z-index: 1;
        padding: 10rem 12rem;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important
    }
}

@media (min-width:1501px) and (max-width:3000px) {
    .content6 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 45% !important;
        z-index: 1;
        padding: 10rem 24rem;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important
    }
}

#raspados img,
#sorbet img,
#sundaes img {
    display: inline-block;
    padding-right: 2rem
}

#toppings {
    max-width: 800px;
    margin: 0 auto
}

#browniesundaeitem img {
    width: 400px !important
}

.parallax_img {
    height: 500px !important;
    background-image: url(http://www.sylwiasicecream.com/img/weeklywave.png);
    background-attachment: fixed
}

@media screen and (max-width:768px) {
    .parallax_img {
        background-attachment: inherit;
        height: 300px !important
    }
}

.parallax_img1 {
    height: 500px !important;
    background-image: url(img/rainboawave.png);
    background-attachment: fixed
}

@media screen and (max-width:768px) {
    .parallax_img1 {
        background-attachment: inherit;
        height: 300px !important
    }
}

#italianice,
#pints,
#pintsf,
#raspados,
#scoops,
#scoopsf,
#sorbet,
#sundaes,
#sundaesf {
    padding: 1rem;
    max-width: 250px;
    height: auto;
    display: inline-block
}

@media (max-width:480px) {
    .menutitle {
        font-family: Anton, sans-serif;
        color: #00979c !important;
        font-size: 18px !important;
        font-weight: 600
    }
}

.flavtitle1,
.flavtitle10,
.flavtitle11,
.flavtitle12,
.flavtitle13,
.flavtitle14,
.flavtitle15,
.flavtitle16,
.flavtitle17,
.flavtitle18,
.flavtitle19,
.flavtitle2,
.flavtitle20,
.flavtitle21,
.flavtitle22,
.flavtitle23,
.flavtitle24,
.flavtitle25,
.flavtitle26,
.flavtitle27,
.flavtitle3,
.flavtitle4,
.flavtitle5,
.flavtitle6,
.flavtitle7,
.flavtitle8,
.flavtitle9,
.menutitle {
    font-family: Anton, sans-serif;
    font-size: 26px;
    font-weight: 600
}

.menutitle {
    color: #00979c !important
}

.flavtitle1 {
    color: #97ff51 !important
}

.flavtitle2 {
    color: #e4da58 !important
}

.flavtitle3 {
    color: #202014 !important
}

.flavtitle4 {
    color: #d43d7c !important
}

.flavtitle5 {
    color: #a87b00 !important
}

.flavtitle6 {
    color: #333224 !important
}

.flavtitle7 {
    color: #1c7eff !important
}

.flavtitle8 {
    color: #2b2a20 !important
}

.flavtitle9 {
    color: #a82929 !important
}

.flavtitle10 {
    color: #9aa85d !important
}

.flavtitle11 {
    color: #ff9355 !important
}

.flavtitle12 {
    color: #2b2a20 !important
}

.flavtitle13 {
    color: #4aff4a !important
}

.flavtitle14 {
    color: #2b2a20 !important
}

.flavtitle15 {
    color: #777647 !important
}

.flavtitle16 {
    color: #ffd900 !important
}

.flavtitle17 {
    color: #ff8383 !important
}

.flavtitle18 {
    color: #3d3d28 !important
}

.flavtitle19 {
    color: #97965e !important
}

.flavtitle20 {
    color: #dbc900 !important
}

.flavtitle21 {
    color: #e99f00 !important
}

.flavtitle22 {
    color: #ffcc6e !important
}

.flavtitle23 {
    color: #36341f !important
}

.flavtitle24 {
    color: #dfcc00 !important
}

.flavtitle25 {
    color: #25211a !important
}

.flavtitle26 {
    color: #6e692f !important
}

.flavtitle27 {
    color: #ff9253 !important
}

#pintsf,
#scoopsf,
#sundaesf {
    text-align: center
}

#pints img,
#pintsf img,
#scoops img,
#scoopsf img,
#sundaesf img {
    display: inline-block;
    padding: 1rem;
    max-width: 220px !important
}

#pints,
#sundaes {
    text-align: left
}

#italianice,
#raspados,
#scoops,
#sorbet {
    text-align: left;
    margin-bottom: -10% !important
}

#sundaes img {
    max-width: 250px !important
}

#italianice img {
    display: inline-block;
    padding-right: 1rem;
    max-width: 220px !important
}

#sorbet img {
    max-width: 190px !important
}

#raspados img {
    max-width: 240px !important
}

@media (max-width:480px) {

    .flavtitle1,
    .flavtitle10,
    .flavtitle11,
    .flavtitle12,
    .flavtitle13,
    .flavtitle14,
    .flavtitle15,
    .flavtitle16,
    .flavtitle17,
    .flavtitle18,
    .flavtitle19,
    .flavtitle2,
    .flavtitle20,
    .flavtitle21,
    .flavtitle22,
    .flavtitle23,
    .flavtitle24,
    .flavtitle25,
    .flavtitle26,
    .flavtitle27,
    .flavtitle3,
    .flavtitle4,
    .flavtitle5,
    .flavtitle6,
    .flavtitle7,
    .flavtitle8,
    .flavtitle9 {
        font-family: Anton, sans-serif;
        font-size: 16px;
        font-weight: 500
    }

    #italianice img,
    #raspados img,
    #sorbet img {
        display: inline-block
    }

    #italianice img {
        margin-left: 10% !important;
        max-width: 200px !important
    }

    #italianice,
    #raspados,
    #sorbet {
        display: inline-block;
        padding: 1rem;
        max-width: 250px;
        height: auto;
        text-align: left;
        margin-bottom: -10% !important
    }

    #sorbet img {
        margin-left: 10% !important;
        max-width: 230px !important
    }

    #raspados img {
        max-width: 240px !important
    }

    .flavtitle1 {
        color: #97ff51 !important
    }

    .flavtitle2 {
        color: #fff56c !important
    }

    .flavtitle3 {
        color: #202014 !important
    }

    .flavtitle4 {
        color: #d43d7c !important
    }

    .flavtitle5 {
        color: #a87b00 !important
    }

    .flavtitle6 {
        color: #333224 !important
    }

    .flavtitle7 {
        color: #1c7eff !important
    }

    .flavtitle8 {
        color: #2b2a20 !important
    }

    .flavtitle9 {
        color: #a82929 !important
    }

    .flavtitle10 {
        color: #9aa85d !important
    }

    .flavtitle11 {
        color: #ff9355 !important
    }

    .flavtitle12 {
        color: #2b2a20 !important
    }

    .flavtitle13 {
        color: #4aff4a !important
    }

    .flavtitle14 {
        color: #2b2a20 !important
    }

    .flavtitle15 {
        color: #777647 !important
    }

    .flavtitle16 {
        color: #ffd900 !important
    }

    .flavtitle17 {
        color: #ff8383 !important
    }

    .flavtitle18 {
        color: #3d3d28 !important
    }

    .flavtitle19 {
        color: #97965e !important
    }

    .flavtitle20 {
        color: #f8e61a !important
    }

    .flavtitle21 {
        color: #e99f00 !important
    }

    .flavtitle22 {
        color: #ffcc6e !important
    }

    .flavtitle23 {
        color: #36341f !important
    }

    .flavtitle24 {
        color: #fff583 !important
    }

    .flavtitle25 {
        color: #25211a !important
    }

    .flavtitle26 {
        color: #6e692f !important
    }

    .flavtitle27 {
        color: #ff9253 !important
    }

    #pintsf,
    #scoopsf,
    #sundaesf {
        display: inline-block;
        padding: 1%;
        max-width: 100px;
        height: auto;
        text-align: center
    }

    #pintsf img,
    #scoopsf img,
    #sundaesf img {
        display: inline-block;
        padding: 1%;
        max-width: 110px !important
    }

    .content8 {
        display: block;
        background-color: #f9ffe3;
        height: 18px !important;
        margin-top: -10% !important;
        padding: 3rem 5px;
        margin-bottom: 2% !important;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important;
        z-index: -1;
        position: relative;
        font-size: 15px !important
    }
}

@media (min-width:481px) and (max-width:767px) {
    .content8 {
        display: block;
        background-color: #f9ffe3;
        height: 10px !important;
        margin-top: -10% !important;
        padding: 6rem 4rem;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important;
        z-index: -1;
        position: relative;
        font-size: 15px !important
    }
}

@media (min-width:768px) and (max-width:991px) {
    .content8 {
        display: block;
        background-color: #f9ffe3;
        height: 10px !important;
        margin-top: -10% !important;
        padding: 6rem 4rem;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important;
        z-index: -1;
        position: relative;
        font-size: 15px !important
    }
}

@media (min-width:992px) and (max-width:1199px) {
    .content8 {
        display: block;
        background-color: #f9ffe3;
        height: 10px !important;
        margin-top: -10% !important;
        padding: 10rem 2rem;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important;
        z-index: -1;
        position: relative;
        font-size: 15px !important
    }
}

@media (min-width:1200px) and (max-width:1500px) {
    .content8 {
        display: block;
        background-color: #f9ffe3;
        height: 10px !important;
        margin-top: -10% !important;
        padding: 10rem 4rem;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important;
        z-index: -1;
        position: relative;
        font-size: 15px !important
    }
}

@media (min-width:1501px) and (max-width:3000px) {
    .content8 {
        display: block;
        background-color: #f9ffe3;
        height: 10px !important;
        margin-top: -10% !important;
        padding: 8rem 4rem;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important;
        z-index: -1;
        position: relative;
        font-size: 15px !important
    }
}

@media (max-width:480px) {
    .content9 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 42%;
        z-index: 0;
        padding: 2rem;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important;
        margin-top: 21% !important
    }
}

@media (min-width:481px) and (max-width:767px) {
    .content9 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 1100px !important;
        z-index: 0;
        margin-top: -1% !important;
        padding: 2rem;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important
    }
}

@media (min-width:768px) and (max-width:991px) {
    .content9 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 900px !important;
        z-index: 0;
        margin-top: -1% !important;
        padding: 2rem;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important
    }
}

@media (min-width:992px) and (max-width:1199px) {
    .content9 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 920px !important;
        z-index: 0;
        margin-top: -1% !important;
        padding: 1rem 6rem;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important
    }
}

@media (min-width:1200px) and (max-width:1500px) {
    .content9 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 1000px !important;
        z-index: 0;
        margin-top: -1% !important;
        padding: 2rem 12rem;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important
    }
}

@media (min-width:1501px) and (max-width:2000px) {
    .content9 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 900px !important;
        z-index: 0;
        margin-top: -1% !important;
        padding: 2rem 19rem;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important
    }
}

@media (min-width:2001px) and (max-width:3000px) {
    .content9 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 900px !important;
        z-index: 0;
        margin-top: -1% !important;
        padding: 2rem 30rem;
        text-align: center;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important
    }
}

#contactinfoc,
#contactinfoc a,
#contactinfoc p {
    color: #6e575a !important
}

.contactcontainer {
    max-width: 900px;
    margin: 0 auto
}

@media (max-width:480px) {
    .contactc {
        z-index: 1;
        background-color: #f9ffe3;
        width: 100%;
        height: 1708px;
        padding: 3rem;
        margin-bottom: -25% !important
    }
}

@media (min-width:481px) and (max-width:767px) {
    .contactc {
        z-index: 1;
        background-color: #f9ffe3;
        width: 100%;
        height: 1500px !important;
        padding: 3rem 4rem;
        margin-bottom: -60% !important
    }

    #contactformc {
        float: right;
        color: #6e575a !important;
        font-weight: 500 !important;
        font-size: 15px !important
    }
}

@media (min-width:768px) and (max-width:991px) {
    .contactc {
        z-index: 1;
        background-color: #f9ffe3;
        width: 100%;
        height: 1370px !important;
        padding: 2rem 6rem !important;
        margin-bottom: -28% !important
    }
}

@media (min-width:992px) and (max-width:1199px) {
    .contactc {
        z-index: 1;
        background-color: #f9ffe3;
        width: 100%;
        height: 1400px !important;
        padding: 2rem 7rem !important;
        margin-bottom: -30% !important
    }

    #contactformc {
        float: right;
        color: #6e575a !important;
        font-weight: 500 !important;
        font-size: 15px !important
    }
}

@media (min-width:1200px) and (max-width:1500px) {
    .contactc {
        display: block;
        position: relative;
        z-index: -1;
        margin-top: -5% !important;
        background-color: #f9ffe3;
        width: 100%;
        height: 1500px !important;
        padding: 8rem 14rem !important;
        margin-bottom: -40% !important
    }
}

@media (min-width:1501px) and (max-width:1600px) {
    .contactc {
        z-index: 1;
        background-color: #f9ffe3;
        width: 100%;
        height: 1700px !important;
        padding: 8rem 20rem !important;
        margin-bottom: -30% !important
    }
}

@media (min-width:1601px) and (max-width:2000px) {
    .contactc {
        z-index: 1;
        background-color: #f9ffe3;
        width: 100%;
        height: 1850px !important;
        padding: 6% 23% !important;
        margin-bottom: -30% !important
    }
}

@media (min-width:2001px) and (max-width:3000px) {
    .contactc {
        z-index: 1;
        background-color: #f9ffe3;
        width: 100%;
        height: 2150px;
        padding: 2rem 30rem !important;
        margin-bottom: -40% !important
    }

    #contactformc {
        float: right;
        color: #6e575a !important;
        font-weight: 500 !important;
        font-size: 15px !important
    }

    #contactfieldc {
        padding-bottom: 5px;
        padding-top: 5px;
        color: #6e575a !important;
        font-weight: 500 !important;
        font-size: 15px !important
    }
}

#contactinfoc {
    text-align: center;
    margin-bottom: 20%;
    background-color: #f9ffe3;
    font-size: 15px !important
}

@media (max-width:480px) {

    #contactfieldc,
    #contactformc {
        color: #6e575a !important;
        font-weight: 500 !important;
        font-size: 15px !important
    }

    #contactformc {
        margin-top: 10% !important;
        margin-bottom: 20% !important;
        margin-left: 10% !important
    }

    #contactfieldc {
        padding-bottom: 5px;
        padding-top: 5px
    }

    #contactformc p {
        text-align: left
    }
}

@media (min-width:481px) and (max-width:767px) {
    #contactfieldc {
        padding-bottom: 5px;
        padding-top: 5px;
        color: #6e575a !important;
        font-weight: 500 !important;
        font-size: 15px !important
    }
}

@media (min-width:767px) and (max-width:991px) {

    #contactfieldc,
    #contactformc {
        color: #6e575a !important;
        font-weight: 500 !important;
        font-size: 15px !important
    }

    #contactformc {
        float: right
    }

    #contactfieldc {
        padding-bottom: 5px;
        padding-top: 5px
    }
}

@media (min-width:992px) and (max-width:1199px) {
    #contactfieldc {
        padding-bottom: 5px;
        padding-top: 5px;
        color: #6e575a !important;
        font-weight: 500 !important;
        font-size: 15px !important
    }
}

@media (min-width:1200px) and (max-width:1399px) {

    #contactfieldc,
    #contactformc {
        color: #6e575a !important;
        font-weight: 500 !important;
        font-size: 15px !important
    }

    #contactformc {
        float: right
    }

    #contactfieldc {
        padding-bottom: 5px;
        padding-top: 5px
    }
}

@media (min-width:1400px) and (max-width:2000px) {

    #contactfieldc,
    #contactformc {
        color: #6e575a !important;
        font-weight: 500 !important;
        font-size: 15px !important
    }

    #contactformc {
        float: right
    }

    #contactfieldc {
        padding-bottom: 5px;
        padding-top: 5px
    }
}

#contactformc p {
    text-align: left
}

@media (min-width:300px) and (max-width:375px) {
    .form-controlc {
        background-color: #f6ffdf !important;
        width: 310px !important;
        color: #7c5247 !important;
        font-size: 15px !important;
        font-weight: 600 !important
    }
}

@media (min-width:376px) and (max-width:480px) {
    .form-controlc {
        background-color: #f6ffdf !important;
        width: 320px !important;
        color: #7c5247 !important;
        font-size: 15px !important;
        font-weight: 500 !important
    }
}

@media (min-width:481px) and (max-width:767px) {
    .form-controlc {
        background-color: #f6ffdf !important;
        width: 250px !important;
        color: #6e575a !important;
        font-weight: 500 !important;
        font-size: 15px !important
    }
}

@media (min-width:768px) and (max-width:991px) {
    .form-controlc {
        background-color: #f6ffdf !important;
        width: 280px !important;
        color: #6e575a !important;
        font-weight: 500 !important;
        font-size: 15px !important
    }
}

@media (min-width:992px) and (max-width:1199px) {
    .form-controlc {
        background-color: #f6ffdf !important;
        width: 400px !important;
        color: #6e575a !important;
        font-weight: 500 !important;
        font-size: 15px !important
    }
}

@media (min-width:1200px) and (max-width:3000px) {
    .form-controlc {
        background-color: #f6ffdf !important;
        width: 450px !important;
        color: #6e575a !important;
        font-weight: 500 !important;
        font-size: 15px !important
    }
}

#socialcontact {
    float: left
}

@media (max-width:480px) {
    #hours {
        width: 100%;
        max-width: 300px
    }

    #hiring {
        margin-top: 5rem !important;
        font-family: 'Nunito Sans', sans-serif;
        width: 100%;
        max-width: 600px;
        color: #7c5247 !important;
        font-size: 17px !important;
        font-weight: 500;
        position: relative
    }

    here {
        font-family: Lobster, cursive !important;
        color: #00979c !important;
        font-size: 18px;
        font-weight: 600
    }
}

@media (min-width:481px) {
    #hours {
        width: 100%;
        max-width: 380px;
        float: left;
        margin-top: 20px !important
    }
}

#insta {
    width: 100%;
    max-width: 600px !important
}

#flyer {
    width: 100%;
    max-width: 600px!important;
    padding-bottom: 2%;
}

@media (min-width:481px) and (max-width:767px) {
    #hiring {
        font-family: 'Nunito Sans', sans-serif;
        width: 100%;
        max-width: 600px;
        color: #7c5247 !important;
        font-size: 17px !important;
        font-weight: 500;
        position: relative;
        margin-top: 80% !important
    }

    here {
        font-family: Lobster, cursive !important;
        color: #00979c !important;
        font-size: 18px;
        font-weight: 600
    }
}

@media (min-width:768px) and (max-width:991px) {

    #hiring,
    here {
        font-size: 22px;
        font-weight: 600
    }

    #hiring {
        font-family: 'Nunito Sans', sans-serif;
        width: 100%;
        max-width: 600px;
        color: #7c5247 !important;
        z-index: 999999999999;
        position: relative;
        margin-top: 80% !important
    }

    here {
        font-family: Lobster, cursive !important;
        color: #00979c !important
    }
}

@media (min-width:992px) and (max-width:1199px) {

    #hiring,
    here {
        font-size: 22px;
        font-weight: 600
    }

    #hiring {
        font-family: 'Nunito Sans', sans-serif;
        width: 100%;
        max-width: 600px;
        color: #7c5247 !important;
        z-index: 999999999999;
        position: relative;
        margin-top: 62% !important
    }

    here {
        font-family: Lobster, cursive !important;
        color: #00979c !important
    }
}

@media (min-width:1200px) and (max-width:1499px) {

    #hiring,
    here {
        font-size: 22px;
        font-weight: 600
    }

    #hiring {
        font-family: 'Nunito Sans', sans-serif;
        width: 100%;
        max-width: 600px;
        color: #7c5247 !important;
        z-index: 999999999999;
        position: relative;
        margin-top: 58% !important
    }

    here {
        font-family: Lobster, cursive !important;
        color: #00979c !important
    }
}

@media (min-width:1500px) and (max-width:1999px) {

    #hiring,
    here {
        font-size: 22px;
        font-weight: 600
    }

    #hiring {
        font-family: 'Nunito Sans', sans-serif;
        width: 100%;
        max-width: 600px;
        color: #7c5247 !important;
        z-index: 999999999999;
        position: relative;
        margin-top: 500px !important
    }

    here {
        font-family: Lobster, cursive !important;
        color: #00979c !important
    }
}

@media (min-width:2000px) and (max-width:3000px) {

    #hiring,
    here {
        font-size: 22px;
        font-weight: 600
    }

    #hiring {
        font-family: 'Nunito Sans', sans-serif;
        width: 100%;
        max-width: 600px;
        color: #7c5247 !important;
        z-index: 999999999999;
        position: relative;
        margin-top: 580px !important
    }

    here {
        font-family: Lobster, cursive !important;
        color: #00979c !important
    }
}

#contactmarkers {
    max-width: 400px
}

#markerc {
    color: #00979c !important
}

.parallax {
    background: url(http://www.sylwiasicecream.com/img/doublerainbow.png) center no-repeat fixed;
    height: 500px;
    background-size: cover
}

@media (max-width:480px) {
    .parallax_img2 {
        background: url(http://www.sylwiasicecream.com/img/map.png) center no-repeat fixed;
        height: 500px !important;
        margin-bottom: -30% !important;
        background-size: cover
    }

    .lordc,
    .versec {
        font-family: MedievalSharp, cursive;
        text-align: center;
        color: #7c5247 !important
    }

    .lordc {
        font-size: 1.3rem !important;
        font-weight: 600 !important;
        margin-top: 6% !important
    }

    .versec {
        font-size: 1.2rem !important;
        font-weight: 700 !important
    }
}

@media (min-width:481px) and (max-width:767px) {
    .parallax_img2 {
        background: url(http://www.sylwiasicecream.com/img/map.png) center no-repeat fixed;
        height: 500px !important;
        margin-bottom: -30% !important;
        background-size: cover
    }

    .lordc,
    .versec {
        font-family: MedievalSharp, cursive;
        text-align: center;
        color: #7c5247 !important
    }

    .lordc {
        font-size: 1.5rem !important;
        font-weight: 600 !important;
        margin-top: 6% !important
    }

    .versec {
        font-size: 1.4rem !important;
        font-weight: 700 !important
    }
}

@media (min-width:768px) and (max-width:991px) {
    .parallax_img2 {
        background: url(http://www.sylwiasicecream.com/img/map.png) center no-repeat fixed;
        height: 500px !important;
        margin-bottom: -30% !important;
        background-size: cover
    }
}

@media (min-width:992px) and (max-width:1199px) {
    .parallax_img2 {
        background: url(http://www.sylwiasicecream.com/img/map.png) center no-repeat fixed;
        height: 500px !important;
        margin-bottom: -30% !important;
        background-size: cover;
        bottom: 0
    }
}

@media (min-width:1200px) and (max-width:1499px) {
    .parallax_img2 {
        background: url(http://www.sylwiasicecream.com/img/map.png) center no-repeat fixed;
        height: 550px !important;
        margin-bottom: -30% !important;
        background-size: cover;
        bottom: 0
    }
}

@media (min-width:1500px) and (max-width:2000px) {
    .parallax_img2 {
        background: url(http://www.sylwiasicecream.com/img/map.png) center no-repeat fixed;
        height: 900px !important;
        margin-bottom: -40% !important;
        background-size: cover
    }
}

@media (min-width:2001px) and (max-width:3000px) {
    .parallax_img2 {
        background: url(http://www.sylwiasicecream.com/img/map.png) center no-repeat fixed;
        height: 800px !important;
        margin-bottom: -40% !important;
        background-size: cover
    }
}

@media (min-width:3001px) and (max-width:3000px) {
    .parallax_img2 {
        background: url(http://www.sylwiasicecream.com/img/map.png) center no-repeat fixed;
        height: 900px !important;
        margin-bottom: -80% !important;
        background-size: cover
    }
}

@media (min-width:768px) and (max-width:991px) {

    .lordc,
    .versec {
        font-family: MedievalSharp, cursive;
        text-align: center;
        color: #7c5247 !important
    }

    .lordc {
        font-size: 1.5rem !important;
        font-weight: 600 !important;
        margin-top: 6% !important
    }

    .versec {
        font-size: 1.4rem !important;
        font-weight: 700 !important
    }
}

@media (min-width:992px) and (max-width:1199px) {

    .lordc,
    .versec {
        font-family: MedievalSharp, cursive;
        text-align: center;
        color: #7c5247 !important
    }

    .lordc {
        font-size: 1.8em !important;
        font-weight: 600 !important;
        margin-top: 5% !important
    }

    .versec {
        font-size: 1.7em !important;
        font-weight: 700 !important
    }
}

@media (min-width:1200px) and (max-width:1500px) {

    .lordc,
    .versec {
        font-family: MedievalSharp, cursive;
        text-align: center;
        color: #7c5247 !important
    }

    .lordc {
        font-size: 2.2em !important;
        font-weight: 600 !important;
        margin-top: 2% !important
    }

    .versec {
        font-size: 2em !important;
        font-weight: 700 !important
    }
}

@media (min-width:1501px) and (max-width:2000px) {

    .lordc,
    .versec {
        font-family: MedievalSharp, cursive;
        text-align: center;
        color: #7c5247 !important
    }

    .lordc {
        font-size: 1.8rem !important;
        font-weight: 600 !important;
        margin-top: 2% !important
    }

    .versec {
        font-size: 1.7rem !important;
        font-weight: 700 !important
    }
}

@media (min-width:2001px) and (max-width:3000px) {

    .lordc,
    .versec {
        font-family: MedievalSharp, cursive;
        text-align: center;
        color: #7c5247 !important
    }

    .lordc {
        font-size: 1.8rem !important;
        font-weight: 600 !important;
        margin-top: 2% !important
    }

    .versec {
        font-size: 1.7rem !important;
        font-weight: 700 !important
    }
}

@media (max-width:480px) {
    .content4 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 6550px;
        z-index: 1;
        padding: 2rem 1rem;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important;
        border-radius: 3px !important
    }
}

@media (min-width:481px) and (max-width:767px) {
    .content4 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 5880px;
        z-index: 1;
        padding: 2rem;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important;
        border-radius: 3px !important
    }
}

@media (min-width:768px) and (max-width:991px) {
    .content4 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 5350px;
        z-index: 1;
        padding: 2rem;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important;
        border-radius: 3px !important
    }
}

@media (min-width:992px) and (max-width:1199px) {
    .content4 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 4300px !important;
        z-index: 1;
        padding: 10rem 3rem;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important;
        border-radius: 3px !important
    }
}

@media (min-width:1200px) and (max-width:1500px) {
    .content4 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 4300px !important;
        z-index: 1;
        padding: 8rem;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important;
        border-radius: 3px !important
    }
}

@media (min-width:1501px) and (max-width:3000px) {
    .content4 {
        display: block;
        position: relative;
        background-color: #f9ffe3;
        height: 45% !important;
        z-index: 1;
        padding: 10rem 6rem;
        font-family: Montserrat, sans-serif;
        color: #7c5247 !important;
        border-radius: 3px !important
    }
}

#careercontactform {
    max-width: 3000px !important;
    border-radius: 2px !important
}

@media (min-width:300px) and (max-width:480px) {

    .firstname,
    .lastname,
    .middlename {
        text-decoration: none;
        text-decoration-color: none;
        -webkit-appearance: none;
        margin-bottom: 5px;
        height: 34px
    }

    .additionalcomments,
    .address,
    .citizen,
    .city,
    .company,
    .contactfield10,
    .degree,
    .edyear,
    .eightteen,
    .emailaddress,
    .emergencycontactnumber,
    .enddate,
    .felony,
    .firstname,
    .lastname,
    .major,
    .middlename,
    .phone,
    .reasonleaving,
    .recentwork,
    .refname,
    .refone,
    .refphone,
    .refrelationship,
    .refthree,
    .reftwo,
    .relationship,
    .school,
    .startdate,
    .state,
    .title,
    .transportation,
    .workcity,
    .workdes,
    .workstate,
    .zip {
        padding: 3px;
        font-size: 14px;
        line-height: 1.42857143;
        color: #555;
        background-color: #fff;
        background-image: none;
        width: 100%
    }

    .firstname {
        display: inline-block !important;
        max-width: 120px !important;
        border: 1px solid #ccc;
        border-radius: 2px !important;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
    }

    .lastname,
    .middlename {
        border: 1px solid #ccc;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        border-radius: 2px !important;
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
    }

    .middlename {
        max-width: 50px !important;
        display: inline-block
    }

    .city,
    .lastname {
        max-width: 120px !important
    }

    .lastname {
        display: inline-block !important
    }

    .address,
    .city {
        display: inline-block !important;
        height: 34px;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        border: 1px solid #ccc;
        border-radius: 2px !important;
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        text-decoration: none;
        text-decoration-color: none;
        -webkit-appearance: none;
        margin-bottom: 5px
    }

    .address {
        max-width: 360px !important
    }

    .citizen,
    .eightteen,
    .emailaddress,
    .emergencycontactnumber,
    .felony,
    .phone,
    .relationship,
    .state,
    .transportation,
    .zip {
        display: inline-block !important;
        height: 34px;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        text-decoration: none;
        text-decoration-color: none;
        -webkit-appearance: none;
        margin-bottom: 5px
    }

    .state,
    .zip {
        max-width: 90px !important;
        border: 1px solid #ccc;
        border-radius: 2px !important;
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
    }

    .citizen,
    .eightteen,
    .emailaddress,
    .emergencycontactnumber,
    .felony,
    .phone,
    .relationship,
    .transportation {
        max-width: 412px !important;
        border: 1px solid #ccc;
        border-radius: 2px !important;
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
    }

    .enddate,
    .recentwork,
    .startdate {
        display: inline-block !important;
        height: 34px;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        border: 1px solid #ccc;
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        -webkit-appearance: none;
        text-decoration: none;
        text-decoration-color: none;
        margin-bottom: 5px
    }

    .recentwork {
        max-width: 330px !important;
        border-radius: 2px !important
    }

    .enddate,
    .startdate {
        max-width: 153px !important;
        border-radius: 2px !important
    }

    .company,
    .title,
    .workcity,
    .workstate {
        border: 1px solid #ccc;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        text-decoration: none;
        text-decoration-color: none;
        -webkit-appearance: none;
        margin-bottom: 5px;
        display: inline-block !important;
        height: 34px;
        border-radius: 2px !important;
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
    }

    .company,
    .title {
        max-width: 350px !important
    }

    .workcity,
    .workstate {
        max-width: 153px !important
    }

    .additionalcomments,
    .degree,
    .edyear,
    .major,
    .reasonleaving,
    .refname,
    .refone,
    .refphone,
    .refrelationship,
    .refthree,
    .reftwo,
    .school,
    .workdes {
        border: 1px solid #ccc;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        border-radius: 2px !important;
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
    }

    .reasonleaving,
    .workdes {
        display: inline-block !important;
        max-width: 412px !important;
        height: 34px;
        text-decoration: none;
        text-decoration-color: none;
        -webkit-appearance: none;
        margin-bottom: 5px
    }

    .degree,
    .edyear,
    .major,
    .refname,
    .refone,
    .refphone,
    .refrelationship,
    .refthree,
    .reftwo,
    .school {
        display: inline-block !important;
        max-width: 350px !important;
        height: 34px;
        text-decoration: none;
        text-decoration-color: none;
        -webkit-appearance: none;
        margin-bottom: 5px
    }

    .additionalcomments,
    .contactfield10 {
        display: inline-block !important;
        max-width: 1000px !important;
        -webkit-appearance: none;
        text-decoration: none;
        text-decoration-color: none;
        margin-bottom: 5px
    }

    .additionalcomments {
        height: 200px
    }

    .contactfield10 {
        height: 34px;
        border: 1px solid #ccc;
        border-radius: 2px !important;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
    }

    #contactfield37,
    #contactfield38,
    #contactfield39 {
        width: 100%;
        max-width: 900px !important;
        display: inline-block;
        text-decoration: none;
        text-decoration-color: none;
        -webkit-appearance: none !important;
        margin-bottom: 5px
    }
}

@media (min-width:481px) and (max-width:1022px) {

    .firstname,
    .lastname,
    .middlename {
        text-decoration: none;
        text-decoration-color: none;
        -webkit-appearance: none;
        margin-bottom: 5px;
        height: 34px
    }

    .additionalcomments,
    .address,
    .citizen,
    .city,
    .contactfield10,
    .degree,
    .edyear,
    .eightteen,
    .emailaddress,
    .emergencycontactnumber,
    .enddate,
    .felony,
    .firstname,
    .lastname,
    .major,
    .middlename,
    .phone,
    .reasonleaving,
    .recentwork,
    .refname,
    .refone,
    .refphone,
    .refrelationship,
    .refthree,
    .reftwo,
    .relationship,
    .school,
    .startdate,
    .state,
    .title,
    .transportation,
    .workdes,
    .zip {
        padding: 3px;
        font-size: 14px;
        line-height: 1.42857143;
        color: #555;
        background-color: #fff;
        background-image: none;
        width: 100%
    }

    .firstname {
        display: inline-block !important;
        max-width: 120px !important;
        border: 1px solid #ccc;
        border-radius: 2px !important;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
    }

    .lastname,
    .middlename {
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        border: 1px solid #ccc;
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
    }

    .middlename {
        max-width: 50px !important;
        display: inline-block;
        border-radius: 2px !important
    }

    .city,
    .lastname {
        max-width: 120px !important
    }

    .lastname {
        display: inline-block !important;
        border-radius: 2px !important
    }

    .address,
    .city {
        display: inline-block !important;
        height: 34px;
        border: 1px solid #ccc;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        border-radius: 2px !important;
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        text-decoration: none;
        text-decoration-color: none;
        -webkit-appearance: none;
        margin-bottom: 5px
    }

    .address {
        max-width: 300px !important
    }

    .citizen,
    .eightteen,
    .emailaddress,
    .emergencycontactnumber,
    .felony,
    .phone,
    .relationship,
    .state,
    .transportation,
    .zip {
        display: inline-block !important;
        height: 34px;
        border: 1px solid #ccc;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        text-decoration: none;
        text-decoration-color: none;
        -webkit-appearance: none;
        margin-bottom: 5px;
        border-radius: 2px !important;
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
    }

    .state,
    .zip {
        max-width: 90px !important
    }

    .citizen,
    .eightteen,
    .emailaddress,
    .emergencycontactnumber,
    .felony,
    .phone,
    .relationship,
    .transportation {
        max-width: 300px !important
    }

    .enddate,
    .recentwork,
    .startdate,
    .title {
        display: inline-block !important;
        height: 34px;
        border: 1px solid #ccc;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        border-radius: 2px !important;
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        text-decoration: none;
        text-decoration-color: none;
        -webkit-appearance: none;
        margin-bottom: 5px
    }

    .recentwork {
        max-width: 330px !important
    }

    .enddate,
    .startdate,
    .title {
        max-width: 140px !important
    }

    .company,
    .workcity,
    .workstate {
        display: inline-block !important;
        width: 100%;
        height: 34px;
        padding: 3px;
        font-size: 14px;
        line-height: 1.42857143;
        color: #555;
        background-color: #fff;
        background-image: none;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        text-decoration: none;
        text-decoration-color: none;
        -webkit-appearance: none;
        margin-bottom: 5px;
        border: 1px solid #ccc;
        border-radius: 2px !important;
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
    }

    .company {
        max-width: 180px !important
    }

    .workcity,
    .workstate {
        max-width: 153px !important
    }

    .reasonleaving,
    .refone,
    .refthree,
    .reftwo,
    .workdes {
        display: inline-block !important;
        height: 34px;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
    }

    .reasonleaving,
    .workdes {
        max-width: 300px !important;
        border: 1px solid #ccc;
        border-radius: 2px !important;
        text-decoration: none;
        text-decoration-color: none;
        -webkit-appearance: none;
        margin-bottom: 5px
    }

    .degree,
    .edyear,
    .refone,
    .refthree,
    .reftwo {
        border: 1px solid #ccc;
        -webkit-appearance: none;
        text-decoration: none;
        text-decoration-color: none;
        margin-bottom: 5px
    }

    .refone,
    .refthree,
    .reftwo {
        max-width: 200px !important;
        border-radius: 2px !important
    }

    .degree,
    .edyear {
        display: inline-block !important;
        height: 34px;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
    }

    .edyear {
        max-width: 120px !important;
        border-radius: 2px !important
    }

    .degree {
        max-width: 160px !important;
        border-radius: 2px !important
    }

    .major,
    .school {
        border: 1px solid #ccc;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        text-decoration: none;
        text-decoration-color: none;
        -webkit-appearance: none;
        margin-bottom: 5px;
        display: inline-block !important;
        height: 34px;
        border-radius: 2px !important;
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
    }

    .school {
        max-width: 200px !important
    }

    .major {
        max-width: 120px !important
    }

    .additionalcomments,
    .refname,
    .refphone,
    .refrelationship {
        border: 1px solid #ccc;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        border-radius: 2px !important;
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
    }

    .refname,
    .refrelationship {
        display: inline-block !important;
        max-width: 200px !important;
        height: 34px;
        text-decoration: none;
        text-decoration-color: none;
        -webkit-appearance: none;
        margin-bottom: 5px
    }

    .refphone {
        display: inline-block !important;
        max-width: 210px !important;
        height: 34px;
        text-decoration: none;
        text-decoration-color: none;
        -webkit-appearance: none;
        margin-bottom: 5px
    }

    .additionalcomments,
    .contactfield10 {
        display: inline-block !important;
        max-width: 1000px !important;
        -webkit-appearance: none;
        text-decoration: none;
        text-decoration-color: none;
        margin-bottom: 5px
    }

    .additionalcomments {
        height: 200px
    }

    .contactfield10 {
        height: 34px;
        border: 1px solid #ccc;
        border-radius: 2px !important;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
    }

    #contactfield37,
    #contactfield38,
    #contactfield39 {
        width: 100%;
        max-width: 900px !important;
        display: inline-block;
        text-decoration: none;
        text-decoration-color: none;
        -webkit-appearance: none !important;
        margin-bottom: 5px
    }
}

@media (min-width:1023px) and (max-width:4000px) {

    .firstname,
    .lastname,
    .middlename {
        text-decoration: none;
        text-decoration-color: none;
        -webkit-appearance: none;
        margin-bottom: 5px;
        height: 34px
    }

    .additionalcomments,
    .address,
    .citizen,
    .city,
    .contactfield10,
    .degree,
    .edyear,
    .eightteen,
    .emailaddress,
    .emergencycontactnumber,
    .felony,
    .firstname,
    .lastname,
    .major,
    .middlename,
    .phone,
    .reasonleaving,
    .recentwork,
    .refname,
    .refone,
    .refphone,
    .refrelationship,
    .refthree,
    .reftwo,
    .relationship,
    .school,
    .state,
    .transportation,
    .workcity,
    .workdes,
    .workstate,
    .zip {
        padding: 3px;
        font-size: 14px;
        line-height: 1.42857143;
        color: #555;
        background-color: #fff;
        background-image: none;
        width: 100%
    }

    .firstname {
        display: inline-block !important;
        max-width: 340px !important;
        border: 1px solid #ccc;
        border-radius: 2px !important;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
    }

    .lastname,
    .middlename {
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        border: 1px solid #ccc;
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
    }

    .middlename {
        max-width: 140px !important;
        display: inline-block;
        border-radius: 2px !important
    }

    .lastname {
        display: inline-block !important;
        max-width: 340px !important;
        border-radius: 2px !important
    }

    .address,
    .city {
        display: inline-block !important;
        height: 34px;
        border: 1px solid #ccc;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        border-radius: 2px !important;
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        text-decoration: none;
        text-decoration-color: none;
        -webkit-appearance: none;
        margin-bottom: 5px
    }

    .address {
        max-width: 360px !important
    }

    .city {
        max-width: 220px !important
    }

    .state,
    .zip {
        display: inline-block !important;
        height: 34px;
        border: 1px solid #ccc;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        text-decoration: none;
        text-decoration-color: none;
        -webkit-appearance: none;
        margin-bottom: 5px;
        border-radius: 2px !important;
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
    }

    .state {
        max-width: 140px !important
    }

    .zip {
        max-width: 95px !important
    }

    .citizen,
    .eightteen,
    .emailaddress,
    .emergencycontactnumber,
    .felony,
    .phone,
    .recentwork,
    .relationship,
    .transportation {
        display: inline-block !important;
        height: 34px;
        border: 1px solid #ccc;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        border-radius: 2px !important;
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        text-decoration: none;
        text-decoration-color: none;
        -webkit-appearance: none;
        margin-bottom: 5px
    }

    .citizen,
    .eightteen,
    .emailaddress,
    .emergencycontactnumber,
    .felony,
    .phone,
    .relationship,
    .transportation {
        max-width: 412px !important
    }

    .recentwork {
        max-width: 330px !important
    }

    .company,
    .enddate,
    .startdate,
    .title {
        display: inline-block !important;
        width: 100%;
        height: 34px;
        padding: 3px;
        font-size: 14px;
        line-height: 1.42857143;
        color: #555;
        background-color: #fff;
        background-image: none;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        text-decoration: none;
        text-decoration-color: none;
        -webkit-appearance: none;
        margin-bottom: 5px;
        border: 1px solid #ccc;
        border-radius: 2px !important;
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
    }

    .enddate,
    .startdate {
        max-width: 150px !important
    }

    .company,
    .title {
        max-width: 255px !important
    }

    .workcity,
    .workstate {
        display: inline-block !important;
        height: 34px;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
    }

    .workcity {
        max-width: 200px !important;
        border: 1px solid #ccc;
        border-radius: 2px !important;
        text-decoration: none;
        text-decoration-color: none;
        -webkit-appearance: none;
        margin-bottom: 5px
    }

    .reasonleaving,
    .refone,
    .refthree,
    .reftwo,
    .workdes,
    .workstate {
        border: 1px solid #ccc;
        -webkit-appearance: none;
        text-decoration: none;
        text-decoration-color: none;
        margin-bottom: 5px
    }

    .workstate {
        max-width: 150px !important;
        border-radius: 2px !important
    }

    .reasonleaving,
    .refone,
    .refthree,
    .reftwo,
    .workdes {
        display: inline-block !important;
        height: 34px;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
    }

    .reasonleaving,
    .workdes {
        max-width: 412px !important;
        border-radius: 2px !important
    }

    .refone,
    .refthree,
    .reftwo {
        max-width: 274px !important;
        border-radius: 2px !important
    }

    .degree,
    .edyear,
    .school {
        border: 1px solid #ccc;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        text-decoration: none;
        text-decoration-color: none;
        -webkit-appearance: none;
        margin-bottom: 5px;
        display: inline-block !important;
        height: 34px;
        border-radius: 2px !important;
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
    }

    .degree,
    .edyear {
        max-width: 200px !important
    }

    .school {
        max-width: 220px !important
    }

    .additionalcomments,
    .major,
    .refname,
    .refphone,
    .refrelationship {
        border: 1px solid #ccc;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        border-radius: 2px !important;
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
    }

    .major {
        display: inline-block !important;
        max-width: 200px !important;
        height: 34px;
        text-decoration: none;
        text-decoration-color: none;
        -webkit-appearance: none;
        margin-bottom: 5px
    }

    .refname,
    .refphone,
    .refrelationship {
        display: inline-block !important;
        max-width: 274px !important;
        height: 34px;
        text-decoration: none;
        text-decoration-color: none;
        -webkit-appearance: none;
        margin-bottom: 5px
    }

    .additionalcomments,
    .contactfield10 {
        display: inline-block !important;
        max-width: 1000px !important;
        -webkit-appearance: none;
        text-decoration: none;
        text-decoration-color: none;
        margin-bottom: 5px
    }

    .additionalcomments {
        height: 200px
    }

    .contactfield10 {
        height: 34px;
        border: 1px solid #ccc;
        border-radius: 2px !important;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
        -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
        -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
        transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
    }

    #contactfield37,
    #contactfield38,
    #contactfield39 {
        width: 100%;
        max-width: 900px !important;
        display: inline-block;
        text-decoration: none;
        text-decoration-color: none;
        -webkit-appearance: none !important;
        margin-bottom: 5px
    }
}

.form-control1,
.form-control2,
.form-control3,
.form-control4,
.form-control5 {
    display: inline-block !important;
    font-size: 14px;
    color: #555;
    margin-bottom: 5px
}

.form-control1,
.form-control2,
.form-control3,
.form-control4 {
    width: 100%;
    border: 1px solid #ccc;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    border-radius: 4px;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    line-height: 1.42857143;
    background-color: #fff;
    background-image: none;
    text-decoration-color: none;
    -webkit-appearance: none;
    text-decoration: none
}

.form-control1,
.form-control2,
.form-control3 {
    height: 34px;
    padding: 3px
}

.form-control4,
.form-control5 {
    max-width: 800px;
    padding: 6px 18px
}

.form-control4 {
    height: 200px
}

.form-control,
.form-control5 {
    width: 100%;
    height: 34px;
    line-height: 1.42857143;
    background-color: #fff;
    background-image: none;
    text-decoration-color: none;
    -webkit-appearance: none;
    text-decoration: none
}

.form-control5 {
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
}

@media (min-width:1023px) {

    .form-control1,
    .form-control2,
    .form-control3 {
        width: 100%;
        max-width: 263px !important;
        margin-bottom: 5px
    }
}

@media (min-width:1200px) and (max-width:3000px) {
    #contactform {
        padding-left: 15%;
        color: #6e575a !important;
        font-weight: 500 !important;
        font-size: 15px !important
    }
}

@media (min-width:992px) and (max-width:1199px) {
    #contactform {
        padding-left: 8%
    }
}

#contactform textarea:focus,
input:focus {
    outline: 0
}

.form-control {
    display: block;
    max-width: 800px;
    padding: 6px 12px;
    font-size: 14px;
    color: #555
}

.form-control:focus {
    border-color: #ff8ef6 !important;
    text-decoration: none;
    outline: 0 !important
}

.form-control::-moz-placeholder {
    color: #6e575a !important;
    opacity: 1
}

.form-control:-ms-input-placeholder {
    color: #6e575a !important
}

.form-control::-webkit-input-placeholder {
    color: #6e575a !important
}

.form-control[disabled],
.form-control[readonly],
fieldset[disabled] .form-control {
    background-color: #eee;
    opacity: 1
}

.form-control[disabled],
fieldset[disabled] .form-control {
    cursor: not-allowed
}

#timewrapper {
    margin-bottom: 1% !important;
    max-width: 2000px !important
}

.weekDays-selector input {
    display: none !important
}

.weekDays-selector input[type=checkbox]+label {
    display: inline-block;
    border-radius: 6px;
    background: #ddd;
    height: 40px;
    width: 66px;
    margin-right: 3px;
    line-height: 40px;
    text-align: center;
    cursor: pointer
}

.weekDays-selector input[type=checkbox]:checked+label {
    background: #15B5BB;
    color: #fff
}

appname,
day {
    font-family: Lobster, cursive !important;
    font-size: 22px !important;
    font-weight: 600;
    color: #7c5247 !important;
    padding-right: 2%
}

@media (max-width:480px) {

    appname,
    day {
        font-family: Lobster, cursive !important;
        font-size: 22px !important;
        font-weight: 600;
        color: #7c5247 !important
    }

    day {
        padding-right: 65% !important
    }
}

#spinner {
    text-align: center;
    position: fixed;
    left: 0;
    top: 40%;
    width: 100%;
    height: 100%;
    z-index: 9999
}

#spinner>div {
    background-color: #15B5BB;
    width: 20px;
    height: 20px;
    border-radius: 100%;
    display: inline-block;
    -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
    animation: sk-bouncedelay 1.4s infinite ease-in-out both
}

#spinner .bounce1 {
    -webkit-animation-delay: -.32s;
    animation-delay: -.32s;
    background-color: #ffe600
}

#spinner .bounce2 {
    -webkit-animation-delay: -.16s;
    animation-delay: -.16s;
    background-color: #d46ead
}

@-webkit-keyframes sk-bouncedelay {

    0%,
    100%,
    80% {
        -webkit-transform: scale(0)
    }

    40% {
        -webkit-transform: scale(1)
    }
}

@keyframes sk-bouncedelay {

    0%,
    100%,
    80% {
        -webkit-transform: scale(0);
        transform: scale(0)
    }

    40% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

#map {
    width: 100%;
    height: 400px !important
}

@media (min-width:300px) and (max-width:320px) {
    #map {
        width: 100%;
        height: 412px !important;
        border: none;
        margin-top: -2% !important;
        margin-bottom: -3% !important;
        z-index: 0;
        position: relative
    }
}

@media (min-width:321px) and (max-width:380px) {
    #map {
        width: 100%;
        height: 425px !important;
        border: none;
        margin-top: -2% !important;
        margin-bottom: -3% !important;
        z-index: 0;
        position: relative
    }
}

@media (min-width:381px) and (max-width:480px) {
    #map {
        width: 100%;
        height: 425px !important;
        border: none;
        margin-top: -2% !important;
        margin-bottom: -3% !important;
        z-index: 0;
        position: relative
    }
}

@media (min-width:481px) and (max-width:767px) {
    #map {
        width: 100%;
        height: 425px !important;
        border: none;
        margin-top: -2% !important;
        margin-bottom: -3% !important;
        z-index: 0;
        position: relative
    }
}

@media (min-width:768px) and (max-width:991px) {
    #map {
        width: 100%;
        height: 440px !important;
        border: none;
        margin-bottom: -3% !important;
        margin-top: -2% !important;
        z-index: 0;
        position: relative
    }
}

@media (min-width:992px) and (max-width:1199px) {
    #map {
        width: 100%;
        height: 440px !important;
        border: none;
        margin-top: -2% !important;
        margin-bottom: -3% !important;
        z-index: 0;
        position: relative
    }
}

@media (min-width:1200px) and (max-width:1399px) {
    #map {
        width: 100%;
        height: 500px !important;
        border: none;
        margin-top: -2% !important;
        margin-bottom: -3% !important;
        z-index: 0;
        position: relative
    }
}

@media (min-width:1400px) and (max-width:1799px) {
    #map {
        width: 100%;
        height: 458px !important;
        border: none;
        margin-top: -2% !important;
        margin-bottom: -3% !important;
        z-index: 0;
        position: relative
    }
}

@media (min-width:1800px) and (max-width:1999px) {
    #map {
        width: 100%;
        height: 465px !important;
        border: none;
        margin-top: -2% !important;
        margin-bottom: -3% !important;
        z-index: 0;
        position: relative
    }
}

@media (min-width:2000px) and (max-width:3000px) {
    #map {
        width: 100%;
        height: 480px !important;
        border: none;
        margin-top: -1% !important;
        margin-bottom: -1% !important;
        z-index: 0;
        position: relative
    }
}