/*-=Small screens=-*/
@media only screen and (max-width: 641px) {
    /* TOP BAR Mobile STYLING */
    .top-bar {
        background: #333333; /* change background color if you need */

    }
    .top-bar-section ul li > a{
        color: white; /* change color of text if you need */
        font-size: 14px;
        background: #004c81;
    }
    .top-bar-section ul li:hover > a{ background: #158fd0 !important; /* change background color if you need */ }
    .logo img {
        padding-bottom: 20px;
    }
    header {
        padding-bottom: 0;
    }
    .goal_section .row, .page .header_image .row, .archive .header_image .row, .single .header_image .row, .search .header_image .row, .blog .header_image .row {
        padding-top: 20px;
    }
    .row .row {
        margin-left: 0;
        margin-right: 0;
    }
    .goals .image_wrapper img {
        margin: 0 auto;
    }
    .page .single_goal_page article, .single_page article {
        -webkit-column-count: 1;
        -moz-column-count: 1;
        column-count: 1;
        -webkit-column-gap: 0;
        -moz-column-gap: 0;
        column-gap: 0;
    }
    .header_image.goal h1 {
        font-size: 30px;
        line-height: 37px;
        margin-top: 20px;
    }
    .header_image.goal .pagination ul li a::before {
        font-size: 25px;
    }
    .header_image.goal .pagination ul li {
        width: 10px;
    }
    .header_image.goal .pagination ul li:nth-child(n+10) {
        width: 16px;
    }
    .page-template-template-goal-single .header_image {
        height: 350px;
    }
    .buttons a {
        padding: 10px;
        font-size: 20px;
        margin-bottom: 10px;
    }
    .buttons a:after {
        width: 50px;
        -webkit-background-size: 50%;
        background-size: 50%;
    }
    .content {
        margin-top: 20px;
    }
    .main_image_wrapper .text {
        padding-left: 15px;
        padding-right: 15px;
    }
    .goal_section p {
        margin-bottom: 20px;
    }
    .main_image {
        margin: 0;
        padding-top: 250px;
        padding-bottom: 20px;
    }
    .main_image h2 {
        font-size: 24px;
    }
    .main_image p {
        font-size: 18px;
        line-height: 20px;
    }
    .top-bar a:hover {
        text-decoration: none;
    }
    .top-bar .title-area {
        background: #03699c;
    }
    .top-bar.expanded .title-area {
        background: #158fd0;
    }
    .latest_posts {
        margin-top: 20px;
    }
    .latest_posts h3 {
        margin: 0 0 20px;
    }
    .latest_post .thumbnail .video_overlay {
        width: 100%;
        height: 150px;
        top: 50%;
        margin-top: -75px;
    }
    .banners {
        padding: 20px 0 10px;
    }
    .banners img {
        margin-bottom: 10px;
    }
    #twitter_feed ul li .timePosted {
        padding-right: 10px;
    }
    #twitter_feed,
    .fb-page {
        margin-bottom: 20px;
    }
    .jr-insta-thumb .thumbnails > li {
        width: 50% !important;
    }
    .jr-insta-thumb .thumbnails img {
        height: auto;
    }
    .social_plugins {
        margin-bottom: 20px;
    }
    footer {
        padding: 20px 0;
    }
    .sidebar_footer aside {
        text-align: center;
        margin-bottom: 20px;
    }
    footer h5 {
        margin-bottom: 10px;
    }
    .social_links {
        margin: 15px 0;
        padding-top: 15px;
    }
    .index_title {
        font-size: 24px;
        margin-bottom: 20px;
    }
    .row.content {
        padding: 10px 0 !important;
    }
    aside h5 {
        margin-bottom: 10px !important;
    }
    aside {
        padding: 0px !important;
    }
    aside.widget_search,
    aside.widget_categories,
    aside.widget_tag_cloud {
        padding: 10px !important;
    }
    .content_wrapper {
        margin-bottom: 0;
    }
    .blogroll .thumbnail {
        float: none;
        margin-right: 0;
        display: block;
        text-align: center;
    }
    .blogroll .thumbnail .video_overlay {
        left: 50%;
        margin-left: -120px;
    }
    .single_post article {
        padding-top: 10px;
    }
    .single_post h1 {
        font-size: 24px;
        line-height: 26px;
        margin-bottom: 10px;
    }
    .single_post .thumbnail {
        margin-bottom: 0;
    }
    .single_post_content_wrapper .custom_excerpt {
        float: none;
        width: 100%;
        margin: 10px 0;
    }
    .single_post_content_wrapper .custom_excerpt .wrapper p {
        font-size: 16px;
        line-height: 18px;
    }
    .single_post .ssba a:after {
        font-size: 10px !important;
        padding: 9px 20px 6px !important;
    }
    .single_post .ssba a {
        margin-bottom: 3px;
    }
    .single_post h1 span {
        margin-bottom: 10px;
    }
    aside.widget_black_studio_tinymce img {
        margin-bottom: 10px;
    }
    .crp a {
        font-size: 14px;
        display: block;
    }
    .crp ul {
        margin-bottom: 20px;
    }
    aside.gform_widget h3 {
        margin-top: 20px !important;
    }
    .single_post .thumbnail {
        margin-bottom: 10px;
    }
    .page article h1 {
        font-size: 24px;
        line-height: 26px;
    }
    article ul {
        clear: both;
    }
    .header_image.page .caption {
        width: 100%;
        right: 0;
        bottom: -245px;
        position: relative;
    }
    .header_image.page .caption p {
        padding: 15px;
    }
    .goals h2 {
        margin: 20px 0;
    }
    .goal img {
        float: none;
        display: table;
        margin: 0 0 10px;
    }
    .goals {
        margin-bottom: 20px;
    }
    .latest_post {
        width: 100%;
    }
    .latest_post .media_wrapper {
        margin-bottom: 10px;
    }
    .page .social_plugins {
        margin-top: 90px;
    }
      /*Graphics*/
    #bvbundpex_hype_container{
        height: 400px !important;
    }
    .HYPE_element{
      height: 100% !important;
    }
    .HYPE_element_container:nth-last-child(2){
      z-index: 1000 !important;
    }
    .HYPE_scene{
      height: 100% !important;
    }
    .graphs iframe{
        min-height: 300px;
    }
    .breadcrumbs {
        top: -10px;
    }
    .survey {
        padding: 30px 20px;
    }
    .survey .gform_wrapper ul li.gfield.other-input {
        position: static;
        margin-top: 0;
        float: none;
        width: 100%;
    }
    .survey .gform_wrapper .top_label .gfield_label {
        font-size: 29px;
    }
    .survey .close-survey {
        width: 50px;
        height: 50px;
        top: -15px;
        right: -15px;
    }
    .survey .gform_wrapper .gfield_checkbox li label,
    .survey .gform_wrapper .gfield_radio li label {
        font-size: 17px;
    }


} /* max-width 640px and lower. Use this for mobiles only */

/*-=Medium screens=-*/
@media only screen and (min-width: 40.063em) {
    /* TOP BAR STYLING */
    .top-bar { background: transparent; }
    .top-bar-section ul { background: transparent; }
    .top-bar-section ul li { background: transparent; }
    .top-bar-section li:not(.has-form) a:not(.button) {
        color: #000;
        font-size: 30px;
        background: transparent;
        line-height: 80px;
        padding: 0 10px;
        font-family: 'Giorgio Sans';
        position: relative;
        -webkit-transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
        text-transform: uppercase;
    }
    .top-bar-section li:not(.has-form) a:not(.button):hover {
        color: #27bbe0;
        background: transparent;
        text-decoration: none;
    }
    /*    .top-bar-section li:not(.has-form) > a:before {
            content: '';
            display: block;
            margin: 0 auto;
            background: rgba(255,255,255,0);
            position: absolute;
            -webkit-transition: all 0.3s ease-in-out;
            -moz-transition: all 0.3s ease-in-out;
            -o-transition: all 0.3s ease-in-out;
            transition: all 0.3s ease-in-out;
            width: 30%;
            height: 3px;
            bottom: 22px;
            left: 50%;
            margin-left: -15%;
        }
        .top-bar-section li:not(.has-form) a:not(.button):hover:before,
        .top-bar-section li.current-menu-item > a:not(.button):before {
            content: '';
            width: 30%;
            height: 3px;
            background: #004c81;
            bottom: 22px;
            left: 50%;
            margin-left: -15%;
        }*/
    .top-bar-section li.current-menu-item > a:not(.button),
    .top-bar-section l> a:not(.button),
    .top-bar-section li.current-page-ancestor > a:not(.button) {
        color: #27bbe0;
        background: transparent;
    }
    .top-bar-section .has-dropdown > a { padding: 0 15px !important; }
    .top-bar-section .has-dropdown > a:after { display: none; }

    /* Dropdown Styling*/
    .top-bar-section ul li:hover:not(.has-form) > a {
        background: green;
        color: black;
    }
    .top-bar-section .dropdown li:not(.has-form) a:not(.button) {
        color: white;
        background: olive;
    }
    .top-bar-section .dropdown li:not(.has-form):hover > a:not(.button) {
        color: grey;
        background: bisque;
    }
    .top-bar-section .has-dropdown > .dropdown li .dropdrown_menu li a { background: blue; }
    .top-bar-section .has-dropdown > .dropdown li .dropdrown_menu li:hover a {
        color: white;
        text-decoration: underline;
        background: red;
    }
    /*Align Menu to the right*/
    .top-bar-section { text-align: center; }
    /* Align Menu to the center
        .top-bar-section { float:none; text-align: center; }
        .top-bar-section ul{display: inline-block;} */

}  /* min-width 641px */
@media only screen and (min-width: 40.063em) and (max-width: 64em) {
    .top-bar-section li:not(.has-form) a:not(.button) {
        font-size: 20px;
        padding: 0 8px;
    }
    .top-bar-section ul {
        text-align: center;
        display: block;
    }
    .top-bar-section {
        float: none;
    }
    .top-bar-section ul li {
        float: none;
        display: inline-block;
    }
    .logo {
        max-width: 280px;
        margin: 0 auto;
    }
    .main_image h2 {
        font-size: 60px;
    }
    .latest_post .thumbnail .video_overlay {
        width: 100%;
        height: 100%;
        -webkit-background-size: 50%;
        background-size: 50%;
    }
    .latest_post h5 {
        font-size: 24px;
    }
    .main_image {
        margin-bottom: 20px;
    }
    .latest_post {
        padding: 10px 10px 30px;
    }
    .latest_posts h3 {
        margin-bottom: 20px;
        padding-bottom: 30px;
    }
    .banners {
        padding: 20px 0;
    }
    #twitter_feed ul li .user a {
        font-size: 11px;
    }
    #twitter_feed ul li .interact a {
        font-size: 12px;
    }
    #twitter_feed ul li .tweet {
        font-size: 13px;
    }
    #twitter_feed ul li {
        height: 240px;
    }
    .jr-insta-thumb .jr_col_3 > li {
        width: 50% !important;
    }
    .jr-insta-thumb {
        height: 225px;
        overflow: hidden;
    }
    .social_plugins {
        margin-bottom: 20px;
    }
    footer {
        padding: 20px 0;
    }
    footer h5 {
        margin-bottom: 20px;
    }
    .social_links {
        padding-top: 20px;
        margin-top: 0;
    }
    .page .header_image,
    .header_image {
        height: 280px;
    }
    .page .content,
    .content {
        margin-top: 200px;
    }
    .header_image.page .caption {
        bottom: -280px;
        right: 15px;
    }
    .row.content {
        padding: 20px 0 !important;
    }
    .content_wrapper {
        margin-bottom: 30px;
    }
    .goal h4 {
        font-size: 17px;
    }
    .crp a {
        font-size: 14px;
        display: block;
    }
    .crp .thumbnail {
        margin-bottom: 0;
        margin-right: 10px;
        width: 75px;
        height: 75px;
    }
    .crp li > a {
        display: flex;
    }
    .page article h1 {
        font-size: 36px;
    }
    .goals {
        margin-bottom: 20px;
    }
    .index_title {
        font-size: 24px;
        margin-bottom: 20px;
    }
    aside.gform_widget .gform_body, aside.gform_widget .gform_footer.top_label {
        float: none;
        width: 100%;
    }
    aside.widget_categories ul li {
        width: 100px;
        display: block;
    }
    aside.widget_categories h5,
    aside.widget_search h5,
    aside.widget_tag_cloud h5 {
        margin-bottom: 10px;
    }
    aside.widget_categories,
    aside.widget_search,
    aside.widget_tag_cloud {
        padding: 10px;
    }
    .single_post .ssba a {
        margin-bottom: 5px;
    }
    .single_post_content_wrapper .custom_excerpt {
        margin: 0 0 10px 0;
        float: none;
        width: 100%;
    }
    .ssba {
        display: none;
    }
    .blogroll .thumbnail {
        margin-bottom: 0;
    }
    .latest_post {
        overflow: hidden;
    }
    .latest_post .media_wrapper {
        float: none;
        display: block;
        margin-bottom: 10px;
    }
    .goal_section p {
        margin-top: 0;
    }
    .row .row {
        margin-left: 0;
        margin-right: 0;
    }

    /* Don't add this on the Globala Målen page */
    .page .content, .content {
        margin-top: 20px;
    }
    .page:not(.page-id-13) .content {
        margin-top: 235px;
    }
    .buttons a {
        font-size: 34px;
    }
} /* min-width 641px and max-width 1024px, use when QAing tablet-only issues */
@media only screen and (min-width: 641px) and (max-width: 910px) {
    .top-bar-section li:not(.has-form) a:not(.button) {
        font-size: 18px;
    }
}
@media only screen and (min-width: 641px) and (max-width: 767px) {
    #twitter_feed ul li .interact {
        display: none;
    }
    .sidebar .jr-insta-thumb ul li img {
        height: auto;
    }
    .sidebar .jr-insta-thumb {
        height: auto;
    }
    .crp li > a {
        display: block;
    }
    .crp .thumbnail {
        margin-bottom: 10px;
    }
    .goal img {
        margin-bottom: 15px;
    }
    .jr-insta-thumb .thumbnails img,
    .jr-insta-thumb {
        height: auto;
    }
}
/*@media only screen and (min-width: 768px) and (max-width: 999px) {
    .top-bar-section li:not(.has-form) a:not(.button) {
        font-size: 13px;
        padding: 0 15px;
    }
}*/
@media only screen and (min-width: 1025px) and (max-width: 1170px) {
    .top-bar-section li:not(.has-form) a:not(.button) {
        font-size: 25px;
    }
}
@media only screen and (min-width: 1000px) and (max-width: 1241px) {

    .sidebar .jr-insta-thumb {
        height: auto;
    }
    #twitter_feed ul li {
        height: 224px;
    }
}
/*-=Large screens=-*/
@media only screen and (min-width: 64.063em) {
    .top-bar {
        height: 80px;
    }
} /* min-width 1025px, large screens */


@media only screen and (min-width: 1568px) {
    .additional_bg:before,
    .additional_bg:after {
        display: block;
    }
    header .row {
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        border-radius: 0;
    }
}
@media only screen and (max-width: 1347px) {
    .content_background {
        display: none;
    }
    .row.content {
        padding: 20px;
    }
    .breadcrumbs {
        top: -20px;
    }
}