/* -- ==============DROP DOWN NAVIGATION ============================ -- */

#Header .menuTemplate3 {
position: absolute;
bottom: 10px;  /*-- amount of space between nav bar and bottom of banner jpg --*/
right: 0px;
width: 100%;
}
#Header .is-sticky .menuTemplate3{
	position:static;
}
#Header .is-sticky {
  position: fixed;
  z-index: 9999;
  top: 0;
}

/* top level
--------------------------------------------*/
.menuTemplate3
{
    margin: 0 auto; width: auto;float:left;
    /*behavior: url("/horizontal/menuh/cssmenu.htc"); */
    position:relative;
    z-index:4;
    height: 35px;
    background: #3d5366;
    list-style: none;
    padding: 0;
}

.menuTemplate3 div {
    box-sizing:content-box;
}

.menuTemplate3 li
{
    padding: 0;
    float: left;
    height: 36px;
    position: relative;/*delete it if you want submenu to be positioned relative to the whole menu instead of this li element*/
    color: #EEE;
    z-index:5;
}

.menuTemplate3 li:hover, .menuTemplate3 li.onhover
{
    border-top:0;
}
.menuTemplate3 a
{
    padding: 0 30px;
    line-height: 36px; /*Note: keep this value the same as the height of .menuTemplate3 li */
    font-size: 15px;
    font-weight: normal;
    display: inline-block;
    outline: 0;
    text-decoration: none;
    color: #FFF;
    position: relative;
}
.menuTemplate3 li:hover a, .menuTemplate3 li.onhover a
{
    background-color: #47749a;
    color: #FFF;
    z-index: 9;
}
.menuTemplate3 a.arrow
{
    background: url(arrow.gif) no-repeat right center;
}


/*Used to align a top-level item to the right*/
.menuTemplate3 li.menuRight
{
    float: right;
    margin-right: 0px;
}

/*for the top-level separators*/
.menuTemplate3 li.separator
{
    font-size:0;
    overflow:hidden;
    border-left:1px solid #aaa;
    height:20px;
    margin-top:8px;
    z-index:4;
}


/* sub level
--------------------------------------------*/

.menuTemplate3 .drop
{
    position: absolute;
    z-index:5;
    left: -9999px;
    /*border: 1px solid #000;*/
    background: #47749a;
    text-align: left;
    padding: 20px;
    top:35px;
	color:#fff;
	font-weight: bold;
}

.menuTemplate3 .drop a
{
    padding-left: 0px;
    padding-right: 0px;
    line-height: 26px;
    font-size: 12px;
    font-weight: normal;
    display: inline;
    text-align: left;

    position: static;
    z-index: 0;
}

.menuTemplate3 li:hover .drop, .menuTemplate3 li.onhover .drop
{
    left: -1px;/*Use this property to change offset of the dropdown*/
}
.menuTemplate3 li:hover .dropToRight2, .menuTemplate3 li.onhover .dropToRight2
{
    left: -60px;/*Use this property to change offset of the dropdown*/
}
.menuTemplate3 li:hover .dropToLeft, .menuTemplate3 li.onhover .dropToLeft
{
    left: auto;
    right: -1px;
}
.menuTemplate3 li:hover .dropToLeft2, .menuTemplate3 li.onhover .dropToLeft2
{
    left: auto;
    right: -100px;
}
.menuTemplate3 .drop h4{
	font-family: 'Hind', sans-serif;
	text-transform:uppercase;
	font-weight:700;
	margin:0 0 6px;
	border-top:none;
	border-bottom: 1px solid #fff;
}
.menuTemplate3 .drop h4 a{
	font-size:14px;
	line-height:1;
	font-weight:700;
}
.menuTemplate3 .drop .photo h4{
	border:none;
	text-transform:none;
}

/* Elements within the drop down sub-menu
--------------------------------------------*/

.menuTemplate3 div.drop div.text-block{margin-bottom:10px;}
.menuTemplate3 div.drop div.text-block.last{margin-bottom:0;}
.menuTemplate1 li:hover .drop a, .menuTemplate1 li.onhover .drop a
{
    background: none;
    background-image:none;
    padding:0 0;
}
.menuTemplate3 div.drop div a
{
    line-height: 24px;
	color:white;
    background:none;
}
.menuTemplate3 div.drop div a:hover
{
    text-decoration:underline;
    cursor:pointer;
    color:white;
}

.menuTemplate3 div.left {
	float:left;
	width:32%;
	margin-right:3%;
}
.menuTemplate3 div.left.last{
	margin-right:0;
}
.menuTemplate3 div.left.photo {
	width:30%;
	margin-right:0;
	text-align:center;
}
.menuTemplate3 div.left.photo.first {
	margin-right:3%;
}
.menuTemplate3 div.left.photo img{
	width:100%;
	height:auto;
	margin-bottom:8px;
}



/* CSS3 effects
--------------------------------------------*/

/*for top-level*/
.decor3_1
{
   /* -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;

    -moz-box-shadow: 1px 2px 4px 2px #999;
    -webkit-box-shadow: 1px 2px 4px 2px #999;
    box-shadow: 1px 2px 4px 2px #999;*/
}

/*for submenu.*/
.decor3_2
{
   /* -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;

    -moz-box-shadow: 0px 8px 14px #777;
    -webkit-box-shadow: 0px 8px 14px #777;
    box-shadow: 0px 8px 14px #777;  */
}

/* -- ==============END DROP DOWN NAVIGATION===================================== -- */


.resMenuToggler {
	display: none;
	height: 43px;
	width: 43px;
	background: #222222 url(../image-files/res-menu-toggler.png) no-repeat 0 0;
	background-size: 100% 100%;
	font-size: 0;
	line-height: 0;
	text-decoration: none;
	text-indent: -12000px;
	cursor: pointer;
	position: absolute;
	top: 10px;
	right: 10px;
}
.reMenuOverlay {
	display: none;
	background-color: rgba(0, 0, 0, .7);
	position: absolute;
	top: 0;
	left: 0;
	z-index:1000;
}
.resMenuSection {
	width: 260px;
	color: #fff;
	background-color: #222222;
	-webkit-box-shadow: 0 0 5px 2px rgba(0,0,0,0.5);
	box-shadow: 0 0 5px 2px rgba(0,0,0,0.5);
	position: absolute;
	top: 0;
	left: -300px;
	z-index:1001;
	overflow-y: auto;
}
.resMenuLogo {
	background: #0b0b0b;
	padding: 5px;
	text-align: center;
}
.resMenuLogo img {
	max-width: 100%;
}
.resMenu {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	text-align: left;
}
.resMenu ul {
	list-style: none;
	padding: 0;
	margin: 0;
}
.resMenu ul li {
	list-style: none;
	border-bottom: 1px solid #0b0b0b;
	padding: 0;
	margin: 0;
	position: relative;
}
.resMenu ul li a {
	display: block;
	padding: 9px 15px;
	text-decoration: none;
	color: #fff;
	line-height: 21px;
	position: relative;
}
.resMenu ul li a:hover {
	background: #0b0b0b;
}
.resMenu ul li .dorpIco {
	display: block;
	width: 39px;
	height: 39px;
	line-height: 39px;
	text-align: center;
	border-left: 1px solid #0b0b0b;
	background: url(../image-files/drop-ico.png) no-repeat 50% 50%;
	cursor: pointer;
	position: absolute;
	top: 0;
	right: 0;
}
.resMenu ul li .dorpIco.dorpIcoActive { background-image: url(../image-files/drop-ico-active.png)}
.resMenu ul li ul {
	display: none;
}
.resMenu ul li li {
	border-bottom: 0;
	border-top: 1px solid #0b0b0b;
	background-color: #343434;
}
.resMenu ul li li a {
	padding-left: 25px
}
.resMenu ul li li li {
	background-color: #515151;
}
.resMenu ul li li li a {
	padding-left: 35px
}


/* updated code */
/* Hide checkbox inputs */
.dorptrigger {
  display: none;
}
#resMenuToggler:checked + .reMenuOverlay + .resMenuSection {
  left: 0;
}
.resMenuToggler {
  z-index: 9999;
}
.resMenuSection {
  left: calc(-100vw - 20px);
  width: 260px;
  min-height: 100vh;
  transition: left 0.5s ease-in-out;
}
.reMenuOverlay {
  position: absolute;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100vh;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.5s ease-in-out;
}
#resMenuToggler:checked + .reMenuOverlay {
  pointer-events: all;
  opacity: 1;
}
.dorptrigger + ul {
  overflow: hidden;
  padding: 0;
  margin: 0;
  display: block !important;
  max-height: 0;
  pointer-events: none;
  transition: all 0.5s linear;
}

.dorptrigger:checked + ul {
  max-height: 100vh !important;
  pointer-events: all !important;
}

/* Hide checkbox inputs */
.dorptrigger {
  display: none;
}

/* Main menu items */
.resMenu li {
  position: relative;
}

/* Submenu styles */
.resMenu ul {
  display: block !important;
}

/* Submenu styles */
.resMenu ul ul {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Animation when menu is open */
.resMenu .dorptrigger:checked ~ ul {
  max-height: 1000px;
}

/* Rotate icon when open */
.resMenu .dorptrigger:checked + label > .dorpIco {
  background-image: url(https://www.parisinsidersguide.com/image-files/xdrop-ico-active.png.pagespeed.ic.l3QE4-IIcS.webp);
}