/*
	Initial styles for Episerver idio clients.  This will change after official integration!
	If you need any changes please email rob.stoves@episerver.com
*/

/* Login */
body.login { background: transparent url(https://content.epi-uk.net/img/epi-login-background.jpg) no-repeat; background-size: cover; }
body.login .btn-lg, .btn-primary { background: #1456F1; border: 0 solid; border-radius: 2px; color: #fff; cursor: pointer; box-shadow: none; }
body.login i.icon-logo { display: none; }
body.login .brand { height: 200px; background: transparent url(https://content.epi-uk.net/img/epi-white.png) center center no-repeat; }

/* Main branding */
body #wrapper #page { margin-top: 10px; }
body #wrapper .brand .icon-logo { background: transparent url("https://content.epi-uk.net/img/epi-white-thumb.png") 10px 10px no-repeat; background-size: 40px auto; }
body #wrapper .icon-logo:before { content: ""; width: 60px; }
body #wrapper .icon-logo:after { content: "Content Recommendations"; color: #fff; font-family: Barlow,sans-serif; font-style: normal; font-weight: bold; font-size: 15px; margin-right: 20px; }
body { border-top: none !important; }
body #wrapper h1 { text-transform: capitalize; color: #333; font-family: Barlow,sans-serif; }
body #wrapper .btn { box-shadow: none; border: 0 solid; border-radius: 2px; }
body #wrapper h4, .table>thead>tr a:link, .table.table-bordered>thead>tr a:link, .table>thead>tr a:visited, .table.table-bordered>thead>tr a:visited, .table>thead>tr, .table.table-bordered>thead>tr, .table>thead>tr th, .table.table-bordered>thead>tr th { color: #333; }
.table>thead>tr, .table.table-bordered>thead>tr, .table>thead>tr th, .table.table-bordered>thead>tr th { border-bottom-color: #040A47; }

/* Nav */

@media (max-width: 767px) {
  nav { font-family: Barlow,sans-serif; }
  .toggle-nav { background-color: #01062B; }
  nav>ul>li.content, nav>ul>li.insight, nav>ul>li.engage, nav>ul>li.settings, nav ul.sub-nav .logged-in-user, nav>ul>li.settings, nav>ul>li.settings-user { background-color: #fff; border-right-color: #01062B; }
  nav span.title, nav ul.sub-nav li.logged-in-user { color: #01062B; }
  nav ul li ul li a { background-color: #fff; color: #01062B !important;  }
}

@media (min-width: 768px) {

	body #wrapper nav { background-color: #040A47; }
	body #wrapper nav>ul>li.active>a, body #wrapper nav>ul>li.active>a .title, body   #wrapper nav>ul>li:hover>a, body #wrapper nav>ul>li:hover>a .title { color: #fff !important; font-family: Barlow,sans-serif; text-transform: capitalize; }
	body #wrapper nav>ul>li.active, body #wrapper nav>ul>li.nav-dropdown.active:hover { background-color: #1456f1; }
	body #wrapper nav>ul>li.nav-dropdown:hover { background-image: none; }
	body #wrapper nav>ul>li span.title { text-transform: capitalize; font-family: Barlow,sans-serif; }
	body #wrapper nav>ul>li.nav-dropdown:hover { background-color: #181D55; }
	body #wrapper li ul.sub-nav a { border-right: none; }
	body #wrapper nav ul.sub-nav .logged-in-user { background-color: #1456f1; }
	body #wrapper nav { width: 100%; height: auto; text-align: left; border-bottom: 2px solid #1456f1; }
	body #wrapper nav>ul>li { display: inline-block; border-top: none; padding: 7px 0; }
	body #wrapper nav>ul>li span.title { font-size: 15px; }
	body #wrapper nav>ul>li.settings-user { float: right; margin-right: 10px; padding: 5px 0; }
	body #wrapper nav>ul>li.settings-user:hover { background: transparent; }
	body #wrapper nav>ul>li.settings-user img.user-icon { width: 30px; height: 30px; }
	body #wrapper nav>ul>li.settings-user:hover img.user-icon {  border-color: #1456f1; }
	body #wrapper { display: block; }
	body #wrapper nav>ul>li.nav-dropdown { min-width: 100px; text-align: center; }
	body #wrapper nav>ul>li.nav-dropdown i, body #wrapper nav>ul>li.help i { display: none; }
	body #wrapper nav>ul>li.nav-dropdown:hover .sub-nav { top: 100%; left: 0; }
	body #wrapper nav>ul>li.settings-user:hover ul.sub-nav { left: -140px; }
  
}