html {
content-visibility: auto;
}
#menubar {
display: none;
}
/**1 reset.css start***/
body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
form,
fieldset,
input,
textarea,
p,
blockquote,
th,
td {
margin: 0;
padding: 0
}
fieldset,
img {
border: 0
}
a:focus {
outline: none
}
body {
overflow-y: scroll
}
p {
margin-top: 10px;
margin-bottom: 15px
}
ul,
ol,
dl {
margin: 10px 0;
padding-left: 30px
}
dl {
margin: 10px 0
}
dd {
padding-left: 40px
}
td,
th {
padding: 1px
}
a:link,
a:visited {
text-decoration: none
}
a:hover {
text-decoration: underline
}
fieldset {
margin: 10px 0 10px 0;
padding: 0 10px 10px 10px;
border: 1px solid #c8c8c8
}
legend {
padding: 0 10px 0 10px;
background: #fff
}
form div {
margin: 10px 0 10px 0
}
textarea {
padding: 1px 0 1px 5px
}
option {
padding: 0 0 1px 5px
}
input[type="hidden"] {
display: none
}
input[type="text"],
input[type="password"] {
padding: 1px 0 1px 5px
}
button,
input[type="button"],
input[type="submit"] {
padding: 2px 4px 2px 1px;
line-height: 100%
}
input[type="button"],
input[type="submit"],
input[type="checkbox"],
input[type="image"],
input[type="radio"],
input[type="reset"],
select,
button {
cursor: pointer
}
textarea,
input[type="text"],
input[type="password"],
select {
border: 1px solid #c8c8c8;
background: #fff
}
textarea:hover,
input[type="text"]:hover,
input[type="password"]:hover,
select:hover {
border-color: #aaa
}
textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
select:focus {
border-color: #8c8c8c;
outline: 2px solid #dcdcdc
}
h1,
h2,
h3,
h4,
h5,
h6 {
margin-bottom: 10px;
font-weight: normal
}
h1 {
font-size: 36px;
line-height: 36px;
margin-top: 25px
}
h2 {
font-size: 24px;
line-height: 24px;
margin-top: 25px
}
h3 {
font-size: 18px;
line-height: 18px;
margin-top: 15px
}
h4 {
font-size: 16px;
line-height: 16px;
margin-top: 15px
}
h5 {
font-size: 14px;
line-height: 20px;
margin-top: 10px
}
h6 {
font-size: 14px;
line-height: 14px;
margin-top: 10px
}
hr {
margin: 15px 0 15px 0;
display: block;
background: #c8c8c8;
height: 1px;
border: none
}
q {
font-style: italic
}
blockquote {
margin: 10px 0 10px 15px;
font-style: italic;
font-size: 130%
}
blockquote>*:first-child:first-letter {
font-size: 150%
}
pre {
margin: 10px 0 10px 0px;
padding: 5px 0 5px 10px;
border: 1px dotted #aab4be;
border-left: 20px solid #b4b4b4;
background: #fafafa;
font-size: 90%;
color: #2e8b57;
font-family: "Courier New", Courier, monospace;
white-space: pre-wrap
}
acronym,
abbr {
border-bottom: 1px dashed #969696;
cursor: help;
font-variant: small-caps;
text-transform: lowercase
}
/****** reset end *****/
/***** layout.css ****/
@import url(my_editor.css);
body {
font-family: Verdana;
font-size: 12px;
font-size: 14px;
line-height: 150%;
color: #646464
}
.wrapper {
margin: auto
}
#header {
position: relative;
z-index: 10;
height: 195px;
clear: both
}
#top {
overflow: hidden;
clear: both
}
#top .topbox {
margin-top: 15px
}
#middle {
padding: 15px 0px 15px 0px;
clear: both
}
#bottom {
overflow: hidden;
clear: both
}
#bottom .bottombox {
padding-bottom: 15px
}
#footer {
position: relative;
margin: 0px 70px 0px 70px;
padding-bottom: 15px;
clear: both;
text-align: center;
color: #fff
}
#middle {
width: 100%;
/*overflow: hidden;*/
position: relative
}
#middle-expand {
width: 100%
}
#middle-expand #main {
left: 0!important;
width: 75%!important
}
#right {
margin-left: 10px!important;
width: 200px
}
#main {
position: relative;
left: 50%;
width: 50%;
float: left
}
#wp-page .site-content {
width: 100%!important
}
#main-shift {
position: relative;
margin-right: 0!important;
overflow: hidden
}
.wrapper #main {
width: 100%!important
}
#left {
position: relative;
left: -50%;
float: left;
overflow: hidden
}
#right {
float: left;
overflow: hidden
}
div#maintop,
div#contenttop {
margin: 0px 0px 15px 0px;
overflow: hidden
}
div#contentbottom,
div#mainbottom {
margin: 15px 0px 0px 0px;
overflow: hidden
}
#wp-page #main {
width: 100%!important
}
#mainmiddle {
width: 100%;
overflow: hidden;
position: relative
}
#mainmiddle-expand {
width: 100%
}
#content {
position: relative;
width: 100%;
float: left
}
#content-shift {
position: relative;
overflow: hidden
}
#contentleft {
position: relative;
left: -50%;
float: left;
overflow: hidden
}
#contentright {
float: left;
overflow: hidden
}
.floatbox {
overflow: hidden
}
.float-left {
float: left;
overflow: hidden
}
.float-right {
float: right;
overflow: hidden
}
.width15 {
width: 15%
}
.width18 {
width: 18%
}
.width20 {
width: 20%
}
.width23 {
width: 23%
}
.width25 {
width: 25%
}
.width33 {
width: 33%
}
.width34 {
width: 34%
}
.width35 {
width: 35%
}
.width40 {
width: 40%
}
.width46 {
width: 46%
}
.width50 {
width: 50%
}
.width54 {
width: 54%
}
.width65 {
width: 65%
}
.width75 {
width: 75%
}
.width100 {
width: 100%
}
body.yoopage {
background: #2465b5;
background-image:url('../images/big-mainbg.jpg');
background-repeat: no-repeat;
background-attachment: fixed;
background-size: cover;
/*overflow: hidden;*/
overflow: visible;
}
#page-body {
/*background: #000 url(../images/page_bg_t.png) 0 0 repeat-x;*/
}
#page-footer {
/*padding-top: 15px;
background: url(../images/page_bg_b.png) 0 0 repeat-x*/
padding-top: 15px;
background-image: url(../images/page_bg_b.png);
float: left;
width: 100%;
background-repeat: repeat-x;
background-color: #2465b5;
}
.wrapper-body {
padding: 0px 50px 0px 85px
}
#absolute {
position: absolute;
z-index: 15;
top: 0px;
left: 0px;
width: 100%
}
#breadcrumbs {
position: absolute;
top: 9px;
left: 15px;
right: 15px;
height: 19px;
overflow: hidden;
font-size: 85%
}
#breadcrumbs a,
#breadcrumbs span {
display: block;
float: left
}
#breadcrumbs a,
#breadcrumbs span.separator {
margin-right: 10px
}
#breadcrumbs .box-1 {
background: url(../images/breadcrumbs.png) 0 0 no-repeat;
color: #fff;
text-shadow: 0px 1px 2px #646464
}
#breadcrumbs a:hover {
text-shadow: 0px -1px 3px #646464
}
#breadcrumbs .box-2 {
padding: 0px 10px 0px 10px;
background: url(../images/breadcrumbs.png) 100% -24px no-repeat
}
#breadcrumbs .box-3 {
height: 19px;
background: url(../images/breadcrumbs.png) 0 -48px repeat-x
}
#toolbar {
height: 25px;
padding: 0px 70px 0px 70px;
padding: 0px;
overflow: hidden;
line-height: 28px;
font-size: 9px;
font-size: 14px;
color: #464646;
color: #fff;
}
#date {
padding: 0px 10px 0px 10px;
background: url(../images/toolbar_separator.png) 0 0 no-repeat;
float: left
}
#toolbar .left {
background: url(../images/toolbar_separator.png) 0 0 no-repeat;
float: left
}
#toolbar .right {
background: url(../images/toolbar_separator.png) 100% 0 no-repeat;
float: right
}
#headerbar {
height: 95px;
padding: 0px 70px 0px 370px;
padding-left: 220px;
overflow: hidden
}
#menubar {
background: url(../images/menubar_bg.png) 0 0 no-repeat
}
#menubar div.menubar-2 {
padding: 0px 70px 0px 70px;
background: url(../images/menubar_bg.png) 100% -80px no-repeat
}
#menubar div.menubar-3 {
background: url(../images/menubar_bg.png) 0 -160px repeat-x
}
#menubar div.menubar-4 {
height: 75px;
background: url(../images/menubar_shadow.png) 50% 100% no-repeat
}
#logo {
position: absolute;
top: 50px;
left: 100px
}
#menu {
position: absolute;
top: 124px;
left: 70px;
z-index: 11
}
#search {
position: absolute;
top: 136px;
right: 70px;
z-index: 12;
width: 120px;
height: 22px;
padding: 4px 4px 0px 4px;
background: url(../images/search_bg.png) 0 0 no-repeat
}
#banner {
position: absolute;
top: 210px;
right: 55px;
width: 0px;
z-index: 3
}
#footer a:link,
#footer a:visited {
color: #fff
}
#footer a:hover {
color: #fff
}
#footer a.anchor {
position: absolute;
right: 0px;
top: 3px;
width: 30px;
height: 5px;
background: url(../images/footer_anchor.png) 0 -10px no-repeat;
display: block;
text-decoration: none
}
div.content-wrapper-t1 {
position: relative;
background: url(../images/content_wrapper_corners.png) 0 0 no-repeat
}
div.content-wrapper-t2 {
padding: 0px 40px 0px 40px;
background: url(../images/content_wrapper_corners.png) 100% -55px no-repeat
}
div.content-wrapper-t3 {
height: 50px;
background: url(../images/content_wrapper_corners.png) 0 -110px repeat-x
}
div.content-wrapper-1 {
background: #fff url(../images/content_wrapper_edges_without.png) 0 0 repeat-y
}
div.content-wrapper-2 {
padding: 0px 15px 0px 15px;
background: url(../images/content_wrapper_edges_without.png) 100% 0 repeat-y
}
div.content-wrapper-b1 {
background: url(../images/content_wrapper_corners.png) 0 -165px no-repeat
}
div.content-wrapper-b2 {
padding: 0px 40px 0px 40px;
background: url(../images/content_wrapper_corners.png) 100% -190px no-repeat
}
div.content-wrapper-b3 {
height: 20px;
background: url(../images/content_wrapper_corners.png) 0 -215px repeat-x
}
.column-contentleft div.content-wrapper-t1 {
background-position: 0 -240px
}
.column-contentleft div.content-wrapper-1 {
background-image: url(../images/content_wrapper_edges_with.png)
}
.column-contentleft div.content-wrapper-b1 {
background-position: 0 -350px
}
.column-contentright div.content-wrapper-t2 {
background-position: 100% -295px
}
.column-contentright div.content-wrapper-2 {
background-image: url(../images/content_wrapper_edges_with.png)
}
.column-contentright div.content-wrapper-b2 {
background-position: 100% -375px
}
.column-contentleft div.content-wrapper-t2,
.column-contentleft div.content-wrapper-b2 {
padding-left: 215px
}
.column-contentright div.content-wrapper-t2,
.column-contentright div.content-wrapper-b2 {
padding-right: 215px
}
.column-contentleft div.content-wrapper-2 {
padding-left: 1px
}
.column-contentright div.content-wrapper-2 {
padding-right: 1px
}
#mainmiddle {
margin-top: -15px
}
#content {
margin-top: 15px
}
/******* layout.css end ******/
/********Typography.css start********/
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: Arial, Helvetica, sans-serif
}
.h1,
h1 {
font-weight: 400;
color: #0671ad
}
#page .h1 a,
#page h1 a {
color: #0671ad;
text-decoration: none
}
.h2,
h2 {
color: #50555a
}
.h3,
h3 {
color: #0671ad
}
.h4,
h4 {
color: #50555a
}
.h5,
h5 {
color: #0671ad
}
.h6,
h6 {
color: #50555a
}
a:link,
a:visited {
color: #0671ad
}
a:hover {
color: #00a3ff
}
a.icon-folder {
padding-left: 17px;
background: url(../images/typography/icon_folder.png) 0 40% no-repeat
}
a.icon-file {
padding-left: 17px;
background: url(../images/typography/icon_file.png) 0 40% no-repeat
}
a.icon-download {
padding-left: 17px;
background: url(../images/typography/icon_download.png) 0 40% no-repeat
}
a.icon-external {
padding-left: 17px;
background: url(../images/typography/icon_external.png) 0 40% no-repeat
}
a.icon-pdf {
padding-left: 17px;
background: url(../images/pdf_button.png) 0 40% no-repeat
}
em.box {
padding: 0 3px 0 3px;
border: 1px dotted #aaa;
background: #f5f6f7;
font-family: "Courier New", Courier, monospace;
font-style: normal
}
ul.arrow,
ul.check,
ul.checkbox,
ul.star {
margin: 10px 0 10px 0;
padding-left: 20px;
list-style: none
}
ul.arrow li,
ul.check li,
ul.checkbox li,
ul.star li {
margin: 5px 0 5px 0;
padding-left: 35px;
font-weight: 700;
line-height: 26px
}
ul.arrow li {
background: url(../images/typography/list_arrow.png) 0 0 no-repeat
}
ul.checkbox li {
background: url(../images/typography/list_checkbox.png) 0 0 no-repeat
}
ul.check li {
background: url(../images/typography/list_check.png) 0 0 no-repeat
}
ul.star li {
background: url(../images/typography/list_star.png) 0 0 no-repeat
}
ul.table {
margin: 20px 0 20px 0;
padding-left: 0;
list-style: none
}
ul.table li {
padding: 5px;
border-bottom: 1px solid #c8c8c8
}
ul.table li:nth-child(odd) {
background: #fafafa
}
ul.table li:nth-child(even) {
background: #fff
}
ul.table li:last-child {
border: none
}
ol.disc {
margin: 10px 0 10px 0;
padding: 0 0 0 45px;
background: url(../images/typography/list_disc.png) 20px 0 repeat-y
}
ol.disc li {
margin: 5px 0 5px 0;
padding-left: 10px;
font-weight: 700;
line-height: 26px
}
hr.dotted {
margin: 15px 0 15px 0;
display: block;
background: url(../images/typography/line_dotted.png) 0 0 repeat-x;
height: 1px;
border: none
}
span.alert,
span.download,
span.info,
span.note,
span.tip {
display: block
}
div.note,
span.note {
margin: 10px 0 10px 0;
padding: 5px 10px 5px 10px;
background: #f4f5f6;
border-top: 1px dotted #aab4be;
border-bottom: 1px dotted #aab4be;
text-align: justify
}
div.alert,
div.download,
div.info,
div.tip,
span.alert,
span.download,
span.info,
span.tip {
margin: 10px 0 10px 0;
padding: 8px 10px 8px 35px
}
div.info,
span.info {
background: #f4f5f6 url(../images/typography/box_info.png) 3px 5px no-repeat;
border-top: 1px dotted #aab4be;
border-bottom: 1px dotted #aab4be
}
div.alert,
span.alert {
background: #dff0d8 url(../images/typography/box_success.png) 3px 5px no-repeat;
border-top: 1px dotted #dff0d8;
border-bottom: 1px dotted #dff0d8
}
div.download,
span.download {
background: #f5faeb url(../images/typography/box_download.png) 3px 5px no-repeat;
border-top: 1px dotted #78be5a;
border-bottom: 1px dotted #78be5a
}
div.tip,
span.tip {
background: #fffdeb url(../images/typography/box_tip.png) 3px 5px no-repeat;
border-top: 1px dotted #ffc864;
border-bottom: 1px dotted #ffc864
}
h4.alert-heading {
display: inline-block;
margin-top: 0
}
.alert-message a.close {
display: none
}
p.dropcap:first-letter {
display: block;
margin: 7px 4px 0 0;
float: left;
font-size: 280%;
font-family: Georgia, "Times New Roman", Times, serif
}
table.listing {
width: 100%;
margin-bottom: 30px;
font-size: 11px
}
table.listing thead th {
height: 30px;
padding: 5px;
border-bottom: 1px solid #c8c8c8;
background: 0 0;
vertical-align: top;
font-size: 14px;
font-weight: 400
}
table.listing tbody td {
height: 20px;
padding: 5px;
border-bottom: 1px solid #c8c8c8
}
table.listing tr.odd td {
background: #fafafa
}
table.listing tr.even td {
background: #fff
}
table.listing td.bold {
font-weight: 700;
font-size: 12px;
}
q.blockquote {
margin: 10px 0 10px 15px;
font-style: italic;
font-size: 130%
}
q.blockquote:first-letter {
font-size: 150%
}
q.blockquote:after,
q.blockquote:before {
content: ""
}
blockquote.quotation {
margin: 10px 0 10px 0;
padding: 10px 35px 10px 35px;
border: none;
background: url(../images/typography/blockquote_start.png) 0 0 no-repeat;
text-align: justify
}
blockquote.quotation p {
margin: 0 -35px -10px 0;
padding: 0 35px 10px 0;
background: url(../images/typography/blockquote_end.png) 100% 100% no-repeat
}
body .inset-left {
margin: 15px 15px 10px 0;
float: left
}
body .inset-right {
margin: 15px 0 10px 15px;
float: right
}
/********Typography.css end********/
/****** Menu.css start *****/
#footer ul.menu,
#toolbar ul.menu {
display: inline-block;
margin: 0;
padding: 0;
list-style: none
}
#footer ul.menu {
display: block;
line-height: 14px
}
#footer .menu li,
#toolbar .menu li {
display: inline-block;
margin: 0;
padding: 0
}
#footer .menu li a,
#toolbar .menu li a {
display: inline-block;
padding: 0 10px 0 10px;
background: url(../images/toolbar_separator.png) 0 0 no-repeat;
overflow: hidden
}
#footer .menu li a {
background: url(../images/topmenu_item_bg_white.png) 0 50% no-repeat
}
#footer .menu a.first,
#toolbar .menu a.first {
padding: 0 10px 0 0;
background: 0 0
}
#footer .menu a.last,
#toolbar .menu a.last {
padding: 0 0 0 10px
}
#toolbar .menu a:link,
#toolbar .menu a:visited {
/*color: #464646*/
color: #fff;
}
#toolbar .menu a:hover {
/*color: #000*/
color: #39ff08;
}
#footer .menu a:link,
#footer .menu a:visited {
color: #fff
}
#footer .menu a:hover {
color: #fff
}
#menu ul {
margin: 0;
padding: 0;
list-style: none
}
#menu li {
position: relative;
z-index: 5;
margin: 0;
padding: 0
}
#menu a,
#menu span {
display: block
}
#menu a {
text-decoration: none
}
#menu span.icon {
background-repeat: no-repeat;
background-position: 0 50%
}
#menu ul.menu {
padding-left: 2px;
background: url(../images/menu_level1_item.png) 0 0 no-repeat;
float: left
}
#menu li.level1 {
float: left
}
#menu a.level1,
#menu span.level1 {
float: left
}
#menu a.level1 span.bg,
#menu span.level1 span.bg {
height: 51px;
padding: 0 20px 0 18px;
background: url(../images/menu_level1_item.png) 100% 0 no-repeat;
float: left;
line-height: 50px;
font-size: 18px;
color: #323232;
text-shadow: 1px 1px 0 #fff
}
#menu li:hover .level1 span.bg {
color: #000;
text-shadow: 0 1px 0 #fff, 0 2px 5px #969696
}
#menu li.remain .level1 span.bg {
color: #000;
text-shadow: 0 1px 0 #fff, 0 2px 5px #969696
}
#menu li.active .level1 span.bg {
color: #0671ad
}
#menu a.level1 span.title,
#menu span.level1 span.title {
font-size: 18px;
line-height: 40px
}
#menu a.level1 span.subtitle,
#menu span.level1 span.subtitle {
margin-top: -10px;
font-size: 9px;
font-weight: 400;
color: #323232;
line-height: 10px;
text-transform: none;
letter-spacing: 0;
text-shadow: 1px 1px 1px #fff
}
#menu li:hover .level1 span.subtitle {
color: #000;
text-shadow: 0 1px 0 #fff, 0 2px 5px #969696
}
#menu li.remain .level1 span.subtitle {
color: #000;
text-shadow: 0 1px 0 #fff, 0 2px 5px #969696
}
#menu li.active .level1 span.subtitle {
color: #015b8e
}
div#menu div.fancy {
position: absolute;
top: 0;
visibility: hidden;
z-index: 4;
overflow: hidden
}
div#menu div.fancy div.fancy-1 {
padding-right: 2px;
background: url(../images/menu_fancy.png) 0 0 no-repeat
}
div#menu div.fancy div.fancy-2 {
padding: 0 18px 0 20px;
background: url(../images/menu_fancy.png) 100% -56px no-repeat
}
div#menu div.fancy div.fancy-3 {
height: 51px;
background: url(../images/menu_fancy.png) 0 -112px repeat-x
}
#menu .dropdown {
position: absolute;
top: 51px;
left: -999em;
z-index: 100
}
#menu li.remain .dropdown,
#menu li:hover .dropdown {
left: -8px
}
#menu .dropdown-t1 {
background: url(../images/menu_dropdown_corners.png) 0 0 no-repeat
}
#menu .dropdown-t2 {
padding: 0 8px 0 15px;
background: url(../images/menu_dropdown_corners.png) 100% -15px no-repeat
}
#menu .dropdown-t3 {
height: 10px;
background: #fafafa
}
#menu .dropdown-1 {
background: url(../images/menu_dropdown_edges.png) 0 0 repeat-y
}
#menu .dropdown-2 {
padding: 0 8px 0 8px;
background: url(../images/menu_dropdown_edges.png) 100% 0 repeat-y
}
#menu .dropdown-3 {
padding: 0 7px 0 7px;
background: #fafafa;
overflow: hidden
}
#menu .dropdown-b1 {
background: url(../images/menu_dropdown_corners.png) 0 -30px no-repeat
}
#menu .dropdown-b2 {
padding: 0 15px 0 15px;
background: url(../images/menu_dropdown_corners.png) 100% -50px no-repeat
}
#menu .dropdown-b3 {
height: 15px;
background: url(../images/menu_dropdown_corners.png) 0 -70px repeat-x
}
#menu li.level2 {
margin-bottom: 5px
}
#menu li.level1 li.last {
margin-bottom: 0
}
#menu .hover-box1 {
border: 1px solid #d2d7dc;
background: #fff;
overflow: hidden
}
#menu .hover-box1:hover {
border: 1px solid #b4b9be;
border-right-color: #d2d7dc;
border-bottom-color: #d2d7dc;
background: #f5f6f7
}
#menu li.separator .hover-box1:hover {
border: 1px solid #d2d7dc;
background: #fff
}
#menu a.level2 span.bg,
#menu span.level2 span.bg {
min-height: 45px;
line-height: 45px;
text-indent: 10px;
color: #323232;
font-size: 15px;
text-shadow: 1px 1px 1px #c8c8c8
}
#menu .hover-box1:hover a.level2 span.bg {
text-shadow: 1px 1px 0 #fff
}
#menu a.level2 span.icon,
#menu span.level2 span.icon {
text-indent: 50px
}
#menu li.level2 a.current span.bg {
font-weight: 700
}
#menu a.level2 span.title,
#menu span.level2 span.title {
line-height: 33px
}
#menu a.level2 span.subtitle,
#menu span.level2 span.subtitle {
margin-top: -6px;
padding-bottom: 10px;
font-size: 10px;
font-weight: 400;
color: #646464;
line-height: 12px;
text-transform: none;
letter-spacing: 0;
text-shadow: none
}
#menu .sub {
padding: 5px 0 5px 0
}
#menu ul.level3 {
padding-left: 12px
}
#menu a.level3:hover {
text-decoration: underline
}
#menu a.level3 span.bg,
#menu span.level3 span.bg {
padding-left: 10px;
background: url(../images/menu_level3_item.png) 1px 5px no-repeat;
line-height: 17px;
font-size: 11px
}
#menu .columns2 ul.level2,
#menu .columns3 ul.level2,
#menu .columns4 ul.level2 {
float: left
}
#menu .columns2 ul.level2 {
width: 50%
}
#menu .columns3 ul.level2 {
width: 34%
}
#menu .columns3 ul.first,
#menu .columns3 ul.last {
width: 33%
}
#menu .columns4 ul.level2 {
width: 25%
}
#menu .columns2 li.level2 .group-box1,
#menu .columns3 li.level2 .group-box1,
#menu .columns4 li.level2 .group-box1 {
margin-right: 5px
}
#menu .columns2 ul.last li.level2 .group-box1,
#menu .columns3 ul.last li.level2 .group-box1,
#menu .columns4 ul.last li.level2 .group-box1 {
margin-right: 0
}
div.mod-menu ul {
margin: 0;
padding: 0;
overflow: hidden;
list-style: none
}
div.mod-menu ul.menu li {
margin: 0;
padding: 0
}
div.mod-menu ul.menu a,
div.mod-menu ul.menu span {
display: block
}
div.mod-menu ul.menu a {
text-decoration: none
}
div.mod-menu ul.menu span.icon {
background-repeat: no-repeat;
background-position: 5px 50%;
text-indent: 35px
}
div.mod-menu ul.menu li.parent span.separator {
cursor: pointer
}
div.mod-menu ul.menu span.subtitle {
display: none
}
div.mod-black ul.menu span.bg {
height: 25px;
line-height: 24px;
text-indent: 35px;
color: #646464;
text-shadow: 0 1px 0 #fff, 0 2px 2px #c8c8c8
}
div.mod-black ul.menu a.current span.bg {
font-weight: 700
}
div.mod-black ul.menu li.level1 {
background: #fafbfc url(../images/submenu_level2_bg.png) 0 0 repeat-x
}
div.mod-black ul.menu a.level1,
div.mod-black ul.menu span.level1 {
background: #fff url(../images/submenu_level1_item.png) 0 0 no-repeat
}
div.mod-black ul.menu li.parent a.level1 span.bg,
div.mod-black ul.menu li.parent span.level1 span.bg {
background: url(../images/submenu_level1_parent.png) 100% 0 no-repeat
}
div.mod-black ul.menu li.parent a.active span.bg,
div.mod-black ul.menu li.parent span.active span.bg {
background-position: 100% -25px
}
div.mod-black ul.menu ul.level2 {
padding: 2px 0 5px 0;
border-bottom: 1px solid #d8dadc
}
div.mod-black ul.menu li.level2 span.bg {
height: 20px;
line-height: 20px
}
div.mod-black ul.menu a.level2 span.bg {
text-indent: 35px
}
div.mod-black ul.menu a.level3 span.bg {
text-indent: 45px
}
div.mod-black ul.menu a.level4 span.bg {
text-indent: 55px
}
div.mod-band ul.menu {
border-bottom: 1px solid #cfd1d3
}
div.mod-band ul.menu span.bg {
color: #646464;
text-shadow: 0 1px 0 #fff, 0 2px 2px #c8c8c8
}
div.mod-band ul.menu .level1 .level1 span.bg {
height: 23px;
border-top: 1px solid #cfd1d3;
border-bottom: 1px solid #fafbfb;
line-height: 23px;
text-indent: 15px
}
div.mod-band ul.menu li.first .level1 span.bg {
border-top: none
}
div.mod-band ul.menu li.parent a.level1 span.bg,
div.mod-band ul.menu li.parent span.level1 span.bg {
background: url(../images/submenu_level1_parent.png) 100% 0 no-repeat
}
div.mod-band ul.menu li.parent a.active span.bg,
div.mod-band ul.menu li.parent span.active span.bg {
background-position: 100% -25px
}
div.mod-band ul.menu ul.level2 {
padding: 2px 0 5px 0;
border-top: 1px solid #cfd1d3;
border-bottom: 1px solid #fafbfb;
background: #f0f3f5
}
div.mod-band ul.menu .level2 span.bg {
height: 20px;
line-height: 20px;
text-indent: 25px
}
div.mod-band ul.menu a.current span.bg {
font-weight: 700
}
/***** Menu.css end *****/
h1,
h2 {
color: #0671AD
}
#top h1,
h4,
h6 {
color: #50555A
}
h3,
h5 {
color: #071A71
}
#logo,
#menu {
left: 70px;
position: absolute
}
#logo,
#menu,
#menu .dropdown,
#social {
position: absolute
}
div.module div.yoo-gallery {
margin: 15px auto 5px;
width: 600px
}
body {
font: Verdana
}
#page-body {
/*background:url(../images/custom_bg.png) repeat-x #f1deab*/
background-image: url(../images/custom_bg.png);
background-repeat: repeat-x;
}
h1 {
font-weight: 400
}
#top h1 {
font-size: 30px
}
#page h1 a {
color: #857140;
text-decoration: none
}
h2 {
font-size: 20px
}
h3 {
font-size: 16px
}
#header_right .header_text {
font-size: 16px;
color: #857140;
text-shadow: 1px 1px 0 #fff, 2px 2px 3px #6e6e6e
}
blockquote {
background: #cdd2eb;
border: none;
border-radius: 0;
margin: 0 auto!important;
width: 90%;
font-family: Verdana;
clear: both
}
span.blue_highlight {
color: #071A71
}
span.yellow_highlight {
background-color: #FFF700
}
a:link,
a:visited {
color: #0084ce;
text-decoration: underline
}
a:hover {
color: #696969
}
#logo {
top: 20px
}
#logo_image {
margin-left: -35px;
margin-top: 30px
}
#header_right {
padding-top: 2px;
margin-right: 20px;
margin-top: 20px
}
#headerbar .right .module {
margin-left: 0;
margin-right: 30px;
margin-top: -35px;
float: right
}
#menu {
top: 121px;
z-index: 11
}
#menubar {
background: url(../images/menubar_bg_custom.png) no-repeat
}
#menubar div.menubar-2 {
padding: 0 70px;
background: url(../images/menubar_bg_custom.png) 100% -80px no-repeat
}
#menubar div.menubar-3 {
background: url(../images/menubar_bg_custom.png) 0 -160px repeat-x
}
#menubar div.menubar-4 {
height: 75px;
background: url(../images/menubar_shadow.png) 50% 100% no-repeat
}
#menu li.active .level1 span.bg {
color: #FFD673
}
#menu ul.menu {
padding-left: 2px;
background: url(../images/menu_level1_item_custom.png) no-repeat;
float: left
}
#menu a.level1 span.bg,
#menu span.level1 span.bg {
height: 59px;
background: url(../images/menu_level1_item_custom.png) 100% 0 no-repeat;
float: left;
line-height: 55px;
font-size: 18px;
color: #FFF;
text-shadow: 1px 1px 0 #323232
}
#menu .dropdown {
top: 59px;
left: -999em;
z-index: 100
}
#menu li:hover .level1 span.bg {
color: #323232;
text-shadow: 0 2px 5px #969696, 0 1px 0 #FFF
}
div#menu div.fancy div.fancy-1 {
padding-right: 2px;
background: url(../images/menu_fancy_custom.png) no-repeat
}
div#menu div.fancy div.fancy-2 {
padding: 0 18px 0 20px;
background: url(../images/menu_fancy_custom.png) 100% -66px no-repeat
}
div#menu div.fancy div.fancy-3 {
height: 59px;
background: url(../images/menu_fancy_custom.png) 0 -132px repeat-x
}
#menu .dropdown-t1 {
background: url(../images/menu_dropdown_corners_custom.png) no-repeat
}
#menu .dropdown-t2 {
padding: 0 8px 0 15px;
background: url(../images/menu_dropdown_corners_custom.png) 100% -15px no-repeat
}
#menu .dropdown-t3 {
height: 10px;
background: #f6d993
}
#menu .dropdown-1 {
background: url(../images/menu_dropdown_edges_custom.png) repeat-y
}
#menu .dropdown-2 {
padding: 0 8px;
background: url(../images/menu_dropdown_edges_custom.png) 100% 0 repeat-y
}
#menu .dropdown-3 {
padding: 0 7px;
background: #f6d993;
overflow: hidden
}
#menu .dropdown-b1 {
background: url(../images/menu_dropdown_corners_custom.png) 0 -30px no-repeat
}
#menu .dropdown-b2 {
padding: 0 15px;
background: url(../images/menu_dropdown_corners_custom.png) 100% -50px no-repeat
}
#menu .dropdown-b3 {
height: 15px;
background: url(../images/menu_dropdown_corners_custom.png) 0 -70px repeat-x
}
#menu .hover-box1 {
border: 1px solid #c3a866;
background: #faf8de;
overflow: hidden
}
#menu .hover-box1:hover {
border: 1px solid #7680a4;
border-right-color: #d2d7dc;
border-bottom-color: #d2d7dc;
background: #bed0e4
}
#menu li.separator .hover-box1:hover {
border: 1px solid #c3a866;
background: #faf8de
}
#slideshow_image,
#slideshow_text {
position: relative;
width: 170px
}
#five_step_list {
float: left;
width: 265px;
padding: 5px
}
#water_for_life_list {
float: right;
width: 265px;
padding: 5px
}
#email_list_divider {
float: left;
width: 15px;
height: 260px;
border-right: solid thin #50555A
}
#social {
background: url(../images/social_bg.png) no-repeat;
z-index: 20;
top: 243px;
left: 50%;
width: 105px;
height: 356px;
margin-left: -525px
}
#social_inner {
position: relative;
width: 32px;
float: left;
margin-top: 12px;
margin-left: 5px
}
.social_separator_line {
background: url(../images/social_separator.png);
position: relative;
width: 98px;
height: 5px
}
#social_media {
background: url(../images/social_media.png);
position: relative;
float: left;
width: 32px;
height: 240px
}
#social_blog {
margin: 0 32px 10px
}
#social_fb {
height: 105px;
margin: 0 20px -20px 12px;
}
#social_google {
margin: 10px 15px;
height: 25px
}
#social_twitter_button {
margin: 10px 17px
}
#social_twitter_text {
margin: -5px 3px;
font-size: 9px
}
#social_in {
margin: 10px 32px
}
#social_youtube {
margin-top: 20px
}
#ecourse_submit {
position: relative;
float: left;
width: 70px
}
#ecourse_only {
position: relative;
float: left;
font-size: 12px;
width: 90px
}
#ecourse_message {
position: relative;
clear: both
}
.componentheading,
.contentheading {
color: #0671AD;
font-family: Verdana;
font-size: 150%;
font-weight: 700;
letter-spacing: -1px;
line-height: 100%;
margin: 0;
padding: 5px 0
}
.m4j_header_text {
font-size: 12px;
font-weight: 400;
color: #646464
}
.m4j_form_wrap {
width: 600px
}
input#email,
input#name {
padding: 5px 15px
}
input#btn {
padding: 5px;
margin: 10px 10px 10px 0
}
.form-pure {
margin-left: 195px
}
.submission label {
font-weight: 700;
display: block;
margin-top: 10px
}
.submission input {
width: 50%;
padding: 7px;
margin-top: 5px
}
.submission textarea {
width: 50%;
padding: 7px;
height: 100px
}
/****** Modal.css Start ***/
.module h3.header {
margin: 0;
padding: 0;
font-size: 16px;
color: #323232;
font-weight: 400
}
.module span.header-2,
.module span.header-3 {
display: block
}
.module h3.header span.title {
display: block;
font-size: 15px;
line-height: 27px
}
.module h3.header span.subtitle {
display: block;
margin-top: -5px;
line-height: 10px;
font-size: 9px;
font-weight: 400;
color: #646464;
letter-spacing: 0;
text-indent: 1px
}
div.separator .module {
margin: 0 15px 0 0
}
#contentleft .module,
#contentright .module,
#left .module,
#right .module {
margin-bottom: 15px
}
#contentleft .last,
#contentright .last,
#left .last,
#right .last {
margin-bottom: 0
}
#top .topblock .module {
margin: 15px 0 0 0
}
#bottom .bottomblock .module {
margin: 0 0 15px 0
}
#toolbar .left .module {
padding: 0 10px 0 10px;
background: url(../images/toolbar_separator.png) 100% 0 no-repeat;
float: left
}
#toolbar .right .module {
padding: 0 10px 0 10px;
background: url(../images/toolbar_separator.png) 0 0 no-repeat;
float: right
}
#headerbar .left .module {
margin-right: 15px;
float: left
}
#headerbar .right .module {
margin-left: 15px;
float: right
}
#contentleft .module,
#contentright .module {
margin-right: 12px;
margin-left: 12px
}
#contentleft div.mod-band,
#contentleft div.mod-line,
#contentleft div.mod-ridge {
margin-left: 0;
margin-right: 1px
}
#contentright div.mod-band,
#contentright div.mod-line,
#contentright div.mod-ridge {
margin-left: 1px;
margin-right: 0
}
div.module {
position: relative
}
div.module div.badge {
position: absolute;
top: 0;
right: 0;
width: 39px;
height: 39px;
background: url(../images/module_badges.png) 0 0 no-repeat;
overflow: hidden;
z-index: 1
}
div.module div.badge-hot {
background-position: 0 0
}
div.module div.badge-top {
background-position: 0 -40px
}
div.module div.badge-pick {
background-position: 0 -80px
}
div.module div.badge-new {
background-position: 0 -120px
}
div.module h3.header span.icon {
display: block;
position: relative;
left: -5px;
width: 30px;
height: 30px;
background: url(../images/module_icons.png) 0 0 no-repeat;
overflow: hidden;
float: left
}
div.module h3.header span.icon-feed {
background-position: 0 0
}
div.module h3.header span.icon-download {
background-position: 0 -30px
}
div.module h3.header span.icon-twitter {
background-position: 0 -60px
}
div.module h3.header span.icon-mail {
background-position: 0 -90px
}
div.module h3.header span.icon-message {
background-position: 0 -120px
}
div.module h3.header span.icon-users {
background-position: 0 -150px
}
div.module h3.header span.icon-shopping {
background-position: 0 -180px
}
div.module h3.header span.icon-lock {
background-position: 0 -210px
}
div.mod-blank {
overflow: hidden
}
#headerbar div.mod-blank {
padding-top: 15px
}
#menu ul.mod-dropdown {
padding-left: 0;
background: 0 0
}
#menu .mod-dropdown .module {
padding: 5px;
overflow: hidden
}
#menu .mod-dropdown .dropdown {
width: 300px
}
div.mod-headerbar div.box-1 {
background: url(../images/module_headerbar.png) 0 0 no-repeat
}
div.mod-headerbar div.box-2 {
padding: 0 10px 0 10px;
background: url(../images/module_headerbar.png) 100% -75px no-repeat
}
div.mod-headerbar div.box-3 {
height: 55px;
padding: 10px 0 5px 0;
background: url(../images/module_headerbar.png) 0 -150px repeat-x;
overflow: hidden
}
div.mod-rounded div.box-t1 {
background: url(../images/module_rounded_white_corners.png) 0 0 no-repeat
}
div.mod-rounded div.box-t2 {
padding: 0 10px 0 10px;
background: url(../images/module_rounded_white_corners.png) 100% -15px no-repeat
}
div.mod-rounded div.box-t3 {
height: 9px;
border-top: 1px solid #d2d2d2;
background: #fff
}
div.mod-rounded div.box-1 {
padding: 0 14px 0 14px;
border-left: 1px solid #d2d2d2;
border-right: 1px solid #d2d2d2;
background: #fff;
overflow: hidden
}
div.mod-rounded div.box-b1 {
background: url(../images/module_rounded_white_corners.png) 0 -30px no-repeat
}
div.mod-rounded div.box-b2 {
padding: 0 10px 0 10px;
background: url(../images/module_rounded_white_corners.png) 100% -45px no-repeat
}
div.mod-rounded div.box-b3 {
height: 9px;
border-bottom: 1px solid #d2d2d2;
background: #fff
}
div.mod-rounded h3.header {
height: 30px;
line-height: 27px;
text-shadow: 1px 1px 1px #c8c8c8
}
div.mod-rounded h3.header span.icon {
top: -2px
}
div.mod-rounded-grey div.box-t1 {
background-image: url(../images/module_rounded_grey_corners.png)
}
div.mod-rounded-grey div.box-t2 {
background-image: url(../images/module_rounded_grey_corners.png)
}
div.mod-rounded-grey div.box-1 {
padding: 0 1px 0 1px;
border-left: 1px solid #d2d2d2;
border-right: 1px solid #d2d2d2;
background: #fff
}
div.mod-rounded-grey div.box-2 {
padding: 0 13px 0 13px;
background: url(../images/module_rounded_grey_fading.png) 0 100% repeat-x;
overflow: hidden
}
div.mod-rounded-grey div.box-b1 {
background-image: url(../images/module_rounded_grey_corners.png)
}
div.mod-rounded-grey div.box-b2 {
background-image: url(../images/module_rounded_grey_corners.png)
}
div.mod-rounded-grey div.box-b3 {
height: 10px;
border: none;
background: url(../images/module_rounded_grey_corners.png) 0 -60px repeat-x
}
div.mod-rounded-grey em.box {
background: #fff
}
div.mod-rounded-header div.deepest {
padding: 30px 14px 0 14px
}
div.mod-rounded-header div.box-1 div.deepest {
padding: 30px 13px 0 13px
}
div.mod-rounded-header div.header-1 {
position: absolute;
top: 0;
left: 0;
right: 0;
background: url(../images/module_rounded_grey_header_grey.png) 0 0 no-repeat
}
div.mod-rounded-header div.header-2 {
padding: 0 30px 0 30px;
background: url(../images/module_rounded_grey_header_grey.png) 100% -45px no-repeat
}
div.mod-rounded-header div.header-3 {
height: 40px;
background: url(../images/module_rounded_grey_header_grey.png) 100% -90px repeat-x
}
div.mod-rounded-header h3.header {
position: absolute;
top: 0;
left: 0;
right: 0;
height: 40px;
padding-left: 15px;
line-height: 35px;
text-shadow: 0 1px 0 #fff, 0 2px 2px #c8c8c8;
overflow: hidden
}
div.mod-rounded-header h3.header span.icon {
top: 2px
}
div.mod-rounded-header-blue div.header-1 {
background-image: url(../images/module_rounded_grey_header_blue.png)
}
div.mod-rounded-header-blue div.header-2 {
background-image: url(../images/module_rounded_grey_header_blue.png)
}
div.mod-rounded-header-blue div.header-3 {
background-image: url(../images/module_rounded_grey_header_blue.png)
}
div.mod-rounded-header-blue h3.header {
color: #fff;
text-shadow: 0 1px 1px #323232
}
div.mod-rounded-header-blue h3.header span.subtitle {
color: #fff
}
div.mod-rounded-header-red div.header-1 {
background-image: url(../images/module_rounded_grey_header_red.png)
}
div.mod-rounded-header-red div.header-2 {
background-image: url(../images/module_rounded_grey_header_red.png)
}
div.mod-rounded-header-red div.header-3 {
background-image: url(../images/module_rounded_grey_header_red.png)
}
div.mod-rounded-header-red h3.header {
color: #fff;
text-shadow: 0 1px 1px #323232
}
div.mod-rounded-header-red h3.header span.subtitle {
color: #fff
}
div.mod-rounded-header-orange div.header-1 {
background-image: url(../images/module_rounded_grey_header_orange.png)
}
div.mod-rounded-header-orange div.header-2 {
background-image: url(../images/module_rounded_grey_header_orange.png)
}
div.mod-rounded-header-orange div.header-3 {
background-image: url(../images/module_rounded_grey_header_orange.png)
}
div.mod-rounded-header-orange h3.header {
color: #fff;
text-shadow: 0 1px 1px #323232
}
div.mod-rounded-header-orange h3.header span.subtitle {
color: #fff
}
div.mod-rounded-header-green div.header-1 {
background-image: url(../images/module_rounded_grey_header_green.png)
}
div.mod-rounded-header-green div.header-2 {
background-image: url(../images/module_rounded_grey_header_green.png)
}
div.mod-rounded-header-green div.header-3 {
background-image: url(../images/module_rounded_grey_header_green.png)
}
div.mod-rounded-header-green h3.header {
color: #fff;
text-shadow: 0 1px 1px #323232
}
div.mod-rounded-header-green h3.header span.subtitle {
color: #fff
}
div.mod-rounded-header-pink div.header-1 {
background-image: url(../images/module_rounded_grey_header_pink.png)
}
div.mod-rounded-header-pink div.header-2 {
background-image: url(../images/module_rounded_grey_header_pink.png)
}
div.mod-rounded-header-pink div.header-3 {
background-image: url(../images/module_rounded_grey_header_pink.png)
}
div.mod-rounded-header-pink h3.header {
color: #fff;
text-shadow: 0 1px 1px #323232
}
div.mod-rounded-header-pink h3.header span.subtitle {
color: #fff
}
div.mod-rounded-header-turquoise div.header-1 {
background-image: url(../images/module_rounded_grey_header_turquoise.png)
}
div.mod-rounded-header-turquoise div.header-2 {
background-image: url(../images/module_rounded_grey_header_turquoise.png)
}
div.mod-rounded-header-turquoise div.header-3 {
background-image: url(../images/module_rounded_grey_header_turquoise.png)
}
div.mod-rounded-header-turquoise h3.header {
color: #fff;
text-shadow: 0 1px 1px #323232
}
div.mod-rounded-header-turquoise h3.header span.subtitle {
color: #fff
}
div.mod-rounded-header-gold div.header-1 {
background-image: url(../images/module_rounded_grey_header_gold.png)
}
div.mod-rounded-header-gold div.header-2 {
background-image: url(../images/module_rounded_grey_header_gold.png)
}
div.mod-rounded-header-gold div.header-3 {
background-image: url(../images/module_rounded_grey_header_gold.png)
}
div.mod-rounded-header-gold h3.header {
color: #fff;
text-shadow: 0 1px 1px #323232
}
div.mod-rounded-header-gold h3.header span.subtitle {
color: #fff
}
div.mod-rounded-header-templatecolor div.header-1 {
background-image: url(../images/module_rounded_grey_header_blue.png)
}
div.mod-rounded-header-templatecolor div.header-2 {
background-image: url(../images/module_rounded_grey_header_blue.png)
}
div.mod-rounded-header-templatecolor div.header-3 {
background-image: url(../images/module_rounded_grey_header_blue.png)
}
div.mod-rounded-header-templatecolor h3.header {
color: #fff;
text-shadow: 0 1px 1px #323232
}
div.mod-rounded-header-templatecolor h3.header span.subtitle {
color: #fff
}
div.mod-black div.box-t1 {
background: url(../images/module_black.png) 0 0 no-repeat
}
div.mod-black div.box-t2 {
padding: 0 30px 0 30px;
background: url(../images/module_black.png) 100% -40px no-repeat
}
div.mod-black div.box-t3 {
height: 35px;
background: url(../images/module_black.png) 0 -80px repeat-x
}
div.mod-black div.box-1 {
padding: 10px 14px 10px 14px;
border-left: 1px solid #141414;
border-right: 1px solid #141414;
background: #141414 url(../images/module_black.png) 0 -150px repeat-x;
overflow: hidden;
color: #c8c8c8
}
div.mod-black div.box-b1 {
background: url(../images/module_black.png) 0 -120px no-repeat
}
div.mod-black div.box-b2 {
padding: 0 30px 0 30px;
background: url(../images/module_black.png) 100% -135px no-repeat
}
div.mod-black div.box-b3 {
height: 9px;
border-bottom: 1px solid #b6bfc6;
background: #dce1e6
}
div.mod-black h3.header {
position: absolute;
top: 0;
left: 0;
right: 0;
z-index: 1;
height: 35px;
padding-left: 15px;
line-height: 35px;
text-shadow: 0 1px 0 #fff, 0 2px 2px #c8c8c8;
overflow: hidden
}
div.mod-black h3.header span.icon {
top: 2px
}
div.mod-black em.box {
background: #323232;
border-color: #646464
}
div.mod-black h1,
div.mod-black h2,
div.mod-black h3,
div.mod-black h4,
div.mod-black h5,
div.mod-black h6 {
color: #fff;
text-shadow: none
}
div.mod-menu-black div.box-t1 {
background: url(../images/module_rounded_grey_header_grey.png) 0 0 no-repeat
}
div.mod-menu-black div.box-t2 {
background: url(../images/module_rounded_grey_header_grey.png) 100% -45px no-repeat
}
div.mod-menu-black div.box-t3 {
background: url(../images/module_rounded_grey_header_grey.png) 0 -90px repeat-x
}
div.mod-menu-black div.box-1 {
padding: 0;
border-left: 1px solid #d2d2d2;
border-right: 1px solid #d2d2d2;
background: #fff;
overflow: hidden;
color: #646464
}
div.mod-line div.box-1 {
padding: 5px 15px 10px 15px;
overflow: hidden
}
div.mod-line h3.header {
height: 30px;
padding-left: 15px;
line-height: 27px;
background: url(../images/module_line.png) 0 100% repeat-x;
text-shadow: 0 1px 0 #fff, 0 1px 5px #c8c8c8
}
div.mod-ridge div.box-1 {
padding: 5px 15px 10px 15px;
background: url(../images/module_ridge.png) 0 -27px repeat-x;
overflow: hidden
}
div.mod-ridge h3.header {
height: 30px;
padding-left: 15px;
line-height: 27px;
background: url(../images/module_ridge.png) 0 8px repeat-x;
text-shadow: 0 1px 0 #fff, 0 1px 5px #c8c8c8
}
div.mod-band {
margin-top: 5px
}
div.mod-band div.box-1 {
padding: 5px 15px 10px 15px;
background: url(../images/module_band_shadow.png) 50% 0 no-repeat;
overflow: hidden
}
div.mod-band h3.header {
background: url(../images/module_band_bg.png) 0 -70px repeat-x;
line-height: 29px;
text-shadow: 0 1px 0 #fff, 0 1px 5px #c8c8c8
}
div.mod-band span.header-2 {
background: url(../images/module_band_bg.png) 0 0 no-repeat
}
div.mod-band span.header-3 {
height: 30px;
padding-left: 15px;
background: url(../images/module_band_bg.png) 100% -35px no-repeat
}
div.mod-menu-band div.box-1 {
padding: 0 0 10px 0;
background: 0 0;
overflow: hidden
}
div.mod-polaroid div.badge-tape {
position: absolute;
top: -13px;
left: 50%;
width: 114px;
height: 38px;
margin-left: -57px;
background: url(../images/module_polaroid_tape.png) 0 0 no-repeat;
z-index: 1
}
div.mod-polaroid div.box-1 {
margin-top: 13px;
padding: 10px 10px 5px 10px;
border-top: 1px solid #c8c8c8;
border-left: 1px solid #c8c8c8;
border-right: 1px solid #c8c8c8;
background: #fff url(../images/module_polaroid_bg.png) 0 100% repeat-x;
overflow: hidden
}
div.mod-polaroid div.box-2 {
margin-bottom: 5px;
background: #000
}
div.mod-polaroid div.box-3 {
padding: 10px 15px 10px 15px;
overflow: hidden;
font-family: "Comic Sans MS", "Trebuchet MS", Arial, Helvetica, sans-serif;
font-style: italic;
color: #c8c8c8
}
div.mod-polaroid div.box-b1 {
background: url(../images/module_polaroid_shadows.png) 0 0 no-repeat
}
div.mod-polaroid div.box-b2 {
padding: 0 70px 0 70px;
background: url(../images/module_polaroid_shadows.png) 100% -5px no-repeat
}
div.mod-polaroid div.box-b3 {
height: 5px;
background: url(../images/module_polaroid_shadows.png) 0 -10px repeat-x
}
div.mod-polaroid h3.header {
height: 25px;
margin: 0;
font-size: 140%;
line-height: 25px;
text-align: center;
letter-spacing: -1px;
font-family: "Comic Sans MS", "Trebuchet MS", Arial, Helvetica, sans-serif;
font-style: italic;
color: #323232
}
div.mod-postit div.box-1 {
background: #ffa;
color: #323232
}
div.mod-postit div.box-2 {
padding: 15px 15px 0 15px;
overflow: hidden;
font-family: "Comic Sans MS", "Trebuchet MS", Arial, Helvetica, sans-serif;
font-style: italic
}
div.mod-postit div.box-b1 {
background: url(../images/module_postit_shadows.png) 0 0 no-repeat
}
div.mod-postit div.box-b2 {
padding: 0 90px 0 60px;
background: url(../images/module_postit_shadows.png) 100% -40px no-repeat
}
div.mod-postit div.box-b3 {
height: 40px;
background: url(../images/module_postit_shadows.png) 0 -80px repeat-x
}
div.mod-postit h3.header {
height: 30px;
margin: -15px -15px 5px -15px;
background: #ffffda;
font-size: 140%;
line-height: 30px;
text-indent: 15px;
letter-spacing: -1px;
font-family: "Comic Sans MS", "Trebuchet MS", Arial, Helvetica, sans-serif;
font-style: italic;
color: #323232
}
div.mod-tab {
padding: 15px 0 0 0
}
div.mod-tab div.box-1 {
background: url(../images/module_tab_l.png) 0 0 repeat-y
}
div.mod-tab div.box-2 {
background: url(../images/module_tab_t.png) 0 0 repeat-x
}
div.mod-tab div.box-3 {
background: url(../images/module_tab_tr.png) 100% 0 no-repeat
}
div.mod-tab div.box-4 {
padding: 20px 15px 10px 15px;
background: url(../images/module_tab_bl.png) 0 100% no-repeat
}
div.mod-tab h3.header {
position: absolute;
top: 0;
left: 0;
background: url(../images/module_tab_header.png) 0 0 no-repeat;
line-height: 30px
}
div.mod-tab span.header-2 {
padding: 0 20px 0 15px;
background: url(../images/module_tab_header.png) 100% -35px no-repeat
}
div.mod-tab span.header-3 {
height: 30px;
background: url(../images/module_tab_header.png) 0 -70px repeat-x
}
/****** Modal.css End ***/
blockquote {
padding: 1.714285714rem;
font-style: italic;
font-size: 14px;
color: #000;
}
#page .items.leading h1 a {
font-size: 25px;
color: rgb(33, 117, 155);
}
#right ul li {
padding: 8px 0px;
}
#toolbar .menu a.first {
padding: 0 0px 0 0;
}
#toolbar .menu li a {
padding: 0px;
background: none;
}
#toolbar .menu li {
padding: 0px 10px;
border-left: 2px solid #ddd;
}
#toolbar .right .module {
background: none;
}
#menu a.level2 span.bg,
#menu span.level2 span.bg {
min-height: 0px;
line-height: 0px;
}
#menu .hover-box4 {
padding: 22px 0px;
}
#menu li.level1 {
padding: 8px 20px;
border-right: 2px solid #ddd;
}
#menu a.level1 span.bg,
#menu span.level1 span.bg {
padding: 0 0px 0 0px;
background: none;
line-height: 39px;
height: 43px;
}
.item-list li {
padding: 7px 0px;
}
.pagination a {
margin: 5px 7px;
}
/*******************jAW Menu *****************/
/*
Copyright: (c) 2015 JoomlArtWork.com, http://joomlartwork.com/
*/
#jawnav {
z-index: 99999;
}
#jawnav,
#jawnav ul,
#jawnav ul li,
#jawnav ul li a,
#jawnav #menu-button {
margin: 0;
padding: 0;
border: 0;
list-style: none;
line-height: 1;
display: block;
position: relative;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
#jawnav:after,
#jawnav>ul:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
#jawnav #menu-button {
display: none;
}
#jawnav {
width: auto;
line-height: 1;
border-radius: 5px;
box-shadow: 0 1px 1px #e2e2e2;
}
#jawnav>ul>li {
float: left;
}
#jawnav.align-center>ul {
font-size: 0;
text-align: center;
}
#jawnav.align-center>ul>li {
display: inline-block;
float: none;
}
#jawnav.align-center ul ul {
text-align: left;
}
#jawnav.align-right>ul>li {
float: right;
}
#jawnav.align-right ul ul {
text-align: right;
}
#jawnav>ul>li>a {
padding: 20px;
text-decoration: none;
text-transform: uppercase;
box-sizing: border-box;
-webkit-transition: all 0.15s ease;
-moz-transition: all 0.15s ease;
-o-transition: all 0.15s ease;
transition: all 0.15s ease;
padding: 10px 20px 10px 20px;
margin: 10px 0px 10px 0px;
}
#jawnav>ul>li.has-sub>a {
padding-right: 25px;
}
#jawnav>ul>li.has-sub>a::after {
position: absolute;
top: 24px;
right: 10px;
width: 4px;
height: 4px;
content: "";
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
}
#jawnav ul ul {
position: absolute;
left: -9999px;
padding: 15px;
z-index: 1000;
margin-left: -15px;
}
#jawnav ul ul ul {
padding: 15px;
z-index: 1000;
margin-top: -25px;
}
#jawnav span.inner {
border-radius: 5px;
box-sizing: border-box;
display: block;
padding: 10px;
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.176);
}
#jawnav li:hover>ul {
left: auto;
}
#jawnav.align-right li:hover>ul {
right: 0;
}
#jawnav ul ul ul {
margin-left: 100%;
top: 0;
}
#jawnav.align-right ul ul ul {
margin-left: 0;
margin-right: 100%;
}
#jawnav ul ul li {}
#jawnav ul li:hover>ul>li {}
#jawnav ul ul li a {
padding: 15px 20px;
width: 220px;
text-decoration: none;
-webkit-transition: all 0.15s ease;
-moz-transition: all 0.15s ease;
-o-transition: all 0.15s ease;
transition: all 0.15s ease;
}
#jawnav ul ul li.has-sub>a::after {
position: absolute;
top: 19px;
right: 10px;
width: 4px;
height: 4px;
content: "";
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
}
#jawnav.align-right ul ul li.has-sub>a::after {
right: auto;
left: 10px;
border-bottom: 0;
border-right: 0;
}
#jawnav i {
margin-right: 10px
}
/* submenu fadein */
@-webkit-keyframes fadeIn {
from {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes fadeIn {
from {
opacity: 0;
}
100% {
opacity: 1;
}
}
.fadeIn {
-webkit-animation-name: fadeIn;
animation-name: fadeIn;
}
#jawnav li:hover>ul {
-webkit-animation-duration: .5s;
animation-duration: .5s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
animation-name: fadeIn;
}
@media all and (max-width: 768px),
only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px),
only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px),
only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px),
only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px),
only screen and (min-resolution: 192dpi) and (max-width: 1024px),
only screen and (min-resolution: 2dppx) and (max-width: 1024px) {
#jawnav {
width: 100%;
}
#jawnav ul {
width: 100%;
display: none;
}
#jawnav.align-center>ul,
#jawnav.align-right ul ul {
text-align: left;
}
#jawnav ul li,
#jawnav ul ul li,
#jawnav ul li:hover>ul>li {
width: 100%;
height: auto;
}
#jawnav ul li a,
#jawnav ul ul li a {
width: 100%;
}
#jawnav>ul>li,
#jawnav.align-center>ul>li,
#jawnav.align-right>ul>li {
float: none;
display: block;
}
#jawnav ul>li>a {}
#jawnav ul ul li a {
padding: 20px 20px 20px 20px;
padding: 10px 20px 10px 20px;
margin: 10px 0px 10px 0px;
}
#jawnav ul ul li a {
padding-left: 40px;
}
#jawnav ul ul ul li a {
padding-left: 60px;
}
#jawnav ul ul ul ul li a {
padding-left: 80px;
}
#jawnav ul ul,
#jawnav ul ul ul {
position: relative;
left: 0;
right: auto;
width: 100%;
margin: 0;
}
#jawnav>ul>li.has-sub>a::after,
#jawnav ul ul li.has-sub>a::after {
display: none;
}
#jawnav li:hover>ul {
animation-name: none;
}
#jawnav #menu-button {
display: block;
padding: 20px;
cursor: pointer;
text-transform: uppercase;
}
#jawnav #menu-button::after {
content: '';
position: absolute;
top: 13px;
right: 20px;
display: block;
width: 15px;
height: 2px;
}
#jawnav #menu-button::before {
content: '';
position: absolute;
top: 18px;
right: 20px;
display: block;
width: 15px;
height: 3px;
}
#jawnav .submenu-button {
position: absolute;
z-index: 10;
right: 0;
top: 0;
display: block;
height: 52px;
width: 52px;
cursor: pointer;
}
#jawnav .submenu-button::after {
content: '';
position: absolute;
top: 21px;
left: 26px;
display: block;
width: 1px;
height: 11px;
z-index: 99;
}
#jawnav .submenu-button::before {
content: '';
position: absolute;
left: 21px;
top: 26px;
display: block;
width: 11px;
height: 1px;
z-index: 99;
}
#jawnav .submenu-button.submenu-opened:after {
display: none;
}
#jawnav ul ul {
padding: 0;
margin-left: 0;
}
#jawnav ul ul ul {
padding: 0;
margin-top: 0;
}
#jawnav span.inner {
border: none!important;
border-radius: 0;
box-shadow: none;
padding: 0;
}
}
/*
Copyright: (c) 2015 JoomlArtWork.com, http://joomlartwork.com/
*/
/* JAW Menu Light Style*/
#jawnav {
background: rgba(0, 0, 0, 0) linear-gradient(to bottom, #fff 0%, #f5f5f5 100%) repeat scroll 0 0;
border: 1px solid #ddd;
color: #444;
}
#jawnav>ul>li>a {
color: #000000;
border-right: 1px solid #ddd;
font-size: 15px;
}
#jawnav>ul>li:hover>a,
#jawnav>ul>li.active>a {
background-color: #f5f5f5;
}
#jawnav>ul>li.has-sub>a::after {
border-bottom: 1px solid #000000;
border-right: 1px solid #000000;
}
#jawnav>ul>li.has-sub:hover>a::after {}
#jawnav span.inner {
background: #fff;
border: 1px solid #ddd;
color: #444;
}
#jawnav ul ul li a {
font-size: 13px;
color: #000;
}
#jawnav ul ul li:hover>a,
#jawnav ul ul li a:hover,
#jawnav ul ul li.current>a {}
#jawnav ul ul li.has-sub>a::after {
border-bottom: 1px solid #000;
border-right: 1px solid #000;
}
#jawnav.align-right ul ul li.has-sub>a::after {}
#jawnav ul ul li.has-sub:hover>a::after {}
@media all and (max-width: 768px),
only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px),
only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px),
only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px),
only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px),
only screen and (min-resolution: 192dpi) and (max-width: 1024px),
only screen and (min-resolution: 2dppx) and (max-width: 1024px) {
#jawnav ul li,
#jawnav ul ul li,
#jawnav ul li:hover>ul>li {
border-top: 1px solid rgba(120, 120, 120, 0.15);
}
#jawnav ul>li>a {
font-size: 14px;
}
#jawnav ul ul li a {
font-size: 14px;
background: none;
color: #000000;
}
#jawnav ul ul li:hover>a,
#jawnav ul ul li a:hover {
color: #000000;
}
#jawnav #menu-button {
font-size: 14px;
color: #000000;
}
#jawnav #menu-button::after {
background: #fff;
}
#jawnav #menu-button::before {
border-top: 2px solid #fff;
border-bottom: 2px solid #fff;
}
#jawnav .submenu-button {
border-left: 1px solid rgba(120, 120, 120, 0.15);
}
#jawnav .submenu-button::after {
background: #000000;
}
#jawnav .submenu-button::before {
background: #000000;
}
#jawnav span.inner {
background: #fff;
color: #444;
}
}
/************** JAW Menu End *************/
.mc-section-messages {
list-style-type: none;
padding: 0px;
color: #f00;
}
.mc-content-wrap.mc-field-invalid {
border: 1px solid #f00;
overflow: hidden;
}
.mc-field-invalid>.mc-field-item>input[type="text"] {
border: 1px solid #f00;
}
.mc-hidden {
display: none;
}
.text-center {
text-align: center;
}
#menubar {
display: none;
}
.healthywaterecourse_link {
/*text-shadow: 2px 0 0 #000000, -2px 0 0 #000, 0 2px 0 #000, 0 -2px 0 #000, 1px 1px #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000;
text-shadow: 0px 0 0 #000000, -1px 0 0 #000, 0 1px 0 #000, 0 -1px 2px #000, 1px 1px #000, -1px -1px 0px #000, 1px 0px 0 #000, -1px 0px 0 #000;*/
font-weight: bold;
}
/***************** Responsive Start****************/
.mobilemenu {
display: none;
}
@media screen and (max-width: 980px) {
body {
font-family: Ubuntu;
font-family: Verdana;
font-size: 17px;
}
blockquote {
font-size: 17px;
}
#breadcrumbs .box-3 {
font-size: 14.2px;
font-family: verdana;
line-height: 17px;
}
body,
.wrapper {
min-width: 0px !important;
max-width: 100%;
}
#absolute {
display: none;
}
#logo_image {
margin-left: 0px;
margin-top: 5px;
}
.wrapper-body {
padding: 0px 5px 0px;
}
img {
max-width: 100%;
height: auto;
}
#toolbar {
font-size: 14px;
display: none;
}
#headerbar {
display: none;
}
#page-body {
background: #fff;
}
#logo {
position: relative;
top: 0px;
/* page-break-after: always; */
left: auto;
text-align: center;
}
#menubar,
#menu {
display: none;
}
.mobilemenu {
background: #2465b5;
display: block !important;
}
.mobilemenu ul,
.mobilemenu #jawnav>ul>li.active>a {
background: #fff;
}
.mobilemenu #jawnav {
background: transparent;
border: 0px none;
box-shadow: none;
}
#header {
height: auto;
}
#middle-expand #main {
width: 100%!important;
}
#right {
width: 100%;
margin-left: 0px !important;
margin-top: 10px !important;
float: none;
}
body #roksearch_results {
width: 290px;
}
#ecourse_only,
#social_twitter_text {
font-size: 14px;
}
.m4j_form_wrap {
max-width: 100%;
}
#maintop {
display: none;
}
}
/***************** Responsive End *********/