/*Colors*/
/*darkgrey #333A42*/
/*grey #485058*/
/*lightgrey #A6A5A1*/
/*beige #F1ECE9*/
/*Red #D7443F*/


/*THIS IS MY COMMENT*/
/*Hello World*/
/*{ background-color: red; }*/

/* CSS Reset */
* {
  padding: 0;
  margin: 0;
  border: 0;
  box-sizing: border-box;
}




.title {
    
/*    color: #333A42*/
}
/*Body*/
body { 
    background-color: lightslategrey;
    font-family: Arial;
}

/*Container and Main*/
.container { 
    background-color: #fff;
    margin: 0 auto;
    width: 100%; }

/*List Tags*/
ul { ; list-style: none;}

/*Anchor Tags*/
a { 
    color: red;
       
}

a:hover { 
    color: red;
}

a:link  {
  text-decoration: none;
}
 
a:visited 
{
  color: silver;
  text-decoration: none;
}
a:hover {
    text-decoration: underline;
    color: #ff9900;
}

a:active {
    
    text-decoration: none;
}

/*Header Tags*/
h1{ font-family: 'Racing Sans One', cursive;
/*    margin: 0px 0px 0px 280px;*/
    text-align: center;
    font-size: 60px;
  
}

h2{ font-family: 'Racing Sans One', cursive;
    font-size: 30px;
    margin: 10px 0;
    }

/*Paragraph Tag*/
p { font-size: 24px;
    font-family: 'Vast Shadow', cursive;
    margin: 10px 0;
    display: block;
    }
p a:link {
    font-weight: bold;
    color: firebrick;
}

p a:visited  {
    color: firebrick;
}

p a:hover {
    color: orange
}

/*Header Tag*/
header {
    background-color: black;
    padding: 20px 0;}
#logo { 
    margin-bottom: 5px;
    color: #FFF;}

/*Nav Tag*/
nav ul li { 
    color: silver;
    margin: 0 10px; ;
    display: inline-block;
}

/*Main Tag*/
main {
    margin: 20px 0;
    padding: 0 20px;
}
#selfie {
    border-radius: 100%;
border: 4px solid black;}

/*Section Content*/
.content { 
    margin: 20px 100px;
    text-align: center;}

/*Footer Tag*/
footer {
    color: white;
    background-color: black;
    border: inline-block;
padding: 10px 0;}
footer ul li{
    margin: 0 10px;
    display: inline-block;
}  
footer p {
    margin: 0;
}

img {
    height: 500px;
    width: 800px;
    align-content: center; border-color: black}
.copy {
    float: right;
    margin: 10px;
}

p{
    color: black;}
p span {
    color: white;}
p.copy {
    color: white;
}

.social-media {
    margin: 5px;
}
social media img {
    width: 32px; 
    height: 32px;}

/*Contact Page*/

.field {
  font-size: 15px;
  display: block;
  padding: 5px 10px;
  margin: 10px auto;
  border: 1px solid grey;
  border-radius: 3px;
  width: 220px;
}

.button {
  font-size: 14px;
  border: 1px solid grey;
  padding: 5px 10px;
  border-radius: 3px;
}

/*Show which page we are on*/
.active {
    font-weight: bold; 
    text-decoration: underline;}


@media screen and
    (max-width: 768px) {
.container { 
    width: 95%;
    text-align: center;
}

#logo {
    color: firebrick; 
}
}

@media screen and (max-width: 480px) {
    container { width: 95%; }
    .content { text-align: center; margin: 20px 10px; }
    #logo{ color: #D76300; }

}

.custom-select {
    display: inline-block;
    padding: center;
}




