/* ---------------------------------------- 
Catalina 
---------------------------------------- */

/* NOTES:

1. DO NOT use width or height properties for any parent-level divs (these are divs you will be adding classes to).
2. Use % over px for sizing interior divs
3. Remember: if you do not give dimention and style to interior divs, we will not see them. By default, divs are invisible.

*/

/* so we can tell that our file is loading */
body {
	background: url(../images/chd5.jpg);
}





div {border: dotted black 2px;}
.co {
	background: ;
}


.corners1 {
	border-style:ridge;
	border-width :20px;
	border-top-color:maroon;
	border-right-color :yellow;
	border-bottom-color:transparent;
	border-left-color:transparent;

}

.corners {
	border-style:ridge;
	border-width :20px;
	border-top-color:transparent;
	border-right-color :transparent;
	border-bottom-color:rgb(100,0,250);
	border-left-color:green;

}




.example1 {
	background-color: black;
	transition:background-color 1s;
}

.example1:hover { 
	background: url(../images/chair2.jpg);
	cursor: pointer;
}

/*active means click*/

.example1:active {
	background: url(../images/chair1.jpg);
}

.example2 {
	background-color: black;
	transition:background-color 1s;
}

.example2:hover { 
	background: url(../images/chair3.jpg);
	cursor: pointer;
}

/*active means click*/

.example2:active {
	background: url(../images/chair2.jpg);
}


.example3 {
	background-color: black;
	transition:background-color 1s;
}

.example3:hover { 
	background: url(../images/chair4.jpg);
	cursor: pointer;
}

/*active means click*/

.example3:active {
	background: url(../images/chair3.jpg);
}

.example4 {
	background-color: black;
	transition:background-color 1s;
}

.example4:hover { 
	background: url(../images/chair1.jpg);
	cursor: pointer;
}

/*active means click*/

.example4:active {
	background: url(../images/chair4.jpg);
}



















/*.example div { 
	background: url(../chair3.png);
	border-radius: 50%;
	width: 100%;
	height: 50%;
	/*transform: rotate(45deg);*/




}