body {

	background-color:lightblue;
	color:white;
	text-align:center;
	margin:50px 100px;
}

.rtl {
	text-align:right;
	direction:rtl;
}

.ltr {
	text-align:left;
	direction:ltr;
}

.container {

	min-width: 500px;
	max-width: 800px;
}
.header {
	padding:5px 30px 5px 30px;
	background-color:lightcoral;
	border: 1px solid;
	color:white;
	border:1px solid white;
	border-radius: 25px 25px 0 0 ;
}
.content {
	border:0 solid white;
	border-width:0 1px 0 1px;
	padding:30px;
	background:white;
	color:lightcoral;
	margin:0;
}
.footer {
	border:1px solid white;
	background-color:lightblue;
	color:lightcoral;
	border-radius:0 0 25px 25px;
}

a 		{color: deeppink;}
a:hover 	{color: red;}
a:visited 	{color:lightpink;}

/**************************************
Color Picker:
https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Colors/Color_picker_tool
CSS patterns:
http://lea.verou.me/css3patterns/

lightcoral: 240 128 128
lightblue:  173 216 230
**************************************/
.pattern1 
{
background-color:lightblue;
background-image: radial-gradient(lightcoral 15%, transparent 16%),
radial-gradient(lightcoral 15%, transparent 16%);
background-size:60px 60px;
background-position: 0 0, 30px 30px;
}
.pattern2
{
background-color:lightblue;
background-image: linear-gradient(90deg, rgba(240,128,128,.5) 50%, transparent 50%),
linear-gradient(rgba(255,255,255,.5) 50%, transparent 50%);
background-size:50px 50px;
}
.pattern3
{
background-color: lightblue;
background-image:
repeating-linear-gradient(120deg, rgba(255,255,255,.1), rgba(255,255,255,.1) 1px, transparent 1px, transparent 60px),
repeating-linear-gradient(60deg, rgba(255,255,255,.1), rgba(255,255,255,.1) 1px, transparent 1px, transparent 60px),
linear-gradient(60deg, rgba(0,0,0,.1) 25%, transparent 25%, transparent 75%, rgba(0,0,0,.1) 75%, rgba(0,0,0,.1)),
linear-gradient(120deg, rgba(0,0,0,.1) 25%, transparent 25%, transparent 75%, rgba(0,0,0,.1) 75%, rgba(0,0,0,.1));
background-size: 70px 120px;
}

