/*-=Small screens=-*/
    @media only screen and (max-width: 40em) {
        /* 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: 13px;
            background: #333333; /* change background color if you need */
        }
        .top-bar-section ul li:hover > a{ background: #111 !important; /* change background color if you need */ }
        
        .logo{
            text-align: center;
        }
        .slogan-text{
            text-align: center;
            padding: 0;
        }
        a.donate-btn{
              float: none;
              margin: auto;
              max-width: 170px;
              margin-top: 20px;
        }
        #home-slider .slick-slide img{
            margin: auto;
        }
        .counter-list li{
            width: 100%;
            margin-bottom: 20px;
        }
        .fullwidth-thumb h1{
            font-size: 32px;
            line-height: 38px;
        }
        .top-header #lang_sel_click{
            max-width: 100%;
        }
        .rtl .top-bar-section ul li{
            float: none;
        }
        .rtl .top-bar-section ul li a{
            padding-right: 15px;
        }

        ul.accordion { margin-bottom: 30px; }
    } /* 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 .title-area{ display: none; }
        .top-bar-section ul { background: transparent; }
        .top-bar-section ul li { background: transparent; }
        .top-bar-section li:not(.has-form) a:not(.button) {
            color: black;
            background: transparent;
            font-family: 'Roboto', sans-serif;
            text-transform: uppercase;
            font-weight: 700;
            font-size: 15px;
            line-height: 46px;
            height: 46px;
            padding: 0 10px;
            -webkit-transition: all 300ms ease-in-out;
            -moz-transition: all 300ms ease-in-out;
            -o-transition: all 300ms ease-in-out;
            transition: all 300ms ease-in-out;
            border-bottom: 6px solid transparent;
            box-sizing: border-box;
        }
        .top-bar-section li:not(.has-form) a:not(.button):hover {
            color: #004086;
            background: transparent;
            border-bottom: 6px solid #4488B4;
        }
        .top-bar-section li.current-menu-item > a:not(.button) {
            color: #004086;
            background: transparent;
            border-bottom: 6px solid #4488B4;
        }
        .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 { float:right; } */
        /* 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) { 

    } /* min-width 641px and max-width 1024px, use when QAing tablet-only issues */

/*-=Large screens=-*/
    @media only screen and (min-width: 64.063em) { 
        .top-bar-section li:not(.has-form) a:not(.button) {
            font-size: 18px;
            padding: 0 20px;
        }
    } /* min-width 1025px, large screens */

    @media only screen and (max-width: 1023px) {
        .slogan-text p{
            font-size: 26px;
        }
        .slogan-text p strong{
            font-size: 46px;
        }
        .fullwidth-thumb h1{
            -webkit-transform: none;
            -ms-transform: none;
            transform: none;
            margin-top: 30px;
        }
        #lang_sel_click{
            max-width: 164px;
            width: 100%;
            margin-right: 0;
            margin-top: 20px;
        }
        #lang_sel_click a.lang_sel_sel, #lang_sel_click a{
            padding-left: 0;
            text-align: center;
        }
        #lang_sel_click ul ul, #lang_sel_click li{
            width: 100%;
        }
        
    }
    @media only screen and (max-width: 768px) {
        .interrior-thumb-bg h1{
              font-size: 34px;
        }
        .sidebar{
            margin-top: 0;
        }
        .sidebar-wrap:before{
            display: none;
        }
    }
