@charset "UTF-8";

/*
	Chebucto terms of use Style Sheet
    Author: Thomas Lacroix
    Creation Date: 2023/07/07 
    Modified Date: 2023/08/17
*/
html{
    background-color: rgba(9,74,10,255);
}
a{
    color: white;
}
header{
    background-color: white;
}
.heroSection
{
    position: relative;
    color: white;
    width: 100%;
    height: 60%;
    margin: 0;
    padding: 0;
    z-index: -1;
}

#boxOne{
    height: 15%;
    position: relative;
    z-index: -1;
}
#mission{
    color: white;
    position: absolute;
    text-align: center;
    margin-left: 44.5%;
    top: 1%;
    font-size: 2.3vw;
    z-index: -1;
}
#missionText{
    color: white;
    position: absolute;
    text-align: center;
    top: 60%;
    font-size: 1.3vw;
    z-index: -1;
    margin-left:10%;
    margin-right: 10%
}
#boxTwo{
    height: 65%;
    position: relative;
    padding-top:4%;
    z-index: -1;
}
#PolicyText{
    color: white;
    position: absolute;
    text-align: center;
    font-size: 1.75vw;
    right: 1%;
    top: 73%;
    margin-left: 50%;
}
#PolicyButton{
    color: black;
    position: absolute;
    right: 8%;
    top: 50%;
    width: 30%;
    height: 25%;
    background-color: rgba(9,74,10,255);
    color: white;
    font-size: 3.5vw;
    text-align: center;
    font-weight: bold;
}
#PolicyButton:hover, #TechButton{
    cursor: pointer;
}
#TechText{
    color: white;
    position: absolute;
    text-align: center;
    font-size: 1.75vw;
    left: 1%;
    top: 70%;
    margin-right: 54%;
}
#TechButton{
    color: black;
    position: absolute;
    left: 6%;
    top: 50%;
    width: 30%;
    height: 20%;
    background-color: rgba(9,74,10,255);
    color: white;
    font-size: 3.5vw;
    text-align: center;
    font-weight: bold;
}

/* ===============================
   Mobile Styles: 0px to 600px 
   ===============================
*/

/*Resizing for About Us has not yet been done */
@media only screen and (max-width: 600px) and (min-width: 0px)
{
    .heroSection
    {
        height: 30%;
    }
    
    #boxOne{
        height: 10%;
    }
    #mission{
        top: 1%;
        font-size: 3vw;
    }
    #missionText{
        top: 30%;
        font-size: 2.5vw;

    }
    #boxTwo{
        height: 30%;
        position: relative;
        padding-top:4%;
    }
    #PolicyText{
        font-size: 2.3vw;

    }
    #TechText{
        font-size: 2.3vw;

    }
}

/* ===============================
   Tablet Styles: 600px to 950px 
   ===============================
*/
@media only screen and (max-width: 950px) and (min-width: 601px)
{
    .heroSection
    {
        height: 45%;
    }
    
    #boxOne{
        height: 30%;
    }
    #mission{
        top: 1%;
        font-size: 3vw;
    }
    #missionText{
        top: 30%;
        font-size: 2.5vw;

    }
    #boxTwo{
        height: 45%;
        position: relative;
        padding-top:4%;
    }
    #PolicyText{
        font-size: 2.3vw;

    }
    #TechText{
        font-size: 2.3vw;

    }
}