/*   Alexander Reilly Artist Custom styles */


@font-face {font-family: Circus; src: url(../font/Circus.ttf); }
@font-face {font-family: CoffeeTin; src: url(../font/CoffeeTinInitials.ttf); }
@font-face {font-family: Playfair; src: url(http://fonts.googleapis.com/css?family=Playfair+Display:400,400italic,700,700italic); }

body {
    background: url('../img/bg4.jpg') no-repeat center top fixed #d7e5ee;
    background-size: 100% 100%;
}
.container{
	/*background: url('../img/demo.jpg') no-repeat center top;*/
	margin: 0 auto;
	position: relative;
	width: 1200px;
	min-height: 740px;
}

h1, h2, li a span {
	display: block;
	margin: 0px;
	padding: 0px; 
	text-indent: -9999999px;
}

/*

color 1 2ca3db
color 2 e2f0f8


.landing h2{
background-color: #2ca3db; background-image: -webkit-gradient(linear, left top, left bottom, from(#2ca3db), to(#e2f0f8));
background-image: -webkit-linear-gradient(top, #2ca3db, #e2f0f8);
background-image: -moz-linear-gradient(top, #2ca3db, #e2f0f8);
background-image: -ms-linear-gradient(top, #2ca3db, #e2f0f8);
background-image: -o-linear-gradient(top, #2ca3db, #e2f0f8);
background-image: linear-gradient(to bottom, #2ca3db, #e2f0f8);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#2ca3db, endColorstr=#e2f0f8);
}
*/

nav ul {margin: 0px; padding: 0px;}
nav li {list-style: none;}
nav li a img.label {z-index: 1;}
nav li a img.linkpainting {width: 100%; z-index: 3;position: relative;}
nav li a {display: block;position: relative;z-index: 2;}

/*  Animated gifs for preload */
nav li a img.linkpainting_hover {display: none;}

header em, li, li img.label {
	margin: 0px;
	padding: 0px;
	position: absolute;
}

header em {
	display: block;
    height: auto;
    left: 24%;
    top: 3%;
    width: 53%;
}
header em img { width: 96%;}


/*  BIG PAINTINGS  */

.paintings_big {
    left: 1%;
    top: 38%;
    width: 45%;
}
.paintings_big .label {
	right: -18%;
    top: 80%;
    width: 76%;
}
.paintings_big a {
	cursor: pointer;
	height: auto;
	width: 76%;
}

/*  MEDIUM PAINTINGS  */

.paintings_med {
    left: 35%;
    top: 29%;
    width: 38%;
}
.paintings_med .label {
	right: -26%;
    top: 18%;
    width: 40%;
}
.paintings_med a {
	cursor: pointer;
	height: auto;
	width: 77%;
}


/*  SMALL PAINTINGS AND PRINTS  */

.paintings_sma {
    right: 2%;
    top: 46%;
    width: 28%;
}
.paintings_sma .label {
	bottom: -15%;
    left: 0;
    width: 69%;
}
.paintings_sma a {
	cursor: pointer;
	height: auto;
	width: 77%;
}


/*  CONTACT  */

.about-contact {
    left: 4%;
    top: 3%;
    width: 26%;
}
.about-contact .label {
	left: -45px;
    top: 88%;
    width: 56%;
}
.about-contact a {
	cursor: pointer;
	height: auto;
	width: 77%;
}



/*  BOOKS & VIDEOS  */

.books-videos {
    right: 9px;
    top: -11px;
    width: 29%;
}
.books-videos .label {
	right: -2%;
    top: 92%;
    width: 39%;
}
.books-videos a {
	cursor: pointer;
	height: auto;
	width: 100%;
}


/*  SHOP  */

.shop {
    right: 26%;
    top: 65%;
    width: 10%;
}
.shop .label {
	left: -141%;
    top: 76px;
    width: 139%;
}
.shop a {
	cursor: pointer;
	height: auto;
	width: 77%;
}



/* 
	Moving background by Chris Coyier
    chriscoyier@gmail.com
    http://chriscoyier.net
*/

#background {
	background: url(../img/background.png) repeat 5% 5%;
	position: absolute;
	top: 0; left: 0; right: 0; bottom: 0;
	z-index: 100;
}

#midground {
	background: url(../img/midground.png) repeat 20% 20%;
	position: absolute;
	top: 0; left: 0; right: 0; bottom: 0;
	z-index: 100;
}

#foreground {
	background: url(../img/foreground.png) repeat 90% 110%;
	position: absolute;
	top: 0; left: 0; right: 0; bottom: 0;
	z-index: 200;
}
#page-wrap {
	/*background:none repeat scroll 0 0 rgba(255, 255, 255, 0.3);*/
	margin: 0 auto;
	position: relative;
	overflow: hidden;
	width: 1200px;
	z-index: 300;
}



/* ////////////   LANDING GENERIC  ////////////// */

body.landing header em, body.landing li, body.landing li img.label {
	position: relative;
}

.landing h2 {
	border: solid 2px #2c3a3f;
	border-radius: 18px;
	display: block;
	font-size: 2em;
	font-family: Circus, Arial;
	padding: 12px 20px 10px 20px;
	text-indent: 0px;
	margin: 0px 16px 40px 16px;
	overflow: hidden;
	text-shadow: 1px 1px 1px #999;
	/*box-shadow: 5px 2px 5px #333;*/
	width: auto !important;
	text-align: center;

-webkit-box-shadow: 0px 0px 9px 2px rgba(0,0,0,0.99);
-moz-box-shadow: 0px 0px 9px 2px rgba(0,0,0,0.99);
box-shadow: 0px 0px 9px 2px rgba(0,0,0,0.99);
}
.landing h2 span.titleregular {font-size: 1.1em !important;}
.landing h2 span.titlesmall {font-size: .8em !important; display: block; overflow: hidden;}


.top_side {
	display: block;
	float:left;
	padding-right: 3%;
	width: 30%;
}

.top_side header em {
    display: block;
    height: auto;
    left: auto;
    top: auto;
    width: 100%;
}

nav.thumbnail li {
	display: block;
	float: left;
	margin-right: 5%;
	margin-bottom: 6%;
	height: 85px;
}

nav.thumbnail li.endrow {
	margin-right: 0%;
}

nav.thumbnail li a {
	height: 100%;
}
nav.thumbnail li a img {
	position: relative;
	top: auto;
	right: auto;
	bottom: auto;
	left: auto;
	height: 100%;

}

.center_main {
	display: block;
	float:left;
	width: 66%;
}
.center_main nav ul li {
	display: block;
	float: left;
	height: auto;
	left: auto;
	right: auto;
	top: auto;
	width: auto;

}
.center_main nav ul li a {
	left: auto;
	top: auto;
	right: auto;
	width: auto;

}

.bigtext {
	background: url('../img/bg_bigtext_mosaic.jpg') repeat-y center;
	background-size: 95% auto;
	clear: both;
	color: #333333;
	display: block;
	font-family: 'Playfair';
	margin-bottom: 20px;
	overflow: hidden;
    width: 95%;
}
.bigtext .bigtext_inner {
	background: url('../img/bg_bigtext_top.jpg') no-repeat center top;
	background-size: 95% auto;
	padding: 14% 18% 0% 18%;
}
.bigtext .bigtext_bottom {
	background: url('../img/bg_bigtext_bottom.jpg') no-repeat center bottom;
	background-size: 95% auto;
	height: 120px;
	padding: 0px;
}
.bigtext h3 {
	font-size: 1.5em;
	margin-bottom: 0px;
}
.highlighted {
	font-size: 1.2em;
	font-weight: 400;
}

footer div {
	color:#FFFFFF;
	float:left;  
	font-size:.7em;
	padding-left: 14%;
	text-align: center;
	width: 80%;
}
footer div a {
	color: yellow;
}

.social-links {
	clear: both;
	display: block;
	margin: 0 0 10px 0;
	padding: 0px;
	text-align: center;
}
.social-links ul {
	display: block;
	float: left;
	margin: 0 0 0 55%;
	overflow: hidden;
	padding: 0px; 
}

.social-links ul li {
	background: url('../img/social_sprite.png') no-repeat 0 0;
	display: block;
	height: 50px;
	list-style: none;
	margin: 0 5px 0 0;
	padding: 0px; 
	position: relative;
	float: left;
	text-indent: -99999px;
	width: 50px;
}
.social-links ul li a { display: block; height: 50px !important; width: 50px !important;}
.social-links ul li.social_like {background-image: none; text-indent: 0px; padding-top: 28px; height: 12px;}

.social-links ul li.social_facebook {background-position: -100px 0;}
.social-links ul li.social_youtube {background-position: -215px 0;}
.social-links ul li.social_twitter {background-position: -160px 0;}


/* ////////////  SECTIONS ///////////////// */

body.big_paintings {
	background: url('../img/bg_bigpaintings.jpg') no-repeat center top fixed #d8f6be;
	background-size: 100% 100%;
}
body.big_paintings h2 {background: url(../img/button_bg.png) repeat-x #d6effd;}
body.big_paintings .paintings_big { display: none; }

body.medium_paintings {
	background: url('../img/bg_mediumpaintings.jpg') no-repeat center top fixed #d9dafd;
	background-size: 100% 100%;
}
.medium_paintings h2 {background: url(../img/button_bg2.png) repeat-x #d6effd;}
body.medium_paintings .paintings_med {display: none;}

body.small_paintings {
	background: url('../img/bg_smallpaintings.jpg') no-repeat center top fixed #422126;
	background-size: 100% 100%;
}
.small_paintings h2 {background: url(../img/button_bg3.png) repeat-x #cbcbca;}
.small_paintings .bigimage p {color: #FFF}
body.small_paintings .paintings_sma{display: none;}


body.aboutme-contact {
	background: url('../img/bg_aboutme.jpg') no-repeat center top #422126;
	background-size: 100% auto;
}
.aboutme-contact h2 {background: url(../img/button_bg4.png) repeat-x #ffffff;}
body.aboutme-contact .about-contact {display: none;}

body.books-and-videos {
	background: url('../img/bg_booksandvideos.jpg') no-repeat center top #1b839f;
	background-size: 100% auto;
}
.books-and-videos h2 {background: url(../img/button_bg5.png) repeat-x #efabaa;}
body.books-and-videos .books-videos {display: none;}

body.shop-page {
	background: url('../img/bg_shop.jpg') no-repeat center -50px #1b839f;
	background-size: 100% auto;
}
.shop-page h2 {background: url(../img/button_bg6.png) repeat-x #FFFFFF;}
body.shop-page .shop{display: none;}

/* PAINTING DETAILS .pnt */

.pnt_name { font-weight: bold;}
.pnt_sold { color: red;}
.pnt_enlarge {float: right; font-size: .8em; color: rebeccapurple;	}
.medium_paintings .pnt_enlarge {color: magenta;	}


/* ///////////  MEDIA QUERIES /////////////// */


/* Large screens ----------- */
@media only screen  and (min-width : 1824px) {}

/* Desktop Laptop ----------- */
@media (max-width: 1224px) {
	.container{
		width: 94%;
	}
	#page-wrap {
		width: 94%;
	}
}

/*  Landscape tablet ----------- */
@media (max-width: 1024px) {
	.container{
		min-height: 640px;
	}
	.shop {
    	top: 65%;
	}
}

.mobile-menu {display: none;}

/*  Phone ----------- */

@media (max-width: 768px) {
	body.shop-page {
    	background: #1b839f url("../img/bg_shop.jpg") no-repeat scroll center 182px / 100% auto;
	}
	.landing #page-wrap, .container {
	    width: 99%;
	}
	h1 {display: none;}

	.landing h2 {
		float: left;
		font-size: 1.2em;
		margin: 5px 12% 0;
    	width: 60% !important;
		
	}

	.mobile-menu {
		display: block;
		position: absolute;
		height: 32px;
		right: 5px;
		top: 5px;
		width: 32px;
		z-index: 100;
	}

	.landing header {padding-bottom: 30px;}

	.mobile-menu { display: block; overflow: hidden;}
	.center_main nav { display: none;}
	.thumbnail {display: none;}
	.center_main { display: block; width: 95%}
	.top_side { float: left; width: 100%; }

	.image_1, .image_2, .image_3, .image_4, .image_5, .image_6, .image_7, .image_8, .image_9, 
 .image_10, .image_11, .image_12, .image_13, .image_14, .image_15, .image_16, .image_17, .image_18 {
		display: block !important;
		text-align: center;
	}
	.image_1 a,.image_2 a, .image_3 a, .image_4 a, .image_5 a, .image_6 a, .image_7 a, .image_8 a, .image_9 a, .image_10 a, .image_11 a, .image_12 a, .image_13 a, .image_14 a, .image_15 a, .image_16 a, .image_17 a, .image_18 a, .image_18 a {
		display: block;
		overflow: hidden;
		text-align: center;
		width: 100%;
	}

	.bigimage p {font-size: .8em;}
	.top_side header em { float: left; text-align: center; padding-bottom: 10px;}

	header em img {
		width: 90%;
	}
	.landing header em img {
		margin-left: 0%;
		width: 75%;
	}
	header em, li {
		left: auto !important;
		position: relative !important;
		right: auto !important;
		top: auto !important;
		width: 100%;
	}
	/* h1, h2 { height: 1px; overflow: hidden;}*/
	header, li {
		width: 100% !important;
		overflow: hidden;
	}
	li a { width: 90% !important;}

	nav li a img.linkpainting {width: 85%;}


	.paintings_big .label {
		right: -1%;
    	top: 77%;
    	width: 55%;
	}

	.paintings_med  .linkpainting{
	    width: 80%;
	}
	.paintings_med .label {
	    right: -7%;
	    top: 22%;
	    width: 38%;
	}

	.paintings_sma  .linkpainting{
	    width: 60%;
	    margin-left: 25%;
	}
	.paintings_sma .label {
	    left: 0%;
	    top: 57%;
	    width: 29%;
	}
	nav li.about-contact a img.linkpainting {
	    width: 62%;
	    margin: 8% 0;
	}
	.about-contact a {
    	text-align: center;
    	margin-bottom: 4%;
	}
	.about-contact .label {
	    left: 1%;
    	top: 70%;
    	width: 28%;
	}

	.books-videos {
		margin-top: -10%;
	}
	
	.books-videos .label {
	    right: 1%;
    	top: 62%;
    	width: 29%;
	}
	nav li.shop a img.linkpainting {
	    width: 24%;
	    float: right;
	}
	.shop .label {
	    left: 48%;
    	width: 23%;
	}
	.social-links li {
		float: left;
		width: 40px;
	}
	.social-links ul {
		margin: 5% 0 0 5%;
	}
	.social-links ul li{height: 50px !important; width: 50px !important;}
	.social-links ul li.social_like {height: 20px !important;}
	.pnt_enlarge {display: none;}
}