/* ---------------------------------------- 
Tiff
---------------------------------------- */

/* 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-color: rgb(255,245,0);
}

/* only doing this so i can see the structure */
div { border: dotted gray 1px; }

.th2 {
	background: rgb(255,100,150);
	opacity: 0.5;
}

.corners {
	opacity: 1;
	border-style: ridge;
	border-width: 30px;
	border-top-color: white;
	border-right-color: yellow;
	border-bottom-color: transparent;
	border-left-color: transparent;
}

.corners div {
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 100px 100px 100px;
	border-color: transparent transparent #007bff transparent;
}

.example {
	background-color: red;
	transform: rotate(45deg);
	transition: transform 5s;
}

.example:hover { 
	cursor: pointer;
	background-color: blue;
	transform: rotate(15deg);
}

.example:active {
	background: url(../images/pattern.jpg);
	background-attachment: fixed;
}

.example div { 
	background: url(../images/pattern.jpg);
	border-radius: 50%;
	width: 100%;
	height: 100%;
	transform: rotate(45deg);
	margin-top: 0%;
	background-repeat: no-repeat;
	background-position: center;	
}