﻿/*Default Styles for Horizontal Menu*/

#MainMenuOverlay{display: none;position: absolute; z-index: 98; opacity: 0.7; filter: alpha(opacity = 70); top: 276px; left: 0; right: 0;  height: 12000px; width: 100%;   background-color: Black;   color: White;}


.hrzl-menu span.btn-nav {display:none; }
.hrzl-menu { height:58px; width:100%; background-color:#0E0E0E; font-weight:lighter; font-family:Arial, 'DejaVu Sans', 'Liberation Sans', Freesans, sans-serif;  font-size:1em; position:relative;}
.hrzl-menu .menu-icon { font-size: 1.2em; color:#fff; margin-right:10px; margin-top:15px; display:inline-block; cursor:pointer; padding:2px 4px; border:solid 1px #aaa; text-transform:uppercase;}
.hrzl-menu .menu-icon:hover { color:#ff9100;}
.hrzl-menu .menu-icon span { display:inline-block; padding:1px 3px; margin-right:4px;}

.hrzl-menu, .hrzl-menu ul {margin:0; padding:0; list-style: none; display:block;}

.hrzl-menu a, .hrzl-menu a:hover { text-decoration:none;}
/*level 1*/

.hrzl-menu.large .bg-img {position:absolute;top:0; left:0; z-index:-1; width:100%; display:block; }
.hrzl-menu.large a.link-img img {width:100%; display:block; }
.hrzl-menu.large a.link-img:hover{ color:none; }

.hrzl-menu.large {background:none; display:block; z-index:100;}

.hrzl-menu.large > li {display:block; cursor:pointer; margin:0;  width:16.666%; vertical-align:middle; top:0; text-align:center; float:left; }
.hrzl-menu.large > li:first-child{ border-left:none; width:16.67%;}

.hrzl-menu.large > li > div.toplevel-container { background-color:#0E0E0E; border-left:solid 1px #595959;display:table; width:100%; line-height:1.12em;}
.hrzl-menu.large > li > div.toplevel-container a { display:table-cell;height:58px; vertical-align:middle;}
.hrzl-menu.large > li > div.toplevel-container a > span {font-weight:bold; text-transform:uppercase;  padding:0; color:#bababa;}
.hrzl-menu.large > li > div.toplevel-container span.dummy {height:58px; font-weight:bold; text-transform:uppercase; vertical-align:middle; color:#bababa; display:table-cell; }
.hrzl-menu.large > li:first-child > div.toplevel-container span.dummy,
.hrzl-menu.large > li:first-child > div.toplevel-container a {border-left:none;}

.hrzl-menu.large > li.selected > div.toplevel-container {background-color:red;}
.hrzl-menu.large > li.selected div.toplevel-container span {color:#ffffff;}

.hrzl-menu.large ul {display:none; z-index: 1000; background-color:#ffffff;min-width:600px; position:absolute; top:58px; left:0; width:100%; cursor:default; border-bottom:0 red solid; border:0px red solid; }
.hrzl-menu.large li.selected ul.noJS {display:block; display:normal; }
.hrzl-menu.large ul > li.span-1-1 { margin:0; padding:0; width:100%;}
.hrzl-menu.large ul > li.span-1-2 { margin:0; padding:0; width:50%;}
.hrzl-menu.large ul > li.span-1-3 { margin:0; padding:0; width:33.3%;}
.hrzl-menu.large ul > li.span-1-3:first-child {width:33.4%;}
.hrzl-menu.large ul > li.span-1-4 { margin:0; padding:0; width:25%;}
.hrzl-menu.large ul > li.span-1-5 { margin:0; padding:0; width:20%;}


.hrzl-menu.large .submenu-block div { text-align:left; margin:0;padding:0; display:block;}
.hrzl-menu.large .submenu-block div.level2 span { text-transform:uppercase; color:#434343; text-align:left; display:block; font-size:1.3em;  line-height:1.1em; padding-top:12px; }
.hrzl-menu.large .submenu-block div.level3 { margin-bottom:5px;}
.hrzl-menu.large .submenu-block div.level3 span {font-weight:normal; line-height:100%; font-size:0.85em; color:#414141;}

/*.hrzl-menu.large li.level1.item1 div.level2.item1 span {color:#f24036;}
.hrzl-menu.large li.level1.item1 div.level2.item2 span {color:#ff7b12;}
.hrzl-menu.large li.level1.item1 div.level2.item3 span {color:#008dbf;}*/
.hrzl-menu.large li.level1.item1 div.level2 span {color:#fff;font-size:1.25em}
/*.hrzl-menu.large li.level1.item1 div.level2.item2 span {color:#fff;font-size:1.25em}
.hrzl-menu.large li.level1.item1 div.level2.item3 span {color:#fff;font-size:1.25em}*/


.hrzl-menu.large li.level1.item3 div.level2 span {color:#fff;}

.hrzl-menu.large li.level1.item6 div.level2.item1 span {color:#1d1b1c;}
.hrzl-menu.large li.level1.item6 div.level2.item2 span {color:#b18a07;}
.hrzl-menu.large li.level1.item6 div.level2.item3 span {color:#f51a38;}


.hrzl-menu.large li.level1 div.submenu-container { display: block; background-color:transparent; position:relative; }
.hrzl-menu.large li.level1 div.submenu-container > div {  margin-left: 15px; margin-right: 15px; }
.hrzl-menu.large li.level1 div.submenu-container div.level3.item1 {margin-top:20px;}
.hrzl-menu.large li.level1 div.submenu-container div.level3 { margin-bottom:10px;}

.hrzl-menu.large .submenu-container div.nav-blur {font-size:0.8em; color:#434343; display:block;  margin-top:5px; line-height:1.1em;}
.hrzl-menu.large .submenu-container div.nav-blur p {font-size:1.25em; }

.hrzl-menu.large li.level1.item2 .submenu-block div.level2 span { text-transform:none;}
.hrzl-menu.large li.level1.item2 div.submenu-container div.level3 {width:170px; margin-bottom:3px;}
.hrzl-menu.large li.level1.item2 div.submenu-container div.level3 a {text-decoration:underline; color:blue;}
.hrzl-menu.large li.level1.item2 div.submenu-container div.level3.item1 { margin-top:70px;    }

.hrzl-menu.large div.level3 div.nav-blur {font-size:0.8em; margin-top:0;}

.hrzl-menu.large div.level2.from-ds { margin-top:10px; margin-bottom:0; }

.hrzl-menu.large li.level1 div.submenu-container div.level3.from-ds {margin-top:13px;}
.hrzl-menu.large div.level3.from-ds a {text-decoration:underline; }
.hrzl-menu.large div.level3.from-ds span { color:#015e99; }

/*.hrzl-menu.large li.level1.item3 div.submenu-container div.level3:last-child a span {text-decoration:underline; color:#015e99;}
.hrzl-menu.large li.level1.item4 div.submenu-container div.level3:last-child a span {text-decoration:underline; color:#015e99;}*/

/* specific button style */

.hrzl-menu.large .submenu-container .inline-button-style,
.hrzl-menu.large .submenu-container .full-button-style { margin-top:20px;}

.hrzl-menu.large .submenu-container .full-button-style span,
.hrzl-menu.large .submenu-container .inline-button-style span
{   border:solid 1px #b9b9b9; padding:7px 14px 7px 14px; background-color:#f5f5f5;
    background: -webkit-linear-gradient(to bottom, #fefefe , #dfdfdf); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(to bottom, #fefefe, #dfdfdf); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(to bottom, #fefefe, #dfdfdf); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to bottom, #fefefe , #dfdfdf); /* Standard syntax */
    border-radius:3px;
}

.hrzl-menu.large .submenu-container .full-button-style span { display:block;}

/*for small screen*/

.hrzl-menu.small div.nav-blur {display:none;}
.hrzl-menu.small { height:auto; background-color:#0E0E0E;}
.hrzl-menu.small  ul { display:none; background-color:#0E0E0E;width:100%; position:relative;}
.hrzl-menu.small > li { position:relative; color:#bfbfbf; font-size:1.0em; font-weight:bold; }
.hrzl-menu.small > li:hover {background-color:red; cursor:pointer;}

.hrzl-menu.small > li > div.toplevel-container{ margin-right:10px; margin-left:10px; border-bottom:1px solid #3b3b3b; }
.hrzl-menu.small > li > div.toplevel-container span { display:block; color:#bfbfbf; font-weight:bold; text-transform:uppercase;line-height:20px;padding-top:5px; padding-bottom:5px;}
.hrzl-menu.small > li > div.toplevel-container:hover{border-bottom:solid 1px red;color:#f9fbf8; }

.hrzl-menu.small li.selected ul.noJS {display:block; display:normal;  }

.hrzl-menu.small > li.selected {background-color:red; }
.hrzl-menu.small > li.selected > div.toplevel-container{border-bottom:solid 1px red;}
.hrzl-menu.small > li.selected > div.toplevel-container span {color:#f9fbf8; border-bottom:none; padding-top:10px; padding-bottom:10px;}

.hrzl-menu.small ul > li.span-1-1,
.hrzl-menu.small ul > li.span-1-2,
.hrzl-menu.small ul > li.span-1-3,
.hrzl-menu.small ul > li.span-1-4,
.hrzl-menu.small ul > li.span-1-5 { margin:0; padding:0;}

.hrzl-menu.small > li > ul >  li {display:block;}
.hrzl-menu.small > li > ul >  li:first-child:first-child{margin-top:10px;}

.hrzl-menu.small > li > ul >  li div.submenu-container { margin:10px;background-color:#fff; padding:10px; margin-top:0; }

.hrzl-menu.small > li > ul >  li div.level2 { line-height:18px; border-bottom:1px solid #cdcdcd; }
.hrzl-menu.small > li > ul >  li div.level2 a {display:block; color:#2a2a2a;font-weight:bold;}
.hrzl-menu.small > li > ul >  li div.level2 span { display:block;color:#2a2a2a; font-weight:bold;  vertical-align:top; }
.hrzl-menu.small > li > ul >  li div.level3 {display:normal;line-height:18px; margin-top:5px; border-bottom:1px solid #cdcdcd; }

.hrzl-menu.small > li > ul >  li div.level3.item1 {margin-top:10px; }
.hrzl-menu.small > li > ul >  li div.level3 a {display:block; font-weight:bold; font-size:0.9em;}

.hrzl-menu.small .bg-img {display:none;}
.hrzl-menu.small a.link-img img {width:100%; display:block; }
.hrzl-menu.small a.link-img:hover{ color:none; opacity:1;}

.hrzl-menu.small > li .btn-nav { position:absolute; right:20px;top:0; width:12px; background-color:transparent; }

/* for huge*/
@media only screen and (min-width: 1025px) {
     .youtubelinks {width:500px;height:315px}
}

/* for large and lower */
@media only screen and (max-width: 1024px) {
    .youtubelinks {width:500px;height:315px}
}

/* for large and upper*/
@media only screen and (min-width: 769px) 
{
    .youtubelinks {width:500px;height:315px}
}

/* for large */
@media only screen and (min-width:769px) and (max-width:1024px) 
{ 
    .hrzl-menu.large > li > div.toplevel-container {line-height:1.0em;}
    .hrzl-menu.large > li > div.toplevel-container a > span, 
    .hrzl-menu.large > li > div.toplevel-container span.dummy {font-size:.95em;}

    .hrzl-menu.large .submenu-block div.level2 span { font-size:.90em; padding-top:10px;}
    .hrzl-menu.large .submenu-block div.level3 { margin-bottom:0; padding:0; margin-top:0; line-height:1.1em;}

    .hrzl-menu.large li.level1 div.submenu-container > div {  margin-left: 10px; margin-right: 10px; }
    /*.hrzl-menu.large li.level1 div.submenu-container div.level3.item1 {margin-top:10px;}*/

    .hrzl-menu.large li.level1.item1 div.level2 span {font-size:0.95em}
    
    .hrzl-menu.large .submenu-container div.nav-blur p { margin-bottom:10px; }
        .youtubelinks {width:500px;height:315px}
}

/* for medium and lower */
@media only screen and (max-width: 768px) 
{
    .hrzl-menu.small ul > li.span-1-1,
    .hrzl-menu.small ul > li.span-1-2,
    .hrzl-menu.small ul > li.span-1-3,
    .hrzl-menu.small ul > li.span-1-4,
    .hrzl-menu.small ul > li.span-1-5 { margin:0; padding:0; width:100%; float:none;}

    .hrzl-menu.small .hide-for-small {display:none;}
    .youtubelinks {width:500px;height:315px}
}


/*for medium and upper */
@media only screen and (min-width: 481px){
	    .youtubelinks {width:500px;height:315px}
	
}

/*for medium*/
@media only screen and (min-width:481px) and (max-width:768px) 
{ 
    .hrzl-menu.small > li > a > span, .hrzl-menu.large > li > span.dummy {}
    .hrzl-menu.small ul > li.span-1-1,
    .hrzl-menu.small ul > li.span-1-2,
    .hrzl-menu.small ul > li.span-1-3,
    .hrzl-menu.small ul > li.span-1-4,
    .hrzl-menu.small ul > li.span-1-5 { margin:0; padding:0; width:100%; float:none;}

    .hrzl-menu.small .hide-for-small {display:none;}
    .youtubelinks {width:500px;height:315px}
}


/*for small*/
@media only screen and (max-width: 480px){
    .youtubelinks {width:500px;height:315px}
}

