html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}



/*-----------------------------------*/

.hero-img {
    width: 100%;
    height: 600px;
    position: relative;
    box-shadow: 0px 0px 10px 1px #100d1b6b;
    object-fit: cover;
    object-position: 25% 30%;
    filter: saturate(80%);
    -webkit-filter: saturate(80%);
    z-index: -1;
    filter: blur(2px);
    -webkit-filter: blur(2px);
    

}





.page-caption h1 {
    font-size: 2.5em;
    font-family: 'Mr Dafoe', cursive;
    color: rgb(255, 255, 255);
    text-align: center;
    padding-bottom: 8px;
}
.page-caption {
    position: relative;
    bottom: -260px;
    z-index: 1;
    display: block;
    margin: -110px;
}

.page-caption-container {
    border: 3px #ffffffde solid;
    width: 200px;
    margin: auto;
    padding: 1% 2% 1% 2%;
    border-radius: 5px;
}



.spacer {
    height: 10px;
    margin: -2px;
    background-color: rgb(255, 255, 255);
}

.page-bar {

    display: flex;
    width: 100%;
    justify-content: space-around;
    background-color: #1e1e1e;
    height: 100px;
    align-items: center;
    z-index: 6;


}
.main-text {

    max-width: 800px;

    display: flex;
    flex-direction: column;
    margin: auto;
    border: var(--border);
}
.main-text-h2{
    color: #2e3238;
    font-family: "Edu NSW ACT Foundation", cursive;
    font-size: 25px;
    text-align: center;
}
.main-text-h1{
    color: #000000;
    font-family: "Edu NSW ACT Foundation", cursive;
    font-size: 30px;
    text-align: center;
}

html,
body {
    overflow-x: hidden;
}

body {

    position: relative;
    background-color: #ced9e1;
}
/*--------------------------*/
.mtb{
    color: #2e3238;
    font-family :"Edu NSW ACT Foundation", cursive;
    font-weight: 600;
    font-size: 30px;
    text-align: center;
}

/*--------------------------*/
.member1 { grid-area: member1; }
.member2 { grid-area: member2; }
.member3 { grid-area: member3; }
.member4 { grid-area: member4; }
.member5 { grid-area: member5; }
.member6 { grid-area: member6; }
.member7 { grid-area: member7; }
.member8 { grid-area: member8; }
.member9 { grid-area: member9; }
.member10 { grid-area: member10; }


article{
    display: grid;
    grid-template-areas: 
        'member1 member2'
        'member3 member4'
        'member5 member6'
        'member7 member8'
        'member9 member10';
        color: #2e3238;
        font-family :"Edu NSW ACT Foundation", cursive;
        font-size: 20px;
        font-weight: 500px;
}
img {border-radius: 10px;}
/*--------------------------*/
.page-buttons {

    display: flex;
    width: 60%;
    justify-content: space-around;
    border: var(--border);
}

.page-text {
    font-family: "Edu NSW ACT Foundation", cursive;
    color: white;
    font-size: 1.5rem;
    text-align: center;
    transition: all ease-in-out 0.25s;
    border: var(--border);
}

.page-textb {
    .page-textb {
    font-family: "Edu NSW ACT Foundation", cursive;
    color: white;
    font-size: 1.5rem;
    text-align: center;
    transition: all ease-in-out 0.25s;
    border: var(--border);


}
    color: white;
    font-size: 1.5rem;
    text-align: center;
    transition: all ease-in-out 0.25s;
    border: var(--border);


}



.page-link {
    text-decoration: none;
    transition: all ease-in-out 0.25s;

    padding: 40px;
    margin: -40px;
    border: var(--border);
    font-family: "Edu NSW ACT Foundation", cursive;
}

.page-linkb {
    text-decoration: none;
    transition: all ease-in-out 0.25s;

    border: var(--border);
    z-index: 5;
    font-family: "Edu NSW ACT Foundation", cursive;

}

.page-link:hover {
    transform: scale(1.1);

}

.page-link:hover .page-text {

    color: #8bcbffd9;
}

.page-linkb:hover .page-textb {

    color: #8bcbffd9;
}
/*---------------*/


/*-----------------------*/
.toggle-button {
    display: none;
    color: white;
    font-size: 2em;
    text-align: center;
    align-self: center;
    justify-self: center;
    border: var(--border);
    animation: pulldown 4s ease-in-out infinite;

}




.navbar-links {
    height: 200px;
    width: 300px;
    background-color: #1e1e1ee8;
    backdrop-filter: blur(10px);

    -webkit-backdrop-filter: blur(10px);

    box-shadow: 0px 25px 25px 0px rgba(0, 0, 0, 0.425);
    position: absolute;
    z-index: 1;
    width: 100%;
    display: none;
    justify-self: end;
}









.page-bar-black {
    width: 100%;
    background-color: #1e1e1e;
    border: var(--border);
     
}


.page-logo-img {
    width: 70px;
    height: 100px;
    border-radius: 10px;

}

/*----------------------*/




footer {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    height: 100px;
    width: 100%;
    background-color: #1e1e1e;
}



.footer-icons {
    display: flex;
    border: var(--border);
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
 
  

}
.fa-brands {
  
    transition: all ease-in-out 0.15s;
    font-size: 2rem;
}
.footer-icons a {
    padding:20px;
    margin: -20px;
    border: var(--border);
    color: #70a2d1;
}

.footer-icons a:hover .fa-brands {
    transform: scale(1.25);
}
.footer-icons {
    display: flex;
    margin: auto;
    justify-self: center;
    text-align: left;
    row-gap: 20px;
    width: 10%;
}
h3 {
    margin: auto;
    color: white;
    font-family: "Edu NSW ACT Foundation", cursive;
    width: 100%;
    background-color: #1e1e1e;
    text-align: center;
    font-size: 20px;
    padding-bottom: 15px;
}

/*-------------------------------*/

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

    .hero-img {
        width: 100%;
        height: 300px;
        position: relative;
        box-shadow: 0px 0px 10px 1px #100d1b6b;
        object-fit: cover;
        object-position: 25% 30%;
        filter: saturate(80%);
        -webkit-filter: saturate(80%);
        z-index: -1;
    
    }

    .page-caption h2 {
        font-size: 0.8em;
        font-family: 'Poppins', sans-serif;
        color: rgb(255, 255, 255);
        text-align: center;
        font-style: italic;
        padding-bottom: 5px;
    }

    .page-caption h1 {
        font-size: 2.5em;
        font-family: 'Mr Dafoe', cursive;
        color: rgb(255, 255, 255);
        text-align: center;
        padding-bottom: 5px;
    }

    .page-caption {
        position: relative;
        bottom: -150px;
        z-index: 1;
        display: block;
        margin: -110px;
    }

    .page-caption-container {
        border: 3px rgba(255, 255, 255, 0.87) solid;


    }
    /*--------------------------------------*/
    article {
        margin: 0px 4%;
      }
  
      article {
          display: grid;
          /* gap: 10px; */
          grid-template-areas: 
              'bannertext'
              'introtext'
              'bookbutton'
              'meetus'
              'member1'
              'member2'
              'member3'
              'member4'
              'member5'
              'member6'
              'member7'
              'member8'
              'member9'
              'member10';
      }
    /*-------------------------------------*/

    .spacerb {
        height: 2px;
    }

    .page-text {

        display: none;

    }

    .page-logo {
        display: contents;
    }

    .page-link {
        display: none;
    }


    .page-bar {
        width: 90%;
        margin: auto;
        z-index: 2;
        justify-content: space-around;


    }


    .toggle-button {
        display: contents;
    }

    .navbar-links.active {


        animation: pulldown 4s ease-in-out;
        display: flex;
        flex-direction: column;
        line-height: 45px;
    }

    iframe {
        width: 92%;
        border: 1px solid #ccc;
    }

/*----------------------------*/

    footer {
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
        height: 400px;
    }

    .footer-links {
        display: flex;
        flex-direction: column;

        row-gap: 20px;
        margin-left: auto;
        margin-right: auto;
        text-align: center;
        padding-bottom: 20px;
    }


    .footer-icons {

        display: flex;
        font-size: 0.8rem;
        margin-left: auto;
        margin-right: auto;
        justify-self: center;
        text-align: left;
        row-gap: 20px;
        width: 50%
    }

    .footer-icons i {

        font-size: 2em;

    }

    /*-----------------------------*/
    
    .submit {
       
            width: 92%;
            font-weight: 600;
            font-size: 1.8em;
            background-color: #ffffff;
            border-radius: 25px;
    
        }
        }
        







        
@media screen and (min-width:411px) and (max-width:1023px) {
  
    iframe {
        width: 92%;
        border: 1px solid #ccc;
    }

  

 
    .hero-img {

        height: 400px;
    }

    .toggle-button {
        display: contents;
    }


    .page-bar {
        width: 80%;
        margin: auto;
        z-index: 2;
        justify-content: space-around;
    }

    .page-link {
        display: none;
    }



    .toggle-button {
        display: contents;
    }

    .navbar-links.active {


        animation: pulldownb 4s ease-in-out;
        display: flex;
        flex-direction: column;
        line-height: 45px;


    }



    .fa-bars {
        z-index: 29;
    }

    footer {
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
        height: 400px;
    }

    .footer-links {
        display: flex;
        flex-direction: column;

        row-gap: 20px;
        margin: auto;
    }



    .footer-icons {
        display: flex;
        margin: auto;
        justify-self: center;
        text-align: left;
        row-gap: 20px;
        width: 50%;
    }

    
    .submit {
       
            width: 72%;
            font-family: 'Poppins', sans-serif;
            font-weight: 600;
            font-size: 1.8em;
            background-color: #ffffff;
            border-radius: 25px;
    
        }
        
}

.mr-dafoe-regular {
    font-family: "Mr Dafoe", cursive;
    font-weight: 400;
    font-style: normal;
  }

.edu-nsw-act-foundation-500 {
  font-family: "Edu NSW ACT Foundation", cursive;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
}