/* Define the body area: light gray background, vegatopia header (picture should be available) */

body {
	color: #222222;
    font-size: 18px;
}

/* These two rules are necessary for formatting the newsfeed of new UMUAI articles correctly. */

.newsfeed {

list-style-type: none;
}

.feed-link {
font-family: 'Oswald', Helvetica, Arial, sans-serif;
  font-size: 20px;
font-weight: 590;
}

#gruemenu > ul {
margin-top: 1px;
}

/* Decrease the default padding in the Gruemenu */

#gruemenu > ul > li > a {
 padding-top: 15px;
 padding-bottom: 15px;
 text-transform: none;
}

/* Footer is centered */

footer {
margin-top: 40px;
text-align: center;
}

/* The relative space taken by the menu decreases with screen resolution. Below 480px, the mobile menu is activated anyway. */

@media(min-width: 480px) {

.col-md-8 {
	float: left;
	width: 50%;
}

.col-md-4 {
	float: left;
	width: 50%;
}
}


@media(min-width: 640px) {

.col-md-8 {
	float: left;
	width: 66%;
}

.col-md-4 {
	float: left;
	width: 33%;
}
}

@media (min-width: 992px) {


  .col-md-8 {
    width: 75%;
  }

  .col-md-4 {
    width: 25%;
  }
}



/* Not in the original template: For screens of 1600 pixels and wider, the container is 1480 pixels wide */

@media (min-width: 1500px) {
  .container {
    width: 1480px;
  }

  .col-md-8 {
    width: 80%;
  }

  .col-md-4 {
    width: 20%;
  }
}

}



/* Silly solution to remove the horizontal line on top and below the container (which contains main content and sidebar */
body hr {
	border: 0px;
}

/* The header contains a logo that is defined as a custom html module with the position 'header'.
   The logo is already in the banner image, but could also be set in the template
   settings. In that case, it will be centered with 10 pixels on top. */
.header {
   height: 133px;
   padding-top: 10px;
   text-align: center;
   background-image: url("../images/usermodelingbanner.jpg");
   background-position: left top;
   background-repeat: repeat-x;
}
	
/* The content areas have a margin at the bottom.
I increased the z-index to prevent the advertisement bar from blocking links */
.col-md-8, .col-md-4 .moduletable, .col-lg-4, .col-md-12 {

  margin-bottom: 15px;
  z-index: 1;

}


/* All modules have a padding of 10px left and right */

.moduletable {
  padding-left: 10px;
  padding-right: 10px;
}



/* Bottom three boxes have a width of 30% */

@media (min-width: 992px) {
	.col-lg-4 {
		float: left;
		width: 45%;
		margin-right: 4%;
	}
}

@media (min-width: 1200px) {
	.col-lg-4 {
		width: 30%;
		margin-right: 3.33%;
	}
}


.col-md-8,.col-md-12 .column-1,.column-2,.column-3,.column4 {
		word-wrap: break-word;
	}


/* The sidebar (col-md-4) and banners are centered (we might want to change this for the sidebar) */

.bannergroup {
text-align: center;
}

/* Top module has a negative top margin, to ensure that the distance between menu and main content is not too large */

.top-modules {
margin-top: -20px;
margin-right: auto;
margin-left: auto;
}

/* Space between the main content and the bottom three boxes */
.container {
	margin-bottom: 20px;
}



/* Breadcrumbs have transparent background */
.breadcrumb {
background-color: transparent;
color: #333333;
}

.breadcrumb .active {
color: #333333;
}

/* Search */
.search {
padding-top: 5px;
padding-bottom: 5px;
max-width: 100%;
}

  /* joomla article pagenav */
  ul.pagenav, ul.pagenav li {
    list-style: none; list-style-type:none; list-style-image: none;
    margin:0; padding:0; border: 0;
    overflow: hidden;
    width: 100%;
  }
  ul.pagenav {
    border-top:1px solid #ccc;
    border-bottom:1px solid #ccc;
  }
  ul.pagenav li.pagenav-prev { float: left; width:auto; }
  ul.pagenav li.pagenav-next { float: right; width:auto; }
  /* joomla pagination */
  .pagination ul, .pagination ul li {
    list-style: none; list-style-type:none; list-style-image: none;
    margin:0; padding:0; border: 0;
    overflow: hidden;
    width: 100%;
  }
  .pagination ul { }
  .pagination ul li {
    float: left;
    width: auto;
    margin:0 5px 5px 0;
  }
  .pagination ul li.pagination-end { margin-right:0; }
  .pagination ul li.active-page { font-weight: bold; }
  .pagination ul li a,
  .pagination ul li span {
    display: block;
    width: auto;
    padding:.2em .5em;
    border:1px solid #ccc;
  }
  .pagination ul li a:hover,
  .pagination ul li a:focus,
  .pagination ul li a:active {
    background: #eee;
  }

/* A bit more space for images - top margin remains 0 to allow for aligning with top of text.
   Another interesting adaptation: with max-width: 100% images will scale for smaller displays
   and/or lower resolutions */
img {
 margin: 0px 5px 5px 5px;
 max-width: 100%;
}

/* TEXT DISPLAY ALTERATIONS TO BOOTSTRAP.CC */

/* Margins for page headers a bit smaller */
.page-header {
  padding-bottom: 9px;
  margin: 15px 0 10px;
  border-bottom: 0px;
}

/* Headings can also be a bit smaller */

h1,
.h1 {
  font-size: 38px;
}

h2,
.h2 {
  font-size: 34px;
}

h3,
.h3 {
  font-size: 30px;
}

h4,
.h4 {
  font-size: 26px;
}

h5,
.h5 {
  font-size: 24px;
}

h6,
.h6 {
  font-size: 20px;
}

h1,h2,h3,h4,h5,h6 {
font-family: 'Oswald', Helvetica, Arial, sans-serif;
color: #dd6611;
font-weight: 590;
}

a {
color: #3c7c96;
}

a:hover {
color: #3c7c96;
}


.contact-form {
text-align: left
}