<!--

/* Style Sheet for kolady.net
	Basic Black, white and gray look */


/* --- BASICS ELEMENTS --- */

html, h1, h2, h3 {
		margin:0;
		padding:0;
		border:0;
		outline:0;
		font-size:100%;
		vertical-align:baseline;
		background:transparent;
}


body {
		font-family: Verdana;
		color: #7e7e7e;
		background: #000;
		margin: 0px;
		padding: 0px;
		text-align: center;
}

h1 {
		font: bold 1em arial, sans-serif;
		margin: 10px;
		color: white;
}

h2 {
		font: bold 0.8em Verdana, Arial, Sans-serif;
		margin-top: 10px;
		color: white;
}

h3 {
		margin: 0px; padding: 0px;
		font: bold 12pt Tahoma, Arial, Sans-serif;
		color: white;
	}

p 	{
		font: 0.75em Verdana;
		margin: 10px;
}

a:link, a:visited, a:hover, a:active {
		text-decoration: none;
		color: #7e7e7e;
}

/* ---- Layout Elements ---- */

#pageHeader {

		width: 90%;
		margin: 0 auto;
		cursor: hand;
}

#pageHeader h1 {
		font: bold 16px Verdana, arial, sans-serif;
}


#catkoladylogo {
		background: #000 url(images/KoladyLogo.jpg) no-repeat center center;
		width: 116px;
		height: 48px;
		margin: 10px auto;
		cursor: pointer;
}

#cattitle {
		font: bold 16px Verdana, arial, sans-serif;
		padding-top: 5px;
}

#koladylogo {
		background: #000 url(images/KoladyLogo.jpg) no-repeat center center;
		width: 116px;
		height: 48px;
		margin: 10px auto;
		cursor: pointer;
}

#albumlogo {
		background: #000 url(images/AlbumsLogo.jpg) no-repeat center center;
		width: 116px;
		height: 20px;
		margin: 20px auto;
}

#albumtitle {
		margin: 0px auto;
}

#content {
		max-width: 1280px;
		padding-top: 10px;
		margin: 0 auto;
		width: 100%;
		padding-bottom: 20px;
		text-align: center;
}

#galcontent {
		clear: both;
		/*max-width: 800px;*/
		width: 75%;
		padding-top: 10px;
		margin: 0 auto;
		padding-bottom: 20px;
}

#titlecontent {
		clear: both;
		max-width: 800px;
		padding-top: 10px;
		margin: 0 auto;
		padding-bottom: 40px;
		margin-bottom: 40px;
		margin-top: 40px;
		text-align: center;
}

#photowrapper {
		width: 600px;
		height: 400px;
		float: left;
		border: 0;
		position: relative;
}

#photowrapper img {
		border: 0;
}

#wrapper2{
		width: 100%;
		height: 100%;
}

#PhotoSwipeTarget {
		width: 100%;
		height: 100%;
		/*border: 1px solid #7e7e7e;*/
		-webkit-border-radius: 20px;
		-moz-border-radius: 20px;
		-o-border-radius: 20px;
		-ms-border-radius: 20px;
		-khtml-border-radius: 20px;
		border-radius: 20px;
		overflow: hidden;
		behavior: url(scripts/PIE.htc);
		/*float: left;*/
}

#PhotoSwipeTarget img {
		-webkit-border-radius: 20px;
		-moz-border-radius: 20px;
		-o-border-radius: 20px;
		-ms-border-radius: 20px;
		-khtml-border-radius: 20px;
		border-radius: 20px;
		/*behavior: url(scripts/PIE.htc);*/
}

#albumlist {
		width: 180px;
		height: 400px;
		border: 1px solid #7e7e7e;
		-webkit-border-radius: 20px;
		-moz-border-radius: 20px;
		-o-border-radius: 20px;
		-ms-border-radius: 20px;
		-khtml-border-radius: 20px;
		border-radius: 20px;
		overflow: hidden;
		behavior: url(scripts/PIE.htc);
		float: right;
}

#albumlist ul {
		margin: 3px 0 0 0;
		padding: 0;
		font: bold 12px Verdana, arial, sans-serif;
}

#albumlist li {
		line-height: 2.8ex;
		/*background: transparent url(crl.gif) no-repeat top center;*/
		display: block;
		padding-top: 5px;
		margin-bottom: 5px;
		list-style-type: none;

}

#albumlist li a {
		width: 150px;
		height: 25px;
}

#albumlist li a:link, a:visited {
		color: #fff;
}

#albumlist li a:hover {
		color: #ffca13;
}

#pgfooter p	{
			font: 8pt Verdana;
}

.albumindex {
			width: 350px;
			height: 110px;
			margin: 10px;
			padding: 0px;
			border: 1px solid #7e7e7e;
			background: #222222;
			cursor: pointer;
			display: inline-block;
			}

.albumindex h3 {
			margin: 15px 0px 0px 0px;
			font: bold 9pt Verdana;
			color: #bf9900;
			}

.albumindex p {
			margin: 10px 0px 0px 0px;
			}

.albumindex img {
			border: 1px solid #7e7e7e;
			}

.albumover	{
			width: 350px;
			height: 110px;
			margin: 10px;
			padding: 0px;
			border: 1px solid #ffffff;
			background: #444444;
			cursor: pointer;
			display: inline-block;
			}

.albumover h3 {
			margin: 15px 0px 0px 0px;
			font: bold 9pt Verdana;
			color: #ffcc00;
			}

.albumover p {
			margin: 10px 0px 0px 0px;
			color: white;
			}

.albumover img {
			border: 1px solid #7e7e7e;
			}

.albumimage {
			width: 100px;
			height: 100px;
			margin: 5px 0px 0px 3px;
			padding: 0px;
			float: left;
			}

.albumtext	{
			width: 230px;
			padding: 0px;
			margin: 0px;
			float: right;
			text-align: left;
			}

.gallery 	{
			list-style: none;
			padding: 0;
			margin: 0;
			-webkit-padding-start: 0;
			-webkit-margin: 0;
		}

.gallery:after {
			clear: both;
			content: ".";
			display: block;
			height: 0;
			visibility: hidden;
		}


.galThmDiv {
			width: 110px;
			height: 110px;
			margin: 5px;
			border: 1px solid #7e7e7e;
			background: #222222;
			display: inline-block;
			position: relative;

       }


.galThmover {
			width: 110px;
			height: 110px;
			margin: 5px;
			border: 1px solid #ffffff;
			background: #444444;
			display: inline-block;
			cursor: hand;
			position: relative;

       }

.kkvimg {
			height: 100px;
			width: 100px;
			position: absolute;
			left: 50%;
			top: 50%;
			margin-left: -50px;
			margin-top: -50px;
			border: 0;
			line-height: 95px;
			text-align:center;
}

.kkvimg img {
			vertical-align:middle;
			border: 0;
}

.galThmDiv img {
			border: 0px;
}

.galThmover img {
			border: 0px;
}

.galimg {
			border: 1px solid #7e7e7e;

	}

#pageFooter {
	clear: both;
	width: 65%;
	max-width: 1000px;
	margin: 0 auto;
	border-top: 1px solid #1e1e1e;
}

#titleFooter {
	clear: both;
	width: 65%;
	max-width: 1000px;
	margin: 0 auto;
	padding: 10px;
	/*border-top: 1px solid white;*/
}


.kbody {
			font: 8pt Tahoma, Arial, Sans-serif;
}

.photocaption {
			font: bold 8pt Tahoma, Sans-serif;
			margin: 3px 0 3px 0;
			padding: 0;
}
/* ===================================================================================== */
/* ---- Media Queries for multiple screen sizes ---------------------------------------- */
/* ===================================================================================== */
/* ===================================================================================== */
/* ===================================================================================== */
/* ===================================================================================== */
/* ===================================================================================== */

@media only screen and (min-width: 801px) {
	#pageHeader {

			width: 90%;
			margin: 0 auto;
			cursor: hand;
	}

	#pageHeader h1 {
			font: bold 16px Verdana, arial, sans-serif;
	}

	#catkoladylogo {
			background: #000 url(images/KoladyLogo.jpg) no-repeat center center;
			width: 116px;
			height: 48px;
			margin: 10px auto;
			/*cursor: hand;	*/
	}

	#cattitle {
			font: bold 16px Verdana, arial, sans-serif;
			padding-top: 5px;
	}

	#koladylogo {
			background: #000 url(images/KoladyLogo.jpg) no-repeat center center;
			width: 116px;
			height: 48px;
			margin: 10px auto;
			/*cursor: hand;*/
	}

	#albumlogo {
			background: #000 url(images/AlbumsLogo.jpg) no-repeat center center;
			width: 116px;
			height: 20px;
			margin: 20px auto;
	}

	#albumtitle {
			margin: 0px auto;
	}

	#titlecontent {
			clear: both;
			max-width: 800px;
			padding-top: 10px;
			margin: 0 auto;
			padding-bottom: 40px;
			margin-bottom: 40px;
			margin-top: 40px;
			text-align: center;
	}

	#photowrapper {
			width: 600px;
			height: 400px;
			float: left;
			border: 0;
			position: relative;
	}

	#wrapper2{
			width: 100%;
			height: 100%;
	}

	#content {
			max-width: 1280px;
			padding-top: 10px;
			margin: 0 auto;
			padding-bottom: 20px;
	}

	#galcontent {
			clear: both;
			/*max-width: 1024px;*/
			width: 75%;
			padding-top: 10px;
			margin: 0 auto;
			padding-bottom: 20px;
	}

	.albumindex {
			width: 350px;
			height: 110px;
			margin: 10px;
			padding: 0px;
			border: 1px solid #7e7e7e;
			background: #222222;
			display: inline-block;
			}

	.albumindex h3 {
			margin: 15px 0px 0px 0px;
			font: bold 9pt Verdana;
			color: #bf9900;
			}

	.albumindex p {
			margin: 10px 0px 0px 0px;
			}

	.albumover	{
			width: 350px;
			height: 110px;
			margin: 10px;
			padding: 0px;
			border: 1px solid #ffffff;
			background: #444444;
			display: inline-block;
			/*cursor: hand;*/
			}

	.albumover h3 {
			margin: 15px 0px 0px 0px;
			font: bold 9pt Verdana;
			color: #ffcc00;
			}

	.albumover p {
			margin: 10px 0px 0px 0px;
			color: white;
			}

	.albumover img {
			border: 1px solid #7e7e7e;
			}

	.galThmDiv {
			width: 110px;
			height: 110px;
			margin: 5px;
			border: 1px solid #7e7e7e;
			background: #222222;
       	}

    .galThmDiv table {
    		margin: 2px;
    }

	.galThmover {
			width: 110px;
			height: 110px;
			margin: 5px;
			border: 1px solid #ffffff;
			background: #444444;
			cursor: hand;
	       }

    .galThmover table {
    		margin: 2px;
    }

    #pageFooter {
    	width: 65%;
    	max-width: 1000px;
    	margin: 0 auto;
    	border-top: 1px solid #1e1e1e;
    }


}
/* ===================================================================================== */
/* ===================================================================================== */
/* ===================================================================================== */
/* ===================================================================================== */

@media only screen and (max-width: 800px) and (min-width: 521px) {

	#pageHeader {
			width: 90%;
				margin: 0 auto;
			position: relative;
	}

	#pageHeader h1 {
			font: bold 14px verdana, sans-serif;
			/*padding: 10px 0 20px 0;*/
	}

	#catkoladylogo {
			background: #000 url(images/KoladyLogo_med.jpg) no-repeat center center;
			width: 116px;
			height: 50px;
			margin: 0 auto;
			/*cursor: hand;*/
	/*		position: absolute;
			left: 10%;
			top: 5px;	*/
	}

	#cattitle {
			font: bold 14px verdana, sans-serif;
			padding: 5px 0 5px 0;
			/*float: right;*/
	}

	#koladylogo {
			background: #000 url(images/KoladyLogo_med.jpg) no-repeat center center;
			width: 116px;
			height: 50px;
			margin: 5px;
			float: left;
	}

	#albumlogo {
			background: #000 url(images/AlbumsLogo.jpg) no-repeat center center;
			width: 116px;
			height: 20px;
			padding: 0px 5px 0px 0px;
			float: right;
	}

	#albumtitle {
			line-height: 50px;
			margin: 20px auto;
			padding-top: 10px;
	}

	#titlecontent {
			clear: both;
			width: 95%;
			margin: 0 auto;
			padding-top: 5px;
			padding-bottom: 30px;
			margin-bottom: 30px;
			text-align: center;
	}

	#photowrapper {
			position: relative;
			width: 75%;
			padding-bottom: 50.25%;
			height: 0;
			overflow: hidden;
			float: left;
			/*background-color: red;*/
	}

	#wrapper2 {
			position: absolute;
			width: 100%;
			height: 100%;
			/*background-color: red;*/
	}


	#PhotoSwipeTarget {
			float: none;
			text-align: center;
	}

	#listwrapper {
			position: relative;
			width: 23%;
			padding-bottom: 50.25%;
			height: 0;
			float: right;
	}

	#albumlist {
			position: absolute;
			width: 100%;
			height: 100%;
			margin: 0 auto;
			/*padding-bottom: 20px;*/
	}

	#albumlist ul {
			margin: 10px 0 10px 0;
			padding: 0;
			font: bold 12px Verdana, arial, sans-serif;
	}



	#galcontent {
			width: 95%;
			padding-top: 10px;
			margin: 0 auto;
			clear: both;
			padding-bottom: 20px;
	}


	.albumindex {
			width: 150px;
			height: 150px;
			margin: 5px 0px 0px 5px;
			padding: 0px;
			border: 1px solid #7e7e7e;
			background: #222222;
			display: inline-block;
			}

	.albumindex h3 {
			margin: 5px 0px 0px 0px;
			}

	.albumindex p {
			display: none;
			}

	.albumimage {
			width: 100px;
			height: 100px;
			margin: 5px 0px 0px 25px;
			padding: 0px;
			}

	.albumtext	{
			width: 150px;
			padding: 0px;
			margin: 0px;
			text-align: center;
			}

	.albumover	{
			width: 150px;
			height: 150px;
			margin: 5px 0px 0px 5px;
			padding: 0px;
			border: 1px solid #ffffff;
			background: #444444;
			display: inline-block;
			/*cursor: hand;*/
			}

	.albumover h3 {
			margin: 5px 0px 0px 0px;
			font: bold 9pt Verdana;
			color: #ffcc00;
			}

	.albumover p {
			display: none;
			}

	.albumover img {
			border: 1px solid #7e7e7e;
			}

	.galThmDiv {
			margin: 5px;
       	}

	.galThmover {
			margin: 5px;
			cursor: hand;
	       }

	#pageFooter {
    	width: 85%;
    	margin: 0 auto;
    	border-top: 1px solid #1e1e1e;
    }

	.kbody {
				font: 8pt Tahoma, Arial, Sans-serif;
	}


}
/* ===================================================================================== */
/* ===================================================================================== */
/* ===================================================================================== */
/* ===================================================================================== */

@media only screen and (max-width: 520px) {

	#body {
			position: relative;
	}

	#pageHeader {
			width: 90%;
			margin: 0 auto;
	}

	#pageHeader img {
			display: none;
	}

	#pageHeader h1 {
			font: bold 12px verdana, sans-serif;
			padding: 7px 0 10px 0;
/*			text-align: right;*/
	}

	#catkoladylogo {
			background: #000 url(images/KoladyLogo_small.jpg) no-repeat center center;
			width: 116px;
			height: 45px;
			position: absolute;
			left: 5px;
			top: 0px;
			/*cursor: hand;	*/
	}

	#cattitle {
			font: bold 14px verdana, sans-serif;
			padding: 5px 5px 5px 0;
			float: right;
	}


	#pageHeader p {
			display: none;
	}

	#koladylogo {
			/*background: #000 url(images/KoladyLogo_small.jpg) no-repeat center center;
			width: 116px;
			height: 45px;
			margin: 5px;
			float: left;*/
			display: none;
	}

	#albumlogo {
			background: #000 url(images/AlbumsLogo_small.jpg) no-repeat center center;
			width: 22px;
			height: 20px;
			padding: 0px 5px 0px 0px;
			float: right;
	}

	#albumtitle {
			line-height: 10px;
			margin: 0px;
			padding-top: 3px;
			float: left;
	}

	#titlecontent {
			width: 100%;
			margin: 0;
			padding: 0;
	}

	#photowrapper {
			position: relative;
			width: 100%;
			padding-bottom: 67%;
			height: 0;
			overflow: hidden;
			/*background-color: red;*/
	}

	#wrapper2 {
			position: absolute;
			width: 100%;
			height: 100%;
			/*background-color: red;*/
	}

	#PhotoSwipeTarget {
			position: absolute;
			width: 100%;
			border: 0;
			overflow: hidden;
	}

	#albumlist {
			width: 100%;
			height: 100%;
			display: block;
			margin: 0 auto;
			padding-bottom: 20px;
			border: 0;
	}

	#albumlist ul {
			margin: 10px 0 10px 0;
			padding: 0;
			font: bold 14px Verdana, arial, sans-serif;
	}


	#galcontent {
			clear: both;
			width: 98%;
			padding-top: 10px;
			margin: 0 auto;
			padding-bottom: 20px;
	}

	.albumindex {
			width: 140px;
			height: 150px;
			margin: 0px;
			padding: 0px;
			border: 1px solid #7e7e7e;
			background: #222222;
			display: inline-block;
			}

	.albumindex h3 {
			margin: 5px 0px 0px 0px;
			}

	.albumindex p {
			display: none;
			}

	.albumimage {
			width: 100px;
			height: 100px;
			margin: 5px 20px 0px 20px;
			padding: 0px;
			}

	.albumtext	{
			width: 140px;
			padding: 0px;
			margin: 0px;
			text-align: center;
			}

	.albumover	{
			width: 140px;
			height: 150px;
			margin: 0px;
			padding: 0px;
			border: 1px solid #ffffff;
			background: #444444;
			display: inline-block;
			/*cursor: hand;*/
			}

	.albumover h3 {
			margin: 5px 0px 0px 0px;
			/*font: bold 9pt Verdana;*/
			color: #ffcc00;
			}

	.albumover p {
			display: none;
			}

	.albumover img {
			/*border: 1px solid #7e7e7e;*/
			}

	.galThmDiv {
			margin: 0px;
       	}

	.galThmover {
			margin: 0px;
			cursor: hand;
	       }

	 #pageFooter {
    	width: 90%;
    	margin: 0 auto;
    	border-top: 1px solid #1e1e1e;
    }

	.kbody {
				font: 8pt Tahoma, Arial, Sans-serif;
	}


}

-->
