/* Custom tweaks */


body {
  background-color: #ededed;
}



/* Change font */
html, body, h1, h2, h3, h4, h5, h6 {
  font-family: 'Ubuntu' !important;
}



/* Ensure textareas fill width */
textarea
{
	width:100%;
}



/* Error bubble for forms */
.bubble {
	position: relative;
	background: #bb0011;
	border-radius: .4em;
	color: white;
	padding: 8px;
	margin-top: 4px;
	top: 20%;
	width: max-content;
}
.bubble:after {
	content: '';
	position: absolute;
	top: 20%;
	left: 22px;
	width: 0;
	height: 0;
	border: 17px solid transparent;
	border-bottom-color: #bb0011;
	border-top: 0;
	margin-left: -17px;
	margin-top: -17px;
}



/* Pagination Active Page */
.active {
  background-color: #ea1a20;
  color: white;
}



/* Button hover colour */
.w3-button:hover {
  background-color: #cd0a00 !important;
  color: white !important;
}



/* Custom Colour Theme */
.w3-theme-l5 {color:#000 !important; background-color:#e9f5ff !important}
.w3-theme-l4 {color:#000 !important; background-color:#b5dffd !important}
.w3-theme-l3 {color:#000 !important; background-color:#6bc0fc !important}
.w3-theme-l2 {color:#fff !important; background-color:#21a0fa !important}
.w3-theme-l1 {color:#fff !important; background-color:#0479cc !important}
.w3-theme-d1 {color:#fff !important; background-color:#024575 !important}
.w3-theme-d2 {color:#fff !important; background-color:#023e68 !important}
.w3-theme-d3 {color:#fff !important; background-color:#02365b !important}
.w3-theme-d4 {color:#fff !important; background-color:#022e4e !important}
.w3-theme-d5 {color:#fff !important; background-color:#012641 !important}

.w3-theme-light {color:#000 !important; background-color:#e9f5ff !important}
.w3-theme-dark {color:#fff !important; background-color:#012641 !important}
.w3-theme-action {color:#fff !important; background-color:#012641 !important}

.w3-theme {color:#fff !important; background-color:#034f84 !important}
.w3-text-theme {color:#034f84 !important}
.w3-border-theme {border-color:#034f84 !important}

.w3-hover-theme:hover {color:#fff !important; background-color:#034f84 !important}
.w3-hover-text-theme:hover {color:#034f84 !important}
.w3-hover-border-theme:hover {border-color:#034f84 !important}


/* Set page max with */
.w3-content {
  max-width:1400px;
}


/*No left or right margins on middle column when small screen*/
@media only screen and (max-width: 600px) {
  .my-midcol {
    margin-right: 0px !important;
  }
  .my-midcol {
    margin-left: 0px !important;
  }
}


/* Answer Page Bubbles */
.my-questionbubble {
  position: relative;
  margin-bottom: 30px;
}
.my-questionbubble:before {
  content: "";
  width: 0px;
  height: 0px;
  position: absolute;
  border-left: 24px solid #fff;
  border-right: 12px solid transparent;
  border-top: 12px solid #fff;
  border-bottom: 20px solid transparent;
  left: 32px;
  bottom: -24px;
}

.my-answerbubble {
  position: relative;
  margin-bottom: 30px;
  width:85%;
}
.my-answerbubble:before {
  content: "";
  width: 0px;
  height: 0px;
  position: absolute;
  border-left: 24px solid #fff;
  border-right: 12px solid transparent;
  border-top: 12px solid #fff;
  border-bottom: 20px solid transparent;
  right: 32px;
  bottom: -24px;
}

/* Don't underline text on any links */
a {
  text-decoration: none;
}

/* Brand category images*/
.my-catimg {
  border: 0;
  float: left;
  position: relative;
} 
.my-catimgover {
  border: 0;
  position: absolute;
  top: 0;
  left: 0;
  height:100%;
 } 


.btnFlagQ, .btnFlagA {
  color: lightgrey;
}

/* Adjustments for small screens */
@media (max-width: 375px) {
  /* Make Category listbox narrower */
  #cat {
    max-width: 260px;
  }
}

/* Make icons larger on blue buttons*/
.bi{
  vertical-align: middle;
}
/* Make icons larger on blue buttons*/
.w3-button .bi{
  font-size: 24px;
  margin-right: 5px;
  vertical-align: middle;
}