:root {
	--brand1: #c34646;
	--brand2: #faf5e4;
	--brand2dark: #82e7d8;
	--brand3: #d65959;
	--brand3dark: #b94545;
}

html, body {
	width: 100vw; 
	height: 100vh;
	overflow-y: auto;
	overflow-x: hidden;
	-webkit-overflow-scrolling: touch;
}

body {
	background-color: var(--brand2);
	font-family:'Lato', 'Sans-serif';
	/*make room for the fixed header */
	padding-top: 80px;
	
	color:#0d0101;
}
a {
	color:var(--brand1);
}
.header .nav {
	background-color: var(--brand1);
	color:#fff;
	padding:1.5rem 1rem;
}
.nav .btn {
	color:#fff;
	text-decoration:none;
	cursor:pointer;
}
.nav .btn:hover {
	color: var(--brand3);
}
.nav-brand {
	display:inline-block;
	background-image: url(../images/userbridge_logo.png);
	background-repeat:no-repeat;
	background-position:center center;
	background-size:contain;
	text-indent:-9000px;
	width:200px;
	height:40px;

}
h1 {
	color:var(--brand1);
}
h2 {
	color:var(--brand1);
}
h3 {
	color: #731919;
}
h1, h2, h3 {
	font-weight:900;
}
hr {
	height:0;
	border:none;
	border-top:1px solid #aaa;
	margin:30px 0;
}
.menu {
	background-color: var(--brand1);
	max-height:0;
	height:auto;
	overflow:hidden;
	transition: max-height 0.6s cubic-bezier(0.42, 0, 0.58, 1);
	transform-origin: top center;
}
.menu a {
	color:#fff;
	padding:0.5rem 1rem;
}
.menu.show {
	max-height:400px;
}
.page {
	background-color: #f0e0b0;
	padding-top:40px;
	padding-bottom:40px;
}

footer {
	background-color: var(--brand1);
	color:#eee;
	padding: 1.5rem 0;

	background: linear-gradient(to bottom,  #ec4814 56%,#ba3b10 98%);
	
}
footer a {
	color:#fff;
	padding:0.25rem 1rem;
}
footer .nav-brand {
	width:100%;
	max-width:200px;
	opacity:0.5;
}
footer .signoff {
	position:absolute;
	bottom:0;
}

pre {
	color:#fff;
	border-radius:3px;
	background-color: var(--brand3dark);
	padding:1rem;
}
.carousel-item pre {
	min-height:360px;
	margin-bottom:0px;
}
.card-body pre {
	min-height:340px;
	margin-bottom:0px;
}

.dot {
	display:inline-block;
	margin:0 10px;
	width:15px;
	height:15px;
	border-radius:100px;
	background: var(--brand3dark);
	transition: opacity 0.6s ease-out;
	opacity:0.5;
	cursor:pointer;
}
.dot:hover {
	opacity:1;

}
.dot.selected {
	opacity:1;
	cursor:default;
}


.btn-primary {
	background-color: var(--brand3);
	border-color: var(--brand3);
}
.btn-primary:hover {
	background-color: var(--brand3dark);
	border-color: var(--brand3dark);
}
.btn-outline-primary {
	border-color: var(--brand3);
	color: var(--brand3);
}
.btn-outline-primary:hover {
	border-color: var(--brand3dark);
	background-color: var(--brand3dark);
	color:#fff;
}

.nav .nav-link.active {
	background-color: var(--brand3);
	border-color: var(--brand3);
}
.nav .nav-link.active:hover {
	background-color: var(--brand3dark);
	border-color: var(--brand3dark);
}




a.classic {
	text-decoration:underline;
	color:#212529;
}


#team-form label {
	font-size:1.2em;
	
}
.display-none {
	display:none;
}

a {
   outline: 0;
}


nav a.selected {
	text-decoration: underline;
}


.container.page {
	flex:1 0 auto;
}
.container.page.no-grow {
	flex-grow:unset;
}


.carousel-item.ub1 > div {
	min-height:500px;
	margin-bottom:0px;
	
	color:#fff;
	border-radius:3px;
	background-color: var(--brand3dark);
	padding:1rem;
}
.carousel-item > div > h2 {
	_color:#fff;
}


.cookie_bg {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background: rgba(0,0,0,0.8); /* dim everything else */
    z-index: 1030; /*put on top of the banner so it gets all clicks*/
}

.cookie_banner {
    position:absolute;
    bottom:0;
    left:0;
    width:100%;
    padding:15px;
    background:#241848; /* brand 3 dark*/
    color:#fff;
    font-size:0.8em;
}
.cookie_banner a {
    _color: rgba(255,255,255,0.3);
   	_text-decoration:underline
}

footer .cookie_banner a:not(.btn) {
	color:inherit;
	padding:inherit;
}

/*
.carousel-control-prev-icon {
 background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E") !important;
}

.carousel-control-next-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E") !important;
}
*/
.spinner {
}
/*
table {
	text-align:left;
}
table, th, td {
	border-collapse: collapse;
	border:1px solid #ddd;
}
table tbody tr th {
	background-color:#6ba7e7;
	color:#fff;
}
table.header-right-align tbody tr th {
	text-align:right;
}

table thead tr th {
	background-color:#6ba7e7;
	color:#fff;
}
table thead tr td {
	background-color:#fff;
}
th, td {
   padding:6px 10px;
}
th.section, td.section {
   border-left:2px solid #ddd;
}
table tbody td {
	background-color:#fff;
}

*/

/*
td.active {
	background-color:#6ba7e7;
	color:#fff;
}
*/



.generated-password-use-button {
	display:none;
}
.generated-password-display {
	display:none;
}