/*  phpBB3 Style Sheet
    --------------------------------------------------------------
	Style name:			prosilver Special Edition
	Based on style:		prosilver (the default phpBB 3.3.x style)
	Original author:	Tom Beddard ( http://www.subblue.com/ )
	Modified by:		phpBB Limited ( https://www.phpbb.com/ )
    --------------------------------------------------------------
*/

/* colours.css changes */
html, body {
	/* background-color: #ACA8A1; */
	background-color: #F5F7FA;
}

body.simple {
	min-height: 100%;
	padding: 0 5px;
}

.wrap {
	border: 2px solid #FFF;
	border-radius: 15px;
	box-shadow: 0 0 5px 2px #9D9A93, inset 0 3px 18px rgba(100, 100, 100, .25);
	margin: 0 auto;
	max-width: 1152px;
	padding: 13px 23px;
}

.search-header {
	box-shadow: 0 0 10px #505C65;
}

.headerbar {
	background-color: #7C8891;
	background-image: -webkit-linear-gradient(top, #6E777F 0%, #505C65 1%, #56626B 20%, #737F88 75%, #7C8891 100%);
	background-image: linear-gradient(to bottom, #6E777F 0%, #505C65 1%, #56626B 20%, #737F88 75%, #7C8891 100%);
	background-repeat: repeat-x;
}

.navbar {
	background-color: #DCDEE2;
}

.forabg, .forumbg {
	background-color: #505C65;
	background-image: -moz-linear-gradient(top, #7C8891 0%, #7C8790 4%, #76828B 10%, #5B666F 29%, #505C65 38%, #505C65 100%);
	background-image: linear-gradient(to bottom, #7C8891 0%, #7C8790 4%, #76828B 10%, #5B666F 29%, #505C65 38%,#505C65 100%);
	background-repeat: repeat-x;
}

.copyright a {
	color: #000000 !important;
}

li.row {
	background-color: #E8ECEE;
}

li.row:hover {
	background-color: #EBEFF1;
}

li.row.bg3 {
	background-color: #F0F4F6;
}

li.row.bg3:hover {
	background-color: #F4F8FA;
}

.site_logo {
	background-image: url("./images/site_logo.svg");
}

.jumpbox-cat-link {
	background-color: #505C65;
	background-image: -moz-linear-gradient(top, #7C8891 0%, #7C8790 4%, #76828B 10%, #5B666F 29%, #505C65 38%, #505C65 100%);
	background-image: linear-gradient(to bottom, #7C8891 0%, #7C8790 4%, #76828B 10%, #5B666F 29%, #505C65 38%,#505C65 100%);
	background-repeat: repeat-x;
	color: #FFFFFF;
}

.jumpbox-sub-link {
	background-color: #E8ECEE;
}

/* responsive.css changes */
@media only screen and (max-width: 920px), only screen and (max-device-width: 920px) {
	html, body {
		background-color: #FFF;
	}

	body {
		padding-left: 5px;
		padding-right: 5px;
	}

	#wrap {
		width: 850px;
		padding: 0;
		border-width: 0;
		border-radius: 0;
		box-shadow: none;
	}
}

@media only screen and (max-width: 860px), only screen and (max-device-width: 860px) {
	#wrap {
		width: auto;
	}
}

/* 
 * BANNER MODIFICATIONS - SecretBipolar
 */
.site_logo {
  background-image: url("./images/site_artistic_logo.png");
}

.site_logo {
  width: 165px;
  height: 155px;
}

.headerbar {
  background-image: url("./images/banner_background_dark_art_style.png");
}

.site-description {
  width: 50%;
}

.site-description h1 {
  font-size: 2.48em;
  padding-top: 7px;
  margin-bottom: 7px;
}

.site-description p {
  font-size: 1.4em;
  margin-bottom: 0;
}

.navbar .breadcrumbs {
  margin-top: 5px;
}

.navbar {
	margin-top: 10px; 
} 

#nav-footer .breadcrumbs {
  margin-top: 0px;
}

body {
  padding-top: 20px;
  /* background-color: #E9E9E9; */
  background-color: #F5F7FA;
}

@media (max-width: 700px) {
	.site-description {
		float: none;
		width: auto;
		text-align: center;
	}
	
	body {
	  padding-top: 0px;
	}
}

/*
 * HOMEPAGE ELEMENTS - SecretBipolar
*/
#main {
	font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
	width: 75%;
	float: left;
	clear: both;
	box-sizing: border-box;
}

#main .mental_health_forum {
	color: #888888;
	font-family: "Lucida Grande",Verdana,Helvetica,Arial,sans-serif;
	font-weight: bold;
	font-size: 1.4em;
	margin-bottom: 1em;
	margin-top: 1em;
}

#main p, #main-extra p {
	margin-bottom: 1em;
	font-size: 1em;
	text-align: justify;
}

#main a, #main-extra a {
	text-decoration: underline;
}

#main strong, #main-extra strong {
	color: #222222;
}

#main p.left, #main-extra p.left {
	text-align: left;
}

hr {
	border-color: #FFFFFF;
	border-top-color: #CCCCCC;
}

#main h3, #main-extra h3 {
	font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
	font-size: 1.2em;
	text-transform: none;
	color: #d21a4e;
	border-bottom: none;
	margin-top: 0.8em;
	font-weight: bold;
	margin-bottom: 0.6em;
}

#home-buttons {
	padding-bottom: 10px;
	border-bottom: 5px solid #d1cfcf;
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
}

#home-buttons h2 {
	margin: 10px;
	flex: 1 0 0%;
	flex-direction: column;
	display: flex;
	position: relative;
	max-width: calc(100% - 20px);
	min-width: calc(100% - 20px);
}

#home-buttons a {
	position: relative;
	flex: 1 1 auto;
	padding: 80px 8px 1px;
	background-position: 0 0px;
	background-size: 100% 132px;
	text-align: center;
	border-radius: 5px;
	color: #fff;
	font-size: 14px;
}

#home-buttons a:hover {  
	color: #eee;
}	

#home-buttons a:after {
	position: absolute;
	left: 0px;
	content: '';
	height: 27px;
	background-color: rgba(255,255,255,0.5);
	width: 100%;
	bottom: -1px;
}

/* 
 * HOME PAGE 4 IMAGES - SecretBipolar
 */
#home-buttons a.community			{ background-image: url("../../../images/site/community.png"); }
#home-buttons a.mood		{ background-image: url("../../../images/site/mood.png"); }
#home-buttons a.medication			{ background-image: url("../../../images/site/medication.png"); }
#home-buttons a.lifestyle		{ background-image: url("../../../images/site/lifestyle.png"); }


/*
 * SIDEBAR ELEMENTS - SecretBipolar
*/
.sidebar {
  float: right;
}
#extras {
	width: 260px;
	float: right;
}

#extras.homepage .extra-box, #extras.downloads .extra-box {
	width: auto;
	margin-left: 10px;
}

dl.extra-box {
	display: block;
	width: 240px;
	min-height: 59px;
	margin-bottom: 5px;
	border-radius: 5px;
	position: relative;
	padding: 10px 10px 8px;
}

dl.extra-box dt a {
	font-weight: bold;
	display: block;
	padding-bottom: 5px;
	color: #333333 !important;
	text-decoration: none !important;
	font-size: 12px;
}

dl.extra-box dd a, dl.download-contrib dd {
	font-weight: bold;
	display: block;
	color: #FFFFFF !important;
	padding-right: 40px;
	text-decoration: none !important;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
	font-size:12px;
}

dl.extra-box dd.fileformat {
	padding-left: 10px;
	padding-top: 5px;
}

dl.extra-box dd.fileformat label {
	color: #FFF;
}

dl.extra-box dt a:hover {
	text-decoration: none;
	color: #000000 !important;
}

dl.extra-box.register:before {
	background: url("../../../images/site/icon_forums.png") no-repeat 0 0;
	content: '';
	position: absolute;
	display: block;
	height: 64px;
	width: 55px;
	right: 5px;
	bottom: 5px;
}

dl.extra-box.emergency:before {
	background: url("../../../images/site/icon_emergency.png") no-repeat 0 0;
	content: '';
	position: absolute;
	display: block;
	height: 64px;
	width: 55px;
	right: 5px;
	bottom: 5px;
}

dl.extra-box.orange, .big-tag.orange {
	background: #ffc561;
	background: -moz-linear-gradient(45deg, #ffc561 0%, #ff8a2b 100%);
	background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#ffc561), color-stop(100%,#ff8a2b));
	background: -webkit-linear-gradient(45deg, #ffc561 0%,#ff8a2b 100%);
	background: -o-linear-gradient(45deg, #ffc561 0%,#ff8a2b 100%);
	background: -ms-linear-gradient(45deg, #ffc561 0%,#ff8a2b 100%);
	background: linear-gradient(45deg, #ffc561 0%,#ff8a2b 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffc561', endColorstr='#ff8a2b',GradientType=1 );
}

dl.extra-box, .big-tag {
	background: #95b178;
	background: -moz-linear-gradient(top, #95b178 0%, #b1d28e 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#95b178), color-stop(100%,#b1d28e));
	background: -webkit-linear-gradient(top, #95b178 0%,#b1d28e 100%);
	background: -o-linear-gradient(top, #95b178 0%,#b1d28e 100%);
	background: -ms-linear-gradient(top, #95b178 0%,#b1d28e 100%);
	background: linear-gradient(to bottom, #95b178 0%,#b1d28e 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#95b178', endColorstr='#b1d28e',GradientType=0 );
}

dl.extra-box.blue, .big-tag.blue {
	background: #698cc0;
	background: -moz-linear-gradient(top, #698cc0 0%, #7ca7e4 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#698cc0), color-stop(100%,#7ca7e4));
	background: -webkit-linear-gradient(top, #698cc0 0%,#7ca7e4 100%);
	background: -o-linear-gradient(top, #698cc0 0%,#7ca7e4 100%);
	background: -ms-linear-gradient(top, #698cc0 0%,#7ca7e4 100%);
	background: linear-gradient(to bottom, #698cc0 0%,#7ca7e4 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#698cc0', endColorstr='#7ca7e4',GradientType=0 );
}

dl.extra-box.orange, .big-tag.orange {
	background: #ffc561;
	background: -moz-linear-gradient(45deg, #ffc561 0%, #ff8a2b 100%);
	background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#ffc561), color-stop(100%,#ff8a2b));
	background: -webkit-linear-gradient(45deg, #ffc561 0%,#ff8a2b 100%);
	background: -o-linear-gradient(45deg, #ffc561 0%,#ff8a2b 100%);
	background: -ms-linear-gradient(45deg, #ffc561 0%,#ff8a2b 100%);
	background: linear-gradient(45deg, #ffc561 0%,#ff8a2b 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffc561', endColorstr='#ff8a2b',GradientType=1 );
}

dl.extra-box.dirty-green, .big-tag.dirty-green {
	background: #97a382;
	background: -moz-linear-gradient(top, #97a382 0%, #b3bc9e 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#97a382), color-stop(100%,#b3bc9e));
	background: -webkit-linear-gradient(top, #97a382 0%,#b3bc9e 100%);
	background: -o-linear-gradient(top, #97a382 0%,#b3bc9e 100%);
	background: -ms-linear-gradient(top, #97a382 0%,#b3bc9e 100%);
	background: linear-gradient(to bottom, #97a382 0%,#b3bc9e 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#97a382', endColorstr='#b3bc9e',GradientType=0 );
}

dl.extra-box.dirty-blue, .big-tag.dirty-blue {
	background: #8492a5;
	background: -moz-linear-gradient(top, #8492a5 0%, #9ca9bc 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#8492a5), color-stop(100%,#9ca9bc));
	background: -webkit-linear-gradient(top, #8492a5 0%,#9ca9bc 100%);
	background: -o-linear-gradient(top, #8492a5 0%,#9ca9bc 100%);
	background: -ms-linear-gradient(top, #8492a5 0%,#9ca9bc 100%);
	background: linear-gradient(to bottom, #8492a5 0%,#9ca9bc 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8492a5', endColorstr='#9ca9bc',GradientType=0 );
}

dl.extra-box.light-blue, .big-tag.light-blue {
	background: #a9cded;
	background: -moz-linear-gradient(top, #a9cded 0%, #56b1df 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a9cded), color-stop(100%,#56b1df));
	background: -webkit-linear-gradient(top, #a9cded 0%,#56b1df 100%);
	background: -o-linear-gradient(top, #a9cded 0%,#56b1df 100%);
	background: -ms-linear-gradient(top, #a9cded 0%,#56b1df 100%);
	background: linear-gradient(to bottom, #a9cded 0%,#56b1df 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a9cded', endColorstr='#56b1df',GradientType=0 );
}

dl.extra-box.purple, .big-tag.purple {
	background: #8d7fcc;
	background: -moz-linear-gradient(45deg, #8d7fcc 0%, #9262cc 100%);
	background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#8d7fcc), color-stop(100%,#9262cc));
	background: -webkit-linear-gradient(45deg, #8d7fcc 0%,#9262cc 100%);
	background: -o-linear-gradient(45deg, #8d7fcc 0%,#9262cc 100%);
	background: -ms-linear-gradient(45deg, #8d7fcc 0%,#9262cc 100%);
	background: linear-gradient(45deg, #8d7fcc 0%, #9262cc 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8d7fcc', endColorstr='#9262cc',GradientType=1 );
}

/*
* MINI PANEL - SecretBipolar
*/
div.mini-panel {
	border-radius: 5px;
	padding: 5px 10px;
	background-color: #ebebeb;
	margin-bottom: 5px;
	font-size: 12px;
	margin-left: 10px
}

div.mini-panel.fixed {
	width: 240px;
	position: fixed;
}

div.mini-panel h3 {
	font-family: Verdana, Helvetica, Arial, sans-serif;
	margin: 5px 0 0 0;
	font-weight: bold;
	color: #333333;
	font-size: 12px;ss
	border-bottom-color: #CCCCCC;
	padding-bottom: 10px;
}

div.mini-panel p {
	font-size: 1em;
	margin: 3px 0;
}

div.panel-text p, div.panel-text ul {
	font-size: 1.1em;
	margin-left: 0px;
}

div.panel-text a {
	text-decoration: underline;
}

div.panel-text ul {
	margin-left: 2em;
}

div.mini-panel span.corners-top,
div.mini-panel span.corners-bottom {
	margin: 0 -10px;
}

div.panel-emphasis {
	background-color: #ddd;
}

/*
 * ADS LISTING TEXT- SecretBipolar
 */
ul.text-links {
	border-top: 1px solid #FFFFFF;
	list-style: none;
	margin: 0px;
}
ul.text-links li {
	padding: 5px 0 4px 0;
	border-bottom: 1px solid #CCCCCC;
	margin: 0px;
	line-height: 20px;
}
ul.text-links li.last {
	border-bottom: none;
}


/*
 * TEXT LINK FAVICON - SecretBipolar
 */
a.text-links-favicon {
	background-position: 0 50%;
	background-repeat: no-repeat;
	padding: 2px 0 2px 18px;
}

.new {
	color: #d21a4e !important;
	font-weight: bold;
}


/*
 * KNOWLEDGE BASE - SecretBipolar
 */
.wide {
  font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
  width: 100% !important;
  float: none;
  clear: both;
  text-align: left;
}

.tabs {
  margin: 20px 0 0 7px;
  line-height: normal; 
}

.tabs-container .panel {
  border-radius: 7px;
  padding-top: 10px;
}

/* 
 * KB TAB COLOURS - SecretBipolar
 */
.panel {
  background-color: #ECF1F3;
  color: #28313F;
}

.bg3 {
  background-color: #CADCEB;
}

.bg2 {
  background-color: #E1EBF2;
}

.bg1 {
  background-color: #ECF3F7;
}

.bg4 {
  background-color: #ECF1F3;
}

.showcase {
  margin: 0 auto;
}

/*
 * KB MESSAGING - Secret Bipolar
 */
 
#main .knowledge_base_heading {
  color: #D21A4E;
  font-size: 11px;
}

#main h2.knowledge_base  {
  color: #4f84ad;
  font-size: 2em;
  font-weight: 900;
  font-family: Helvetica,Arial,sans-serif;
  margin: 0 0 .25em 0;
  margin-top: 10px
}

#main h2.knowledge_base a {
  text-decoration: none;
  font-family: Helvetica,Arial,sans-serif;
  color: #4f84ad;
}

#main .download-package-header {
  color: #D21A4E;
  font-size: 12px;
}

#main h3.knowledge_base_heading {
  font-size: 1em;
}

.disclaimer-message {
  background-color: #FCF9CF;
  border: 1px solid #E6DB55;
  font-size: 1em;
  font-weight: bold;
  padding: 1em;
  /* margin-top: -25px;
  margin-bottom: 15px; */
}

/* 
 * KB TABS - Secret Bipolar
 */
#tabs ul {
  font-size: 10px;
  line-height: 14px;
}

.tabs .tab, .minitabs .tab {
  display: block;
  float: left;
  font-size: 1em;
  font-weight: bold;
  line-height: 1.4em;
}

.tabs .tab > a {
  border: 1px solid transparent;
  border-radius: 4px 4px 0 0;
  margin: 1px 1px 0 0;
}

.tabs .activetab > a {
  margin-top: 0;
  padding-bottom: 7px;
}

.tabs .tab > a {
  background: #BACCD9;
  color: #536482;
}

.tabs .tab > a:hover {
  background: #DDEDFB;
  color: #D31141;
}

.tabs .activetab > a,   .tabs .activetab > a:hover {
  background-color: #CADCEB; /* Old browsers */ /* FF3.6+ */
  background-image: -webkit-linear-gradient(top, #E2F2FF 0%, #CADCEB 100%);
  background-image: linear-gradient(to bottom, #E2F2FF 0%,#CADCEB 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#E2F2FF', endColorstr='#CADCEB',GradientType=0 ); /* IE6-9 */
  border-color: #CADCEB;
  box-shadow: 0 1px 1px #F2F9FF inset;
  color: #333333;
}

.tabs .activetab > a:hover {
  color: #000000;
}

.tabs-container .panel {
  border-radius: 7px;
  padding-top: 10px;
}

.dropdown-contents.dropdown-nonscroll {
	margin: 0;
}

div#tabs a {
  text-decoration: none;
} 

/*
 * GENERIC COLORED BOXES - SecretBipolar
 */
.note-box {
  background-color: #ebebeb;
  border: 1px solid #bbb;
  color: #333;
  border-radius: 5px;
  font-size: 12px;
  margin-bottom: 10px;
  padding: 7px;
  text-align: justify;
}
.note-box.blue {
  background-color: #e0eeff;
  border-color: #6b92bd;
  color: #115098;
}
.note-box.yellow {
  background-color: #fff1e1;
  border-color: #cd7900;
  color: #333300;
}
.note-box.green {
  background-color: #e5ffdf;
  border-color: #43a347;
  color: #043300;a
}
.note-box.red {
  background-color: #ffdfdf;
  border-color: #a30004;
  color: #330002;
}

/* 
 * MAIN TEXT & HEADINGS - SecretBipolar
 */

#main .panel h3, #main-extra .panel h3 {
  border-bottom:1px solid #CCCCCC;
  color:#115098;
  font-family:Arial,Helvetica,sans-serif;
  font-size:1.05em;
  font-weight:bold;
  padding-bottom:2px;
  text-transform:uppercase;
  margin:0.5em 0;
}

#main a.no-underline, #main-extra a.no-underline {
  text-decoration: none;
}

#main .pagination a {
  text-decoration: none;
}

#main h2  {
  color: #4f84ad;
  font-size: 2.8em;
  font-weight: 900;
  font-family: Helvetica,Arial,sans-serif;
  margin: 0 0 .25em 0;
}

#main h2.imgrep a {
  text-decoration: none;
  font-family: Helvetica,Arial,sans-serif;
  color: #4f84ad;
}

#main h3 a, #main-extra h3 a, #extras  .panel-text  h3 {
  color: #d21a4e;
}
#main h3 a:hover {
  color: #444444;
  text-decoration: none;
}
#main h3, #main-extra h3 {
  font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
  font-size: 1em;
  text-transform: none;
  color: #d21a4e;
  border-bottom: none;
}
#main h3 span, #main-extra h3 span {
  color: #222222;
}

#main .panel h3, #main-extra .panel h3 {
  border-bottom:1px solid #CCCCCC;
  color:#115098;
  font-family:Arial,Helvetica,sans-serif;
  font-size:1.05em;
  font-weight:bold;
  padding-bottom:2px;
  text-transform:uppercase;
  margin:0.5em 0;
}

#extras h3 a {
  color: #333333;
}

#main h3 span, #main-extra h3 span {
  color: #222222;
}

#main h4, #main-extra h4, #main h5, #main-extra h5 {
  font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
  font-size: 1.2em;
  text-transform: none;
  color: #333333;
  margin-top: 1.5em;
}
  
/*
 * RESPONSIVE ELEMENTS - SecretBipolar
*/
@media only screen and (min-width: 500px)
{
	#home-buttons h2 {
		min-width: calc(100%/2 - 20px);
		max-width: calc(100%/2 - 20px); 
	}
}

@media only screen and (min-width: 950px)
{
	#home-buttons h2 {
		min-width: calc(25% - 20px);
		max-width: calc(25% - 20px);
	}
}

@media only screen and (max-width: 1200px)
{
	#main {
		width: 72%;
		padding: 10px;
	}
}

@media only screen and (max-width: 1000px)
{
	#main {
		width: 68%;
	}
}

@media only screen and (max-width: 900px)
{
	#main {
		width: 68%;
	}
}

@media only screen and (max-width: 850px)
{
	#main {
		width: 66%;
	}
}

@media only screen and (max-width: 800px)
{
	#main {
		width: 100%;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
	.sidebar {
    display: none;
  }
}

@media only screen and (max-width: 700px)
{
	#main {
		padding: 0 10px;
	}
}

@media only screen and (max-width: 440px)
{
	#main {
		padding: 0 10px;
	}
}