/*
    Min-width: 320px (smaller phone viewpoints)
    Min-width: 480px (small devices and most phones)
    Min-width: 768px (most tablets)
    Min-width: 992px (smaller desktop viewpoints)
    Min-width: 1200px (large devices and wide screens)
*/


@media all and (min-width: 320px) {
	.main-content,
    .category-content {
        padding: 0 20px;
    }
    .base-container {
        padding: 0 15px;
    }
    .category-breadcrumbs {
        flex: 1 1 100%;
    }
    .l-index-container {
        max-width: 1140px;
        margin: 0 auto;
        padding: 0 20px;
    }
  /*  .t-container {
        max-width: 1140px;
        margin: 0 auto;
    }*/

    /*************************\
    *
	* CATEGORY NAVIGATION
	*
    \*************************/

    h4.desktop-title {
        display: none;
    }

	aside.l-template-menu-mobile {
		margin-bottom: 20px;
		background-color: white;
	}

    aside.l-template-menu-mobile h4 {
    	position: relative;
        padding: 13px;
        margin-bottom: 10px;
        font-weight: bold;
        font-size: 16px;
        line-height: 22px;
        color: #ffffff;
        text-align: center;
        background-color: #4A90E2;
        border-radius: 3px;
    }

    aside.l-template-menu-mobile h4::after {
        content: '';
        position: absolute;
        top: 17px;
        right: 17px;
        display: inline-block;
        width: 8px;
        height: 8px;
        border-bottom: 2px solid #ffffff;
        border-right: 2px solid #ffffff;
        transform: rotate(45deg);
        transition: all 0.3s ease 0s;
    }
    aside.l-template-menu-mobile h4.rotate-chevron::after {
        transform: rotate(-135deg);
        top: 22px;
    }

    aside.l-template-menu .menu {
        list-style: none;
    }

    aside.l-template-menu-mobile .menu li {
        border-bottom: 1px solid #E7E7E7;
    }

    aside.l-template-menu-mobile .menu a {
        position: relative;
    	display: inline-block;
    	width: 100%;
    	padding: 10px;
        font-weight: normal;
        font-size: 16px;
        line-height: 22px;
        color: #272b35;
        transition: all 0.3s ease 0s;
    }

    aside.l-template-menu-mobile .menu a::after {
        content: '';
        position: absolute;
        top: 17px;
        right: 17px;
        display: inline-block;
        width: 6px;
        height: 6px;
        border-top: 1px solid #C4C6CA;
        border-right: 1px solid #C4C6CA;
        transform: rotate(45deg);
    }

	aside.l-template-menu-mobile .menu {
    	display: none;
    }
    aside.l-template-menu p {
        padding: 10px;
        margin-bottom: 0;
        font-weight: bold;
        font-size: 16px;
        line-height: 22px;
        color: #4A90E2;
    }

}



@media all and (min-width: 1200px) {

	.l-index-container,
	.l-index-container .category-content {
		padding: 0;
	}
	.content-area .category-breadcrumbs {
        margin: 0 0 25px 400px;
        padding: 0;
    }
	/*************************\
    *
	* CATEGORY NAVIGATION
	*
    \*************************/

    aside.l-template-menu h4 {
        display: none
    }
    h4.desktop-title {
        display: block;
        font-weight: bold;
        font-size: 18px;
        line-height: 25px;
    }

    aside.l-template-menu .menu {
        list-style: none;
    }

    aside.l-template-menu .menu li {
        margin: 10px 0;
    }

    aside.l-template-menu .menu a {
        font-weight: normal;
        font-size: 16px;
        line-height: 22px;
        color: #272b35;
    }

    aside.l-template-menu .menu a:hover {
        color: #277adc;
    }

    aside.l-template-menu.l-template-menu-desktop {
    	display: block;
    	float: left;
    	margin-bottom: 100px;
    }
    aside.l-template-menu.l-template-menu-desktop .menu {
        display: block !important;
    }
    aside.l-template-menu p {
        padding: 0;
    }
}