/* CSS Document */

/*  font-family: 'Open Sans', sans-serif;
	font-family: 'Open Sans Condensed', sans-serif;   */

body {
  background-image: url(../images/bg/forge.bg.jpg);
  background-repeat: repeat;
  font-family: Arial, Helvetica, sans-serif;
}

h1,
h2,
h3 {
  font-family: "Open Sans Condensed", Arial, Helvetica, sans-serif;
}

img {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

#wrapper {
  width: 900px;
  margin: 10px auto;
  background-color: #fff;
  padding: 0 40px;
}

#top {
}
#logo {
  float: left;
  margin: 10px 5px 0 0;
}

#social-media {
  float: right;
  margin: 20px 0 0 0;
}

#topnav {
  clear: both;
}
#topnav ul {
  padding: 15 0 10 0;
  margin: 0;
  border-top: 2px #0ff solid;
  border-bottom: 2px #0ff solid;
  text-align: center;
}

#topnav ul li {
  display: inline;
  list-style-type: none;
  margin: 0 30px 0 0;
}
#topnav a:link {
  font-weight: bold;
  text-decoration: none;
  text-transform: uppercase;
  color: #00f;
}
#topnav a:visited {
  font-weight: bold;
  text-decoration: none;
  text-transform: uppercase;
  color: #00f;
}
#topnav a:active {
  font-weight: bold;
  text-decoration: none;
  text-transform: uppercase;
  color: #00f;
}
#topnav a:hover {
  font-weight: bold;
  text-decoration: none;
  text-transform: uppercase;
  color: #a85400;
}
#topnav a:focus {
  font-weight: bold;
  text-decoration: none;
  text-transform: uppercase;
  color: #a85400;
}

#content {
  float: left;
  width: 580px;
}
#content h1 {
  text-align: center;
}
#content h2 {
  text-align: center;
  color: #000000;
}
#content h3 {
  text-align: center;
}
#content h4 {
  text-align: center;
}
#content p {
  text-align: justify;
  font-size: 16px;
  line-height: 180%;
}
#box1 {
  width: 265px;
  float: left;
  margin-right: 40px;
}
#box2 {
  width: 265px;
  float: left;
}

.img-right {
  float: right;
  padding: 0 0 0 25px;
}

#rightside {
  float: right;
  width: 270px;
}
#rightside h2 {
  text-align: center;
}
#rightside h3 {
  text-align: center;
}
#rightside h4 {
  text-align: center;
}
#rightside p {
  font-size: 14px;
  line-height: 180%;
}
#rightside li {
  font-size: 14px;
  line-height: 180%;
}

#footer {
  clear: both;
  padding: 10px 0;
  border-top: 2px #0ff solid;
}
#footer p {
  text-align: center;
  font-size: 10px;
  font-weight: bold;
}
.stt {
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background: rgb(128, 128, 255)
    url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath fill='currentColor' d='M352 352c-8.188 0-16.38-3.125-22.62-9.375L192 205.3l-137.4 137.4c-12.5 12.5-32.75 12.5-45.25 0s-12.5-32.75 0-45.25l160-160c12.5-12.5 32.75-12.5 45.25 0l160 160c12.5 12.5 12.5 32.75 0 45.25C368.4 348.9 360.2 352 352 352z'%3E%3C/path%3E%3C/svg%3E")
    center no-repeat;
  box-shadow: 0 0.25rem 0.5rem 0 gray;
  opacity: 0.7;
}
.stt:hover {
  opacity: 0.8;
}
.stt:focus {
  opacity: 0.9;
}
.stt:active {
  opacity: 1;
}