
/* ====================================================================== */
/* Smaller than standard 960 (devices and browsers)
/* ====================================================================== */
@media only screen and (max-width: 959px) {
			
				/*	Grid Content Styles */
				/* ---------------------------------------------------------------------- */
				ul#portfolio-grid > li > a h6.subtitle {
				    border:0 none;
					border-top: 1px solid #EBEBEB;
				    margin:0;
					padding-top:5px;
				    padding-bottom:0;
				}
				
				ul#portfolio-grid > li > a > .info {
					display:block;
					position:relative;
					background:none;
					width:auto;
					height:auto;
					top:auto;
					left:auto;
				}
					ul#portfolio-grid > li > a > .info > .shadow {
						display:none;
					}
					ul#portfolio-grid > li > a > .info > .plus {
						display:none;
					}
					ul#portfolio-grid > li > a > .info > .box {
						display:block;
						position:relative;
						background:none;
						border-top:none;
						width:auto;
						height:auto;
						top:auto;
					}
	
}

/* ====================================================================== */
/* Tablet Portrait size to standard 960 (devices and browsers)
/* ====================================================================== */
@media only screen and (min-width: 768px) and (max-width: 959px) {

	/*	Modular Grid Values */
	/* ---------------------------------------------------------------------- */
	/* COL-1 */
	ul#portfolio-grid.col-1 { margin:0 0 -20px 0; padding-bottom:20px; }
	ul#portfolio-grid.col-1 li, #floating-area.nav ul#portfolio-grid.col-1 li { margin:0 0 30px 0; width:728px; }
	#floating-area.sidebar ul#portfolio-grid.col-1 li { width:488px; } /* floating-area */
	/* COL-2 */
	ul#portfolio-grid.col-2 { margin:0 -16px -20px 0; padding-bottom:20px; }
	ul#portfolio-grid.col-2 li, #floating-area.nav ul#portfolio-grid.col-2 li { margin:0 16px 30px 0; width:356px; }
	#floating-area.sidebar ul#portfolio-grid.col-2 li { width:236px; } /* floating-area */
	/* COL-3 */
	ul#portfolio-grid.col-3 { margin:0 -19px -20px 0; padding-bottom:20px; }
	ul#portfolio-grid.col-3 li, #floating-area.nav ul#portfolio-grid.col-3 li { margin:0 19px 30px 0; width:230px; }
	#floating-area.sidebar ul#portfolio-grid.col-3 li { width:150px; } /* floating-area */
	/* COL-4 */
	ul#portfolio-grid.col-4 { margin:0 -16px -20px 0; padding-bottom:20px; }
	ul#portfolio-grid.col-4 li, #floating-area.nav ul#portfolio-grid.col-4 li { margin:0 16px 30px 0; width:170px; }
	#floating-area.sidebar ul#portfolio-grid.col-4 li { width:150px; } /* floating-area */
	
		#floating-area.sidebar ul#portfolio-grid.col-3 li > a > .image { padding:6px; } /* COL-3 // floating-area */
		
			/*	Grid Content Styles */
			/* ---------------------------------------------------------------------- */
			ul#portfolio-grid.col-1 li > a, #floating-area.nav ul#portfolio-grid.col-1 li > a { /* COL-1 */
				width:356px;
			}
			ul#portfolio-grid.col-1 li > .info, #floating-area.nav ul#portfolio-grid.col-1 li > .info { /* COL-1 */
				left:372px;
				width:356px;
			}
				ul#portfolio-grid.col-1 li > .info .box { /* COL-1 */
					height:99.5%;
				}
				ul#portfolio-grid.col-1 li h5.title { /* COL-1 */
					margin:5px 0 6px 0;
				}
				ul#portfolio-grid.col-1 li p { /* COL-1 */
					font-size:12px;
					line-height:16px;
				}
				ul#portfolio-grid.col-2 li > a h5.title { /* COL-2 */
					margin-top:10px;
				}
				ul#portfolio-grid.col-3 li > a h5.title { /* COL-3 */
					font-size:16px;
					line-height:20px;
					margin-top:5px;
					margin-bottom:3px;
				}
				ul#portfolio-grid.col-4 li > a h5.title { /* COL-4 */
					margin-top:4px;
					margin-bottom:3px;
				}
				
			/*	COL-1 // floating-area */
			/* ---------------------------------------------------------------------- */
			#floating-area.sidebar ul#portfolio-grid.col-1 li > a { /* COL-1 */
				width:460px;
			}
			#floating-area.sidebar ul#portfolio-grid.col-1 li > .info { /* COL-1 */
				position:static;
				top:auto;
				left:auto;
				width:auto;
				height:auto;
			}
				#floating-area.sidebar ul#portfolio-grid.col-1 li > .info .box { /* COL-1 */
					position:static;
					width:auto;
					height:auto;
				}
				#floating-area.sidebar ul#portfolio-grid.col-1 li h5.title { /* COL-1 */
					margin:10px 0 6px 0;
				}
				#floating-area.sidebar ul#portfolio-grid.col-1 li h6.subtitle { /* COL-1 */
					border-bottom:0 none;
					padding-bottom:0;
				}
				#floating-area.sidebar ul#portfolio-grid.col-1 li p { /* COL-1 */
					font-size:12px;
					line-height:16px;
					margin-bottom:20px;
				}
				#floating-area.sidebar ul#portfolio-grid.col-1 li .button { /* COL-1 */
					position:static;
					bottom:auto;
					margin-bottom:10px;
				}
	
	/*	Portfolio Single - Title
	/* ---------------------------------------------------------------------- */
	#portfolio-title { margin-top:-20px; }
				
}

/* ====================================================================== */
/* All Mobile Sizes (devices and browser)
/* ====================================================================== */
@media only screen and (max-width: 767px) {
	
			/*	Grid Content Styles */
			/* ---------------------------------------------------------------------- */
			ul#portfolio-grid.col-1 li > a,
			#floating-area ul#portfolio-grid.col-1 li > a { /* COL-1 */
				width:auto;
			}
			ul#portfolio-grid.col-1 li > .info,
			#floating-area ul#portfolio-grid.col-1 li > .info { /* COL-1 */
				position:static;
				top:auto;
				left:auto;
				width:auto;
				height:auto;
			}
				ul#portfolio-grid.col-1 li > .info .box,
				#floating-area ul#portfolio-grid.col-1 li > .info .box { /* COL-1 */
					position:static;
					width:auto;
					height:auto;
				}
				ul#portfolio-grid.col-1 li h5.title,
				#floating-area ul#portfolio-grid.col-1 li h5.title { /* COL-1 */
					margin:10px 0 6px 0;
				}
				ul#portfolio-grid.col-1 li h6.subtitle,
				#floating-area ul#portfolio-grid.col-1 li h6.subtitle { /* COL-1 */
					border-bottom:0 none;
					padding-bottom:0;
				}
				ul#portfolio-grid.col-1 li p,
				#floating-area ul#portfolio-grid.col-1 li p { /* COL-1 */
					font-size:12px;
					line-height:16px;
					margin-bottom:20px;
				}
				ul#portfolio-grid.col-1 li .button,
				#floating-area ul#portfolio-grid.col-1 li .button { /* COL-1 */
					position:static;
					bottom:auto;
					margin-bottom:10px;
				}
	
	/*	Portfolio Options */
	/* ---------------------------------------------------------------------- */
	#portfolio-options {
		background:none;
		padding-bottom:0;
	}
			#portfolio-options #filter li {
				margin:0 4px 4px 0;
			}
	
}

/* ====================================================================== */
/* Mobile Landscape Size to Tablet Portrait (devices and browsers)
/* ====================================================================== */
@media only screen and (min-width: 480px) and (max-width: 767px) {

	/*	Modular Grid Values */
	/* ---------------------------------------------------------------------- */
	/* COL-1 */
	ul#portfolio-grid.col-1 { margin:0 0 -20px 0; padding-bottom:20px; }
	ul#portfolio-grid.col-1 li, #floating-area ul#portfolio-grid.col-1 li { margin:0 0 30px 0; width:420px; }
	/* COL-2 */
	ul#portfolio-grid.col-2 { margin:0 -20px -10px 0; padding-bottom:10px; }
	ul#portfolio-grid.col-2 li, #floating-area ul#portfolio-grid.col-2 li { margin:0 20px 30px 0; width:200px; }
	/* COL-3 */
	ul#portfolio-grid.col-3 { margin:0 -20px -10px 0; padding-bottom:10px; }
	ul#portfolio-grid.col-3 li, #floating-area ul#portfolio-grid.col-3 li { margin:0 20px 30px 0; width:200px; }
	/* COL-4 */
	ul#portfolio-grid.col-4 { margin:0 -20px -10px 0; padding-bottom:10px; }
	ul#portfolio-grid.col-4 li, #floating-area ul#portfolio-grid.col-4 li { margin:0 20px 30px 0; width:200px; }
			
				/*	Grid Content Styles */
				/* ---------------------------------------------------------------------- */
				ul#portfolio-grid.col-2 li > a > .image,
				ul#portfolio-grid.col-3 li > a > .image,
				ul#portfolio-grid.col-4 li > a > .image { padding:0; }
				
				ul#portfolio-grid.col-2 li > a img,
				ul#portfolio-grid.col-3 li > a img,
				ul#portfolio-grid.col-4 li > a img { border:0 none; }
				
					ul#portfolio-grid.col-2 li > a h5.title,
					ul#portfolio-grid.col-3 li > a h5.title,
					ul#portfolio-grid.col-4 li > a h5.title {
						font-size:14px;
						font-weight:500;
						line-height:18px;
						margin-top:5px;
						margin-bottom:3px;
					}
				
	/*	Portfolio Single - Title
	/* ---------------------------------------------------------------------- */
	#portfolio-title { margin-top:-20px; }
	
}

/* ====================================================================== */
/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers)
/* ====================================================================== */
@media only screen and (max-width: 479px) {

	/*	Modular Grid Values */
	/* ---------------------------------------------------------------------- */
	/* COL-1 */
	ul#portfolio-grid.col-1 { margin:0 0 -20px 0; padding-bottom:20px; }
	ul#portfolio-grid.col-1 li, #floating-area ul#portfolio-grid.col-1 li { margin:0 0 30px 0; width:280px; }
	/* COL-2 */
	ul#portfolio-grid.col-2 { margin:0 -20px -10px 0; padding-bottom:10px; }
	ul#portfolio-grid.col-2 li, #floating-area ul#portfolio-grid.col-2 li { margin:0 20px 30px 0; width:280px; }
	/* COL-3 */
	ul#portfolio-grid.col-3 { margin:0 -20px -10px 0; padding-bottom:10px; }
	ul#portfolio-grid.col-3 li, #floating-area ul#portfolio-grid.col-3 li { margin:0 20px 30px 0; width:280px; }
	/* COL-4 */
	ul#portfolio-grid.col-4 { margin:0 -16px -10px 0; padding-bottom:10px; }
	ul#portfolio-grid.col-4 li, #floating-area ul#portfolio-grid.col-4 li { margin:0 16px 30px 0; width:132px; }
				
				/*	Grid Content Styles */
				/* ---------------------------------------------------------------------- */
				ul#portfolio-grid.col-2 li > a h5.title { /* COL-2 */
					margin:10px 10px 7px 10px;
					font-size:18px;
					font-weight:500;
					text-align:center;
					line-height:22px;
				}
				
	/*	Portfolio Single - Title
	/* ---------------------------------------------------------------------- */
	#portfolio-title { margin-top:0; }
			
	
}