﻿html,body{margin:0;padding:0;height:100%; width: 100%; }

#container {
	width:1024px;
	min-height:100%;
	height:auto !important;
	height:100%;
	margin: 0 auto;
	padding:0 auto;
	color: #333;
	text-align: left;
	line-height:1.2em;
	font-size: 78%;
} 
 #container strong {
	color: #555;
}

/* wrapper ---------------------------------------------------*/
#wrapper{
position:relative;
float:left;
background-position:0 0;
width:100%;
margin:0px;
}
/* sidebar -menu---------------------------------------------------*/

#sidebar{
	display:inline;
	background:none;
	float:left;
	position: absolute;
	width: 50px;
    height:200px;
	padding:0px 0 0 0px;
	left:70px;
	top: 300px;
}

div#menu{ display:block;
position:relative;
float:left;
width : 50px;
height : 150px;
}

div#menu ul li{
	background-image:url(fon/knopka1.png);
	background-position:0 0;
	background-repeat:no-repeat;
	display:block;
	list-style-type:none;
	width:124px;
	height:56px;
	text-align:center;
	padding-top:21px;
}
#content{
	position:relative;
	overflow:hidden;
}

#content p{padding:0 0px 5px 0px;
}
.top { 
text-align:left;
margin: 0px  0 10px 30px;
padding: 0px;
font-size:16px;
font-weight:normal;
color:#333;
}
.stop{ clear:both; height:5px}

/*--------- footer ------------------------------------------*/
.clear {
	clear:both;
    height:5px;	
}
.clearfloat {
	clear:both;
    height:62px;
}
.clearfloat30 {
	clear:both;
    height:13px;	
}
.clearfloat1 {
	clear:both;
    height:62px;
	margin-top:20px	
}
/*   --------- img , img alling, float's  ------------------------------------------*/
img, a img {
border:0;
display: inline;
padding:0px;
}

.i-right {
float: right;
margin:0 0 2px 10px;
position:relative;
	}
.i-center {
text-align:center;
margin:0 auto ;
padding:1px}
		 
.floatleft{ float:left}
.floatright{ float:right}
.center{ margin:0 auto}

/*  ----------------------------  a, class, id , H, text, zagolovki      -------------------------------------*/
H1 {
	font-size: 18px;
	font-style: italic;	
	font-weight: normal;	
	color: #555;}
H2 {
   COLOR:#007403;
   FONT-WEIGHT:bold;font-size:18px;
   margin: 5px;
    line-height: 2.0em;
	text-align:center;
}
H3 {
	font-size: 16px;
	font-style: italic;	
	font-weight: normal;	
	color: #ae7e50;	
	}
	
H4 {
background-color:#f0dfc9;
border:1px #ae7e50  dotted;
border-radius: 5px 5px 0 0 ;
text-align:center;
padding:5px 20px 5px 20px;
margin:2px ;
color: #df5934;
	font-size: 16px;
	font-style: italic;	
	font-weight: 400;
	line-height:1.5em;
	}	

.style3 { display:inline;
	font-size: 13px;
	font-style: italic;	
	font-weight: normal;	
	color: #555;	
	}
	.style4, .style4 a { display:inline;
	font-size: 13px;
	font-style: italic;	
	font-weight: normal;
	margin-right:5px;	
	color: #333;	
	}

.style7 { color:#063;
	font-size: 18px;
	font-style: italic;}

/*--------------------------------news, puppies----------------------------*/

.NB{display:block; 
margin:1px  0 5px 0;
padding:2px;
text-align: center;
color:#ad4300;
font-size: 16px;
font-weight:normal;
font-style:  normal;
 line-height:1.3em;
 border-bottom : 2px dashed #e1c08d; 
 }

#post{ background-color:#f0dfc9;
border: solid 1px #e1c08d;
border-radius: 15px 15px 0 0;
position:relative;
float : left;
display:block;
width:875px;
height:100%; 
text-align:left; 
padding:5px 10px 5px 17px ;
margin:5px 0 5px 0px;
line-height:1.4em; 
font-size:12px;
color: #333;
}
#post-block{position:relative;

float : left;
display:block;
width: inherit;

height:100%; 
text-align:left; 
padding:0 ;
margin:0;


}
#post1{
	background-color: rgb(248 240 229 / var(--tw-bg-opacity));
	position:relative;
	float : left;
	display:block;
	width: 100%;
	border: dotted 1px #e1c08d;
	border-radius: 15px;
	height:100%;
	text-align:left;
	padding:10px 10px 10px 17px ;
	margin:10px 0 5px 0px;
	line-height:1.5em;
	font-size:12px;
	color: #333;
}
#post2{
	background-color: rgb(248 240 229 / var(--tw-bg-opacity));
	position:relative;
	float : left;
	display: inline;
	width: 456px;

	border: dotted 1px #e1c08d;
	border-radius: 15px;
	height:100%;
	text-align:left;
	padding:10px 10px 10px 17px ;
	margin:10px 8px 5px 0px;
	line-height: 1.2em;
	font-size: 15px;
	color: #333;
}
#post2 img, #post3 img, #post1 img {
	display: inline;
}
.merry-christmas {
	height: 250px;
}
#post3{
	background-color: rgb(248 240 229 / var(--tw-bg-opacity));
	position:relative;
	float : left;
	display: inline;

	width: 301px;

	border: dotted 1px #e1c08d;
	border-radius: 15px;
	height:100%;
	text-align:left;
	padding:10px 10px 10px 17px ;
	margin:10px 8px 5px 0px;
	line-height:1.5em;
	font-size:12px;
	color: #333;
}
#post1 p, #post2 p, #post3 p  { line-height:1.5em; 
font-size:12px;
color: #333;
}
#post p { display:block;
position:relative;
float:left;
line-height:1.1em; 
font-size:12px;
color: #333;
}
#post strong , #post p strong{ 
font-weight: 700;
COLOR:#714a22;
font-size:11px;
padding:0 5px 0 0 
 }  
#post1 strong , #post1 p strong, #post2 strong , #post2 p strong, #post1 b , #post1 p b, #post2 b , #post2 p b{ 
font-weight: bold;
COLOR:#555;
font-size:11px;
 }  
 
#post1  em, #post1 p em, #post2  em, #post2 p em, #post1  i, #post1 p i, #post2  i, #post2 p i {
	color:#df5934;
	font-weight:600;
	padding:0 8px 0 8px;	
	 font-style: italic;
}

.day {
	display:block;
	margin: 5px 20px 10px 0px;
	padding: 0px;
	font-size: 12px;
	text-align: left;
	color: #714a22;
	line-height: 1.4em;
 }  

#post1 A:link, #post1 A:visited,#post1 A.active,#post1 p A:link, #post1 p A:visited,#post1 p A.active, #post A:link, #post A:visited,#post A.active,#post p A:link, #post p A:visited,#post p A.active,
post2 A:link, #post2 A:visited,#post2 A.active,#post2 p A:link, #post2 p A:visited,#post2 p A.active, {
color:#77622b;
font-weight:300;
margin:0 5px 0 10px;
text-decoration:none
}

#post1 A:hover, #post1 p A:hover, #post A:hover, #post p A:hover,
post2 A:hover, #post2 p A:hover, { 
color:#77622b;
text-decoration:underline
}

.i-r{ float:right;
margin:2px 2px 2px 20px ;
/*border:1px #ae7e50 solid;*/
border-radius: 4px;
 box-shadow: 0 0 5px #000;
}
.i-rr{ float:left;
margin:2px 20px 2px 2px ;
/*border:1px #ae7e50 solid;*/
border-radius: 4px;
 box-shadow: 0 0 5px #000;
}
.i-l{ float:left;
margin:2px 20px 2px 2px ;
border:1px #ae7e50 solid;
}
/*-----------------------photos google----------------------------*/

#images,#images1, #images2, #images3, #images4, #images5, #images6, #images7, #images8, #images9,#images10,
 #images11,#images12,#images13,#images14 {width:100%;
height:auto;	
text-align:center;
}

/*----------------------- kartochka sobaki-, kartochka pometa-----------------------------*/

.titul5{
float : right;
width:250px;	
display:block; 
margin:0 0 0 15px ;
padding:5px 0 5px 0;
font-size: 13px;
text-align: center;
color:#714a22;
line-height:1.3em;
background-color:#f0dfc9;
border:1px #ae7e50  dotted;
border-radius: 5px  ;
}
.titul5 img{
display:block; 
margin:7px 0 -5px 0 ;

border-radius: 4px;
 box-shadow: 0 0 5px #000;
}
.titul2, .titul2 p{
border:none;	
display:block; 
margin:-5px 0 0 0px;
padding:5px;
font-size: 14px;
text-align: center;
color:#714a22;
line-height:1.3em
}

/*----------------------------------------------------------------------------------------*/
/*
	jQuery Coda-Slider v2.0 - http://www.ndoherty.biz/coda-slider
	Copyright (c) 2009 Niall Doherty
	This plugin available for use in all personal or commercial projects under both MIT and GPL licenses.
*/

/* Insignificant stuff, for demo purposes */

	
	.panel h2.title { margin:-25px 0 30px 0; font-size:11px; color:#000; font-weight:normal;    }
	noscript div { background: #ccc; border: 1px solid #900; margin: 20px 0; padding: 15px }
	p A:link, p A:visited,p A.active {color:#77622b; font-weight:300; margin:0 5px 0 10px; text-decoration: underline
}
p a:hover {
color:#ae7e50; font-weight:300;text-decoration:none
}
 p  strong a{
color:#ae7e50; font-weight:300;text-decoration:none
}

/* Most common stuff you'll need to change */

	/* Use this to keep the slider content contained in a box even when JavaScript is disabled */
.coda-slider-no-js .coda-slider { height: 100px; overflow: auto !important; padding-right: 20px }
	
	/* Change the width of the entire slider (without dynamic arrows) */
	.coda-slider, .coda-slider .panel { width: 550px } 
	
	/* Change margin and width of the slider (with dynamic arrows) */
	.coda-slider-wrapper.arrows .coda-slider, .coda-slider-wrapper.arrows .coda-slider .panel { width: 580px }
	.coda-slider-wrapper.arrows .coda-slider { margin: 0 0px }
	
	/* Arrow styling */
	.coda-nav-left a, .coda-nav-right a { background: #000; color: #fff; padding: 5px; width: 60px; font-size:10px }
	
	/* Tab nav */
	.coda-nav ul li a.current { background: #ead6b3; }
	
	/* Panel padding */
	.coda-slider .panel-wrapper {padding:0 0px 0  0px;
	margin:0 0 0 5px;
	 }
	.coda-slider .panel-wrapper1 {padding:0 0px 0  0px;
	margin:0 0 0 30px }
	.coda-slider .panel-wrapper2 {padding:0 0px 0  0px;
	margin:30px 0 0 30px }
	/* Preloader */
	.coda-slider p.loading { padding: 20px; text-align: center }

/* Don't change anything below here unless you know what you're doing */

	/* Tabbed nav */
	.coda-nav ul { clear: both; display: block; margin: auto; overflow: hidden; }
	.coda-nav ul li { display: inline;  }
	.coda-nav ul li a { background-image: url(fon/lang.png) ;
	background-position:top left;   color: #fff; display: block; float: left; margin-right: 1px; padding: 3px 10px;  text-decoration: none; border:1px dotted #e1c08d; border-radius: 5px;  }

	/* Miscellaneous */
	.coda-slider-wrapper { clear: both; overflow: auto; margin:20px 0 0 0  }
	.coda-slider-wrapper img{ margin:-10px 5px 0 5px; padding:1px;
	 float:right; display:inline ;border-radius: 15px;
	 /*border:1px #a96509 solid;   background-image: url(fon/blok.png)*/}

	.coda-slider { float: left; overflow: hidden; position: relative }
	.coda-slider .panel { display: block; float: left; }
	.coda-slider .panel img { display: inline; margin:0 5px; padding:1px; border:none; float:left }
	.coda-slider .panel-container { position: relative }
	.coda-nav-left, .coda-nav-right { float: right }
	.coda-nav-left a, .coda-nav-right a { display: block; text-align: center; text-decoration: none }


/*------------- Katalog: ch, males, females - skript capSlide-------------------------------------------------------------------------*/
.top-chih {
	font-size: 18px;
	font-style: italic;
	margin:0px 0 10px 0px;
	color:#505050;
	text-align:center;
	display:block;
	line-height:1.5em;
}
