html, body{

  margin: 0;

  padding: 0;

  font-family: Arial, sans-serif;

  height: 100%;
  
  font-size: 1.1em;

}



a {

  text-decoration: none;

}



body {

  background: #0D3692;

}

@font-face {
      font-family: 'xolonium';
      src: url('../fonts/Xolonium-pn4D.ttf')  format('truetype'),
           url('../fonts/Xolonium-pn4D.otf')  format('opentype');
}

#title {
  font-family: 'xolonium';
  font-size: 2em;
}

#wrap {

  min-height: 100%;

  overflow: auto;

}



#container {

	position: relative;

	width: 940px;

	margin: 0px auto;

	overflow: visible;

	padding-bottom: 58px; /* same height as footer + footer border + extra space */

}



#header {

  position: relative;

  margin-top: 48px;

  background: #fff;

  border: 1px solid #f0dde8;

  text-align: center;

  border-radius: 12px;



  box-shadow:  2px 2px 4px 0px rgba(00, 00, 00, 0.4);

}



#logo {

  position: absolute;

  top: -25px;

  left: 50px;

  width: 150px;

  height: 150px;

  border: 6px solid white;

  background: #FEBA35;



  border-top-right-radius: 50px;

  border-bottom-right-radius: 50px;

  border-bottom-left-radius: 50px;



  box-shadow:  2px 2px 4px 2px rgba(00, 00, 00, 0.4);

}



#logo img {

  position: absolute;

  top: 12px;

  left: 12px;

}



#banner {

  margin: 20px auto 0;

}



#header ul {

  margin: 10px 0 16px;

  padding: 0;

  list-style: none;

  text-align: center;

}



#header ul li {

  display: inline;

}



#header ul li a {

  font-size: 0.8em;

  font-weight: bold;

  padding: 6px 12px;

  margin: 0px 10px;

  color: #9F1963;

  text-transform: uppercase;



}



#header .current a,

#header a:hover {

  border-radius: 8px;

}



#header a:hover {
/*
  color: #9F1963;

  background: #f8cde4;
*/
    color: #FFFFFF;

  background: #000080;
}



#header .current a,

#header .current a:hover {

  color: #fff;

  background: #000080;

}



#home-content {

  border: none;

  background: none;

  padding: 0;

  margin-top: 20px;

  font-size: 0.8em;

  overflow: auto;

  color: #494849;

}



#home-content #news {

  width: 240px;

  padding: 0 20px 0 10px;

  float: left;

}



#content {

	margin-top: 20px;

	border: 2px solid #E5AEC7;

	background: white;

	padding: 14px;

	font-size: 0.8em;

	overflow: auto;

	border-radius: 12px;

}



#content h1 {

  padding: 0;

  margin: 0;

  color: #000080;

  font-size: 1.4em;

}



#content h2 {

  padding: 0;

  margin: 0;

  color: #000080;

  font-size: 1.3em;

}

#content h3 {

  padding: 0;

  margin: 0;

  color: #000000;

  font-size: 1.2em;

}


#content p {

  padding-bottom: 10px;

}



#content p strong {

  color: #9F1963;

  /*text-decoration: underline;*/

}



#contact-info span {

  text-decoration: underline;

  font-weight: bold;

}



#location span {

  text-decoration: underline;

  font-weight: bold;

  font-style: italic;

}



#news {

	font-size: 12px;

}



#news h2 {

	font-size: 19px;

  padding: 0;

  margin-bottom: 12px;

  padding-left: 10px;

  color: #9F1963;

}



#news p {

  padding: 0 0 4px 10px;

  margin: 0;

}



#news hr {

	width: 94%;

	background: transparent;

	border: #808080 1px dashed;

	margin-bottom: 10px;

}



#news .news-entry {

  padding: 10px 0;

  border-bottom: 1px dashed #494849;

  font-size: 0.9em;

}



.news-entry strong {

  text-decoration: underline;



}



#welcome {

  width: 630px;

  border: 2px solid #E5AEC7;

  float: right;

  background: white;

  padding: 14px;

  position: relative;

  border-radius: 12px;

}



#welcome-message {

  position: absolute;

  top: 20px;

  right: 10px;

  width: 350px;

}



#welcome h2 {

  margin: 0;

  padding: 0;

  color: #9F1963;

}



#welcome p {

  line-height: 1.5em;

}





#footer {

  position: relative;

  border-top: 8px solid #8D1557;

  background: #000000;

  color: white;

  margin-top: -48px; /* negative of height + border */

  height: 40px;

  clear: both;

}



#inner-footer {

  position: relative;

  width: 940px;

  margin: 0px auto;

  font-size: 1em;

}



#inner-footer ul {

  padding: 5px 0;

  margin: 4px 0 0;

  list-style: none;

  width: 510px;

}



#inner-footer ul li {

  display: inline;



  padding-left: 10px;

}



#inner-footer ul li a {

  color: white;

}



#inner-footer ul li a:link {

  color: white;

  text-decoration: none;

}



#inner-footer ul li a:visited {

  color: white;

  text-decoration: none;

}



#inner-footer ul li a:hover {

  color: white;

  text-decoration: underline;

}



#inner-footer ul li a:active {

  color: white;

  text-decoration: underline;

}



#inner-footer ul li:after {

  padding-left: 10px;

  content: "|";

}



#inner-footer ul li:last-child:after {

  padding: 0;

  content: "";

}



#copyright {

  position: absolute;

  right: 10px;

  top: 0px;

}



#copyright a {

	color: white;

}



#kips {

  float: left;

  height: 60px;

  padding-right: 20px;

}



.images {

  text-align: center;

}



.images img {

  padding: 10px;

}



#calendar {

  text-align: center;

  width: 55%;

  float: left;

}



#agenda {

  width: 45%;

  float: left;

}



#agenda h3 {

  color: #9F1963;

}



#agenda ul {

  padding-left: 8px;

  list-style: none;



  overflow: auto;

}



#agenda span {

	display: block;

	width: 200px;

	float: left;

}





#imgbox {

  border: 1px solid pink;

  padding: 6px 6px 8px;



  border-radius: 12px;

  width: 260px;

}



#imgbox img {

  width: 250px;

}

.nivo-controlNav, .nivo-directionNav {

  display: none;

}



#slider {

  margin-bottom: 0px;

}



.about #wrap #container #content #contact-info #form {

/*	height: 200px;

	width: 500px;

	bottom: 210px;

	position: relative;*/

	float: right;

}

@media (max-width: 600px) and (orientation: portrait) {
        /* Styles for small, portrait-oriented screens */
        .navigation {
            display: none; /* Hide navigation on small screens */
        }
    }

<button style="background-color: red; color: white; padding: 10px 20px; border-radius: 5px;">Styled Button</button>