body {
	background-color: hsla(180, 100%, 50%, 1.0);
	/*hue,saturation,lightness and alpha*/
	font-size: 100%;
	font-family: Arial, Verdana, sans-serif;
}
@media (min-width: 700px) and (max-width: 1100px){
	body {
		font-size: 80%;
		background-color: white;
	}
}

h1.test1 {
	color: red;
	background-color:  green;
	font-family: helvetica;
	font-size: 40px;
	text-transform: uppercase;
	letter-spacing: 0.10em;
	text-align: center;
}

.mainpage{
	background-color: #FFE62E;
	color: black;
	font-size: 20px;
	font-family: helvetica Ariel sans-serif;
	letter-spacing: .5px;
	text-align: center;
	display: inline-block;
	border: 5px dashed darkblue ;
	margin: 20px auto 20px 25%;
	padding: 5px;
	height: 30px;
	width: 130px;
	box-sizing: content-box;
}

.mainpage:hover {
	text-decoration: underline;
}

.press {
	text-align: center;
	color: red;
	background-color: black;
	border: 20px solid darkblue;
	margin: 1px auto 5px auto ;
	padding: 10px;
	border-width: 10px;
	font-size: 20px;
	display: block;
	width: 80px;
	height: 80px;
	box-shadow: 5px 5px 5px 1px steelblue,
		7.5px 7.5px 5px 1.25px red,
		10px 10px 5px 1.5px green;
	border-radius: 80px;		
}

h4.press:first-letter{
	font-size: 200%;
}

h4.press:first-line {
	font-weight: bold;
}

section>ul>li>a {
	text-decoration: none;
	color: red !important;
	background-color: black;
	border: 1px solid darkblue;
	padding: 5px 10px 5px 10px;
	display: block;
	margin-bottom: 1px;
	text-align: left;
	font-size: 1.3em;
}

div>ul>li>a:link {
	color: deeppink;
	background-color: black;
	font-size: 20px;
	text-decoration: none;
	display: block;
	border: 1px solid rgb(50, 110, 90);

}

div>ul>li>a:visited{
	background-color: skyblue;
	color: mediumvioletred;
	border: 1px solid black;
}

div>ul>li>a:hover { 
	color: yellow;
	background-color: darkblue;
}

div>ul>li>a:active{
	background-color: green;
	color: black;
}

#section1, #section2 {
	text-decoration: underline;
	color: rgba(0, 0, 255, .8);
	background-color: yellow;
	text-shadow: 1px 1px .5px pink;
	font-weight: bold;
	font-style: italic;
	word-spacing: 0.2em;
	text-align: left;
	margin-top: 10px;
	border-top-style : dotted;
	border-left-style: dashed;
	border-right-style: double;
	border-bottom-style: outset;
	border-color: red darkblue black darkcyan ;

}

#section3, #section4{
	background-color: hsla(150, 90%, 35%, .9);
	line-height: 1.4em;
	word-spacing: .15em;
	max-width: 1500px;
	max-height: 100px;
	overflow: auto;
	margin-top: 20px;
	border-style: dotted double solid dashed;
	border-color: #730101 #061355 #E8E500 #007600;
}
 
.borderimg {
	text-align: center;
	font-size: 25px;
	background-color: deeppink;
	color: rgba(10, 10, 230, 1.0);
	font-weight: bold;
	border: 10px solid transparent;
	border-image: url(border.png) 30 round;
}

#backgroundtest {
	height: 300px;
	width: 1333px;
	background-color: blue;
	background-image: url(cars.png);
	background-repeat: no-repeat;
	background-position: top center;
	/*we can use just background: ;*/
}



/*Extra Codes;
*{is mean everthing, include every child}
vertical-align: ;
text-indent: ;
:focus
p[class...n7]
min-widht: ;
max-widht: ;
min-height: ;
max-height: ;
overflow: hidden;
overflow: scroll;
border-style: groove,ridge,outset;
visibility: hidden,visible;
border-image: ;
I will countinue from page 5
*/