/* Project MARS - Site CSS */


/* =================BODY================= */
body {
  text-align : center;
  background-color : #BD652D;
  font-family : Arial, Helvetica, sans-serif;
  margin : 0px;
}

#printbody {
  background-color : #fff;
  text-align : left;
}



/* =================HEADER================= */
#header {
  border-bottom : 10px solid #008081;
  padding : 1em 0;
  color : #fff;
}

#header_content {
  width : 100%;
  display : flex;
  justify-content: space-between;
}

#header_content {
  width : 100%;
  display : flex;
  justify-content: space-between;
  flex-wrap: wrap;
}


#header_content1 {
  width : 130px;
  padding-left : 1em;
}

#header_content2 {
  text-align : center;
  vertical-align: middle;
  font-size : 2em;
  font-weight : bold;
  padding : 0.5em;
  width : 10em;
}

#header_content3 {
  margin-left : 2em;
  background-image : url(/images/andrew_d_basiago_header.jpg);
  background-repeat : no-repeat;
  text-align : right;
  padding: 40px 10px 0 90px;
  height : 90px;
}

@media (max-width: 800px) {
  #header_content2{
    display: none;
  }
}

#pheader {
  text-align : right;
  border-bottom : 4px solid #008081;
}

#pheader h1 {
  color : #003;
  font-size : 2em;
  margin : 0px 20px;
}

#return {
  position : absolute;
}

#container {
  text-align : left;
  padding : 5px;
  background-color : #fff;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;  
}

.container-columns {
  flex: 0;
  flex-basis: auto;
}

/* =================RIGHT SIDE================= */
#rightside {
  width : 250px;
}

#rightside p {
  text-align : center;
}

/* =================SIDE BAR================= */

#sidebar {
  width : 220px;
  background-color : #fff;
  padding : 0 0 10px 0;
}

.sidetext {
  font-size : 0.7em;
  color : #fff;
}

@media (max-width: 1200px) {
  #content{
    width: 100%;
  }
}

/* =================MENU================= */

#clickmenu {
  background-color : #ccc;
  display : none;
  color : #008;
  font-size : 1.2em;
  padding : 0.5em 1em;
  margin : 0px;
  text-align : left;
  font-weight : bold;
}

#clickmenu span {
  padding : 0px 10px;
  background: linear-gradient(
    to bottom, 
    #008, #008 20%, 
    transparent 20%, transparent 40%, 
    #008 40%, #008 60%, 
    transparent 60%, transparent 80%, 
    #008 80%, #008 100%
  );
  border-right : 4px solid #ccc;
}

@media screen and (max-width: 1200px) {
  #clickmenu {
    display : block;
  }
  nav {
    display : none;
  }
  #sidebar {width : 100%;}
}

#menu {
font-family : Arial, Helvetica, sans-serif;
}

#menu h3 {
  color : #666;
  font-size : 1.1em;
  margin : 1em 0px 0px 2px;
}

#menu a {
  text-decoration : none;
  display : block;
  color : #008081;
  border : 1px solid #fff;
  padding : 0px 2px;
  font-size : 0.9em;
}


a#pageselected {
  background-color : #088;
  color : #fff;
  font-weight : bold;
  padding : 1px;
}

a#menu_facebook {
  background-image : url(/images/facebook.gif);
  background-repeat : no-repeat;
  padding-left : 18px;
}

#menu a.menu_youtube {
  background-image : url(/images/youtube_icon.gif);
  background-repeat : no-repeat;
  padding-left : 18px;
}

/* =================BUTTONS================= */
a.stdbutton, a.stdbuttoni {
  font-size : 80%;
  text-decoration : none;
  border : 1px solid #888;
  background-color : #ccc;
  color : #000;
  margin : 0.25em 0em;
  padding : 0.25em;
  text-align : center;
}

a.stdbutton {
  display : block;  
}

a.stdbutton:active, a.stdbuttoni:active {
  border-color : #345 #cde #def #678;
}

a.stdbutton:hover, a.stdbuttoni:hover {
  background-color : #eee;
  color : #000;
}

/* =================CONTENT================= */
#content {
  padding : 1em;
  text-align : justify;
  width : calc(100% - 600px);
  max-width : 1200px;
}

@media (max-width: 1200px) {
  #content{
    width: 100%;
  }
}


#pcontent {
    padding : 0px 2em;
}

/* =================MESSAGES================= */

#error {
  background-color : #f66;
  padding : 1em;
  border : 2px solid #f00;
  text-align : center;
  margin : 1em;
  font-weight : bold;
}

#message {
  background-color : #fff;
  padding : 1em;
  border : 2px solid #036;
  text-align : center;
  margin : 1em;
  font-weight : bold;
  color : #036;
}

#flash {
  position : absolute;
  top : 100px;
  left : 50%;
  margin-left : -250px;
  width : 500px;
  background-color : #ff7;
  border : 2px solid #888;
  color : #000;
  padding : 10px;
  text-align : center;
  z-index : 10000;
}


/* =================FOOTER================= */
#footer {
  clear : both;
  background-color : #BD652D;
  border-top : 10px solid #008081;
  padding : 1em;
}

#footertext {
  padding : 5px;
  text-align : center;
  color : #fff;
  font-size : 0.7em;
  line-height : 1.5em;
}

div.printfooter {
  clear : both;
  text-align : center;
  padding : 0.25em;
  font-size : 0.7em;
  border-top : 4px solid #008081;
  margin-top : 2em;
}

/* =================FORM ELEMENTS================= */
.formitem {
  background-color : #eee;
  border : 1px solid #000;
}

.formitem:focus {
  background-color : #fff;
}

.formitemerror {
  background-color : #ff7;
  border : 1px solid #000;
}

span.formrequired {
  color : #f00;
  font-weight : bold;
  padding-right : 2px;
}

.formtitlebreak{
  line-height:1px;
  clear : right;
}

div.formtitle {
  float : left;
  text-align : right;
  font-weight : bold;
  width : 150px;
  padding : 5px 0px;
  font-size : 0.8em;
}

div.forminfo {
  margin-left : 164px;
  padding : 5px 0px;
}

input.formsubmit {
  color : #000;
  cursor : pointer;
  font-size : 1em;
}

div.error {
  margin : 10px auto;
  border : 2px solid #f00;
  background-color : #f88;
  padding : 0.5em;
  width : 300px;
  text-align : center;
}

/* =================GENERAL ELEMENTS================= */
a {
  color : #006;
}

a:hover {
  color : #036;
  background-color : #ccc;
}

h1 {
  color : #003;
}

h2 {
  color : #003;
}

h3 {
  color : #f00;
}

/* =================IMAGES================= */
img.left {
  float : left;
  margin-right : 1em;
  vertical-align : text-top;
}

img.right {
  float : right;
  margin-left : 1em;
  vertical-align : text-top;
}

a.imagelink {
  padding : 3px;
  display : block;
}

a.imagelink:hover {
  color : #ccc
}

/* =================MISC ITEMS================= */
p.legalnotice {
  text-align : center;
  font-size : 0.8em;
  font-weight : bold;
}

p.copyright {
  text-align : center;
  font-size : 0.8em;
  color : #253161;
  line-height : 1.5em;
}

a.mvp {
  color : #fff;
  text-decoration : none;
}

a.mvp:hover {
  color : #000;
}

.center {
  text-align : center;
}

a.printversion {
  width : 80px;
  height : 20px;
  background : url(/images/printversion.gif) no-repeat;
  display : block;
  border : 2px solid transparent;
  margin-left:50px;
  margin-top : 20px;
  float:left;
}

a.printversion:hover {
  background-color : #888;
}

a.validator {
  width : 60px;
  height : 21px;
  background : url(/images/valid-xhtml10.png) no-repeat;
  display : block;
  border : 2px solid transparent;
  float : right;
  margin-right : 50px;
  margin-top : 20px;
}

a.validator:hover {
  background-color : #888;
}


/* =================TinyMCE specific rules================= */
body.mceContentBody {
  background-color : #FFF;
  background-image : none;
  font-size : 1em;
  text-align : left;
}

/* =================Translate================= */
#translate {
  text-align : right;
  padding : 5px;
}
#stop_translate {
  border : 1px solid #888;
  background-color : #fff;
  font-size : 28px;
}
#stop_translate:hover {
 background-color : #fff;
 border-color : #0f0;
}

/* =================Annals================= */

a.annal_link, a.annal_link_external {
  font-size : 80%;
  text-decoration : none;
  background-color : #ccc;
  color : #000;
  margin : 0.25em 0em;
  padding : 0.25em;
  text-align : left;
  display : block;
  background-color : #fff;
  padding-left: 25px;
  line-height : 15px;
}

a.annal_link {
  background: url(/images/acrobatsymbol.gif);
  background-repeat : no-repeat;
}

a.annal_link_external {
  background: url(/images/world.gif);
  background-repeat : no-repeat;
  background-position : 0 3px;
}

a.annal_link:hover, a.annal_link_external:hover {
  background-color : #eee;
  color : #000;
}

/* =================MEDIA================= */

.media_item {
  border : 1px solid #088;
  padding : 5px 10px;
  background-color : #eff;
  margin-bottom : 20px;
}

.media_item h3 {
  color : #000;
  font-size : 1em;
}

/* =================SUBSCRIBE================= */
.VIEW_RECORD_TABLE {
  background-color : #eee;
}

.VIEW_RECORD_TABLE  th {
  width : 100px;
  background-color : #DEEBF2;
  padding : 2px 3px;
  vertical-align : top;
}
.VIEW_RECORD_TABLE  td {
  background-color : #fff;
  padding : 2px 3px;
  vertical-align : top;
}


/* ==================== Ads ==================== */

.traveladbutton {
  margin-left : 17px;
  display: block;
  background: url(/images/travel_ad.png) no-repeat;
  width : 208px;
  height : 168px;
  text-decoration : none;
  border : 5px solid #008;
}

.traveladbutton:hover {
  border : 5px solid #f00;
}