.home{
    background: #000;
}

footer{
    padding-top: 20px;
    display: flex;
    color: #BEBEBE;
    width: 100%;
    height: 150px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    
}

footer p{
    font-family: "proxima-nova", sans-serif;
    font-weight: 400;
    font-style: normal;
    line-height: normal;
    font-size: 15px;
    margin: 0px;
}

footer p a{
    text-decoration: none;
    color: #BEBEBE;
    text-decoration: underline;
}

a{
    text-decoration: none;
}

nav{
    display: flex;
    padding: 0px 20px;
    justify-content: space-between;
    align-items: center;    
    z-index: 1;
}
nav a{
    text-decoration: none;
    color: #BEBEBE;
    font-family: "proxima-nova", sans-serif;
    font-weight: 700;
    font-style: normal;
    line-height: normal;
    font-size: 32px;
}

nav a:hover {
    color: white;
  }
  

.nav-interior{
    display: flex;
    align-items: center;
    gap: 80px;
}

.quickscroll{
    color: white;
    font-family: "acumin-pro", sans-serif;
    font-size: 40px;
    font-style: normal;
    font-weight: 750;
    line-height: 100px;
    letter-spacing: -2px;
    position: absolute;
    top: 600px;
    right: 20px;
    z-index:5;
}

.quickscroll:hover{
    color: red;
}

.home-arnold{
    font-family: "acumin-pro", sans-serif;
    font-style: normal;
    color: #FFF;
    font-size: 175px;
    font-weight: 950;
    line-height: 80%; 
    letter-spacing: -8px;

}

.home-legacy{
    color: #D0D0D0;
    font-family: "acumin-pro", sans-serif;
    font-size: 128px;
    font-style: normal;
    font-weight: 950;
    line-height: 100px;
    letter-spacing: -5.12px;
    width: 800px;
}

.homepageimage{
    width: 1200px;
    position: absolute;
    top: -300px;
    right: 0;
    z-index:0;
    clip-path: inset(400px 0 0 0);
}

.scroll{
    display: flex;
    flex-direction: row;
    gap: 80px;
    overflow-x: auto;
    margin-top: 700px;
    margin-left: auto;
    margin-right: auto;

}

.scroll::-webkit-scrollbar {
    height: 5px;
  }
  
  .scroll::-webkit-scrollbar-thumb {
    background-color: gray;
  }

.card{
    display: flex;
    flex-direction: column;
    text-align: center;
}

.card img{
    height: 600px;
}

.card p{
    color: #FFF;
    font-size: 15px;
    font-family: "interstate", sans-serif;
    font-weight: 500;
    font-style: normal;
    line-height: normal;
    letter-spacing: -0.96px;
    margin: 0;
    margin-bottom: 5px;
}

.card h2{
    color: #7B7BFF;
    font-family: "acumin-pro", sans-serif;
    font-size: 50px;
    font-style: normal;
    font-weight: 950;
    line-height: normal;
    letter-spacing: -3px;
    margin: 0px;
}


/* body building page styling */

.bodybuildingpage{
    background: #212121;
}

.bodybuildingpage .blockoftext h1{
    color: #D32F2F;
    font-family: "acumin-pro", sans-serif;
    font-size: 96px;
    font-style: normal;
    font-weight: 950;
    line-height: 90px;
    margin-bottom: 0;
    letter-spacing: -3px;
}

.bodybuilding{
    width: 1076px;
    margin: auto;
}

.blockoftext p{
    font-family: "interstate", sans-serif;
    color: #FFF;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    width: 649px;
}

.body-bodybuilding{
    width: 315px;
    height: 436px;
    object-fit: cover;
    padding-top: 50px;
    padding-left: 30px;
}

.bodybuilding > .container{
    display: flex;
    flex-direction: row;
}

.body-powerlifting{
    width: 538px;
    height: 418px;
    object-fit: cover;
}

.bodybuilding > .container:nth-of-type(2) > .blockoftext {
    padding-left: 50px;
    width: 20%;
}

.body-personalrecords{
    width: 527px;
    height: 482px;
    object-fit: cover;
    object-position: center top;
}

.bodybuilding > .container:nth-of-type(3) > .blockoftext{
    margin: 0;
    width: 50%;
}

.bodybuilding > .container:nth-of-type(3) > .blockoftext > div > li{
    font-family: "interstate", sans-serif;
    color: #FFF;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    width: 649px;
}

.bodybuilding > .container:nth-of-type(3) > .blockoftext > div{
    padding-top: 20px;
}

.body-MrOlympia{
    width: 538px;
    height: 583.585px;
    object-fit: cover;
}

.bodybuilding > .container:nth-of-type(4) > .blockoftext{
    padding-left: 50px;
}


/* acting page styling */

.actingpage{
    background: #2C2C54;
}

.acting{
    width: 1076px;
    margin: auto;
}

.actingpage .blockoftext h1{
    color: #F8B400;
    font-family: "acumin-pro", sans-serif;
    font-size: 96px;
    font-style: normal;
    font-weight: 950;
    line-height: 90px;
    margin-bottom: 0;
    letter-spacing: -3px;
}

.acting > .container{
    display: flex;
    flex-direction: row;
}

.acting-terminator{
    width: 538px;
    height: 436px;
    object-fit: cover;
    padding-top: 80px;
    padding-left: 30px;
}

.acting-1980s{
    width: 426px;
    height: 522px;
    padding-right: 80px;
    padding-top: 30px;
}

.acting > .container:nth-of-type(2) > .blockoftext > h1{
    margin-top: 0;
}

.acting-1990s{
    width: 650px;
    height: 416px;
    object-fit: cover;
    padding-top: 90px;
}

.acting > .container:nth-of-type(3){
    margin-top: 30px;
}

.acting > .container:nth-of-type(3) > .blockoftext > p{
    width: 500px;
    overflow-wrap: break-word;
    padding-right: 20px;
}

.acting > .container:nth-of-type(2) {
   margin-top: 55px;
}

.acting > .container:nth-of-type(3) > .blockoftext > h1{
    margin-top: 0;
}



/* political page styling */

.politicalpage{
    background: #2A3A5E;
}

.political{
    width: 1076px;
    margin: auto;
}

.politicalpage .blockoftext h1{
    color: #D32F2F;
    font-family: "acumin-pro", sans-serif;
    font-size: 96px;
    font-style: normal;
    font-weight: 950;
    line-height: 90px;
    margin-bottom: 0;
    letter-spacing: -3px;
}

.political > .container{
    display: flex;
    flex-direction: row;
}

.political-career{
    width: 558px;
    height: 533px;
    object-fit: cover;
    padding-top: 80px;
    padding-left: 30px;
}

.political-governor{
    object-fit: cover;
    width: 529px;
    height: 438px;
    padding-right: 40px;
    padding-top: 30px;
}

.political-view{
    width: 539px;
    height: 411px;
    object-fit: cover;
    padding-left: 40px;
    padding-top: 200px;
}

.political > .container:nth-of-type(3) > .blockoftext > h1{
    margin-top: 0;
}

.political > .container:nth-of-type(1) > .blockoftext > p {
    width: 550px;
}

.political > .container:nth-of-type(3) > .blockoftext > p {
    width: 550px;
}

.political > .container:nth-of-type(2) > .blockoftext > p {
    width: 600px;
}

.political > .container:nth-of-type(4) > .blockoftext > p {
    width: 600px;
}

.political > .container:nth-of-type(4) > .blockoftext > h1{
    margin-top: 0;
}


.political-action{
    width: 529px;
    height: 411px;
    object-fit: cover;
    padding-right: 40px;
    padding-top: 100px;
}

.political > .container:nth-of-type(2) {
    margin-top: 60px;
}


@media (max-width: 1000px) {


    .quickscroll{
        display: none;
    }

    footer{
        height: 50px;
    }

    footer p{
        font-size: 8px;
    }

    nav{
        flex-wrap: wrap;
        width: 315px;
        margin: auto;
    }

    nav a{
        font-size: 10px;
    }

    .nav-interior{
        flex-direction: column;
        gap: 0px;
    }

    .homecontainer{
        display: flex;
        flex-direction: column;
        margin-top: 50px;
    }

    .homepageimage{
        display: none;
    }

    .home-arnold{
        font-size: 40px;
        letter-spacing: -0px;
        margin: auto;
        margin-bottom: 20px;
    }

    .home-legacy{
        font-size: 30px;
        letter-spacing: -0px;
        width: auto;
        line-height: 30px;
        margin: auto;
    }

    .scroll{
        margin-top: 100px;
        width: 315px;
    }

    .card img{
        height: 400px;
    }
    
    .card p{
        color: #FFF;
        font-size: 10px;
        font-family: "interstate", sans-serif;
        font-weight: 500;
        font-style: normal;
        line-height: normal;
        letter-spacing: -0.96px;
        margin: 0;
        margin-bottom: 5px;
    }
    
    .card h2{
        color: #7B7BFF;
        font-family: "acumin-pro", sans-serif;
        font-size: 20px;
        font-style: normal;
        font-weight: 950;
        line-height: normal;
        letter-spacing: -1px;
        margin: 0px;
    }

    /* body building page styling */

.bodybuildingpage{
    background: #212121;
}

.bodybuildingpage .blockoftext h1{
    color: #D32F2F;
    font-family: "acumin-pro", sans-serif;
    font-size: 30px;
    font-style: normal;
    font-weight: 950;
    line-height: 90px;
    margin-bottom: -20px;
    letter-spacing: -1px;
}

.bodybuilding{
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    width: 315px;
}

.blockoftext p{
    font-family: "interstate", sans-serif;
    color: #FFF;
    font-size: 10px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    width: auto;
}

.body-bodybuilding{
    width: 315px;
    object-fit: cover;
    padding-top: 0px;
    padding-left: 0px;
}

.bodybuilding > .container{
    display: flex;
    flex-direction: column;
}


.bodybuilding > .container:nth-of-type(2){
    flex-direction: column-reverse;
}

.body-powerlifting{
    width: 315px;
    height: auto;
    object-fit: cover;
}

.bodybuilding > .container:nth-of-type(2) > .blockoftext {
    padding-left: 0px;
    width: auto;
}

.body-personalrecords{
    width: 315px;
    height: auto;
    object-fit: cover;
    object-position: center top;
}

.bodybuilding > .container:nth-of-type(3) > .blockoftext{
    margin: 0;
    margin-bottom: 10px;
    width: auto;
}

.bodybuilding > .container:nth-of-type(3) > .blockoftext > div > li{
    font-family: "interstate", sans-serif;
    color: #FFF;
    font-size: 10px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    width: auto;
}

.bodybuilding > .container:nth-of-type(3) > .blockoftext > div{
    padding-top: 0px;
}

.body-MrOlympia{
    width: 315px;
    height: auto;
    object-fit: cover;
}

.bodybuilding > .container:nth-of-type(4) > .blockoftext{
    padding-left: 0px;
}

.bodybuilding > .container:nth-of-type(4){
    flex-direction: column-reverse;
}


/* acting page styling */

.actingpage{
    background: #2C2C54;
}

.acting{
    width: 315px;
    margin: auto;
}

.actingpage .blockoftext h1{
    color: #F8B400;
    font-family: "acumin-pro", sans-serif;
    font-size: 30px;
    font-style: normal;
    font-weight: 950;
    line-height: 90px;
    margin-bottom: -20px;
    letter-spacing: -1px;
}

.acting > .container{
    display: flex;
    flex-direction: column;
}

.acting > .container:nth-of-type(2){
    flex-direction: column-reverse;
}

.acting-terminator{
    width: 315px;
    height: auto;
    object-fit: cover;
    padding-top: 0px;
    padding-left: 0px;
}

.acting-1980s{
    width: 315px;
    height: auto;
    padding-right: 0px;
    padding-top: 0px;
}

.acting > .container:nth-of-type(2) > .blockoftext > h1{
    margin-top: 20px;
}

.acting-1990s{
    width: 315px;
    height: auto;
    object-fit: cover;
    padding-top: 0px;
}

.acting > .container:nth-of-type(3){
    margin-top: 0px;
}

.acting > .container:nth-of-type(3) > .blockoftext > p{
    width: auto;
    padding-right: 0px;
}

.acting > .container:nth-of-type(3) > .blockoftext > h1{
    margin-top: 20px;
}

.acting > .container:nth-of-type(2) {
    margin-top: 0px;
 }


/* political page styling */

.political > .container:nth-of-type(2){
    flex-direction: column-reverse;
}

.political > .container:nth-of-type(4){
    flex-direction: column-reverse;
}

.politicalpage{
    background: #2A3A5E;
}

.political{
    width: 315px;
    margin: auto;
}

.politicalpage .blockoftext h1{
    color: #D32F2F;
    font-family: "acumin-pro", sans-serif;
    font-size: 30px;
    font-style: normal;
    font-weight: 950;
    line-height:30px;
    margin-bottom: 15px;
    letter-spacing: -1px;
    margin-top: 50px;
}

.political > .container{
    display: flex;
    flex-direction: column;
}

.political-career{
    width: 315px;
    height: auto;
    object-fit: cover;
    padding-top: 0px;
    padding-left: 0px;
}

.political-governor{
    object-fit: cover;
    width: 315px;
    height: auto;
    padding-right: 0px;
    padding-top: 0px;
}

.political-view{
    width: 315px;
    height: auto;
    object-fit: cover;
    padding-left: 0px;
    padding-top: 0px;
}

.political > .container:nth-of-type(3) > .blockoftext > h1{
    margin-top: 50px;
}

.political > .container:nth-of-type(4) > .blockoftext > h1{
    margin-top: 50px;
}

.political-action{
    width: 315px;
    height: auto;
    object-fit: cover;
    padding-right: 0px;
    padding-top: 0px;
}


.political > .container:nth-of-type(1) > .blockoftext > p {
    width: 315px;
}

.political > .container:nth-of-type(3) > .blockoftext > p {
    width: 315px;
}

.political > .container:nth-of-type(2) > .blockoftext > p {
    width: 315px;
}

.political > .container:nth-of-type(4) > .blockoftext > p {
    width: 315px;
}

.political > .container:nth-of-type(2) {
    margin-top: 0px;
}

}