/* Smartphones (portrait) ----------- */
/**
 * 1180 px
 **/
@media (max-width: 1180px) {

    /* header */
    #header-top {
        background-size: 100% auto;
       /* background-image: url(http://www.worldmigratorybirdday.org/profiles/aewa/themes/custom/aewa/images/bg-header-wmbd-2017-sm.png), linear-gradient(
      to top right,
      #51bdda, #f7c600
    ); */
    /* background-image: url(https://www.worldmigratorybirdday.org/sites/default/files/pictures/bg-header-wmbd-2018-sm.png); */
    }
    .front #main-inner {
        margin-left: 0;
        margin-right: 0;
        width: 100%;
    }

    #block-aewa-social-aewa-social-twitter-search .content {
        padding-right: 15px;
    }

    #header-menu .links a {
        padding: 17px 20px 14px;
    }
}

/**
 * 1024 px
 **/
@media (max-width: 1024px) {
    #block-aewa-social-aewa-social-icons-circle {
        float: left;
        clear: both;
        width: 100%;
        text-align: center;
    }

    ul.social-circle {
        float: none;
    }
}

@media (min-width: 980px) and (max-width: 1300px) {
    #header-top {
        background-position: 78% 65%;
    }
}

/**
 * 980 px
 **/
@media (max-width: 979px) {



    /* MENU */
    /* MENU */
    #header-menu-inner.grid-container {
        padding: 0;
        float: left;
        width: 100%;
    }

    .region-header #block-search-form {
        width: auto;
    }

    .region-header #block-search-form #edit-submit {
        width: auto;
        float: right;
    }

    .header-region-wrapper {
        position: absolute;
        right: 2%;
        top: 0;
    }

    #block-tb-megamenu-main-menu.grid-75 {
        width: 100%;
    }

    #block-tb-megamenu-main-menu .tb-megamenu .nav-collapse {
        margin-bottom: 20px;
        margin-top: 0;
        position: relative;
        top: 0;
        float: left;
    }

    /*.tb-megamenu .nav-collapse .nav {
      float: left;
      width: 95%;
    }*/
    .tb-megamenu button.btn,
    .tb-megamenu button.btn:hover,
    .tb-megamenu button.btn:active,
    .tb-megamenu button.btn:focus,
    .tb-megamenu button.btn:visited {
        background: url('../images/responsive-menu-icon.png') no-repeat center center #fff;
        background-size: 110px auto;
        width: 100%;
        box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.25);
        height: 60px;
    }

    .tb-megamenu button.btn.open-button,
    .tb-megamenu button.btn.open-button:hover,
    .tb-megamenu button.btn.open-button:active,
    .tb-megamenu button.btn.open-button:focus,
    .tb-megamenu button.btn.open-button:visited {
        margin-bottom: 0;
        background: url('../images/responsive-menu-open.png') no-repeat center center #fff;
        background-size: 110px auto;
    }

    .tb-megamenu .row-fluid .tb-megamenu-column .tb-megamenu-column-inner div.block {
        display: none;
    }

    .tb-megamenu .nav-collapse,
    .tb-megamenu .nav-collapse .dropdown-menu {
        background: none repeat scroll 0 0 #fff;
    }

    #header-menu .links li a,
    #header-menu .links li,
    #header-menu .links .level-2 a {
        clear: both;
        display: inline-block;
        float: left;
        text-align: left;
        width: 97.5%;
        background-color: #ffffff;
        border-bottom: 1px solid #eee;
        border-top: 0 none;
    }

    #header-menu .links li a {
        font-size: 20px;
        font-weight: 600;
        height: 30px;
        line-height: 26px;
        margin-left: 0;
        padding: 10px 0 10px 5%;
    }

    .tb-megamenu .nav-collapse .nav > li > a,
    .tb-megamenu .nav-collapse .dropdown-menu a {
        border-bottom: 0 none;
    }

    #header-menu .links .level-2 a,
    #header-menu .links .level-2 a:hover {
        color: #444444;
        display: inline-block;
        font-weight: 600;
        line-height: 31px;
        padding: 7px 0 7px 10%;
        text-align: left;
    }

    #header-menu .links .level-2:last-child a,
    #header-menu .links .level-2:last-child {
        border: 0 none;
    }

    .tb-megamenu .mega-inner,
    .tb-megamenu [class*="span"].mega-col-nav .mega-inner {
        padding: 0;
    }

    .tb-megamenu .nav-collapse {
        top: 51px;
    }

    #header-menu .links .active a,
    #header-menu .links .level-1.dropdown.active > a:hover {
        border-width: 1px;
    }

    .level-1.dropdown a.dropdown-toggle {
        background: url('../images/menu-drop.png') no-repeat 90% center #fff;
        background-size: 38px auto;
    }

    #header-menu .links li.open-subbox > a.dropdown-toggle {
        background: url('../images/menu-drop-open.png') no-repeat 90% center #dfdfdf;
        background-size: 38px auto;
        border-bottom: 1px solid #c0c0c0;
    }

    .tb-megamenu-block {
        border-bottom: 0 none;
    }

    .tb-megamenu .row-fluid .tb-megamenu-column:last-child {
        min-height: 0;
    }

    .close-href {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 50px;
    }

    #header-menu .links a.link-second {
        display: inline-block;
    }

    #block-aewa-social-aewa-social-icons-circle {
        margin-bottom: 10px;
    }

    /* newsletter */
    #footer-first .block-simplenews {
        padding-left: 0;
    }

    .simplenews-subscribe .form-item-mail input.form-text {
        float: left;
        padding-left: 2px;
        margin-left: 10px;
    }

    #footer-first .simplenews-subscribe .form-submit {
        margin-left: 3px;
        padding: 0 5px;
        width: auto;
    }
}

@media (max-width: 767px) {
    table {
        width: 100% !important;
    }

    .region-header #block-search-form #edit-actions input {
        margin-right: 0;
    }

    .region-frontpage-top-last .views-field-title h2 {
        font-size: 26px;
        margin: 15px 0;
    }

    .region-frontpage-top-last .views-field-body {
        font-size: 18px;
    }

    .region-frontpage-top-last .views-row,
    .region-frontpage-top-last .views-row.views-row-2 {
        box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.25);
        width: 100%;
        margin: 0;
        height: auto;
        margin-bottom: 20px;
    }

    .region-frontpage-top-last .views-row {
        background-image: url("../images/block-bird-1-bg.png"), url("../images/block-1-bg.png");
        background-position: left bottom, right bottom;
        background-size: 351px 249px, 53% 390px;
    }

    .region-frontpage-top-last .views-row.views-row-2 {
        background-image: url("../images/block-bird-2-bg.png"), url("../images/block-1-bg.png");
        background-position: right bottom, left bottom;
        background-size: 351px 249px, 53% 390px;
    }

    #frontpage-top-inner {
        padding-left: 20px;
        padding-right: 20px;
    }

    /* header */
    #header-top {
        height: 120px;
        background-position: right bottom;
        background-size: 100% auto;
    }

    /* slider */
    #flexslider-1 .views-field-title,
    #flexslider-1 .views-field-body {
        bottom: 0;
        left: 0;
        position: relative;
        width: auto;
        text-align: center;
        margin: 10px 10px 0;
    }

    #flexslider-1 .views-field-body,
    #flexslider-1 .views-field-body a:link,
    #flexslider-1 .views-field-body a:visited {
        color: #444444;
        font-size: 30px;
        font-weight: 700;
        line-height: 26px;
    }

    #flexslider-1 .flex-control-nav {
        display: none;
    }

    .flex-control-paging li a {
        height: 17px;
        width: 17px;
    }

    .flex-control-paging li a.flex-active {
        height: 22px;
        width: 22px;
    }

    ul.flex-direction-nav {
        height: 70%;
        position: absolute;
        top: 0;
        width: 100%;
        padding: 0;
    }

    .region-frontpage-top-first {
        background-color: #ffffff;
        box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.25);
        padding-bottom: 20px;
    }

    /* frontpage social boxes and twitter */
    .front #block-system-main,
    #block-aewa-social-aewa-social-twitter-search {
        width: 100%;
    }

    #block-aewa-social-aewa-social-twitter-search {
        position: static !important;
    }

    #block-aewa-social-aewa-social-twitter-search .content {
        padding: 30px 20px 0;
    }

    .front .region-content div:last-child {
        height: auto !important;
    }

    .region-content ul.pager-load-more {
        margin: 0;
        padding: 0;
    }

    .view-homepage {
        padding: 0 10px;
    }

    .view-homepage .pager-load-more a {
        position: static;
    }

    #footer-first .button {
        float: left;
        padding-top: 20px;
    }

    /* event map */
    #interactive-map-filters,
    #interactive-map {
        clear: both;
        width: 100%;
        margin-bottom: 20px;
    }

    .page-events-map .options-map {
        left: 1%;
        min-height: 250px;
        width: 98%;
    }

    /* forms */
    #aewa-events-form-start .form-item-title,
    #aewa-events-form-start .form-item-event-type,
    .form-type-textfield,
    .form-type-select,
    .form-type-password,
    #aewa-events-form-start .container-inline-date {
        width: 100%;
        clear: both;
        float: left;
    }

    #aewa-events-form-start .form-item-start-time,
    #aewa-events-form-start .form-item-end-time {
        clear: none;
        float: left;
        width: 20%;
        margin-left: 2.5%;
    }

    #aewa-events-form-start .form-item-start-time input,
    #aewa-events-form-start .form-item-end-time input {
        width: 100%;
    }

    .fieldset-wrapper .form-item:nth-child(2n) > *,
    form > div > .form-item:nth-child(3n) > * {
        left: 0;
    }

    .ui-selectmenu-menu .ui-menu {
        width: 90% !important;
    }

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

    form .form-actions #edit-cancel {
        float: none;
    }

    button, input[type="reset"],
    input[type="button"],
    input[type="submit"] {
        width: 90%;
        margin-left: 0;
    }

    /* grid images and data */
    .grid ul li {
        width: 28.3%;
    }

    .grid.grid-formating ul li a.button {
        width: 70%;
    }

    #footer-wrapper {
        line-height: normal;
    }

    .field-name-body div.button {
        text-align: left;
        margin: 3px 0;
    }
}

/**
 * 640 px
 **/
@media (max-width: 640px) {
    img {
        max-width: 100% !important;
        height: auto !important;
    }
    .img-field {
        max-width: 100% !important;
        height: auto !important;
        padding-left:0px;
    }

    #logo {
        height: auto;
        width: 45%;
    }

    ul.flex-direction-nav {
        height: 60%;
    }

    /* countdown */
    #jquery-countdown-timer > span {
        margin: 0 1px;
    }

    #jquery-countdown-timer .countDays::after,
    #jquery-countdown-timer .countHours::after,
    #jquery-countdown-timer .countMinutes::after,
    #jquery-countdown-timer .countSeconds::after {
        bottom: -15px;
        font-size: 13px;
    }

    #jquery-countdown-timer .position {
        width: 27px;
    }

    #jquery-countdown-timer .digit {
        font-size: 40px;
    }

    ul.aewa_language_switcher li {
        display: block;
    }

    /* front - blocks */
    .region-frontpage-top-last .views-field-title h2 {
        line-height: 30px;
    }
}

@media (max-width: 480px) {
    /* header */
    #header-top {
        background-size: 100% auto;
    }

    #flexslider-1 .views-field-title,
    #flexslider-1 .views-field-title .field-content {
        font-size: 30px;
    }

    #flexslider-1 .views-field-body,
    #flexslider-1 .views-field-body a:link,
    #flexslider-1 .views-field-body a:visited {
        font-size: 20px;
    }

    ul.flex-direction-nav {
        height: 50%;
    }

    .news-feed .views-row {
        padding: 10px 1.2%;
        width: 95.2%;
    }

    /* grid images and data */
    .grid ul li {
        width: 45%;
    }

    .grid.grid-formating ul li a.button {
        width: 65%;
    }

    #content h1,
#event-content h1 {
        font-size: 35px;
}
}

/**
 * 360 px
 **/
@media (max-width: 360px) {
    ul.flex-direction-nav {
        height: 30%;
    }

    #logo {
        margin-top: 15px;
    }

    .grid.grid-formating ul li {
        height: auto;
        padding: 14px 3.3% 60px;
    }

    .grid ul li {
        width: 90%;
        height: auto;
    }
}

/**
 * 320 px
 **/
@media (max-width: 320px) {
    ul.flex-direction-nav {
        height: 25%;
    }
}
