/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */
.container{
    border: 10px solid black
        height: 1306px;
    width: 690px;
    margin:auto;
    background-image: url(graph.png);
    background-position: center;
    background-size: cover; 
}


body{ 
background-image: url(c5358e2db3fbbd9f145a31023be168f8.jpg);

background-position: center;
background-attachment: fixed;
background-size: cover;}


#title {
    color: #000000;
    font-family: "BBH Sans Bartle";
    font-size: 52px;
    border-bottom: 13px dotted #36f385;
    margin-top: 49px;
    text-shadow: 3px 3px 5px pink, -3px -3px 5px rgba(151, 48, 246, 0.7)
    
}

#unicorn{ 
transform: translate( -30px, -10px);
    float: left;
    margin-left: 30px;
}
#one{ 
text-align: center;
font-size: 24px;
font-family: "Gloria Hallelujah";
color: black;
    background-color: yellow;
     text-shadow: 3px 3px 5px #fa8282, -3px -3px 5px rgba(48, 223, 246, 0.7);
}
#two{
    text-align: center;
font-size: 13px;
font-family: "Gloria Hallelujah";
color: black;
    background-color: yellow;
    padding-top: 14px;
    margin-top: -32px;
}
#list{
    font-family: "Bitcount Grid Single";
    background-color: aqua;
    width: 225px;
    border:6px dotted #f937ad;
    margin-top: -16px;
    margin-left: 24px;
    margin-bottom: 165px;
    padding-bottom: 9px;
}
#wow{ 
font-size: 20px;
    margin-left: -39px;
    color:#fe0ed6;
     text-shadow: 3px 3px 5px pink, -3px -3px 5px rgba(151, 48, 246, 0.7);
    border-bottom: solid 2px #f9fa12;
    margin-bottom: 10px;
    
    
}
#music{
 transform: translate(385px,-178px);
    border: groove 6px #a406ff;
}
#song{
    font-family:"Gloria Hallelujah";
    width: 206px;
    transform: translate(390px,-201px);
    background-color: deeppink;
    border: groove 6px #ffff4f;
    
}
#surf{
     transform: translate(352px,-215px);
}

#movies{ 
font-family: "Bitcount Grid SIngle";
    font-size: 30px;
    text-align-last: center;
    transform: translateY(-235px);
    border:double 6px orange;
    background-color: #ff0033;
    margin-left: 25px;
    margin-right: 25px;
     text-shadow: 3px 3px 5px #fa8282, -3px -3px 5px rgba(48, 223, 246, 0.7);
    
}
#me{ 
font-family: "Bitcount Grid SIngle";
    font-size: 16px;
    transform: translateY(-245px);
    border:double 6px orange;
    background-color: rgb(151, 48, 246);
    margin-left: 25px;
    margin-right: 25px;
    width: 335px;
    color:yellow;
}
#social{
    font-family: "Gloria Hallelujah";
    font-size: 16px;
    transform: translate(415px,-462px);
    border:dotted 6px orange;
    background-color: rgb(14, 105, 254);
    text-shadow: 2px 2px 5px rgba(251, 8, 51, 0.83), -2px -2px 5px rgba(151, 48, 246, 0.7);
    width: 216px;
    color:yellow;
    text-align: center;
    padding: 10px;
}
#ig{
     transform: translate(464px,-462px) scale(1.4);
    
}
#tt{ 
transform: translate(311px,-371px) scale(1.41);
}
#tt1{ 
transform: translate(157px,-417px) scale(1.41)
}
#web1{
    
   transform: translate(333px,-985px) scale(1.1);
    width: 319px;
    padding-left: 4px;
    font-family: "Libertinus Keyboard";
    background-color: #ffc252
}