/*
Rajia M. Abdelaziz, Rajia.Abdelaziz@gmail.com, UMass Lowell Undergraduate 
    Enrolled in 91.461 GUI Programming
Created by RMA on December 6, 2015 at 3:15 PM
Last Updated: 12/06/15 at 3:15 p.m

This is an external style sheet created to allow assignment 9 to have an 
appealing style. 
*/

/*
All the h1 headers should use a unique font from Google and should be aligned 
in the center of the page. h1's should also have a white color with a purple
background. 
*/
h1
{
    font-family: 'Slabo 27px', serif;
    text-align: center;
    font-size: 40px;
    color: white;
    background-color: purple;    
}

/*h2 headers should have a light purple border to seperate important content */
h2
{
    font-family: 'Slabo 27px', serif;
    border-bottom: 2px solid #BF5FFF;
}

/* Labels should be bold and alligned to the left! The labels of the text should
be purple*/
.label{
    color: purple;
    font-weight: bold;
    text-align: left;
}

/* Divs should use a unique Google font and have a 5% margin on the left*/
div{
    font-family: 'Slabo 27px', serif;
    margin-left: 5%;
}

/*Table headers should have a purple background and white font*/
th{
    text-align: center;
    height: 50px; 
    background-color: purple;
    color: white;
}

table{
    text-align: center;
    margin: 0 auto;

}

#scrabble_board{
    margin: 0 auto;
}


/*Styling the Tiles on the board differently to indicate which values they have*/
/*I got these images from https://www.google.com/search?q=scrabble+triple+word+score+image+50px+50px&espv=2&biw=1049&bih=703&source=lnms&tbm=isch&sa=X&sqi=2&ved=0ahUKEwijltj_6czJAhUJKiYKHcrdBMIQ_AUIBigB#tbm=isch&q=scrabble+triple+word+score+image+&imgrc=LaLjqLsbov_W7M%3A*/
.triple_letter {
  background-color: blue;
  background-image: url("./board/triple_letter.png");
}

.double_letter {
  background-color: #00CCFF; 
  background-image: url("./board/double_letter.jpg");
}
.double_word {
  background-color: pink;
  background-image: url("./board/double_word.jpg");
}

.triple_word {
  background-color: red;
    background-image: url("./board/triple_word.png");
}

.star {
  background-color: gold;
  background-image: url("./board/star.png")
}

td {
  background: tan;
  z-index: 3;  
  border: solid 2px white;
  height: 50px;
  width: 50px;
}

/*Style paragraphs with a purple color.*/
p{
    color: purple;
}

/*Style paragraphs showing the content of the assignment that was completed in green.*/
.completed{
    color: green;
}