*   {   margin: 0;
                padding: 0;
                box-sizing: border-box;
                transition: ease-in-out 0.5s;
        }

        .prvid {
                margin: 0rem 2rem 0rem 2rem;
                aspect-ratio: 16 / 9 !important;
                width: 100% !important;
            }


        @font-face{src: url(fonts/CormorantGaramond-Bold.otf);
            font-family: Garamond-Bold;  }

        @font-face{src: url(fonts/GaramondPremrPro-It.otf);
            font-family: Garamond-Italic;  }

        @font-face{src: url(fonts/CormorantGaramond-Regular.otf);
            font-family: Garamond-Regular;  }

        @font-face{src: url(fonts//CormorantGaramond-Medium.otf);
            font-family: Garamond-Medium;  }


                ul {
                    list-style: none;
                }

                li {
                    padding: 0;
                    margin: 0;
                }

                a:link{ text-decoration: none;
                        color: #fff;
                }



                .pageFrame  {
                    margin: auto;
                }

        
        .mainBody {
            margin: auto;
        }
                

        .headerTitles {
            margin-top: 2rem;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 10;
            width: 100%;
        }

        .headerTitles ul {
            position: relative;
            text-align: center;
      
        }

        .headerTitles ul a li  {
            display: inline;
            margin: auto;
            text-align: center;
            padding: 2rem;
            font-family: Garamond-Bold;
            font-size: 1.1rem;
            color: #2C2C2C;
        }

        .heroImage {
            position: relative;
            z-index: -10;
            display: flex;
            margin: auto;
            width: 100%;
            height: 100vh;
            box-sizing: border-box;
            overflow: hidden;
            background-size: cover;
            background-repeat: no-repeat;
        }

        .latestEpisodes {
            margin: 4rem auto;
            display: flex;
            justify-content: center;
        }


        .previousEpisodes {
            margin: 4rem auto;
            display: flex;
            justify-content: center;
            flex-direction: column;
            width: 60%;
        }

        .previousEpisodes .podTitle {
            text-align: center;
            margin: 2rem auto;
        }


        .headingSection {
            margin-bottom: 4rem;
        }


        .gradientLeft {
            height: 85%;
            width: 350px;
            background-image: linear-gradient(to right, rgb(28,130,214), rgba(0,0,0,0));
            position: absolute;
            padding: 3rem;
            left: 0;
            z-index: 10;
        }

        .gradientRight {
            height: 85%;
            width: 35%;
            background-image: linear-gradient(to left, rgb(28,130,214), rgba(0,0,0,0));
            position: absolute;
            padding: 3rem;
            right: 0;
            z-index: 10;
        }



        .connecting {
            font-family: Garamond-Bold;
            font-size: 1rem;
        }

        .icons ul {
            margin-top: 1rem;
            display: flex;
        }
        

        h1  {
            font-size: 3rem;
            font-family: Garamond-Medium;
            color: #1C82D6;
            text-transform: uppercase;
        }

        h2  {
            font-size: 3rem;
            padding-top: 2rem;
            font-family: Garamond-Medium;
            color: #1C82D6;
            text-align: center;
            margin: auto;
            text-transform: uppercase;
        }

        hr {
            width: 90%;
            margin: auto;
            border: #FDD3A4 solid 2px;
            border-radius: 15px;
        }


        .aboutHarttoPort {
            margin: auto;
            width: 90%;
        }




        .aboutUS {
            font-family: Garamond-Regular;
            font-size: 1.5rem;
            color: #2C2C2C;
            padding: 2rem;
            text-align: center;
        }


        p {
            font-family: Garamond-Regular;
            font-size: 1rem;
        }

        h6 {
            font-family: Garamond-Bold;
            font-size: 1rem;
            color: #1C82D6;
            
        }

        .authorBoxesMark, .authorBoxesSean {
            display: flex;
            justify-content: center;
            width: 90%;
            margin: 4rem auto;   
        }

        .authorBoxesMark .hostImage, .authorBoxesSean .hostImage {
            max-width: 550px;
            width: 100%;
        }

        .hostImage img {
            border-radius: 25px;
        }


        .hostImage img, .heroImage img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }


        .contact {
            margin: auto;
            text-transform: uppercase;
            text-align: center;
            font-family: Garamond-Medium;
            margin-bottom: 1rem;
            font-size: 1.5rem;
            color: #2C2C2C;
        }

        .icons {
            display: inline-block;
        }

        .podTitle {
            font-size: 3rem;
            margin-bottom: 2rem;
        }

        .authorBoxesMark .podTitle {
            margin-left: 2rem;
        }

        .podScript {

            font-family: Garamond-Regular;
            font-size: 1rem;
            margin-right: 2rem;
            margin-bottom: 1rem;

        }

        .podScriptSean {
            font-family: Garamond-Regular;
            font-size: 1.2rem;
            margin-right: 2rem;
            margin-bottom: 1rem;
        }

        .podScriptMark {
            font-family: Garamond-Regular;
            font-size: 1.2rem;
            margin-left: 2rem;
            margin-bottom: 1rem;
        }


        .contactFooter {
            background-color: #FDD3A4;
            width: 100%;
            max-width: 1920px;
            display: flex;
            justify-content: center;
            padding: 2rem;
        }


        .contactFooter .getintouch {
            margin: 0.5rem;
            display: flex;

        }
        

        
        .contactFooter .media {
            display: flex;
            padding: 1rem;
        }


        .icons img{
            max-width: 30px;
            margin-right: 10px;
            margin-bottom: 2px;
        }

        .deets {
            color: #2C2C2C;
            font-family: Garamond-Regular;
            font-size: 1rem;
        }

        .contactFooter .icons {
            display: flex;
            align-items: center;
        }

        .contactFooter .icons img {
            width: 20px;
            height: 20px;
            object-fit: contain;
        }

        .contributor {
            color: #1C82D6;
            margin: auto;
            text-align: center;
            width: 90%;
            font-family: Garamond-Bold;
            margin-bottom: 2rem;
            font-size: 1rem;

        }


        .copyrightBlurb {
            text-align: center;
            font-family: sans-serif;
            font-size: 0.8rem;
            color: #2C2C2C;
            padding-top: 2rem;
        }



        @media only screen and (max-width: 960px) {

        .latestEpisodes {
            margin-top: 2rem;
            margin-bottom: 2rem;
            margin: auto;
            display: block;
            width: 90%;
        }


        .previousEpisodes {
            margin: 2rem auto;
            display: block;
            width: 90%;
            justify-content: center;
        }

        .previousEpisodes .podTitle {
            text-align: center;
            margin: 1rem auto;
            font-size: 2rem;
        }

        .icons {
            margin-bottom: 2rem;
        }

        .prvid {
                margin: 0rem 0rem 2rem 0rem;
                aspect-ratio: 16 / 9 !important;
                width: 100% !important;
        }

        .heroImage {
            position: relative;
            z-index: -10;
            display: flex;
            margin: auto;
            width: 100%;
            height: 50vh;
            box-sizing: border-box;
            overflow: hidden;
            background-size: cover;
            background-repeat: no-repeat;
        }


      .authorBoxesMark, .authorBoxesSean {
            display: flex;
            justify-content: center;
            flex-direction: column;
            width: 90%;
            margin: 2rem;   
        }


        .podScriptSean {
            font-family: Garamond-Regular;
            font-size: 1.2rem;
            margin-right: 2rem;
            margin-bottom: 1rem;
        }

        .podScriptMark {
            font-family: Garamond-Regular;
            font-size: 1.2rem;
            margin: 0rem 0rem 1rem 0rem;
        }
        

        .authorBoxesMark .podTitle {
            margin-left: 0rem;
            margin-top: 2rem;
        }

        .authorBoxesSean .podTitle {
            margin-top: 2rem;
        }


        h2  {
            font-size: 2rem;
        }

        .hostImage {
            order: 1;
        }

        .hostText {
            order: 2;
        }
            
        }