/* hide the icon that opens and closes the topnav so it only shows on small screens */
nav a.responsiveMenuIcon{
    display: none;
    width: auto;
    color: #aa1b6d;
}

nav a.responsiveMenuIconx{
    display: none;
    width: auto;
    color: #aa1b6d;
}

/* IPAD: When the screen is more than 601 pixels wide and less than 840 pixels wide, make small changes to the menu and page geometry. */

@media only screen and (min-width: 601px) and (max-width: 840px) {
    
    .dots{top:55%;}
    .dots li{margin-right:10px;
    margin-left:5px;}
    
/* SCREEN 1 - ABOUT */
    
 #more{max-width:100%;
    min-height:140vh;
}

/* LEFT */

#lefthand{
max-width:100%;}

#hi{
    font-size:4em;
    margin:40px 48px .1em 48px;
    max-width:100%;
}

#left{
    margin:40px 1% 40px 0px;
    display:flex;
    flex-wrap:wrap;}



.biob{
    margin:32px 48px 0px 48px;}

.bio{
    font-size: 1.25em; 
    margin:32px 48px 0px 48px;
    }
    
.bio1{
    margin:16px 48px 0px 48px;
    }
    
#values-group{max-width:100%;
    margin:16px 48px 0px 48px;
}

.values{
    margin-right:8px;
    border: 1px solid #f4f4f4;
    }


.biosmall{
    margin:0.8em 48px 0px 48px;
    }
    
    #other{
    margin-right: 48px;
        margin-left: 48px;
    margin-bottom: 0px;}
    
.tools{
    margin-left:48px;
    padding-top:16px;
    padding-bottom:20px;
    max-width:100%;
    }
    
    #trade{font-size:1.25em;
    padding-top:10%;}

/* RIGHT */

#righthand{
max-width:100%;
margin:20px 0px 100px 0px;
justify-content: center;
 min-height:50vh;
     align-content:flex-start;
}
    
    
    .carousel{
            width: 50%;
            max-width: 100%;
            position: relative;
            margin: 0 auto;
            overflow: hidden;
        }
    
    
#aussie{
max-width:100%;
margin:0px 20% 0px 20%;
justify-content: center;
}
    
#australia{
    max-width:70%;
    margin:0px 0px 0px 0px;
}

#bridgecap{
    max-width:100%;
    text-align:center;
    padding-left:0px;
}

.contact{max-width:100%;
margin:2em 10px 5% 1em;
}

h6{font-size:2em;
margin-bottom:12px;
margin-top:20px;
}

.link{
 padding-left:54px;
 padding-top:10px;
padding-bottom:10px;
line-height:54px;
 font-size:1.6em;
    }
    
    .link:hover{font-size:1.6em;
        line-height:54px;}
    
    .link:visited{
        font-weight:400;
    }

 
/* FOOTER */
    
    #copyright{
        right:10px;
        font-size:1em;
        bottom:10px;}
    
}

/* IPHONE: When the screen is less than 600 pixels wide, hide top menu nav. Show the icon that opens and closes the nav. Make small changes to the menu and page geometry. */
@media screen and (max-width: 600px) {

    nav a{
        display: none;
    }
    
    
    nav a.responsiveMenuIcon{
        float: right;
        display: block;
        font-size:1.5em;
        font-weight:400;
        margin:26px 10px 30px 0px; 
      padding:0px
        border: none;
        color:#333;
    }

    nav{position: relative;
        margin-top:0px;
        height:80px; 
        margin-right:10px;
   }
    
    
/* customized rules for this site */
    
/* NAVIGATION HEADER */
    
    aside{width:100%;
        bottom:auto;
        padding-top:0;
            }

    
    header{height:80px;}
    
   .home{width:30%;
        height:60px;
        padding-top:20px;
        padding-bottom:20px;
        margin-top:0px;
        margin-bottom:0px;
        margin-left:10px;
        }
    
    #shine{top:100px;}
    
    .dots{top:50%;}
    .dots li{margin-right:10px;
    margin-left:5px;}
    
/* SCREEN 1 - ABOUT */
    
 #lefthand{max-width:100%;}

#hi{
    font-size:2.25em;
    margin:40px 20px .6em 20px;
    max-width:100%;}

#left{
    margin:24px;}
    
#all{
border-bottom: 2px solid #aa1b6d;
}

.biob{
    font-size: 1.5em; 
    margin:0px 0px 0px 0px;}

.bio{
    margin:16px 0px 0px 0px;
    
    }
    
.bio1{
    margin:16px 0px 16px 0px;
    }
    
#values-group{max-width:100%;
display: block;
    margin:16px 0px 0px 0px;
}

.values{
    margin-right:0px;
    margin-bottom:16px;
    border: 1px solid #f4f4f4;
    }

.icon-value{max-width:10%;
}


.biosmall{
    margin:0.8em 0px 0px 0px;
    line-height:130%;
    } 
    
    #other{
    margin-right: 0px;
        margin-left: 0px;
        margin-bottom: 32px;
    } 
    
.tools{
padding-top:0px;
padding-bottom:32px;
margin:32px 0px 0px 0px;
max-width:100%;
display: flex;
height:100px;
        }

#trade{font-size:1em;
    padding-top:6%;
    padding-right:5px;
    }

    
/* RIGHT*/
    
#righthand{
    justify-content:center;
    max-width:100%;
    margin:8px 0px 72px 0px;
    min-height:70vh;
    align-content:flex-start;
}
    
     

#aussie{
max-width:100%;
margin:0px 0px 0px 0px;
justify-content: center;
}
    
#australia{
    max-width:80%;
    margin:0px 0px 0px 0px;
}
#bridgecap{text-align:center;
padding-top:8px;
    max-width:100%;
    padding-left:0px;
}
 
/* CONTACT */
    
    
 .contact{max-width:100%;
     margin:0px 0px 0px 0px;
}

h6{font-size:2em;
    margin-bottom:12px;
    margin-top:40px;}

    #jillian{font-size:1.2em;
    margin-bottom:8px;}
    
   #linkedin{
    background-size:23.8%;}

    #target{
    background-size:30.5%;}

#resume{
    background-size:24.5%;}

    
    .link{font-size:1.3em;}
    
     .link:hover{font-size:1.3em;}
    

    
/* FOOTER */

    #footer{height:50px;}  
    
    #footer p{font-size:.8em;}
    
    #infinity{width:60px;
        margin-bottom:1px;
        margin-top:41px;}
    
    #copyright{
        right:8px;
        font-size:.6em;
        bottom:5px;}

}

/* The "open" class is added to the nav with JavaScript when the icon is clicked. This class makes the links hidden by line 10 above, visible again  */
@media screen and (max-width: 600px) {
   
    
    
    
    nav.open{
        height:200px;
        margin-right:0px;
        display:block;
        position:relative;
        right: 0;
        top: 0;
        float:right;
        background-color: #fff;
   }
    
    
    nav.open a{
        display: block;
        color:#333;
        font-family: 'Montserrat', sans-serif;
        float:none;
        max-height:100%;
        text-align:right;
        }
    
    nav.open a.responsiveMenuIcon{
        text-decoration: none;
        font-size:1.5em;
        float:right;
        padding:0px;
        margin:26px 20px 0px 20px;
    }
    
    nav.open #reload{
        margin:64px 24px 0px 16px;
        font-size:1em;
        border-bottom:0px solid #aa1b6d;}
    
    nav.open #about{
        margin:12px 24px 0px 16px;
        font-size:1em;}
    
    nav.open #designs{
        margin: 12px 24px 0px 16px;
        font-size:1em;
        }
    
      nav.open #pdf{
        margin: 12px 24px 0px 16px;
        font-size:1em;
        }
    
      nav.open #linked{
        margin: 12px 24px 24px 16px;
        font-size:1em;
        }
    

  
    nav.open a:hover{
        border: none;
        text-decoration:none;
        font-family: 'Montserrat', sans-serif;
        }
   

    nav.open a.responsiveMenuIcon:hover{cursor: pointer;}
    
}
