/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */


body {
  color: black;
  font-family: monospace;
  font-size:13px; 
  font-style:normal;
  font-variant:normal;
  font-weight:normal;
  line-height:1.7em;
  background-color:#B5955E;
  /*background-image:url('/img/mimaroom.gif');*/
  /*background-repeat:repeat;*/
  display: flex;  
  justify-content: center; /* for horizontal */
  align-items: center; /* for vertical */
  /*background-position: center center;*/
  
}

h1 {
  color: black;
  font-family: cursive;
  /*font-size:4px;*/
  font-style:italic;
  font-variant:normal;
  font-weight:normal;
}


.btn-group button {
  background-color: #04AA6D; /* Green background */
  border: 5px solid black; /* Green border */
  color: white; /* White text */
  padding: 5px 20px; /* Some padding */
  cursor: pointer; /* Pointer/hand icon */
  font-size: 16pt;
  float: left; /* Float the buttons side by side */
  /*box-sizing: content-box;*/
  height: 100px;
}

.sub-banner button {
  background-color: #04AA6D; /* Green background */
  border: 5px solid black; /* Green border */
  color: white; /* White text */
  padding: 5px 20px; /* Some padding */
  cursor: pointer; /* Pointer/hand icon */
  font-size: 12pt;
  float: left; /* Float the buttons side by side */
  /*box-sizing: content-box;*/
  height: 40px;
}

/* Clear floats (clearfix hack) */
.btn-group:after {
  content: "";
  clear: both;
  display: table;
}

/* Clear floats (clearfix hack) */
.sub-banner:after {
  content: "";
  clear: both;
  display: table;
}


#wrapper {
            /*background: #f9f7f0 url('img/bg.gif');*/
            /*background: rgba(254, 230, 244, 0.0);*/
            background-position: center center;
            /*border: rgba(245, 195, 224, 1.0) solid;*/
            border-width: 100%;
            color: #A9B55E;
            height: 100%;
            width: 50%;
            padding: 1%;
              margin-right:0px;
            justify-content: center; /* for horizontal */
            align-items: center; /* for vertical */
        }

/*bloggy stuff*/
#gloriabutton{
  color: black;
  font-family: "Comic Sans", comic;
  background-color: brown;
  /*background-image:url('/img/mimaroom.gif');*/
  /*background-repeat:repeat;*/
  background-image:url('/img/mimaroom.gif');
  background-repeat:repeat;
     display: inline !important;
}
/*philosophy stuff*/
#monikabutton{
  color: black;
  font-family: "Lucida Handwriting",  cursive;
  background-color: pink;
     display: inline !important;
}
/*science stuff*/
#mammalbutton{ 
  color: black;
  font-family: "Courier New", monospace;
  /*font-style: italic;*/
  font-size:12pt;
  font-weight:bold;
  /*background-color: rgb(24, 29, 15);*/
  background-color:rgb(176,177, 151);
  /*background-image:url('/img/mimaroom.gif');*/
  /*background-repeat:repeat;*/
}
/*art stuff*/
#madokamibutton{
  color:black;
  font-family: "Times New Roman", Times, serif;
  background-color:rgb(155, 109, 188);
  
}
#homebutton{
  background-color:white;
  color:black;
  height:40px;
}

        @media only screen and (max-width: 600px) {
        #wrapper {
          width: 98%;
        }
        .btn-group button{
          padding: 2px 10px;
          font-size: 10pt;
        }
        #mammalbutton{
          font-size:8pt;
        }
        #monikabutton{
          font-size:12pt;
        }
}

        #tw{
            margin-right:0px;
            /*background: rgba(254, 230, 244, 0.7);*/
            background-position: center center;
            background: rgba(245, 195, 224, 1.0) solid;
            /*border-width: 500%;*/
            color: #543438;
            height: 100%;
            width: 99%;
            padding: 3%;
            justify-content: center; /* for horizontal */
            align-items: center; /* for vertical */
        }
        #text {
            /*background: #f9f7f0 url('img/bg.gif');*/
            background: rgba(23, 69, 67, 0.7); ;
            background-position: center center;
            border: rgba(119, 198, 192, 0.7) solid;
            border-width: 500%;
            color: black;
            height: 100%;
            width: 99%;
            /*padding: 4rem;*/
            justify-content: center; /* for horizontal */
            align-items: center; /* for vertical */
        }