@media screen and (max-width: 1580px) {

    #main, footer {
        padding: 0px 40px 0px 40px!important;
    }
}

@media screen and (max-width: 1380px) {
    #our_program ul li:last-child {
        border-bottom: 3px solid white;
    }
    #main, footer {
        padding: 0px 40px 0px 40px!important;
    }
    .big_cta.prev, .big_cta.next {

        width: 100%!important;
    }
    #main_menu .icon-star:before, #main_menu .icon-star {
        display: none!important;
    }
    .volunteer, .volunteer_bg {
        width: 50%!important;
    }
}

@media screen and (max-width: 1260px) {
    #main, footer {
        padding: 0px 20px 0px 20px!important;
    }
}

@media screen and (max-width: 1223px) {
    #main {
        padding: 0px 20px 0px 20px!important;
    }
    #mobile_nav ul li {margin: 0px!important}
    #main_menu ul li {display: none;}
    #main_menu .logo {left: 5px;}
    header span.icon-star:before {display: none;}
    header {padding: 0px 0px!important;}
    header ul {
        display: block;
        width: 100%;
        height: 80px;
        color: black;
        position: relative;
        overflow: hidden;
        left: 0px;
        background: #f3f3f3;
        padding-bottom: 10px;
    }

    header ul .logo {
        display: block!important;
        top: 30px;
        margin: 0px;
        padding: 0px;
        text-align: center;
        position: absolute;
        width: 100%;
    }
    .mobile_menu {
        display: block!important;
    }
    header ul li:last-child {
        margin-bottom: 0px!important;
    }

    #mobile_nav li {
        width: 100%;
        top: 100px;
    }
    nav ul li {
        margin: 5px 20px auto 20px!important;
    }
}


@media screen and (max-width: 1220px) {
    .ipad {
        display: inline-block;
    }
    .mobile {
        display: none!important;
    }
    .work_title {
        padding-left: 0px!important;
    }
    #other_chapters .col-1-8 {
        width: 25%!important;
    }
    #main_menu {border-bottom: 2px solid black;}
    #map {display: none;}
    footer .col-1-5 {width: 25%!important;}
    .events_slider h2, .events_slider p, .events_cta {
        font-size: 1.2em!important;
    }
    #main > h1 {
        font-size: 1.8em!important;
    }
    wrap {margin-top: 20px;}
    inner h1 {font-size: 1em!important;}
    wrap > h1 {font-size: 1.5em!important;}
    .author {width: 23.5% !important;}
    .publication, .film {width: 49% !important;}
    inner > inner {
        height: auto!important; padding: 20px; width: auto!important; margin: auto;
    }
    .volunteer_menu {
        display: none;
    }
    #volunteer_slider {
        width: 100%!important;
    }
    #main_menu, #main_menu ul {
        height: 80px;
    }
    .logo {
        position: absolute;
        left: -20px!important;
        top: 0px!important;
        width: auto!important;
    }
    .logo .icon-826nyc_new:before {
        font-size: 45px!important;
        margin-left: 20px;
        text-align: left;
    }
    .mobile_menu {top: 22px;}
    header {
        height: 80px;
        width: 100%;
        position: fixed;
    }
    header ul {
        width: 100%;
        padding-bottom: 0px;
        border-bottom: 2px solid black;
    }
    #main {
        margin-top: 100px;
    }
    #donate .icon-star {
        display: none;
    }
    #donate_options ul a span{
        font-size: 20px;
    }
    #donate_options ul a:before {
        font-size: 20px;
    }
    .publication_content {
        width: 100%!important;
        padding: 0px;
    }

}

@media screen and (max-width: 1026px) {
    #main {
        padding: 0px 20px 0px 20px!important;
    }
    
    .icon-twitter, .icon-facebook, .icon-instagram {margin: 0px!important;}
}

@media screen and (max-width: 1000px) {
    .no_pad_mobile {
        padding: 20px 0px!important;
    }

    #donate_options {display: none;}

    .donate_background {
        background-size: cover!important;
    }
    .donors { padding-right: 0px!important; }
    #mobile_nav {
        background:#F3F3F3;
        padding-top: 0px;
    }

    #main {margin-top: 100px;}
    .events .our_events {
        padding-right: 0px;
        border-right: 0px solid lightgrey;
    }
    .events {padding: 0px!important;}
    #main_menu, #main_menu ul {
        height: 80px;
    }

    .logo {
        position: absolute;
        left: -20px!important;
        top: 0px!important;
        width: auto!important;
    }
    .logo .icon-826nyc_new:before {
        font-size: 40px!important;
        text-align: left;
        margin-left: 20px;
    }
    .mobile_menu {top: 22px;}
    header {
        height: 80px;
        width: 100%;
        position: fixed;
    }
    header ul {
        width: 100%;
        padding-bottom: 0px;
    }
    .big_cta {font-size: 25px} 
    .author_image img {border: 30px solid #ffb14f;}
    .featured_story {margin-bottom: 0px!important;}
    .story:before {width: 100%;}
    .big_cta {border-right: 0px solid white;}
    .story_info {display: none;}

    #volunteer_opportunities .cl-effect-10, #donate_options .cl-effect-10 {display: none;}
    .volunteer_opp .icon-left-open, .volunteer_opp .icon-right-open {display: inline-block}
    program inner {margin: 0px 0px 20px 0px!important;}
    .program {padding: 20px;}
    #donate_slider {height: 1250px!important; width: 100%!important}
    #volunteer_slider {
        height: 380px!important;
    }
    #volunteer_slider wrap {padding: 0px!important;}
    program {width: 100%!important;}
    wrap {margin-top: 0px;}
    inner h1 {font-size: 1em!important;}
    wrap > h1 {font-size: 1.5em!important;}
    .work_title {
        width: 100%!important;
        padding: 0px!important;
    }
    .author {width: 19% !important;}
    .publication, .film {width: 49% !important;}
    .col-3-4 {
        width: 100% !important;
    }
    .col-1-3 {
        width: 100% !important;
    }
    .col-2-3 {
        width: 100% !important;
    }
    .col-1-4 {
        width: 100% !important;
    }
    .volunteer {padding: 30px!important;}
    .col-1-1 {width: 100%!important;}
    footer .main .col-1-5 {width: 50%!important;}
    footer .main #map {padding-right: 20px;}
    .board_directors, .advisory_board {
        padding: 20px;
    }
    .volunteer {
        padding: 0px!important;
    }
    
}

@media screen and (max-width: 700px) {
    .cl-effect-10 a:hover span,
    .cl-effect-10 a:focus span {
        -webkit-transform: translateX(0%);
        -moz-transform: translateX(0%);
        transform: translateX(0%);
        border-top: 3px solid white!important;
    }
    .cl-effect-10 a:hover:before,
    .cl-effect-10 a:focus:before {
        -webkit-transform: translateX(-100%);
        -moz-transform: translateX(-100%);
        transform: translateX(-100%);
    }
    .ipad {display: none!important}
    #offices:hover .child_center, a #store:hover .child_center, .donate_cta:hover h1 {
      /* Webkit for Chrome and Safari */
      -webkit-animation-name: none!important;
      animation-name: none!important;
      -webkit-animation-duration: 0s;
      animation-duration: 0s;
      -webkit-animation-fill-mode: none;
      animation-fill-mode: none;
      animation-delay: 0s!important;
      -webkit-animation-delay: 0s!important;
    }

    .icon-left-open.mobile, .icon-right-open.mobile {
        display: block !important;
        background: lightgrey;
        color: white;
        margin: 0px;
    }

    .icon-left-open.mobile {
        border-right: 1px solid #f3f3f3;
    }

    .program {padding: 0px!important;}
    .su-column, .su-column-size-1-2 {margin: 0px!important;}
    .su-tabs-current {
        background: #ffb14f!important;
        color: white!important;
    }
    a:hover {
        color: auto!important;
    }
    .centered_higher {margin-top: 0px;}
    
    .volunteer {padding: 0px!important;}
    .expand_100 {
        width: 100%!important; 
        float:left;
        margin-bottom: 20px;
    }
    .donate {
        margin-top: 0px;
    }
    .donors  {
        margin-bottom: 20px;
    }
    #main {
        padding: 0px!important;
    }
    .board_directors, .advisory_board {
        padding: 20px;
    }
    #donate_slider {
        height: 1120px!important;
    }
    #slider h1 {display: inline-block; width: auto; float: left; margin-right: 10px; height: 1em; margin-top: 0px;}
    #slide_1 h1 {display: block; width: 100%;}
    #slider .icon-left-open, #slider .icon-right-open {
        margin-top: -40px!important;
        height: 1em;
        margin-left: 0px;
    }
    .main_slider_cta {
        position: absolute; 
        top: 100%;
        margin-top: -40px;
    }
    .main_slider_cta a {
        border-top: 1px solid black;
        border-bottom: 0px
    }
    #featured_stories {
        width: 100%;
    }
    #story_info {
        width: 100%;
        padding: 20px;
    }
    #author {display: none;}
    .icon-right-open.mobile, .icon-left-open.mobile {
        display: inline-block; 
        width: 50%; float: left; 
        text-align: center;
        margin: 20px 0px 20px 0px;
    }
    h1{font-size: 30px;}
    #other_chapters .col-1-8 {
        width: 50%!important;
    }
    #main {padding: inherit 20px inherit 20px !important;}
    .story:before {width: 100%;}

    .story_info {display: none;}

    .program_image {height: 300px!important;}
    .slider_content h1 {text-align: center; margin: 5px auto 5px auto!important;}
    sliderbackground, .events_slider:before {display: none!important;}
    .slideDown, .slider_content, #slider {max-height: 455px!important}
    .events_cta {margin-top: 360px;}
    .events .content {padding: 20px!important;}
    event .content {height: auto!important;}
    event {height: auto!important;}
    wrap {margin-top: 0px; float: none;}
    inner h1 {font-size: 1em!important;}
    wrap > h1 {font-size: 1.5em!important;}

    .work_title {width: 100%!important;}
    .author {width: 48.5% !important;}
    .author:even {margin-right: 0px!important;}
    .author:odd {margin-left: 1.5%!important;}
    #main {
        padding: 0px 20px 0px 20px!important;
    }
    .publication, .film {width: 100% !important;}
    .col-3-4 {
        width: 100% !important;
    }

    .events {padding: 20px;}
    slider {
        height: 880px!important;
        border-bottom: 2px solid black;
    }
    sliderbackground {width: 100%!important;}
    .col-1-2 {
        width: 100% !important;
    }
    .col-1-3 {
        width: 100% !important;
    }
    .col-2-3 {
        width: 100% !important;
    }
    .col-1-4 {
        width: 50% !important;
    }
    .slider_content {
        margin: -5px auto auto auto!important;
    }

    #main_menu ul li {display: none;}

    #our_program ul li:last-child {
        border-bottom: 0px solid white;
    }
    .events_slider h2, .events_slider p, .events_cta {
        font-size: 1.2em!important;
    }
    #main > h1 {
        font-size: 1.8em!important;
    }
    .events_slider {width: 100%!important; height: auto!important;}
    #slider line {margin-bottom: 10px!important}
    .events_slider:after {
        display: none!important;
    }

    .events_slider:before {
        border-right: 700px solid transparent!important;
        border-top: 40px solid white!important;
        top: 100%!important;
        left: 0%!important;
    }

    #our_program h2 {padding: 20px!important;}
    #our_program a span{
        padding: 20px!important;
        margin-left: 0px;
        font-size: 30px!important;
    }
    #our_program a:before {
        margin-left: 0px;
        font-size: 30px!important;
    }
    .events_slider h1 {font-size: 30px!important;}
    #our_program ul a {font-size: 30px!important;}
    header span.icon-826nyc_new:before {font-size: 7em!important;}

    #volunteer_opportunities a:before {font-size: 20px!important;}

    #volunteer_opportunities ul a  {
        font-size: 20px!important;
    }
    #volunteer_opportunities ul a span {font-size: 20px!important;}
    staffnav {width: 50%!important;}

    span.crafted_by {
        width: 100%!important; 
        clear: both;
        float: left;
        font-size: 12px;
        padding: 20px;
    }
    .crafted_by a {
        text-transform: uppercase;
    }
        .no_pad {
        padding: 0px!important;
    }
    #slider .icon-right-open, #slider .icon-left-open {
        margin-right: 0px!important;
    }

}


@media all and (max-width: 500px) {
    inner inner, inner inner h1 {
        display: none!important;
        background: transparent!important;
        border: none!important;
    }
    .internship_opp h1 {
      margin-bottom: 0px;
    }
    .ipad {
        display: none!important;
    }
    .mobile {
        display: block!important;
    }
    .expand_100 {
        margin-bottom: 20px;
    }

    .equal_height_wrap{
        border-bottom: none;
    }
    .icon-left-open.mobile, .icon-right-open.mobile {
        background: lightgrey;
        color: white;
        margin: 0px;
    }
    #mobile_nav {width: 100%;}
    .donate {
        margin-top: -400px;
    }
    .volunteer_opp h1, .would_you_sponsor {margin-top: 20px!important}
    sliderinner .pad {padding: 20px!important}
    #donate_slider .column_2 {
        column-count: 1!important;
        -webkit-column-count: 1!important;
    }
    #donate_slider {
        border-bottom: transparent;
        height: 700px!important;
    }
    #other_chapters .col-1-8 {
        width: 50%!important;
    }
    .story:before {width: 100%;}

    .story_info {display: none;}

    .col-1-4 {width: 100%!important;}
    .slider_content {width: 100%!important;}
    #hour, #map {padding: 20px!important;}
    #map {position: relative!important; float: left!important;}

    staff {display: none!important;}
    staffnav {float: left; width: 50%;position: relative;}
    staffnav.left {
        display: block!important;
        background: lightgrey;
        content: "";
        color:white;
        font-size: 2em;
        padding: 15px;
        text-align: center;
    }
    staffnav.right {
        display: block!important;
        background: lightgrey;
        color:white;
        font-size: 2em;
        padding: 15px;
        text-align: center;
    }
    staffnav:hover {
        background: #ffb14f;
        cursor: pointer;
    }

    staffnav .icon-left-open,   staffnav .icon-right-open {text-align: center;}

    .our_mission {
        width: 100%;
        padding: 30px 30px 30px 30px!important!important;
    }
    .our_mission:before, .our_mission:after {display: none;}
    .our_mission p {width: 100%!important;}
    .publication, .film {width: 49%!important}
    .author:not(author:first-child) {display: none}
    .author:nth-child(2) {
        display: none
    }
    .equal_height {padding-bottom: 0px!important; margin-bottom: 0px!important}
    .staff .pad_not_top_l {padding: 0px 20px!important;}
    .pad_not_top_m {padding: 0px 20px 20px 20px!important;}
    .pad_m {padding: 20px 20px 20px 20px!important;}
    .program wrap {margin: 20px 0px!important;}
    .stay_tuned .icon-star, header .icon-star {
        display: none;
    }
    .icon-star:before {display: none;}
    #continue .tag { max-width: 60%; }
    .event_detail {
        padding: 160px 60px 120px 60px;
        margin: -60px auto 0px auto;
    }
    #teaser {min-height: 620px;}
    .event_detail_background:after {
        border-bottom: 50px solid transparent;
    }
    footer {
        height: 400px!important;
    }
    footer .main .col-1-5 { width: 100%!important;}
    footer .main #hour, footer .main #offices { padding-bottom: 0px !important;}
    #map {padding-right: 20px !important;}
    .cl-effect-10 a span {margin-left: 0px}
    .cl-effect-10 a:before {margin-left: 0px}

    #main .col-3-4 {
        width: 100%!important;
    }
    #main .col-1-4 {
        width: 100%!important;
    }
    footer {padding-bottom: 20px;}
    .board_directors, .advisory_board {
        padding: 20px;
    }
    .column_4 { 
        -webkit-column-count: 2!important; /* Chrome, Safari, Opera */
        -moz-column-count: 2!important; /* Firefox */
        column-count: 2!important;
        -webkit-column-gap: 20px; /* Chrome, Safari, Opera */
        -moz-column-gap: 20px; /* Firefox */
        column-gap: 20px;
    }

    .board_directors h1 {
        -moz-column-span: all; /* Chrome, Safari, Opera */
        -webkit-column-span: all; /* Chrome, Safari, Opera */
        column-span: all;
    }
    .internship_opp .pad_m {padding: 0px!important;}

    .internship_opp {
        margin-bottom: 0px!important;
        padding-bottom: 0px!important;
        margin-top: 20px;
        background: transparent!important;
        padding: 0px!important;
    }
}