Myprojects/frontend/s-7/index.css

* {
	font-family: "Courier New", monospace;
	font-size: 20px;
}

body{
	background-color: skyblue;

}
/* it is scrolling down not jumping it immidiately more presentable*/
html{
	scroll-behavior: smooth;
}

nav {
	background-color: whitesmoke;

}



div{
	float: right;

}

h1{
	text-align: center;
	font-size: 2rem;
}


section {
	/*view height it will adjust the height of a brwser 100% height*/
	height: 100vh;
	/*all the text has been align in the center all the section in html*/
	text-align: center;

}

h2{
	font-size: 1.5rem;

}


/* this is the example of adjacent sibling selector, selecting 
multiple type selectors,id, classes etc.. slectors must be right beside each other. */

h3 + img {
	height: 300px;
	width: 300px;
	border-radius: 150px;
}

ol{
	list-style-type: none;
	padding: 0;
}

#zuitt-motto {
	letter-spacing: 5px;
}

.offering-item {
	text-transform: uppercase;
}

/* the white space between the class is called descendant selector, 
the .bootcamp-offering-list is the parent and the li is the child. */

.bootcamp-offering-list li{
	color: #075966;
}

/*general sibling selector is being used. the other achor tag was not included in the 
style because they have different parent and h2 and a has the same parent */
h2 ~ a, a {
	text-decoration: none;
}

.modules {
	letter-spacing: 3px;
}