/* Содержание

=============================================================
Верстка ::::::::::: Макс Яхонтов :::::::::: www.fusionlab.ru
=============================================================

1. Reset
2. Основные контейнеры
3. Шапка
	3.1 Главное меню
4. КАТАЛОГ
	4.1 Цвета плашек каталога	
	4.2 Каталог на главной странице
		4.2.1 Картинки разделов каталога на главной странице
	4.3 Каталог на внутренних страницах
		4.3.1 Картинки разделов каталога на внутр страницах
		4.3.2 Сокращенный (6 плашек) и полный(7 плашек) каталоги
5. Блок информации о модели
	5.1 Список моделей
	5.2 Картинки разделов для списка моделей
	5.3 Блок фотографий модели
	5.4 Краткое описание
6. Содержательная часть
	6.1 Категории
		6.1.1 Иконки категорий
	6.2 Блок содержания категории
		6.2.1 Компоненты
		6.2.2 Подробная информация о компоненте
		6.2.3 Списки цветов
7. Простая текстовая страница
	7.1 Страница новостей
8. Контактная форма
9. Подвал
	9.1 Анимация лампы
	
!! Отдельные стили для IE в ie.css
------------------------------------------------------------------*/



/* 1. Reset
------------------------------------------------------------------*/
html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,fieldset,input { 
	margin: 0; 
	padding: 0; 
}
h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,em,strong,th,small,textarea { 
	font-size: 1em; font-weight: normal; font-style: normal; 
}
ul,ol { 
	list-style: none; 
}
fieldset,img { 
	border: none; 
}
caption,th { 
	text-align: left; 
}
table { 
	border-collapse: collapse; 
	border-spacing: 0; 
} 


/* 2. Основные контейнеры
------------------------------------------------------------------*/
body {
	font: 75% Tahoma, Arial, Helvetica, sans-serif;
	background: #3D2F15;
}
#wrap {
	background: url(/images/header-topbg.jpg) repeat-x center top;color: #3D2F15;
}

#main {
	margin-right: auto;
	margin-left: auto;
	width: 900px;
}
hr {
	height: 1px;
	border: none;
	color: #4D3D1F;
	background: #4D3D1F;
	margin: 2em 0 1.2em;
}

/* 3. Шапка
------------------------------------------------------------------*/
#header {	
	margin-bottom: 20px;
	/*Отчистка*/
	overflow: hidden;
	width: 900px;

}
#logo {
	margin-top: 25px;
	float: left;
}



/* 3.1 Главное меню
---------------------------------*/
#mainmenu {
	float: right;
	margin-top: 55px;
	margin-right: 25px;
}
	/* Двери */
#mainmenu li {
	background: url(/images/mainmenu-li-wide.jpg) no-repeat left top;
	float: left;
	text-align: center;
	height: 30px;
	margin-left: 10px;
	}
#mainmenu li a {
	background: url(/images/mainmenu-li.jpg) no-repeat right top;
	padding-right: 15px;
	padding-left: 15px;
	height: 30px;
	padding-top: 0.2em;
	font-size: 1.2em;
	display: block;
}
#mainmenu a:link {
	color: #FFFFFF;
	text-decoration: none;
}
#mainmenu a:visited {
	color: #CCCCCC;
	text-decoration: none;
}
#mainmenu a:hover {
	color: #FFFFFF;
	text-decoration: underline;
}
#mainmenu a:active {
	color: #FFFF99;
}


/* 4. КАТАЛОГ
------------------------------------------------------------------*/
/* 4.1 Цвета плашек 
------------------------------------------------------------------*/
.item1  {
	background-color: #f9b700;
}
.item2  {
	background-color: #C4C5C8;
}
.item3  {
	background-color: #BD7937;
}
.item4  {
	background-color: #6FCBF3;
}
.item5  {
	background-color: #E9638C;
}
.item6  {
	background-color: #ECE45c;
}
.item7  {
	background-color: #D26A1B;
}



/* 4.2 Каталог на главной странице
------------------------------------------------------------------*/
#maincat {
	height: 200px;
	background:#3D2F15 url(/images/maincat_bottom.jpg) no-repeat bottom;
	padding-bottom: 15px;
	/* Абс позиция чтобы при анимации блок не сносился вниз*/
	position: relative;
}
#maincat li {
	width: 150px;
	height: 200px;
	float: left;
}
#maincat li a   {
	display: block;
	padding-top: 55px;
	padding-left: 9px;
	height: 145px;
	color: #FFFFFF;
	text-decoration: none;
	font: bold 1.1em Arial, Helvetica, sans-serif;
	background-repeat: no-repeat;
	background-position: 154px;
}



/* 4.2.1 Картинки разделов каталога на главной странице
------------------------------------------------------------------*/
#maincat .item1 {
	background-image: url(/images/maincat_kuhni.png);
}
#maincat .item2 {
	background-image: url(/images/maincat_stenki.png);
}
#maincat .item3 {
	background-image: url(/images/maincat_skaf.png);
}

#maincat .item5 {
	background-image: url(/images/maincat_deti.png);
}
#maincat .item6 {
	background-image: url(/images/maincat_comp.png);
}
#maincat .item7 {
	background-image: url(/images/maincat_mebel.jpg);
	background-position: right;
	width: 154px;
	/* Абс позиция чтобы при анимации блок не сносился вниз*/
	position: absolute;
	right: 0px;
}
#maincat .item1 a {
	background-image: url(/images/maincat_kuhni.jpg);
}
#maincat .item2 a {
	background-image: url(/images/maincat_stenki.jpg);
}
#maincat .item3 a {
	background-image: url(/images/maincat_skaf.jpg);
}

#maincat .item5 a {
	background-image: url(/images/maincat_deti.jpg);
}
#maincat .item6 a {
	background-image: url(/images/maincat_comp.jpg);
}
#maincat .item7 a {
	background-image: url(/images/maincat_right.png);
	background-position: right;
}






/* 4.3 Каталог на внутренних страницах
------------------------------------------------------------------*/
#cat {
	height: 77px;
	background: url(/images/maincat_bottom.jpg) no-repeat bottom;
	padding-bottom: 15px;
	clear: both;
}
#cat li {
	height: 77px;
	float: left;
	background-position: right;
}
#cat li a   {
	display: block;
	height: 67px;
	color: #FFFFFF;
	text-decoration: none;
	font: bold 1.1em Arial, Helvetica, sans-serif;
	padding: 10px 0px 0px 9px;
}



/* 4.3.1 Картинки разделов каталога на внутр страницах
------------------------------------------------------------------*/
#cat .item1 {
	background-image: url(/images/cat_kuhni.png);
}
#cat .item2 {
	background-image: url(/images/cat_stenki.png);
}
#cat .item3 {
	background-image: url(/images/cat_skaf.png);
}

#cat .item5 {
	background-image: url(/images/cat_deti.png);
}
#cat .item6 {
	background-image: url(/images/cat_comp.png);
}
#cat .item7 {
	background-image: url(/images/cat_mebel.png);
}
#cat .first {
	background-position: left;
}


/* 4.3.2 Сокращенный (6 плашек) и полный(7 плашек) каталоги
------------------------------------------------------------------*/
.shortcat  li   {
	width: 180px;
}
.fullcat  li   {
	width: 150px;
}



/* 5. Блок информации о модели
------------------------------------------------------------------*/
/*Блок получает фон от класса item# */

#models {
	background-image: url(/images/maincat_bottom.jpg);
	background-repeat: no-repeat;
	background-position: bottom;
	margin-top: 20px;
	padding-bottom: 15px;
}




/* 5.1 Список моделей
-----------------------------------*/
.products {
	width: 220px;
	height: 280px;
	background-image: url(/images/corner-l.png);
	background-repeat: no-repeat;
	background-position: left;
	font-size: 0.95em;
	float: left;
}

.products h1 {
	padding-top: 30px;
	padding-left: 15px;
	font: bold 1.3em Arial, Helvetica, sans-serif;
}
.products ul {
	margin-left: 15px;
	margin-top: 15px;
	height: 180px;
}
.products li {
	width: 50px;
}
.products a:link {
	color: #000000;
	text-decoration: none;
}
.products a:visited {
	color: #333333;
	text-decoration: none;
}
.products a:hover {
	text-decoration: underline;
}
.products a:active {
	color: #FFFFFF;
	text-decoration: none;
}






/* 5.2 Картинки разделов для списка моделей
-----------------------------------*/
#models ul.item1, 
#models ul.item2,
#models ul.item3,
#models ul.item4,
#models ul.item5,
#models ul.item6 {
	background-image: url(/images/ico-kuhni.png); 
	background-repeat: no-repeat;
	background-position: 100px 0px;
	padding-bottom: 15px;
}
#models ul.item1 {
	background-image: url(/images/ico-kuhni.png); 
}
#models ul.item2 {
	background-image: url(/images/ico-stenki.png); 
}
#models ul.item3 {
	background-image: url(/images/ico-skaf.png); 
}
#models ul.item4 {
	background-image: url(/images/ico-deti.png); 
}
#models ul.item5 {
	background-image: url(/images/ico-skola.png); 
}
#models ul.item6 {
	background-image: url(/images/ico-comp.png); 
}


/* 5.3 Блок фотографий модели
-----------------------------------*/
#photos {
	float: left;
	height: 280px;
	position: relative;
}
#photos  div {
	position: absolute;
	bottom: 5px;
	right: 5px;
}
#photos div img{
	float: left;
	border: 1px solid #fff;
	margin-left: 5px;
}
#photos img{
	background: #FFFFFF url(/images/loader.gif) no-repeat center center;
}




/* 5.4 Краткое описание
-----------------------------------*/
.description {
	background: #FFFFFF url(/images/corner-r.png) no-repeat right bottom;
	margin-left: 670px;
	height: 280px;
}
.description h2 {
	font-size: 2em;
	font-weight: normal;
	color: #33260f;
	letter-spacing: -0.05em;
	background: url(/images/corner-r.png) no-repeat right top;
	padding: 20px;
}
.description p {
	margin-right: 20px;
	margin-left: 20px;
	color: #83745a;
	margin-bottom: 10px;
}







/* 6. Содержательная часть
------------------------------------------------------------------*/
#content {
	width: 900px;
	overflow: hidden;
	margin-bottom: 30px;
	margin-top: 10px;
}




/* 6.1 Категории
------------------------------------------------------------------*/
.properties {
	float: left;
	width: 220px;
}
.properties li {
	background: url(/images/properties.png) no-repeat;
	font-size: 1.3em;
	font-weight: normal;
	margin-left: 10px;
}
.properties a {
	display: block;
	padding-top: 25px;
	padding-bottom: 30px;
	padding-left: 80px;
	width: 130px;
	background: no-repeat 5px center;
}
.properties a:link {
	color: #FFFFFF;
	text-decoration: none;
}
.properties a:visited {
	color: #c6b9a2;
	text-decoration: none;
}
.properties a:hover {
	text-decoration: underline;
}
.properties a:active {
	color: #F9B700;
}





/* 6.1.1 Иконки категорий
----------------------------*/
.properties .colorico {
	background-image:url(/images/properties_colors.png);
}
.properties .componentsico {
	background-image:url(/images/properties_comp.png);
}
.properties .designico {
	background-image:url(/images/properties_design.png);
}








/* 6.2 Блок содержания категории
------------------------------------------------------------------*/
.prop_content {
	background: #f4f3ee url(/images/prop_right.png) repeat-y right;
	margin-right: 5px;
	padding: 25px 25px 25px 20px;
	color: #382a12;
	font-size: 0.95em;
	min-height: 200px;
	overflow: hidden;
}
.prop_content h3 {
	font: bold 1.5em Arial, Helvetica, sans-serif;
	margin-bottom: 2em;
}

.bshadow  {
	background: url(/images/maincat_bottom.jpg) no-repeat -230px;
	display: block;
	height: 15px;
	margin-left: 220px;
}
.prop_content a:link {
	color: #382a12;
	text-decoration: underline;
}
.prop_content a:visited {
	color: #685433;
}
.prop_content a:hover {
	color: #685433;
}
.prop_content a:active {
	color: #F9B700;
}






/* 6.2.1 Компоненты
------------------------------------------------------------------*/
#components {
	/* Клиринг */
	overflow: hidden;
	width: 621px;
}
#components  li {
	float: left;
	width: 110px;
	margin-right: 14px;
	margin-bottom: 30px;
	height: 135px;
}
#components .imagebox{
	display: block;
	height: 110px;
}
#components img {
	margin-bottom: 10px;
}
#components span {
	display: block;
}




/* 6.2.2 Подробная информация о компоненте
------------------------------------------------------------------*/
div.info {
	width: 220px;
	border-left: 1px solid #b7b2a7;
	padding-left: 20px;
	float: right;
}
/*#components li.info {
	width: 230px;
	border-left: 1px solid #b7b2a7;
	padding-left: 20px;
	height: auto;
	position: absolute;
	right: 70px;
}*/
.info dt {
	float: left;
	margin-right: 2px;
}
.info dl {
	margin-top: 1em;
}
.info h4 {
	font-size: 1.2em;
	font-weight: bold;
}
.info img{
	background: url(/images/loader.gif) no-repeat center center;
}




/* 6.2.3 Списки цветов
------------------------------------------------------------------
На h4 clear не ставим (он также клирит подменю). 
Чтобы заголовки не обтекались растягиваем на всю ширину ul  */

.colors {
	width: 600px;
	overflow: hidden;
}
.colors li {
	float: left;
	margin-bottom: 1em;
}

h4 {
	font: bold 1.2em Arial, Helvetica, sans-serif;
	margin: 1em auto;
}





/* 7. Простая текстовая страница
------------------------------------------------------------------*/
.text {
	margin-top: 30px;
	margin-right: 100px;
	margin-left: 220px;
}
.text h1 {
	margin-bottom: 1em;
	color: #ffea97;
	text-indent: 5%;
	font: oblique 2.2em Georgia, "Times New Roman", Times, serif;
}
.text h2 {
	margin: 2em 0em;
	color: #ffea97;
	text-indent: 5%;
	font: oblique 1.5em Georgia, "Times New Roman", Times, serif;
}
.text .introduction {
	font-weight: bold;
	font-size: 1.2em;
	color: #FFFFFF;
	border-top: 1px solid #534122;
	border-bottom: 1px solid #534122;
	padding: 1em 0px;
}
.text p {
	margin-bottom: 1em;
	line-height: 1.6em;
	text-indent: 5%;
	color: #eae2d4;
}

.text strong {
	font-weight: bold;
}
.text a:link {
	color: #EAE2D4;
}
.text a:visited {
	color: #bab1a2;
}
.text a:hover {
	color: #FFFFFF;
}
.text a:active {
	color: #FFFF66;
}

/* 7.1 Cтраница новостей
------------------------------------------------------------------*/

.text dt, .text dd {
	text-indent: 5%;
}
.text dt {
	margin: 1em 0em 0.5em;
	padding: 0.5em 0em 1em;
	border-top: 2px solid #534122;
	border-bottom: 1px solid #534122;
	font-size: 0.8em;
	color: #bab1a2;
}
.text dd {
	margin-bottom: 3em;
}
.text dt strong {
	font-size: 1.2em;
	display: block;
	color: #fff;
}

/* 8. Контактная форма
------------------------------------------------------------------*/

.contactform {
	background: #4d3d1f url(/images/formbg.jpg) repeat-x center -52px;
	padding: 4em 0em 0em;
}
.contactform div {
	background: url(/images/formbg.jpg);
	height: 52px;
}
.contactform label {
	width: 100px;
	display: block;
	float: left;
	clear: left;
	margin-left: 15px;
}
.contactform input, .contactform textarea  {
	width: 350px;
	margin-bottom: 1em;
	color: #3B2D14;
	font-family: Tahoma, Arial, Helvetica, sans-serif;
	padding: 4px;
}
.contactform input.send {
	width: 100px;
	margin-left: 115px;
	color: #3B2D14;
	background: #af9b78;
	border-style: none;
}




/* 9. Подвал
------------------------------------------------------------------*/
#foot {
	width:100%;
	border: 1px solid #3D2F15;
	background: #3b2d14 url(/images/bg-bottom.png) repeat-x bottom;

}

#footer {
	margin-bottom: 16px;
	margin-left:160px;
	color: #d1c6a7;
	font-size: 0.95em;
	height: 105px;
	padding-top: 170px;
	padding-left: 300px;
}
#footer address {
	float: left;
	position: relative;
	display: inline;
	margin-right: 200px;
}
/* Выносим телефон перед адресом */
#footer .phone {
	display: block;
	position: absolute;
	top: -40px;
	left: 0px;
	font-size: 1.5em;
	color: #FFFFFF;
	width: 13em;
}
#footer .org  {
	font-weight: bold;
	text-decoration: none;
}
#footer a {
	color: #D1C6A7;
}
/* 9.1 Анимация лампы
-------------------------------------------*/
.lampaon {
	background: url(/images/lampa.jpg) no-repeat left bottom;
}
.lampaoff {
	background: url(/images/lampaoff.jpg) no-repeat left bottom;
}



#dialogWindow {
 

width: 500px; 
height: 1280px; 
background-color: #4d3f25; 
border: 1px dotted gray; 
	 

position: absolute; 
left: 55%; 
top:  28%; 
margin-top: -150px; 
margin-left: -100px; 
	 
clip: rect(auto 300px auto 300px); 
}
 
#dialogWindow1 {
 

width: 500px; 
height: 400px; 
background-color: #4d3f25; 
border: 1px dotted gray; 
	 

position: absolute; 
left: 55%; 
top:  31%; 
margin-top: -150px; 
margin-left: -100px; 
	 
clip: rect(auto 300px auto 300px); 
} 

#dialogWindow2 {
 

width: 500px; 
height: 400px; 
background-color: #4d3f25; 
border: 1px dotted gray; 
	 

position: absolute; 
left: 55%; 
top:  34%; 
margin-top: -150px; 
margin-left: -100px; 
	 
clip: rect(auto 300px auto 300px); 
} 


#dialogWindow3 {
 

width: 500px; 
height: 400px; 
background-color: #4d3f25; 
border: 1px dotted gray; 
	 

position: absolute; 
left: 55%; 
top:  37%; 
margin-top: -150px; 
margin-left: -100px; 
	 
clip: rect(auto 300px auto 300px); 
} 


#dialogWindow4 {
 

width: 500px; 
height: 400px; 
background-color: #4d3f25; 
border: 1px dotted gray; 
	 

position: absolute; 
left: 55%; 
top:  40%; 
margin-top: -150px; 
margin-left: -100px; 
	 
clip: rect(auto 300px auto 300px); 
} 

#dialogWindow5 {
 

width: 500px; 
height: 400px; 
background-color: #4d3f25; 
border: 1px dotted gray; 
	 

position: absolute; 
left: 55%; 
top:  43%; 
margin-top: -150px; 
margin-left: -100px; 
	 
clip: rect(auto 300px auto 300px); 
} 

#dialogWindow6 {
 

width: 500px; 
height: 400px; 
background-color: #4d3f25; 
border: 1px dotted gray; 
	 

position: absolute; 
left: 55%; 
top:  46%; 
margin-top: -150px; 
margin-left: -100px; 
	 
clip: rect(auto 300px auto 300px); 
}

#dialogWindow7 {
 

width: 500px; 
height: 400px; 
background-color: #4d3f25; 
border: 1px dotted gray; 
	 

position: absolute; 
left: 55%; 
top:  49%; 
margin-top: -150px; 
margin-left: -100px; 
	 
clip: rect(auto 300px auto 300px); 
}

#dialogWindow8 {
 

width: 500px; 
height: 400px; 
background-color: #4d3f25; 
border: 1px dotted gray; 
	 

position: absolute; 
left: 55%; 
top:  52%; 
margin-top: -150px; 
margin-left: -100px; 
	 
clip: rect(auto 300px auto 300px); 
}

#dialogWindow9 {
 

width: 500px; 
height: 400px; 
background-color: #4d3f25; 
border: 1px dotted gray; 
	 

position: absolute; 
left: 55%; 
top:  55%; 
margin-top: -150px; 
margin-left: -100px; 
	 
clip: rect(auto 300px auto 300px); 
}

#dialogWindow10 {
 

width: 500px; 
height: 400px; 
background-color: #4d3f25; 
border: 1px dotted gray; 
	 

position: absolute; 
left: 55%; 
top:  58%; 
margin-top: -150px; 
margin-left: -100px; 
	 
clip: rect(auto 300px auto 300px); 
}

#dialogWindow11 {
 

width: 500px; 
height: 400px; 
background-color: #4d3f25; 
border: 1px dotted gray; 
	 

position: absolute; 
left: 55%; 
top:  61%; 
margin-top: -150px; 
margin-left: -100px; 
	 
clip: rect(auto 300px auto 300px); 
}

#dialogWindow12 {
 

width: 500px; 
height: 400px; 
background-color: #4d3f25; 
border: 1px dotted gray; 
	 

position: absolute; 
left: 55%; 
top:  64%; 
margin-top: -150px; 
margin-left: -100px; 
	 
clip: rect(auto 300px auto 300px); 
} 

#dialogWindow13 {
 

width: 500px; 
height: 400px; 
background-color: #4d3f25; 
border: 1px dotted gray; 
	 

position: absolute; 
left: 55%; 
top:  67%; 
margin-top: -150px; 
margin-left: -100px; 
	 
clip: rect(auto 300px auto 300px); 
} 

#dialogWindow25 {
 

width: 500px; 
height: 400px; 
background-color: #4d3f25; 
border: 1px dotted gray; 
	 

position: absolute; 
left: 55%; 
top:  70%; 
margin-top: -150px; 
margin-left: -100px; 
	 
clip: rect(auto 300px auto 300px); 
} 

#dialogWindow14 {
 

width: 500px; 
height: 600px; 
background-color: #4d3f25; 
border: 1px dotted gray; 
	 

position: absolute; 
left: 55%; 
top:  73%; 
margin-top: -150px; 
margin-left: -100px; 
	 
clip: rect(auto 300px auto 300px); 
} 

#dialogWindow15 {
 

width: 500px; 
height: 400px; 
background-color: #4d3f25; 
border: 1px dotted gray; 
	 

position: absolute; 
left: 55%; 
top:  76%; 
margin-top: -150px; 
margin-left: -100px; 
	 
clip: rect(auto 300px auto 300px); 
} 

#dialogWindow16 {
 

width: 500px; 
height: 400px; 
background-color: #4d3f25; 
border: 1px dotted gray; 
	 

position: absolute; 
left: 55%; 
top:  79%; 
margin-top: -150px; 
margin-left: -100px; 
	 
clip: rect(auto 300px auto 300px); 
} 

#dialogWindow24 {
 

width: 500px; 
height: 400px; 
background-color: #4d3f25; 
border: 1px dotted gray; 
	 

position: absolute; 
left: 55%; 
top:  82%; 
margin-top: -150px; 
margin-left: -100px; 
	 
clip: rect(auto 300px auto 300px); 
} 

#dialogWindow17 {
 

width: 500px; 
height: 400px; 
background-color: #4d3f25; 
border: 1px dotted gray; 
	 

position: absolute; 
left: 55%; 
top:  85%; 
margin-top: -150px; 
margin-left: -100px; 
	 
clip: rect(auto 300px auto 300px); 
} 

#dialogWindow18 {
 

width: 500px; 
height: 400px; 
background-color: #4d3f25; 
border: 1px dotted gray; 
	 

position: absolute; 
left: 55%; 
top:  88%; 
margin-top: -150px; 
margin-left: -100px; 
	 
clip: rect(auto 300px auto 300px); 
} 

#dialogWindow19 {
 

width: 500px; 
height: 400px; 
background-color: #4d3f25; 
border: 1px dotted gray; 
	 

position: absolute; 
left: 55%; 
top:  91%; 
margin-top: -150px; 
margin-left: -100px; 
	 
clip: rect(auto 300px auto 300px); 
} 


#dialogWindow26 {
 

width: 500px; 
height: 400px; 
background-color: #4d3f25; 
border: 1px dotted gray; 
	 

position: absolute; 
left: 55%; 
top:  94%; 
margin-top: -150px; 
margin-left: -100px; 
	 
clip: rect(auto 300px auto 300px); 
} 

#dialogWindow20 {
 

width: 500px; 
height: 400px; 
background-color: #4d3f25; 
border: 1px dotted gray; 
	 

position: absolute; 
left: 55%; 
top:  97%; 
margin-top: -150px; 
margin-left: -100px; 
	 
clip: rect(auto 300px auto 300px); 
} 

#dialogWindow21 {
 

width: 500px; 
height: 400px; 
background-color: #4d3f25; 
border: 1px dotted gray; 
	 

position: absolute; 
left: 55%; 
top:  100%; 
margin-top: -150px; 
margin-left: -100px; 
	 
clip: rect(auto 300px auto 300px); 
} 

#dialogWindow22 {
 

width: 500px; 
height: 400px; 
background-color: #4d3f25; 
border: 1px dotted gray; 
	 

position: absolute; 
left: 55%; 
top:  103%; 
margin-top: -150px; 
margin-left: -100px; 
	 
clip: rect(auto 300px auto 300px); 
} 

#dialogWindow23 {
 

width: 500px; 
height: 400px; 
background-color: #4d3f25; 
border: 1px dotted gray; 
	 

position: absolute; 
left: 55%; 
top:  106%; 
margin-top: -150px; 
margin-left: -100px; 
	 
clip: rect(auto 300px auto 300px); 
} 



.dTitle {
font-weight: bold;
	    margin: 0;
	    padding: 5px;
	    background-color: #E7A21F;
	}
	 
	
	 
	.dBody {
	    text-align: center;
	    margin: 0;
	    padding: 10px 5px;
}