@media screen and (max-width: 979px) {
 .mysmall,#menubtn {
 display:block;
 }
 .mylarge{
 display:none;
 }
 #mymenu {
 position: relative;
 top: 0px !important;
 left: 0px !important;
 }
}

@media screen and (min-width: 979px) {
 .mysmall,#menubtn {
 display:none;
 }
 .mylarge {
 display:block;
 }
 #mymenu {
 position: absolute !important;
 top: -9999px !important;
 left: -9999px !important;
 }
}

#mymenu {
all:initial;
width:200px;
}

#mymenu a {
background-color:#00407a;
color:white;
display:block;
padding:8px;
text-decoration:none;
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
}

ul.mylist, {
list-style: none;
margin-left:0;
padding-left:0;
}

.mylist li {
  padding-left:0;
  margin-bottom:-0.25em;
  margin-left:-1.25em;
  text-indent:-1em;
  display:block;
}

.mylist li:before {

  content:"\203a";
  padding:0.25em;
  font-size:130%;
  color:#2596be;
}

p.all,span.all {
background-image: url("img/photos.png");
width:75px;
height:100px;
border:none;
display:inline-block;
overflow:hidden;
transition:width 0s;
margin:auto;
display:table;
}

.myblue {
display: flex;
flex-wrap: wrap;
background-color:#d4e7f3;
max-width:780px;
padding:20px;
}

.myleft {
float:left;
}

.myright {
float:right;
}

span.jr {
background-position: 0px -100px;
}
p.jr,span.jr:hover { 
background-position: 0px 0px;
}

span.ph {
background-position: -75px -100px;
}
p.ph,span.ph:hover {
background-position: -75px 0px;
}

span.mf {
background-position: -150px -100px;
}
p.mf,span.mf:hover {
background-position: -150px 0px;
}

span.el {
background-position: -225px -100px;
}
p.el,span.el:hover {
background-position: -225px 0px;
}

span.ava {
background-position: -300px -100px;
}
p.ava,span.ava:hover {
background-position: -300px 0px;
}

span.vp {
background-position: -375px -100px;
}
p.vp,span.vp:hover {
background-position: -375px 0px;
}

span.pv {
background-position: -450px -100px;
}
p.pv,span.pv:hover {
background-position: -450px 0px;
}

figcaption {
text-align:center;
font-size: 0.9em;
}

figure {
float:left;
width:145px;
margin:0px;
padding:0px;
}

img.educimg {
padding:0px;
margin-right:10px;
width:75px;
height:75px;
float:left;
border:1px solid blue;
}

div.myrow {
position:relative;
overflow:hidden;
z-index:90;
margin-top:10px;
}