body 
{
color:#2a2a2a;
background-color:#ffffff;
text-align:center;
font-family:Verdana, Geneva, sans-serif;
font-size:1em;
margin: 0;
padding: 0;
width: 100%;
max-width: 64em;
margin-left: auto;
margin-right: auto;
}

p
{
color:#2a2a2a;
font-family:Verdana, Geneva, sans-serif;
font-size:1em;
text-align:left;
}

#header 
{
height:auto;
min-height:6.25em;
height:auto !important;
background-color: #6aa0bf;
margin:0px;
padding:1px;
}

.title
{
margin-left: 13%;
margin-right: 47%;
font-size:1em;
line-height:1em;
}

.title-plus
{
font-size: 2.5em;
line-height:1em;
}

@media screen and (max-width:500px)
{
.title-plus
{
font-size:11vw;
}
}


#nav 
{
position: sticky;
top: 0;
z-index: 2;
float:left;
height: auto;
width: 100%;
background-color:#2c445c;
}

.midtray
{
float:left;
width:auto;
height:auto;
margin-left:13%;
margin-right:auto;
}

@media screen and (max-width:500px)
{
.midtray
{
margin-left:10%;
}
}


ul
{
list-style-type: none;
text-align:center;
height:auto;
width:auto;
padding:0;
margin:0;
}

li
{
float:left;
height:auto;
}

.list-norm
{
text-align:left;
line-height:auto;
float: none;
padding-left:.5em;
padding-right:.5em;
}

.list-bold
{
text-align:left;
line-height:auto;
float: none;
font-size:1.25em;
}

.button-style
{
display: block;
box-sizing:border-box;
padding: 0.325em;
padding-left: 1.25vw;
padding-right: 1.25vw;
font-size:1.25em;
height:auto;
margin:0;
color: #eef3f9;
text-decoration: none;
background-color: #335372;
border-left: 1px solid #2e4964;
border-right: 1px solid #273c51;
transition: 0.3s
}

@media screen and (max-width:500px)
{
.button-style
{
font-size:5vw;
}
}

.button-style:hover
{
background-color:#162433;
border-left: 1px solid #1c2c3c;
border-right: 1px solid #1c2c3c;
}


.modal
{
display: none;
position: fixed;
z-index: 3;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
overflow: auto;
background-color:#2b2c2d;
}

.modal-content
{
position: relative;
margin: auto;
padding: 0;
width: 90%;
max-width: 1200px;
}

.close
{
color: white;
position: fixed;
top: 10px;
right: 25px;
font-size: 35px;
font-weight: bold;
}

.close:hover,
.close:focus
{
color: #999
text-decoration: none;
cursor: pointer;
}

.mySlides
{
display: none;
}

.prev,
.next
{
cursor: pointer;
position: fixed; 
top: 50%;
width: auto;
padding: 16px;
margin-top: -50px;
color: white;
font-weight: bold;
font-size: 20px;
transition: 0.6s ease;
border-radius: 0 3px 3px 0;
user-select: none;
-webkit-user-select: none;
background-color: rgba(1,1,1,0.2);
}

.prev:hover,
.next:hover
{
background-color: rgba(0, 0, 0, 0.8);
}

.numbertext
{
color: #f2f2f2;
font-size: 12px;
padding: 8px 12px;
position: absolute;
top: 0;
}

.next
{
right: 0;
border-radius: 3px 0 0 3px;
}

.prev
{
left: 0;
border-radius: 3px 0 0 3px;
}


#noscrip
{
width:auto;
margin:0;
margin-right:5%;
margin-left:5%;
padding:0;
}

#thumbtray
{
width:auto;
margin:0;
margin-right:5%;
margin-left:5%;
padding:0;
}

.prime-tray
{
width:auto;
margin:0;
margin-right:5%;
margin-left:5%;
padding:0;
}

.aux-tray
{
width:auto;
height:auto;
min-height:30%;
margin:0;
padding:1em;
text-align: left;
}

.aux-text
{
width:auto;
padding-left:1em;
padding-right:1em;
margin-top: 0;
margin-bottom: 0;
text-align: left;
}

.aux-boldtext
{
width:auto;
text-align: left;
font-size:1.25em;
line-height:auto;
float: none;
color:#335372;
}

.in-text
{
float: left;
padding:1em;
}

@media screen and (max-width:500px)
{
.in-text
{
float: none;
}
}

.in-text-right
{
float: right;
padding:1em;
}

@media screen and (max-width:500px)
{
.in-text-right
{
float: none;
}
}

.image-blocks
{
float:left;
margin: 0.325em;
padding: 0.325em;
border: 1px solid #999999;
transition: 0.3s
}

img.image-blocks:hover 
{
background-color: #dde4eb;
}

.thumb 
{
width: 20%;
max-height: 8em;
max-width: 8em;
margin: 0.325em;
padding: 0.325em;
border: 1px solid #999999;
transition: 0.3s
}


img.thumb:hover 
{
background-color: #dde4eb;
}

.main-image
{
display: block;
margin: auto;
max-width:95%;
height:auto;
padding:0;
  animation-name: zoom;
  animation-duration: 0.6s;
}

.skill-tray
{
width:auto;
height:auto;
margin:0em;
padding:0;
}

.skill-image
{
height: 5.625em;
width: 5.625em;
}

.skill-holder
{
margin:0;
left-margin:0.325em;
right-margin:0.325em;
padding: 0.325em;
height: auto;
width: auto;
}

.clearer 
{
position: -webkit-sticky;
position: sticky;
border: 1px solid white;
overflow: hidden;
width: 100%;
}

.clearer-wide
{
border: 1em;
background-color: #D7E8F2;
overflow: hidden;
width: 100%;
}

.skill-text
{
width: 8.125em;
left-margin:0.325em;
padding:0;
text-align:center;
font-size:0.875em;
line-height:1.25em;
}

#footer
{
height:auto;
background-color:#ffffff;
margin:0px;
padding:0px;
border: 1px solid #ffffff;
}

.stample
{
text-align: right;
margin-left: auto;
margin-right: 5%;
}

p.stample
{
font-size:0.75em;
text-align:right;
}

.stamp
{
float:right;
width:32px;
height:32px;
margin-left: auto;
margin-right: 5%;
border-left: 5px solid #ffffff;
}

.hidden 
{
display:none;
}