Link to home
Start Free TrialLog in
Avatar of Howard Bash
Howard BashFlag for United States of America

asked on

The Menu is good, but needs a couple of Tweaks

I had this question after viewing Handling the alignment of the Drop down Divs.

I have a menu built from DIVs and some CSS for styling/behavior.  It is close, but needs a bit more.  
1) the top level menu items on hover need to be blue text on white background
2) the dropdown from the link, on hover needs to show a box (a white DIV?) that connects the top link with the drop down on hover
3) the drop down needs "drop shadow" if possible...

I have included a figure, the CSS and the DIV for review.
User generated image
The CSS
<style type="text/css">

a , a:hover{
  text-decoration: none!important;
}

.menu-container {
  position: relative;
}
.menu-container .item {
  float: left;
  padding: 0 15px;
}
.menu-container .item > a {
   padding-top: 5px;  
   padding-bottom: 5px;
}
.menu-container:after {
  display: table;
  content: " ";
  clear: both;
}
.sub-menu {
  background: #fff;
  border: 1px solid black;
  display: none;
//  left: 0;
  position: absolute;
}
.item:hover .sub-menu {
  display: block;
  border-width:1px;
  border-color:green;
 // border-radius:20px;
  margin:3px 0 0 0;
}

.item:hover > a {
  background: blue;
  color: white;
}

.item > a {
  color:white !Important;
}

.customWidth {
	width: 100%;
	height:50px;
	background-color: #0c7ff2;
	margin: auto;
}

.container {
	width:90%;
}

div[class$='container'] {
  padding-top: 5px;
}
</style>

Open in new window


The NAV DIV Structure
<div class="customWidth">

      <div class="container">          
        <div class="menu-container">
            
          <div class="item">
            <a href="http://www.w3schools.com/js/default.asp">1-JavaScript Tutorial</a><br/><br/>
              <div class="sub-menu">
                <div class="col_1" style="float:left;padding:5px 25px 5px 5px; height:auto;width:auto;">
                  <a href="http://www.w3schools.com/js/default.asp">2-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">3-HTML Tutorial</a><br/>
                  <a href="http://www.w3schools.com/js/default.asp">4-JavaScript Tutorial</a><br/>
                </div><!-- Close Col Div  -->
              
                <div class="col_2" style="float:left;padding:5px 25px 5px 5px; height:auto;width:auto;">
                  <a href="http://www.w3schools.com/js/default.asp">5-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">6-HTML Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/js/default.asp">7-JavaScript Tutorial</a><br/>
                </div><!-- Close Col Div  -->
    
                <div class="col_3" style="float:left;padding:5px 25px 5px 5px; height:auto;width:auto;">
                  <a href="http://www.w3schools.com/js/default.asp">8-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">9-HTML Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/js/default.asp">10-JavaScript Tutorial</a><br/>
                </div><!-- Close Col Div  -->
    
                <div class="col_4" style="float:left;padding:5px 25px 5px 5px; height:auto;width:auto;">
                  <a href="http://www.w3schools.com/js/default.asp">11-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">12-HTML Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/js/default.asp">13-JavaScript Tutorial</a><br/>
                </div><!-- Close Col Div  -->
    
                <div class="col_5" style="float:left;padding:5px 25px 5px 5px; height:auto;width:auto;">
                  <a href="http://www.w3schools.com/js/default.asp">14-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">15-HTML Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/js/default.asp">16-JavaScript Tutorial</a><br/>
                </div><!-- Close Col Div  -->
    
                <div class="col_6" style="float:left;padding:5px 25px 5px 5px; height:auto;width:auto;">
                  <a href="http://www.w3schools.com/js/default.asp">17-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">18-HTML Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/js/default.asp">19-JavaScript Tutorial</a><br/>
                </div><!-- Close Col Div  -->
              </div>
              
          </div>
                
          <div class="item">
            <a href="http://www.w3schools.com/js/default.asp">20-JavaScript Tutorial</a><br/><br/>
               
              <div class="sub-menu">
                <div class="col_1" style="float:left;padding:5px 25px 5px 5px; height:auto;width:auto;">
                  <a href="http://www.w3schools.com/js/default.asp">21-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">22-HTML Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/js/default.asp">23-JavaScript Tutorial</a><br/>
                </div><!-- Close Col Div  -->
                
                <div class="col_2" style="float:left;padding:5px 25px 5px 5px;  height:auto;width:auto;">
                  <a href="http://www.w3schools.com/js/default.asp">24-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">25-HTML Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/js/default.asp">26-JavaScript Tutorial</a><br/>
                </div><!-- Close Col Div  -->
    
                <div class="col_3" style="float:left;padding:5px 25px 5px 5px;  height:auto;width:auto;">
                  <a href="http://www.w3schools.com/js/default.asp">27-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">28-HTML Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/js/default.asp">29-JavaScript Tutorial</a><br/>
                </div><!-- Close Col Div  -->
    
                <div class="col_4" style="float:left;padding:5px 25px 5px 5px; height:auto;width:auto;">
                  <a href="http://www.w3schools.com/js/default.asp">30-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">31-HTML Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/js/default.asp">32-JavaScript Tutorial</a><br/>
                </div><!-- Close Col Div  -->
    
                <div class="col_5" style="float:left;padding:5px 25px 5px 5px; height:auto;width:auto;">
                  <a href="http://www.w3schools.com/js/default.asp">33-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">34-HTML Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/js/default.asp">35-JavaScript Tutorial</a><br/>
                </div><!-- Close Col Div  -->
    
                <div class="col_6" style="float:left;padding:5px 25px 5px 5px;  height:auto;width:auto;">
                  <a href="http://www.w3schools.com/js/default.asp">36-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">37-HTML Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/js/default.asp">38-JavaScript Tutorial</a><br/>
                </div><!-- Close Col Div  -->
              </div>
            </div>
    
          <div class="item">
            <a href="http://www.w3schools.com/js/default.asp">20-JavaScript Tutorial</a><br/><br/>
               
              <div class="sub-menu">
                <div class="col_1" style="float:left;padding:5px 25px 5px 5px; height:auto;width:auto;">
                  <a href="http://www.w3schools.com/js/default.asp">21-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">22-HTML Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/js/default.asp">23-JavaScript Tutorial</a><br/>
                </div><!-- Close Col Div  -->
                
                <div class="col_2" style="float:left;padding:5px 25px 5px 5px; height:auto;width:auto;">
                  <a href="http://www.w3schools.com/js/default.asp">24-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">25-HTML Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/js/default.asp">26-JavaScript Tutorial</a><br/>
                </div><!-- Close Col Div  -->
        
                <div class="col_3" style="float:left;padding:5px 25px 5px 5px; height:auto;width:auto;">
                  <a href="http://www.w3schools.com/js/default.asp">36-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">37-HTML Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/js/default.asp">38-JavaScript Tutorial</a><br/>
                </div><!-- Close Col Div  -->
              </div>
            </div>
            
          <div class="item">
            <a href="http://www.w3schools.com/js/default.asp">20-JavaScript Tutorial</a><br/><br/>
               
              <div class="sub-menu">
                <div class="col_1" style="float:left;padding:5px 25px 5px 5px; height:auto;width:auto;">
                  <a href="http://www.w3schools.com/js/default.asp">21-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">22-HTML Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/js/default.asp">23-JavaScript Tutorial</a><br/>
                </div><!-- Close Col Div  -->
                
                <div class="col_2" style="float:left;padding:5px 25px 5px 5px; height:auto;width:auto;">
                  <a href="http://www.w3schools.com/js/default.asp">24-JavaScript Tutorial</a><br/>    
                </div><!-- Close Col Div  -->            
              </div>              
            </div>                           
        </div>            
      </div>      
</div>

Open in new window

Avatar of Member_2_248744
Member_2_248744
Flag of United States of America image

greetings   hbash, , , ,  Here is some code you can try, the HTML and CSS you have , in my view are kind of mixed up and out of date. I changed some of the things in the HTML and the CSS to get the things you say you need -

1) the top level menu items on hover need to be blue text on white background
2) the dropdown from the link, on hover needs to show a box (a white DIV?) that connects the top link with the drop down on hover
3) the drop down needs "drop shadow" if possible...

I also added a HOVER effect for the sub-menu <a>
here is the style portion
<style>
a , a:hover{
  text-decoration: none!important;
}

.menu-container {
  position: relative;
}
.menu-container .item {
  float: left;
  padding: 0 8px;
}
.menu-container .item > a {
 /*  padding-top: 5px;  
   padding-bottom: 5px;*/
  padding: 5px;
}
.menu-container:after {
  display: table;
  content: " ";
  clear: both;
}
.sub-menu {
  background: #fff;
  border: 1px solid green;
  display: none;
  position: absolute;
  top: 22px;
  border-radius: 8px;
  box-shadow: 5px 5px 4px #444;
}

.sub-menu div {
  float:left;
  padding:5px 11px 5px 11px;
  border-right: 1px solid #bbb;
}

.sub-menu div a:hover {
  background: blue;
  color: white;
}

.item:hover .sub-menu {
  display: block;
}

.item > a {
  color:white;
  border-radius: 8px;
}

.item:hover > a {
  background: white;
  color: blue;
}

.customWidth {
  width: 44em;
  height:42px;
  padding-top:9px;
  background-color: #0c7ff2;
}

.container {
  width:90%;
  padding-top: 5px;
}

</style>

Open in new window


here is the HTML portion
<div class="customWidth">

      <div class="container">          
        <div class="menu-container">
            
          <div class="item">
            <a href="http://www.w3schools.com/js/default.asp">1-JavaScript Tutorial</a>
              <div class="sub-menu">
                <div>
                  <a href="http://www.w3schools.com/js/default.asp">2-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">3-HTML Tutorial</a><br/>
                  <a href="http://www.w3schools.com/js/default.asp">4-JavaScript Tutorial</a><br/>
                </div>
				<div>
                  <a href="http://www.w3schools.com/js/default.asp">5-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">6-HTML Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/js/default.asp">7-JavaScript Tutorial</a><br/>
                </div>
				<div>
                  <a href="http://www.w3schools.com/js/default.asp">8-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">9-HTML Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/js/default.asp">10-JavaScript Tutorial</a><br/>
                </div>
				<div>
                  <a href="http://www.w3schools.com/js/default.asp">11-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">12-HTML Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/js/default.asp">13-JavaScript Tutorial</a><br/>
                </div>
				<div>
                  <a href="http://www.w3schools.com/js/default.asp">14-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">15-HTML Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/js/default.asp">16-JavaScript Tutorial</a><br/>
                </div>
				<div>
                  <a href="http://www.w3schools.com/js/default.asp">17-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">18-HTML Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/js/default.asp">19-JavaScript Tutorial</a><br/>
                </div><!-- Close Col Div  -->
              </div>
              
          </div>
                
          <div class="item">
            <a href="http://www.w3schools.com/js/default.asp">20-JavaScript Tutorial</a><br/><br/>
               
              <div class="sub-menu">
                <div>
                  <a href="http://www.w3schools.com/js/default.asp">21-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">22-HTML Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/js/default.asp">23-JavaScript Tutorial</a><br/>
                </div><!-- Close Col Div  -->
                
                <div>
                  <a href="http://www.w3schools.com/js/default.asp">24-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">25-HTML Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/js/default.asp">26-JavaScript Tutorial</a><br/>
                </div><!-- Close Col Div  -->
    
                <div>
                  <a href="http://www.w3schools.com/js/default.asp">27-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">28-HTML Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/js/default.asp">29-JavaScript Tutorial</a><br/>
                </div><!-- Close Col Div  -->
    
                <div>
                  <a href="http://www.w3schools.com/js/default.asp">30-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">31-HTML Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/js/default.asp">32-JavaScript Tutorial</a><br/>
                </div><!-- Close Col Div  -->
    
                <div>
                  <a href="http://www.w3schools.com/js/default.asp">33-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">34-HTML Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/js/default.asp">35-JavaScript Tutorial</a><br/>
                </div><!-- Close Col Div  -->
    
                <div>
                  <a href="http://www.w3schools.com/js/default.asp">36-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">37-HTML Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/js/default.asp">38-JavaScript Tutorial</a><br/>
                </div><!-- Close Col Div  -->
              </div>
            </div>
    
          <div class="item">
            <a href="http://www.w3schools.com/js/default.asp">20-JavaScript Tutorial</a><br/><br/>
               
              <div class="sub-menu">
                <div>
                  <a href="http://www.w3schools.com/js/default.asp">21-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">22-HTML Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/js/default.asp">23-JavaScript Tutorial</a><br/>
                </div><!-- Close Col Div  -->
                
                <div>
                  <a href="http://www.w3schools.com/js/default.asp">24-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">25-HTML Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/js/default.asp">26-JavaScript Tutorial</a><br/>
                </div><!-- Close Col Div  -->
        
                <div>
                  <a href="http://www.w3schools.com/js/default.asp">36-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">37-HTML Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/js/default.asp">38-JavaScript Tutorial</a><br/>
                </div><!-- Close Col Div  -->
              </div>
            </div>
            
          <div class="item">
            <a href="http://www.w3schools.com/js/default.asp">20-JavaScript Tutorial</a><br/><br/>
               
              <div class="sub-menu">
                <div>
                  <a href="http://www.w3schools.com/js/default.asp">21-JavaScript Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/html/default.asp">22-HTML Tutorial</a><br/>    
                  <a href="http://www.w3schools.com/js/default.asp">23-JavaScript Tutorial</a><br/>
                </div><!-- Close Col Div  -->
                
                <div>
                  <a href="http://www.w3schools.com/js/default.asp">24-JavaScript Tutorial</a><br/>    
                </div><!-- Close Col Div  -->            
              </div>              
            </div>                           
        </div>            
      </div>      
</div>

Open in new window


I actually placed a Custom Width in the "customWidth" <div> as the 100% you had is NOT a custom width
Avatar of Howard Bash

ASKER

Some nice stuff!!!

But,  it has lost the columns.  In the original structure, per sub-menu,  you have col_1 through col_n.

Also,  the dropdown  is overlapping the menu bar.  It needs some separation from the menu bar, which is why I thought it needed some kind of "extra" div per sub-menu that will "bridge" the top level menu bar from the dropdown.

Nice work though.  I wish I had your skills in this!

User generated image
OK, I simply can not do meaningful corrections on a very poor (my opinion) menu element  construction and position structuring. Also I can not just do your menu tweeking for you, as this isn't even a "Production" menu, just a thrown together "Test" with the same TEXT in all of the different sections. So a Production menu (with real menu elements) would be of different "Widths" of TEXT outputs.

First you do NOT have the sub-menu <div> positioned relative to the specific  <div class="item"> that it is a sub menu for, instead you have the menu-container as the positioning base -
       .menu-container {
          position: relative;
        }
which gives you the display that may think works, but a CSS menu with sub menus is a more complicated arrangement.

As to the -
    "dropdown  is overlapping the menu bar"
the way you have your ITEM padding on this may prevent a separation placing of the sub-menu, .
but the sub-menu vertical positioning is here -
    .sub-menu {
      background: #fff;
      border: 1px solid green;
      display: none;
      position: absolute;
      top: 31px; /* CHANGE THIS TOP */
      border-radius: 8px;
      box-shadow: 5px 5px 4px #444;
    }

the
 top: 31px;
will change where the sub is relative to the menu-container
- - - - - - - - - - - - -

As to the -
    "lost the columns"
No it still has columns in the sub-menu, but I condensed the CSS for the column <div> to -
    .sub-menu div {
       float:left;
       padding:5px 11px 5px 11px;
       border-right: 1px solid #bbb;
    }

I can not help but mention that your use of these many many columns is not good menu design, but since this is just a TEST, I guess it may change.
Hi.  Let me try to explain the situation on this.  I start with a JSON file that a user creates/updates/uploads.  I read the JSON file into an array and using that array build the DIV structure.  Once the structure is built,  I apply it to a DIV on the page using jQuery.

The solution you offer is nice, but not quite what I need and thought I had described.  Also,  the original DIV structure and CSS for rendering was built by a gentleman on this site named Julian Hansen.

Let me paste the solution as it is now to show you why the columns your version renders isn't quite right.

The Needed Column Layout
User generated image
The Layout as per your solution
User generated image
Also,  if I increase that top value as suggested the sub menu does drop down,  but I cannot select any items as the sub menu disappears when I move off the top level link.
the "sub menu disappears when I move off the top level link" is due to your padding settings.

AND the columns drop down to the next level, just as they are suppose to, and they have TWO rows of columns, because I set a CUSTOM WIDTH of -
    width: 44em;

ad there is JUST room for three columns in a -
     width: 44em;

if you want columns to do as you had at first then change the CUSTOM WIDTH to -
    width: 100%;

as I said, your understanding of the positioning and use in responsive sites is very very limited, , as to the Julian Hansen design, he did an overly simplistic design for you to make it simple for your described needs, I have seen Julian Hansen do responsive and relativistic CSS design, so he was not trying to some responsive here, just very simple.
Changing that width to 100% did as required.  That is great.  The menu is almost what I need.  

There are two outstanding issues with this implementation.  

First,  if I increase top to say 45px the dropdown indeed is rendered lower and I have the space required below the menu bar.   However,  I cannot click any of the dropdown links as once I move off the top level link, the sub-menu disappears.

Also, the last piece of this puzzle would be to figure out how to implement that "bridge" DIV that would appear when the dropdown does which would  give the look of being attached to the link which was hovered over.
Avatar of Julian Hansen
There are a few things to consider.
1. You did not follow my advice from your earlier thread regarding removing the margin: 3px 0 0 0 on the sub-menu - this was causing the menu to disappear

2. You have used <br/> on your <a> elements to force line breaks - in this situation better to style them as display: block

3. You used !important a few times - avoid this if at all possible because it can have unexpected effects - like the color on your main menu items

4. Try make your styles appear in the order of the DOM hierarchy they represent.

5. Try and avoid inline styling as you have on your submenu <div>'s rather make a class and style in css

There were a few other things you can see from the code below.

CSS
<style type="text/css">
a , a:hover{
  text-decoration: none!important;
}
* {
  box-sizing: border-box;
}
.customWidth {
  width: 100%;
  height:50px;
  background-color: #0c7ff2;
  margin: auto;
}
.container {
  width:90%;
  padding-top: 5px;
}
.menu-container {
  position: relative;
}
.menu-container .item {
  float: left;
  padding: 0 15px;
}
.menu-container .item > a {
  padding-top: 5px;  
  padding-bottom: 5px;
}
.menu-container:after {
  display: table;
  content: " ";
  clear: both;
}
.item:hover .sub-menu {
  display: block;
  border-width:1px;
  border-color:green;
}
.item > a {
  color:white;
  display: block;
  height: 100%;
}
.item:hover > a {
  background: white;
  color: blue;
}
.sub-menu {
  background: #fff;
  display: none;
  position: absolute;
  padding-top: 3px;
  box-shadow: 3px 3px 3px #000;
}
.sub-menu-item {
  float:left;
  padding:5px 25px 5px 5px; 
  height:auto;
  width:auto;
}
.sub-menu-item a {
  display: block;
}
</style>

Open in new window

HTML
<div class="customWidth">
  <div class="container">          
    <div class="menu-container">
      <div class="item">
        <a href="http://www.w3schools.com/js/default.asp">1-JavaScript Tutorial</a>
        <div class="sub-menu">
          <div class="col_1 sub-menu-item">
            <a href="http://www.w3schools.com/js/default.asp">2-JavaScript Tutorial</a>    
            <a href="http://www.w3schools.com/html/default.asp">3-HTML Tutorial</a>
            <a href="http://www.w3schools.com/js/default.asp">4-JavaScript Tutorial</a>
          </div><!-- Close Col Div  -->
          <div class="col_2 sub-menu-item">
            <a href="http://www.w3schools.com/js/default.asp">5-JavaScript Tutorial</a>    
            <a href="http://www.w3schools.com/html/default.asp">6-HTML Tutorial</a>    
            <a href="http://www.w3schools.com/js/default.asp">7-JavaScript Tutorial</a>
          </div><!-- Close Col Div  -->
          <div class="col_3 sub-menu-item">
            <a href="http://www.w3schools.com/js/default.asp">8-JavaScript Tutorial</a>    
            <a href="http://www.w3schools.com/html/default.asp">9-HTML Tutorial</a>    
            <a href="http://www.w3schools.com/js/default.asp">10-JavaScript Tutorial</a>
          </div><!-- Close Col Div  -->
          <div class="col_4 sub-menu-item">
            <a href="http://www.w3schools.com/js/default.asp">11-JavaScript Tutorial</a>    
            <a href="http://www.w3schools.com/html/default.asp">12-HTML Tutorial</a>    
            <a href="http://www.w3schools.com/js/default.asp">13-JavaScript Tutorial</a>
          </div><!-- Close Col Div  -->
          <div class="col_5 sub-menu-item">
            <a href="http://www.w3schools.com/js/default.asp">14-JavaScript Tutorial</a>    
            <a href="http://www.w3schools.com/html/default.asp">15-HTML Tutorial</a>    
            <a href="http://www.w3schools.com/js/default.asp">16-JavaScript Tutorial</a>
          </div><!-- Close Col Div  -->
          <div class="col_6 sub-menu-item">
            <a href="http://www.w3schools.com/js/default.asp">17-JavaScript Tutorial</a>    
            <a href="http://www.w3schools.com/html/default.asp">18-HTML Tutorial</a>    
            <a href="http://www.w3schools.com/js/default.asp">19-JavaScript Tutorial</a>
          </div><!-- Close Col Div  -->
        </div>
      </div>

      <div class="item">
        <a href="http://www.w3schools.com/js/default.asp">20-JavaScript Tutorial</a>
        <div class="sub-menu">
          <div class="col_1 sub-menu-item">
            <a href="http://www.w3schools.com/js/default.asp">21-JavaScript Tutorial</a>    
            <a href="http://www.w3schools.com/html/default.asp">22-HTML Tutorial</a>    
            <a href="http://www.w3schools.com/js/default.asp">23-JavaScript Tutorial</a>
          </div><!-- Close Col Div  -->
          <div class="col_2 sub-menu-item">
            <a href="http://www.w3schools.com/js/default.asp">24-JavaScript Tutorial</a>    
            <a href="http://www.w3schools.com/html/default.asp">25-HTML Tutorial</a>    
            <a href="http://www.w3schools.com/js/default.asp">26-JavaScript Tutorial</a>
          </div><!-- Close Col Div  -->
          <div class="col_3 sub-menu-item">
            <a href="http://www.w3schools.com/js/default.asp">27-JavaScript Tutorial</a>    
            <a href="http://www.w3schools.com/html/default.asp">28-HTML Tutorial</a>    
            <a href="http://www.w3schools.com/js/default.asp">29-JavaScript Tutorial</a>
          </div><!-- Close Col Div  -->
          <div class="col_4 sub-menu-item">
            <a href="http://www.w3schools.com/js/default.asp">30-JavaScript Tutorial</a>    
            <a href="http://www.w3schools.com/html/default.asp">31-HTML Tutorial</a>    
            <a href="http://www.w3schools.com/js/default.asp">32-JavaScript Tutorial</a>
          </div><!-- Close Col Div  -->
          <div class="col_5 sub-menu-item">
            <a href="http://www.w3schools.com/js/default.asp">33-JavaScript Tutorial</a>    
            <a href="http://www.w3schools.com/html/default.asp">34-HTML Tutorial</a>    
            <a href="http://www.w3schools.com/js/default.asp">35-JavaScript Tutorial</a>
          </div><!-- Close Col Div  -->
          <div class="col_6 sub-menu-item">
            <a href="http://www.w3schools.com/js/default.asp">36-JavaScript Tutorial</a>    
            <a href="http://www.w3schools.com/html/default.asp">37-HTML Tutorial</a>    
            <a href="http://www.w3schools.com/js/default.asp">38-JavaScript Tutorial</a>
          </div><!-- Close Col Div  -->
        </div>
      </div>

      <div class="item">
        <a href="http://www.w3schools.com/js/default.asp">20-JavaScript Tutorial</a>

        <div class="sub-menu">
          <div class="col_1 sub-menu-item">
            <a href="http://www.w3schools.com/js/default.asp">21-JavaScript Tutorial</a>    
            <a href="http://www.w3schools.com/html/default.asp">22-HTML Tutorial</a>    
            <a href="http://www.w3schools.com/js/default.asp">23-JavaScript Tutorial</a>
          </div><!-- Close Col Div  -->
          <div class="col_2 sub-menu-item">
            <a href="http://www.w3schools.com/js/default.asp">24-JavaScript Tutorial</a>    
            <a href="http://www.w3schools.com/html/default.asp">25-HTML Tutorial</a>    
            <a href="http://www.w3schools.com/js/default.asp">26-JavaScript Tutorial</a>
          </div><!-- Close Col Div  -->
          <div class="col_3 sub-menu-item">
            <a href="http://www.w3schools.com/js/default.asp">36-JavaScript Tutorial</a>    
            <a href="http://www.w3schools.com/html/default.asp">37-HTML Tutorial</a>    
            <a href="http://www.w3schools.com/js/default.asp">38-JavaScript Tutorial</a>
          </div><!-- Close Col Div  -->
        </div>
      </div>
      <div class="item">
        <a href="http://www.w3schools.com/js/default.asp">20-JavaScript Tutorial</a>
        <div class="sub-menu">
          <div class="col_1 sub-menu-item">
            <a href="http://www.w3schools.com/js/default.asp">21-JavaScript Tutorial</a>    
            <a href="http://www.w3schools.com/html/default.asp">22-HTML Tutorial</a>    
            <a href="http://www.w3schools.com/js/default.asp">23-JavaScript Tutorial</a>
          </div><!-- Close Col Div  -->
          <div class="col_2 sub-menu-item">
            <a href="http://www.w3schools.com/js/default.asp">24-JavaScript Tutorial</a>    
          </div><!-- Close Col Div  -->            
        </div>
      </div>                           
    </div>            
  </div>      
</div>

Open in new window

Working sample here
If you want to make the drop down flush with the container rather than overlapping then you can change your CSS to this
CSS
<style type="text/css">
a , a:hover{
  text-decoration: none!important;
}
* {
  box-sizing: border-box;
}
.customWidth {
  width: 100%;
  height:50px;
  background-color: #0c7ff2;
  margin: auto;
}
.container {
  width:90%;
}
.menu-container {
  position: relative;
}
.menu-container .item {
  float: left;
  padding: 0 15px;
}
.menu-container .item > a {
  line-height: 50px;
}
.menu-container:after {
  display: table;
  content: " ";
  clear: both;
}
.item:hover .sub-menu {
  display: block;
  border-width:1px;
  border-color:green;
}
.item > a {
  color:white;
  display: block;
  height: 100%;
}
.item:hover > a {
  background: white;
  color: blue;
}
.sub-menu {
  background: #fff;
  display: none;
  position: absolute;
  padding-top: 3px;
  box-shadow: 3px 3px 3px #000;
}
.sub-menu-item {
  float:left;
  padding:5px 25px 5px 5px; 
  height:auto;
  width:auto;
}
.sub-menu-item a {
  display: block;
}
</style>

Open in new window

Working sample here
Your sample looks 99 percent perfect.   Is it possible though to have the dropdown appear slightly lower (something that I can tweak the number of pixels)?

The reason I thought I needed to use the !important was that the page that I am placing the DIV/NAV structure and CSS on is a SharePoint master page which is loaded with CSS, classes and styling out of the box.  

But I really appreciate your help and wisdom and will try to follow your advice as closely as I can.

Still very "wet behind the ears" on using CSS.  If you can recommend any books/tutorials etc,  that would be great too.

Thanks!
Lower: how much? Currently the second sample aligns with the menu container bar - if you want to go lower you are going to make it complicated because you are going to get a gap between sub-menu and menu?

!important - should rarely need to be used - you just need to get your path right. For instance if you have a style

.container .subContainer a.link {
   color: #fff;
}

Open in new window

And then you do this
a.link {
  color: #000;
}

Open in new window

It won't work - however if you do this (keep the path the same) it will overwrite the previous style
.container .subContainer a.link { 
  color: #000;
}

Open in new window

So in your case just make sure you get the path right and !important won't be necessary. If you have to use it make sure you target exactly the elements you want to change. If you have
<style type="text/css">
.container a {
   color: #fff!important;
}

</style>
...
<div class="container">
    <a ....>
       <div class="sub-menu">
          <a ...>
        </div>
</div>

Open in new window

This will ensure <a> at both levels will be forced to white - which may not be what you want. Use the child (>) operator to narrow it down (as shown below) which ensures that only immediate children of .container are affected.
.container > a {
  color: #fff!important
}

Open in new window

Got it!  Thanks for this knowledge...

The goal for the submenu is to show the page background between the top level link and the drop down menu.  If I had to guess a number,  I would think 25px separation would do it.  Unless you think getting that affect is too much to do/over the top and I will press the user to reconsider.

The look to me is fine as is, but people get it in their heads what something "should" look like and it's tough to get them to adjust their expectations.
The goal for the submenu is to show the page background between the top level link and the drop down menu
Ok but based on your OP
2) the dropdown from the link, on hover needs to show a box (a white DIV?) that connects the top link with the drop down on hover
If you are going to have a 25px gap then how are you going to satisfy the above?

I don't think I am understanding the requirement - 25px gap between sub-menu and parent seems excessive - what is the thinking there?
The 2) item was how I thought to do this.  Something to bridge the space between the top level link and the sub menu which is below the navigation bar and so showing the page background.
I know but I am questioning the design - to have the sub-menu so far below its parent. This goes against most standards with respect to menu systems and while most things are possible it is not really practical in this situation - I am wondering why you want such a big gap.

Typically we don't have gaps because of the problems it creates moving mouse from parent to sub-menu - to do this would probably mean JavaScript - which is really not necessary for menus and (in my view) is overkill.

Let me know what your thinking is here.
Here is a design fragment (built by art department)
User generated image
Perhaps adding a dummy row per column on the sub-menu would do it?

Also,  how can I add a left and right padding/margin to the top level item so that on hover, the bordering box has space on both side as in the frag above?
ASKER CERTIFIED SOLUTION
Avatar of Julian Hansen
Julian Hansen
Flag of South Africa image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
The thing is though (there always is some thing ;-) ),  the sub-menu overlays the menu a bit.  The padding does increase the vertical size of the sub-menu but it still overlays the main menu a bit.

In the figure,  you can see that the submenu is not overlaying but butted against the main menu.

And,  you're right I should have included that figure sooner.
In the figure,  you can see that the submenu is not overlaying but butted against the main menu.
Are you sure you are looking at the right sample? This is the updated one http://www.marcorpsa.com/ee/t1648a.html
See image below - submenu is flush with the menu bar
User generated image
I will double check and get back to you soon.  Perhaps something is noodling with the banner height and causing this?
I think because the DIV structure is being embedded in another structure (SharePoint loves nesting DIVs),  there is an overlap. If we can pad the dropdown and I can adjust the pixel count until it borders as you have demonstrated,  that would work.
Padding just makes the sub-menu div bigger it does not change its orientation relative to the parent.
I am confused though - even if SP does embed - styling is relative to the parent so if you have the markup exactly as I demonstrated there should be no overlap.
Can you post your full source.
The full source would be a SharePoint master page.  These pages are a mess to review.  The best I can do is suggest that the DIV structure is getting embedded via JQuery inside a DIV structure and that the containing DIV is restricting the positioning of the NAV DIV.

It may be okay as is.  The look will be reviewed today and perhaps the bit of overlap will not be an issue.  If it is,  I will try to paste the section of the master page where I am embedding the NAV.
This is the DIV section with "container" which houses the NAV DIV.

User generated image
I was more interested in the rendered source - you can view source from your browser and copy that out.
Do you have the CSS to go with the above?
Here is the rendered source
<html lang="en-US" dir="ltr"><head><meta http-equiv="X-UA-Compatible" content="IE=10"><meta charset="utf-8"><meta name="GENERATOR" content="Microsoft SharePoint"><meta http-equiv="Expires" content="0">
		
		
        <!-- ===== STARTER: Robots  ======================================================================================================= -->
        
		
		<!-- ===== STARTER: Favicon / Windows Tile ======================================================================================== -->	
		<link id="favicon" href="/sites/harperconnectdev/_catalogs/masterpage/HCP/images/favicons/favicon.ico" rel="shortcut icon" type="image/vnd.microsoft.icon"><meta name="msapplication-TileImage" content="/sites/harperconnectdev/_catalogs/masterpage/HCP/metrotile.png"><meta name="msapplication-TileColor" content="#0072C6">				
		
		<!-- ===== STARTER: Page Title loaded from page or page layout ==================================================================== -->
		<title>
	CompanyNameConnect
</title>
		
		<!-- ===== STARTER: SP Scripts and CSS  =========================================================================================== -->
		<link href="/_layouts/15/1033/styles/Themable/corev15.css?rev=zOqvDGOr%2FI2Bzq4QT%2BSPdg%3D%3DTAG252" rel="stylesheet" type="text/css">
<link href="/sites/CompanyNameConnectDEV/Style%20Library/en-US/Themable/Core%20Styles/controls15.css" rel="stylesheet" type="text/css">
<link id="CssRegistration1" href="/sites/CompanyNameConnectDEV/_catalogs/masterpage/HCP/style.css" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Gabriela" rel="stylesheet" type="text/css">
<script type="text/javascript">// <![CDATA[ 

var g_SPOffSwitches={"E857AD9B-3F32-4542-84EB-A4DE6042231F":1,"C3B96395-48CD-4BDF-A73A-6C00C9760B0D":1,"BEF90DEC-6D40-4C3B-9A6D-E66954278A50":1,"4BF41ED4-46A6-4A0F-8641-2AA7AFED55D7":1,"89F73697-E5E9-4813-AA8B-DC0F819E1388":1,"808A0286-CC05-48B0-83CD-57D7AF7B60E5":1,"D32CE9EA-11DF-41B6-BBA8-400E7F766644":1,"B66476AF-2FFF-4F44-B26B-5359D5C4A170":1,"D59DD4F5-68CD-4F54-A33C-61EED3AA387A":1,"4AB7784F-04E2-4A85-8199-C6B3642A20D6":1,"BBE28048-C056-4690-B464-F6D18515EA46":1,"A116C4DA-6DA0-46F6-ADB8-E6FA3BDFC408":1,"819EA225-357E-4D22-B541-9A7A71CE3B2F":1,"D62B0965-ED1F-4663-BF14-9F95A5787328":1,"1EFABADE-60D9-4563-9BBC-1556592DF5D2":1,"336DB468-A409-4C60-B9DD-A819BEBB47E7":1,"3EA6D0B4-3087-4C45-9D65-32048D7DE3C3":1,"348DD0FE-56E3-49EC-966D-8B8B25D73227":1,"6AF33EF2-91EF-408F-9B9A-9B627C2C5248":1,"F2A1E3A4-AC8F-49BD-9F55-0EB15A210E2E":1,"610E51BB-AF62-4612-8839-C65134B9CB10":1,"D6868365-BF77-4591-BF06-F66F4618CA4A":1};
// ]]>
</script>
<script src="https://static.sharepointonline.com/bld/_layouts/15/16.0.5722.1205/1033/initstrings.js" type="text/javascript"></script>
<script src="https://static.sharepointonline.com/bld/_layouts/15/16.0.5722.1205/init.js" type="text/javascript"></script>
<script src="https://CompanyNamecollins.sharepoint.com/sites/CompanyNameconnectdev/style%2520library/jquery-3.1.0.min.js" type="text/javascript"></script>
<script src="https://bashcomputing.sharepoint.com/sites/publishingsandbox/style%2520library/jquery-3.1.1.min.js" type="text/javascript"></script>
<script src="https://static.sharepointonline.com/bld/_layouts/15/16.0.5722.1205//online/scripts/sposuitenav.js" type="text/javascript"></script>
<script src="https://static.sharepointonline.com/bld/_layouts/15/16.0.5722.1205/msajaxbundle.js" type="text/javascript"></script>
<script src="https://static.sharepointonline.com/bld/_layouts/15/16.0.5722.1205/blank.js" type="text/javascript"></script>
<script src="https://static.sharepointonline.com/bld/_layouts/15/16.0.5722.1205/blank.js" type="text/javascript"></script>
<script type="text/javascript">RegisterSod("require.js", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002frequire.js");</script>
<script type="text/javascript">RegisterSod("strings.js", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002f1033\u002fstrings.js");</script>
<script type="text/javascript">RegisterSod("sp.res.resx", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002f1033\u002fsp.res.js");</script>
<script type="text/javascript">RegisterSod("sp.runtime.js", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002fsp.runtime.js");RegisterSodDep("sp.runtime.js", "sp.res.resx");</script>
<script type="text/javascript">RegisterSod("sp.js", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002fsp.js");RegisterSodDep("sp.js", "sp.runtime.js");RegisterSodDep("sp.js", "sp.ui.dialog.js");RegisterSodDep("sp.js", "sp.res.resx");</script>
<script type="text/javascript">RegisterSod("sp.init.js", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002fsp.init.js");</script>
<script type="text/javascript">RegisterSod("sp.ui.dialog.js", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002fsp.ui.dialog.js");RegisterSodDep("sp.ui.dialog.js", "sp.init.js");RegisterSodDep("sp.ui.dialog.js", "sp.res.resx");</script>
<script type="text/javascript">RegisterSod("core.js", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002fcore.js");RegisterSodDep("core.js", "strings.js");</script>
<script type="text/javascript">RegisterSod("menu.js", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002fmenu.js");</script>
<script type="text/javascript">RegisterSod("mQuery.js", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002fmquery.js");</script>
<script type="text/javascript">RegisterSod("callout.js", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002fcallout.js");RegisterSodDep("callout.js", "strings.js");RegisterSodDep("callout.js", "mQuery.js");RegisterSodDep("callout.js", "core.js");</script>
<script type="text/javascript">RegisterSod("sp.core.js", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002fsp.core.js");RegisterSodDep("sp.core.js", "strings.js");RegisterSodDep("sp.core.js", "sp.init.js");RegisterSodDep("sp.core.js", "core.js");</script>
<script type="text/javascript">RegisterSod("sharedhovercard.strings.js", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002f1033\u002fsharedhovercard.strings.js");</script>
<script type="text/javascript">RegisterSod("sharedhovercard.js", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002fsharedhovercard.js");RegisterSodDep("sharedhovercard.js", "sharedhovercard.strings.js");</script>
<script type="text/javascript">RegisterSod("clienttemplates.js", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002fclienttemplates.js");</script>
<script type="text/javascript">RegisterSod("sharing.js", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002fsharing.js");RegisterSodDep("sharing.js", "strings.js");RegisterSodDep("sharing.js", "mQuery.js");RegisterSodDep("sharing.js", "clienttemplates.js");RegisterSodDep("sharing.js", "core.js");</script>
<script type="text/javascript">RegisterSod("suitelinks.js", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002fsuitelinks.js");RegisterSodDep("suitelinks.js", "strings.js");RegisterSodDep("suitelinks.js", "core.js");</script>
<script type="text/javascript">RegisterSod("clientrenderer.js", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002fclientrenderer.js");</script>
<script type="text/javascript">RegisterSod("srch.resources.resx", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002f1033\u002fsrch.resources.js");</script>
<script type="text/javascript">RegisterSod("search.clientcontrols.js", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002fsearch.clientcontrols.js");RegisterSodDep("search.clientcontrols.js", "sp.init.js");RegisterSodDep("search.clientcontrols.js", "clientrenderer.js");RegisterSodDep("search.clientcontrols.js", "srch.resources.resx");</script>
<script type="text/javascript">RegisterSod("sp.search.js", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002fsp.search.js");RegisterSodDep("sp.search.js", "sp.init.js");RegisterSodDep("sp.search.js", "sp.runtime.js");</script>
<script type="text/javascript">RegisterSod("ajaxtoolkit.js", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002fajaxtoolkit.js");RegisterSodDep("ajaxtoolkit.js", "search.clientcontrols.js");</script>
<script type="text/javascript">RegisterSod("userprofile", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002fsp.userprofiles.js");RegisterSodDep("userprofile", "sp.runtime.js");</script>
<script type="text/javascript">RegisterSod("followingcommon.js", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002ffollowingcommon.js");RegisterSodDep("followingcommon.js", "strings.js");RegisterSodDep("followingcommon.js", "sp.js");RegisterSodDep("followingcommon.js", "userprofile");RegisterSodDep("followingcommon.js", "core.js");RegisterSodDep("followingcommon.js", "mQuery.js");</script>
<script type="text/javascript">RegisterSod("profilebrowserscriptres.resx", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002f1033\u002fprofilebrowserscriptres.js");</script>
<script type="text/javascript">RegisterSod("sp.ui.mysitecommon.js", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002fsp.ui.mysitecommon.js");RegisterSodDep("sp.ui.mysitecommon.js", "sp.init.js");RegisterSodDep("sp.ui.mysitecommon.js", "sp.runtime.js");RegisterSodDep("sp.ui.mysitecommon.js", "userprofile");RegisterSodDep("sp.ui.mysitecommon.js", "profilebrowserscriptres.resx");</script>
<script type="text/javascript">RegisterSod("browserScript", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002fie55up.js");RegisterSodDep("browserScript", "strings.js");</script>
<script type="text/javascript">RegisterSod("inplview", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002finplview.js");RegisterSodDep("inplview", "strings.js");RegisterSodDep("inplview", "core.js");RegisterSodDep("inplview", "clienttemplates.js");RegisterSodDep("inplview", "sp.js");</script>
<script type="text/javascript">RegisterSod("datepicker.js", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002fdatepicker.js");RegisterSodDep("datepicker.js", "strings.js");</script>
<script type="text/javascript">RegisterSod("sp.publishing.resources.resx", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002f1033\u002fsp.publishing.resources.js");</script>
<script type="text/javascript">RegisterSod("mediaplayer.js", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002fmediaplayer.js");RegisterSodDep("mediaplayer.js", "sp.publishing.resources.resx");</script>
<script type="text/javascript">RegisterSod("offline.js", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002foffline.js");</script>
<script type="text/javascript">RegisterSod("shell/shell15.js", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002f1033\u002fshell\u002fshell15.js");</script>
<script type="text/javascript">RegisterSod("cui.js", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002fcui.js");</script>
<script type="text/javascript">RegisterSod("ribbon", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002fsp.ribbon.js");RegisterSodDep("ribbon", "strings.js");RegisterSodDep("ribbon", "core.js");RegisterSodDep("ribbon", "sp.core.js");RegisterSodDep("ribbon", "sp.js");RegisterSodDep("ribbon", "cui.js");RegisterSodDep("ribbon", "sp.res.resx");RegisterSodDep("ribbon", "sp.runtime.js");RegisterSodDep("ribbon", "inplview");</script>
<script type="text/javascript">RegisterSod("WPAdderClass", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002fwpadder.js");</script>
<script type="text/javascript">RegisterSod("dragdrop.js", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002fdragdrop.js");RegisterSodDep("dragdrop.js", "strings.js");</script>
<script type="text/javascript">RegisterSod("quicklaunch.js", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002fquicklaunch.js");RegisterSodDep("quicklaunch.js", "strings.js");RegisterSodDep("quicklaunch.js", "dragdrop.js");</script>
<script type="text/javascript">RegisterSod("sp.ui.pub.ribbon.js", "https:\u002f\u002fstatic.sharepointonline.com\u002fbld\u002f_layouts\u002f15\u002f16.0.5722.1205\u002fsp.ui.pub.ribbon.js");</script>
<link href="/sites/CompanyNameConnectDEV/_vti_bin/spsdisco.aspx" rel="alternate" type="text/xml"> 
<!-- =====         =============== -->
			
		<!-- ===== STARTER: Additional header placeholder - overridden by asp:content on pages or page layouts  =========================== -->
		<link href="https://CompanyNamecollins.sharepoint.com:443/sites/CompanyNameConnectDEV" rel="canonical">

		<!-- ===== STARTER: Core SharePoint CSS =========================================================================================== -->
		

		<!-- ===== STARTER: Custom CSS  =================================================================================================== -->
		
		<link href="/sites/CompanyNameConnectDEV/_catalogs/masterpage/HCP/images/favicons/apple-icon-57x57.png" rel="apple-touch-icon" sizes="57x57"><link href="/sites/CompanyNameConnectDEV/_catalogs/masterpage/HCP/images/favicons/apple-icon-60x60.png" rel="apple-touch-icon" sizes="60x60"><link href="/sites/CompanyNameConnectDEV/_catalogs/masterpage/HCP/images/favicons/apple-icon-72x72.png" rel="apple-touch-icon" sizes="72x72"><link href="/sites/CompanyNameConnectDEV/_catalogs/masterpage/HCP/images/favicons/apple-icon-76x76.png" rel="apple-touch-icon" sizes="76x76"><link href="/sites/CompanyNameConnectDEV/_catalogs/masterpage/HCP/images/favicons/apple-icon-114x114.png" rel="apple-touch-icon" sizes="114x114"><link href="/sites/CompanyNameConnectDEV/_catalogs/masterpage/HCP/images/favicons/apple-icon-120x120.png" rel="apple-touch-icon" sizes="120x120"><link href="/sites/CompanyNameConnectDEV/_catalogs/masterpage/HCP/images/favicons/apple-icon-144x144.png" rel="apple-touch-icon" sizes="144x144"><link href="/sites/CompanyNameConnectDEV/_catalogs/masterpage/HCP/images/favicons/apple-icon-152x152.png" rel="apple-touch-icon" sizes="152x152"><link href="/sites/CompanyNameConnectDEV/_catalogs/masterpage/HCP/images/favicons/apple-icon-180x180.png" rel="apple-touch-icon" sizes="180x180"><link href="/sites/CompanyNameConnectDEV/_catalogs/masterpage/HCP/images/favicons/android-icon-192x192.png" rel="icon" type="image/png" sizes="192x192"><link href="/sites/CompanyNameConnectDEV/_catalogs/masterpage/HCP/images/favicons/favicon-32x32.png" rel="icon" type="image/png" sizes="32x32"><link href="/sites/CompanyNameConnectDEV/_catalogs/masterpage/HCP/images/favicons/favicon-96x96.png" rel="icon" type="image/png" sizes="96x96"><link href="/sites/CompanyNameConnectDEV/_catalogs/masterpage/HCP/images/favicons/favicon-16x16.png" rel="icon" type="image/png" sizes="16x16"><link href="/sites/CompanyNameConnectDEV/_catalogs/masterpage/HCP/images/favicons/manifest.json" rel="manifest">
		
		<!-- ===== Custom FONT  =================================================================================================== -->
		<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900" rel="stylesheet" ms-design-css-conversion="”no”">
				
		<!-- 		-->
		
	<link href="https://prod.msocdn.com/16.00.1439.009/en-US/css/shellg2coremincss_bb867595.css" rel="stylesheet" type="text/css"><script src="https://prod.msocdn.com/16.00.1439.009/en-US/JSC/CoreMinShellG2Bundle.js" type="text/javascript"></script><script src="https://static.sharepointonline.com/bld/_layouts/15/16.0.5722.1205/1033/strings.js" type="text/javascript"></script><script src="https://static.sharepointonline.com/bld/_layouts/15/16.0.5722.1205/sp.init.js" type="text/javascript"></script><script src="https://static.sharepointonline.com/bld/_layouts/15/16.0.5722.1205/1033/sp.res.js" type="text/javascript"></script><script src="https://static.sharepointonline.com/bld/_layouts/15/16.0.5722.1205/cui.js" type="text/javascript"></script><script src="https://static.sharepointonline.com/bld/_layouts/15/16.0.5722.1205/clienttemplates.js" type="text/javascript"></script><script src="https://static.sharepointonline.com/bld/_layouts/15/16.0.5722.1205/core.js" type="text/javascript"></script><script src="https://static.sharepointonline.com/bld/_layouts/15/16.0.5722.1205/mquery.js" type="text/javascript"></script><script src="https://static.sharepointonline.com/bld/_layouts/15/16.0.5722.1205/sp.core.js" type="text/javascript"></script><script src="https://static.sharepointonline.com/bld/_layouts/15/16.0.5722.1205/sp.ui.dialog.js" type="text/javascript"></script><script src="https://static.sharepointonline.com/bld/_layouts/15/16.0.5722.1205/sp.runtime.js" type="text/javascript"></script><script src="https://static.sharepointonline.com/bld/_layouts/15/16.0.5722.1205/sp.js" type="text/javascript"></script><script src="https://static.sharepointonline.com/bld/_layouts/15/16.0.5722.1205/inplview.js" type="text/javascript"></script><script src="https://static.sharepointonline.com/bld/_layouts/15/16.0.5722.1205/sp.ribbon.js" type="text/javascript"></script><script src="https://static.sharepointonline.com/bld/_layouts/15/16.0.5722.1205/sp.ui.mylinksribbon.js" type="text/javascript"></script><script src="https://static.sharepointonline.com/bld/_layouts/15/16.0.5722.1205/1033/sp.publishing.resources.js" type="text/javascript"></script><script src="https://static.sharepointonline.com/bld/_layouts/15/16.0.5722.1205/mediaplayer.js" type="text/javascript"></script><script src="https://static.sharepointonline.com/bld/_layouts/15/16.0.5722.1205/sp.ui.pub.ribbon.js" type="text/javascript"></script><script src="https://static.sharepointonline.com/bld/_layouts/15/16.0.5722.1205/clientrenderer.js" type="text/javascript"></script><script src="https://static.sharepointonline.com/bld/_layouts/15/16.0.5722.1205/1033/srch.resources.js" type="text/javascript"></script><script src="https://static.sharepointonline.com/bld/_layouts/15/16.0.5722.1205/search.clientcontrols.js" type="text/javascript"></script></head>
	
	<body class=" ms-backgroundImage">
		<!-- ===== STARTER: SP IDs / Prefetch SP images / SP Form  =========================================================================== -->
		
		<div id="imgPrefetch" style="display: none;">
<img src="/sites/CompanyNameconnectdev/_catalogs/masterpage/HCP/images/favicons/favicon.ico?rev=44">
<img src="/_layouts/15/images/spcommon.png?rev=44">
<img src="/_layouts/15/images/spcommon.png?rev=44">
<img src="/sites/CompanyNameConnectDEV/_catalogs/masterpage/HCP/logo.png?rev=44">
</div>

		<form id="aspnetForm" onsubmit="javascript:return WebForm_OnSubmit();" action="/sites/CompanyNameConnectDEV" method="post">
<div class="aspNetHidden">
<input name="_wpcmWpid" id="_wpcmWpid" type="hidden" value="">
<input name="wpcmVal" id="wpcmVal" type="hidden" value="">
<input name="MSOWebPartPage_PostbackSource" id="MSOWebPartPage_PostbackSource" type="hidden" value="">
<input name="MSOTlPn_SelectedWpId" id="MSOTlPn_SelectedWpId" type="hidden" value="">
<input name="MSOTlPn_View" id="MSOTlPn_View" type="hidden" value="0">
<input name="MSOTlPn_ShowSettings" id="MSOTlPn_ShowSettings" type="hidden" value="False">
<input name="MSOGallery_SelectedLibrary" id="MSOGallery_SelectedLibrary" type="hidden" value="">
<input name="MSOGallery_FilterString" id="MSOGallery_FilterString" type="hidden" value="">
<input name="MSOTlPn_Button" id="MSOTlPn_Button" type="hidden" value="none">
<input name="__EVENTTARGET" id="__EVENTTARGET" type="hidden" value="">
<input name="__EVENTARGUMENT" id="__EVENTARGUMENT" type="hidden" value="">
<input name="__REQUESTDIGEST" id="__REQUESTDIGEST" type="hidden" value="0x6F87CEB0F782DA7AC372BC8A960CCCF0C3323D915EF7F981F87C5521FDB183DA4AF69D9217BE23A88315DF2443D17FF1BDDA88E224EF240B85D9D84B87303679,03 Oct 2016 13:48:35 -0000">
<input name="MSOAuthoringConsole_FormContext" id="MSOAuthoringConsole_FormContext" type="hidden" value="">
<input name="MSOAC_EditDuringWorkflow" id="MSOAC_EditDuringWorkflow" type="hidden" value="">
<input name="InputComments" id="InputComments" type="hidden" value="">
<input name="MSOSPWebPartManager_DisplayModeName" id="MSOSPWebPartManager_DisplayModeName" type="hidden" value="Browse">
<input name="MSOSPWebPartManager_ExitingDesignMode" id="MSOSPWebPartManager_ExitingDesignMode" type="hidden" value="false">
<input name="MSOWebPartPage_Shared" id="MSOWebPartPage_Shared" type="hidden" value="">
<input name="MSOLayout_LayoutChanges" id="MSOLayout_LayoutChanges" type="hidden" value="">
<input name="MSOLayout_InDesignMode" id="MSOLayout_InDesignMode" type="hidden" value="">
<input name="_wpSelected" id="_wpSelected" type="hidden" value="">
<input name="_wzSelected" id="_wzSelected" type="hidden" value="">
<input name="MSOSPWebPartManager_OldDisplayModeName" id="MSOSPWebPartManager_OldDisplayModeName" type="hidden" value="Browse">
<input name="MSOSPWebPartManager_StartWebPartEditingName" id="MSOSPWebPartManager_StartWebPartEditingName" type="hidden" value="false">
<input name="MSOSPWebPartManager_EndWebPartEditing" id="MSOSPWebPartManager_EndWebPartEditing" type="hidden" value="false">
<input name="_maintainWorkspaceScrollPosition" id="_maintainWorkspaceScrollPosition" type="hidden" value="0">
<input name="SPPageStateContext_PreviousAuthoringVersion" id="SPPageStateContext_PreviousAuthoringVersion" type="hidden" value="73">
<input name="SPPageStateContext_PreviousAuthoringItemUser" id="SPPageStateContext_PreviousAuthoringItemUser" type="hidden" value="17">
<input name="MSOShowUnapproved_Xml" id="MSOShowUnapproved_Xml" type="hidden" value="">
<input name="SideBySideToken" id="SideBySideToken" type="hidden" value="16.0.5722.1205">
<input name="__VIEWSTATE" id="__VIEWSTATE" type="hidden" value="/wEPDwUBMA9kFgJmD2QWAgIBD2QWBAIBD2QWAgIdD2QWAmYPZBYCZg88KwAGAGQCBw9kFgYCAQ9kFg4FJmdfMzdmMDMwZTFfYzUzNl80OGRkX2I5ZDJfYWQ1NWExODdmMDVmD2QWBGYPFgIeB1Zpc2libGVoZAIBDxYCHwBoZAUmZ19jNmNjZGNjYV8yYzRiXzRjYmNfODEwZF9mNzkwMWFlMmJjODQPZBYEZg8WAh8AaGQCAQ8WAh8AaGQFJmdfOWVmMWUyYzJfODAxZF80NWYwX2I0YzVfMDU5Zjc2MWFlM2RlD2QWBGYPFgIfAGhkAgEPFgIfAGhkBSZnXzA5ZGNiYTBkX2JmODRfNDI3Zl85OTgyXzQ1MzE4NjUzOGI4OA9kFgRmDxYCHwBoZAIBDxYCHwBoZAUmZ182MTNkOWY4ZF9mZjkwXzQ4MGNfYTFjZF82YTgyNTQwYWNmNGIPZBYEZg8WAh8AaGQCAQ8WAh8AaGQFJmdfMjBlYzVjN2RfYzVjY180YWJjX2I4NmJfMThhNmFhZjM2ZTY2D2QWBGYPFgIfAGhkAgEPFgIfAGhkBSZnXzZkOTg1ZGIxXzMwNWFfNDNkZl9iZThmX2JhMmJjMWUxOTAwMw9kFgRmDxYCHwBoZAIBDxYCHwBoZAIHD2QWAgICD2QWBAIBD2QWAgIDD2QWAmYPZBYEAgMPZBYKAgEPFgYeE0NsaWVudE9uQ2xpY2tTY3JpcHQFjgFFbnN1cmVTY3JpcHRGdW5jKCdzaGFyaW5nLmpzJywgJ0Rpc3BsYXlTaGFyZWRXaXRoRGlhbG9nJywgZnVuY3Rpb24gKCkgeyBEaXNwbGF5U2hhcmVkV2l0aERpYWxvZygnXHUwMDJmc2l0ZXNcdTAwMmZIYXJwZXJDb25uZWN0REVWXHUwMDJmJyk7IH0pHihDbGllbnRPbkNsaWNrU2NyaXB0Q29udGFpbmluZ1ByZWZpeGVkVXJsBY4BRW5zdXJlU2NyaXB0RnVuYygnc2hhcmluZy5qcycsICdEaXNwbGF5U2hhcmVkV2l0aERpYWxvZycsIGZ1bmN0aW9uICgpIHsgRGlzcGxheVNoYXJlZFdpdGhEaWFsb2coJ1x1MDAyZnNpdGVzXHUwMDJmSGFycGVyQ29ubmVjdERFVlx1MDAyZicpOyB9KR4YQ2xpZW50T25DbGlja05hdmlnYXRlVXJsZGQCAw8WCB8AaB8BBXt3aW5kb3cubG9jYXRpb24gPSAnamF2YXNjcmlwdDpFbnN1cmVDaGVja291dEFuZENoYW5nZUxheW91dE1vZGVUb0VkaXQoXCdlNDlhMDk5NC0yY2JkLTQ5M2YtOTFhOS0xMzk5Y2U0ZDVmZTlcJywxNyxmYWxzZSk7JzsfAmQfAwVmamF2YXNjcmlwdDpFbnN1cmVDaGVja291dEFuZENoYW5nZUxheW91dE1vZGVUb0VkaXQoXCdlNDlhMDk5NC0yY2JkLTQ5M2YtOTFhOS0xMzk5Y2U0ZDVmZTlcJywxNyxmYWxzZSk7ZAIFDxYCHwBoZAILDxYCHwBoZAIRD2QWAmYPDxYGHhxQcmV2aW91c0F1dGhvcmluZ0l0ZW1WZXJzaW9uBQI3Mx4aUHJldmlvdXNBdXRob3JpbmdJdGVtT3duZXIFAjE3HhxQcmV2aW91c0F1dGhvcmluZ0NvbnRyb2xNb2RlCymIAU1pY3Jvc29mdC5TaGFyZVBvaW50LldlYkNvbnRyb2xzLlNQQ29udHJvbE1vZGUsIE1pY3Jvc29mdC5TaGFyZVBvaW50LCBWZXJzaW9uPTE2LjAuMC4wLCBDdWx0dXJlPW5ldXRyYWwsIFB1YmxpY0tleVRva2VuPTcxZTliY2UxMTFlOTQyOWMBZGQCBA8PFgIeCUFjY2Vzc0tleQUBL2RkAgMPZBYCAgEPZBYCAgEPZBYIAgEPDxYEHgRfIVNCAgIeCENzc0NsYXNzBRdtcy1wcm9tb3RlZEFjdGlvbkJ1dHRvbmRkAgMPZBYCZg8PFgQfCAICHwkFF21zLXByb21vdGVkQWN0aW9uQnV0dG9uZGQCBQ8PFgYfCQUXbXMtcHJvbW90ZWRBY3Rpb25CdXR0b24fCAICHwBoZGQCBw8WBB4GQWN0aW9uCymKAU1pY3Jvc29mdC5TaGFyZVBvaW50LldlYkNvbnRyb2xzLlBhZ2VTdGF0ZUFjdGlvbiwgTWljcm9zb2Z0LlNoYXJlUG9pbnQsIFZlcnNpb249MTYuMC4wLjAsIEN1bHR1cmU9bmV1dHJhbCwgUHVibGljS2V5VG9rZW49NzFlOWJjZTExMWU5NDI5YwAfAGdkAgsPZBYCAgoPZBYCAgEPZBYCAgEPPCsABQEADxYCHhVQYXJlbnRMZXZlbHNEaXNwbGF5ZWRmZGRkctl/1sVevfAR1p4L5wQpvJb62EmlviKRysoNVoL39gY=">
</div>

<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['aspnetForm'];
if (!theForm) {
    theForm = document.aspnetForm;
}
function __doPostBack(eventTarget, eventArgument) {
    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
        theForm.__EVENTTARGET.value = eventTarget;
        theForm.__EVENTARGUMENT.value = eventArgument;
        theForm.submit();
    }
}
//]]>
</script>



<script type="text/javascript">
//<![CDATA[
var MSOWebPartPageFormName = 'aspnetForm';
var g_presenceEnabled = true;
var g_wsaEnabled = true;
var g_correlationId = 'a7cfa99d-207f-2000-0f00-f24cf6c69eb4';
var g_wsaQoSEnabled = false;
var g_wsaQoSDataPoints = [];
var g_wsaRUMEnabled = true;var g_wsaLCID = 1033;
var g_wsaListTemplateId = 850;
var g_wsaSiteTemplateId = 'BLANKINTERNET#0';
var _fV4UI=true;var _spPageContextInfo = {webServerRelativeUrl: "\u002fsites\u002fCompanyNameConnectDEV", webAbsoluteUrl: "https:\u002f\u002fCompanyNamecollins.sharepoint.com\u002fsites\u002fCompanyNameConnectDEV", siteAbsoluteUrl: "https:\u002f\u002fCompanyNamecollins.sharepoint.com\u002fsites\u002fCompanyNameConnectDEV", serverRequestPath: "\u002fsites\u002fCompanyNameConnectDEV\u002fPages\u002fHCPHome.aspx", layoutsUrl: "_layouts\u002f15", webTitle: "CompanyNameConnect", webTemplate: "53", tenantAppVersion: "2464951241", isAppWeb: false, hasManageWebPermissions: true, webLogoUrl: "_layouts\u002f15\u002fimages\u002fsiteicon.png", webLanguage: 1033, currentLanguage: 1033, currentUICultureName: "en-US", currentCultureName: "en-US", clientServerTimeDelta: new Date("2016-10-03T13:48:35.6152840Z") - new Date(), updateFormDigestPageLoaded: new Date("2016-10-03T13:48:35.6152840Z"), siteClientTag: "637$$16.0.5722.1205", crossDomainPhotosEnabled:true, webUIVersion:15, webPermMasks:{High:2147483647,Low:4294967295},pageListId:"{e49a0994-2cbd-493f-91a9-1399ce4d5fe9}",pageItemId:17, pagePersonalizationScope:1,userId:20,userLoginName:"howard.bash@CompanyNamecollins.com", systemUserKey:"i:0h.f|membership|100300009a5ada17@live.com", isAnonymousGuestUser: false, alertsEnabled:true, siteServerRelativeUrl: "\u002fsites\u002fCompanyNameConnectDEV", allowSilverlightPrompt:'True', themeCacheToken: "\u002fsites\u002fCompanyNameConnectDEV::0:16.0.5722.1205", isSiteAdmin: true, env: "Prod"};function CallServer_49046735(arg, context) {WebForm_DoCallback('ctl00$ctl25',arg,SP.UI.MyLinksRibbon.MyLinksRibbonPageComponent.ribbonActionCallback,context,null,false); }function _myLinksRibbonLoad2()
{
    var fnd = function () {
        try {
            mylinks_init.MyLinksInit('CallServer_49046735'); 
        } 
        catch (Ex)
        { }
    };
    RegisterSod('mylinks_init', 'https://static.sharepointonline.com/bld/_layouts/15/16.0.5722.1205/sp.ui.mylinksribbon.js');
    LoadSodByKey('mylinks_init', fnd);
}

function _myLinksRibbonLoad1()
{
    ExecuteOrDelayUntilScriptLoaded(_myLinksRibbonLoad2, 'SP.Ribbon.js');
}

_spBodyOnLoadFunctionNames.push('_myLinksRibbonLoad1');

                            function DoCallBack(filterText)
                            {WebForm_DoCallback('ctl00$ctl59$g_1b0d1b69_538e_4c27_ba80_3bdae4e38bb2',filterText,UpdateFilterCallback,0,CallBackError,true)
                            }
                            function CallBackError(result, clientsideString)
                            {                
                            }
                        var L_Menu_BaseUrl="/sites/CompanyNameConnectDEV";
var L_Menu_LCID="1033";
var L_Menu_SiteTheme="null";
Flighting.ExpFeatures = [-1935704048,2014575433,1427198016,33619996,320014136,-1798548864,12582914,57158685,4785188,-2080243712,1180304,-536678120,-134118912,1098973571,62340,1879965696,-1776261774,-251980286,17977375,0,0,268435456,-1875640316,867697062,1703936,1077968928,2,0,2128,0,0,4096,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,32768]; (function()
{
    if(typeof(window.SP) == "undefined") window.SP = {};
    if(typeof(window.SP.YammerSwitch) == "undefined") window.SP.YammerSwitch = {};

    var ysObj = window.SP.YammerSwitch;
    ysObj.IsEnabled = true;
    ysObj.TargetYammerHostName = "www.yammer.com";
} )(); var _spWebPartComponents = new Object();
                var g_syncButtonUsePopup = true;
                //]]>
</script>

<script src="https://static.sharepointonline.com/bld/_layouts/15/16.0.5722.1205/blank.js" type="text/javascript"></script>
<script src="https://static.sharepointonline.com/bld/_layouts/15/16.0.5722.1205/msformbundle.js" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
var pullPageVariation = {"url":"WebForm_DoCallback('ctl00$ctl60$ctl11$ctl04','',Pub.Ribbon.PubCommands.pullPageCallbackComplete,\"\",null,false)"};function ShowUnapprovedResourcesWithTimeout() { if (!browseris.ie6up && g_bResourcesAlreadyChecked) { alert('Before checking again, you will need to refresh this page.'); return false; } showConsoleMessage(l_ur_plsWait, false);window.setTimeout("ShowUnapprovedResourcesPage()",10); }l_chkResStatus = 'Checking page for unpublished items...';
l_ur_plsWait = 'Please wait while checking for unpublished items...';
l_ur_rfct = '__publishingReusableFragment';
l_ur_wsurl = 'https:\u002f\u002fCompanyNamecollins.sharepoint.com\u002fsites\u002fCompanyNameConnectDEV\u002f_vti_bin\u002fPublishingService.asmx';
l_ur_formname = 'aspnetForm';
l_ur_fullreport = "Unpublished items are detected on the page.  View the <a href=\"#\" onclick=\"javascript:window.top.open('\u002fsites\u002fCompanyNameConnectDEV\u002f_layouts\u002f15\u002fUnapprovedResources.aspx', '_unapprovedResourcesReport', 'height=580,width=540,resizable=yes,status=no,location=no,toolbar=no,menubar=no,directories=no,scrollbars=no');\" title=\"Open a new window to view the full report\">full report</a> in a new window.";
l_ur_fullreportnors = "Unpublished items are detected on the page.  View the <a href=\"#\" onclick=\"javascript:window.top.open('\u002fsites\u002fCompanyNameConnectDEV\u002f_layouts\u002f15\u002fUnapprovedResources.aspx', '_unapprovedResourcesReport', 'height=580,width=540,resizable=yes,status=no,location=no,toolbar=no,menubar=no,directories=no,scrollbars=no');\" title=\"Open a new window to view the full report\">full report</a> in a new window.  Before checking again, you will need to <a href=\"#\" onclick=\"g_bWarnBeforeLeave = false;theForm.submit();\">refresh this page</a>.";
l_ur_recsready = 'No unpublished items detected on this page.';
var g_ProcessedXml;
var g_PageNameForDisplay = 'HCPHome.aspx';
var g_PageFileVersionForDisplay = '17.1';
var checkForDraft = {"checkForDraftFn":"ShowUnapprovedResourcesWithTimeout();HideServerGeneratedMessage()"};var startWorkflow = {"startWorkflowFn":"__doPostBack('ctl00$ctl60$ctl11$ctl09','startWorkflow')"};var workflowStatus = {"workflowStatusFn":"__doPostBack('ctl00$ctl60$ctl11$ctl10','workflowStatus')"};var g_previewRequested = false;var preview = {"inputPagePreviewClientId":null,"mobileChannels":null,"previewFn":"if(!g_previewRequested){g_previewRequested=true;__doPostBack('ctl00$ctl60$ctl11$ctl12','previewPage');}"};var editSeoProperties = {"editSeoPropertiesFn":"__doPostBack('ctl00$ctl60$ctl11$ctl14','editSeoProperties')","forceCheckOut":true,"isCheckedOut":false,"isCheckedOutToCurrentUser":false,"isTermPage":false,"url":"javascript:__doPostBack('ctl00$ctl60$ctl11$ctl14','editSeoProperties')"};var editPageUrls = {"url":"\/sites\/CompanyNameConnectDEV\/_layouts\/15\/ViewPageUrls.aspx?Source=\/sites\/CompanyNameConnectDEV\/Pages\/HCPHome.aspx&CancelSource=\/sites\/CompanyNameConnectDEV\/Pages\/HCPHome.aspx"};(function(){

        if (typeof(_spBodyOnLoadFunctions) === 'undefined' || _spBodyOnLoadFunctions === null) {
            return;
        }
        _spBodyOnLoadFunctions.push(function() {
            SP.SOD.executeFunc('core.js', 'FollowingDocument', function() { FollowingDocument(); });
        });
    })();(function(){

        if (typeof(_spBodyOnLoadFunctions) === 'undefined' || _spBodyOnLoadFunctions === null) {
            return;
        }
        _spBodyOnLoadFunctions.push(function() {
            SP.SOD.executeFunc('core.js', 'FollowingCallout', function() { FollowingCallout(); });
        });
    })();if (typeof(DeferWebFormInitCallback) == 'function') DeferWebFormInitCallback();function WebForm_OnSubmit() {
UpdateFormDigest('\u002fsites\u002fCompanyNameConnectDEV', 1440000);
                    var workspaceElem = GetCachedElement("s4-workspace");
                    if (workspaceElem != null)
                    {
                        var scrollElem = GetCachedElement("_maintainWorkspaceScrollPosition");
                        if (scrollElem != null)
                        {
                            scrollElem.value = workspaceElem.scrollTop;
                        }
                    };
                if (typeof(SP) != 'undefined' && SP.Ribbon && SP.Ribbon.PageState && SP.Ribbon.PageState.PageStateHandler && SP.Ribbon.PageState.PageStateHandler.pageStateOnSubmit) SP.Ribbon.PageState.PageStateHandler.pageStateOnSubmit();if (typeof(_spFormOnSubmitWrapper) != 'undefined') {return _spFormOnSubmitWrapper();} else {return true;};
return true;
}
//]]>
</script>

<div class="aspNetHidden">

	<input name="__VIEWSTATEGENERATOR" id="__VIEWSTATEGENERATOR" type="hidden" value="8A824247">
	<input name="__SCROLLPOSITIONX" id="__SCROLLPOSITIONX" type="hidden" value="0">
	<input name="__SCROLLPOSITIONY" id="__SCROLLPOSITIONY" type="hidden" value="0">
	<input name="__EVENTVALIDATION" id="__EVENTVALIDATION" type="hidden" value="/wEdAAPgiH/FsIRf89Io2eSj9TCjYpyYGbOxOLQTVqSE/Oud5pNTrQtfdnuof2S/dub8Tz+iSfDRFqpnLnMunYLm8wlddspLImwGjpj2BUZiLRyGJA==">
</div>
		
		<!-- ===== STARTER: SharePoint Reqs this for adding columns ===================================================== -->
		<script type="text/javascript"> var submitHook = function () { return false; }; theForm._spOldSubmit = theForm.submit; theForm.submit = function () { if (!submitHook()) { this._spOldSubmit(); } }; </script>

		<!-- ===== STARTER: Web Part Manager  ============================================================================================= -->
				
		
			<!-- ===== STARTER: ScriptManager ===================================================== -->
			<script type="text/javascript">
//<![CDATA[
Sys.WebForms.PageRequestManager._initialize('ctl00$ScriptManager', 'aspnetForm', ['fctl00$ctl60$WebPartAdderUpdatePanel',''], [], ['ctl00$ctl60$WebPartAdder',''], 90, 'ctl00');
//]]>
</script>

		
			<!-- ===== STARTER: Ribbon Code Starts Here ===================================================== -->
			
<div>
	
<div class="ms-dialogHidden ms-fullWidth noindex" id="suiteBarDelta">
		
	<div class="ms-hide" id="suiteMenuData">
	
	 
	<span style="display: none;"><menu id="zz1_ID_PersonalActionMenu" type="ServerMenu" hideicons="true"><ie:menuitem id="zz2_ID_PersonalInformation" type="option" menugroupid="100" description="Update your user information, language and regional settings, and alerts." text="My Settings" onmenuclick="javascript:GoToPage('\u002fsites\u002fCompanyNameConnectDEV\u002f_layouts\u002f15\u002fuserdisp.aspx?Force=True');return false;" iconsrc="/_layouts/15/images/menuprofile.gif?rev=44"></ie:menuitem>
		<ie:menuitem id="zz3_ID_Logout" type="option" menugroupid="100" description="Logout of this site." text="Sign Out" onmenuclick="STSNavigate2(event,'/sites/CompanyNameConnectDEV/_layouts/15/SignOut.aspx');"></ie:menuitem>
		</menu></span>


					   <span class="ms-siteactions-root" id="siteactiontd">
					   
						
						
						<span style="display: none;"><menu id="zz4_SiteActionsMenuMainData" type="ServerMenu" hideicons="true"><ie:menuitem id="ctl00_ctl60_SiteActionsMenuMainData_ctl00_wsaHideMenu" type="option" menugroupid="100" description="Hide the page status and ribbon for this page." text="Hide Ribbon" onmenuclick="javascript:__doPostBack('ctl00$ctl60$SiteActionsMenuMainData$ctl00$wsaHideMenu_CmsActionControl','exitMenu')" iconsrc="/_layouts/15/images/RibbonHideHH.png?rev=44"></ie:menuitem>
		<ie:menuitem id="zz5_MenuItem_ShareThisSite" type="option" menugroupid="100" description="See who's here and invite new people." text="Shared with..." onmenuclick="EnsureScriptFunc('sharing.js', 'DisplaySharedWithDialog', function () { DisplaySharedWithDialog('\u002fsites\u002fCompanyNameConnectDEV\u002f'); })"></ie:menuitem>
		<ie:menuitem id="ctl00_ctl60_SiteActionsMenuMainData_ctl00_wsaEditPage" type="option" menugroupid="200" description="Change the content and Web Parts on this page." text="Edit page" onmenuclick="javascript:SP.SOD.executeFunc('sp.ui.pub.ribbon.js', 'Pub.Ribbon.PubCommands', function() {Pub.Ribbon.PubCommands.notifyProgress(SP.Publishing.Resources.notificationMessageLoading);if (document.forms['aspnetForm']['MSOLayout_InDesignMode'] != null) document.forms['aspnetForm']['MSOLayout_InDesignMode'].value = 1;if (document.forms['aspnetForm']['MSOAuthoringConsole_FormContext'] != null) document.forms['aspnetForm']['MSOAuthoringConsole_FormContext'].value = 1;if (document.forms['aspnetForm']['MSOSPWebPartManager_DisplayModeName'] != null) document.forms['aspnetForm']['MSOSPWebPartManager_DisplayModeName'].value = 'Design';__doPostBack('ctl05','edit')});" iconsrc="/_layouts/15/images/ActionsEditPage.gif?rev=44"></ie:menuitem>
		<ie:menuitem id="ctl00_ctl60_SiteActionsMenuMainData_ctl00_wsaCreatePage" type="option" menugroupid="200" description="Create a page in this site." text="Add a page" onmenuclick="javascript:if (LaunchCreateHandler('PublishingPage')) { SP.SOD.executeFunc('sp.ui.dialog.js', 'SP.UI.ModalDialog.showModalDialog', function() { var dlgOptions = { url:'\u002fsites\u002fCompanyNameConnectDEV\u002f_layouts\u002f15\u002fCreatePublishingPageDialog.aspx', autoSize: true, autoSizeStartWidth: 550 };  SP.UI.ModalDialog.showModalDialog(dlgOptions); }); };" iconsrc="/_layouts/15/images/crtpage.gif?rev=44"></ie:menuitem>
		<ie:menuitem id="zz6_MenuItem_Create" type="option" menugroupid="200" description="Create other types of pages, lists, libraries, and sites." text="Add an app" onmenuclick="GoToPage('\u002fsites\u002fCompanyNameConnectDEV\u002f_layouts\u002f15\u002faddanapp.aspx')"></ie:menuitem>
		<ie:menuitem id="zz7_MenuItem_ViewAllSiteContents" type="option" menugroupid="200" description="View all libraries and lists in this site." text="Site contents" onmenuclick="STSNavigate2(event,'/sites/CompanyNameConnectDEV/_layouts/15/viewlsts.aspx');" iconsrc="/_layouts/15/images/allcontent32.png?rev=44"></ie:menuitem>
		<ie:menuitem id="ctl00_ctl60_SiteActionsMenuMainData_ctl00_wsaDesignEditor" type="option" menugroupid="300" description="Change the look and feel of this site." text="Design Manager" onmenuclick="STSNavigate2(event,'/sites/CompanyNameConnectDEV/_layouts/15/DesignSite.aspx');" iconsrc="/_layouts/15/images/designer.png?rev=44"></ie:menuitem>
		<ie:menuitem id="zz8_MenuItem_Settings" type="option" menugroupid="300" description="Access all settings for this site." text="Site settings" onmenuclick="GoToPage('\u002fsites\u002fCompanyNameConnectDEV\u002f_layouts\u002f15\u002fsettings.aspx')" iconsrc="/_layouts/15/images/settingsIcon.png?rev=44"></ie:menuitem>
		</menu></span></span>
	</div>
	<script type="text/javascript">// <![CDATA[ 


		var g_navBarHelpDefaultKey = "HelpHome";
	// ]]>
</script>
	<div class="ms-fullWidth " id="suiteBarTop" style="height: 50px; position: relative;">

		</div><div id="SuiteNavUserName" style="display: none;">Bash, Howard</div><div class="wf-family-o365 o365wf" style="display: none;">

		</div>

	</div>
	<div id="s4-ribbonrow" style="height: 35px;">
		<div id="globalNavBox">
	<div id="ribbonBox">
	<div id="s4-ribboncont">
		<div id="DeltaSPRibbon">
		
			<input name="ctl00$ctl60$ctl04" id="RibbonContainer_activeTabId" type="hidden" value=""><div id="RibbonContainer"><div class="ms-cui-ribbon ms-cui-needIEFilter" id="Ribbon" role="toolbar" aria-describedby="ribboninstructions" unselectable="on"><span class="ms-cui-hidden" id="ribboninstructions" unselectable="on">To navigate through the Ribbon, use standard browser navigation keys. To skip between groups, use Ctrl+LEFT or Ctrl+RIGHT. To jump to the first Ribbon tab use Ctrl+[. To jump to the last selected command use Ctrl+]. To activate a command, use Enter.</span><div class="ms-cui-ribbonTopBars" unselectable="on"><div class="ms-cui-topBar1" style="display: none;" unselectable="on"><div class="ms-cui-qat-container" unselectable="on"></div></div><div class="ms-cui-topBar2" unselectable="on"><div class="ms-cui-jewel-container" id="jewelcontainer" style="display: none;" unselectable="on"></div><div class="ms-cui-TabRowLeft ms-core-defaultFont ms-dialogHidden" id="RibbonContainer-TabRowLeft" unselectable="on">
				</div><ul class="ms-cui-tts" role="tablist" unselectable="on"><li class="ms-cui-tt ms-browseTab ms-cui-tt-s" id="Ribbon.Read-title" role="tab" unselectable="on"><a title="Browse" class="ms-cui-tt-a" onkeydown="if(event != null &amp;&amp; event.keyCode == 13){ if(typeof(_ribbon) != 'undefined') _ribbon.launchedByKeyboard = true; _ribbonStartInit('Ribbon.Read',false, event);  }" onclick="_ribbonStartInit('Ribbon.Read',false, event);" href="javascript:;" unselectable="on"><span class="ms-cui-tt-span" unselectable="on">Browse</span><span class="ms-cui-hidden" unselectable="on">Tab 1 of 3.</span></a></li><li class="ms-cui-tt" id="Ribbon.WikiPageTab-title" role="tab" unselectable="on"><a title="Page" class="ms-cui-tt-a" onkeydown="if(event != null &amp;&amp; event.keyCode == 13){ if(typeof(_ribbon) != 'undefined') _ribbon.launchedByKeyboard = true; _ribbonStartInit('Ribbon.WikiPageTab',false, event);  }" onclick="_ribbonStartInit('Ribbon.WikiPageTab',false, event);" href="javascript:;" unselectable="on"><span class="ms-cui-tt-span" unselectable="on">Page</span><span class="ms-cui-hidden" unselectable="on">Tab 2 of 3.</span></a></li><li class="ms-cui-tt" id="Ribbon.PublishTab-title" role="tab" unselectable="on"><a title="Publish" class="ms-cui-tt-a" onkeydown="if(event != null &amp;&amp; event.keyCode == 13){ if(typeof(_ribbon) != 'undefined') _ribbon.launchedByKeyboard = true; _ribbonStartInit('Ribbon.PublishTab',false, event);  }" onclick="_ribbonStartInit('Ribbon.PublishTab',false, event);" href="javascript:;" unselectable="on"><span class="ms-cui-tt-span" unselectable="on">Publish</span><span class="ms-cui-hidden" unselectable="on">Tab 3 of 3.</span></a></li></ul><div class="ms-cui-TabRowRight s4-trc-container s4-notdlg ms-core-defaultFont" id="RibbonContainer-TabRowRight" style="display: block;" unselectable="on">
					<a title="Give people access to this site." class="ms-promotedActionButton" id="ctl00_ctl60_site_share_button" style="display: inline-block;" onmouseover="this.firstChild.firstChild.style.left='-91px'; this.firstChild.firstChild.style.top='-232px';" onmouseout="this.firstChild.firstChild.style.left='-200px'; this.firstChild.firstChild.style.top='-48px';" onclick="EnsureScriptFunc('sharing.js', 'DisplaySharingDialog', function(){DisplaySharingDialog('\u002fsites\u002fCompanyNameConnectDEV')}); return false;" href="javascript:__doPostBack('ctl00$ctl60$site_share_button','')"><span class="s4-clust ms-promotedActionButton-icon" style="width: 16px; height: 16px; overflow: hidden; display: inline-block; position: relative;"><img style="left: -200px; top: -48px; position: absolute;" alt="Share" src="/_layouts/15/images/spcommon.png?rev=44"></span><span class="ms-promotedActionButton-text">Share</span></a>
					<a title="Follow this site and get back to it easily from your sites page." class="ms-promotedActionButton" id="site_follow_button" style="display: inline-block;" onmouseover="this.firstChild.firstChild.style.left='-217px'; this.firstChild.firstChild.style.top='-192px';" onmouseout="this.firstChild.firstChild.style.left='-218px'; this.firstChild.firstChild.style.top='-48px';" onclick="SP.SOD.executeFunc('followingcommon.js', 'FollowSite', function() { FollowSite(); }); return false;" href="javascript:__doPostBack('ctl00$ctl60$site_follow_button','')"><span class="s4-clust ms-promotedActionButton-icon" style="width: 16px; height: 16px; overflow: hidden; display: inline-block; position: relative;"><img style="left: -218px; top: -48px; position: absolute;" alt="Follow" src="/_layouts/15/images/spcommon.png?rev=44"></span><span class="ms-promotedActionButton-text">Follow</span></a>
					
					<a title="Edit" class="ms-rtefocus-invalid ms-promotedActionButton" id="ctl00_ctl60_PageStateActionButton" onmouseover="this.firstChild.firstChild.style.left='-' + (this.getAttribute('_action') === 'edit' ? this.getAttribute('_edithoveroffsetx') : this.getAttribute('_savehoveroffsetx')) + 'px'; this.firstChild.firstChild.style.top='-' + (this.getAttribute('_action') === 'edit' ? this.getAttribute('_edithoveroffsety') : this.getAttribute('_savehoveroffsety')) + 'px';" onmouseout="this.firstChild.firstChild.style.left='-' + (this.getAttribute('_action') === 'edit' ? this.getAttribute('_editoffsetx') : this.getAttribute('_saveoffsetx')) + 'px'; this.firstChild.firstChild.style.top='-' + (this.getAttribute('_action') === 'edit' ? this.getAttribute('_editoffsety') : this.getAttribute('_saveoffsety')) + 'px';" onclick="CoreInvoke('PageActionClick', this);return false;" href="javascript:" _savetooltip="Save" _edittooltip="Edit" _savehoveroffsety="449" _savehoveroffsetx="0" _saveoffsety="433" _saveoffsetx="0" _edithoveroffsety="192" _edithoveroffsetx="181" _editoffsety="84" _editoffsetx="236" _action="edit"><span class="s4-clust ms-promotedActionButton-icon" style="width: 16px; height: 16px; overflow: hidden; display: inline-block; position: relative;"><img style="left: -236px; top: -84px; position: absolute;" alt="Edit" src="/_layouts/15/images/spcommon.png?rev=44"></span><span class="ms-promotedActionButton-text">Edit</span></a>
<span class="ms-qatbutton" id="fullscreenmodebox">
	<span id="fullscreenmode">
		<a title="Focus on Content" id="ctl00_ctl60_fullscreenmodeBtn" style="width: 30px; height: 30px; display: inline-block;" onmouseover="this.firstChild.firstChild.firstChild.style.left='-125px'; this.firstChild.firstChild.firstChild.style.top='-178px';" onmouseout="this.firstChild.firstChild.firstChild.style.left='-143px'; this.firstChild.firstChild.firstChild.style.top='-178px';" onclick="SetFullScreenMode(true);PreventDefaultNavigation();return false;" href="../_controltemplates/15/#"><span style="padding: 7px; width: 16px; height: 16px; overflow: hidden; display: inline-block;"><span class="s4-clust" style="width: 16px; height: 16px; overflow: hidden; display: inline-block; position: relative;"><img style="border: 0px currentColor; left: -143px; top: -178px; position: absolute;" alt="Focus on Content" src="/_layouts/15/images/spcommon.png?rev=44"></span></span></a>
	</span>
	<span id="exitfullscreenmode" style="display: none;">
		<a title="Focus on Content" id="ctl00_ctl60_exitfullscreenmodeBtn" style="width: 30px; height: 30px; display: inline-block;" onmouseover="this.firstChild.firstChild.firstChild.style.left='-179px'; this.firstChild.firstChild.firstChild.style.top='-96px';" onmouseout="this.firstChild.firstChild.firstChild.style.left='-107px'; this.firstChild.firstChild.firstChild.style.top='-178px';" onclick="SetFullScreenMode(false);PreventDefaultNavigation();return false;" href="../_controltemplates/15/#"><span style="padding: 7px; width: 16px; height: 16px; overflow: hidden; display: inline-block;"><span class="s4-clust" style="width: 16px; height: 16px; overflow: hidden; display: inline-block; position: relative;"><img style="border: 0px currentColor; left: -107px; top: -178px; position: absolute;" alt="Focus on Content" src="/_layouts/15/images/spcommon.png?rev=44"></span></span></a>
	</span>
</span>


				</div></div></div></div></div>
		
	</div>
	</div>
	<span id="DeltaSPNavigation">
			<span id="ctl00_ctl60_ctl11_publishingRibbon"></span>

	</span>
</div>
<div class="ms-core-webpartadder" id="DeltaWebPartAdderUpdatePanelContainer" style="top: 34px;">
		
  <div id="WebPartAdderUpdatePanelContainer">
	<div id="ctl00_ctl60_WebPartAdderUpdatePanel">
			
		<span id="ctl00_ctl60_WebPartAdder"></span>
	  
		</div>
  </div>

	</div>
		</div>
	</div>

</div>

			<!-- ===== STARTER: Ribbon Code Ends Here  ======================================================================================== -->
			
			<!-- ===== STARTER: Authentication / Login link hidden for everyone by anonymous users  =========================================== -->
			
			
			<!-- ===== STARTER: Main Scrolling Body Starts Here =============================================================================== -->
			<div id="s4-workspace" style="width: 1920px; height: 331px;">
				<div id="s4-bodyContainer">
				
                    <!-- ===== STARTER: This decides where the web part menu lives ===================================================== -->
                    <div id="ctl00_DeltaPlaceHolderMain">
                        
                        <!-- ===== STARTER: style.css adds width and margin =========================================================================================== -->
                        <div class="customWidth">
                                                    
                           <div class="customContent">                          
                          
                              <!-- ===== STARTER: SharePoint looks for this div ID s4-titlerow for the "Focus on Content" Button ======================== -->
                              <div id="s4-titlerow" style="display: block;">
                            
                                <!-- ===== STARTER: Site Logo with link to root ======================================================================= -->
        
                                <div class="ms-dialogHidden customFloatLogo">
                                    <a href="/sites/CompanyNameConnectDEV/">
                                         
                                         <img id="ctl00_x63829de2201a4365a3904788f682d0a3" alt="&#10;" src="/sites/CompanyNameConnectDEV/_catalogs/masterpage/HCP/logo.png">
                                    </a>
                                </div>							
                            
                                <!-- ===== STARTER: Global navigation ================================================================================= -->
                                <div class="ms-dialogHidden customNavHolder" style="height: 50px;">
                                
                                    <div class="customNavLeftHolder" style="float: left;">
                                    
                                        <div class="ms-displayInline ms-core-navigation ms-dialogHidden" style="font-family: Roboto !important; font-weight: normal;">
                                        
                                            
                                            <div class=" noindex ms-core-listMenu-horizontalBox" id="zz9_TopNavigationMenu" style="float: left;"><div class="container">

	<div class="HCPmenu-container">

		<div class="HCPitem">

			<a href="#">Our CompanyName</a>

				<div class="HCPsub-menu">

					<div class="col_0 HCPsub-menu-item">

						<a href="#" target="_blank">Memos</a>

						<a href="#" target="_blank">PressReleases</a>

						<a href="#" target="_blank">The Next Page</a>

						<a href="#" target="_blank">CompanyNameCollins News</a>

					</div><!-- Close Column Div -->

					<div class="col_1 HCPsub-menu-item">

						<a href="#" target="_self">Corporate Information</a>

						<a href="#" target="_self">CompanyNameCollins Gives Back</a>

						<a href="#" target="_self">Company History</a>

						<a href="#" target="_blank">The History of CompanyNameCollins</a>

					</div><!-- Close Column Div -->

					<div class="col_2 HCPsub-menu-item">

						<a href="#" target="_self">Record Management</a>

						<a href="#" target="_self">Research and Reference Services</a>

					</div><!-- Close Column Div -->

				</div><!-- Close Sub Menu Div -->

		</div><!-- Close Item Div -->

		<div class="HCPitem">

			<a href="#">Human Resources</a>

				<div class="HCPsub-menu">

					<div class="col_0 HCPsub-menu-item">

						<a href="#" target="_self">US Human Resources</a>

						<a href="#" target="_self">Canada Human Resources</a>

					</div><!-- Close Column Div -->

				</div><!-- Close Sub Menu Div -->

		</div><!-- Close Item Div -->

		<div class="HCPitem">

			<a href="#">Information Technology</a>

				<div class="HCPsub-menu">

					<div class="col_0 HCPsub-menu-item">

						<a href="#" target="_self">Policies and User Guides</a>

						<a href="#" target="_self">IT Security</a>

					</div><!-- Close Column Div -->

				</div><!-- Close Sub Menu Div -->

		</div><!-- Close Item Div -->

		<div class="HCPitem">

			<a href="#">Corporate Services</a>

				<div class="HCPsub-menu">

					<div class="col_0 HCPsub-menu-item">

						<a href="#" target="_self">NYC</a>

						<a href="#" target="_self">Montage</a>

						<a href="#" target="_self">Princeton</a>

						<a href="#" target="_self">San Fran</a>

					</div><!-- Close Column Div -->

					<div class="col_1 HCPsub-menu-item">

						<a href="#" target="_self">Canada</a>

						<a href="#" target="_blank">Visitor's Registration</a>

						<a href="#" target="_blank">iOffice</a>

						<a href="#" target="_blank">Purchasing</a>

					</div><!-- Close Column Div -->

					<div class="col_2 HCPsub-menu-item">

						<a href="#" target="_self">Corporate Travel</a>

					</div><!-- Close Column Div -->

				</div><!-- Close Sub Menu Div -->

		</div><!-- Close Item Div -->

		<div class="HCPitem">

			<a href="#">Sales Connect</a>

				<div class="HCPsub-menu">

					<div class="col_0 HCPsub-menu-item">

					</div><!-- Close Column Div -->

				</div><!-- Close Sub Menu Div -->

		</div><!-- Close Item Div -->

	</div><!-- Close menu-container div -->

</div><!-- Close container div -->

</div>												
                    
                                        </div>
                        
                                    </div> <!-- ===== End customNavLeftHolder DIV ===== -->
                                                                
                                        <div class="customNavRightHolder">
                                        
                                            <div class="customNewSearchPlaceHolder" id="newSearchLocation">
                                                <!-- ===== STARTER: Search Control ==================================================================================== -->
                                                <div class="ms-dialogHidden">
                                                    
                                                        <div class="ms-webpart-chrome ms-webpart-chrome-fullWidth ">
	<div class="ms-WPBody noindex " id="WebPartWPQ1" allowdelete="false" onlyformepart="true" width="100%" haspers="true" webpartid="00000000-0000-0000-0000-000000000000"><div id="ctl00_PlaceHolderSearchArea_g_f7dbfedf_d871_41f9_b91f_448be21e6584_csr" componentid="ctl00_PlaceHolderSearchArea_g_f7dbfedf_d871_41f9_b91f_448be21e6584_csr"><div id="SearchBox" style="padding-top: 10px !important; float: right !important;" name="Control"><div class="ms-srch-sb ms-srch-sb-border" id="ctl00_PlaceHolderSearchArea_g_f7dbfedf_d871_41f9_b91f_448be21e6584_csr_sboxdiv"><input title="Search this site" class="ms-textSmall ms-srch-sb-prompt ms-helperText" id="ctl00_PlaceHolderSearchArea_g_f7dbfedf_d871_41f9_b91f_448be21e6584_csr_sbox" accesskey="S" onkeydown="EnsureScriptFunc('Search.ClientControls.js', 'Srch.U', function() {var ctl = $find('ctl00_PlaceHolderSearchArea_g_f7dbfedf_d871_41f9_b91f_448be21e6584_csr');ctl.activateDefaultQuerySuggestionBehavior();})" onkeypress="EnsureScriptFunc('Search.ClientControls.js', 'Srch.U', function() {if (Srch.U.isEnterKey(String.fromCharCode(event.keyCode))) {$find('ctl00_PlaceHolderSearchArea_g_f7dbfedf_d871_41f9_b91f_448be21e6584_csr').search($get('ctl00_PlaceHolderSearchArea_g_f7dbfedf_d871_41f9_b91f_448be21e6584_csr_sbox').value);return Srch.U.cancelEvent(event);}})" onfocus="EnsureScriptFunc('Search.ClientControls.js', 'Srch.U', function() {var ctl = $find('ctl00_PlaceHolderSearchArea_g_f7dbfedf_d871_41f9_b91f_448be21e6584_csr');ctl.hidePrompt();ctl.setBorder(true);})" onblur="EnsureScriptFunc('Search.ClientControls.js', 'Srch.U', function() {var ctl = $find('ctl00_PlaceHolderSearchArea_g_f7dbfedf_d871_41f9_b91f_448be21e6584_csr'); if (ctl){ ctl.showPrompt(); ctl.setBorder(false);}})" type="text" maxlength="2048" value="Search this site" autocorrect="off" autocomplete="off"><a title="Navigation" class="ms-srch-sb-navLink" id="ctl00_PlaceHolderSearchArea_g_f7dbfedf_d871_41f9_b91f_448be21e6584_csr_NavButton" onclick="EnsureScriptFunc('Search.ClientControls.js', 'Srch.U', function() {$find('ctl00_PlaceHolderSearchArea_g_f7dbfedf_d871_41f9_b91f_448be21e6584_csr').activateDefaultNavigationBehavior();return Srch.U.cancelEvent(event);})" href="javascript: {}"><img class="ms-srch-sb-navImg" id="navImg" alt="Navigation" src="/_layouts/15/images/searchresultui.png?rev=44"></a><a title="Search" class="ms-srch-sb-searchLink" id="ctl00_PlaceHolderSearchArea_g_f7dbfedf_d871_41f9_b91f_448be21e6584_csr_SearchLink" role="button" onclick="EnsureScriptFunc('Search.ClientControls.js', 'Srch.U', function() {$find('ctl00_PlaceHolderSearchArea_g_f7dbfedf_d871_41f9_b91f_448be21e6584_csr').search($get('ctl00_PlaceHolderSearchArea_g_f7dbfedf_d871_41f9_b91f_448be21e6584_csr_sbox').value);})" href="javascript: {}"><img class="ms-srch-sb-searchImg" id="searchImg" alt="Search" src="/_layouts/15/images/searchresultui.png?rev=44"></a><div class="ms-qSuggest-container ms-shadow" id="AutoCompContainer"><div id="ctl00_PlaceHolderSearchArea_g_f7dbfedf_d871_41f9_b91f_448be21e6584_csr_AutoCompList"></div></div><div class="ms-qSuggest-container ms-shadow" id="NavDropdownListContainer"><div id="ctl00_PlaceHolderSearchArea_g_f7dbfedf_d871_41f9_b91f_448be21e6584_csr_NavDropdownList"></div></div></div></div></div><noscript>&lt;div id="ctl00_PlaceHolderSearchArea_g_f7dbfedf_d871_41f9_b91f_448be21e6584_noscript"&gt;It looks like your browser does not have JavaScript enabled. Please turn on JavaScript and try again.&lt;/div&gt;</noscript><div id="ctl00_PlaceHolderSearchArea_g_f7dbfedf_d871_41f9_b91f_448be21e6584">

	</div><div class="ms-clear"></div></div>
</div>
                                                    
                                                </div>										
                                            </div>							
                                            
                                        </div> <!-- ===== End customNavRightHolder DIV ===== -->
                                                                                                                                                                                                    
                                </div> <!-- ===== End customNavHolder DIV ===== -->
                                
                                                        
                                <!-- ===== STARTER: Breadcrumbs ======================================================================================= -->
                                <div class="ms-dialogHidden">
                                    <h1 class="ms-core-pageTitle" id="pageTitle">	
                                        <!-- ===== STARTER: SP Reqs DeltaPlaceHolderPageTitleInTitleArea and PlaceHolderPageTitleInTitleArea for adding Apps in Site Content =================== -->
                                        <span id="DeltaPlaceHolderPageTitleInTitleArea">							
                                            
                                                CompanyNameConnect
                                            
                                        </span>									
        
                                        <div class="ms-displayInlineBlock ms-normalWrap">
                                            <a title="&#10;                                                &#10;                                            " id="ms-pageDescriptionDiv" style="display: none;" href="javascript:;">
                                                <span id="ms-pageDescriptionImage">&nbsp;</span>
                                            </a>
                                            <span class="ms-accessible" id="ms-pageDescription">
                                                
                                            </span>
                                            <script type="text/javascript">// <![CDATA[ 


                                                 
                                                 _spBodyOnLoadFunctionNames.push("setupPageDescriptionCallout");
                                            // ]]>
</script>
                                        </div>
                                    </h1>
                                </div>
                                
                            </div> <!-- ===== End s4-titlerow DIV ===== -->
                            
                            <!-- ===== STARTER: Body Area (includes left nav and body) ==================================================================== -->
                            
                            <!-- ===== STARTER: Current navigation =========================================================================================== -->
                            <div class="ms-dialogHidden ms-forceWrap ms-noList" id="sideNavBox">
                                <div class="ms-core-navigation" style="font-family: Roboto !important; font-weight: normal;">
                                    <!-- ===== STARTER: SP Reqs PlaceHolderLeftNavBar for adding Apps in Site Content =================== -->						
                                    
                                        
                                            <!-- ===== STARTER: hide the quick launch for any page the doesn't override the PlaceHolderLeftNavBar ============ -->
                                            <!-- ===== STARTER: if you want the navigation back you can add it from the collab master ============ -->
                                            <style type="text/css">
                                                #contentBox { margin-left: 0; }
                                                #sideNavBox { display: none; }
                                            </style>
                                        
                                        
                                        
                                        
                                        
                                        
                                    
                                </div>
                            </div>	<!-- ===== sideNavBox ==== -->
                            
                            <!-- ===== STARTER: Main Content ========================================================================================== -->
                            <div id="contentBox">
                                
                                    <!-- ===== STARTER: Main Placeholder gets replaced with content of the page ======================================= -->
                                    
<div style="margin: 15px 0px 1px; clear: both;">
<div class="ms-webpart-zone ms-fullWidth">
	<div class="s4-wpcell-plain ms-webpartzone-cell ms-webpart-cell-vertical ms-fullWidth " id="MSOZoneCell_WebPartWPQ10">
		<div class="ms-webpart-chrome ms-webpart-chrome-vertical ms-webpart-chrome-fullWidth ">
			<div class="ms-WPBody noindex " id="WebPartWPQ10" allowdelete="false" width="100%" haspers="false" webpartid="6d985db1-305a-43df-be8f-ba2bc1e19003"><div class="ms-rtestate-field"><link href="https://CompanyNamecollins.sharepoint.com/sites/CompanyNameConnectDEV/_catalogs/masterpage/HCP/slick/slick.css" rel="stylesheet" type="text/css">
<link href="https://CompanyNamecollins.sharepoint.com/sites/CompanyNameConnectDEV/_catalogs/masterpage/HCP/slick/slick-theme.css" rel="stylesheet" type="text/css">
<script src="https://CompanyNamecollins.sharepoint.com/sites/CompanyNameConnectDEV/_catalogs/masterpage/HCP/slick/slick.min.js" type="text/javascript"></script>
<script type="text/javascript">
    var scriptbase = _spPageContextInfo.webServerRelativeUrl + "/_layouts/15/";
    var siteURL = 'https://CompanyNamecollins.sharepoint.com';
    var activeBannerItem = 0;
    var maxItemCount = 3;
    var bannerTimerDuration = 4000;
    var bannerArray = [];

    var call = $.ajax({
        url: "https://CompanyNamecollins.sharepoint.com" + _spPageContextInfo.webServerRelativeUrl + "/_api/web/lists/GetByTitle('CompanyNameCollins News')/items?$select=*"
		   , type: "GET",
        dataType: "json",
        headers: {
            Accept: "application/json;odata=verbose"
        }
    });


    call.done(function (data, textStatus, jqXHR) {
        var dataArray = data.d.results.sort(dynamicSort("DisplayOrder"));
        for (var i in dataArray) {
			if(i < maxItemCount){
            var litems = [];
            litems['title'] = data.d.results[i].Title;
            litems['image'] = 'none';
            litems['order'] = i;
            litems['attachments'] = data.d.results[activeBannerItem].Attachments;
			litems['link'] = data.d.results[activeBannerItem].Link;



            try {
                litems['image'] = data.d.results[i].CarouselImage.Url;
                bannerArray.push(litems);
            } catch (bbb) { }

            var getAttachmentURL = function (callback) {
                $.ajax({
                    url: data.d.results[i].AttachmentFiles.__deferred.uri,
                    dataType: 'json',
                    async: false,
                    success: callback
                });


            };

            if (data.d.results[i].Attachments == true) {
                getAttachmentURL(function (adata) {
                    try {
                        var fullurl = siteURL + adata.value[0].ServerRelativeUrl;
                        if (fullurl.match('.jpg') || fullurl.endsWith('.png') || fullurl.endsWith('.jpeg') || fullurl.endsWith('.gif')) {
                            litems['image'] = fullurl;
                            bannerArray.push(litems);
                        }
                    } catch (ccc) { }
                });
            }

            $('#BannerInformation' + i + ' div h4').text(data.d.results[i].Title);
			$('#BannerInformation' + i + ' div a').attr("href", data.d.results[i].Link);
			$('#BannerInformation' + i + ' div a').text(data.d.results[i].SummaryText);
			$('#BannerInformation' + i + ' div div span').text(data.d.results[i].SlideDetail );

			}
        }

		$('#BannerInformation0' ).hover(function (ev) {
				//$('.MainBannerImages').slick('slickPause');
				$( '.MainBannerImages' ).slick('slickGoTo', 0, false);
				activeBannerItem = 0;
				getActiveBannerItem(activeBannerItem);
			}, function (ev)
			{
				//$('.MainBannerImages').slick('slickPlay');
			})
			
		$('#BannerInformation1' ).hover(function (ev) {
				//$('.MainBannerImages').slick('slickPause');
				$( '.MainBannerImages' ).slick('slickGoTo', 1, false);
				activeBannerItem = 1;
				getActiveBannerItem(activeBannerItem);
			}, function (ev)
			{
				//$('.MainBannerImages').slick('slickPlay');
			})

		$('#BannerInformation2' ).hover(function (ev) {
				//$('.MainBannerImages').slick('slickPause');
				$( '.MainBannerImages' ).slick('slickGoTo', 2, false);
				activeBannerItem = 2;
				getActiveBannerItem(activeBannerItem);
			}, function (ev)
			{
				//$('.MainBannerImages').slick('slickPlay');
			})

			
        for (var j in bannerArray) {
            $('#MainBannerImages').append('<div><a href="'+bannerArray[j]['link']+'"><img height="255px" id="theImg' + j + '" src="' + bannerArray[j]['image'] + '" /></a></div>')
        }
        var bannerTimer = setInterval(rotateHCPBanner, bannerTimerDuration);
        $('.MainBannerImages').slick({
            //autoplay: true,
            //autoplaySpeed: bannerTimerDuration,
            //adaptiveHeight: true,
            //variableWidth: true,
            //infinite: true
            //speed: 500,
            //fade: true,
            //cssEase: 'linear'
            //dots: false,
            //pauseOnHover: true
        });
		
		$('.MainBannerImages').on('afterChange', function(event, slick, currentSlide, nextSlide){
		  //console.log($(slick.$slides.get(currentSlide)));
		  if(currentSlide != activeBannerItem){
			for(k=0;k<= maxItemCount; k++){
				if(k==currentSlide){
				$('#BannerInformation' + k).css({"background-color": "#0c7ff2"});
				activeBannerItem = currentSlide;
				}
				else{
				$('#BannerInformation' + k).css({"background-color": "#bfc2c7"});
				}
				}
				}
		});
		
		$('.MainBannerContainer').hover(function (ev) {
			clearInterval(bannerTimer);
			//$('.MainBannerImages').slickPause();
        }, function (ev) {
            bannerTimer = setInterval(rotateHCPBanner, bannerTimerDuration);
			//$('.MainBannerImages').slickPlay();
        });
		
				getActiveBannerItem(0);

    });

    function rotateHCPBanner() {
        //setBannerImage(bannerArray[activeBannerItem]['image']);
		//getActiveBannerItem(activeBannerItem);
        activeBannerItem++;
        if (activeBannerItem >= maxItemCount) {
            activeBannerItem = 0;
        }
				getActiveBannerItem(activeBannerItem);

    }

	function getActiveBannerItem(i){
	for(k=0;k<= maxItemCount; k++){
		if(k==i){
		$('#BannerInformation' + k).css({"background-color": "#0c7ff2"});
		$( '.MainBannerImages' ).slick('slickGoTo', i, false);
		}
		else{
		$('#BannerInformation' + k).css({"background-color": "#bfc2c7"});
		
		}
		}
	}
	
    function setBannerImage(iurl) {
        //iurl = 'https://CompanyNamecollins.sharepoint.com/sites/CompanyNameConnectDEV/Lists/CompanyNameCollins%20News/Attachments/4/FinanceUpgrade_news.jpg';
        var tmpImg = new Image();
        tmpImg.src = iurl;
        $(tmpImg).one('load', function () {
            orgWidth = tmpImg.width;
            orgHeight = tmpImg.height;
            //alert(orgWidth+"x"+orgHeight);
            //$('.MainBannerImages').css('background-repeat', 'no-repeat');
            $('.MainBannerImages').css('background-image', 'url(' + iurl + ')');

        });

    }

    function dynamicSort(property) {
        var sortOrder = 1;
        if (property[0] === '-') {
            sortOrder = -1;
            property = property.substr(1);
        }
        return function (a, b) {
            var result = (a[property] < b[property]) ? -1 : (a[property] > b[property]) ? 1 : 0;
            return result * sortOrder;
        }
    }

    $(document).ready(function () {

    });
</script>
<style>
    .MainBannerContainer {
        width: 956px;
        height: 255px;
        display: block;
        position: relative;
        top: 8px;
    }
	
	@media screen and (-webkit-min-device-pixel-ratio:0) { 
.MainBannerContainer {
 top: 8px;
}
}

	.MainBannerContainer:hover {
	}
	
    .MainBannerImages {
        position: relative;
        width: 67.5%;
        float: left;
        height: 255px;
        background-color: white;
		animation: fade .5s linear;
		}
	
	.MainBannerImages:visited {
     color: none;
    text-decoration: none;
	}
	
	.MainBannerImages:hover {
		animation: fade .5s linear;
		}

    .MainBannerRight {
        width: 32.5%;
        float: right;
        height: 255px;
        background-color: #d1d4d9;
    }

    .MainBannerInfo {
        width: 100%;
        height: 33.33%;
		transition: background-color 0.5s ease;
		color: white;
    }

	.MainBannerInfo > div {
		padding: 5px;
	}

	.MainBannerInfo > div > h4 {
		line-height: 1.2;
		font-weight: bold;
		color: white;
		font-size: 14px;
		height: 20px;
	}
	
	.MainBannerInfo > div > a {
		font-weight: bold;
		color: white;
		text-decoration: none;
		float: right;
	}
	
	.MainBannerInfo > div > div {
		height: 43px;
		/*display: table-cell;
		font-size: 12px;*/
	}
	
	.MainBannerInfo > div > div > span {
		/*vertical-align: middle;*/
	}

    #contentBox {
        position: relative;
        top: -32px;
    }

    #newSearchLocation {
    }
	
	#newSearchLocation:hover {
    }

    .slick-arrow {
        display: none !important;
    }

    h3, h4 {
        font-family: 'Roboto', sans-serif !important;
    }
</style>
<div class="MainBannerContainer">
    <div class="MainBannerImages slick-initialized slick-slider" id="MainBannerImages"><button class="slick-prev slick-arrow" role="button" style="display: inline-block;" aria-label="Previous" type="button" data-role="none">Previous</button>
    <div class="slick-list draggable" aria-live="polite"><div class="slick-track" role="listbox" style="width: 3230px; opacity: 1; transform: translate3d(-1938px, 0px, 0px);"><div tabindex="-1" class="slick-slide slick-cloned" aria-hidden="true" style="width: 646px;" data-slick-index="-1"><a tabindex="-1" href="http://CompanyNameconnect/OurCompanyName/CompanyNameCollinsGivesBack/Pages/CompanyNameCollins-Book-Donation-Program.aspx"><img height="255" src="https://CompanyNamecollins.sharepoint.com/sites/CompanyNameConnectDEV/Lists/CompanyNameCollins News/Attachments/3/HeroSize_01.jpg"></a></div><div tabindex="-1" class="slick-slide" role="option" aria-hidden="true" aria-describedby="slick-slide00" style="width: 646px;" data-slick-index="0"><a tabindex="-1" href="http://CompanyNameconnect/OurCompanyName/CompanyNameCollinsGivesBack/Pages/CompanyNameCollins-Book-Donation-Program.aspx"><img height="255" id="theImg0" src="https://CompanyNamecollins.sharepoint.com/sites/CompanyNameConnectDEV/Lists/CompanyNameCollins News/Attachments/2/BookDonations_news.jpg"></a></div><div tabindex="-1" class="slick-slide" role="option" aria-hidden="true" aria-describedby="slick-slide01" style="width: 646px;" data-slick-index="1"><a tabindex="-1" href="http://CompanyNameconnect/OurCompanyName/CompanyNameCollinsGivesBack/Pages/CompanyNameCollins-Book-Donation-Program.aspx"><img height="255" id="theImg1" src="https://CompanyNamecollins.sharepoint.com/sites/CompanyNameConnectDEV/Lists/CompanyNameCollins News/Attachments/1/HeroSize_01.jpg"></a></div><div tabindex="-1" class="slick-slide slick-current slick-active" role="option" aria-hidden="false" aria-describedby="slick-slide02" style="width: 646px;" data-slick-index="2"><a tabindex="0" href="http://CompanyNameconnect/OurCompanyName/CompanyNameCollinsGivesBack/Pages/CompanyNameCollins-Book-Donation-Program.aspx"><img height="255" id="theImg2" src="https://CompanyNamecollins.sharepoint.com/sites/CompanyNameConnectDEV/Lists/CompanyNameCollins News/Attachments/3/HeroSize_01.jpg"></a></div><div tabindex="-1" class="slick-slide slick-cloned" aria-hidden="true" style="width: 646px;" data-slick-index="3"><a tabindex="-1" href="http://CompanyNameconnect/OurCompanyName/CompanyNameCollinsGivesBack/Pages/CompanyNameCollins-Book-Donation-Program.aspx"><img height="255" src="https://CompanyNamecollins.sharepoint.com/sites/CompanyNameConnectDEV/Lists/CompanyNameCollins News/Attachments/2/BookDonations_news.jpg"></a></div></div></div><button class="slick-next slick-arrow" role="button" style="display: inline-block;" aria-label="Next" type="button" data-role="none">Next</button></div>
    <div class="MainBannerRight">
        <div class="MainBannerInfo" id="BannerInformation0" style="background-color: rgb(191, 194, 199);"><div><h4>CompanyNameCollins Book Donation Program</h4><div><span>detail text detail text detail text detail text</span></div><a href="http://CompanyNameconnect/OurCompanyName/CompanyNameCollinsGivesBack/Pages/CompanyNameCollins-Book-Donation-Program.aspx">Read More</a></div></div>
        <div class="MainBannerInfo" id="BannerInformation1" style="background-color: rgb(191, 194, 199);"><div><h4>Donate to the Goddard Riverside Book Fair</h4><div><span>detail text detail text detail text detail textdetail text detail text detail text detail text</span></div><a href="http://CompanyNameconnect/OurCompanyName/CompanyNameCollinsGivesBack/Pages/Goddard-Riverside-Book-Fair-2016.aspx">Read More</a></div></div>
        <div class="MainBannerInfo" id="BannerInformation2" style="background-color: rgb(12, 127, 242);"><div><h4>New Financial System &amp; Invoice Process</h4><div><span>detail text detail text detail text detail textdetail text detail text detail text detail textdetail text detail text detail text detail tex</span></div><a href="http://CompanyNameconnect/OurCompanyName/Pages/CompanyNameCollins%20News%20Archive/Finance-Upgrades-2016.aspx">Read More</a></div></div>
    </div>
</div>

    <title>HCPMainbanner</title>
</div><div class="ms-clear"></div></div>
		</div>
	</div>
</div>
</div>
<div style="width: 100%; height: 20px; clear: both;"></div>
<table width="100%"><tbody><tr><td>
<div style="width: 313px; margin-right: 10px; float: left;">
<div class="ms-webpart-zone ms-fullWidth">
	<div class="s4-wpcell-plain ms-webpartzone-cell ms-webpart-cell-vertical ms-fullWidth " id="MSOZoneCell_WebPartWPQ7">
		<div class="ms-webpart-chrome ms-webpart-chrome-vertical ms-webpart-chrome-fullWidth ">
			<div class="ms-WPBody noindex " id="WebPartWPQ7" allowdelete="false" width="100%" haspers="false" webpartid="09dcba0d-bf84-427f-9982-453186538b88"><div class="ms-rtestate-field"><script type="text/javascript">
    $(document).ready(function () {
        var scriptbase = _spPageContextInfo.webServerRelativeUrl + "/_layouts/15/";
        $.getScript(scriptbase + "SP.Runtime.js",
        function () {
            $.getScript(scriptbase + "SP.js", function () {
                $.getScript(scriptbase + "SP.Taxonomy.js", function () {
                    createQuickNav();
                });
            });
        });
    });

    function createQuickNav() {

        var context = SP.ClientContext.get_current();
        var taxSession = SP.Taxonomy.TaxonomySession.getTaxonomySession(context);
        var Nav = taxSession.getTerm("1c940766-5139-4043-b91b-9054618ff2f1");
        var childTerms = Nav.get_terms();
        context.load(childTerms);

        context.executeQueryAsync(function () {
            var cEnumerator = childTerms.getEnumerator();
            var i = 1;
            while (cEnumerator.moveNext()) {
                try {
                    var cTerm = cEnumerator.get_current();
                    var quicklink = cTerm.get_objectData().get_properties().LocalCustomProperties._Sys_Nav_SimpleLinkUrl;
                    $('#termStoreName' + i).attr('href', quicklink);
                    $('#termStoreName' + i).text(cTerm.get_name());
                    if (quicklink.indexOf('/sites/CompanyNameConnect/') !== -1) {
						//$('#termStoreli' + i).attr('onclick', 'location.href="'+quicklink+'")');
                    } else {
                        $('#termStoreName' + i).attr('target', '_blank');
						//$('#termStoreli' + i).attr('onclick', 'window.open("'+quicklink+'")');
                    }
                } catch (err) {
                }
                i++;
            }
        }
		 )
    }
</script>
<style>
    .quickNavContainer {
        height: 216px;
        width: 313px;
    }

        .quickNavContainer ul {
            /*list-style-type: none;*/
            padding: 0px;
        }

        .quickNavContainer a {
            text-decoration: none;
            color: #ffffff;
            /*font-family: sans-serif;*/
            font-size: 20px;
            top: 6px;
            position: relative;
        }

        .quickNavContainer ul li:hover > a {
            position: relative;
            left: 13px;
        }

        .quickNavContainer ul li {
            height: 36px;
            list-style-type: none;
            text-align: center;
        }

            .quickNavContainer ul li:hover {
                background-color: #0c7ff2;
            }

    .lightli {
        background-color: #d2d5d9;
    }

    .darkli {
        background-color: #bfc3c7;
    }

    .quickNavContainer li:hover:after {
        content: "";
        display: block;
        border: 13px solid #0c7ff2;
        border-right-color: #ffffff;
        position: relative;
        /* bottom: 0px; */
        width: 0px;
        height: 0px;
        float: right;
        top: 4px;
    }
</style>

<div class="quickNavContainer">
    <ul>
        <li class="darkli" id="termStoreli1"><a id="termStoreName1" href="/sites/CompanyNameConnect/Pages/HCPHome.aspx">Author Connect</a></li>
        <li class="lightli" id="termStoreli2"><a id="termStoreName2" href="/sites/CompanyNameConnect/Pages/HCPHome.aspx">Author Welcome Kit</a></li>
        <li class="darkli" id="termStoreli3"><a id="termStoreName3" href="/sites/CompanyNameConnect/Pages/HCPHome.aspx">Charge to Budget</a></li>
        <li class="lightli" id="termStoreli4"><a id="termStoreName4" href="/sites/CompanyNameConnect/Pages/HCPHome.aspx">Concur</a></li>
        <li class="darkli" id="termStoreli5"><a id="termStoreName5" href="/sites/CompanyNameConnect/Pages/HCPHome.aspx">Contract File Tracking</a></li>
        <li class="lightli" id="termStoreli6"><a id="termStoreName6" href="/sites/CompanyNameConnect/Pages/HCPHome.aspx">Copy Center</a></li>
    </ul>
</div>
</div><div class="ms-clear"></div></div>
		</div>
	</div>
</div>
</div>
</td></tr></tbody></table>
<div style="width: 313px; margin-right: 10px; float: left;">
<div class="ms-webpart-zone ms-fullWidth">
	<div class="s4-wpcell-plain ms-webpartzone-cell ms-webpart-cell-vertical ms-fullWidth " id="MSOZoneCell_WebPartWPQ8">
		<div class="ms-webpart-chrome ms-webpart-chrome-vertical ms-webpart-chrome-fullWidth ">
			<div class="ms-WPBody noindex " id="WebPartWPQ8" allowdelete="false" width="100%" haspers="false" webpartid="613d9f8d-ff90-480c-a1cd-6a82540acf4b"><div class="ms-rtestate-field"><div class="quickNavContainer">
<ul>
<li class="darkli" id="termStoreli7"><a id="termStoreName7" href="/sites/CompanyNameConnect/Pages/HCPHome.aspx">DAM</a></li>
<li class="lightli" id="termStoreli8"><a id="termStoreName8" href="/sites/CompanyNameConnect/Pages/HCPHome.aspx">Docushare</a></li>
<li class="darkli" id="termStoreli9"><a id="termStoreName9" href="/sites/CompanyNameConnect/Pages/HCPHome.aspx">Emergency/Security</a></li>
<li class="lightli" id="termStoreli10"><a id="termStoreName10" href="/sites/CompanyNameConnect/Pages/HCPHome.aspx">CompanyNameCollins Gives Back</a></li>
<li class="darkli" id="termStoreli11"><a id="termStoreName11" href="https://CompanyNamecollins.sharepoint.com/sites/USLearningLibrary" target="_blank">Learning Library</a></li>
<li class="lightli" id="termStoreli12"><a id="termStoreName12" href="/sites/CompanyNameConnect/Pages/HCPHome.aspx">Logo Library</a></li>
</ul>
</div></div><div class="ms-clear"></div></div>
		</div>
	</div>
</div>
</div>
<div style="width: 313px; float: right;">
<div class="ms-webpart-zone ms-fullWidth">
	<div class="s4-wpcell-plain ms-webpartzone-cell ms-webpart-cell-vertical ms-fullWidth " id="MSOZoneCell_WebPartWPQ9">
		<div class="ms-webpart-chrome ms-webpart-chrome-vertical ms-webpart-chrome-fullWidth ">
			<div class="ms-WPBody noindex " id="WebPartWPQ9" allowdelete="false" width="100%" haspers="false" webpartid="20ec5c7d-c5cc-4abc-b86b-18a6aaf36e66"><div class="ms-rtestate-field"><div class="quickNavContainer">
<ul>
<li class="darkli" id="termStoreli13"><a id="termStoreName13" href="/sites/CompanyNameConnect/Pages/HCPHome.aspx">Marketing Commitment - CTX</a></li>
<li class="lightli" id="termStoreli14"><a id="termStoreName14" href="/sites/CompanyNameConnect/Pages/HCPHome.aspx">Publicity</a></li>
<li class="darkli" id="termStoreli15"><a id="termStoreName15" href="/sites/CompanyNameConnect/Pages/HCPHome.aspx">Research + Reference</a></li>
<li class="lightli" id="termStoreli16"><a id="termStoreName16" href="http://titlekey/" target="_blank">TitleKey</a></li>
<li class="darkli" id="termStoreli17"><a id="termStoreName17" href="http://appconnect/titlenet/" target="_blank">TitleNet</a></li>
<li class="lightli" id="termStoreli18"><a id="termStoreName18" href="/sites/CompanyNameConnect/Pages/HCPHome.aspx">Visitor Registration</a></li>
</ul>
</div></div><div class="ms-clear"></div></div>
		</div>
	</div>
</div>
</div>
<hr style="color: rgb(37, 84, 199);">
<div style="width: 100%; height: 20px; clear: both;"><hr style="color: rgb(37, 84, 199);"></div>
<div style="width: 313px; margin-right: 10px; float: left;">
<div class="ms-webpart-zone ms-fullWidth">
	<div class="s4-wpcell-plain ms-webpartzone-cell ms-webpart-cell-vertical ms-fullWidth " id="MSOZoneCell_WebPartWPQ11">
		<div class="ms-webpart-chrome ms-webpart-chrome-vertical ms-webpart-chrome-fullWidth ">
			<div class="ms-WPBody noindex " id="WebPartWPQ11" allowdelete="false" width="100%" haspers="false" webpartid="8381a406-a866-4b9f-b2cb-406a6a7ea4b3"><div class="cbq-layout-main" id="cbqwpctl00_ctl59_g_8381a406_a866_4b9f_b2cb_406a6a7ea4b3"><ul class="dfwp-column dfwp-list" style="width: 100%;"><li class="dfwp-item"><table style="width: 100%;"><tbody><tr><td style="text-align: center;"><div><h3 style="color: rgb(46, 108, 128);">Recent News</h3><hr></div></td></tr><tr><td style="height: 60px; text-align: left;" word-wrap="break-word"><div class="item"><strong>AVON ROMANCE INVITES READERS TO “SHARE YOUR BOOK” ONLINE</strong><br></div></td></tr></tbody></table></li><li class="dfwp-item"><table style="width: 100%;"><tbody><tr><td style="height: 60px; text-align: left;" word-wrap="break-word"><div class="item"><strong>CompanyNameCollins, MLBAM publish e-book on Hall of Famer Jackie Robinson</strong><br></div></td></tr></tbody></table></li><li class="dfwp-item"><table style="width: 100%;"><tbody><tr><td style="height: 60px; text-align: left;" word-wrap="break-word"><div class="item"><strong>Zondervan Title America the Beautiful Hits #1 on New York Times Bestseller List</strong><br></div></td></tr><tr><td style="top: 9px; text-align: center; position: relative;"><div><h3 style="color: rgb(46, 108, 128);"><a href="/sites/CompanyNameConnect/Press%20Releases/Forms/AllItems.aspx">SEE MORE</a></h3></div></td></tr></tbody></table></li></ul></div><div class="ms-clear"></div></div>
		</div><div class="ms-PartSpacingVertical"></div>
	</div><div class="s4-wpcell-plain ms-webpartzone-cell ms-webpart-cell-vertical ms-fullWidth " id="MSOZoneCell_WebPartWPQ6">
		<div class="ms-webpart-chrome ms-webpart-chrome-vertical ms-webpart-chrome-fullWidth ">
			<div class="ms-WPBody noindex " id="WebPartWPQ6" allowdelete="false" width="100%" haspers="false" webpartid="9ef1e2c2-801d-45f0-b4c5-059f761ae3de"><div class="ms-rtestate-field">​​​​<img style="width: 310px; height: 260px;" alt="" src="/sites/CompanyNameConnectDev/PublishingImages/DiscountoftheWeek.JPG">​<br>​<br></div><div class="ms-clear"></div></div>
		</div>
	</div>
</div>
</div>
<div style="width: 313px; margin-right: 10px; float: left;">
<div class="ms-webpart-zone ms-fullWidth">
	<div class="s4-wpcell-plain ms-webpartzone-cell ms-webpart-cell-vertical ms-fullWidth " id="MSOZoneCell_WebPartWPQ2">
		<div class="ms-webpart-chrome ms-webpart-chrome-vertical ms-webpart-chrome-fullWidth ">
			<div class="ms-WPBody noindex " id="WebPartWPQ2" allowdelete="false" width="100%" haspers="false" webpartid="2cf7962f-58d8-4e42-9aff-c17713592c6f"><div class="cbq-layout-main" id="cbqwpctl00_ctl59_g_1b0d1b69_538e_4c27_ba80_3bdae4e38bb2"><ul class="dfwp-column dfwp-list" style="width: 100%;"><li class="dfwp-item"><table style="width: 100%;"><tbody><tr><td style="text-align: center;"><div><h3 style="color: rgb(46, 108, 128);">Recent Memos</h3><hr></div></td></tr><tr><td style="height: 60px; text-align: left; vertical-align: top;" word-wrap="break-word"><div class="item"><strong>195 Broadway Facilities Reminders</strong><br>Housekeeping Memo about 195 Broadway</div></td></tr></tbody></table></li><li class="dfwp-item"><table style="width: 100%;"><tbody><tr><td style="height: 60px; text-align: left; vertical-align: top;" word-wrap="break-word"><div class="item"><strong>Blue Memo from Larry Nevins</strong><br>Test Descrition for web parts</div></td></tr></tbody></table></li><li class="dfwp-item"><table style="width: 100%;"><tbody><tr><td style="height: 60px; text-align: left; vertical-align: top;" word-wrap="break-word"><div class="item"><strong>New IT Security Measures</strong><br></div></td></tr><tr><td style="text-align: center;"><div class="item"><h3 style="color: rgb(46, 108, 128);"><a href="/sites/CompanyNameConnect/Memos/Forms/AllItems.aspx">SEE MORE</a></h3></div></td></tr></tbody></table></li></ul></div><div class="ms-clear"></div></div>
		</div><div class="ms-PartSpacingVertical"></div>
	</div><div class="s4-wpcell-plain ms-webpartzone-cell ms-webpart-cell-vertical ms-fullWidth " id="MSOZoneCell_WebPartWPQ4">
		<div class="ms-webpart-chrome ms-webpart-chrome-vertical ms-webpart-chrome-fullWidth ">
			<div class="ms-WPBody noindex " id="WebPartWPQ4" allowdelete="false" width="100%" haspers="false" webpartid="8de78faa-2e9b-4e90-a32f-520803d260e7"><div class="cbq-layout-main" id="cbqwpctl00_ctl59_g_8de78faa_2e9b_4e90_a32f_520803d260e7"><ul class="dfwp-column dfwp-list" style="width: 100%;"><li class="dfwp-item"><table border="0"><tbody><tr><td style="height: 50px; vertical-align: text-top;" word-wrap="break-word"><div class="ExternalClass3E9DB8B71C04486EB604F22655554EFF"><p style="color: rgb(103, 103, 103); line-height: normal;">
      <strong>​Perks at Work</strong></p><p style="color: rgb(103, 103, 103); line-height: normal;">
      <img style="margin: 0px 0px 0px 5px; width: 151px; height: 40px;" alt="" src="/sites/CompanyNameConnectDEV/PublishingImages/Lists/Discount%20of%20the%20Week/AllItems/PerksatWork.JPG">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br>Sign up for Perks at Work, which allows employees to take advantage of substantial savings from our strategic vendors. These exclusive discounts are usually unique and not found through the normal discount channels.</p><div style="color: rgb(103, 103, 103); background-color: rgb(255, 255, 255);">
      <div style="height: 20px; color: rgb(103, 103, 103); background-color: rgb(255, 255, 255);">
         <a style="color: rgb(54, 160, 227);" href="https://www.perksatwork.com/login">Click here&nbsp;</a>to sign up and learn more.</div></div></div></td></tr><tr><td style="text-align: center;"><div class="item">
				​​​​​​​​​​<a href="http://CompanyNameconnect/HR/discounts/Pages/default.aspx"><img alt="" src="/sites/CompanyNameConnect/PublishingImages/LearnMore.JPG"></a>​
							</div></td></tr></tbody></table></li></ul></div><div class="ms-clear"></div></div>
		</div>
	</div>
</div>
</div>
<div style="width: 313px; float: right;">
<div class="ms-webpart-zone ms-fullWidth">
	<div class="s4-wpcell-plain ms-webpartzone-cell ms-webpart-cell-vertical ms-fullWidth " id="MSOZoneCell_WebPartWPQ3">
		<div class="ms-webpart-chrome ms-webpart-chrome-vertical ms-webpart-chrome-fullWidth ">
			<div class="ms-WPBody noindex " id="WebPartWPQ3" allowdelete="false" width="100%" haspers="false" webpartid="5af0ec04-95a3-4ba1-ac42-c0b8a918c40e"><div class="ms-rtestate-field"><style>
.clockContainer
 {
   width: 316px;
   /*height: 315px;*/
   margin: 0 auto;
 }
 
#localClock
{
	display: block;
	margin: 0 auto;
	background: #0c7ff4;
	border: 0px;                
}

#worldClock
{
	display: block;
	margin: 0 auto;
	background: #f6f6f8;
	border: 0px;                
}
</style>

<script src="https://CompanyNamecollins.sharepoint.com/sites/CompanyNameConnectdev/_catalogs/masterpage/HCP/js/moment.js"></script> 
<script src="https://CompanyNamecollins.sharepoint.com/sites/CompanyNameConnectdev/_catalogs/masterpage/HCP/js/moment-timezone-with-data.js"></script> 
<script type="text/javascript">
                var context;
                var d;
                var str;
				var i = 0;
				var firstLine = 33;
				var timespacing = 44;
                function getClock()
                {
                    //Get the Context 2D or 3D
                    context = localClock.getContext("2d");
                    context.clearRect(0, 0, 313, 70);
                    context.font = "26px Roboto";
                    context.fillStyle = "#ffffff";
					context.textAlign = "center";
                    context.fillText(moment().format('LTS'), 156, 26);
					
					if(i == 0 || moment().get('second') == 0){
					context = worldClock.getContext("2d");
                    context.clearRect(0, 0, 313, 230);
                    context.font = "22px Roboto";
                    context.fillStyle = "#989da1";
					context.textAlign = "center";
                    context.fillText("London - " + moment().tz("Europe/London").format('LT'), 156, firstLine);
                    context.fillText("New York - " + moment().tz("America/New_York").format('LT'), 156, timespacing + firstLine);
                    context.fillText("San Francisco - " + moment().tz("America/Los_Angeles").format('LT'), 156, timespacing * 2 + firstLine);
					context.fillText("Sydney - " + moment().tz("Australia/Sydney").format('LT'), 156, timespacing * 3 + firstLine);
                    context.fillText("Delhi - " + moment().tz("Asia/Kolkata").format('LT'), 156, timespacing * 4 + firstLine);
					i++;
					}
                }

                $(document).ready(function () {   
                setInterval(getClock, 1000);
				})
</script>
<div class="clockContainer" style="float: right;">
<canvas width="313" height="35" id="localClock"></canvas>
<canvas width="313" height="230" id="worldClock"></canvas>

</div></div><div class="ms-clear"></div></div>
		</div><div class="ms-PartSpacingVertical"></div>
	</div><div class="s4-wpcell-plain ms-webpartzone-cell ms-webpart-cell-vertical ms-fullWidth " id="MSOZoneCell_WebPartWPQ5">
		<div class="ms-webpart-chrome ms-webpart-chrome-vertical ms-webpart-chrome-fullWidth ">
			<div class="ms-WPBody noindex " id="WebPartWPQ5" allowdelete="false" width="100%" haspers="false" webpartid="c6ccdcca-2c4b-4cbc-810d-f7901ae2bc84"><div class="ms-rtestate-field"><a href="http://radining.compass-usa.com/FranklinSqCafe/Pages/Home.aspx"><img style="width: 310px; height: 120px;" alt="" src="/sites/CompanyNameConnectDev/PublishingImages/FranklinSquareCafe_Logo_web.jpg"></a>​​<br>​​​​​​​​​​<br>​​​​​​​​​​<a href="http://new.newscorp.com/"><img style="width: 310px; height: 120px;" alt="" src="/sites/CompanyNameConnectDev/PublishingImages/News%20Portal_Button%20for%20CompanyNameCollins.png"></a>​​​​<br>​<br>​<br>​<br></div><div class="ms-clear"></div></div>
		</div>
	</div>
</div>
</div>
<div style="width: 100%; height: 20px; clear: both;"><hr style="color: rgb(37, 84, 199);"></div>
<div id="hidZone" style="display: none;"><menu class="ms-hide" id="MSOMenu_WebPartMenu">
	<ie:menuitem title="Collapse this web part." id="MSOMenu_Minimize" type="option" text="Minimize" onmenuclick="javascript:MSOLayout_MinimizeRestore(MenuWebPart)">

	</ie:menuitem><ie:menuitem title="Expand this web part." id="MSOMenu_Restore" type="option" text="Restore" onmenuclick="javascript:MSOLayout_MinimizeRestore(MenuWebPart)">

	</ie:menuitem><ie:menuitem title="Close this Web Part. You can still find it under closed Web Parts section in the insert ribbon. These changes will apply to all users." id="MSOMenu_Close" type="option" text="Close" onmenuclick="javascript:MSOLayout_RemoveWebPart(MenuWebPart)">

	</ie:menuitem><ie:menuitem title="Delete this Web Part from the page. These changes will apply to all users." id="MSOMenu_Delete" type="option" text="Delete" onmenuclick="if(confirm('You are about to permanently delete this Web Part. Are you sure you want to do this?')) {MSOWebPartPage_partDeleted = MenuWebPartID;MSOWebPartPage_MenuDoPostBack('ctl00$ctl59', MenuWebPartID + ';MSOMenu_Delete');}" iconsrc="/_layouts/15/images/DelItem.gif">

	</ie:menuitem><ie:menuitem type="separator"></ie:menuitem><ie:menuitem title="Change properties of this shared Web Part. These changes will apply to all users." id="MSOMenu_Edit" type="option" text="Edit Web Part" onmenuclick="javascript:MSOTlPn_ShowToolPane2Wrapper('Edit', 16, MenuWebPartID)" iconsrc="/_layouts/15/images/EditItem.gif">

	</ie:menuitem><ie:menuitem title="Show connections options for this Web Part. These changes will apply to all users." id="MSOMenu_Connections" type="option" text="Connections" onmenuclick="">

	</ie:menuitem><ie:menuitem type="separator"></ie:menuitem><ie:menuitem title="Export this Web Part. These changes will apply to all users." id="MSOMenu_Export" type="option" text="Export..." onmenuclick="javascript:MSOWebPartPage_ExportCheckWarning('\u002fsites\u002fCompanyNameConnectDEV\u002f_vti_bin\u002fexportwp.aspx?pageurl=https\u00253A\u00252F\u00252FCompanyNamecollins\u00252Esharepoint\u00252Ecom\u00252Fsites\u00252FCompanyNameConnectDEV\u00252FPages\u00252FHCPHome\u00252Easpx\u0026guidstring='+ escape(MenuWebPartID), MenuWebPart.getAttribute('HasPers') == 'true')">

	</ie:menuitem><ie:menuitem id="MSOMenu_Help" style="display: none;" type="option" text="Help" onmenuclick="MSOWebPartPage_SetNewWindowLocation(MenuWebPart.getAttribute('helpLink'), MenuWebPart.getAttribute('helpMode'))" iconsrc="/_layouts/15/images/HelpIcon.gif">

	</ie:menuitem>
</menu></div>
                                
                            </div><!-- ===== Close contentBox ==== -->
                            <div style="clear: both;">
                            <div class="customFooterContainer">
                                <div class="customFooterLeft">
                                    <img src="https://CompanyNamecollins.sharepoint.com/sites/CompanyNameConnect/_catalogs/masterpage/HCP/footerlogo.jpg">
                                    <div class="ms-dialogHidden">
                                        © Copyright 2016 CompanyNameCollins Publishers.  All rights reserved. <br>
                                        Privacy Policy: Terms of Use.
                                    </div>
                                </div> <!-- ===== End customFooterLeft DIV ===== -->
                                
                                <div class="customFooterRight">
                                    <div class="ms-dialogHidden">
                                    <!--HC CONSUMERS
                                        &nbsp;<br/>
                                        &nbsp;<br/>-->
                                        <a href="http://www.yahoo.com">CompanyNameCollins US</a><br>
                                        <a href="http://www.yahoo.com">CompanyNameCollins Canada</a><br> 
                                        <a href="http://www.yahoo.com">CompanyNameCollins Cristian Publishing</a><br>
                                        <a href="http://www.yahoo.com">CompanyNameCollins Australia</a><br>
                                        <a href="http://www.yahoo.com">CompanyNameCollins India</a><br>
                                        <a href="http://www.yahoo.com">CompanyNameCollins UK</a><br>
                                        <a href="http://www.harlequin.com/" target="_blank">Harlequin</a><br>
                                        &nbsp;<br>												</div>
                                </div> <!-- ===== End customFooterRight DIV ===== -->
                                
                            </div> <!-- ===== End customFooterContainer DIV ===== -->
                        
        
                        </div> <!-- ===== End customContent DIV ===== -->
        
                        
                        </div> <!-- ===== End customContent DIV ===== -->
                                        
                    </div> <!-- ===== End customWidth DIV ===== -->				
				
     		        </div><!-- ===== Close DeltaPlaceHolder ==== -->
			
		         </div><!-- ===== Close s4-bodyContainer ==== -->
                 
            </div><!-- ===== Close s4-workspace ==== -->
            
		<!-- ===== STARTER: Main Scrolling Body Ends Here ================================================================================= -->
			
			
<script type="text/javascript">

//--------------------------------------------------------------------------------------
//Declare variable to hold NAV DIV JSON Arrary
//--------------------------------------------------------------------------------------
  var HCP_JSON_NAV;

  
//--------------------------------------------------------------------------------------
 $(document).ready(function() { 	
 
    /*Check if we are rendering HCPHome and if so hide the title*/
	if (ObjectFound($("a[title^='HCPHome']")) ){
		$("a[title^='HCPHome']").hide();
	}
		
	/*Make Nav Text White*/
    $('.ms-core-listMenu-item').css('color', 'white');
	
	/*Make Nav Text Roboto*/
	$('.ms-core-listMenu-item').css('font-family', 'Roboto');
	
	/*Make Nav Text Normal*/
	$('.ms-core-listMenu-item').css('font-weight', 'normal');
	
	/*Make Nav Text 12px*/
	$('.ms-core-listMenu-item').css('font-size', '12px');
	
	//$('#.ms-core-listMenu-item').center();
		
	/*Hide Edit Link Control*/
	$('.ms-navedit-editSpan').hide();
	
    /*Hide Search input textbox*/
	$("input[title^='Search this site']").hide();
	
	/*Hide magnifier image*/
	$(".ms-srch-sb-navLink").hide();
	
	/*Attach hover handler to search magnifier*/
	$('.ms-srch-sb-searchImg').hover(function(){
		$("input[title^='Search this site']").show();
				
		$(".ms-srch-sb-navLink").show();
		}, function(){
		   var a =1;
	});

	/*Attach hover handler to search input textbox*/
	$("input[title^='Search this site']").hover(function(){
	   var a =1;
		}, function(){
		var searchContents="";
		searchContents = $("input[title^='Search this site']").val();
		
		if (searchContents.length==0) 
		{
			$("input[title^='Search this site']").hide();
			$(".ms-srch-sb-navLink").hide();			
		}		
	});
				
	//$('div[id$="TopNavigationMenu"]').attr("style", "float:right");
							
	//Create NAV Divs and Assign to Navigation Menu	
	HCP_AssignNavDiv();

	//Tweak Nav Position and Style
    $(".customNavLeftHolder").attr("style", "float:left;");
	
 	$('div[id$="TopNavigationMenu"]').attr('style','float:left !important;');
	$('div[id$="TopNavigationMenu"]').css('padding-top', '10px !important');
			
	$('#SearchBox').attr('style','padding-top:10px !important;float:right !important;');
	
	$('.ms-core-navigation').attr('style','font-family:Roboto !important; font-weight:normal;');
	
	
	//Put some padding before and after the menu links
	//$('.HCPmenu-container .HCPitem a').css('padding-left', '10px');
	//$('.HCPmenu-container .HCPitem a').css('padding-right', '10px');
	
	//HIde Sales Connect Empty Link Div
	$('.col_0.HCPsub-menu-item:last').hide();
	
	/*Hide the ribbon row*/
	// >>>>>> $("#s4-ribbonrow").hide();

	//Hide the Banner
	//$('.ms-core-pageTitle').hide();	
	//OR
	//$('#pageTitle').hide();
		
	});
  
  //--------------------------------------------------------------------------------------  
  //Make sure we found the object before we access it's properties
  function ObjectFound (obj)
  {
	if ($(obj).length)
	{
		return true;
	}  
	else
	{
		return false;
	}
  }
    
//---------------------------------------------------------------------------------		
  //Read JSON Div data and assign to variable (HCP_JSON_NAV)
  function HCP_AssignNavDiv() {
    //alert('Running HCP_AssignNavDiv');
	
 				$.getJSON( 'https://CompanyNamecollins.sharepoint.com/sites/CompanyNameConnectDEV/Documents/HCPNAVJSON.txt', function( data ) {		
//	$.getJSON( 'https://bashcomputing.sharepoint.com/sites/PublishingSandbox/Shared%20Documents/HCPNAVJSON.txt', function( data ) {		
		HCP_JSON_NAV = data;

		/*Change the NAV DIV Structure*/
		 $('div[id$="TopNavigationMenu"]').html(HCP_BuildDiv(data));	
				
		/*Move Search Control into NAV Bar*/	
		//$("#zz10_TopNavigationMenu").append($("#SearchBox"));		
		//$("#zz10_RootAspMenu").append($("#SearchBox"));		
		
		//$("#SearchBox").attr("style", "float:right");			
		$(".customNavHolder").css("height", "50px");  //Make room for the search control
		 $('div[id$="TopNavigationMenu"]').attr("style", "float:left");  //???
		//$("#zz10_RootAspMenu").attr("style", "float:left");
		
		//Replace Magnifier
		//  $(".ms-srch-sb > .ms-srch-sb-searchLink").css('background-image', 'url("https://CompanyNamecollins.sharepoint.com/sites/CompanyNameConnectDEV/_catalogs/masterpage/HCP/hcpBigSearch.png")');
			  	  
	  });  	
  }  
  
//--------------------------------------------------------------------------------------
function HCP_BuildDivLNG(MyJSON) {
  var howMany=MyJSON.NavData.length;
  var OutputResult="";
  var iPtr=0;
  var itemData;
  var iTopCount=0;
  var rowCountInCurrentColumnDiv=0;
  var columnCountInCurrentSubMenu=0;
  var styleAttrib="";
  var tgtAttribute="";

  var itemDivOpen=false;
  var subMenuDivOpen=false;
  var colDivOpen=false;
  var MAX_ROWS_PER_COLUMN=4;
  
  var MENU_CONTAINER_DIV_TAB="\t";
  var ITEM_DIV_TAB="\t\t";
  var TOP_ANCHOR_TAB="\t\t\t";
  var SUB_MENU_DIV_TAB="\t\t\t\t";
  var COLUMN_DIV_TAB="\t\t\t\t\t";
  var COL_ANCHOR_TAB="\t\t\t\t\t\t";
  
  var DQ="\"";
  var CRLF="\n\r";
  
  var COMMENT_CLOSE_COLUMN_DIV="<!-- Close Column Div -->";
  var COMMENT_CLOSE_SUBMENU_DIV="<!-- Close Sub Menu Div -->";
  var COMMENT_CLOSE_ITEM_DIV="<!-- Close Item Div -->";
  var COMMENT_CLOSE_MENU_CONTAINER_DIV="<!-- Close menu-container div -->";
  var COMMENT_CLOSE_CONTAINER_DIV="<!-- Close container div -->";
  
  var CLS_PREFIX="HCP";
  var CLS_CONTAINER="container";
  var CLS_MENU_CONTAINER=CLS_PREFIX + "menu-container";
  var CLS_ITEM=CLS_PREFIX + "item";
  var CLS_SUB_MENU=CLS_PREFIX + "sub-menu";
  var CLS_COL="col_";
  
  //alert('Running BuildDiv');
    
  OutputResult = "<div class=" + DQ + CLS_CONTAINER + DQ + ">" + CRLF;
  OutputResult += MENU_CONTAINER_DIV_TAB + "<div class=" + DQ + CLS_MENU_CONTAINER + DQ + ">" + CRLF;

  try {

	  for (iPtr=0; iPtr<howMany; iPtr++)
		{
		  itemData = MyJSON.NavData[iPtr];
		  tgtAttribute = itemData.target;
		  
		  if (itemData.TopLevel=="1")
			{
			   if (colDivOpen==true)
				{
				  OutputResult+=COLUMN_DIV_TAB + "</div>" + COMMENT_CLOSE_COLUMN_DIV + CRLF;
				  colDivOpen=false;
				}
			   if (subMenuDivOpen==true)
				{
				  OutputResult+=SUB_MENU_DIV_TAB + "</div>" + COMMENT_CLOSE_SUBMENU_DIV + CRLF;
				  subMenuDivOpen=false;
				}
			   if (itemDivOpen==true)
			   {
				   OutputResult+=ITEM_DIV_TAB + "</div>" + COMMENT_CLOSE_ITEM_DIV + CRLF;			   
			   }
			   
			   styleAttrib = " style=" + DQ + "float:left;padding:5px 25px 5px 5px;height:auto;width:auto;" + DQ;
			   iTopCount++;
			   OutputResult+=ITEM_DIV_TAB + "<div class=" + DQ + CLS_ITEM + DQ + ">" + CRLF;
			   itemDivOpen = true;
			   OutputResult+=TOP_ANCHOR_TAB + "<a href=" + DQ + itemData.url + DQ + ">" + itemData.display + "</a><br/><br/>" + CRLF;
			   OutputResult+=SUB_MENU_DIV_TAB + "<div class=" + DQ + CLS_SUB_MENU + DQ + ">" + CRLF;
			   OutputResult+=COLUMN_DIV_TAB + "<div class=" + DQ + CLS_COL + 0 + DQ + styleAttrib + ">" + CRLF;
			   itemDivOpen=true;
			   subMenuDivOpen=true;
			   colDivOpen=true;
			   rowCountInCurrentColumnDiv=0;
			   columnCountInCurrentSubMenu=0;		   
			}
			else
			{			
			   if (subMenuDivOpen==true && itemDivOpen==true)
				 {
					 if (rowCountInCurrentColumnDiv<MAX_ROWS_PER_COLUMN)
					 {
					   colDivOpen=true;
					   OutputResult+=COL_ANCHOR_TAB + "<a href=" + DQ + itemData.url + DQ + " target=" + DQ + tgtAttribute + DQ + ">" + itemData.display + "</a><br/><br/>" + CRLF;
					   rowCountInCurrentColumnDiv++;
					 }
					 else
					 {					 
					   OutputResult+=COLUMN_DIV_TAB + "</div>" + COMMENT_CLOSE_COLUMN_DIV + CRLF;
					   rowCountInCurrentColumnDiv=0;      
					   columnCountInCurrentSubMenu++;				   
					   OutputResult+=COLUMN_DIV_TAB + "<div class=" + DQ + CLS_COL + columnCountInCurrentSubMenu + DQ + styleAttrib + ">" + CRLF;
					   OutputResult+=COL_ANCHOR_TAB + "<a href=" + DQ + itemData.url + DQ + " target=" + DQ + tgtAttribute + DQ + ">" + itemData.display + "</a><br/><br/>" + CRLF;
					   rowCountInCurrentColumnDiv++;
					 }					 
				 }
			}				
		}

	   if (subMenuDivOpen==true && itemDivOpen==true)
		 {
			OutputResult+=COLUMN_DIV_TAB + "</div>" + COMMENT_CLOSE_COLUMN_DIV + CRLF;
			OutputResult+=SUB_MENU_DIV_TAB + "</div>" + COMMENT_CLOSE_SUBMENU_DIV + CRLF;
			OutputResult+=ITEM_DIV_TAB + "</div>" + COMMENT_CLOSE_ITEM_DIV + CRLF;
		 }		
		OutputResult+=MENU_CONTAINER_DIV_TAB + "</div>" + COMMENT_CLOSE_MENU_CONTAINER_DIV + CRLF;
		OutputResult+="</div>" + COMMENT_CLOSE_CONTAINER_DIV + CRLF;
		 
		return (OutputResult);
  }
	
  catch (err) {
    alert (err.message);
  }		
}


//--------------------------------------------------------------------------------------
function HCP_BuildDiv(MyJSON) {
  var howMany=MyJSON.NavData.length;
  var OutputResult="";
  var iPtr=0;
  var itemData;
  var iTopCount=0;
  var rowCountInCurrentColumnDiv=0;
  var columnCountInCurrentSubMenu=0;
  var styleAttrib="";
  var tgtAttribute="";

  var itemDivOpen=false;
  var subMenuDivOpen=false;
  var colDivOpen=false;
  var MAX_ROWS_PER_COLUMN=4;
  
  var MENU_CONTAINER_DIV_TAB="\t";
  var ITEM_DIV_TAB="\t\t";
  var TOP_ANCHOR_TAB="\t\t\t";
  var SUB_MENU_DIV_TAB="\t\t\t\t";
  var COLUMN_DIV_TAB="\t\t\t\t\t";
  var COL_ANCHOR_TAB="\t\t\t\t\t\t";
  
  var DQ="\"";
  var CRLF="\n\r";
  
  var COMMENT_CLOSE_COLUMN_DIV="<!-- Close Column Div -->";
  var COMMENT_CLOSE_SUBMENU_DIV="<!-- Close Sub Menu Div -->";
  var COMMENT_CLOSE_ITEM_DIV="<!-- Close Item Div -->";
  var COMMENT_CLOSE_MENU_CONTAINER_DIV="<!-- Close menu-container div -->";
  var COMMENT_CLOSE_CONTAINER_DIV="<!-- Close container div -->";
  
  var CLS_PREFIX="HCP";
  var CLS_CONTAINER="container";
  var CLS_MENU_CONTAINER=CLS_PREFIX + "menu-container";
  var CLS_ITEM=CLS_PREFIX + "item";
  var CLS_SUB_MENU=CLS_PREFIX + "sub-menu";
  var CLS_COL="col_";
  
  //alert('Running BuildDiv');
    
  OutputResult = "<div class=" + DQ + CLS_CONTAINER + DQ + ">" + CRLF;
  OutputResult += MENU_CONTAINER_DIV_TAB + "<div class=" + DQ + CLS_MENU_CONTAINER + DQ + ">" + CRLF;

  try {

	  for (iPtr=0; iPtr<howMany; iPtr++)
		{
		  itemData = MyJSON.NavData[iPtr];
		  tgtAttribute = itemData.target;
		  
		  if (itemData.TopLevel=="1")
			{
			   if (colDivOpen==true)
				{
				  OutputResult+=COLUMN_DIV_TAB + "</div>" + COMMENT_CLOSE_COLUMN_DIV + CRLF;
				  colDivOpen=false;
				}
			   if (subMenuDivOpen==true)
				{
				  OutputResult+=SUB_MENU_DIV_TAB + "</div>" + COMMENT_CLOSE_SUBMENU_DIV + CRLF;
				  subMenuDivOpen=false;
				}
			   if (itemDivOpen==true)
			   {
				   OutputResult+=ITEM_DIV_TAB + "</div>" + COMMENT_CLOSE_ITEM_DIV + CRLF;			   
			   }
			   
			   styleAttrib = ""; //" style=" + DQ + "float:left;padding:5px 25px 5px 5px;height:auto;width:auto;" + DQ;
			   iTopCount++;
			   OutputResult+=ITEM_DIV_TAB + "<div class=" + DQ + CLS_ITEM + DQ + ">" + CRLF;
			   itemDivOpen = true;
			   OutputResult+=TOP_ANCHOR_TAB + "<a href=" + DQ + itemData.url + DQ + ">" + itemData.display + "</a>" + CRLF;
			   OutputResult+=SUB_MENU_DIV_TAB + "<div class=" + DQ + CLS_SUB_MENU + DQ + ">" + CRLF;
			   			   
			   OutputResult+=COLUMN_DIV_TAB + "<div class=" + DQ + CLS_COL + 0 + " HCPsub-menu-item" + DQ + styleAttrib + ">" + CRLF;
			   colDivOpen=true;
				   
			   itemDivOpen=true;
			   subMenuDivOpen=true;
			   
			   rowCountInCurrentColumnDiv=0;
			   columnCountInCurrentSubMenu=0;		   
			}
			else
			{			
			   if (subMenuDivOpen==true && itemDivOpen==true)
				 {
					 if (rowCountInCurrentColumnDiv<MAX_ROWS_PER_COLUMN)
					 {
					   colDivOpen=true;
					   OutputResult+=COL_ANCHOR_TAB + "<a href=" + DQ + itemData.url + DQ + " target=" + DQ + tgtAttribute + DQ + ">" + itemData.display + "</a>" + CRLF;
					   rowCountInCurrentColumnDiv++;
					 }
					 else
					 {					 
					   OutputResult+=COLUMN_DIV_TAB + "</div>" + COMMENT_CLOSE_COLUMN_DIV + CRLF;
					   rowCountInCurrentColumnDiv=0;      
					   columnCountInCurrentSubMenu++;				   
					   OutputResult+=COLUMN_DIV_TAB + "<div class=" + DQ + CLS_COL + columnCountInCurrentSubMenu + " HCPsub-menu-item" + DQ + styleAttrib + ">" + CRLF;
					   OutputResult+=COL_ANCHOR_TAB + "<a href=" + DQ + itemData.url + DQ + " target=" + DQ + tgtAttribute + DQ + ">" + itemData.display + "</a>" + CRLF;
					   rowCountInCurrentColumnDiv++;
					 }					 
				 }
			}				
		}

	   if (subMenuDivOpen==true && itemDivOpen==true)
		 {
			OutputResult+=COLUMN_DIV_TAB + "</div>" + COMMENT_CLOSE_COLUMN_DIV + CRLF;
			OutputResult+=SUB_MENU_DIV_TAB + "</div>" + COMMENT_CLOSE_SUBMENU_DIV + CRLF;
			OutputResult+=ITEM_DIV_TAB + "</div>" + COMMENT_CLOSE_ITEM_DIV + CRLF;
		 }		
		OutputResult+=MENU_CONTAINER_DIV_TAB + "</div>" + COMMENT_CLOSE_MENU_CONTAINER_DIV + CRLF;
		OutputResult+="</div>" + COMMENT_CLOSE_CONTAINER_DIV + CRLF;
		 
		return (OutputResult);
  }
	
  catch (err) {
    alert (err.message);
  }		
}
    
</script>	
			
									
			<!-- ===== STARTER: Needed for form stuff ========================================================================================= -->
			
				
			
		
			<!-- ===== STARTER: Hidden Placeholders =========================================================================================== -->	
			
				
		

<script type="text/javascript">
//<![CDATA[

var callBackFrameUrl='/WebResource.axd?d=KpJEzji_Kaim8KyYJEegeZU50NzAiuCWOfxXT9B3DUauudfsuZQ84UF-4jX2Zzzmd3THFAL6mYmzgxCSQikGpI5_c3ZNunFUsStDXPcsHjM1&t=635792775671809273';
WebForm_InitCallback();var _spFormDigestRefreshInterval = 1440000; IsSPSocialSwitchEnabled = function() { return true; };var _fV4UI = true;
function _RegisterWebPartPageCUI()
{
    var initInfo = {editable: true,isEditMode: false,allowWebPartAdder: false,listId: "{e49a0994-2cbd-493f-91a9-1399ce4d5fe9}",itemId: 17,recycleBinEnabled: true,enableMinorVersioning: true,enableModeration: false,forceCheckout: true,rootFolderUrl: "\u002fsites\u002fCompanyNameConnectDEV\u002fPages",itemPermissions:{High:2147483647,Low:4294967295}};
    SP.Ribbon.WebPartComponent.registerWithPageManager(initInfo);
    var wpcomp = SP.Ribbon.WebPartComponent.get_instance();
    var hid;
    hid = document.getElementById("_wpSelected");
    if (hid != null)
    {
        var wpid = hid.value;
        if (wpid.length > 0)
        {
            var zc = document.getElementById(wpid);
            if (zc != null)
                wpcomp.selectWebPart(zc, false);
        }
    }
    hid = document.getElementById("_wzSelected");
    if (hid != null)
    {
        var wzid = hid.value;
        if (wzid.length > 0)
        {
            wpcomp.selectWebPartZone(null, wzid);
        }
    }
};
function __RegisterWebPartPageCUI() {
ExecuteOrDelayUntilScriptLoaded(_RegisterWebPartPageCUI, "sp.ribbon.js");}
_spBodyOnLoadFunctionNames.push("__RegisterWebPartPageCUI");var __wpmExportWarning='This Web Part Page has been personalized. As a result, one or more Web Part properties may contain confidential information. Make sure the properties contain information that is safe for others to read. After exporting this Web Part, view properties in the Web Part description file (.WebPart) by using a text editor such as Microsoft Notepad.';var __wpmCloseProviderWarning='You are about to close this Web Part.  It is currently providing data to other Web Parts, and these connections will be deleted if this Web Part is closed.  To close this Web Part, click OK.  To keep this Web Part, click Cancel.';var __wpmDeleteWarning='You are about to permanently delete this Web Part.  Are you sure you want to do this?  To delete this Web Part, click OK.  To keep this Web Part, click Cancel.';function ctl00_ctl59_g_1b0d1b69_538e_4c27_ba80_3bdae4e38bb2_init() {
    EnsureScript('mediaplayer.js', 
        typeof(mediaPlayer) != 'undefined' ? typeof(mediaPlayer.attachToMediaLinks) : 'undefined');
    ExecuteOrDelayUntilScriptLoaded(
        function() {
            if (Silverlight.isInstalled('2.0')) {
                mediaPlayer.createOverlayPlayer();
                mediaPlayer.attachToMediaLinks(document.getElementById('cbqwpctl00_ctl59_g_1b0d1b69_538e_4c27_ba80_3bdae4e38bb2'), ["wmv","wma","avi","mpg","mp3","mp4","asf","ogg","ogv","oga","webm"],'');
            }
        }, 'mediaplayer.js');
}
if (_spBodyOnLoadFunctionNames != null) { _spBodyOnLoadFunctionNames.push('ctl00_ctl59_g_1b0d1b69_538e_4c27_ba80_3bdae4e38bb2_init'); }
function ctl00_ctl59_g_8de78faa_2e9b_4e90_a32f_520803d260e7_init() {
    EnsureScript('mediaplayer.js', 
        typeof(mediaPlayer) != 'undefined' ? typeof(mediaPlayer.attachToMediaLinks) : 'undefined');
    ExecuteOrDelayUntilScriptLoaded(
        function() {
            if (Silverlight.isInstalled('2.0')) {
                mediaPlayer.createOverlayPlayer();
                mediaPlayer.attachToMediaLinks(document.getElementById('cbqwpctl00_ctl59_g_8de78faa_2e9b_4e90_a32f_520803d260e7'), ["wmv","wma","avi","mpg","mp3","mp4","asf","ogg","ogv","oga","webm"],'');
            }
        }, 'mediaplayer.js');
}
if (_spBodyOnLoadFunctionNames != null) { _spBodyOnLoadFunctionNames.push('ctl00_ctl59_g_8de78faa_2e9b_4e90_a32f_520803d260e7_init'); }
function ctl00_ctl59_g_8381a406_a866_4b9f_b2cb_406a6a7ea4b3_init() {
    EnsureScript('mediaplayer.js', 
        typeof(mediaPlayer) != 'undefined' ? typeof(mediaPlayer.attachToMediaLinks) : 'undefined');
    ExecuteOrDelayUntilScriptLoaded(
        function() {
            if (Silverlight.isInstalled('2.0')) {
                mediaPlayer.createOverlayPlayer();
                mediaPlayer.attachToMediaLinks(document.getElementById('cbqwpctl00_ctl59_g_8381a406_a866_4b9f_b2cb_406a6a7ea4b3'), ["wmv","wma","avi","mpg","mp3","mp4","asf","ogg","ogv","oga","webm"],'');
            }
        }, 'mediaplayer.js');
}
if (_spBodyOnLoadFunctionNames != null) { _spBodyOnLoadFunctionNames.push('ctl00_ctl59_g_8381a406_a866_4b9f_b2cb_406a6a7ea4b3_init'); }
g_SpoSuiteNavSettings = { 'FallbackCss': '\x2f_layouts\x2f15\x2f1033\x2fshell\x2fshell15.css\x3frev\x3duC\x252Byq6DahOWA0gYO8qDACg\x253D\x253DTAG252', 'FallbackJsKey': 'shell\x2fshell15.js' };
RenderSuiteLinksFromShellData('suiteBarTop', 2);

ExecuteOrDelayUntilScriptLoaded(
function()
{
var initInfo = 
{
itemPermMasks: {High:2147483647,Low:4294967295},
listPermMasks: {High:2147483647,Low:4294967295},
listId: "e49a0994-2cbd-493f-91a9-1399ce4d5fe9",
itemId: 17,
workflowsAssociated: false,
editable: true,
doNotShowProperties: false,
enableVersioning: true
};
SP.Ribbon.DocLibAspxPageComponent.registerWithPageManager(initInfo);
},
"sp.ribbon.js");
var g_disableCheckoutInEditMode = false;
var _spWebPermMasks = {High:2147483647,Low:4294967295};var _spPageStateActionControlId='ctl00_ctl60_PageStateActionButton';function _cUpdx63829de2201a4365a3904788f682d0a3(){var myd = null; if (typeof(datax63829de2201a4365a3904788f682d0a3) != 'undefined') {myd = datax63829de2201a4365a3904788f682d0a3;} var myc = document.getElementById('ctl00_x63829de2201a4365a3904788f682d0a3');_cUpdcx63829de2201a4365a3904788f682d0a3(myd, myc);}function _cUpdcx63829de2201a4365a3904788f682d0a3(data, ctrl){SiteLogoImagePageUpdate(ctrl, data);}g_spPreFetchKeys.push('sp.core.js');var PageState = {};var PageStateEnabledHandler = {};var PageStateCommandHandler = {};PageState ={'ItemIsDefaultPage':'1','ItemIsInLibrary':'1','UserHasManageWebRights':'1','ItemHasCustomizableZones':'1','UserHasEnumeratePermissionsRights':'1','ItemIsMinorVersion':'1','UserHasOverrideCheckoutRights':'1','UserHasViewVersionsRights':'1','DocLibMinorVersionsEnabled':'1','ItemHasCheckedInVersion':'1','UserHasApproverRights':'1','ItemIsPublishingPage':'1','WebIsPublishingSite':'1','UserHasDeleteRights':'1','DocLibVersioningEnabled':'1','ItemIsInSharedView':'1','DocLibCheckoutRequired':'1','ItemHasPersonalizableZones':'1','UserHasContributorRights':'1'};PageStateEnabledHandler = {'PageStateGroupSave':'SP.Ribbon.PageState.Handlers.isSaveEnabled\u0028\u0029;','PageStateSaveBeforeNavigate':'','PageStateGroupSaveAndStop':'SP.Ribbon.PageState.Handlers.isSaveAndStopEditEnabled\u0028\u0029;','PageStateGroupEdit':'SP.Ribbon.PageState.Handlers.isEditEnabled\u0028\u0029;','PageStateGroupDontSaveAndStop':'SP.Ribbon.PageState.Handlers.isDontSaveAndStopEnabled\u0028\u0029;','PageStateGroupCheckin':'SP.Ribbon.PageState.Handlers.isCheckinEnabled\u0028\u0029;','PageStateGroupCheckout':'SP.Ribbon.PageState.Handlers.isCheckoutEnabled\u0028\u0029;','PageStateGroupOverrideCheckout':'SP.Ribbon.PageState.Handlers.isOverrideCheckoutEnabled\u0028\u0029;','PageStateGroupDiscardCheckout':'SP.Ribbon.PageState.Handlers.isDiscardCheckoutEnabled\u0028\u0029;','PageStateGroupSubmitForApproval':'SP.Ribbon.PageState.Handlers.isSubmitForApprovalEnabled\u0028\u0029;','PageStateGroupCancelApproval':'SP.Ribbon.PageState.Handlers.isCancelApprovalEnabled\u0028\u0029;','PageStateGroupPublish':'SP.Ribbon.PageState.Handlers.isPublishEnabled\u0028\u0029;','PageStateGroupUnpublish':'Pub.Ribbon.PubCommands.unpublishEnabled\u0028\u0029;','PageStateGroupApprove':'SP.Ribbon.PageState.Handlers.isApproveEnabled\u0028\u0029;','PageStateGroupReject':'SP.Ribbon.PageState.Handlers.isRejectEnabled\u0028\u0029;','DeletePage':'SP.Ribbon.PageState.Handlers.isDeleteEnabled\u0028\u0029;','PageStateUpdatePageState':'true;','PageStateGroupSaveAndPublish':'SP.Ribbon.PageState.Handlers.isSaveAndPublishEnabled\u0028\u0029;'};PageStateCommandHandler = {'PageStateGroupSave':'SP.SOD.executeFunc\u0028\u0027sp.ui.pub.ribbon.js\u0027, \u0027Pub.Ribbon.PubCommands\u0027, function\u0028\u0029 {Pub.Ribbon.PubCommands.notifyProgress\u0028SP.Publishing.Resources.notificationMessageSaving\u0029;__doPostBack\u0028\u0027ctl02\u0027,\u0027PageStateGroupSave\u0027\u0029}\u0029;','PageStateSaveBeforeNavigate':'__theFormPostData = \u0022\u0022;__theFormPostCollection=new Array\u0028\u0029; WebForm_OnSubmit\u0028\u0029;WebForm_InitCallback\u0028\u0029;_spResetFormOnSubmitCalledFlag\u0028\u0029;WebForm_DoCallback\u0028\u0027ctl03\u0027,\u0027PageStateSaveBeforeNavigate\u0027,SP.Ribbon.PageState.PageStateHandler.SaveBeforeNavigateCallback,SP.Ribbon.PageState.SaveBeforeNavigateCallback,null,true\u0029','PageStateGroupSaveAndStop':'SP.SOD.executeFunc\u0028\u0027sp.ui.pub.ribbon.js\u0027, \u0027Pub.Ribbon.PubCommands\u0027, function\u0028\u0029 {Pub.Ribbon.PubCommands.notifyProgress\u0028SP.Publishing.Resources.notificationMessageSaving\u0029;__doPostBack\u0028\u0027ctl04\u0027,\u0027PageStateGroupSaveAndStop\u0027\u0029}\u0029;','PageStateGroupEdit':'SP.SOD.executeFunc\u0028\u0027sp.ui.pub.ribbon.js\u0027, \u0027Pub.Ribbon.PubCommands\u0027, function\u0028\u0029 {Pub.Ribbon.PubCommands.notifyProgress\u0028SP.Publishing.Resources.notificationMessageLoading\u0029;if \u0028document.forms[\u0027aspnetForm\u0027][\u0027MSOLayout_InDesignMode\u0027] != null\u0029 document.forms[\u0027aspnetForm\u0027][\u0027MSOLayout_InDesignMode\u0027].value = 1;if \u0028document.forms[\u0027aspnetForm\u0027][\u0027MSOAuthoringConsole_FormContext\u0027] != null\u0029 document.forms[\u0027aspnetForm\u0027][\u0027MSOAuthoringConsole_FormContext\u0027].value = 1;if \u0028document.forms[\u0027aspnetForm\u0027][\u0027MSOSPWebPartManager_DisplayModeName\u0027] != null\u0029 document.forms[\u0027aspnetForm\u0027][\u0027MSOSPWebPartManager_DisplayModeName\u0027].value = \u0027Design\u0027;__doPostBack\u0028\u0027ctl05\u0027,\u0027edit\u0027\u0029}\u0029;','PageStateGroupDontSaveAndStop':'SP.SOD.executeFunc\u0028\u0027sp.ui.pub.ribbon.js\u0027, \u0027Pub.Ribbon.PubCommands\u0027, function\u0028\u0029 {Pub.Ribbon.PubCommands.notifyProgress\u0028SP.Publishing.Resources.notificationMessageReverting\u0029;__doPostBack\u0028\u0027ctl06\u0027,\u0027PageStateGroupDontSaveAndStop\u0027\u0029}\u0029;','PageStateGroupCheckin':'__doPostBack\u0028\u0027ctl07\u0027,\u0027PageStateGroupCheckin\u0027\u0029','PageStateGroupCheckout':'__doPostBack\u0028\u0027ctl08\u0027,\u0027PageStateGroupCheckout\u0027\u0029','PageStateGroupOverrideCheckout':'__doPostBack\u0028\u0027ctl09\u0027,\u0027PageStateGroupOverrideCheckout\u0027\u0029','PageStateGroupDiscardCheckout':'if \u0028confirm\u0028\u0027Are you sure you want to exit without saving? Any unsaved data will be lost.\u0027\u0029\u0029 {__doPostBack\u0028\u0027ctl10\u0027,\u0027PageStateGroupDiscardCheckout\u0027\u0029}','PageStateGroupSubmitForApproval':'__doPostBack\u0028\u0027ctl11\u0027,\u0027PageStateGroupSubmitForApproval\u0027\u0029','PageStateGroupCancelApproval':'WebForm_DoCallback\u0028\u0027ctl12\u0027,\u0027PageStateGroupCancelApproval\u0027,SP.Ribbon.PageState.Handlers.GenericCompleteHandler,SP.Ribbon.PageState.Handlers.GenericError,null,true\u0029','PageStateGroupPublish':'__doPostBack\u0028\u0027ctl13\u0027,\u0027PageStateGroupPublish\u0027\u0029','PageStateGroupUnpublish':'__doPostBack\u0028\u0027ctl14\u0027,\u0027PageStateGroupUnpublish\u0027\u0029','PageStateGroupApprove':'__doPostBack\u0028\u0027ctl15\u0027,\u0027PageStateGroupApprove\u0027\u0029','PageStateGroupReject':'SP.Ribbon.PageState.PageStateHandler.popupWaitScreen\u0028\u0027Page State\u0027,\u0027Rejecting page\u0027\u0029;__theFormPostData = \u0022\u0022;__theFormPostCollection=new Array\u0028\u0029; WebForm_OnSubmit\u0028\u0029;WebForm_InitCallback\u0028\u0029;_spResetFormOnSubmitCalledFlag\u0028\u0029;WebForm_DoCallback\u0028\u0027ctl16\u0027,\u0027PageStateGroupReject\u0027,SP.Ribbon.PageState.Handlers.GenericCompleteHandler,SP.Ribbon.PageState.Handlers.GenericError,null,true\u0029','DeletePage':'if \u0028confirm\u0028\u0027Are you sure you want to send this page to the site Recycle Bin?\u0027\u0029\u0029 {__doPostBack\u0028\u0027ctl17\u0027,\u0027DeletePage\u0027\u0029}','PageStateUpdatePageState':'SP.Ribbon.PageState.PageStateHandler.popupWaitScreen\u0028\u0027Schedule\u0027,\u0027Scheduling the page.\u0027\u0029;__theFormPostData = \u0022\u0022;__theFormPostCollection=new Array\u0028\u0029; WebForm_OnSubmit\u0028\u0029;WebForm_InitCallback\u0028\u0029;_spResetFormOnSubmitCalledFlag\u0028\u0029;WebForm_DoCallback\u0028\u0027ctl18\u0027,\u0027PageStateUpdatePageState\u0027,SP.Ribbon.PageState.Handlers.GenericCompleteHandler,SP.Ribbon.PageState.Handlers.GenericError,null,true\u0029','PageStateGroupSaveAndPublish':'if \u0028PageState[\u0027ViewModeIsEdit\u0027] != null\u0029 {SP.Ribbon.PageState.PageStateHandler.ignoreNextUnload = true;__doPostBack\u0028\u0027ctl19\u0027,\u0027PageStateGroupSaveAndPublish\u0027\u0029}else{SP.Ribbon.PageState.PageStateHandler.popupWaitScreen\u0028\u0027Page State\u0027,\u0027Publishing page\u0027\u0029;__theFormPostData = \u0022\u0022;__theFormPostCollection=new Array\u0028\u0029; WebForm_OnSubmit\u0028\u0029;WebForm_InitCallback\u0028\u0029;_spResetFormOnSubmitCalledFlag\u0028\u0029;WebForm_DoCallback\u0028\u0027ctl19\u0027,\u0027PageStateGroupSaveAndPublish\u0027,SP.Ribbon.PageState.Handlers.GenericCompleteHandler,SP.Ribbon.PageState.Handlers.GenericErrorHandler,null,true\u0029}'};var Notification = {};var PageErrorState = {};PageErrorState = { 'Message': '', 'Title' : '', 'ButtonCount' :0};
function InitPageStateHandler()
{
    SP.Ribbon.PageState.ImportedNativeData = function SP_Ribbon_PageStateHandler_ImportedNativeData()
    {
    }
    SP.Ribbon.PageState.NativeErrorState = function SP_Ribbon_PageStateHandler_NativeErrorState()
    {
    }
    SP.Ribbon.PageState.ImportedNativeData.PageState = PageState;
    SP.Ribbon.PageState.ImportedNativeData.CommandHandlers = PageStateCommandHandler;
    SP.Ribbon.PageState.ImportedNativeData.EnabledHandlers = PageStateEnabledHandler;
    SP.Ribbon.PageState.NativeErrorState = PageErrorState;SP.Ribbon.PageState.ImportedNativeData.StatusTitle = ['Recent draft not published'];SP.Ribbon.PageState.ImportedNativeData.StatusBody = ['Visitors can\u0026#39;t see recent changes. \u003ca href=\u0022javascript:{}\u0022 onclick=\u0022var mgr = SP.Ribbon.PageManager.get_instance\u0028\u0029; if\u0028mgr \u0026\u0026 \u0028mgr.get_commandDispatcher\u0028\u0029\u0029.isCommandEnabled\u0028\u0027PageStateGroupPublish\u0027\u0029\u0029 \u0028mgr.get_commandDispatcher\u0028\u0029\u0029.executeCommand\u0028\u0027PageStateGroupPublish\u0027, null\u0029; return CancelEvent\u0028event\u0029;\u0022 style=\u0022text-decoration: underline\u0022\u003ePublish this draft\u003c\u002fa\u003e.'];SP.Ribbon.PageState.ImportedNativeData.StatusPriority = 'yellow';
    SP.Ribbon.PageState.CallNativeFunction = function SP_Ribbon_PageState_PageStateHandler_CallNativeFunction(fnName)
    {
        return eval(fnName);
    }
    pm = SP.Ribbon.PageManager.get_instance();
    var psh = new SP.Ribbon.PageState.PageStateHandler();
    pm.addPageComponent(psh);
    SP.Ribbon.PageState.Handlers.registerCommentsHandler();
    pm.get_commandDispatcher().executeCommand(Commands.CommandIds.ApplicationStateChanged, null)
}
function DelayUntilRibbonLoaded()
{
    ExecuteOrDelayUntilScriptLoaded(InitPageStateHandler, "sp.ribbon.js");
}
_spBodyOnLoadFunctionNames.push("DelayUntilRibbonLoaded")

            ExecuteOrDelayUntilScriptLoaded(
                function() 
                {                    
                    Srch.ScriptApplicationManager.get_current().states = {"browserLanguage":1033,"webUILanguageName":"en-US","webDefaultLanguageName":"en-US","QueryDateTimeCulture":1033,"timeZoneOffsetInHours":-5,"contextUrl":"https://CompanyNamecollins.sharepoint.com/sites/CompanyNameConnectDEV","contextTitle":"CompanyNameConnect","supportedLanguages":[{"id":1025,"label":"Arabic"},{"id":1093,"label":"Bangla"},{"id":1026,"label":"Bulgarian"},{"id":1027,"label":"Catalan"},{"id":2052,"label":"Chinese (Simplified)"},{"id":1028,"label":"Chinese (Traditional)"},{"id":1050,"label":"Croatian"},{"id":1029,"label":"Czech"},{"id":1030,"label":"Danish"},{"id":1043,"label":"Dutch"},{"id":1033,"label":"English"},{"id":1035,"label":"Finnish"},{"id":1036,"label":"French"},{"id":1031,"label":"German"},{"id":1032,"label":"Greek"},{"id":1095,"label":"Gujarati"},{"id":1037,"label":"Hebrew"},{"id":1081,"label":"Hindi"},{"id":1038,"label":"Hungarian"},{"id":1039,"label":"Icelandic"},{"id":1057,"label":"Indonesian"},{"id":1040,"label":"Italian"},{"id":1041,"label":"Japanese"},{"id":1099,"label":"Kannada"},{"id":1042,"label":"Korean"},{"id":1062,"label":"Latvian"},{"id":1063,"label":"Lithuanian"},{"id":1086,"label":"Malay"},{"id":1100,"label":"Malayalam"},{"id":1102,"label":"Marathi"},{"id":1044,"label":"Norwegian"},{"id":1045,"label":"Polish"},{"id":1046,"label":"Portuguese (Brazil)"},{"id":2070,"label":"Portuguese (Portugal)"},{"id":1094,"label":"Punjabi"},{"id":1048,"label":"Romanian"},{"id":1049,"label":"Russian"},{"id":3098,"label":"Serbian (Cyrillic)"},{"id":2074,"label":"Serbian (Latin)"},{"id":1051,"label":"Slovak"},{"id":1060,"label":"Slovenian"},{"id":3082,"label":"Spanish (Spain)"},{"id":2058,"label":"Spanish (Mexico)"},{"id":1053,"label":"Swedish"},{"id":1097,"label":"Tamil"},{"id":1098,"label":"Telugu"},{"id":1054,"label":"Thai"},{"id":1055,"label":"Turkish"},{"id":1058,"label":"Ukrainian"},{"id":1056,"label":"Urdu"},{"id":1066,"label":"Vietnamese"}],"navigationNodes":[{"id":1001,"name":"Everything","url":"{searchcenterurl}/results.aspx","promptString":"Search everything"},{"id":1002,"name":"People","url":"{searchcenterurl}/peopleresults.aspx","promptString":"Search people"},{"id":1003,"name":"Conversations","url":"{searchcenterurl}/conversationresults.aspx","promptString":"Search conversations"},{"id":0,"name":"This Site","url":"~site/_layouts/15/osssearchresults.aspx?u={contexturl}","promptString":"Search this site"}],"webUILanguageDirectory":"en-US","showAdminDetails":true,"defaultPagesListName":"Pages","isSPFSKU":false,"defaultQueryProperties":{"culture":1033,"uiLanguage":1033,"summaryLength":180,"desiredSnippetLength":90,"enableStemming":true,"enablePhonetic":false,"enableNicknames":false,"trimDuplicates":true,"bypassResultTypes":false,"enableInterleaving":true,"enableQueryRules":true,"processBestBets":true,"enableOrderingHitHighlightedProperty":false,"hitHighlightedMultivaluePropertyLimit":-1,"processPersonalFavorites":true}};
                    Srch.U.trace(null, 'SerializeToClient', 'ScriptApplicationManager state initialized.');
                }, 'Search.ClientControls.js');
function EnsureScripts(scriptInfoList, finalFunction)
{
if (scriptInfoList.length == 0)
{
finalFunction();
}
else
{
var scriptInfo = scriptInfoList.shift();
var rest = function () { EnsureScripts(scriptInfoList, finalFunction); };
var defd;
try
{
eval('defd = typeof(' + scriptInfo[1] + ');');
}
catch (e)
{
defd = 'undefined';
}
var ensureKey = scriptInfo[0];
if (ensureKey == 'SP.Ribbon.js')
{
ensureKey = 'ribbon';
}
if (scriptInfo[2])
{
EnsureScript(ensureKey, defd, null);
ExecuteOrDelayUntilScriptLoaded(rest, scriptInfo[0]);
}
else
{
EnsureScript(ensureKey, defd, rest);
}
}
}
function PublishingRibbonUpdateRibbon()
{
var pageManager = SP.Ribbon.PageManager.get_instance();
if (pageManager)
{
pageManager.get_commandDispatcher().executeCommand('appstatechanged', null);
}
}
function EnsurePublishingConsoleActionScripts()
{
EnsureScripts(
[['SP.Ribbon.js', 'SP.Ribbon', true],
['SP.Publishing.Resources.resx', 'SP.Publishing.Resources', false],
['SP.UI.Pub.Ribbon.js', 'Pub.Ribbon', true]], PublishingRibbonUpdateRibbon);
}
if (_spBodyOnLoadFunctionNames != null && !_spBodyOnLoadCalled)
{
_spBodyOnLoadFunctionNames.push('EnsurePublishingConsoleActionScripts');
}
else
{
EnsurePublishingConsoleActionScripts();
}var g_clientIdDeltaPlaceHolderMain = "ctl00_DeltaPlaceHolderMain";
var g_clientIdDeltaPlaceHolderPageTitleInTitleArea = "DeltaPlaceHolderPageTitleInTitleArea";

theForm.oldSubmit = theForm.submit;
theForm.submit = WebForm_SaveScrollPositionSubmit;

theForm.oldOnSubmit = theForm.onsubmit;
theForm.onsubmit = WebForm_SaveScrollPositionOnSubmit;

                function _ribbonInitFunc1()

                {
                    EnsureScriptParams('core.js', '_ribbonInitFunc1Wrapped', '', '', '\u002fsites\u002fCompanyNameConnectDEV\u002f_layouts\u002f15\u002fcommandui.ashx', '814772157', '1033', 'RibbonContainer', {'Ribbon.PublishTab':true,'Ribbon.Read':true,'Ribbon.WikiPageTab':true}, null, {'Ribbon.EditingTools.CPEditTab.Layout.PageLayout':true,'Ribbon.PublishTab.Publishing.Approve':true,'Ribbon.WebPartInsert.InsertRelatedDataToListForm':true,'Ribbon.WikiPageTab.Manage.RenamePage':true,'Ribbon.PublishTab.Publishing.Schedule':true,'Ribbon.PublishTab.Workflow.ManageWorkflow':true,'Ribbon.WebPartPage':true,'Ribbon.WikiPageTab.PubPageActions.PreviewMenu':true,'Ribbon.EditingTools.CPEditTab.EditAndCheckout.SaveAndPublish':true,'Ribbon.PublishTab.Publishing.Reject':true,'Ribbon.WikiPageTab.Manage.DeleteFriendlyUrlPage':true,'Ribbon.PublishTab.Variations':true,'Ribbon.WikiPageTab.Manage.PageProperties.Menu.PageProperties.EditTermProperties':true,'Ribbon.WikiPageTab.PageActions':true,'Ribbon.PublishTab.Translation':true,'Ribbon.WikiPageTab.EditAndCheckout.SaveAndPublish':true,'Ribbon.PublishTab.Publishing.QuickDeploy':true,'Ribbon.VariationsTabGroup.VariationsDoclibTab.Translation':true,'Ribbon.VariationsListTabGroup.VariationsListTab.Translation':true,'Ribbon.VariationsTab.Translation':true,'Ribbon.PublishTab.Workflow':true},
                                            {'PublishTabTrimmingVisibilityContext':true,'WSSPageStateVisibilityContext':true}, false, 0, false, 'SP.Ribbon.PageManager.get_instance()', false, null, null, null, '-432852320', 0, '.');
                }
                function _ribbonStartInit(initialTabId, buildMinimized, e)
                {
                    EnsureScriptParams('core.js', '_ribbonStartInitWrapped', initialTabId, buildMinimized, e, true, 'EnsureScriptParams("core.js", "RibbonControlInitWrapped");EnsureScriptFunc("ribbon", "SP.Ribbon.PageManager", function () { _registerCUIEComponentWrapped( "\u002fsites\u002fCompanyNameConnectDEV\u002f_layouts\u002f15\u002fcommandui.ashx", "1033", "814772157");});EnsureScriptFunc("ribbon", "SP.Ribbon.PageManager", _ribbonInitFunc1);');
                }
                function _ribbonKeyboardTitleShortcut(e)
                {
                    EnsureScriptParams('core.js', '_ribbonKeyboardTitleShortcutWrapped', e, 'tff[', 'Ribbon.Read-title');
                }
                function _ribbonDataInit(p6, p7)
                {
                    _ribbon = new Object();
                    _ribbon.initialTabId = p6;
                    _ribbon.buildMinimized = p7;
                    _ribbon.initStarted = false;
                    _ribbon.initialTabSelectedByUser = false;
                    _ribbon.launchedByKeyboard = false;
                }
                function _ribbonWaitForBodyEvent()
                {
                    if (false)
                        _ribbonStartInit();
                    
                function _ribbonOnWindowResizeForHeaderScaling(evt)
                {
                    _ribbonOnWindowResizeForHeaderScalingWrapped(evt, 'RibbonContainer', false);
                }
                EnsureScriptParams('core.js', '_ribbonInitResizeHandlers', _ribbonOnWindowResizeForHeaderScaling, 'RibbonContainer', true, false);
                
                    EnsureScriptParams('core.js', '_ribbonAddEventListener', _ribbonKeyboardTitleShortcut);
                }
                _ribbonDataInit('Ribbon.Read', true);                
                if (SP.SOD.get_prefetch() == 0 && _ribbon.buildMinimized == true)
                {
                    ExecuteOrDelayUntilScriptLoaded(_ribbonWaitForBodyEvent, 'sp.ribbon.js');
                }
                else
                {
                    EnsureScriptFunc('ribbon', 'SP.Ribbon.PageStateActionButton', _ribbonWaitForBodyEvent);
                }
                
var g_commandUIHandlers = {"name":"CommandHandlers","attrs":{},"children":[]};
g_QuickLaunchControlIds.push("zz9_TopNavigationMenu");_spBodyOnLoadFunctionNames.push('QuickLaunchInitDroppable'); _spBodyOnLoadFunctionNames.push('QuickLaunchInitDroppable');  function zz9_TopNavigationMenu_Callback(data, errorHandlerName) { WebForm_DoCallback('ctl00$TopNavigationMenu',data,AspMenuHandleDataRefresh,g_QuickLaunchMenu.Id,errorHandlerName,true); }var g_zz9_TopNavigationMenu = null; function init_zz9_TopNavigationMenu() { if (g_zz9_TopNavigationMenu == null) g_zz9_TopNavigationMenu = $create(SP.UI.AspMenu, null, null, null, $get('zz9_TopNavigationMenu')); } if(g_spPreFetchKeys) {{ g_spPreFetchKeys.push('SP.Core.js');}}EnsureScriptFunc('SP.Core.js', 'SP.UI.AspMenu', init_zz9_TopNavigationMenu);

                    ExecuteOrDelayUntilScriptLoaded(
                        function() 
                        {
                            if ($isNull($find('ctl00_PlaceHolderSearchArea_g_f7dbfedf_d871_41f9_b91f_448be21e6584_csr')))
                            {
                                var sb = $create(Srch.SearchBox, {"delayLoadTemplateScripts":true,"initialPrompt":"Search this site","messages":[],"navigationNodes":[{"id":1001,"name":"Everything","url":"{searchcenterurl}/results.aspx","promptString":"Search everything"},{"id":1002,"name":"People","url":"{searchcenterurl}/peopleresults.aspx","promptString":"Search people"},{"id":1003,"name":"Conversations","url":"{searchcenterurl}/conversationresults.aspx","promptString":"Search conversations"},{"id":0,"name":"This Site","url":"~site/_layouts/15/osssearchresults.aspx?u={contexturl}","promptString":"Search this site"}],"queryGroupNames":["Default"],"renderTemplateId":"~sitecollection/_catalogs/masterpage/Display Templates/Search/Control_SearchBox.js","resultsPageAddress":"~site/_layouts/15/osssearchresults.aspx?u={contexturl}","serverInitialRender":true,"showDataErrors":true,"showNavigation":true,"states":{},"tryInplaceQuery":false}, null, null, $get("ctl00_PlaceHolderSearchArea_g_f7dbfedf_d871_41f9_b91f_448be21e6584_csr"));
                                sb.activate('Search this site', 'ctl00_PlaceHolderSearchArea_g_f7dbfedf_d871_41f9_b91f_448be21e6584_csr_sbox', 'ctl00_PlaceHolderSearchArea_g_f7dbfedf_d871_41f9_b91f_448be21e6584_csr_sboxdiv', 'ctl00_PlaceHolderSearchArea_g_f7dbfedf_d871_41f9_b91f_448be21e6584_csr_NavButton', 'ctl00_PlaceHolderSearchArea_g_f7dbfedf_d871_41f9_b91f_448be21e6584_csr_AutoCompList', 'ctl00_PlaceHolderSearchArea_g_f7dbfedf_d871_41f9_b91f_448be21e6584_csr_NavDropdownList', 'ctl00_PlaceHolderSearchArea_g_f7dbfedf_d871_41f9_b91f_448be21e6584_csr_SearchLink', 'ms-srch-sbprogress', 'ms-srch-sb-prompt ms-helperText');
                            }
                        }, 'Search.ClientControls.js');//]]>
</script>
</form>
	
		<!-- ===== STARTER: Adds extra stuff like another form for Survey management ====================================================== -->	
		

	
	
	

<script type="text/javascript">
	var g_duration = 2900;
var g_iisLatency = 2;
var g_requireJSDone = new Date().getTime();
</script><div id="ECM_Shared_MediaPlayer_Background" style="display: none;"></div><div><div class="mediaPlayerContainer mediaPlayerOverlay" style="display: none;"><video class="mediaPlayerVideoObject" id="ECM_Shared_MediaPlayer" onloadstart="new mediaPlayer.initHtml5Player(this,'','',true,'',false,false,0,false);"><object width="1" height="1" class="mediaPlayerVideoObject" id="ECM_Shared_MediaPlayer" data="data:application/x-oleobject;base64,QfXq3+HzJEysrJnDBxUISgAJAADYEwAA2BMAABQAAAAjADgAMAA4ADAAOAAwADgAMAAAAAAAAAAAAAAAAAAAAE4AAAAvAF8AbABhAHkAbwB1AHQAcwAvADEANQAvAGMAbABpAGUAbgB0AGIAaQBuAC8AbQBlAGQAaQBhAHAAbABhAHkAZQByAC4AeABhAHAAAAA8AAAA//8AAAAAAAAAAAAAFgAAAF8AXwBzAGwARQB2AGUAbgB0ADEAAAAAAAAAFgAAAF8AXwBzAGwARQB2AGUAbgB0ADAAAAAqAAAAaQBzAE8AdgBlAHIAbABhAHkAUABsAGEAeQBlAHIAPQB0AHIAdQBlAAAAAAAAAAAAAAD//wAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA" type="application/x-silverlight"><param name="className" value="mediaPlayerVideoObject"><param name="background" value="#80808080"><param name="enableHtmlAccess" value="true"><param name="source" value="/_layouts/15/clientbin/mediaplayer.xap"><param name="initParams" value="isOverlayPlayer=true"><param name="windowless" value="true"><param name="onload" value="__slEvent0"><param name="onresize" value="__slEvent1"></object></video></div></div></body><!-- Created from Starter SP2013 Master Page originally by Randy Drisgill (http://blog.drisgill.com) - April 21, 2013 --></html>

Open in new window



Here is the CSS stylesheet contents

/**********************************************************************/
/* Publishing master page for fixed width display */
/**********************************************************************/

.customContent {
	width: 1210px;
	margin: auto;
}

.customWidth {
	background-color:#0c7ff2;
	width: 100% !important;
	height:45px;
	margin: auto;
}

/* used to reset the ootb styles on the title row tag in the Starter Collab master page; used for the fullscreen button in SP */
#s4-titlerow {
    background-color: transparent;
    margin: 0;
    padding: 0;
    height: auto;
}

#suiteBarTop
{
 display: none;
}

.customLeft{
	float: left;
}

.customRight{
	float: right;
}

.customNavHolder {
	border:none;
	color: #efefef;
	font-weight:bold;
    font-family: 'Roboto', sans-serif; !important;
	font-size:14px;	
}

.customNavLeftHolder {
	width:800px;
	float:right;
	margin:6px !Important;
}

.customNavRightHolder {
	float:right;
}

.newSearchLocation {
   //float:right;
}

.customFloatLogo {
	float:left;
}
.ms-srch-sb {
	background-color:white !Important;
}

.customFooterContainer {
    float:clear;
}

.customFooterLeft {
  float:left;
}

.customFooterRight {
  float:right;
  font-size:small;
  font-color:black !Important;
}

.customFooterRight a {
  text-decoration:none;
  font-size:12px;
  color:black;
}

/*Select Roboto Font from Google*/
body {
font-family: 'Roboto', sans-serif !important;
}

/*Hide Dropdown Arrow from Menu */
.ms-core-listMenu-horizontalBox .dynamic-children.additional-background {
    background-image: none !Important;
}

/********************************************************/
/*                      NAV DIV                         */
/********************************************************/
a , a:hover{
  text-decoration: none!important;
}
* {
  box-sizing: border-box;
}

.HCPmenu-container .HCPitem {
  float: left;
  padding: 0 15px;
}
.HCPmenu-container .HCPitem > a {
  padding-top: 5px;  
  padding-bottom: 5px;
}
.HCPmenu-container:after {
  display: table;
  content: " ";
  clear: both;
}
.HCPitem:hover .HCPsub-menu {
  display: block;
  border-width:1px;
  border-color:green;
}
.HCPitem > a {
  color:white;
  display: block;
  height: 100%;
}
.HCPitem:hover > a {
  background: white;
  color: blue;
}
.HCPsub-menu {
  background: #fff;
  display: none;
  position: absolute;
  padding-top: 3px;
  z-index: 10 !important;  
  box-shadow: 3px 3px 3px #d1d4d9;
}
.HCPsub-menu-item {
  float:left;
  padding:5px 25px 5px 5px; 
  height:auto;
  width:auto;
}
.HCPsub-menu-item a {
  display: block;
  margin-bottom:15px;
}

.HCPmenu-container .HCPitem > a
{
margin-top:-6px;
padding-left:10px;
padding-right:10px;
}

.HCPsub-menu-item > a:hover {
	color:#0c7ff2 !important;
}

.HCPsub-menu-item > a:link {
	color:#a2a3a5;
}

div[id$='_TopNavigationMenu'] {
  padding-top: 10px;
}

div[class$='_TopNavigationMenu'] {
  padding-top: 10px;
}

/********************************************************/

Open in new window