/*--------------------------------------------------------

	Responsive Stylesheet
	
	Name: Novanoid
	Description: Minimal Single Page Template
	URL: http://rommar.in.ua/novanoid
	Author: Roman Marusenko
	E-mail: maredwinz@gmail.com

	------------------------------------------------------

	[Table of contents]
		01. 1200 and more pixels screen
		02. 992 and more pixels screen
		03. 768 and more pixels screen
		04. 670 and more pixels screen
		05. 460 and more pixels screen

	------------------------------------------------------

	WARNING: All media queries arranged in order of decay.
	If you want to add your media query, add it so as not
	to upset the order.

	To add you media query use the syntax:
	@media (max-width: Npx) {
		Your code here
	}
	Where N is number of pixels of screen.
	
--------------------------------------------------------*/

/*------------------------
	01. 1200PX
------------------------*/
@media (max-width: 1200px) {
	.is-sticky .navbar,
	.is-sticky .navbar.offset { max-width: 940px; }
	#works .grid li.big { width: 225px; }
	#works .grid { margin-left: 0; }
}

/*------------------------
	0. 992PX
------------------------*/
@media (max-width: 992px) {
	.indents { padding: 0 50px; }
	.is-sticky .navbar,
	.is-sticky .navbar.offset { max-width: 720px; }
	#works .grid li.big { width: 225px; }
	#works .grid { margin-left: 45px; margin-right: 45px; }
}

/*------------------------
	02. 768PX
------------------------*/
@media (max-width: 768px) {
	.indents { padding: 0 25px; }
	.navbar-collapse { box-shadow: none; background: #434a54; }
	.navbar li a { padding: 3px 0; text-align: center; }
	.caption { margin: 33% 0 -33% 0; }
	.is-sticky .navbar { max-width: 95%; }
	.is-sticky .navbar.offset { max-width: 95.5%; }
	.navbar.offset li a { color: #fff; }
	.navbar.offset li a:hover,
	.navbar.offset li a:active,
	.navbar.offset li a:focus,
	.navbar.offset li a.current { background: no-repeat; color: #fff; opacity: .6; outline: none; }
	.navbar.offset .navbar-toggle i { color: #656d78; }
	.navbar-collapse { margin-top: 7px; }
	footer,
	footer p { text-align: center; }
}

/*------------------------
	03. 670PX
------------------------*/
@media (max-width: 670px) {
	#works .grid li,
	#works .grid li.big { width: 100%; }
	#works .grid { margin-left: 10px; margin-right: 72px; }
}

/*------------------------
	04. 460PX
------------------------*/
@media (max-width: 460px) {
	.indents { padding: 0 15px; }
	.caption { margin: 66% 0 -66% 0; }
	#works ul.filters li { display: block; width: 60%; margin: auto; }
	/*.is-sticky .navbar.offset { max-width: 93.5%; }*/
}