@charset "utf-8";
html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
  padding: 0;
  margin: 0;
}
body {
	/*font: 85%/1.5 Palatino;
	font-size: 100%;*/
	font-family: Palatino;
	font-size: 18px;
	background-color: #42413C;
	margin: 0;
	padding: 0;
	color: #777;
	border: 0;
	outline: 0;
	vertical-align: baseline;
	background: transparent;
	box-sizing: border-box;
}
a {
	text-decoration:none;
	color:#E27761;
}
a:hover {
	text-decoration:none;
	color:#777;
}
a:visited {
	
}
a:hover, a:active, a:focus { /* this group of selectors will give a keyboard navigator the same hover experience as the person using a mouse. */
	
}

ul, ol, dl { /* Due to variations between browsers, it's best practices to zero padding and margin on lists. For consistency, you can either specify the amounts you want here, or on the list items (LI, DT, DD) they contain. Remember that what you do here will cascade to the .nav list unless you write a more specific selector. */
	padding: 0;
	margin: 0;
	list-style-type: none;
	}
ul.dash {
	list-style: none;
	margin-left: 0;
	padding-left: 1em;
}
ul.dash > li:before {
	display: inline-block;
	content: "-";
	width: 1em;
	margin-left: -1em;
}

h1, h2, h3, h4, h5, h6 {
	margin-top:0;
	font-weight:bold;
	line-height:1.5;
}
a img { /* this selector removes the default blue border displayed in some browsers around an image when it is surrounded by a link */
	border: none;
}

/* ~~ The header ~~ */
header {
	width: 100%;
	padding: 20px 0;
	text-align: center;
}

header h1 {
	margin:0;
}

.logo2 {
	width:300px;
	height:200px;
	line-height:200px;
	font-size:35px;
	color:#D80000;
	text-transform:downcase;
	background:url(../images/legalexmp_page.gif) no-repeat;
	display:inline-block;
	margin:0 auto;
}

header .logo {
	width:300px;
	height:200px;
	line-height:200px;
	font-size:35px;
	color:#D80000;
	text-transform:downcase;
	background:url(../images/logo-frame.png) no-repeat;
	display:inline-block;
	margin:0 auto;
}

header nav {
	font-weight:300;
	text-transform:uppercase;
	margin:15px 0 0;
	margin-left:0px;
	margin-left:auto;
	display:block;
	text-align:center;
	font-size:22px;
	font-weight:bold;
}

header nav ul li {
	padding:15px 20px;
	display:inline-block;
}

header nav ul li a {
	color:#000;
	opacity:0.5;
}

header nav ul li a:hover {
	color:#000;
	opacity:1;
}

header nav ul li.active a {
	color:#E27761;
	opacity:1;
}

/* ~~ The footer ~~ */
footer {
	clear:both;
	padding:30px 0;
	font-size:14px;
	margin:0 auto;
	overflow:hidden;
	text-align:center;
	border-top:1px solid #EEEEEE;
}

/* ~~ The Middle ~~ */
main {
	padding:25px 0;
}

/*HTML 5 support - Sets new HTML 5 tags to display:block so browsers know how to render the tags properly. */
header, section, footer, aside, article, figure {
	display: block;
}
#highlightText a {
  color: #ff6600;
}

#highlightText a:hover {
    font-weight: bold;
}

div.terms-filter {
	margin:0 0 25px;
}
div.terms-filter ul li {
	display: inline-block;
	color: white;
	text-align: center;
	padding: 0 5px;
	margin:0;
	word-wrap: normal;
	font-weight: 600;
}

div.terms-filter ul li span {
	cursor:pointer;
	color:#E27761;
}
div.terms-filter ul li span:hover, div.terms-filter ul li span.mixitup-control-active {
	text-decoration:underline;
	color:#777;
}
div.terms-filter ul li a {
	
}
div.terms-filter ul li a:hover, div.terms-filter ul li a.active {
	text-decoration:underline;
}
div.terms-list h3 {
	width: 100%;
	padding: 5px 15px;
	margin: 0 0 15px 0;
	background: #f4f4f4;
	float: none;
	text-transform: uppercase;
	font-weight: bold;
	border-radius: 5px;
	background-color: #f4f4f4;
	color: #777777;
}
div.terms-list .terms-section {
	margin:0 0 15px;
}

div.terms-list ul li {
	margin:0 0 15px;
}
div.terms-list a {
	font-weight:400;
}

.sidebar aside {
	margin:0 0 15px;
}

.sidebar ul li {
	padding:5px 0;
}
.sidebar ul li:last {
	padding-bottom:0;
}

/* ~~ The Tooltip ~~ */
.tooltip-content {
	font-size:90%;
}

.tooltip-term-title {
	display:block;
	font-weight:bold;
	font-size:14px;
	text-transform:uppercase;
	padding:0 0 10px;
	margin:0 0 10px;
	border-bottom:1px dotted #666;
	white-space: pre-wrap;
}

/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal-content {
  background-color: #fefefe;
  margin: auto;
  padding: 20px;
  border: 1px solid #888;
  width: 80%;
}

/* The Close Button */
.close {
  color: #aaaaaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

/* Styles for the user forms */
.user-forms {
    position: absolute;
    top: 10px; /* Adjust as needed to position vertically */
    right: -200px; /* Adjust as needed to position horizontally */
    display: flex;
    z-index: 100; /* Add this line */
}

#registration-form,
#login-form {
    width: 200px; /* Adjust the width as needed */
    margin-right: 10px; /* Add margin between forms */
}

#registration-form input[type="text"],
#registration-form input[type="email"],
#registration-form input[type="password"],
#login-form input[type="email"],
#login-form input[type="password"] {
    width: 100%; /* Make input fields 100% width */
    padding: 8px; /* Add padding for better appearance */
    margin-bottom: 10px; /* Add margin between input fields */
    border: 1px solid #ccc; /* Add a border to input fields */
    border-radius: 5px; /* Add some border radius */
    font-size: 14px; /* Adjust font size for input fields */
}

/* Add this CSS for the larger and dark red links */
.large-link {
    font-size: 18px; /* Adjust the font size as needed */
    color: #D80000; /* Dark red color */
    text-decoration: none; /* Remove underlines */
    margin-top: 10px; /* Add some margin to separate the links from the input fields */
    display: block; /* Make the links block-level elements */
}

.large-link:hover {
    color: #D80000; /* Dark red color on hover */
}

.terms-list .terms-section .row li label {
    margin-right: 10px;
}

 .top-right {
            position: absolute;
            top: 10px;
            right: 10px;
        }

        .button-group {
            display: flex;
        }

        .button-group button {
            margin-right: 10px;
            cursor: pointer;
            padding: 8px 12px;
            border-radius: 5px; /* Rounded corners */
            border: 1px solid #ccc; /* Thin border */
        }

        .login-form {
            display: none;
            position: absolute;
            top: 40px;
            right: 10px;
            background-color: #fff;
            padding: 10px;
            border: 1px solid #ccc; /* Thin border */
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
            border-radius: 5px; /* Rounded corners */
        }

        .login-form input {
            margin-bottom: 10px;
            width: 100%;
            padding: 8px;
            box-sizing: border-box;
            border: 1px solid #ccc; /* Thin border */
            border-radius: 3px; /* Rounded corners */
        }

        .login-form button {
            width: 100%;
            padding: 8px 12px;
            box-sizing: border-box;
            cursor: pointer;
            border: 1px solid #ccc; /* Thin border */
            border-radius: 5px; /* Rounded corners */
        }