/* 
    
    Write the correct CSS selector and style for each section below.  Once you've correctly answered the question, go ahead and comment out your css

    Try to complete all 10 exercises!
    */
/* ⁡⁢⁣⁢Part A⁡ */

/* 1. Element Selector: Make all <p> tags dark gray */
p {
    color:darkgray;
}


/* 2. Class Selector: Give .highlight a yellow background and bold text */
.highlight {
    background-color: yellow;
}

/* 3. ID Selector: Make #unique text green and italic */
#unique {
    color: green;
    font-weight: bold;
}

/* 4. Descendant Selector: Make all <span> inside <div> red */
div span{
    color: red;
}

/* 5. Child Selector:  Make only direct <li> children of <ul> purple. Don't turn the list in Section 7 purple!  - Hint use the id to target only this section*/
ul > li{
    color: purple;
}

/* 6. Grouping Selector: Make h2 and .grouped text teal */
h2,
.grouped{
    color: teal;
}
/* ⁡⁢⁣⁢Part B⁡ */

/* 7. Pseudo-class: Make the first <li> bold. Don't make the list in Section 5 bold!  Hint - use the id to select only this section first*/
#section7 li:first-child{
    font-weight: bold;
}

/* 8. Pseudo-class: Make links orange on hover */
a:hover {
    color: orange;
}

/* 9. Attribute Selector: Style input[type="text"] with a blue border */
input[type="text"] {
    border: 2px solid blue;
}

/* 10. Universal Selector: Apply box-sizing: border-box to all elements */
* {
    box-sizing: border-box;
}