/** Mobile **/
@media handheld, only screen {
	.a-gallery-image {
		width: 100%;
		height: auto;
	}
	a.left-arrow, a.right-arrow {
		width: 7%;
	}
	.picture-holder .main {
		width: 80%;
	}
}
@media handheld, only screen and (max-width: 640px) {
	.bg-header-inner header p, .bg-header-inner header div, .bg-footer-inner {
		display: none;
	}
	.content, .lists, .title, .bg-header-inner header, .bg-footer-inner footer, .picture-holder .main {
		width: 100%;
	}
	.title {
		margin-left: 0px;
	}
	.bg-footer, .lists {
		display: none;
	}
	.bg-header-inner header h1, .bg-header-inner header h1+a {
		background-size: 100% auto;
		width: 260px;
		height: 113px;
	}
	.th li a, .th li a img, .a-gallery-image {
		width: 100%;
		height: auto;
	}

	a.left-arrow, a.right-arrow {
		display: none !important;
	}
}


/* * * * 
	ASCEDING DEVICE PROPORTIONS
* * * */

/* five pix */
.th li {
	width: auto;
	margin: 0px 3px 9px 3px;
	padding-bottom: 8px;
}

/** Common Portrait for all mobiles **/
@media handheld, only screen and (min-width: 320px) and (max-width: 640px) and (orientation:portrait) {
	/* two pix */
	.th li {
		width: 47%;
		margin: 1px 3px 2px 4px;
		padding-bottom: 0px;
	}
}
/** Common landscape for all mobiles + portrait for fablets **/
@media handheld, only screen and (min-width: 320px) and (max-width: 640px) and (orientation:landscape), only screen and (min-width: 480px) and (orientation:portrait)  {
	/* three pix */
	.th li {
		width: 32%;
		margin: 0px 5px 2px 1px;
		padding-bottom: 0px;
	}
}
/* common for all fablets + tablets */
@media handheld, only screen and (min-width: 640px) {
	/* five pix */
	.th li {
		width: 19%;
		margin: 0px 5px 2px 1px;
		padding-bottom: 0px;
	}
}
/* common for all fablets + tablets */
@media only screen and (min-width: 1024px) {
	/* five pix */
	.th li {
		width: auto;
		margin: 0px 3px 9px 3px;
		padding-bottom: 8px;
	}
}



/* * * * 
	DESCEDING DEVICE PROPORTIONS
* * * */


/* another strange device 720x1280 */
@media screen and (min-width: 720px) and (max-width: 1280px) and (orientation:portrait) {

	.content, .lists, .title, .bg-header-inner header, .bg-footer-inner footer, .bg-footer-inner footer {
		width: 100%;
	}
	.title {
		margin-left: 0px;
	}

	.bg-header-inner header h1, .bg-header-inner header h1+a {
		background-size: 100% auto;
		width: 260px;
		height: 113px;
	}
	.bg-header-inner header p, .bg-header-inner header div {
		display: none;
	}

	.bg-header-inner {
	    background-position: -10px;
	}
	.bg-header-inner header h1, .bg-header-inner header h1 + a {
		left: 250px;
	}
	.bg-header-inner header ul {
		top: 140px;
		left: 250px;
	}
	.bg-header-inner header ul li input[type="text"] {
	    width: 185px;
	}

	.a-gallery-image {
		width: 100%;
		height: auto;
	}
	a.left-arrow, a.right-arrow {
		width: 8% !important;
	}
	.picture-holder .main {
		width: 78% !important;
	}

	/* five pix */
	.th li {
		width: 19%;
		margin: 0px 0px 2px 6px;
		padding-bottom: 0px;
	}
	.th li a, .th li a img, .a-gallery-image {
		width: 100%;
		height: auto;
	}
	.bg-footer-inner {
		display: none;
	}
}


/* ============================================== */
/* iPad Landscape & Portrait                      */
/*                                       1024x768 */
/* ============================================== */
@media screen and (min-width: 768px) and (max-width: 1024px) {
	/* five pix */
	.th li {
		width: 19%;
		margin: 0px 7px 2px 2px;
		padding-bottom: 0px;
	}
	.th li a, .th li a img, .a-gallery-image {
		width: 100%;
		height: auto;
	}
	.bg-footer-inner {
		display: none;
	}
}

/* ============================================== */
/* iPad Landscape                                 */
/*                                       1024x768 */
/* ============================================== */
@media screen and (min-width: 768px) and (max-width: 1024px) and (orientation:landscape) {

}

/* ============================================== */
/* iPad Portrait                                  */
/*                                       768x1024 */
/* ============================================== */
@media screen and (min-width: 768px) and (max-width: 1024px) and (orientation:portrait) {

	.content, .lists, .title, .bg-header-inner header, .bg-footer-inner footer, .bg-footer-inner footer {
		width: 100%;
	}
	.title {
		margin-left: 0px;
	}


	.bg-header-inner {
	    background-position: -20px;
	}
	.bg-header-inner header h1, .bg-header-inner header h1 + a {
		background-size: 100% auto;
		top: 10px;
		left: 250px;
	}
	.bg-header-inner header ul {
		top: 140px;
		left: 230px;
	}
	.bg-header-inner header ul li input[type="text"] {
	    width: 215px;
	}

	.th li {
		width: 19%;
		margin: 0px 5px 2px 2px;
		padding-bottom: 0px;
	}
}

/** new iPhone - portrait **/
@media handheld, screen and (min-width:360px) and (max-width: 640px) and (orientation:portrait) {

	.bg-header-inner {
		background-position: -95px;
	}
	.bg-header-inner header h1, .bg-header-inner header h1+a {
		top: 5px;
		left: 145px;
	}
	.bg-header-inner header ul {
		left: 115px;
		top: 140px;
	}
	.bg-header-inner header ul li input[type="text"] {
		width: 155px;
	}
}
/** new iPhone - landscape **/
/** old iPhone and Android - landscape */
@media handheld, screen and (min-width:360px) and (max-width: 640px) and (orientation:landscape) {

	.bg-header-inner {
		background-position: -85px;
	}
	.bg-header-inner header h1, .bg-header-inner header h1 + a {
		left: 175px;
	}
	.bg-header-inner header ul {
		left: 170px;
		top: 140px;
	}
	.th {
		margin: 0px 3px 1px 2px;
	}
	.bg-header-inner header ul li input[type="text"] {
		width: 200px;
	}
}

/** old iPhone and Android - portrait */
@media handheld, only screen and (min-width: 320px) and (max-width:568px) and (orientation:portrait) {
	.bg-header-inner {
		background-position: -125px;
	}
	.bg-header-inner header h1, .bg-header-inner header h1+a {
		top: 10px;
		left: 55px;
	}
	.bg-header-inner header ul {
		left: 40px;
		top: 140px;
	}
	.bg-header-inner header ul li input[type="text"] {
		width: 195px;
	}
}

/** mobiles max 320x480 (iPhone 4) - landscape */
@media handheld, only screen and (min-width: 320px) and (max-width: 480px) and (orientation:landscape) {

	.bg-header-inner {
		background-position: -65px;
	}
	.bg-header-inner header h1, .bg-header-inner header h1 + a {
		left: 195px;
		top: 10px;
	}
	.bg-header-inner header ul {
		top: 140px;
		left: 115px;
	}
}

/** VERY OLD MOBILES **/
@media screen and (min-width:240px) and (max-width:320px) and (orientation:landscape) {
	.bg-header, .archive, .title:last-of-type {
		display: none;
	}
	.title {
		text-indent: 40px;
	}
	.th li {
		width: 47%;
		margin: 1px 6px 2px 3px;
		padding-bottom: 0px;
	}
}
@media screen and (max-width:240px) and (orientation:portrait) {
	.bg-header, .archive, .title:last-of-type {
		display: none;
	}
	.title {
		text-indent: 40px;
	}
	.th li {
		width: 46%;
		margin: 1px 4px 1px 3px;
		padding-bottom: 0px;
	}
}