/* ==========================================================================
CSS Queries
========================================================================== */

/* min-width */

@media screen and (min-width:1278px) {
    .censr-top { background: url(../img/tigerhacks-banner-clip-md.jpeg) no-repeat center top; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }
}

@media screen and (min-width:1360px) {
    #musician-small { background: url(../img/wine-bar.webp) no-repeat center -10px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }
}

@media screen and (min-width:1440px) {
    .kq-tile { background: url(../img/band-whole-compressed.webp) no-repeat center -20px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }
}

@media screen and (min-width:1450px) {
    #musician-small { background: url(../img/wine-bar.webp) no-repeat center -16px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }
}

@media screen and (min-width:1500px) {
    #musician-small { background: url(../img/wine-bar.webp) no-repeat center -360px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: 250%; }
}

@media screen and (min-width:1540px) {
    #musician-small { background: url(../img/wine-bar.webp) no-repeat center -390px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: 250%; }
}

@media screen and (min-width:1650px) {
    #musician-small { background: url(../img/wine-bar.webp) no-repeat center -430px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: 250%; }
}

@media screen and (min-width:1680px) {
    .kq-tile { background: url(../img/band-whole-compressed.webp) no-repeat center -26px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }
}

@media screen and (min-width:1780px) {
    #musician-small { background: url(../img/wine-bar.webp) no-repeat center -460px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: 250%; }
}

@media screen and (min-width:1850px) {
    .section-4 { background: url(../img/piano-bw.webp) no-repeat center -140px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; height: 600px; }
}

@media screen and (min-width:1880px) {
    #musician-small { background: url(../img/wine-bar.webp) no-repeat center -360px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: 200%; }
}

@media screen and (min-width:1970px) {
    #musician-small { background: url(../img/wine-bar.webp) no-repeat center -390px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: 200%; }
}

@media screen and (min-width:1990px) {
    .kq-tile { background: url(../img/band-whole-compressed.webp) no-repeat center -30px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }
}

@media screen and (min-width:2030px) {
    .section-4 { background: url(../img/piano-bw.webp) no-repeat center -150px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; height: 600px; }
}

@media screen and (min-width:2070px) {
    #musician-small { background: url(../img/wine-bar.webp) no-repeat center -420px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: 200%; }
}

@media screen and (min-width:2200px) {
    #musician-small { background: url(../img/wine-bar.webp) no-repeat center -440px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: 200%; }
}

@media screen and (min-width:2240px) {
    .section-3 { background: url(../img/Cerner-alt.webp) no-repeat -210px center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; height: 600px; position: relative; }
}

@media screen and (min-width:2280px) {
    #musician-small { background: url(../img/wine-bar.webp) no-repeat center -470px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: 200%; }
}

@media screen and (min-width:2300px) {
    .kq-tile { background: url(../img/band-whole-compressed.webp) no-repeat center -35px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }
}

@media screen and (min-width:2320px) {
    .section-4 { background: url(../img/piano-bw.webp) no-repeat center -170px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; height: 600px; }
}

@media screen and (min-width:2390px) {
    #musician-small { background: url(../img/wine-bar.webp) no-repeat center -500px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: 200%; }
}

@media screen and (min-width:2450px) {
    .censr-top { background: url(../img/tigerhacks-banner-clip-md.jpeg) no-repeat center -13px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }
    .section-4 { background: url(../img/piano-bw.webp) no-repeat center -180px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; height: 600px; }
}

@media screen and (min-width:2480px) {
    #musician-small { background: url(../img/wine-bar.webp) no-repeat center -525px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: 200%; }
}

@media screen and (min-width:2500px) {
    .section-4 { background: url(../img/piano-bw.webp) no-repeat center -186px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; height: 600px; }
}

@media screen and (min-width:2540px) {
    .section-3 { background: url(../img/Cerner-alt.webp) no-repeat -200px center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; height: 600px; position: relative; }
}

@media screen and (min-width:2550px) {
    #musician-small { background: url(../img/wine-bar.webp) no-repeat center -530px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: 200%; }
}

@media screen and (min-width:2561px) {
    .section-3 { background: url(../img/Cerner-alt.webp) no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; height: 600px; position: relative; }
}

/* max-width */

@media screen and (max-width:1277px) {
    p.text-intro { font-size: 30px; }
}

@media screen and (max-width:1205px) {
    p.text-intro { font-size: 28px; }
    #days-header { font-size: 4.5em; }
}

@media screen and (max-width:1130px) {
    p.text-intro { font-size: 26px; }
    p.text-intro-smaller { font-size: 16px; }
}

@media screen and (max-width:1096px) {
    #days-header { font-size: 4em; }
}

@media screen and (max-width:1084px) {
    #prc-header { font-size: 5em; }
}

@media screen and (max-width:1057px) {
    p.text-intro { font-size: 25px; }
}

@media screen and (max-width:1020px) {
    p.text-intro { font-size: 24px; }
}

@media screen and (max-width:1004px) {
    #photo-text { font-size: 9px; }
}

@media screen and (max-width:995px) {
    #freelance-music-text { font-size: 13px; }
}

@media screen and (max-width:991px) {
    .censr-top { background: url(../img/tigerhacks-banner-clip-md.jpeg) no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-position: top; }
    .small-featured-img { height: 350px; width: 100%; position: absolute; bottom: 0; }
    #photo-text { font-size: 10px; }
    #freelance-music-text { font-size: 14px; }
    #musician-small { background-position-y: -53px; }
    .title-name-lg { display: none; }
    .title-name-md { display: block; }
    .title-top-lg { display: none; }
    .title-top-md { display: block; }
    .title-bottom-lg { display: none; }
    .title-bottom-md { display: block; }
    p.text-intro { font-size: 36px; }
    p.text-intro-smaller { font-size: 18px; }
    .section-3 { background: url(../img/Cerner-alt.webp) no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; height: 600px; position: relative; }
    .section-4 { background: url(../img/piano-bw.webp) no-repeat center bottom; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; height: 600px; }
}

@media screen and (max-width:959px) {
    p.text-intro { font-size: 34px; }
}

@media screen and (max-width:944px) {
    #musician-small { background-position-y: -45px; }
}

@media screen and (max-width:910px) {
    p.text-intro { font-size: 32px; }
}

@media screen and (max-width:906px) {
    #musician-small { background-position-y: -35px; }
}

@media screen and (max-width:872px) {
    #musician-small { background-position-y: -25px; }
}

@media screen and (max-width:861px) {
    p.text-intro { font-size: 30px; }
    p.text-intro-smaller { font-size: 16px; }
}

@media screen and (max-width:850px) {
    #musician-small { background-position-y: -15px; }
}

@media screen and (max-width:832px) {
    #youtube-container { height: 500px; }
    #musician-small { background-position-y: 0px; }
}

@media screen and (max-width:812px) {
    p.text-intro { font-size: 28px; }
    .section-4 { background: url(../img/piano-bw.webp) no-repeat left bottom; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: 120%; height: 600px; }
}

@media screen and (max-width:768px) {
    .intro { padding: 25px 30px; background: #09009f; background: -webkit-linear-gradient(to right, #09009f, #00dc95); background: linear-gradient(to right, #09009f, #00dc95); }
    .title-name-md { display: none; }
    .title-name-sm { display: block; }
    .title-top-md { display: none; }
    .title-top-sm { display: block; }
    .title-bottom-md { display: none; }
    .title-bottom-sm { display: block; }
}

@media screen and (max-width:763px) {
    p.text-intro { font-size: 26px; }
    p.text-intro-smaller { font-size: 14px; }
}

@media screen and (max-width:740px) {
    #name-left-sm { font-size: 3.2em }
    #name-right-sm { font-size: 3.2em }
    #title-left-sm { font-size: 2.1em }
    #title-right-sm { font-size: 2.1em }
    #title-left-bottom-sm { font-size: 2.1em }
    #title-right-bottom-sm { font-size: 2.1em }
    .title-top-sm { margin-top: 125px; }
    .title-bottom-sm { margin-top: 125px; }
}

@media screen and (max-width:717px) {
    p.text-intro { font-size: 25px; }
}

@media screen and (max-width:704px) {
    .hero { background: url(../img/hero-web-size.webp) no-repeat bottom center #fbfbfb; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: contain; height: 590px; margin-top: 20px; }
    #name-left-sm { font-size: 3.2em }
    #name-right-sm { font-size: 3.2em }
    #title-left-sm { font-size: 2em }
    #title-right-sm { font-size: 2em }
    #title-left-bottom-sm { font-size: 2em }
    #title-right-bottom-sm { font-size: 2em }
    .title-top-sm { margin-top: 130px; }
    .title-bottom-sm { margin-top: 130px; }
    .section-4 { background: url(../img/piano-bw.webp) no-repeat left bottom; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: 140%; height: 600px; }
}

@media screen and (max-width:690px) {
    .hero { background: url(../img/hero-web-size.webp) no-repeat bottom center #fbfbfb; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: contain; height: 590px; margin-top: 20px; }
    #name-left-sm { font-size: 3em }
    #name-right-sm { font-size: 3em }
    #title-left-sm { font-size: 1.8em }
    #title-right-sm { font-size: 1.8em }
    #title-left-bottom-sm { font-size: 1.8em }
    #title-right-bottom-sm { font-size: 1.8em }
    .title-top-sm { margin-top: 140px; }
    .title-bottom-sm { margin-top: 140px; }
    p.text-intro { font-size: 24px; }
}

@media screen and (max-width:670px) {
    .censr-top { background: url(../img/tigerhacks-banner-clip-md.jpeg) no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-position: top; }
    .small-featured-img { height: 250px; width: 100%; position: absolute; bottom: 0; }
    #youtube-container { height: 400px; }
    #musician-small { background-position-y: -30px; }
    .hero { height: 590px; margin-top: 20px; }
    #title-left-sm { font-size: 1.6em }
    #title-right-sm { font-size: 1.6em }
    #title-left-bottom-sm { font-size: 1.6em }
    #title-right-bottom-sm { font-size: 1.6em }
    .title-top-sm { margin-top: 150px; }
    .title-bottom-sm { margin-top: 150px; }
    #days-header { font-size: 3.5em; }
}

@media screen and (max-width:666px) {
    p.text-intro { font-size: 23px; }
}

@media screen and (max-width:640px) {
    #name-left-sm { font-size: 2.8em }
    #name-right-sm { font-size: 2.8em }
    #title-left-sm { font-size: 1.3em }
    #title-right-sm { font-size: 1.3em }
    #title-left-bottom-sm { font-size: 1.3em }
    #title-right-bottom-sm { font-size: 1.3em }
    .title-top-sm { margin-top: 160px; }
    .title-bottom-sm { margin-top: 160px; }
    #musician-small { background-position-y: -20px; }
    p.text-intro { font-size: 22px; }
    .section-1 { background: url(../img/Cerner-clipped.webp) no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; height: 600px; position: relative; }
}

@media screen and (max-width:621px) {
    #prc-header { font-size: 4em; }
}

@media screen and (max-width:617px) {
    p.text-intro { font-size: 21px; }
}

@media screen and (max-width:610px) {
    #name-left-sm { font-size: 2.6em }
    #name-right-sm { font-size: 2.6em }
    #title-left-sm { font-size: 1.2em }
    #title-right-sm { font-size: 1.2em }
    #title-left-bottom-sm { font-size: 1.2em }
    #title-right-bottom-sm { font-size: 1.2em }
    .title-top-sm { margin-top: 170px; }
    .title-bottom-sm { margin-top: 170px; }
    #musician-small { background-position-y: -10px; }
    .section-4 { background: url(../img/piano-bw.webp) no-repeat left bottom; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: 160%; height: 600px; }
}

@media screen and (max-width:592px) {
    p.text-intro { font-size: 20px; }
    #days-header { font-size: 3em; }
}

@media screen and (max-width:580px) {
    .title-name-sm { display: none; }
    .title-top-sm { display: none; }
    .title-bottom-sm { display: none; }
    .title-name-xs { display: block; }
    .hero { background-size: 350px; }
    #title-name-middle-xs { margin-top: -10px; }
    #title-name-bottom-xs { margin-top: 265px; }
    #subtitle-left-xs { font-size: 2em; }
    #subtitle-right-xs { font-size: 2em; }
    #subtitle-bottom-left-xs { font-size: 2em; }
    #subtitle-bottom-right-xs { font-size: 2em; }
    #musician-small { background-position-y: 0px; }
    #youtube-container { height: 350px; }
}

@media screen and (max-width:568px) {
    p.text-intro { font-size: 19px; }
}

@media screen and (max-width:560px) {
    #freelance-subtitle { letter-spacing: 0px; }
}

@media screen and (max-width:542px) {
    p.text-intro { font-size: 18px; }
}

@media screen and (max-width:530px) {
    #days-header { font-size: 2.8em; }
}

@media screen and (max-width:520px) {
    #title-name-middle-xs { margin-top: 0px; }
    #title-name-bottom-xs { margin-top: 255px; }
    #subtitle-left-xs { font-size: 1.8em; }
    #subtitle-right-xs { font-size: 1.8em; }
    #subtitle-bottom-left-xs { font-size: 1.8em; }
    #subtitle-bottom-right-xs { font-size: 1.8em; }
    #musician-small { background-position-y: 0px; }
    #youtube-container { height: 350px; }
    p.text-intro { font-size: 17px; }
}

@media screen and (max-width:510px) {
    #prc-header { font-size: 3.5em; }
}


@media screen and (max-width:500px) {
    .section-4 { background: url(../img/piano-bw.webp) no-repeat left bottom; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; height: 600px; }
}

@media screen and (max-width:494px) {
    p.text-intro { font-size: 16px; }
    #days-header { font-size: 2.5em; }
}

@media screen and (max-width:490px) {
    #prc-header { font-size: 3em; }
}

@media screen and (max-width:485px) {
    #freelance-subtitle { font-size: 1.2em; }
}

@media screen and (max-width:480px) {
    .title-text { display: inline-flex; margin-top: 0px; margin-bottom: 0px; }
    #mobile-title { text-align: center; }
    #mobile-name { display: none; }
    .subtitle-text { margin-top: 0px; margin-bottom: 0px; }
    #title-name-middle-xs { margin-top: 70px; }
    #title-name-bottom-xs { margin-top: 330px; }
    #subtitle-left-xs { font-size: 1.6em; }
    #subtitle-right-xs { font-size: 1.6em; }
    #subtitle-bottom-left-xs { font-size: 1.5em; }
    #subtitle-bottom-right-xs { font-size: 1.5em; }
    #youtube-container { height: 300px; }
}

@media screen and (max-width:470px) {
    p.text-intro { font-size: 24px; }
    p.text-intro-smaller { font-size: 14px; }
    .section-3 { background: url(../img/Cerner-alt.webp) no-repeat -300px center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; height: 600px; position: relative; }
}

@media screen and (max-width:465px) {
    p.text-intro { font-size: 23px; }
    #freelance-header { font-size: 5.5em; }
}

@media screen and (max-width:448px) {
    p.text-intro { font-size: 22px; }
}

@media screen and (max-width:439px) {
    #days-header { font-size: 2.2em; }
}

@media screen and (max-width:433px) {
    p.text-intro { font-size: 21px; }
}

@media screen and (max-width:425px) {
    .hero { background-size: 350px; height: 590px; margin-top: 0px; }
    .title-text { display: inline-flex; margin-top: 0px; margin-bottom: 0px; }
    #mobile-title { text-align: center; }
    #mobile-name { display: none; }
    .subtitle-text { margin-top: 0px; margin-bottom: 0px; }
    #title-name-middle-xs { margin-top: 70px; }
    #title-name-bottom-xs { margin-top: 350px; }
    #subtitle-left-xs { font-size: 1.4em; }
    #subtitle-right-xs { font-size: 1.4em; }
    #subtitle-bottom-left-xs { font-size: 1.3em; }
    #subtitle-bottom-right-xs { font-size: 1.3em; }
    .text-intro, .text-intro-smaller, #status { font-weight: normal; }
}

@media screen and (max-width:424px) {
    #rhythms-header { font-size: 5.2em; }
    #freelance-header { font-size: 5.2em; }
    #censr-subtitle { font-size: 1.4em; }
}

@media screen and (max-width:420px) {
    #youtube-container { height: 250px; }
}

@media screen and (max-width:416px) {
    p.text-intro { font-size: 20px; }
}

@media screen and (max-width:404px) {
    #freelance-header { font-size: 4.5em; }
}

@media screen and (max-width:400px) {
    p.text-intro { font-size: 19px; }
    #days-header { font-size: 2em; }
    #freelance-subtitle { font-size: 1em; }
}

@media screen and (max-width:397px) {
    #prc-header { font-size: 2.5em; }
}

@media screen and (max-width:384px) {
    p.text-intro { font-size: 18px; }
}

@media screen and (max-width:378px) {
    #censr-subtitle { font-size: 1.17em; }
}

@media screen and (max-width:375px) {
    .hero { background-size: 350px; }
    #title-name-middle-xs { margin-top: 60px; }
    #title-name-bottom-xs { margin-top: 360px; }
    #subtitle-left-xs { font-size: 1.2em; }
    #subtitle-right-xs { font-size: 1.2em; }
    #subtitle-bottom-left-xs { font-size: 1.1em; }
    #subtitle-bottom-right-xs { font-size: 1.1em; }
    #rhythms-header { font-size: 4.1em; }
}

@media screen and (max-width:368px) {
    p.text-intro { font-size: 17px; }
    #name-left-xs-portfolio { font-size: 0.75em; }
    #name-right-xs-portfolio { font-size: 0.7em; }
    #days-header { font-size: 1.8em; }
}

@media screen and (max-width:360px) {
    .hero { background-size: 340px; }
    #title-name-middle-xs { margin-top: 80px; }
    #title-name-bottom-xs { margin-top: 340px; }
    #subtitle-left-xs { font-size: 1.2em; }
    #subtitle-right-xs { font-size: 1.2em; }
    #subtitle-bottom-left-xs { font-size: 1em; }
    #subtitle-bottom-right-xs { font-size: 1em; }
}

@media screen and (max-width:355px) {
    #freelance-header { font-size: 3.9em; }
}

@media screen and (max-width:350px) {
    .hero { background-size: 330px; }
    #title-name-middle-xs { margin-top: 100px; }
    #title-name-bottom-xs { margin-top: 340px; }
    #subtitle-left-xs { font-size: 1.1em; }
    #subtitle-right-xs { font-size: 1.1em; }
    #subtitle-bottom-left-xs { font-size: 1em; }
    #subtitle-bottom-right-xs { font-size: 1em; }
    p.text-intro { font-size: 16px; }
}

@media screen and (max-width:344px) {
    #freelance-subtitle { font-size: 0.9em; }
}

@media screen and (max-width:340px) {
    #youtube-container { height: 200px; }
}

@media screen and (max-width:335px) {
    p.text-intro { font-size: 15px; }
    #prc-header { font-size: 2.3em; }
}

@media screen and (max-width:330px) {
    .hero { background-size: 310px; height: 510px; }
    #name-right-mobile { font-size: 2.6em; }
    #name-left-mobile { font-size: 2.6em; }
    #title-name-middle-xs { margin-top: 20px; }
    #title-name-bottom-xs { margin-top: 20px; }
    #subtitle-left-xs { font-size: 1.1em; }
    #subtitle-right-xs { font-size: 1.1em; }
    #subtitle-bottom-left-xs { font-size: 1em; }
    #subtitle-bottom-right-xs { font-size: 1em; }
    #days-header { font-size: 1.6em; }
}

@media screen and (max-width:1200px) {
    p{font-size: 14px; }
    .thin-sep { display: none; }
    .arrow { display: none; }
    nav { height: auto; width: 100%; background: none; margin: 70px 0 0 0; }
    .nav-wrapper { background-color: #fff; }
    nav ul { width: 100%; display: block; height: auto; padding: 0; }
    nav li { width: 100%; float: left; position: relative; text-align: center; }
    nav ul li a { width: 100%; float: left; position: relative; padding: 25px 0; text-align: center; border-bottom: 1px dotted rgba(255, 255, 255, 0.2); margin: 0px; }
    nav ul li a.last { border-bottom: none; }
    nav ul li.dot { display: none; }
    .responsive-logo { width: 94px; height: 85px; position: absolute; top: 30px; left: 10%; background-size: contain; }
    .logo-1 { position: absolute; left: 50%; top: 50%; }
    .logo-holder { display: none; }
    .logo-2 { position: absolute; left: 50%; top: 50%; }
    .logo-3 { position: absolute; left: 50%; top: 50%; }
    .footer-leftcol p, .footer-rightcol p { text-align: center; }
    .footer-midcol ul { margin-top: 40px; }
    .submit-btn { margin-top: 10px; }
    #default-nav { display: none; margin: 0 auto; }
}
@media only screen and (max-width:1200px) {
    nav { border-bottom: 0; }
    nav ul { display: none; height: auto; }
    .pullcontainer { width: 100%; text-align: right; padding: 20px 20px 0 0; }
    .pullcontainer a#pull { display: block; width: 100%; color: #242a2c; }
}