/* element selector score=1 */

p {
    color: red;
    font-size: 50px;
}


/* element selector score also =1, but closer to the tag */

 p {
    color: blue;
}


/* 2 elements - score =2 */

 div p {
    color: green;
}

/* class - score = ? */

.myclass {
    color: cyan;
}

/* element + class - score =? */

 div .myclass {
    color: blueviolet;
}

/*id - score = ?*/

 #myid {
    color: green;
}

/*who wins?*/

 div #myid {
    color: pink;
}

/*who wins?*/

 body div #myid {
    color: blue;
}

/* What if we add a style to the tag itself? */

/*There is another! */

 p {
    color: darkmagenta !important;
}