@media screen and (max-width: 1180px) {
    .container
    {
        width:95%
    }
}
@media screen and (max-width: 940px) {
    .main-right
    {
        display: inline;
        width:100%;
        float:none;
    }
    .main
    {
        width:100%;
        padding: 0 5px 0 10px;
    }
    .sidebar-right, .sidebar-left
    {
        width:50%;
        padding:0 10px;
    }
    .cat-menu .menu li > ul
    {
        display: none;
    }
    .cat-menu .menu li:hover > ul
    {
        display: block;
    }
	.related li
	{
		flex:50%
	}
}
@media screen and (max-width: 768px) {
    .fc
    {
        width:100%
    }
    .sidebar-right, .sidebar-left
    {
        width:100%;
    }
    .logo{
        display: none;
    }
    .header .ads
    {
        text-align:center;
        width:100%;
        margin-top:5px;
    }

    /* HEADER */

    .top-nav
    {
        padding:10px 0;
        position: fixed;
        z-index: 95;
        top:0;
        right:0;
        left:0;

    }
    body{
        padding-top:55px;
    }
    .top-nav .menulist
    {
        display: none;
    }
    .logo-responsive
    {
        display: inline-block;

    }
    .top-nav .search
    {
        display: none;
    }
    .top-nav .search
    {
        position: absolute;
        top:0;
        right:0;
        left:0;
        bottom:0;
        background:#fff;
        width:100%;
        z-index: 85;
    }
    .top-nav .search input
    {
        height:54px;
        font-size:16px;
        padding-right:15px;
        padding-left:110px;

    }
    .top-nav button, .top-nav .search .icon-close {
        left: 50px;
        top: 9px;
        padding:9px;
        font-size:14px
    }
    .top-nav .search .icon-close
    {
        left:12px;
        display: block;
    }
    #search-controller,#menu-controller
    {
        display: inline-block;
        cursor: pointer;
        border-radius:4px;
        position: relative;

    }
    #menu-controller, #search-controller, #mode-switcher
    {
        margin:2px 0 0 12px;
        float:right;
    }
    #menu-controller
    {
        margin-top:5px;
        font-size:32px;
        width: 32px;
        height: 22px;
    }
    #menu-controller:before
    {
        content:"\"
    }

    #menu-controller span {
        display: block;
        position: absolute;
        height: 2px;
        width: 100%;
        background: rgba(0,0,0,0.1);
        border-radius: 9px;
        opacity: 1;
        right: 0;
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
        -webkit-transition: .25s ease-in-out;
        -moz-transition: .25s ease-in-out;
        -o-transition: .25s ease-in-out;
        transition: .25s ease-in-out;
    }

    #menu-controller span:nth-child(1) {
        top: 0;
    }

    #menu-controller span:nth-child(2) {
        top: calc(50% - 1px);
    }

    #menu-controller span:nth-child(3) {
        bottom:0;
        top:auto;
    }

    #menu-controller.open span:nth-child(1) {
        top:50%;
        -webkit-transform: rotate(135deg);
        -moz-transform: rotate(135deg);
        -o-transform: rotate(135deg);
        transform: rotate(135deg);
    }

    #menu-controller.open span:nth-child(2) {
        opacity: 0;
        right: -60px;
    }

    #menu-controller.open span:nth-child(3) {
        top:50%;
        -webkit-transform: rotate(-135deg);
        -moz-transform: rotate(-135deg);
        -o-transform: rotate(-135deg);
        transform: rotate(-135deg);
    }
    .logo-responsive
    {
        float:left;
        position: relative;

    }

    #search-controller
    {
        font-size: 27px;
        color:rgba(0,0,0,0.12)
    }
   .mode-switch
   {
       float:right;
   }
    .logo-responsive:before
    {
        background:url(../images/logo-responsive-light-and-dark.png) no-repeat 0 0;
        height:34px;
        width:34px;
        background-size: 100% auto;
        float:left;
        content:""
    }

    /* CAT MENU */
    .cat-menu
    {
        padding-top:10px;
        position: fixed;
        top:55px;
        bottom:0;
        z-index: 95;
        background: #8E2DE2;  /* fallback for old browsers */
        background: -webkit-linear-gradient(to top, #4A00E0, #8E2DE2);  /* Chrome 10-25, Safari 5.1-6 */
        background: linear-gradient(to top, #4A00E0, #8E2DE2); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
        width:200px;
    margin:0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        border-radius: 0;
        overflow-y: scroll;
        transition:0.3s ease-in-out;
        -webkit-transition:0.3s ease-in-out;
        left:-200px;
        visibility: hidden;
    }
    .cat-menu.active
    {
        left:0;
        visibility: visible;
    }
    .cat-menu a
    {
        color:#fff;
        float:right;
        width:100%
    }
    .cat-menu .menu > li
    {
        display: block;
        padding:0;
        float:right;
        width:100%
    }
    .cat-menu .menu li li{
        margin:5px 0;
        float: right;
        width: 100%;
    }
    .cat-menu .menu li li a
    {
        margin:0;
        float:right;
        width:100%
    }
    .cat-menu .menu li li:hover > ul
    {
        background:rgba(0,0,0,.1);
        border-top:2px solid rgba(0,0,0,.1)
    }
    .cat-menu .menu > li.menu-item-has-children > a
    {
        border-radius:6px;
        border-bottom-right-radius: 0;
        border-bottom-left-radius: 0;
    }
    .cat-menu .menu > li > a
    {
        padding:10px;


    }
    .cat-menu .menu li > ul
    {
        width:100%;
        position: static;
        float:right;
    }
    .cat-menu .menu li.menu-item-has-children > a:before
    {
        content:"";

    }
    .cat-menu .menu li.menu-item-has-children:before
    {
        content: "\e91c";
        font-family: icomoon;
        position: absolute;
        top: 6px;
        left: 8px;
        padding:6px;
        background:rgba(0,0,0,.1);
        color:#fff;
        z-index: 50;
        border-radius:10px;
    }

    body.active-menu
    {

        overflow: hidden;
        margin-right:-200px;
    }
    .overlay
    {
        position: fixed;
        top:0;
        bottom:0;
        right:0;
        left:0;
        z-index: 90;
        background:rgba(0,0,0,.8);
        transition:0.3s ease-in-out;
        opacity: 0;
        visibility: hidden;
    }
    .overlay.active
    {
        visibility: visible;
        opacity: 1;

    }
}
@media screen and (max-width:540px){
	.footer .copyright
	{
		    padding-bottom: 70px;
	}
} 