/* LAYOUT CONTAINERS      0013 */
/* PAGE CONTAINERS        0216 */
/* MAIN MENU              0546 */
/* BOXES                  0678 */
/* BOXES TWO              0812 */
/* BOXES ONE              0877 */
/* CONTACT PAGE           1282 */
/* HIDDEN ARCHIEVES       1540 */
/* SPANS, ETC...          1627 */

/* LAYOUT CONTAINERS */
html
  {width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  font-size: 62.5%;
  box-sizing: border-box;}
body
  {background-color: #000000;
  background-size: cover;
  background-position: center center;
  background-attachment: fixed;
  width: 100%;
  height: 100vh;
  min-height: 100%;
  padding: 0;
  margin: 0;}
#container_main
  {box-sizing: border-box;
  font-size: 0;
  position: relative;
  width: 100%;
  min-height: 100vh;}
header
  {box-sizing: border-box;
  position: fixed;
  width: 100%;
  height: 80px;
  z-index: 20;
  top: 0;
  margin: 0;
  padding: 0;
  font-size: 0;
  background-color: #1D2125;
  border-width: 1px;
  border-top-width: 0px;
  border-left-width: 0px;
  border-right-width: 0px;
  border-color: #976262;
  border-style: solid;}
.header-container
  {box-sizing: border-box;
  width: 100%;
  height: 100%;
  display: inline-block;
  margin: 0;
  padding: 0;
  font-size: 0;}
.header-container-left
  {box-sizing: border-box;
  width: 760px;
  height: 100%;
  display: inline-flex;
  float: left;
  margin: 0;
  padding: 0;
  padding-left: 2%;
  font-size: 0;}
.header-container-left img
  {box-sizing: border-box;
  width: 60px;
  height: 60px;
  opacity: 0.8;
  margin: 0;
  margin-top: 10px;
  padding: 0;
  font-size: 0;}
header h1
  {box-sizing: border-box;
  width: auto;
  height: auto;
  font-size: 40px;
  font-size: 4.0rem;
  font-family: 'gruppo';
  margin: 0;
  margin-top: auto;
  margin-bottom: auto;
  padding: 0;
  padding-left: 1%;
  color: #E0E0E0;}
.header-container-right
  {box-sizing: border-box;
  background-color: #1D2125;
  justify-content: right;
  width: 715px;
  height: 100%;
  display: inline-flex;
  float: right;
  margin: 0;
  padding-top: 25px;
  padding-right: 2%;
  font-size: 0;}
.header-container-right a
  {box-sizing: border-box;
  background-color: rgb(61, 89, 116, 0.5);
  display: block;
  width: auto;
  height: 30px;
  text-decoration: none;
  margin: 0;
  padding: 0;
  margin-right: 2%;
  padding: 2%;
  padding-top: 5px;
  font-family: 'play', Arial;
  font-size: 16px;
  font-size: 1.6rem;
  color: #B1A9A9;
  border-style: solid;
  border-width: 1px;
  border-radius: 5px;
  border-color: #8DA0B3;
  transition-duration: .2s;}
.header-container-right a:hover
  {opacity: 1.0;
   color: #FFFFFF;
   background-color: rgb(61, 89, 116, 0.9);
   border-color: #E0E0E0;}
.header-archieves-right
  {box-sizing: border-box;
  background-color: #1D2125;
  justify-content: right;
  width: 700px;
  height: 100%;
  display: inline-flex;
  float: right;
  margin: 0;
  padding-top: 25px;
  padding-right: 2%;
  font-size: 0;}
.header-archieves-right a
  {box-sizing: border-box;
  background-color: rgb(61, 89, 116, 0.5);
  display: block;
  width: auto;
  height: 30px;
  text-decoration: none;
  margin: 0;
  padding: 0;
  margin-right: 2%;
  padding: 2%;
  padding-top: 5px;
  font-family: 'play';
  font-size: 16px;
  font-size: 1.6rem;
  color: #B1A9A9;
  border-style: solid;
  border-width: 1px;
  border-radius: 5px;
  border-color: #8DA0B3;
  transition-duration: .2s;}
.header-archieves-right a:hover
  {opacity: 1.0;
  color: #FFFFFF;
  background-color: rgb(61, 89, 116, 0.9);
  border-color: #E0E0E0;}
.container
  {box-sizing: border-box;
  width: 100%;
  /*height: 7000px;*/
  height: auto;
  background: linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.5)),url('/static/images/backgrounds/moon.png');
  background-size: cover;
  background-position: 50% 0%;
  background-attachment: fixed;
  background-repeat: no-repeat;
  padding-top: 80px;
  padding-bottom: 80px;
  margin: 0;
  overflow: hidden;}
footer
  {box-sizing: border-box;
  position: absolute;
  background-color: #1D2125;
  text-align: center;
  clear: both;
  height: 80px;
  width: 100%;
  bottom: 0;
  margin: 0;
  padding: 0;
  padding-top: 33px;
  border-width: 1px;
  border-bottom-width: 0px;
  border-left-width: 0px;
  border-right-width: 0px;
  border-color: #976262;
  border-style: solid;
  color: #E0E0E0;}
footer a
  {text-decoration: none;}
footer h4
  {box-sizing: border-box;
  font-family: 'gruppo';
  display: inline-block;
  width: 90%;
  margin-left: 5%;
  margin: 0;
  padding: 0;
  font-size: 14px;
  font-size: 1.4rem;
  color: #E0E0E0;}

/* PAGE CONTAINERS */
.feature
  {box-sizing: border-box;
  background: url('/static/images/backgrounds/abstract-black.png');
  background-size: cover;
  background-position: top;
  width: 100%;
  height: 102vh;
  /*min-height: 740px;*/
  position: relative;
  display: flex;
  flex-direction: column;
  border-style: solid;
  border-color: grey;
  border-width: 1px;
  border-top-width: 0px;
  border-left-width: 0px;
  border-right-width: 0px;
  margin: 0;
  padding: 0;
  padding-top: 80px;
  font-size: 0;}
.feature-center
  {box-sizing: border-box;
  width: 100%;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  padding: 2%;}
.feature-center img
  {width: 14%;
   margin-left: 43%;}
.feature-center h4
  {box-sizing: border-box;
   width: 100%;
   text-align: center;
   margin: 0;
   margin-top: 1%;
   padding: 0;
   color: #D2ACAC;
   font-family: marck-script;
   font-size: 40px;
   font-size: 4.0rem;}
.dual-buttons
  {box-sizing: border-box;
   width: 30%;
   display: inline-block;
   margin: 0;
   margin-left: 35%;
   padding: 1%;
   font-size: 0;}
.dual-buttons a
  {text-decoration: none;
   width: 100%;}
.dual-buttons h5
  {box-sizing: border-box;
  /*background-color: rgb(117, 120, 88, 0.6);*/
  background-color: rgb(162, 132, 132, 0.5);
  box-shadow: 0px 2px 2px black;
  text-align: center;
  width: 94%;
  height: auto;
  margin: 0;
  margin-left: 3%;
  padding: 3%;
  border-radius: 5px;
  border-style: solid;
  border-top-color: #CCCCCC;
  border-left-color: #CCCCCC;
  border-bottom-color: #333333;
  border-right-color: #333333;
  border-width: 1px;
  font-family: 'gruppo';
  font-size: 20px;
  font-size: 2rem;
  color: #B1A9A9;
  font-weight: bolder;
  transition-duration: 0.2s;}
.dual-buttons h5:hover
  {box-shadow: 0px 1px 1px black;
  background-color: rgb(97, 142, 97, 0.8);
  border-bottom-color: #E0E0E0;
  border-right-color: #E0E0E0;
  color: #FFFFFF;}
.dual-buttons-left
  {box-sizing: border-box;
   width: 50%;
   display: block;
   float: left;
   margin: 0;
   padding: 1%;
   font-size: 0;}
.dual-buttons-right
  {box-sizing: border-box;
   width: 50%;
   display: block;
   float: right;
   margin: 0;
   padding: 1%;
   font-size: 0;}
.single-button
  {box-sizing: border-box;
   width: 30%;
   display: inline-block;
   margin: 0;
   margin-left: 35%;
   padding: 1%;
   font-size: 0;}
.single-button a
  {text-decoration: none;
   width: 100%;}
.single-button h5
  {box-sizing: border-box;
  background-color: rgb(162, 132, 132, 0.5);
  box-shadow: 0px 2px 2px black;
  text-align: center;
  width: 94%;
  height: auto;
  margin: 0;
  margin-left: 3%;
  padding: 3%;
  border-radius: 5px;
  border-style: solid;
  border-top-color: #CCCCCC;
  border-left-color: #CCCCCC;
  border-bottom-color: #333333;
  border-right-color: #333333;
  border-width: 1px;
  font-family: 'gruppo';
  font-size: 20px;
  font-size: 2rem;
  color: #B1A9A9;
  font-weight: bolder;
  transition-duration: 0.2s;}
.single-button h5:hover
  {box-shadow: 0px 1px 1px black;
  background-color: rgb(97, 142, 97, 0.8);
  border-bottom-color: #E0E0E0;
  border-right-color: #E0E0E0;
  color: #FFFFFF;}
.down-arrow
  {box-sizing: border-box;
  width: 100%;
  margin: 0;
  position: absolute;
  bottom: 25px;
  padding: 0;
  text-align: center;
  font-size: 0;}
.down-arrow img
  {box-sizing: border-box;
   height: 40px;
   margin: 0;
   padding: 0;
   font-size: 0;}
/*.feature-form-check
  {box-sizing: border-box;
  background: url('/static/images/backgrounds/abstract-tri.png');
  background-size: auto;
  background-position: right bottom;
  width: 100%;
  height: 100vh;
  border-style: solid;
  border-color: grey;
  border-width: 1px;
  border-top-width: 0px;
  border-left-width: 0px;
  border-right-width: 0px;
  margin: 0;
  padding: 0;
  padding-top: 20vh;
  font-size: 0;}
.feature-form-check-center
  {box-sizing: border-box;
   width: 40%;
   margin-left: auto;
   margin-right: auto;
   padding: 2%;}
.feature-form-check-center img
  {width: 24%;
   margin-left: 38%;}
.feature-form-check-center h4
  {box-sizing: border-box;
   width: 100%;
   text-align: center;
   margin: 0;
   margin-top: 2%;
   padding: 0;
   color: #D2ACAC;
   font-family: marck-script;
   font-size: 30px;
   font-size: 3.0rem;}*/

/* MAIN MENU */
.main-menu
  {box-sizing: border-box;
    /*background-color: blue;*/
  display: block;
  width: 100%;
  margin: 0;
  padding: 2%;
  padding-top: 1%;
  padding-bottom: 0;
  font-size: 0;}
/*.main-menu h2
  {box-sizing: border-box;
  background-color: orange;
  display: block;
  text-decoration: underline;
  margin: 0;
  padding: 0;
  font-family: 'marck-script';
  font-size: 40px;
  font-size: 4.0rem;
  color: #E0E0E0;}*/
.main-menu-items
  {box-sizing: border-box;
  display: inline-block;
  width: 100%;
  height: auto;
  margin: 0;
  margin-top: 0;
  padding: 0;
  padding-top: 1%;
  font-size: 0;}
.main-menu-items-left
  {box-sizing: border-box;
  border-radius: 10px;
  display: block;
  float: left;
  width: auto;
  margin: 0;
  padding: 0;
  padding-top: 70px;
  font-size: 0;}
.main-menu-items-left a
  {text-decoration: none;}
.main-menu-items-left h5
  {box-sizing: border-box;
  background-color: rgb(117, 120, 88, 0.6);
  border-radius: 10px;
  box-shadow: 0px 2px 2px black;
  margin: 0;
  padding: 20px;
  border-style: solid;
  border-width: 2px;
  border-bottom-width: 1px;
  border-right-width: 1px;
  border-color: #E0E0E0;
  font-family: 'play';
  font-size: 20px;
  font-size: 2rem;
  color: #B1A9A9;
  transition-duration: 0.1s;}
.main-menu-items-left h5:hover
  {box-shadow: 0px 1px 1px black;
  background-color: rgb(97, 142, 97, 0.8);
  color: #FFFFFF;}
.main-menu-items-right
  {box-sizing: border-box;
  display: block;
  float: right;
  width: 93%;
  margin: 0;
  padding: 2%;
  padding-top: 1%;
  font-size: 0;}
.main-menu-items h3
  {box-sizing: border-box;
  width: 460px;
  display: block;
  margin: 0;
  padding: 1%;
  padding-top: 0;
  padding-left: 0;
  text-decoration: underline;
  font-family: 'orbitron';
  font-size: 22px;
  font-size: 2.2rem;
  color: #C14242;}
.main-menu-items p
  {box-sizing: border-box;
  width: 70%;
  margin: 0;
  padding: 0;
  padding-top: 1%;
  font-family: 'gruppo';
  font-size: 18px;
  font-size: 2rem;
  font-weight: bold;
  color: #998E8E;}
.sub-page-links
  {box-sizing: border-box;
  width: 100%;
  display: block;
  margin: 0;
  margin-top: 1%;
  padding: 0;
  font-size: 0;}
.sub-page-links a
  {box-sizing: border-box;
  text-decoration: none;
  width: auto;
  margin: 0;
  padding: 0;
  font-size: 0;}
.sub-page-links h6
  {box-sizing: border-box;
  width: 300px;
  background-color: rgb(71, 104, 138, 0.4);
  border-radius: 5px;
  border-width: 1px;
  border-color: grey;
  box-shadow: 1px 1px #2068B0;
  text-align: left;
  margin: 0;
  margin-top: 1%;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 10px;
  color: #47688A;
  color: #489EF3;
  font-weight: bolder;
  font-family: 'gruppo';
  font-size: 20px;
  font-size: 2.0rem;
  transition-duration: 0.2s;}
.sub-page-links h6:hover
  {background-color: rgb(63, 127, 191, 0.6);
  box-shadow: 0px 0px #2068B0;
  color: #FFFFFF;}
.sub-page-links p
  {padding-top: 0.5%;}

/* BOXES */
.box
  {box-sizing: border-box;
  background-color: #1D2125;
  box-shadow: 5px 5px 5px #000000;
  border-radius: 10px;
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  font-size: 0;
  transition-duration: .2s;}
.box:hover
  {box-shadow: 3px 3px 3px #000000;}
.box h3
  {background-color: rgb(59, 71, 82, 0.4);
  width: 80%;
  height: auto;
  margin-left: 10%;
  margin-top: 0;
  padding: 1%;
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
  text-align: center;
  /*text-decoration-line: underline;*/
  font-family: 'orbitron';
  border-style: solid;
  border-width: 1px;
  border-color: #58636E;
  border-top-width: 0px;
  box-shadow: 3px 3px 3px #000000;
  font-size: 22px;
  font-size: 2.2rem;
  color: #C0A9A9;}
.box h4
  {box-sizing: border-box;
  display: inline-block;
  background-color: rgb(0, 0, 0, 0.3);
  font-family: 'gruppo';
  width: auto;
  margin: 0;
  padding: 1%;
  border-radius: 15px;
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
  font-size: 23px;
  font-size: 2.3rem;
  color: #3F7FBF;}
.box h5
  {box-sizing: border-box;
  background-color: rgb(176, 103, 103, 0.5);
  text-align: center;
  font-family: 'bai-jamjuree', sans-serif;
  display: block;
  width: 100%;
  margin: 0;
  margin-top: 5%;
  padding: 0;
  padding-top: 1%;
  padding-bottom: 1%;
  border-style: solid;
  border-width: 2px;
  border-color: #B27A7A;
  border-bottom-width: 0px;
  border-left-width: 0px;
  border-right-width: 0px;
  font-size: 16px;
  font-size: 1.6rem;
  color: #A59B9B;
  transition-duration: .2s;}
.box h5:hover
  {background-color: rgb(176, 103, 103, 0.6);
  color: #FFFFFF;}
.box h6
  {box-sizing: border-box;
  width: 100%;
  height: auto;
  color: #D2D6D1;
  margin: 0;
  margin-top: 5%;
  padding: 0;
  text-align: center;
  font-family: 'gruppo', cursive;
  font-size: 20px;
  font-size: 2rem;}
.box p
  {box-sizing: border-box;
  width: 50%;
  height: auto;
  color: #E0E0E0;
  margin: 0;
  margin-top: 2%;
  margin-left: 2%;
  padding: 0;
  text-align: left;
  font-family: 'bai-jamjuree', cursive;
  font-size: 20px;
  font-size: 2.0rem;}
.box a
  {width: 100%;
   text-decoration: none;}
.box dl
  {box-sizing: border-box;
  display: block;
  width: 80%;
  margin: 0;
  margin-top: 1%;
  margin-left: 2%;
  padding: 0;}
.box dt
  {box-sizing: border-box;
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  padding-bottom: 5px;
  color: #C14242;
  font-family: 'gruppo', cursive;
  text-decoration: underline;
  font-weight: bolder;
  font-size: 22px;
  font-size: 2.2rem;}
.box dd
  {box-sizing: border-box;
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  color: #E0E0E0;
  font-family: 'bai-jamjuree';
  font-size: 20px;
  font-size: 2rem;}

  /* BOXES TWO */
.boxes-two
  {box-sizing: border-box;
  display: inline-block;
  width: 90%;
  height: auto;
  margin: 0;
  margin-left: 5%;
  margin-top: 5%;
  padding: 0;
  font-size: 0;}
.boxes-two p
  {text-align: center;
   margin-top: 2%;}
.boxes-two img
  {width: 20%;
  opacity: .6;
  margin-left: 40%;
  margin-top: 5%;
  /*background-color: #FFFFFF;*/
  transition-duration: .2s;}
.boxes-two img:hover
  {opacity: .8;}
.left-box
  {display: block;
  width: 48%;
  float: left;
  margin: 0;
  font-size: 0;}
.right-box
  {width: 48%;
  float: right;
  margin: 0;
  font-size: 0;}
.language
  {box-sizing: border-box;
   width: 100%;
   margin: 0;
   padding: 0;
   font-size: 0;}
.language h3
  {box-sizing: border-box;
   background-color: rgb(0, 0, 0, 0.7);
   width: auto;
   opacity: 0.4;
   margin: 0;
   padding: 2%;
   border-bottom-width: 0px;
   border-left-width: 0px;
   border-right-width: 0px;
   border-radius: 0;
   color: #7FB299;
   font-size: 60px;
   font-size: 6rem;
   text-decoration: none;
   text-align: center;
   box-shadow: 0px 2px 0px #000000;
   transition-duration: 1.0s;}

/* BOXES ONE */
.boxes-one
  {box-sizing: border-box;
  display: block;
  width: 90%;
  height: auto;
  margin: 0;
  margin-left: 5%;
  margin-top: 5%;
  padding: 0;
  font-size: 0;}

.dialog-with-picture
  {box-sizing: border-box;
  width: 80%;
  height: auto;
  display: inline-block;
  margin: 0;
  margin-left: 10%;
  margin-top: 5%;
  padding: 0;
  padding-top: 2%;
  padding-bottom: 2%;
  font-size: 0;}
.dialog-with-picture-left
  {box-sizing: border-box;
  width: 16%;
  display: block;
  float: left;
  margin: 0;
  padding: 0;
  font-size: 0;}
.dialog-with-picture-left img
  {box-sizing: border-box;
  width: 100%;}
.dialog-with-picture-right
  {box-sizing: border-box;
  text-align: right;
  width: 80%;
  display: block;
  float: right;
  margin: 0;
  padding: 0;
  font-size: 0;}
.dialog-with-picture-right h3
  {all: initial;
  box-sizing: border-box;
  display: block;
  width: 80%;
  margin: 0;
  padding: 0;
  padding-bottom: 0.5%;
  text-align: left;
  color: #8697AB;
  font-family: orbitron;
  font-size: 24px;
  font-size: 2.4rem;}
.dialog-with-picture-right p
  {box-sizing: border-box;
  background-color: transparent;
  width: 100%;
  height: auto;
  color: #B1A9A9;
  margin: 0;
  padding: 0;
  text-align: left;
  font-family: 'bai-jamjuree', cursive;
  font-size: 20px;
  font-size: 2.0rem;}
.dialog-with-picture-right ul
  {box-sizing: border-box;
  width:  100%;
  display: block;
  margin: 0;
  padding: 1%;
  padding-left: 1%;
  font-size: 0;}
.dialog-with-picture-right li
  {box-sizing: border-box;
  background-color: rgb(0, 0, 0, 0.4);
  width:  60%;
  display: block;
  margin: 0;
  margin-top: 1%;
  padding: 1%;
  border-radius: 5px;
  text-align: left;
  font-family: gruppo;
  font-size: 22px;
  font-size: 2.2rem;
  color: #BFBF3F;
  transition-duration: 0.2s;}
.dialog-with-picture-right li:hover
  {background-color: rgb(0, 0, 0, 0.8);
  color: #E0E0E0;}
.dialog-with-picture-right table
  {box-sizing: border-box;
  width: 100%;
  height: auto;
  margin: 0;
  padding: 0;
  font-size: 0;}
.dialog-with-picture-right tr
  {box-sizing: border-box;
  width: 100%;
  height: auto;
  margin: 0;
  padding: 0;
  font-size: 0;}
.dialog-with-picture-right th
  {box-sizing: border-box;
  background-color: rgb(75, 113, 75, 0.3);
  width: auto;
  height: auto;
  margin: 0;
  padding: 0;
  padding: 1%;
  color: #E0E0E0;
  text-align: left;
  font-family: michroma;
  font-size: 17px;
  font-size: 1.7rem;}
.dialog-with-picture-right td
  {box-sizing: border-box;
  background-color: rgb(63, 127, 191, 0.3);
  height: auto;
  margin: 0;
  padding: 0;
  padding: 1%;
  color: #E0E0E0;
  text-align: left;
  font-family: bai-jamjuree;
  font-size: 18px;
  font-size: 1.8rem;}

.general-info
  {box-sizing: border-box;
   width: 80%;
   display: block;
   margin: 0;
   margin-left: 10%;
   padding: 0;
   padding-bottom: 2%;
   font-size: 0;}
.general-info h3
  {all: initial;
  box-sizing: border-box;
  display: block;
  width: 80%;
  margin: 0;
  margin-left: 20%;
  padding: 0;
  text-align: left;
  color: #8697AB;
  font-family: orbitron;
  font-size: 24px;
  font-size: 2.4rem;}
.general-info p
  {all: initial;
  box-sizing: border-box;
  display: block;
  width: 80%;
  margin: 0;
  padding: 0;
  padding-top: 1%;
  margin-left: 20%;
  color: #998E8E;
  font-family: bai-jamjuree;
  font-size: 22px;
  font-size: 2.2rem;}
.general-info ul
  {box-sizing: border-box;
  list-style-type: circle;
  width: 80%;
  margin: 0;
  margin-left: 20%;
  padding: 1%;
  padding-top: 1%;
  padding-left: 2%;
  font-size: 0;}
.general-info li
  {box-sizing: border-box;
  width: 100%;
  display: block;
  margin: 0;
  padding: 1%;
  padding-top: 0;
  color: #998E8E;
  display: list-item;
  font-family: bai-jamjuree;
  font-size: 22px;
  font-size: 2.2rem;}

.process-step
  {box-sizing: border-box;
  display: inline-block;
  width: 70%;
  background-color: rgb(0, 0, 0, 0.4);
  border-radius: 5px;
  margin: 0;
  margin-top: 2%;
  margin-left: 2%;
  padding: 1%;
  font-size: 0;
  transition-duration: 0.2s;}
.process-step table
  {box-sizing: border-box;
  width: 100%;
  height: auto;
  margin: 0;
  padding: 0;
  font-size: 0;}
.process-step tr
  {box-sizing: border-box;
  width: 100%;
  height: auto;
  margin: 0;
  padding: 0;
  font-size: 0;}
.process-step th
  {box-sizing: border-box;
  background-color: rgb(75, 113, 75, 0.3);
  width: auto;
  height: auto;
  margin: 0;
  padding: 0;
  padding: 1%;
  color: #E0E0E0;
  text-align: left;
  font-family: michroma;
  font-size: 17px;
  font-size: 1.7rem;}
.process-step td
  {box-sizing: border-box;
  background-color: rgb(63, 127, 191, 0.3);
  height: auto;
  margin: 0;
  padding: 0;
  padding: 1%;
  color: #E0E0E0;
  font-family: bai-jamjuree;
  font-size: 18px;
  font-size: 1.8rem;}
.process-step:hover
  {background-color: rgb(0, 0, 0, 0.4);}
.process-step img
  {box-sizing: border-box;
  background-color: rgb(0, 0, 0, 0.1);
  width: 100%;
  margin: 0;
  padding: 0;
  font-size: 0;}
.process-step-top
  {box-sizing: border-box;
  display: inline-block;
  width: 100%;
  margin: 0;
  padding: 0;
  font-size: 0;}
.process-step-top-left
  {box-sizing: border-box;
  float: left;
  width: 16%;
  height: auto;
  height: auto;
  display: inline-block;
  margin: 0;
  padding: 1%;
  font-size: 0;}
.process-step-top-left h3
  {box-sizing: border-box;
  background-color: rgb(63, 127, 191, 0.4);
  border-width: 0px;
  text-align: center;
  display: block;
  /*width: 110px;*/
  margin: 0;
  padding: 20px;
  font-family: orbitron;
  box-shadow: none;
  border-radius: 5px;
  border-style: solid;
  border-width: 2px;
  border-color: #3A5672;
  font-size: 40px;
  font-size: 4.0rem;}
.process-step-top-right
  {box-sizing: border-box;
  float: right;
  width: 84%;
  height: auto;
  display: block;
  margin: 0;
  padding: 1%;
  font-size: 0;}
.process-step-top-right h4
  {box-sizing: border-box;
  background-color: transparent;
  display: block;
  width: 100%;
  height: auto;
  margin: 0;
  padding: 0;
  color: #C14242;
  font-family: gruppo;
  font-style: italic;
  font-size: 24px;
  font-size: 2.4rem;}
.process-step-top-right h5
  {box-sizing: border-box;
  background-color: transparent;
  display: block;
  width: 100%;
  height: auto;
  margin: 0;
  margin-top: 2%;
  padding: 0;
  color: #3F7FBF;
  border-width: 0px;
  text-align: left;
  font-family: bai-jamjuree;
  font-style: italic;
  font-size: 20px;
  font-size: 2rem;}
.process-step-top-right p
  {box-sizing: border-box;
  width: 100%;
  color: #B1A9A9;
  margin: 0;
  margin-top: 1%;
  padding: 0;
  text-align: left;
  font-family: 'bai-jamjuree', cursive;
  font-size: 20px;
  font-size: 1.8rem;}
.process-step-top-right img
  {box-sizing: border-box;
  width: 60%;
  margin: 0;
  margin-top: 2%;
  padding: 0;
  font-size: 0;}
.process-step-top-right video
  {border-radius: 10px;
  height: 140px;
  margin: 0;
  margin-top: 2%;
  padding: 0;
  font-size: 0;}
.process-step-top-right ul
  {box-sizing: border-box;
  width: 100%;
  margin: 0;
  padding: 0;
  padding-left: 2%;
  font-size: 0;}
.process-step-top-right li
  {box-sizing: border-box;
  width: auto;
  margin: 0;
  margin-left: 1%;
  padding: 1%;
  font-family: 'gruppo';
  color: #3F7FBF;
  font-size: 20px;
  font-size: 2rem;}
.process-step-top-right a
  {text-decoration: underline;
   color: #3F7FBF;}
.process-step-bottom
  {box-sizing: border-box;
  display: block;
  width: 100%;
  overflow: scroll;
  margin: 0;
  margin-top: 2%;
  padding: 1%;
  font-size: 0;}
.process-step-bottom p
  {width: 100%;
   padding: 0;
   margin: 0;}
.run-command
  {box-sizing: border-box;
  width: 100%;
  margin: 0;
  margin-top: 1%;
  padding: 1%;
  overflow: scroll;
  white-space:nowrap;
  background-color: #1A2127;
  color: #E0E0E0;
  opacity: .7;
  border-style: solid;
  border-color: #525B54;
  border-radius: 4px;
  border-width: 1px;
  font-size: 18px;
  font-size: 1.8rem;
  font-family: 'prompt';
  transition-duration: .2s;}
.run-command:hover
  {background-color: #1A2127;
   color: #DAE6DD;}
.run-command h6
  {box-sizing: border-box;
  text-align: left;
  width: 100%;
  margin: 0;
  padding: 0;
  color: #E0E0E0;
  font-family: play;
  font-style: italic;
  font-size: 18px;
  font-size: 1.8rem;}
.run-command p
  {box-sizing: border-box;
  width: 100%;
  margin: 0;
  padding: 0;
  color: #3FBF7F;
  font-family: play;
  font-size: 18px;
  font-size: 1.8rem;}
pre
  {box-sizing: border-box;
  margin-top: 0;
  margin-bottom: 0;
  padding-bottom: 0;
  font-size: 18px;
  font-size: 1.8rem;
  font-family: 'prompt';
  transition-duration: .2s;}

/* CONTACT PAGE */
.contact-info
  {box-sizing: border-box;
  width: 100%;
  display: inline-block;
  height: auto;
  margin: 0;
  padding: 5%;
  padding-top: 7%;
  padding-bottom: 0;
  font-size: 0;}
/* CONTACT INFO */
.contact-info-left
  {box-sizing: border-box;
    /*background-color: grey;*/
  width: 50%;
  height: auto;
  display: block;
  float: left;
  margin: 0;
  padding: 0;
  padding-top: 4%;
  font-size: 0;}
.contact-info-left h3
  {width: 100%;
  margin: 0;
  margin-top: 5%;
  padding-bottom: 2%;
  font-size: 22px;
  font-size: 2.2rem;
  font-family: 'gruppo', cursive;
  text-decoration: underline;
  color: #8E4747;}
.contact-info-left a
  {display: block;
  text-decoration: none;
  font-family: 'michroma', sans-serif;
  color: #E0E0E0;
  width: auto;
  margin: 0;
  padding: 0;
  padding-top: 1%;
  font-size: 16px;
  font-size: 1.6rem;}
.contact-info-general
  {box-sizing: border-box;
  background-color: rgba(0, 0, 0, 0.5);
  border-style: solid;
  border-color: #7D9589;
  border-width: 1px;
  border-radius: 10px;
  display: block;
  width: 70%;
  margin: 0;
  padding: 3%;
  padding-top: 0;
  font-size: 0;}
.social-links
  {box-sizing: border-box;
    /*background-color: green;*/
  width: 100%;
  display: inline-flex;
  margin: 0;
  padding: 0;
  font-size: 0;}
.social-links img
  {box-sizing: border-box;
  display: block;
  opacity: 0.7;
  width: 70px;
  margin: 0;
  padding: 0;
  padding-right: 20%;
  font-size: 0;
  transition-duration: .2s;}
.social-links img:hover
  {opacity: 1.0;}

/* CONTACT FORM */
.contact-info-right
  {box-sizing: border-box;
  width: 50%;
  height: auto;
  display: block;
  float: right;
  margin: 0;
  padding: 0;
  font-size: 0;}
.form-container
  {box-sizing: border-box;
  width: 100%;
  border-radius: 3px;
  color: #ffffff;
  font-size: 16px;
  font-size: 1.6rem;
  font-family: 'Play', sans-serif;
  margin: 0;
  padding: 0;
  font-size: 0;}
.form-container legend
  {color: #E0E0E0;
  background-color: #5D4646;
  width: 50%;
  text-align: center;
  margin-left: 25%;
  padding: 1%;
  border-radius: 7px;
  border-style: solid;
  border-width: 1px;
  border-color: #E0E0E0;
  font-size: 20px;
  font-size: 2rem;
  font-family: 'play';}
.form-container form
  {box-sizing: border-box;
  width: 100%;
  border-radius: 2px;}
.form-container fieldset
  {box-sizing: border-box;
  background-color: rgb(0,0,0,0.7);
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: center center;
  border-radius: 10px;
  border-color: #7D9589;}
.form-fields
  {padding: 1%;}
.form-fields label
  {color: #2973AC;
  text-decoration: underline;
  font-family: 'play';
  font-size: 16px;
  font-size: 1.6rem;}
.form-fields input
  {box-sizing: border-box;
  background-color: #3E4C5F;
  width: 100%;
  margin-bottom: 2%;
  padding: 1.5%;
  border-radius: 4px;
  border-width: 1px;
  font-size: 18px;
  font-size: 1.8rem;
  font-family: 'play';
  color: #E0E0E0;}
.form-fields input:hover
  {background-color: #23384C;}
.form-fields textarea
  {box-sizing: border-box;
  width: 100%;
  background-color: #3E4C5F;
  opacity: .7;
  min-height: 80px;
  max-width: 100%;
  padding: 1.5%;
  border-radius: 4px;
  font-size: 18px;
  font-size: 1.8rem;
  font-family: 'play';
  color: #E0E0E0;}
.form-fields textarea:hover
  {background-color: #23384C;}
.form-fields button
  {color: #E0E0E0;
   padding: 2%;
   width: 100%;
   margin-top: 3%;
   font-size: 16px;
   font-size: 1.6rem;
   font-family: 'orbitron';
   border-radius: 5px;
   border-width: 1px;
   transition-duration: .3s;
   background-color: rgb(97, 131, 100, 0.6);}
.form-fields button:hover
  {background-color: #628868;
  transition-duration: 0.2s;}

/* HIDDEN ARCHIEVES */
.distro-info
  {box-sizing: border-box;
  background-color: rgb(0, 0, 0, 0.2);
  width: 96%;
  height: auto;
  display: inline-flex;
  justify-content: center;
  margin: 0;
  margin-top: 2%;
  margin-left: 2%;
  border-radius: 5px;
  padding: 1%;
  font-size: 0;
  transition-duration: 0.2s;}
.distro-info:hover
  {background-color: rgb(0, 0, 0, 0.4);}
.distro-info-left
  {box-sizing: border-box;
  width: 8%;
  height: auto;
  display: block;
  margin: 0;
  margin-top: auto;
  margin-bottom: auto;
  font-size: 0;}
.distro-info-left img
  {box-sizing: border-box;
  width: 100%;
  opacity: 0.7;
  display: block;
  margin: 0;
  padding: 1%;
  padding-bottom: 5%;
  font-size: 0;
  transition-duration: 0.2s;}
.distro-info-left img:hover
  {opacity: 1.0;}
.distro-info-left h6
  {box-sizing: border-box;
  width: 100%;
  display: block;
  color: #D2D6D1;
  margin: 0;
  padding: 0;
  text-align: center;
  font-family: 'gruppo', cursive;
  font-size: 20px;
  font-size: 2rem;}
.distro-info-right
  {box-sizing: border-box;
  width: 92%;
  height: auto;
  display: inline-flex;
  justify-content: center;
  margin: 0;
  padding: 1%;
  padding-right: 0;
  font-size: 0;}
.distro-info-right-description
  {box-sizing: border-box;
  width: 78%;
  display: block;
  margin: 0;
  padding: 1%;
  font-size: 0;}
.distro-info-right-description p
  {box-sizing: border-box;
  background-color: transparent;
  width: 100%;
  color: #E0E0E0;
  margin: 0;
  padding: 0;
  text-align: left;
  font-family: 'bai-jamjuree', cursive;
  font-size: 20px;
  font-size: 2.0rem;}
.distro-info-right-website
  {box-sizing: border-box;
  width: 18%;
  height: auto;
  display: block;
  margin-top: auto;
  margin-bottom: auto;
  margin-left: 2%;
  padding: 1%;
  font-size: 0;}
.distro-info-right-website button
  {box-sizing: border-box;
  background-color: green;
  border-radius: 5px;
  opacity: 0.7;
  width: 100%;
  height: auto;
  margin: 0;
  padding: 5%;
  font-family: 'play';
  font-size: 16px;
  font-size: 1.6rem;
  color: #E0E0E0;
  transition-duration: 0.2s;}
.distro-info-right-website button:hover
  {opacity: 1.0;
  color: #FFFFFF;}
.media-items
  {box-sizing: border-box;
  display: inline-block;
  width: 90%;
  margin: 0;
  margin-top: 2%;
  margin-left: 5%;
  padding: 0;
  font-size: 0;}
.media-items video
  {border-radius: 10px;
  height: 140px;}
.media-items h6
  {box-sizing: border-box;
  color: #E0E0E0;
  text-align: left;
  font-family: 'gruppo';
  margin: 0;
  margin-left: 4%;
  padding: 0;
  padding-top: 62px;
  font-size: 20px;
  font-size: 2.0rem;}
.media-item
  {box-sizing: border-box;
  display: inline-flex;
  width: 50%;
  margin: 0;
  padding: 0;
  font-size: 0;}

/*SPANS*/
.current-page
{color: 47E33F;}

/*SPACERS*/
.test-spacer
{box-sizing: border-box;
background-color: red;
width: 100%;
margin: 0;
padding: 5%;
font-size: 0;}
.spacer-page-bottom
{box-sizing: border-box;
width: 100%;
margin: 0;
padding: 5%;
font-size: 0;}
.spacer-box-bottom
{box-sizing: border-box;
width: 100%;
margin: 0;
padding: 4%;
font-size: 0;}
.spacer-box-bottom-small
{box-sizing: border-box;
width: 100%;
margin: 0;
padding: 2%;
font-size: 0;}
.spacer-section
{box-sizing: border-box;
width: 100%;
margin: 0;
padding: 2%;
font-size: 0;}
.spacer-section-small
{box-sizing: border-box;
width: 100%;
margin: 0;
padding: 1%;
font-size: 0;}
.spacer-section-bottom
{box-sizing: border-box;
width: 100%;
margin: 0;
padding: 2%;
font-size: 0;}
.variable-spacer
{box-sizing: border-box;
width: 100%;
margin: 0;
padding: 1%;
font-size: 0;}

/* HIGHLIGHTS */
.highlight-01
{color: #3F7FBF;
font-style: italic;}
.highlight-02
{color: grey;
font-style: italic;}
.highlight-yellow
{color: #9F9F69;}
.highlight-03
{color: #BFBF3F;
font-style: italic;}
.highlight-04
{color: #5684B3;
 font-weight: bolder;}
.highlight-05
{color: #9B6969;
font-weight: bolder;}
.highlight-06
{color: #8D5858;}

.sub-page li
  {color: #3F7FBF;
  padding-left: 2%;}
.sub-topic-page li
  {color: #3FBF7F;
  padding-left: 2%;}
.sub-step-page li
  {color: #C14242;
  padding-left: 2%;}

.topic-title
{box-sizing: border-box;
width: 100%;
height: auto;
color: #C14242;
margin: 0;
padding: 0;
text-align: center;
font-family: 'gruppo', cursive;
font-weight: bolder;
font-size: 22px;
font-size: 2.2rem;}