body {
   margin-top: 0;
   margin-left: 1;
   background: #edf0f4;
}

.main-heading {
   background: url('banner.gif') no-repeat;
   height: 112px;
   padding: 0;
}


.nav {
   background-color: #a6c3ea;
   color: #3f48cc;
   font: 12pt Verdana;
   padding: 5px;
   float: left;
   width: 740px;
}

.nav a {
   color: #0b40a5;
   text-decoration: none;
   padding:5px;
   display: inline;
   border-left: 5px solid #0b40a5;
}

.nav a:hover {
   background: #efefbf;
   color: #444;
   border-left: 5px solid red;
}

.content-wrapper {
   background: #edf0f4;
   color: #444;
   font: 12pt Verdana;
   float: left;
   width: 750px;
   background-image: url('column_bg.png');
   background-repeat: repeat-y;
   background-position: right;
   border-right: 2px solid #000;
}

.content-wrapper2 {
   background: #edf0f4;
   color: #444;
   font: 12pt Verdana;
   float: left;
   width: 750px;
   border-right: 2px solid #000;
}

.content-message-error {
    margin-top: 0px;
    margin-left: 50px;
    padding: 5px;
    background-color: #fae5e4;
    border: 2px solid #ff0000;
    width: 400px;
    color: #ff0000;
}

.content-message-success {
    margin-top: 0px;
    margin-left: 50px;
    padding: 5px;
    background-color: #e1f6dd;
    border: 2px solid #119423;
    width: 400px;
    color: #119423;
}

.content-message-warning {
    margin-top: 0px;
    margin-left: 50px;
    padding: 5px;
    background-color: #efefbf;
    border: 2px solid #0b40a5;
    width: 400px;
    color: #0b40a5;
}

.content-blog {
    margin-top: 0px;
    margin-left: 50px;
    padding: 5px;
    background-color: #ffffff;
    border: 2px solid #0b40a5;
    font: 11pt Arial;
    width: 400px;
    color: #0C1352;
}

.content-faq {
    margin-top: 0px;
    margin-left: 50px;
    padding: 5px;
    background-color: #ffffff;
    border: 2px solid #0b40a5;
    font: 11pt Arial;
    width: 400px;
    color: #0C1352;
    display: none;    
}

.content-message-blank {
    margin-top: 0px;
    margin-left: 50px;
    padding: 5px;
    background-color: #edf0f4;
    border: 2px solid #edf0f4;
    width: 400px;
    color: #edf0f4;
}

.welcome-message-error {
    margin-top: 10px;
    margin-left: 125px;
    padding: 5px;
    background-color: #fae5e4;
    border: 2px solid #ff0000;
    width: 400px;
    color: #ff0000;
}

.welcome-message-success {
    margin-top: 10px;
    margin-left: 125px;
    padding: 5px;
    background-color: #e1f6dd;
    border: 2px solid #119423;
    width: 400px;
    color: #119423;
}

.welcome-message-warning {
    margin-top: 10px;
    margin-left: 125px;
    padding: 5px;
    background-color: #efefbf;
    border: 2px solid #0b40a5;
    width: 400px;
    color: #0b40a5;
}

.welcome-message-blank {
    margin-top: 10px;
    margin-left: 125px;
    padding: 5px;
    background-color: #edf0f4;
    border: 2px solid #edf0f4;
    width: 400px;
    color: #edf0f4;
}


.content-column-1 {
   float: left;
   width: 530px;
   //width: 730px;
   padding: 5px 15px 0 5px;
   font-size: 12pt;
   display: table-cell;
   margin-bottom: 1em;
   line-height: 1.65em;
}

.content-column-1 a{
   color: #0b40a5;
   text-decoration: none;
   border-bottom: 1px solid #0b40a5;
}

.content-column-1 a:hover{
   color: #f00;
   text-decoration: none;
   border-bottom: 0;
}

.content-column-2 {
   float: right;
   width: 190px;
   padding: 5px 5px 0 5px;
   font-size: 10pt;
   color: #E6E1CF;
   line-height: 1.5em;
}

.content-column-2 a{
   color: #E6E1CF;
   text-decoration: none;
   font-weight: bold;
   border-bottom: 1px solid #E6E1CF;
}

.content-column-2 a:hover{
   color: #ff761c;
   text-decoration: none;
   font-weight: bold;
   border-bottom: 0;
}

.content-column-2 img{
   border: 2px solid #E6E1CF;
}

.article-image {
   float: left;
   margin-right: 10px;
   margin-left: 5px;
   margin-top: 5px;
   margin-bottom: 5px;
   border: 2px solid #0b40a5;
}

.spoiler-image {
   float: left;
   margin-right: 10px;
   margin-left: 5px;
   margin-top: -1px;
   margin-bottom: 5px;
   border: none;
}

.spoilerArticle-image {
   float: left;
   margin-right: 10px;
   margin-left: 50px;
   margin-top: -1px;
   margin-bottom: 5px;
   border: none;
}

.spoilerArticleNew-image {
   float: left;
   margin-right: 10px;
   margin-left: 125px;
   margin-top: -1px;
   margin-bottom: 5px;
   border: none;
}

.back-image {
   float: left;
   margin-right: 10px;
   margin-left: 5px;
   margin-top: 5px;
   margin-bottom: 5px;
   border: 2px solid #edf0f4;
}

.next-image {
   float: right;
   margin-right: 10px;
   margin-left: 5px;
   margin-top: 5px;
   margin-bottom: 5px;
   border: 2px solid #edf0f4;
}

.back-image:hover{
   border: 2px solid #ff761c;
}

.next-image:hover{
   border: 2px solid #ff761c;
}

.sidebarButton {
    background-color: #ff761c; 
    color: white;
    border: 2px solid #0b40a5;
    padding: 2px 2px;
    text-align: center;
    text-decoration: underline;
    font-weight: normal;
    display: inline-block;
    border-radius: 8px;
    font-size: 12pt;
    margin-top: 0px;
    margin-left: 6px;
    margin-right: 0px;
}

.sidebarButton:hover {
    text-decoration: underline;
     font-style: italic; 
}

.button {
    background-color: #ff761c; 
    color: white;
    border: 2px solid #0b40a5;
    padding: 2px 10px;
    text-align: center;
    text-decoration: none;
    font-weight: normal;
    display: inline-block;
    border-radius: 8px;
    font-size: 14pt;
    margin-top: 10px;
    margin-left: 20px;
}

.button:hover {
    text-decoration: underline;
}

.button:focus {
   background-color: #efefbf;
    border: 2px solid red;
   color:red;
    text-decoration-style: wavy;
     font-style: italic; 
}

.button:active {
   background-color: #efefbf;
    border: 2px solid red;
   color: red;
    text-decoration-style: wavy;
     font-style: italic; 
}

a.cancelLink{
    border: 2px solid #0b40a5;
    color: #0b40a5;
    padding: 2px 20px;
    text-align: center;
    text-decoration: none;
    font-weight: normal;
    border-radius: 8px;
    font-size: 12pt;
    margin-top: 10px;
    margin-left: 20px;
    display: inline;
}

a.cancelLink:hover{
    background-color: #ff761c; 
    color: white;
    text-decoration: underline;
    font-weight: normal;
    border-bottom: 2px solid #0b40a5;
}

a.cancelLinkNew{
    border: 2px solid #ff0000;
    color: #0b40a5;
    padding: 2px 20px;
    text-align: center;
    text-decoration: none;
    font-weight: normal;
    border-radius: 8px;
    font-size: 12pt;
    margin-top: 10px;
    margin-left: 20px;
    display: inline;
}

a.cancelLinkNew:hover{
    background-color: #ff761c; 
    color: white;
    text-decoration: underline;
    font-weight: normal;
    border-bottom: 2px solid #ff0000;
}

a.viewBlogLink{
    border: 2px solid #0b40a5;
    color: #0b40a5;
    padding: 1px 20px;
    text-align: center;
    text-decoration: none;
    font-weight: normal;
    border-radius: 8px;
    font-size: 12pt;
    margin-top: 8px;
    margin-left: 70px;
    display: inline-block;

}

a.viewBlogLink:hover{
    background-color: #ff761c; 
    color: white;
    text-decoration: underline;
    font-weight: normal;
    border-bottom: 2px solid #0b40a5;
}

a.backLink{
    border: 2px solid #0b40a5;
    color: #0b40a5;
    padding: 2px 20px;
    text-align: center;
    text-decoration: none;
    font-weight: normal;
    border-radius: 8px;
    font-size: 12pt;
    margin-top: 10px;
    margin-left: 20px;
    display: inline-block;
    background: url('backOpt2.png') no-repeat 1% 7px;
    background-size: 24px 16px;
    padding-left: 35px;
}

a.backLink:hover{
    color: white;
    text-decoration: underline;
    font-weight: normal;
    border-bottom: 2px solid #0b40a5;
    background: url('back2Opt2.png') no-repeat 1% 7px;
    background-size: 24px 16px;
    padding-left: 35px;
    background-color: #ff761c; 
}

a.buddyLink{
    border: 2px solid #0b40a5;
    color: #0b40a5;
    padding: 2px 20px;
    text-align: center;
    text-decoration: none;
    font-weight: normal;
    border-radius: 8px;
    font-size: 12pt;
    margin-top: 20px;
    margin-left: 20px;
    display: inline-block;
    background: url('whatsNew.png') no-repeat 1% 1px;
    background-size: 195px 29px;
    padding-left: 35px;
}

a.buddyLink:hover{
    color: white;
    text-decoration: underline;
    font-weight: normal;
    border-bottom: 2px solid #0b40a5;
    background: url('whatsNewRoll.png') no-repeat 1% 1px;
    background-size: 195px 29px;
    padding-left: 35px;
    background-color: #ff761c; 
}

a.buddyDisplayLink{
    border: 2px solid #0b40a5;
    color: #0b40a5;
    padding: 2px 20px;
    text-align: center;
    text-decoration: none;
    font-weight: normal;
    border-radius: 8px;
    font-size: 12pt;
    margin-top: 10px;
    margin-left: 20px;
    display: inline-block;
    background: url('buddyLink.png') no-repeat 1% 1px;
    background-size: 24px 29px;
    padding-left: 35px;
}

a.buddyDisplayLink:hover{
    color: white;
    border: 2px solid #0b40a5;
    color: #0b40a5;
    padding: 2px 20px;
    text-align: center;
    text-decoration: none;
    font-weight: normal;
    border-radius: 8px;
    font-size: 12pt;
    margin-top: 10px;
    margin-left: 20px;
    display: inline-block;
    background: url('buddyLink.png') no-repeat 1% 1px;
    background-size: 24px 29px;
    padding-left: 35px;
}

a.noLink{
    border: 2px solid #0b40a5;
    color: #0b40a5;
    padding: 2px 20px;
    text-align: center;
    text-decoration: none;
    font-weight: normal;
    border-radius: 8px;
    font-size: 12pt;
    margin-top: 10px;
    margin-left: 20px;
    display: inline;
}

a.noLink:hover{
    background-color: #edf0f4; 
    color: #0b40a5;
    text-decoration: none;
    font-weight: normal;
    border-bottom: 2px solid #0b40a5;
}

.border {
    margin-top: 2px;
    padding: 5px;
    border: 2px solid #0b40a5;
}


p {
   margin-top: 10px;
}

h1 {
   margin-right: 0;
   margin-top: 0;
   margin-bottom: 5px;
   margin-left: 155px;
   text-align: right;
   font-size: 14pt;
   color: #0b40a5; 
   border-bottom: 1px solid #0b40a5;
}

h2 {
   margin-right: 0;
   margin-top: 0;
   margin-bottom: 10px;
   margin-left: 5px;
   text-align: left;
   font-size: 12pt;
   color: #0b40a5; 
   border-bottom: 1px solid #0b40a5;
}

h3 {
   margin-right: 0;
   margin-top: 0;
   margin-bottom: 5px;
   margin-left: 190px;
   text-align: right;
   font-size: 12pt;
   color: #0b40a5; 
   border-bottom: 1px solid #0b40a5;
}

h4 {
   margin-right: 0;
   margin-top: 0;
   margin-bottom: 5px;
   margin-left: 190px;
   text-align: right;
   font-size: 11pt;
   color: #0b40a5; 
   border-bottom: 1px solid #0b40a5;
}


h5 {
   margin-right: 0;
   margin-top: 0;
   margin-bottom: 5px;
   margin-left: 190px;
   text-align: right;
   font-size: 10pt;
   color: #0b40a5; 
   border-bottom: 1px solid #0b40a5;
}


h6 {
   margin-right: 0;
   margin-top: 0;
   margin-bottom: 2px;
   margin-left: 2px;
   text-align: left;
   font-size: 8pt;
   color: #0b40a5; 
   border-bottom: 1px solid #0b40a5;
}

.footer {
   clear:both;
   width: 740px;
   background-color: #0b40a5;
   color: #ebecf9;
   text-align: left;
   padding: 5px;
}

.footer a{
   color: #ebecf9;
   text-decoration: none;
   border-bottom: 1px solid #ebecf9;
}

.footer a:hover{
   color: #ff761c;
   text-decoration: none;
   border-bottom: 0;
}

.seperator {
   padding-bottom: 1em;
   border-bottom: 1px solid #E6E1CF;
}

.popup {
  position: relative;
  display: inline-block;
  cursor: pointer;
  text-decoration: underline dotted;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* The actual popup */
.popup .popuptext {
  visibility: hidden;
  width: 160px;
  background-color: #0b40a5;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 8px 0;
  position: absolute;
  z-index: 1;
  bottom: 125%;
  left: 50%;
  margin-left: -80px;
}

/* Popup arrow */
.popup .popuptext::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #0b40a5 transparent transparent transparent;
}

/* Toggle this class - hide and show the popup */
.popup .show {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s;
}

/* Add animation (fade in the popup) */
@-webkit-keyframes fadeIn {
  from {opacity: 0;} 
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
}
