/* css style sheet for LongwoodCurrencyTrading LCT Online Blog - blogcommon.css */
/* ------------------------------------------------ */
/* Common characteristics */
 
# {
  background-color:#144D56;
  margin: 0px;
  padding: 0px;
}

#page {
  background-color:#144D56;
  padding-top:3px;
}

#section-1 {
  width:750px;
  background:white;
  padding-left:3px;
  padding-right:3px;
  float:left;
}

#section-2 {
  width:520px;
  background:white;
  padding-left:3px;
  padding-right:3px;
  float:left;
}

#section-3 {
  width:120px;
  background:white;
  padding-left:3px;
  padding-right:3px;
  float:left;
}

.container {
  width:800px;
  background-color:white;
  border-style:solid;
  border-color:#144D56;
  margin:0px auto;
}

/*

 initial style="font-family:Arial; font-size:16px;"
*/

.commonTextStyle {
  color:black;
  font-family:Liberation Serif; 
  font-weight:normal;
  letter-spacing:0.1em;
  padding-left:25px;
  padding-right:15px;
  font-size:18px;
}

/* ----- titles and text ----- */
.commonPageTitleStyle {
  color:#144D56;
  font-family:Georgia;
  font-size:30px;
  font-weight:bold;
  letter-spacing:0.1em;
  text-shadow:6px 4px 2px #999999;
  text-align:center;
}

.commonPageHeaderStyle {
  color:#144D56;
  font-family:Verdana;
  font-size:18px;
  font-style:italic;
  font-weight:bold;
  /* letter-spacing:0.1em; */
  text-shadow:1px 1px 1px #999999;
  text-align:center;
}

.commonPageHeaderSubStyle {
  color:#144D56;
  font-family:Verdana;
  font-size:16px;
  font-style:italic;
  font-weight:bold;
}

.commonPageHeaderSubStyleL2 {
  color:#144D56;
  font-family:Verdana;
  font-size:14px;
  /* font-style:italic; */
  font-weight:bold;
  text-decoration:underline;
}

.commonPageHeaderSubStyle {
  color:#144D56;
  font-family:Verdana;
  font-size:13px;
  font-style:italic;
  font-weight:bold;
}

.navigationTextStyle {
  color:#144D56;
  font-family:Arial;
  font-size:14px;
  font-weight:bold;
  text-decoration:none;
}

.commonPageCopyrightStyle {
  color:#144D56;
  font-family:Verdana;
  font-size:13px;
  font-style:italic;
  font-weight:bold;
  text-align:center;
}

.navigationTextStyle2 {
  font-family:Arial;
  font-size:18px;
  font-weight:bold;
}

.navigationQuoteStyle {
  color:#144D56;
  font-family:Arial;
  font-size:10px;
  font-style:italic;
  /* font-weight:bold; */
}

.navigationTextStyleHeader {
  color:red; /*gray; */
  font-family:Times New Roman;
  font-size:24px;
}

.topicHeadingTextStyle {
  color:#144D56;
  font-family:Brush Script MT;
  font-size:35px;
  font-weight:bold;
}

.textBackgroundHighlight {
  /*background-color:#D3D3D3;*/
  background-color:#d0f0d0;
}

.disclaimerSectionStyle {
  color:#144D56;
  font-family:Arial;
  font-size:12px;
  font-style:italic;
  /* font-weight:bold; */
}


/* -- Draws a shadow at the lower edge of the image */
.imageShadowRaisedLowerEdge {
    -webkit-box-shadow: 0 15px 5px -5px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    -moz-box-shadow: 0 15px 5px -5px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    box-shadow: 0 15px 5px -5px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}


/* -- Navigation menu setup */
/*
These need to be coded in the following manner

<div id="wrapper" style="text-align:left;">
  <header class="main_headline">
  <nav>
  <ul>
    <li><a href="#">About</a></li>
    <li><a href="#">Services</a></li>
    <li><a href="#">Products</a></li>
    <li><a href="#">Contact</a></li>
  </ul>
  </nav>
  </header>
</div>
*/

nav {  
    display: block;  
    margin-bottom: 10px;  
}  

nav ul {  
    list-style: none;  
    font-size: 14px;  
}  

nav ul li {  
    display: inline;  
}  

nav ul li a {  
    display: block;  
    float: left;  
    padding: 3px 5px;  
    color: blue;  
    text-decoration: none;  
    font-weight: bold;  
}  

nav ul li a:hover {  
    background:#144D56; /*#2E8B57;  #999999; */ 
    color:#FAF0E6; /*#485e0f;*/  
    -webkit-border-radius: 3px;  
    -moz-border-radius: 3px;  
    border-radius: 3px;  
    padding: 3px 6px;  
    margin: 0;  
    text-decoration: none;  
}  


/* ----- responsive screen tablets ----- */
@media screen and (max-width:998px) {
  #container {
    width:100%;
  }

  #zpageTitle {
    width:100%;
  }

  #zpageHeader {
    width:100%;
  }

  #zpageFooter {
    width:100%;
  }

  #pmrimage {
    float:left;
  }


  #section-1 {
    width:100%;
  }


  #section-2 {
    width:100%;
  }


  #section-3 {
    width:100%;
  }
  
  img {
    width: 100%;
    height: auto;
  }

}


/* ----- responsive screen phone ----- */
