/* ===================== INDEX CONTENT ======================================= */
*.idx-header{ position: fixed; left: 0px; top: 0px; width: 100%; height: 50px; background: rgba(0, 0, 76, 0.5); z-index: 10000; border-bottom: 5px solid #00007F; }
*.phead{ position: absolute; left: 5px; bottom: -14px; font-family: font-head; font-size: 2.5em; color: #FFFFFF; }
*.row-1{ display: table; margin: 50px 0 0 0; padding: 0; width: 100%; }
*.home-back{ width: 100%; height: auto; }
*.steve{ position: absolute; right: 0px; bottom: 0px; width: 140px; height: 125px; }
*.btn-enter{ position: absolute; left: 20%; bottom: 5%; width: 100px; height: 33px; border-radius: 10px; border: 2px solid #FFD105; font-size: 1.2em; color: #FFD105; background: #00007F; transition: background 500ms ease-out, color 500ms ease-out, border-radius 500ms ease-out; }
*.btn-enter:hover{ background: #CCA700; color: #00007F; border-radius: 30px; }
/* ===================== File1 ============================================== */
*.file-header{ position: fixed; left: 0px; top: 0px; z-index: 100; width: 100%; height: 50px; background-color: rgb(0,0,76);}
#wrapper{ display: block; width: 100%; min-width: 300px; max-width: 900px; height: 100%; min-height: 300px; color: #00007F; margin: 10px auto; padding: 10px; border: 1px solid white; }
cite{ color: #0022FF; }
/****************************** DIALOG BOX ************************************/
*.dialog{ display: none; position: fixed; left: 0px; top: 0px; z-index: 1000; width: 100%; height: 100%; min-height: 500px; background-image: url(/images/spacer_white.png); background-repeat: repeat; }
*.dialog-content{ width: 100%; height: 70%; margin: 10px 0px; background-color: #FFFFFF; top: 40px; margin: 0px auto; border: 1px solid #444444; border-radius: 10px; }
/****************************** PAGE SPECIFIC *********************************/
*.index-content{ display: table; width: 99%; min-width: 280px; max-width: 1100px; margin: 0px; padding: 0px; }
*.index-header{ width: 100%; min-width: 300px; height: 50px; margin: 0px; padding: 0px; background-image: url(/images/smb-header_spacer2.png); background-repeat: repeat-x; }
*.index-header_picture{ width: 57px; height: 50px; margin: 0px 0px 0px 10px; float: left; }
*.index-header_signature{ font-size: 1.6em; font-weight: bold; font-family: brushscript; color: #EEEEEE; letter-spacing: 5px; margin: 10px 0px 0px 5px; padding: 0xp; float: left; }
*.index-section{ width: 100%; min-width: 300px; margin: 0px auto; padding: 0px; float: none; }
*.index-aside{ width: 100%; min-width: 300px; margin: 0px auto; padding: 0px; float: none; }
*.personality{ width: 100%; }
*.technology{ width: 100%; }
*.techtopics{ width: 80%; margin: 10px auto; font-size: .9em; color: #0000CC; }
*.projects{ display: table; margin: 0px auto; padding: 0px; }
*.projects a{ width: 75px; height: 75px; float: left; margin: 3px; }
*.projects a img{ width: 75px; height: 75px; }
*.motivations{ width: 100%; margin: 10px auto; }
*.motivations th{ background-color: #0000CC; font-size: 1.1em; font-weight: bold; color: #FFFFFF; width: 100%; }
*.motivations td{ color: #0000CC; width: 100%; font-size: 1em; margin: 0px; padding: 2px 10px; text-align: left; }
*.goals{ font-size: 1em; color: #0000CC; margin: 3px 35px 10px 35px; }
*.goals li{ padding: 3px 0px; }
*.frustrations{ font-size: 1em; color: #0000CC; margin: 3px 35px 10px 35px; }
*.frustrations li{ padding: 3px 0px; }
*.biography{ font-size: 1em; text-align: justify; color: #000000; margin: 5px 10px 20px 10px; padding: 0px 10px; }
/* STATISTICS (LEFT) */
*.stats1{ width: 100%; min-width: 300px; float: none; overflow: hidden; }
*.stats2{ width: 100%; min-width: 300px; float: none; margin-bottom: 10px; overflow: hidden; }
*.table1{ display: table; width: 100%; }
*.col1{ color: #10ACB5; font-size: 1.0em; font-weight: bold; margin: 0px; margin-bottom: 20px; padding: 3px; text-align: right; }
*.col2{ font-size: 1.0em; margin: 0px; padding: 3px; }
/* DETAILS (CENTER */

/* MORE */
*.requestdocs, *.requestdocs img{ width: 168px; height: 30px; margin: 0px auto; cursor: pointer; }
*.in_request{ background-color: #00B5C9; color: #D9D9D9; border-radius: 3px; border: 1px solid #000000; width: 168px; margin: 7px; padding: 4px; float: left; }
#emailinput{ display: none; }
#emailinput p{ display: table; width: 98%; margin: 30px 0px 0px 0px; padding: 0px 3px; font-size: .9em; text-align: justify; }
*.btn_send, *.btn_send img{ width: 35px; height: 35px; border: none; text-decoration: none; margin: 0px; padding: 0px; float: left; cursor: pointer; }

/* ===================== RESPONSIVE SETTINGS ================================ */
@media screen and (min-width : 20em) and (max-height : 23em) {  }
@media screen and (min-width: 20em) and (min-height : 24em) {  }
/* ===== == = === 20em (320px) === = == ========== */
@media screen and (min-width : 320px) { }
/* ===== == = === 30em (480px) === = == ========== */
@media screen and (min-width : 30em) and (min-height : 24em) {
  *.steve{ width: 220px; height: 197px; }
  *.btn-enter{ position: absolute; left: 25%; bottom: 5%; width: 120px; height: 40px; }
  *.index-header_signature{ margin-left: 40px; }
}
/* ===== == = === 37.5em (600px) === = == ======== */
@media screen and (min-width: 37.5em) {
  *.idx-header{ height: 100px; }
  *.file-header{ height: 100px;  }
  *.row-1{ margin-top: 100px; }
  *.phead{ font-size: 4em; left: 20px; bottom: -20px; }
  *.btn-enter{ left: 40%; bottom: 5%; width: 150px; height: 50px; border-radius: 20px; border: 2px solid #FFD105; font-size: 1.2em; }


  *.index-content{ width: 90%; margin: 0px auto; }
  *.index-header{ height: 108px; padding: 0px; background-image: url(/images/smb-header_spacer.png); }
  *.index-header_picture{ width: 124px; height: 108px; margin: 0px 0px 0px 50px; }
  *.index-header_signature{ font-size: 3.0em; margin: 30px 0px 0px 10px;  }
  *.index-section{ width: 75%; float: left; margin: 0px; }
  *.index-aside{ width: 24%; min-width: initial; float: left; margin: 0px; }
  *.col1{ color: #0538A8; }
}
/* ===== == = === 48em (768px) === = == ========== */
@media screen and (min-width : 48em) {
  *.phead{ font-size: 4.5em; bottom: -22px }
  *.steve{ width: 300px; height: 268px; }

  *.stats1{ width: 40%; min-width: initial; float: left; }
  *.stats2{ width: 59%; min-width: initial; float: left; }
  *.dialog{ position: absolute; }
  *.dialog-content{ width: 70%; height: auto; min-height: 400px; top: 50px; margin: 0px auto; border: 2px solid #444444; border-radius: 20px; }
  *.techtopics{ font-size: 1.2em;  }
}
/* ===== == = === 56.25em (900px) ================ */
@media screen and (min-width : 56.25em) {
  *.phead{ font-size: 5em; }
  *.steve{ width: 395px; height: 353px; }

  *.stats1{ width: 34%; min-width: initial; float: left; }
  *.stats2{ width: 65%; min-width: initial; float: left; }
}
/* ===== == = === 68.75em (1100px) =============== */
@media screen and (min-width : 68.75em) {
}
/* ===== == = === 81.25em (1300px) =============== */
@media screen and (min-width : 81.25em) {
}