body{
    background-color: rgb(2, 38, 103);
    color:rgb(11, 10, 11);
 
    font-family: Helvetica, sans-serif;

}

.menu-container {
   border-bottom:1px solid #03245e ;

}
li > a {
    color:rgba(253, 254, 255, 0.723);
    text-decoration: none;
}

.crumb-list{
    display: flex;
    list-style-type: none;


}

.crumbs {
    padding:10px;
}

.Nav-Text {
    text-align: center;
    font-family: Arial;
    position: relative;
    top:-25px;
    color:rgba(221, 228, 255, 0.894);
}

img {
    max-height: 600px;
}

.banner-container{
    color:white;
    background-image: url('images/Psy-banner3.png');
    width: 100%;
    height:20.5em;
    background-size: cover;
    background-position: center center;
    box-shadow: 10px 0px 5px #000000;
    padding-bottom: 80px;


}


.lightning-icon-container {
    background: rgb(119, 93, 147);
    display: flex;
    justify-content: center;
    box-shadow: 10px 0px 5px #000000;
    padding:20px;

}

h1{
    font-family: Roboto;
    text-transform: uppercase;
    font-size: 3.4em;
    font-style: italic;    
}
h2  {
    font-size: 2.5pem;
    text-decoration:rgb(50, 69, 145) underline;
    text-decoration-thickness: 5px;
}

p {
    font-family: 'Times New Roman', Times, serif;
    font-size: 22px;
    line-height: 1.5 ;
    color:#748085
}



.section-container{
    background-color: rgb(5, 1, 7);
    color:white;
    padding:4px;
    box-shadow: 10px 5px 5px #000000;
    display:flex;
    flex-direction: row;
    justify-content: flex-end;
    border-radius: 2%;
    background-size: 150px;
    width:100%;
    padding-top: 80px;
    padding-bottom: 80px;


}


.header-and-paragraph{
    margin-right: auto;
    width: 30%;
    padding: 8px;
}

.header-and-paragraph-2 {
    width: 32%;
    margin: 0;
    padding:8px;

}


.header-and-paragraph > h2 {
    font-size: 50px;
}

.header-and-paragraph-2 > h2 {
    font-size: 50px;
}

.flex-half-pic{
    background:
    url("./images/psy-pic.png");
    background-size: cover;
    background-position: center center;
    width:32%;
    padding: 8px;
    /* height:400px; */
}


.section-container > img {
    max-width: 30%;
    border-radius: 7%;
    margin-left: auto;
    
}

.headphones-container {
    background: rgb(119, 93, 147);
    display: flex;
    justify-content: center;
    /* box-shadow: 10px 5px 5px #23035e; */

}


.smaller-banner-container {
    width:100%;
    box-shadow: 10px 5px 5px #000000;
    background-image: linear-gradient(rgba(0,0,0,.3), rgba(23, 62, 255, 0.7))
    ,url("./images/faders-pic-2.JPG");
    background-size: cover;
    height:380px;
    padding-top: 80px;
    padding-bottom: 80px;


}

.music-icon-container{
    justify-content: center;
    /* background:linear-gradient(rgb(23, 0, 46), rgb(33, 3, 99)); */
    background-color: rgb(5, 1, 7);

    box-shadow: 10px 5px 5px #000000;

    display: flex;
    height: 380px;

}


.collab-container{
    color:white;
    background-color: rgb(5, 1, 7);
}

.collab-header {
    font-size: 3.4em;
}

.triple-pic-section{
    max-height: 380px;
    background-color: rgb(5, 1, 7);
    color:white;
    padding:7px;
    box-shadow: 10px 5px 5px #000000;
    display:flex;
    flex-direction: row;
    justify-content:flex-end;
    flex-wrap: wrap;
    border-radius: 2%;
    background-size: 200px;
    flex-shrink: 0;
    overflow: auto;
    padding-top: 80px;
    padding-bottom: 80px;


}

.triple-pic-section > img {
    width: 32%;
}

input[type=text] {
    width: 100%;
    padding: 12px 20px;
    margin: 8px 0;
    box-sizing: border-box;
  }


  input[type=email] {
    width: 100%;
    padding: 12px 20px;
    margin: 8px 0;
    box-sizing: border-box;
  }

textarea {
    width:100%;
    height: 4.3em;
}



.newsletter-header{
    text-align: center;
    color: white;
}


.email-form{
    border: #0e354f15 2px solid;
    padding: 10px;
    background-color: rgba(104, 112, 118, 0.579);
    box-shadow: 10px 0px 5px #000000;
    color:rgb(255, 255, 255);
    height: 380px;
    padding-top: 40px;
    padding-bottom: 80px;

}    

.sound-icon-container {
    background-color: rgb(5, 1, 7);
    display: flex;
    justify-content: center;
    height: 380px;
    box-shadow: 10px 5px 5px #000000;
    padding-top: 80px;
    padding-bottom: 80px;


}


.footer-container {
    color:white;
    width: 100%;
    height: 70px;
    background-color: rgb(5, 1, 7);
    box-shadow: 10px 5px 5px #000000;
    position: relative;
    clear: both; 
    padding-bottom: 40px;
    display: inline;


}

.ig-logo {
    float:right;
    max-width: 5%;
}

aside > a {
    color:white;
}


@media (max-width: 1200px) {
    .banner-container {
        height: 12.3em;
    }

}
@media (max-width: 700px) {
    .section-container {
      flex-direction: column;
      overflow:auto ;
      height: 48em;
      height:100%;
      
    }


    .header-and-paragraph {
        font-size: 88px;
        width: 95%;
    }
    .header-and-paragraph-2 {
        width:95%;
    }

    h2{
        font-size: 50px;
    }

    p {
        line-height: 1;
    }

    .section-container > img {
        width:100%;

    }
    .flex-half-pic{
        display:none;
    }
    .banner-heading{
        font-size: 300%;
    }
    
    .triple-pic-section{
        display: none;
    }

    .banner-container{
        height:5em;
    }

  }