header > * {
     max-width:860px;
     margin: 0 auto;
}
 .banner .grid-x {
     max-width:860px;
     margin: 0 auto;
}
 .grid-x {
     display:flex;
     flex-flow:row wrap;
}
 .grid-y {
     display:flex;
     flex-flow:column nowrap;
}
.item, 
.grid-x .lesson,
.grid-x .class-link {
     flex:0 0 auto;
     box-sizing:border-box;
}

 .item.small-auto {
     flex:1 0 auto;
     width:auto;
}
 .item.small-shrink {
     flex: 0 0 auto;
     width: auto;
}
 @media (min-width:950px){
	 .content {
		max-width:910px;
	 }
     .content > * {
         max-width:860px;
         margin:0 auto;
    }
}
 @media (max-width:950px){
	 .content {
		max-width:650px;
	 }
     .content > * {
         max-width:600px;
         margin:0 auto;
    }
	 .banner .grid-x {
     max-width:600px;
} header > * {
     max-width:600px;
     margin: 0 auto;
}
}






 @media (max-width:700px ){
    /* mobile first */
     .small-hidden {
         display:none;
    }
	
	.content {
		max-width:450px;
	} 
	 .banner .grid-x {
     max-width:450px;
} header > * {
     max-width:450px;
     margin: 0 auto;
}

	.login-system {
		
	 margin-left:20px;
	 margin-right:20px;
	}
	
}
 @media (min-width:700px){
    /* desktops only */
     .large-auto {
         flex: 1 0 auto;
         width:auto;
    }
     .large-hidden {
         display: none;
    }
}