html, body {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}

blockquote {
    font-size: 1em;
}
h1 {
    font-size: 2em;
}
h2 {
    font-size: 1.5em;
}
h4 {
    font-size: 1em;
}
p {
    font-size: 1em;
    font-weight: 400;
}

/* --------- Footer --------- */
footer {
    margin: 20vh 13vw 5vh 13vw;
    text-align: center;
    border-top: 1px solid darkgrey;

}
footer a {
    color: dodgerblue;
}
footer a:visited {
    color: dodgerblue;
}
footer a:hover {
    color: darkblue;
}
.copyright {
    font-size: 0.7em;
}
.contact {
    font-size: 0.8em;
}
/* ======================================================= Desktop/Default =================================================================== */
/* ------------------ Container -----------------------*/
#container {
    height:100%;
    width: 100%;
    background-color:antiquewhite;
    margin:auto;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    position: fixed;
    overflow-y: scroll;
    overflow-x: hidden;
    border-radius: 10px;
    -webkit-overflow-scrolling: touch;
}
/* ------------------ Navigation Bar -------------------- */
#navBar {
    background-color: burlywood;
    padding: 15px 0 15px 0; 
    box-shadow: 5px 5px 5px 0 rgba(0,0,0,0.5);
    border-radius: 10px;
}
#navBar ul {
    /*margin: 0;*/
    padding:0;
    
}
#navBar a:link, a:visited {
    color:black;
    text-decoration: none;
}
#navBar a:hover {
    color:floralwhite;
}

#navBarContainer{
    margin-left: 13vw; 
}
.navListItem {
    display: inline-block;
    /*margin-right: 8vw;*/
    margin-right: 5vw;
    font-size: 21px;
    font-weight: 600;
}
.navIndex {
    display: inline-block;
    /*margin-right: 8vw;*/
    margin-right: 5vw;
    font-size: 21px;
    font-weight: 600;
}


/* ---- Hide Mobile Nav on Desktop ---------- */

.mobileNavBarContainer {
    display: none;
}
.hamburger {
    display: none;
}


/* ------------------ Index/Home Page ----------------------------*/
#wrapperHome {
    /*width: 85%;*/
    /*min-width:70%;*/
    margin-bottom: 5%;
    margin-left: 13vw;
    column-count:2;
    column-width: 450px;

}
#indexLeft {
    display: inline-block;
    width: 90%;
    /*padding-bottom: 20px;*/
}

#indexRight {
    width: 90%;
    padding: 0.05px;
}
        
.eventBox {
    background-color:gainsboro;
    border-left: 5px solid blue;
    box-shadow: 5px 5px 5px 0 rgba(0,0,0,0.5);
    border-radius: 10px;
    padding: 10px 0 10px 15px;

    display:flex;
    flex-flow: row nowrap;
    align-content: center;
    align-items:center;
}
.eventBox a:link, a:visited {
    text-decoration: none;
    color: black;
}    
.eventBox a:hover {
    text-decoration: none;
    color: dodgerblue;
}   
.eventBoxLeft {
    display: flex;
    justify-content: center;
    width: 20%;
}
.eventBoxRight{
    width: 75%;
    text-align:center;
}
.eventBoxPage {
    width: 50%;
}
.eventImg {
    width: 100px; 
    height: 100px;
}
.eventName {
    font-size: 1.1em;
    font-weight: 700;
}
.eventTimer {
    font-size: 1em;
}
.eventDate {
    font-size:1em;
}

/* ----- Wrapper for site pages ----- */
#wrapperPage {
    min-width:70%;
    max-width:80%;
    height: auto;
    min-height: 100%;
    margin-bottom: 5%;
    margin-left: 13vw;
}  
.headerText a:link, a:visited {
    color: dodgerblue;
}
.headerText a:hover {
    color: darkblue;
}

/* ----------------- Pokemon Wrapper Generic -------------------- */

.pokemonWrapper {
    display: flex;
    flex-flow: row wrap;
    width: 100%;
    padding: 0 5px 0 5px;
    margin-bottom: 2%;
}
.pokemon {
    
    width: 8vw;
    min-width: 135px;
    background-color: lightgray;
    box-shadow: 5px 5px 5px 0 rgba(0,0,0,0.5);
    border-radius: 10px;
    border: 1px solid darkgray;
    margin: 0 2vw 2vw 0;
    /*position: relative;*/
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
}
.pokemonName {
    font-size: 1.1em;
    font-weight: 600;
    padding: 0 2px 0 5px;
    width: 100%;
    text-align: center;
    white-space: nowrap;
    position: relative;
}
.pokemonImg {
    height: 90%;
    width: 90%;
    margin: auto;
}
.pokemonMiddle {
    display: flex;
    flex-flow: row nowrap;
    align-items: flex-start;
    justify-content: center;
}
.pokemonShiny {
    width: 15%;
    margin: 15% 10% 0 -20%;

}
/* ----------------- Home Page - Event Link Guides ----------------*/
.imgCredit {
    font-size: 0.9em;
    font-weight: 500;
    margin-top: 0;
}
.DPSTDOChartImg {
    width: 80vw;
    max-width: 800px;
    min-width: 500px;
}
.fatImgContainer {
    overflow-x: auto;
}

/* ---------------------- Eggs ------------------------- */
/* --- Header --- */
.eggHeader {
    display: flex;
    flex-flow: row nowrap;
    padding: 0 0 5px 0;
}
.eggHeaderImg {
    align-self: center;
    width: 50px;
    height: 60px;
    margin-right: 1vw;
}
.eggHeaderText {
    align-self: flex-end;
    margin: 0;
    font-size: 2em;
}
/* --- Egg Chart --- */
.eggChart {
    display: flex;
    flex-flow: row wrap;
    width: 100%;
    padding: 0 5px 0 5px;
    margin-bottom: 2%;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.5s ease-in-out;

}
.eggChartVisible {
    display: flex;
    flex-flow: row wrap;
    width: 100%;
    padding: 0 5px 0 5px;
    margin-bottom: 2%;
}
.eggHatch {
    width: 10vw;
    min-width: 135px;
    background-color: gainsboro;
    box-shadow: 5px 5px 5px 0 rgba(0,0,0,0.5);
    border-radius: 10px;
    border: 1px solid darkgray;
    margin: 0 2vw 2vw 0;
    position: relative;
}
.eggPokemonName {
    font-size: 1.1em;
    font-weight: 600;
    padding: 0 2px 0 5px;
}
.eggMiddle {
    display: flex;
    flex-flow: row nowrap;
    align-items: flex-start;
}
.eggPokemonImg {
    height: 80%;
    width: 80%;
}
.eggShiny {
    width: 15%;
    margin: 15% 0 0 -20%;
}
.eggCPRange {
    text-align: center;
    font-size: 1em;
    font-weight: 500;
}
/*----------------Raids----------------*/
.raidHeader {
    display: flex;
    flex-flow: row nowrap;
}
.raidHeaderImg {
    align-self: center;
    height: 60px;
    width: 60px;
    margin-right: 1vw;
}
.raidHeaderText {
    align-self: flex-end;
    margin: 0;
    font-size: 2em;
}
.raidChart {
    display: flex;
    flex-flow: row wrap;
    width: 100%;
    margin-bottom: 2%;
    padding: 5px;
}
.raidBoss {
    width: 10vw;
    min-width: 225px;
    background-color: gainsboro;
    box-shadow: 5px 5px 5px 0 rgba(0, 0, 0, 0.5);
    border-radius: 10px;
    border: 1px solid darkgray;
    margin: 0 1vw 2vw 0;
    /*position: relative;*/
}

.raidTop {
    display: flex;
    flex-flow: row nowrap;
    align-content: center;
    justify-content: space-between;
    align-items: center;
}
.raidPokemonName {
    font-size: 1em;
    font-weight: 600;
    padding: 1px 2px 0 5px;
    width: 60%;
}
.raidType {
    display: flex;
    padding: 2px 10px 0 0;
}
.raidType1 {
    margin-right: 5%;
    height: 80%;
}
.raidType2 {
    height: 80%;
}
.typeHide, .shinyHide, .weatherHide {
    visibility: hidden;
}
.raidMiddle {
    display: flex;
    flex-flow: row nowrap;
    align-content: center;
    align-items: flex-start;
    /*justify-content: space-between;*/
}
.raidPokemonImg {
    width: 60%;
    height: 60%;
}
.raidShiny {
    width: 10%;
    margin: 5% 0 0 -16%;
}
.raidWeather {
    display: flex;
    flex-flow: row nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    padding: 0 0 0 15px;

}
.raidWeather1 {
    width: 35%;
    height: 35%;
    margin-left: 10%;
}
.raidWeather2 {
    width: 35%;
    height: 35%;
    margin-left: 10%;
}
.raidCPLeft {
    font-size: 0.9em;
    padding: 0 0 0 3px;
    width: 45%;
    text-align: right;
    display: inline-block;
}
.raidCPText, .raidBCPText {
    margin: auto;
}
.raidCPRight {
    font-size: 0.9em;
    width: 49%;
    display: block;
    float: right;
}
.raidCP, .raidBCP {
    margin: auto;
    padding: 0 5px 0 0;
    font-weight: 600;
}
.raidMinSize{
    font-size: 0.9em;
    text-align: center;
    margin-bottom: 10px;
}
.raidMinSize a:link, a:visited {
    text-decoration: none;
    color: black;
}
.raidMinSize a:hover {
    color: dodgerblue;
}

/* --------------- Field Research ---------------- */
#wrapperResearch {
    column-count: 2;
    column-width: 525px;
}
/*---- Field Research Tasks ----- */
.taskGroup {
    display: inline-block;
    width: 90%;
    min-width: 500px;
    padding: 0 10px 10px 10px;
    margin-bottom: 2vw;
/*    background-color: silver;*/
    box-shadow: 5px 5px 5px 0 rgba(0,0,0,0.5);
    border-radius: 10px;
}
.taskGroup1 {
    background-image: linear-gradient(to bottom right,  lightskyblue, ivory);
}
.taskGroup2 {
    background-image: linear-gradient(to bottom right, greenyellow, ivory);
}
.taskGroup3 {
    background-image: linear-gradient(to bottom right, plum, ivory);
}
.taskGroup4 {
    /*background-color: lightsalmon;*/
    background-image: linear-gradient(to bottom right, lightsalmon, ivory);
}
.taskGroupEvent {
    background-image: linear-gradient(to bottom right, gold, ivory);
}
.taskHeaderRow {
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-around;
    /*min-width: 420px;*/
}
.taskHeaderLeft {
    flex-basis: 30%;
    /*text-align: center;*/
    border-right: 1px solid transparent;
    text-align: center;
}

.taskHeaderRight {
    flex-basis: 70%;
    text-align: center;
}
/* ---- Individual Quests --- */
.quest {
    display: flex;
    flex-flow: row nowrap;
    /*height: 120px;*/
    min-width: 500px;
    align-items: center;
/*    background-color: lightgray;*/
    border: 1px solid darkgray;

    border-radius: 10px;
}
.questTask {
    display: flex;
    align-items: center;
    text-align: center;
    width: 40%;
    min-width: 30%;
    height: 100%;

}
.questTaskText {
    width: 100%;
    /*float: left;*/
    padding: 2px;
    margin-right: 5px;
    font-size: 1.1em;
    font-weight: 700;

}
.questRewardWrap {
    display: flex;
    flex-flow: row nowrap;
    height: 100%;
    flex-basis: 100%;
    /*width: 100%;*/
    justify-content: space-evenly;
    align-content: center;
    align-items:center;
}
.questReward {
    width: 3vw;
    min-width: 120px;
    
    /*margin: 0 2vw 2vw 0;
    position: relative;*/
}
.questRewardName {
    font-size: 1em;
    font-weight: 600;
    padding: 5px 2px 2px 5px;
    white-space: nowrap;
    position: relative;
    text-align: center;
}
.questMiddle {
    display: flex;
    flex-flow: row nowrap;
    align-items: flex-start;
    justify-content: center;
}
.questRewardImg {
    height: 70%;
    width: 70%;
}
.questShiny {
    width: 15%;
    margin: 15% 0 0 -20%;
}
.questCPRange {
    /*position: absolute;*/
    white-space: nowrap;
    padding: 2px 2px 2px 5px;
    text-align: center;
}
.br {
    margin: -5px;
}
/* ------ Research Breakthrough -------- */
.rbWrapper {
    display: flex;
    flex-flow: row wrap;
    width: 100%;
    margin-bottom: 3%;
    padding: 5px;
}
.rbPokemon {
    width: 10vw;
    min-width: 135px;
    margin: 0 2vw 2vw 0;
    background-color: gainsboro;
    box-shadow: 5px 5px 5px 0 rgba(0,0,0,0.5);
    border-radius: 10px;
    border: 1px solid darkgray;
}
.rbPokemonName {
    font-size: 1em;
    font-weight: 600;
    padding: 0 2px 0 5px;
}
.rbMiddle {
    display: flex;
    flex-flow: row nowrap;
    align-items: flex-start;
}
.rbPokemonImg {
    height: 80%;
    width: 80%;
}
.rbShiny {
    width: 15%;
    margin: 15% 0 0 -20%;
}
.rbCPRange {
    text-align: center;
    font-weight: 500;
}

/* -------------------- Shinies -------------------- */
.shinyHeader {
    display: flex;
    flex-flow: row nowrap;
    padding: 0 0 5px 0;
}
.shinyHeaderText {
    align-self: flex-end;
    margin: 0;
    font-size: 2em;
}
/* -- Shiny Chart -- */
.shinyChartVisible {
    display: flex;
    flex-flow: row wrap;
    width: 100%;
    padding: 0 5px 0 5px;
    margin-bottom: 2%;
}
.shinyChart {
    display: flex;
    flex-flow: row wrap;
    width: 100%;
    padding: 0 5px 0 5px;
    margin-bottom: 2%;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.5s ease-in-out;
}
.shinyPokemon {
    width: 8vw;
    min-width: 135px;
    background-color: gainsboro;
    box-shadow: 5px 5px 5px 0 rgba(0,0,0,0.5);
    border-radius: 10px;
    border: 1px solid darkgray;
    margin: 0 2vw 2vw 0;
    /*position: relative;*/
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
}
.shinyPokemonName {
    font-size: 1.1em;
    font-weight: 600;
    padding: 0 2px 0 5px;
    width: 100%;
    text-align: center;
}
.shinyPokemonImg {
    height: 80%;
    width: 80%;
}

/* ------------- Content Wrapper for Sub-Pages ------------ */
/* Main Page: Home, Eggs, Raids, Research; 
/* Sub Pages: Guides, etc. */
#pageContentWrapper {
    width: 95%;
    /*padding-right: 10px;*/
    height: auto;
    margin-bottom: 5%;
    /*position: relative;*/
    /*float:left;*/
}

/* ------------ Wrapper for Sub-Page Sections ------------ */
.pageSectionWrapper {
    width: 100%;
    /*position: relative;*/
    /*float:left;*/
    margin-bottom: 2%;
}
.pageSectionWrapper p {
    /*width: 90%;*/
    line-height: 1.4;
}
.pageSectionWrapper a {
    color:dodgerblue;
    text-decoration: none;
}
.pageSectionWrapper a:hover {
    color: darkblue;
}
.pageSectionWrapperIndent {
    width: 98%;
    margin-bottom: 2%;
    margin-left: 2%;
}
.pageSectionWrapperIndent p {
    line-height: 1.4;
}

.pageSectionTitle {
    font-size: 1.5em;
    font-weight: 700;
    margin-top: 1%;
    
}
.pageSectionBlockTitle {
    font-size: 1.5em;
    font-weight: 700;
    margin-top: 1%;
    background: dimgray;
    color: floralwhite;
    border-radius: 3px;
    padding: 6px;
    border-left: 3px solid deepskyblue;

}


.pageSectionList {
    font-size: 1em;
    /*width: 80%;*/
    margin-top: 0;
    
}
.pageSectionList li {
    margin: 0.8%;
}
.pageSectionText {
    width: 90%;
    font-size: 1em;
    margin-bottom: 0.2%;
}
.pageBlockquote {
    background-color: moccasin;
    border: 2px solid black;
    padding: 5px;
    border-radius: 10px;
    width: 80%;
}
.pageBlockquote0Margin {
    background-color: moccasin;
    border: 2px solid black;
    padding: 5px;
    border-radius: 10px;
    width: 80%;
    margin: 0;
}

/* ------------- Guides Home --------------- */
.guideHomeSectionWrapper {
    margin-bottom: 2%;
    width: 100%;
}
.guideHomeSectionWrapperHidden {
    margin-bottom: 2%;
    width: 100%;
    padding: 0 20px 5px 5px;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.5s ease-in-out;
}
.guideHomeListItem {
    font-size: 1.1em;
    background-color: snow;
    box-shadow: 5px 5px 5px 0 rgba(0, 0, 0, 0.5);
    border-radius: 7px;
    padding: 10px 0 10px 15px;
    margin: 1% 0 1% 0;
}
.guideHomeListItem:hover {
    transform: translateX(5px);
    transition: 0.5s;
}

.guideListLink {
    text-decoration: none;
    color: black;
}
.guideListLink:hover {
    font-weight: 700;
}

.guideHomeRaids {
    border-left: 5px solid blue;
}
.guideHomeCombat {
    border-left: 5px solid red;
}
.guideHomeOther {
    border-left: 5px solid black;
}

/* ----------- Tier 5 Raid Guides - Home ----------- */
.headerText a {
    text-decoration: none;
    color: dodgerblue;
}
.headerText a:hover {
    text-decoration: none;
    color: darkblue;
}
.t5CollapseHeader {
    padding: 10px 0 10px 0;
}
/* =========== Tier 5 Raid Guides --------------- */
.raidBossPlaceholderImg {
    width: 30vw;
    min-width: 200px;
    max-width: 400px;
}
.raidGuideImageWrapper {
    display: flex;
    flex-flow: row wrap;
    margin-bottom: 1%;
    width: 100%;
}
.raidGuideHeadWeatherImg {
    width: 5vw;
    min-width: 45px;
}
.raidGuidePokemon {
    width: 15%;
    min-width: 170px;
    background-color: gainsboro;
    border: 1px solid darkgrey;
    box-shadow: 5px 5px 5px 0 rgba(0, 0, 0, 0.5);
    border-radius: 10px;
    margin: 5px 0.5% 5px 0;
}
.raidGuidePokemonName {
    text-align: center;
    font-size: 1em;
    font-weight: 600;
}
.raidGuidePokemonImg {
    display: block;
    width: 60%;
    margin: auto;
}
.raidGuideMoveset {
    display: flex;
    flex-flow: column nowrap;
    padding: 0 0 3px 2px;
}
.raidGuideMove1 { 
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
}
.raidGuideMove2 {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
}
.raidGuideMoveName {
    font-size: 0.9em;
    font-weight: 600;
    padding: 0 0 0 5px;
}
.raidGuideMoveType {
    padding: 2px 2px 2px 5px;
}
.raidGuideMinLevel {
    text-align: center;
    font-size: 0.9em;
    font-weight: 500;
    font-style: italic;
}
.raidGuideInfographic {
    max-width: 920px;
    width: 90vw;
}

/* ------------ General Raiding Tips/Guides ---------------- */
.pageSectionCollapse {
    display: flex;
    justify-content: space-between;
    align-items: center;
    
    /*padding: 10px 0 10px 0;*/
    cursor: pointer;
    /*border: 0px;
    outline: none;*/
    border-bottom: 1px solid slategray;
    margin-bottom: 10px;
}
.pageSectionCollapse:after {
    content: 'Show';
    /*color: floralwhite;*/
    font-weight: 500;
    font-size: 12px;
    margin-right: 5px;

  }
.active:after {
    content: "Hide";
}
/* ------------ PvE Attacker Tier List ---------------- */

.pveATLSectionContent {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.5s ease-in-out;

}
.pveATLImageWrapper {
    display: flex;
    flex-flow: row wrap;
    margin-bottom: 2%;
}
.pveATLPokemon {
    width: 12vw;
    min-width: 165px;
    margin: 0 1% 1% 0;
    border: 1px solid darkgrey;
    background-color: gainsboro;
    border-radius: 10px;
    box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.5);

}
.pveATLPokemonName {
    text-align: center;
    font-size: 1em;
    font-weight: 700;
}
.pveATLPokemonImg {
    display: block;
    width: 80%;
    margin: auto;
}
.pveATLMoveset {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-content: center;

    padding-bottom: 2px;
}
.pveATLMove1 {
    display: flex;
    flex-direction: row;
    align-items: center;
}
.pveATLMove2 {
    display: flex;
    flex-direction: row;
    align-items: center;
}
.pveATLMoveType {
    padding: 0 2px 0 5px;
}
.pveATLMoveName {
    font-size: 0.9em;
    font-weight: 600;
    padding-left: 5px;
}


/* ------------- Type Table ------------ */

.tableContainer {
    overflow-x:auto;
}
.typeTable {
    border: 1px solid black;
    background: floralwhite;
    border-collapse: collapse;
}
/*.typeTable caption {
    font-size: 1.2em;
    font-weight: 700;
}*/
.typeTable td {
    text-align: center;
    font-size: 0.9em;
    border: 1px solid black;
    padding: 3px;
}
.typeTable tbody {
    border: 1px solid black;
}
.typeTable thead {
    background: lightcyan;
}

.typeNeutral {
    background: white;
    color: black;
}
.typeNVE {
    background: salmon;
    color: black;
    font-weight: 600;
}
.typeSE {
    background: lime;
    color: black;
    font-weight: 600;
}
.typeNE {
    background: black;
    color: white;
    font-weight: 600;
}

.typeTableFix {
    position: absolute;
    padding-top: 2px;
    background: floralwhite;
}


/* ---------- Pokemon Stats ------------- */
.statFlexContainer {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
    overflow: hidden;
}
.statFlexColumn {
    flex: 1;
    min-width: 250px;
}
.statFlexColumn p {
    width: 75%;
}
.statFlexPokemonImg {
    width: 30%;
    min-width: 110px;
}
.statBarContainer {
    width: 75%;
}
.statBar {
    height: 20px;
    display: flex;
    align-items: center;
    box-shadow: 3px 3px 5px 0 rgba(0,0,0,0.5);
    border-radius: 3px;
    position: relative;
    margin: 3px;
    width: 90%;
    z-index: 1;
}
.statBarText {
    display: block;
    font-size: 0.8em;
    background-color: floralwhite;
    padding: 1px 3px 1px 3px;
    margin-left: 5px;
    border-radius: 4px 0 0 4px;
    font-weight: 600;
    z-index: 1;
}
.statBarValue {
    font-size: 0.8em;
    display: block;
    background-color: floralwhite;
    padding: 1px 3px 1px 3px;
    border-radius: 0 4px 4px 0;
    font-weight: 600;
    z-index: 1;
}
.statBarWidth {
    height: 20px;
    position: absolute;
    z-index: 0;
    border-radius: 4px;
}

.statFlexContainerH {
    display: flex;
    flex-flow: row nowrap;
    justify-content: center;
    align-items: center;
    -webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    break-inside: avoid;
}
.statFlexContainerSingle {
    display: flex;
    display: -webkit-flex;
    display: -ms-flexbox;
    flex-wrap: wrap;
    overflow: hidden;
    width: 50%;
}
/* ----------- Guide Pages Table ------------ */
.pageTable {
    border: 1px solid darkgray;
    background: floralwhite;
    border-collapse: collapse;
    width: 100%;
}
.pageTable thead {
    background: lightcyan;
}
.pageTable th {
    text-align: center;
    font-size: 1.2em;
}
.pageTable tr {
    border-bottom: 1px solid lightgray;
}
.pageTable td {
    text-align: center;
    font-size: 1.1em;
    padding: 5px;
}

.pageTableH {
    background: floralwhite;
    border-collapse: collapse;
    width: 90%;
    margin: 0 5% 2% 0;
}
.pageTableH tr {
    border: 1px solid darkgray;
}
.pageTableH th {
    background: lightcyan;
    font-size: 1.2em;
    text-align: center;
}
.pageTableH td {
    border: 1px solid darkgray;
    text-align: center;
    font-size: 1em;
    padding: 5px;
    width: 50%;
}
/* ----------- Page Math ------------- */
.mathContainer {
    overflow-x: auto;
}
.mathBlockquote {
    background-color: moccasin;
    border: 2px solid black;
    padding: 5px;
    border-radius: 10px;
    width: auto;
}

/* ----------- Glossary -------------- */
.glossaryTerm {
    margin: 0;
}









/* --------------- Page Image IDs ------------------ */
.infographicImg {
    width: 50vw;
    min-width: 650px;
    padding: 10px 0 20px 0;
}
#unovaStoneImg {
    width: 10vw;
    min-width: 100px;
}
.pageBodyImg {
    margin: auto;
}
.dustLevelChartImg {
    margin-left: 1%;
    width: 40vw;
    max-width: 179px;
}
#floorFunctionImg {
    width: 20%;
    min-width: 160px;
}
#machampDialgaBulkpointImg {
    width: 30vw;
    min-width: 300px;
}
.levelCPMChartImg {
    margin-left: 1%;
    width: 40vw;
    max-width: 179px;
}
#rayquazaMovesetImg {
    width: 25%;
    min-width: 200px;
}
#breloomDodgingGif {
    width: 50vw;
    max-width: 280px;
    min-width: 210px;
}
#daily7DayCatchImg {
    width: 50vw;
    max-width: 280px;
    min-width: 170px;
}
#daily7DaySpinImg {
    width: 50vw;
    max-width: 280px;
    min-width: 170px;
}
#dailyFreeRaidPassImg {
    width: 30vw;
    max-width: 200px;
    min-width: 100px;
}
#dailyResearchImg {
    width: 50vw;
    max-width: 280px;
    min-width: 170px;
}
#dailyGymCoinsImg {
    width: 50vw;
    max-width: 280px;
    min-width: 170px;
}
#dailyTeamLeaderBattleImg {
    width: 50vw;
    max-width: 280px;
    min-width: 170px;
}
#dailyGoSnapshotImg {
    width: 50vw;
    max-width: 280px;
    min-width: 170px;
}
#TRHeaderImg {
    width: 40vw;
    max-width: 500px;
    min-width: 200px;
}
#TRStopGif {
    width: 50vw;
    max-width: 500px;
    min-width: 200px;
}
#TRShadowSnorlaxImg, #TRPurifiedSnorlaxImg, #TRPurifiedLuckyPokemonImg {
    width: 40vw;
    max-width: 350px;
    min-width: 200px;
}
#fastCatchGif {
    width: 50vw;
    max-width: 280px;
    min-width: 210px;
}

#contactHeaderImg {
    width: 15vw;
    max-width: 280px;
    min-width: 150px;
}



/* -------------- Contact Me Page -------------- */
.contactList {
    margin: 2vw 0 2vw 0;
    padding: 10px;
}
.fa-reddit {
    color: orangered;
}
.fa-twitter {
    color: skyblue;
}
.fa-facebook {
    color: blue;
}
.contactListItem {
    display: inline-block;
    margin-right: 5vw;
}




























/* ======================================================= Phone Screens (860px) =================================================================== */

@media only screen and (max-width: 965px){
    footer {
        margin: 20vh 5vw 5% 5vw;
    }

    /* Phone Navigation Bar */
    #navBar {
        min-width: 225px;

    }
    #navBarContainer{
        margin-left: 5vw; 
    }
    .navIndex {
        display: inline-block;
        /*margin-right: 8vw;*/
        margin: 0;
        font-size: 25px;
        font-weight: 600;
        
    }
    
    /* Hide desktop navigation bar */
    .navHidden {
        display: none;
    }

    /* ------------------------ Mobile navigation menu ----------------------- */
    .mobileNavBarContainer {
        display: inline-flex;
        flex-flow: row wrap;
        align-items: center;
        justify-content: flex-end;
        float: right;
        margin-right: 5vw;
        width: 95%;
    }

    .hamburger {
        display: inline-flex;
        align-items: center;
        float: right;
        margin-right: 5vw;
        font-size: 25px;
        cursor: pointer;
    }
    #mobileNavList{
        list-style-type: none;
        background: moccasin;
        width: 100%;
        padding:0;
        margin-bottom: 3%;
        text-align: right;
        font-size: 30px;
        font-weight: 600;
        transition: margin-top 0.5s ease-in-out;

    }
    #mobileNavList a:link, a:visited {
        color:black;
        text-decoration: none;
    }
    #mobileNavList a:hover {
        color: white;
    }
    #mobileNavList li {
        border-bottom: 1px solid black;
        padding: 10px;
    }
    .menuHidden{
        box-shadow: 5px 5px 5px 0 rgba(0,0,0,0.5);
        border-radius: 10px 0 10px 10px;
        margin-top: -15em;
    }
    .menuDisplay {
        box-shadow: 5px 5px 5px 0 rgba(0,0,0,0.5);
        border-radius: 10px 0 10px 10px;
        margin-top: 0;
    }

    /* ----------------------- Phone Home Page --------------------- */
    #wrapperHome {
        width:98%;
        margin-left: 5vw;
        column-count:2;
        column-width: 480px;
    }
    .eventBoxRight{
        text-align:right;
        width: 75%;
    }
    .eventImg {
        width: 80px; 
        height: 80px;
    }
    .eventBoxPage {
        width: auto;
    }
    /* -------------------------Phone Site Page Wrapper -----------------*/
    #wrapperPage {
        max-width: 93%;
        margin-left: 5vw;
        margin-bottom: 10%;
    }
    /* ------------------------ Phone Sub-Page Content Wrapper(s) & other misc. stuff -------*/
    #pageContentWrapper {
        width: 99%;
        margin-top: 5%;
    }
    .pageSectionText {
        width: 100%;
        margin-bottom: 0.5%;
    }
    .pageSectionList {
        padding-left: 20px;
    }
    .pageSectionWrapper a {
        color:dodgerblue;
        text-decoration: none;
    }
    .pageSectionWrapper a:hover {
        color: darkblue;
    }
    .pageSectionWrapperIndent {
        width: 100%;
        margin-left: 0;

    }
    .headerText a {
        text-decoration: none;
        color: dodgerblue;
    }
    .headerText a:hover {
        text-decoration: none;
        color: darkblue;
    }
    .pageBlockquote {
        margin: 0;
    }
    .mathBlockquote {
        margin: 0;
        width: 95%;
    }
    /* -------------------------- Phone Eggs ---------------------------- */
    .eggChart {
        margin-bottom: 6%;
    }
    .eggHatch {
        width: 20vw;
        min-width: 100px; 
    }
    .eggPokemonName {
        font-size: 0.9em;
        font-weight: 500;
    }
    .eggCPRange {
        font-size: 0.9em;
    }

    /* --------------------------- Phone Raids --------------------------- */
    .raidChart {
        margin-bottom: 6%;
    }
    .raidBoss {
        width: 15vw;
        min-width: 160px;
    }
    .raidPokemonName {
        
        font-size: 0.9em;
    }
    .raidWeather {
        padding: 0;
    }
    .raidWeather1 {
        width: 30px;
    }
    .raidWeather2 {
        width: 30px;
    }
    .raidCPLeft {
        /*padding: 0;
        width: auto;*/
        font-size: 0.7em;
    }
    .raidCPRight {
/*      width: 49.5%;
        padding: 0;*/
        font-size: 0.7em;
    }
    .raidCP, .raidBCP {
        padding: 0;
    }
    
    /* ------------------------------ Phone Research ---------------------- */
    .taskHeaderRow {
        display: none;
    }
    .researchHR {
        visibility: hidden;
    }
    .taskGroup {
        min-width: 0;
        margin-bottom: 10vw;
    }
    .quest {
        min-width: 0;
        flex-flow: column nowrap;
    }
    .questTask {
        width: 100%;
    }
    .questTaskText {
        padding: 0;
        margin: 0;
        border-bottom: 1px solid silver;
        font-size: 1em;
        background-color: white;
        /*border-left: 3px solid red;*/
        border-radius: 5px;
    }
    .questRewardWrap {
        justify-content: center;
        flex-flow: row wrap;
    }
    .questReward {
        min-width: 110px;
    }
    .questRewardName {
        font-weight: 500;
    }
    /* ----------------- Phone Shinies -------------------- */
    .shinyChart {
        margin-bottom: 6%;
    }
    .shinyPokemon {
        width: 20vw;
        min-width: 100px;
    }
    .shinyPokemonName {
        font-size: 0.9em;
        font-weight: 600;
  
    }
    .shinyPokemonImg {
        height: 80%;
        width: 80%;
    }
    /* ------------------ Phone Raid Guides ----------------------- */
    .guideHomeListItem {
        margin-top: 2%;
    }
    .raidGuidePokemon {
        width: 10vw;
        min-width: 135px;
        margin-right: 1%;

    }
    .raidGuideMoveName {
        font-size: 0.8em;
        font-weight: 500;
        padding: 0 0 0 3px;
    }

    /* ----------------- Phone General Raiding Guides ----------------- */
    /* ----------- PvE Attacker Tier List ------------------- */
    .pveATLPokemon {
        width: 10vw;
        min-width: 135px;
    }
    .pveATLMoveName {
        font-size: 0.8em;
        font-weight: 500;
    }
    /* ---------------- Phone Pokemon Stats ------------------- */
    .statFlexColumn p {
        width: 90%;
    }
    .statFlexContainerSingle {
        width: 100%;
    }
    /* ------------------- Phone Pictures ---------------------- */
    .infographicImg {
        width: 90vw;
        min-width: 300px;
        padding: 10px 0 20px 0;
    }
}
