style.css

/*  EXTERNAL CSS */

body{
    color:#f0f8ff;
    background-color: #8a2be2;
    font-size:50px;
}


/*  Universal Selector  */

/* MARGIN: 0;*/
/* PADDING : 0 */

*{
    color:#8a2be2;
    background-color: aqua;
    font-size: 25px;
}


/* CLASS SELECTOR */

.one{
    color:blue;
    font-size:35px;
    background-color: #8a2be2;
}


/*  ID SELECTOR */

#two{
    background-color: blue;
    color:red;
}


/* PARAGRAPH SELECTOR */

p{
    color:burlywood;
}


/*  GROUP SELECTOR */
#one, ol{
    background-color: blue;
    color:red;
    font-size:25px;
}


.border{
    border: 8px solid black;
    font-size:25px;
    margin:100px;
    padding:100px;
}

h1{
    text-align:center;
    font-size:10px;
    color:#8a2be2;
    text-decoration: underline;
    font-family: 'Courier New', Courier, monospace;
}

p{
    font-size:25px;
    text-align:center;
    font-weight:bold;
    border: 2px dotted black;
}

p:hover{
    border: 7px solid red;
    background-color: yellow;
    color:red;
    font-size:16px;
    text-align:end;
}

.box1{
    background-color: red;
}

.box2{
    background-color: yellow;
}

/* div{
    display:inline-block;
    width:750x;
    padding:10px;
    margin:10px;
    font-size:30px;
} */

span{
    display:block;
}
.item{
    width:100px;
    height:100px;
}
.one{
    background-color: orange;
    border: 2px solid black;
}
.two{
    background-color: white;
    border: 2px solid black;
}
.three{
    background-color: green;
    border: 2px solid black;
}

.container{
    display:flex;
    height:100px;
    justify-content:center;
    flex-direction:row;
    align-items:center;
    border: 2px solid rgb(0, 0, 0);
    height : 500px;
    gap: 50px;
}