@charset "utf-8";
/* Styles for the content  */

h1 {
	font-size:110%;
	text-align:left;
}
h2 {
	font-size:100%;
	text-align:left;
} 
h3 {
	font-size:90%;
	text-align:left;
} 
h4 {
	font-size:90%;
	font-style:italic;
	text-align:left;
}

.mainContent {
	text-align:justify;
	padding:5px;
}
.mainContent hr{
	width:100%;
	float:none;
}

.mainContent img{
/*	border: 2px ridge #D4D0C8;
*/	width:auto; /* Do not enlarge the images bigger than original */
	max-width:100%; /* Do not enlarge the images bigger than original */
	height:auto;
}
.mainContent ol,ul{
	padding-left:30px;
}
.mainContent li{
	padding-left:0px;
	padding-bottom:5px;
	text-align:left;
}



/* Positioning ------------------------------------------------------------- */
.mainContent .alignCenter{
	text-align:center;
	vertical-align:middle;
	align-items:center;
	align-content:center;
}
.mainContent .right{
	float:right;
	width:auto;
	padding:6px;
	padding-right:0px;
}
.mainContent .right img{
	width:100%; /* To allow scaling */
}
.mainContent .right30{
	float:right;
	width:30%;
	padding:6px;
	padding-right:0px;
}
.mainContent .right50{
	float:right;
	width:50%;
	padding:6px;
	padding-right:0px;
}
.mainContent .center{
	width:auto;
	padding:6px;
	display: inline-block;
	vertical-align: middle;
	text-align:center;
}
.mainContent .wide{
	width:100%;
	vertical-align: middle;
	text-align:center;
	align-items:center;
	align-content:center;
}
.mainContent .center img{
	width:100%;
}
.mainContent .left{
	float:left;
	width:auto;
	height:auto;
	padding:6px;
	padding-left:0px;
}
.mainContent .left img{
	width:100%;
}
.mainContent .left30{
	float:left;
	width:30%;
	padding:6px;
	padding-left:0px;
}
.mainContent .left40{
	float:left;
	width:40%;
	padding:6px;
	padding-left:0px;
}
.mainContent .left50{
	float:left;
	width:50%;
	padding:6px;
	padding-left:0px;
}


/* Flex --------------------------------------------------------------- */
.flex, .flexReverse{
	display:flex;   /*other values | flex | inline-flex*/
	flex-direction:row; /*row | row-reverse | column | column-reverse*/
	flex-wrap:wrap; /*nowrap | wrap | wrap-reverse*/
	justify-content:space-around; /*flex-start | flex-end | center | space-between | space-around*/
	align-items:center; /*flex-start | flex-end | center | baseline | stretch*/
	align-content: flex-start;  /*flex-start | flex-end | center | space-between | space-around | stretch*/
}
.flexReverse{
	flex-wrap:wrap-reverse; /*nowrap | wrap | wrap-reverse*/
}
.flexChild{
	flex-grow:0; /*<number> (default 0)*/
	flex-basis:auto; /*<length> | auto (default auto)*/
	flex:none; /*none | [ <'flex-grow'> <'flex-shrink'>? || <'flex-basis'> ]*/
	align-self:auto; /*auto | flex-start | flex-end | center | baseline | stretch*/
	flex-shrink:1; /*<number> (default 1)*/
}
.mainContent .flexChild img{
	width:100%;
}
.col2 .flexChild{
	max-width:300px;
	align-self:flex-start; /*auto | flex-start | flex-end | center | baseline | stretch*/
	margin:0px;
	padding:0px;
	padding-right:5px;
}
.centered{
	align-self:center !important;
}


/* Styling ------------------------------------------------------------ */
.mainContent .copyright{
	text-align: center;
	font-style:italic;
	border-top:#FFF thin ridge;
	border-bottom:#FFF thin ridge;
	padding:5px;
}
.mainContent .author{
	text-align: left;
	font-style:italic;
	font-weight:bold;
}
.mainContent .photocaption, .mainContent .photo{
	font-size: 8pt;
	font-style:italic;
	padding: 0px;
	text-align: center;
	margin:2px;
}
.mainContent .sponsorLogo{
 	float: center;
	text-align:center;
	padding:5px;
}
.mainContent .videoLink{
	text-align:center;
	padding:5px;
	
}




/* Tables ------------------------------------------------------------- */

.mainContent .formattedTable table{
	padding: 5px;
	margin:0px auto;
}
.mainContent .formattedTable td{
	float:left;
	width:270px;
	height:100px;
	text-align:left;
	margin: 2px;
	vertical-align:top;
	background-color: rgba( 256,256,256, 0.4);
}
.mainContent .responsive td{
	float: left;
}


/* Top Winners -------------------------------------------------------- */
.topWinners h1{
	text-align:center;
}
.topWinners{
	margin:0px auto;
	text-align:center;
}
.topWinners td{
	float:left;
	width: 300px;
	height:250px;
	border: #F00 thin solid;
}
.topWinners td{
	vertical-align: middle;
}

.topWinners .box{
	display: inline-flex;
	width:300px;
	height:auto;
	vertical-align: middle;
	align-items:center;
	align-content:center;
	padding:3px 
}
.topWinners p, .topWinners img, .topWinners div{
	margin:0px auto;
	vertical-align:middle;
	
}
.topWinners img{
	width:100%;
}
.topWinners p{
	margin:5px;
}
.topWinners .dogName{
	font-weight:bold;
}
.topWinners .box div{
	width:100%;
	height:100%;
	background-color: rgba( 256,256,256, 0.4);
	border:#CCC thin ridge;
}
.topWinners .flexChild{
	padding:2px;
	margin:2px;
	background-color: rgba( 256,256,256, 0.4);
	border:#CCC thin ridge;
	width:300px;
}

/* News --------------------------------------------------------------- */
.mainContent .news {
	padding: 10px;
	text-align:justify;
	line-height:120%;
}
.mainContent .news h1{
	font-size:14px;
}
.mainContent .news h2{
	font-size:14px;
	font-style:italic;
}
.mainContent .news hr{
	color:#000066;
	height:4px;
}

/* PJ Articles ---------------------------------------------------------- */

.mainContent .pjArticles {
}
.mainContent .pjArticles p{
	font-style:italic;
	text-align:left;
	margin-top:3x;
	margin-bottom:5px;
	padding-right:7px;
	text-align:justify;
}

/* Calendar ------------------------------------------------------------- */
.mainContent .calendar {
	font-size:90%;
	line-height:120%;
	text-align:center;
	font-style:italic;
}
.mainContent .calendar p{
	margin-top:0px;
}
.mainContent .calendar h1,h4{
	text-align:center;
	margin-bottom:5px;
}

/* Finance ------------------------------------------------------------- */
.mainContent .finance {
	padding-left: 40px;
	text-align:left;
	background-color: transparent;
}
.mainContent .finance table{
	width:500px;
}
.mainContent .generalMeeting {
	padding-left: 40px;
	padding-right: 40px;
	text-align:justify;
	background-color: transparent;
	overflow: hidden;
	line-height:120%;
}
.mainContent .generalMeeting h1 {
	font-size:18px;
	text-align:center;
	line-height:120%;
}



/* Show Results ------------------------------------------------------------- */
.showResults {
	font-size: 10pt;
	padding: 0px;
	text-align:justify;
}
.showResults .groupName{
	text-align:center;
	font-size:18px;
	font-weight:bold;
	margin:0px;
	padding:0px
	}
.showResults .showName{
	text-align:center;
	font-size:14px;
	font-weight: bold;
	margin:0px;
	margin-top:5px;
	padding:0px
}
.showResults .showDate{
	text-align:center;
	font-size:12px;
	font-weight: bold;
	margin-top:2px;
	padding:0px
}
.showResults .judge{
	text-align:center;
	margin:0px;
	padding:3px;
	}
.showResults hr {
	width:90%;
	margin-bottom:10px;
}
.showResults .section {
	width: auto;
	padding: 0px;
	text-align: center;
	margin: 0px auto;
	margin-top:10px;
}

.showResults .flexChild{
	text-align: center;
}


.showResults .photo{
	text-align:right;
	padding-right:5px;
	margin:0px auto;
}
.showResults .photocaption {
	text-align: justify;
	margin:0px auto;
}
.showResults img {
	margin:2px;
}
.showResults h1{
	font-size: 12pt;
	padding: 0px;
	text-align: center;
}


/* Show Info ------------------------------------------------------------- */
.showInfo h1{
	font-size: 12pt;
	padding: 0px;
	text-align: center;
}
.showInfo h2{
	font-size: 10pt;
	margin-top:10px;
	margin-bottom:0px;
	padding: 0px;
	text-align: center;
}
.showInfo p{
	margin:0px;
	margin-top:8px;
	padding:0px;
	text-align: center;
}
.showInfo .flexChild{
	align-self:flex-start; /*auto | flex-start | flex-end | center | baseline | stretch*/
}
.showInfo .judge{
	font-weight:bold;
}
.showInfo .ring{
	font-weight:bold;
	background-color:rgba(255,255,255,0.3);
}
.showInfo .ring td{
}
.showInfo td{
	padding-top:2px;
}


/* Sitemap ----------------------------------------------------------------- */
.sitemap p{
	text-align:left;
	margin:1px;

}
.sitemap blockquote{
	margin-left:10px;
	margin-right:0px;

}
/* -------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------- */
@media all and (max-width: 640px) {
.mainContent .formattedTable td{
	width:100%;
	height:auto;
	min-height:100px;
}


}



/* Pitäiskö tämä olla ihan omassa tiedostossa, jotta vois valita millaisia linkkejä missäkin... */
/*A:link { font-weight: bold; text-decoration: none; color: #3E607D;}
A:visited { font-weight: bold; text-decoration: none; color: #3E607D;}
A:active { font-weight: bold; text-decoration: none; color: #7399B9;}
A:hover { font-weight: bold; text-decoration: none; color: #7399B9;}
*/