<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Talent Aquisition Portal</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta http-equiv="X-Frame-Options" content="DENY" />
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<![endif]-->
<!--
<meta http-equiv="X-UA-Compatible" content="IE=10" />
-->
<link href="css/bootstrap/css/bootstrap.min.css" rel="stylesheet"/>
<link href="css/styles.css" rel="stylesheet"/>
</head>
<body>
<header class="bg-deepblue" id="headerArea" role="navigation">
<div class="container-fluid">
<nav class="navbar-header"> <a class="navbar-brand"> <img src="assets/charter_white_logo.png"alt="Charter Communications"> </a> </nav>
</div>
<div class="container"> <span class="row pull-right charterTitle"> Acquisition Business Rules & Recruiting Services Playbook </span> </div>
</header>
<div class="container-fluid">
<div class="row">
<div class="col-lg-3">
<div class="row">
<div clas="col-lg-10">
<nav clas="navbar navbar-inverse">
<div class=" bg-teal">
<ul class="nav nav-pills nav-stacked">
<li class="nav-item"><a class="nav-link" href="#rules" data-toggle="tab">Business Rules and Compliance</a></li>
<li class="nav-item"><a class="nav-link" href="#piplining" data-toggle="tab">Sourcing & Pipelining Programs</a></li>
<li class="nav-item"><a class="nav-link" href="#branding" data-toggle="tab">Employee Branding & Social media</a></li>
<li class="nav-item"><a class="nav-link" href="#selection" data-toggle="tab">Selection & Assessment</a></li>
<li class="nav-item"><a class="nav-link" href="#resources" data-toggle="tab">Additional Tools & Resources</a></li>
<li class="nav-item"><a class="nav-link" href="#benefits" data-toggle="tab">Benefits Resources For Recruiting</a></li>
<li class="nav-item"><a class="nav-link" href="#onboarding" data-toggle="tab">Onboarding & Employee Service Center</a></li>
</ul>
</div>
</nav>
<div class="text-left text-uppercase"><b style="color: #005F9B">Most Popular</b></div>
<ul class="nav nav-stacked bg-lightgrey">
<li class="nav-item"> <a class="nav-link" href="#"id="1"><small class="badge bg-danger">1</small><b style="color: #005F9B"> Compliance at a Glance</b></a> </li>
<li class="nav-item"> <a class="nav-link" href="#"id="2"><small class="badge bg-danger">2</small><b style="color: #005F9B"> Requisition Request Form</b></a> </li>
<li class="nav-item"> <a class="nav-link" href="#"id="3"><small class="badge bg-danger">3</small><b style="color: #005F9B"> Internal Transfer Process</b></a> </li>
<li class="nav-item"> <a class="nav-link" href="#"id="4"><small class="badge bg-danger">4</small><b style="color: #005F9B"> Sourcing Tool Kit </b></a> </li>
<li class="nav-item"> <a class="nav-link" href="#"id="5"><small class="badge bg-danger">5</small><b style="color: #005F9B"> Brand Guidelines & Logos</b></a> </li>
</ul>
</div>
<div clas="col-lg-2">
</div>
</div>
</div>
<div class="col-lg-9" id="home">
<p> <span>The Talent Acquisition Playbook was created to promote sound and effective recruiting practices by
providing HR and Recruiting with a valuable resource of guidelines, reference materials, and a list of the
services we provide.</span> </p>
<p> <span><b>This portal contains:</b><br />
Guidelines to meet OFCCP compliance requirements with regards to Talent Acquisition activities
Reference materials, suggested work rules, policies, and expectations
Services provided by the Recruiting Services Team
Contact information</span> </p>
</div>
</div>
<!-- <div class="col-md-2 col-lg-2"id="mostpop">
<div class="text-center text-uppercase"><b style="color: #005F9B">Most Popular</b></div>
<ul class="nav nav-stacked bg-lightgrey">
<li class="nav-item"> <a class="nav-link" href="#"id="1"><small class="badge bg-danger">1</small><b style="color: #005F9B"> Compliance at a Glance</b></a> </li>
<li class="nav-item"> <a class="nav-link" href="#"id="2"><small class="badge bg-danger">2</small><b style="color: #005F9B"> Requisition Request Form</b></a> </li>
<li class="nav-item"> <a class="nav-link" href="#"id="3"><small class="badge bg-danger">3</small><b style="color: #005F9B"> Internal Transfer Process</b></a> </li>
<li class="nav-item"> <a class="nav-link" href="#"id="4"><small class="badge bg-danger">4</small><b style="color: #005F9B"> Sourcing Tool Kit </b></a> </li>
<li class="nav-item"> <a class="nav-link" href="#"id="5"><small class="badge bg-danger">5</small><b style="color: #005F9B"> Brand Guidelines & Logos</b></a> </li>
</ul>
</div>
-->
</div>
</div>
</div>
</body>
</html>
/* CSS Document */
p{color:#005F9B;
}
p,small{color:#005F9B;
}
.groupHeader {color:black;
}
a {
color: #FFFFFF;
text-decoration: none;
}
/* Navbar Header */
.navbar-inverse{ background-color: #003057;
}
.bg-deepblue {
background-color: #003057;
}
.bg-teal {
background-color: #009E8C;
}
.bg-lightgrey{background-color: #D3D3D3;
}
.bg-info {
background-color: #0077BB;
}
.navbar {
margin-bottom: 0px;
border:none;
}
.nav li a
{
/*height: 78px;*/
/*text-align: center;*/
/* line-height: 50px;*/
color: #FFFFFF;
}
/*.nav-tabs .show.nav-item .nav-link, .nav-tabs .active.nav-link {
text-decoration:;
background-color: #808285;
border-bottom:7px solid #0077BB ;
}*/
.nav li:hover
{
background-color: #D3D3D3;
}
.nav-tabs{
background-color:#009E8C;
border-bottom: hidden;
}
.nav-pills{
background-color:#009E8C;
border-bottom: hidden;
}
.tab-content{ background-color: #808285;
border-bottom:1px solid #0077BB ;
padding-top: 5px;
padding-right: 15px;
padding-left: 15px;
/*padding-right: 25px;*/
/*min-height: 440px*/
}
.tab-pane{
font-size: large;
}
.nav-tabs > li > a{
border: medium none;
}
.nav-tabs > li > a:hover{
background-color: #D3D3D3;
border: medium none;
border-radius: 0;
color:#005F9B;
font-weight: bold;
}
.nav-pills > li > a:hover{
background-color: #D3D3D3;
border: medium none;
border-radius: 0;
color:#005F9B;
font-weight: normal;
}
.nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover
{
color: #FFFFFF;
background-color: #808285;
border-bottom:5px solid #0077BB ;
font-weight: bold;
}
.navbar-inverse > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover
{
color: #FFFFFF;
background-color: #808285;
border-bottom:5px solid #0077BB ;
font-weight: bold;
}
.nav-pills > li.active > a, .nav-pills > li.active > a:focus, .nav-pills > li.active > a:hover
{
color: #FFFFFF;
background-color: #808285;
border-bottom:5px solid #0077BB ;
font-weight: bold;
}
/* End Navbar Header */
.btn-default {
display:block;
margin:auto;
width:120px;
}
#rcorners1 {
border-radius: 25px;
background: #D3D3D3;
padding-bottom:15px;
color:#0077BC;
}
#rcorners1 small{
border-radius: 25px;
background: #D3D3D3;
padding-bottom:15px;
color:#0077BC;
}
.vcenter {
display: inline-block;
vertical-align: bottom;
float: none;
}
.charterTitle
{
font-family: Gotham;
font-size:xx-large;
color: #FFFFFF;
}
/* Navbar Footer */
.charterFooter
{
font-family: Gotham;
/*font-size: 22px;*/
color: #FFFFFF;
}
$("#submit").click(function(){
var email = 'krista.davis@charter.com';
var subject = 'Talent Acquisition Portal Recommendations';
var emailBody = $("#emailMessage").val();
window.location = 'mailto:' + email + '?subject=' + subject + '&body=' + emailBody;
location.reload();
});
$(".nav-link").click(function(){
//Check the div id
$('.tab-content').slideDown();
$("#home").slideUp();
});
$(document).ready(function(){
$(".nav-link").hover(function(e){
if(this.id=="1"){e.preventDefault();}
else if(this.id=="2"){e.preventDefault();}
else if(this.id=="3"){e.preventDefault();}
else if(this.id=="4"){e.preventDefault();}
else if(this.id=="5"){e.preventDefault();}
else
{
$("#home").slideUp();
$(this).tab('show');}
});
$('body').keydown(function(e){
if (e.which==27){location.reload();}
});
});
