/*********************************** Simple Accessible Horizontal Navigation bar ********************************/ .bottomBar {} @media screen and (max-width: 480px) { .bottomBar {text-align:center !important;} } #NavHorizontalSimpleByID4 {} @media screen and (min-width: 481px) { #NavHorizontalSimpleByID4 {float:right;} } UL.NavigationBarSimple {margin:12px 0px 6px 0px; padding:0px; text-align:right; /*white-space:nowrap;*/} UL.NavigationBarSimple LI {margin:0px; padding:0px; list-style-image:none; list-style-type:none; display:inline;} UL.NavigationBarSimple LI A {height:19px; line-height:19px; display:inline-block; font-size:1.3rem; font-weight:normal;} LI.NavigationBarSimple {} LI A.NavigationBarSimple {color:#999999; text-decoration:none;} LI A.NavigationBarSimple:hover {color:#f68121; text-decoration:none;} LI.NavigationBarSimpleOn {} LI A.NavigationBarSimpleOn {color:#f68121; text-decoration:none;} LI A.NavigationBarSimpleOn:hover {color:#f68121; text-decoration:none;} SPAN.NavigationBarSimpleItem {/*white-space:nowrap;*/} IMG.NavigationBarSimpleSeperator {vertical-align:top; width:1px; height:11px; margin:6px 5px 0px 10px; background:#999999;} /* left/right - 4px difference */ UL.NavigationBarSimple LI A:active, UL.NavigationBarSimple LI A:focus {color:#000;} /******************* top-line Simple Bar *******************/ .top-line UL.NavigationBarSimple {margin:8px 10px 11px 0px; padding:0px; text-align:right; /*white-space:nowrap;*/ background:transparent;} .top-line UL.NavigationBarSimple LI {margin:0px; padding:0px; list-style-image:none; list-style-type:none; display:inline;} .top-line UL.NavigationBarSimple LI A {height:19px; line-height:19px; display:inline-block; font-size:1.5rem; font-weight:normal;} .top-line LI.NavigationBarSimple {} .top-line LI A.NavigationBarSimple {color:#214079; text-decoration:none;} .top-line LI A.NavigationBarSimple:hover {color:#f49040; text-decoration:none;} .top-line LI.NavigationBarSimpleOn {} .top-line LI A.NavigationBarSimpleOn {color:#f49040; text-decoration:none;} .top-line LI A.NavigationBarSimpleOn:hover {color:#f49040; text-decoration:none;} .top-line SPAN.NavigationBarSimpleItem {/*white-space:nowrap;*/} .top-line IMG.NavigationBarSimpleSeperator {vertical-align:top; width:1px; height:11px; margin:6px 6px 0px 10px; background:#cccccc;} /* left/right - 4px difference */ .top-line UL.NavigationBarSimple LI A:active, .top-line UL.NavigationBarSimple LI A:focus {color:#f49040;} /******************** Simple Top nav Box & Collaps button *********************/ A.simple-open {display:none;} @media screen and (max-width: 768px) { DIV.simple-box {background-color:#fff; width:200px; float:none !important; position:fixed; top:0px; right:-210px; z-index:9999; direction:rtl; box-shadow:0 0px 8px rgba(0,0,0,0.3);} A.simple-open, A.simple-close {display:block; width:24px; height:30px; position:fixed; top:5px; right:0px; background:#eee url('../toMenu-small.png') no-repeat right center; z-index:9999;} .top-line UL.NavigationBarSimple {} .top-line UL.NavigationBarSimple LI {float:none !important; display:block; margin:5px 10px 5px 10px;} .top-line UL.NavigationBarSimple LI A {height:auto; line-height:115%;} .top-line IMG.NavigationBarSimpleSeperator {display:none;} } /**************** Hp 3 icon tabs **************/ #NavHorizontalSimpleByID164 {width:100%; display:table;} #icon-tabs UL.NavigationBarSimple {margin:0px -2.5% 10px -2.5%; padding:0px; text-align:center;} #icon-tabs UL.NavigationBarSimple LI {width:33.3333%; height:158px; margin:0px; padding:0px; list-style-image:none; list-style-type:none; float:right; display:inline-block;} #icon-tabs UL.NavigationBarSimple LI A {width:100%; height:158px; display:block; font-size:2rem; line-height:2.2rem; font-weight:bold; padding:112px 15px 0px 15px; box-sizing:border-box;} #icon-tabs LI.NavigationBarSimple {} #icon-tabs LI A.NavigationBarSimple {color:#014b88; text-decoration:none;} #icon-tabs LI A.NavigationBarSimple:hover {color:#fff; text-decoration:none;} /*#icon-tabs LI.NavigationBarSimpleOn {} #icon-tabs LI A.NavigationBarSimpleOn {color:#f49040; text-decoration:none;} #icon-tabs LI A.NavigationBarSimpleOn:hover {color:#f49040; text-decoration:none;}*/ #icon-tabs SPAN.NavigationBarSimpleItem {/*white-space:nowrap;*/} #icon-tabs IMG.NavigationBarSimpleSeperator {float:right; display:block; width:1px; height:100%; margin:0; background:url('../sepSubjects.png') no-repeat center center;} #icon-tabs UL.NavigationBarSimple LI A:active, #icon-tabs UL.NavigationBarSimple LI A:focus {} /* #icon-tabs UL.NavigationBarSimple LI A { -webkit-transition: all 0.6s ease; -moz-transition: all 0.6s ease; -o-transition: all 0.6s ease; -ms-transition: all 0.6s ease; transition: all 0.6s ease; } */ #icon-tabs UL.NavigationBarSimple LI:hover {background:url('../stripBlue.gif') repeat-x top;} #icon-tabs LI.NavigationBarSimple1 A {background:url('../icon-1.png') no-repeat center 25px !important;} #icon-tabs LI.NavigationBarSimple1 A:hover {background-image:url('../icon-1-w.png') !important;} #icon-tabs LI.NavigationBarSimple2 A {background:url('../icon-4.png') no-repeat center 27px !important;} #icon-tabs LI.NavigationBarSimple2 A:hover {background-image:url('../icon-4-w.png') !important;} #icon-tabs LI.NavigationBarSimple3 A {background:url('../icon-3.png') no-repeat center 27px !important;} #icon-tabs LI.NavigationBarSimple3 A:hover {background-image:url('../icon-3-w.png') !important;} @media screen and (max-width: 480px) { #icon-tabs UL.NavigationBarSimple LI A {font-size:1.7rem; line-height:1.9rem; padding:96px 10px 0px 10px;} #icon-tabs LI.NavigationBarSimple1 A {background:url('../icon-1-small.png') no-repeat center 25px !important;} #icon-tabs LI.NavigationBarSimple1 A:hover {background-image:url('../icon-1-w-small.png') !important;} #icon-tabs LI.NavigationBarSimple2 A {background:url('../icon-4-small.png') no-repeat center 27px !important;} #icon-tabs LI.NavigationBarSimple2 A:hover {background-image:url('../icon-4-w-small.png') !important;} #icon-tabs LI.NavigationBarSimple3 A {background:url('../icon-3-small.png') no-repeat center 27px !important;} #icon-tabs LI.NavigationBarSimple3 A:hover {background-image:url('../icon-3-w-small.png') !important;} } /**************** Hp 6 round "buttons" **************/ #hp-buttons UL.NavigationBarSimple {margin:0px; padding:13px 40px 0px 0px; display:table; text-align:left;} #hp-buttons UL.NavigationBarSimple LI {margin:0px 12px 15px 0px; padding:0px; text-align:center; list-style-image:none; list-style-type:none; display:inline-block; text-align:left;} #hp-buttons UL.NavigationBarSimple LI A { width:129px; height:129px; line-height:115%; display:table-cell; font-size:1.8rem; font-weight:normal; padding:0 10px; border-radius:50%; text-align:center; vertical-align:middle; -webkit-transition: all .10s ease-in-out; -moz-transition: all .10s ease-in-out; -o-transition: all .10s ease-in-out; -ms-transition: all .10s ease-in-out; transition: all .10s ease-in-out; box-sizing:border-box; } #hp-buttons LI.NavigationBarSimple {} #hp-buttons LI A.NavigationBarSimple { color:#ffffff; text-decoration:none; background: #1e9cd7; /* Old browsers */ background: -moz-linear-gradient(top, #1e9cd7 0%, #014c89 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1e9cd7), color-stop(100%,#014c89)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #1e9cd7 0%,#014c89 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #1e9cd7 0%,#014c89 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #1e9cd7 0%,#014c89 100%); /* IE10+ */ background: linear-gradient(to bottom, #1e9cd7 0%,#014c89 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e9cd7', endColorstr='#014c89',GradientType=0 ); /* IE6-9 */ } #hp-buttons LI A.NavigationBarSimple:hover { color:#ffffff; text-decoration:none; background: #b04f00; /* Old browsers */ background: -moz-linear-gradient(top, #b04f00 0%, #f58121 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#b04f00), color-stop(100%,#f58121)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #b04f00 0%,#f58121 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #b04f00 0%,#f58121 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #b04f00 0%,#f58121 100%); /* IE10+ */ background: linear-gradient(to bottom, #b04f00 0%,#f58121 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b04f00', endColorstr='#f58121',GradientType=0 ); /* IE6-9 */ box-shadow:0px 0px 10px rgba(0,0,0,0.5); } /*#hp-buttons LI.NavigationBarSimpleOn {} #hp-buttons LI A.NavigationBarSimpleOn {background-color:#d66a12; color:#ffffff; text-decoration:none;} #hp-buttons LI A.NavigationBarSimpleOn:hover {background-color:#d66a12; color:#ffffff; text-decoration:none;}*/ #hp-buttons SPAN.NavigationBarSimpleItem {/*white-space:nowrap;*/} #hp-buttons IMG.NavigationBarSimpleSeperator {display:none;} /* left/right - 4px difference */ #hp-buttons UL.NavigationBarSimple LI A:active, #hp-buttons UL.NavigationBarSimple LI A:focus {/*background-color:#d66a12; color:#ffffff;*/} @media screen and (max-width: 990px) { #hp-buttons UL.NavigationBarSimple {padding:0;} } @media screen and (max-width: 768px) { #hp-buttons UL.NavigationBarSimple {max-width:540px; text-align:center; padding:0; margin:0px auto 0px auto;} #hp-buttons UL.NavigationBarSimple LI {margin:0px 6px 15pxpx 6px;} } /*********************************************************************************************************/ /******************************* Awesome Accessible Horizontal Navigation bar ****************************/ /** standart **/ #NavHorizontalAwesomeByIDXXX/**/ {} #nav-awesome UL.NavigationBarAwesome {margin:20px 0px 0px 0px; padding:0px; text-align:center;} #nav-awesome UL.NavigationBarAwesome LI {position:relative; margin-bottom:20px; text-align:center; box-shadow:0 1px 8px rgba(0,0,0,0.3); list-style-image:none; list-style-type:none;} #nav-awesome UL.NavigationBarAwesome LI A {width:100%; height:100%; position:absolute; right:0; left:0; top:0; bottom:0; text-shadow:1px 1px 1px rgba(0,0,0,0.7);} #nav-awesome LI.NavigationBarAwesome {} #nav-awesome LI A.NavigationBarAwesome {color:#ffffff; text-decoration:none;} #nav-awesome LI A.NavigationBarAwesome:hover {color:#f68121; text-decoration:none;} #nav-awesome LI.NavigationBarAwesomeOn {} #nav-awesome LI A.NavigationBarAwesomeOn {color:#f68121; text-decoration:none;} #nav-awesome LI A.NavigationBarAwesomeOn:hover {color:#f68121; text-decoration:none;} #nav-awesome IMG.NavigationBarAwesomeBg {width:100%; height:auto; display:block;} #nav-awesome SPAN.NavigationBarAwesomeFa {display:block; margin:10% 0px 10% 0px;} #nav-awesome UL.NavigationBarAwesome LI A .fa {font-size:48px; text-shadow:1px 1px 1px rgba(0,0,0,0.7);} #nav-awesome SPAN.NavigationBarAwesomeTitle {display:inline-table; margin:0px 10px 0px 10px; padding:10px; font-size:21px; font-weight:bold; background-color:rgba(0,0,0,0.3); border-radius:10px;} #nav-awesome UL.NavigationBarAwesome LI A:active, #nav-awesome UL.NavigationBarAwesome LI A:focus {color:#f68121;} /** Hp 6 "banners" **/ #NavHorizontalAwesomeByIDXXX/**/ {} #workshop UL.NavigationBarAwesome {margin:20px 0px 0px 0px; padding:0px; text-align:center;} #workshop UL.NavigationBarAwesome LI {position:relative; margin-bottom:20px; text-align:center; box-shadow:0 1px 8px rgba(0,0,0,0.3); list-style-image:none; list-style-type:none;} #workshop UL.NavigationBarAwesome LI A {} #workshop LI.NavigationBarAwesome {} #workshop LI A.NavigationBarAwesome {color:#999999; text-decoration:none;} #workshop LI A.NavigationBarAwesome:hover {color:#f68121; text-decoration:none;} #workshop LI.NavigationBarAwesomeOn {} #workshop LI A.NavigationBarAwesomeOn {color:#f68121; text-decoration:none;} #workshop LI A.NavigationBarAwesomeOn:hover {color:#f68121; text-decoration:none;} #workshop IMG.NavigationBarAwesomeBg {width:100%; height:auto; display:block;} #workshop SPAN.NavigationBarAwesomeFa {} #workshop UL.NavigationBarAwesome LI A .fa {border-radius:42px; border:#fe8439 1px solid; margin:5px; padding:20px; font-size:32px;} #workshop SPAN.NavigationBarAwesomeTitle {} #workshop UL.NavigationBarAwesome LI:focus {color:#f68121;} #workshop UL.NavigationBarAwesome LI A:active, #workshop UL.NavigationBarAwesome LI A:focus {color:#f68121;} /** css for code that added by JQ function **/ DIV.awesomeBar-item-over {width:100%; height:0; text-align:center; position:absolute; top:0; left:0; text-decoration:none; background:rgba(19,43,93,0.7); overflow:hidden;} SPAN.awesomeBar-item-title {display:inline-block; font-size:26px; line-height:115%; color:#ffffff; margin:5px 15px 10px 15px;} A.awesomeBar-item-link {display:table; font-size:32px; margin:auto;} A.awesomeBar-item-link .fa-link {padding:10px !important; font-size:21px !important;}