/*

-----------------------------------------------------------

Theme Name: xMark Updated

Theme URI: http://blogdesignsolutions.com/

Description: Custom blog design by Lisa Sabin-Wilson

Version: 1.0.2

Author: Lisa Sabin-Wilson

Author URI: http://blogdesignsolutions.com/2007/02/23/xmark-wordpress-theme-v10/

This design is a copyright of Lisa Sabin-Wilson and E.Webscapes and may not be reproduced. 

Updated with responsive styles 4/12/16

-----------------------------------------------------------

*/





/* PAGE LAYOUT  ---------------------------------- */



body {

 margin: 0; 

 background: #303030;

 font: 62.5% "Trebuchet MS", Verdana, Futura, Arial, Helvetica, sans-serif;

 color: black;

}



#page {background: #303030; overflow:hidden}

#content {
  min-width: 95%;
  text-align: left;
  margin: 0 auto;
}

@media (min-width: 768px) {
  #content {
    margin: 0 30px;
  }
}


.container {
  background: white url(images/bodybg-mobile.jpg) top left no-repeat;
  background-size: contain;
  box-sizing: border-box;
  border: 6px black solid;
  text-align: left;
  padding: 0;
  margin: 15px auto 0;
  width: 98%;
}

@media (min-width: 475px) {
  .container {
    float:left;
    background: white url(images/bodybg.png) top left no-repeat;
  }
}



/*.site_title {padding: 4px 0 0 25px; font-size: 28px; overflow:hidden; height: 35px;}*/
.site_title {
  display: inline-block;
}

.site_title a {
  display: block;
  height: 115px;
  width: 440px;
}
@media (min-width: 475px) {
  .site_title a {
    height: 134px;
    margin: 8px 18px 0;
  }
}

.site_title span {
  height: 0;
  overflow: hidden;
  opacity: 0;
  width: 0;
}

.banner_ad {
   margin-top: 15px;
}

.banner_ad a img {
  height: auto;
  width: 100%;
}

@media (min-width: 475px) {
  .banner_ad {
     margin-top: 30px;
  }
}

@media (min-width: 768px) {
  .banner_ad a img {
    width: auto;
  }
}

@media (min-width: 1060px) {
  .banner_ad {
     margin-top: 0px;
  }
}


.description {

 padding: 45px 0 0 175px;

 font-family: italics Georgia;

 color: #808080;

 font-size: 14pt;

 font-weight: normal;

 height: 23px; overflow:hidden;

}

#left {
  margin: 5px 0 0 0;
  background: transparent;
}

#left:after {
  content: '';
  clear: both;
  display: table;
}



/* HEADER NAVIGATION  ---------------------------------- */



#navSquare ul {

 text-align:center;

 width: 100%;

 margin: 0;

 padding: 45px 0 0 0;

 list-style:none;

}



#navSquare ul li {

 text-align: left;

 display:inline;

 list-style:none;

 font-size: 12px;

 line-height: 14px;

 font-weight: bold;

 padding: 0 10px 0 0;

 text-transform: uppercase;

}



#navSquare a:link, #navSquare a:visited { color: #000; text-decoration: none;}

#navSquare a:hover {color: #900101; text-decoration: none;}


#bannerAd {
	margin-top: 15px;
}


/* BASIC FORMAT STYLES  --------------------------------- */



a img {border: 0px}



a:link, a:visited{ color: #8a0202; text-decoration: none;}

a:hover{color: black; text-decoration: underline;}



abbr, acronym {border-bottom: 1px dashed #404040; cursor: help;}

strong, b { font-weight:bold;}

em, i { font-style:italic;}

h1, h2, h3, h4, ul, ol, p {margin: 0; padding: 0; }



h2 {background: #404040; color: white; font-size: 11pt; margin:0; padding: 0 0 0 2px;; text-transform: uppercase; border-bottom: 1px black solid}



hr {color: silver;  background-color: white; margin:0; padding:0; }



code, pre {

 font-family: "Courier New", Courier, mono;

 color: #955556;

 text-decoration: none;

 text-align: left;

}



.navigation {margin-bottom: 30px; clear:both; font-size: 1.6em;}



.alignright {

 background: url(images/arrow.gif) no-repeat;

 padding-left: 18px;

 float: right;

}



.alignleft {

 background: url(images/arrow_left.gif) no-repeat;

 padding-left: 18px;

 float: left;

}



blockquote {

 color: #625e5e;

 background: url(images/quote.jpg) no-repeat top left;

 padding-left: 30px;

}



/* IN-SITE LINKS --------------------------------- */



.site_title a:link, .site_title a:visited {color: white; text-decoration: none;}

#lside2 a:link, #lside2 a:visited, #lside2 a:active, #rside a:link, #rside a:visited, #rside a:active {color: #8a0202;text-decoration: none;}

#lside2 a:hover, #rside a:hover {color: black; text-decoration:underline;}





/* CONTENT STRUCTURE --------------------------------- */



#lside {
  width: 100%;
  background: transparent;
  margin: 15px 0 0 0;
  overflow:hidden;
}

@media (min-width: 880px) {
  #lside {
    float: left;
    width: 58%;
  }
}



#lside2, #rside {
 background: transparent;
 box-sizing: border-box;
 width: 100%%;
 padding: 0 15px;
 margin: 15px auto;
 overflow: hidden;
}

@media (min-width: 880px) {
  #lside2, #rside {
   float: left;
   background: transparent;
   width: 18%;
   padding: 0 0 0 20px;
   margin: 15px 0 0 0;
  }
}

.textwidget p {font-size: 12px; margin:6px; padding: 0; line-height: 1.4em;}



/* BLOG FORMATTING  --------------------------------- */



#blogc {
  padding: 0px 15px 10px;
}

@media (min-width: 880px) {
  #blogc {
    padding: 0px 0 10px 15px;
  }
}


.main_title {

 background: #900101;

 padding: 2px 0 2px 5px;

 font-size: 20px;

 color: #fff;

 font-weight: normal;

 border-bottom: 1px solid black; 



}



.main_title a, .main_title a:visited {color: white; text-decoration: none;}

.main_title a:hover {color: white; text-decoration: underline;}



.date {font-size: 1.2em}

.author {font-size: 1.4em}



.post {text-align: justify; width: 98%; font-size: 1.4em;}

.post p {margin: 12px; }

.post img {
  height: auto;
  max-width: 640px;
  padding: 0 5px 5px 5px;
  width: 100%;
}

.post ul{ margin: 0 0 .05em 40px; list-style:none; }

.post ol { margin: 0 0 .05em 40px; }



.post ul li { margin: 0 0 0.2em 0; background:url(images/list-item.gif) no-repeat ; padding-left: 18px;}



.post ol li {margin: 0 0 0.2em 0; background:transparent; padding-left: 0px}



.post ul li ul, .post ul li ol, .post ol li ul, .post ol li ol { margin: 0.5em 0 0.5em 30px; }

.post dl { margin: 0 0 1.5em 0; }

.post dt { font-weight: bold; }

.post dd { margin: 0 0 1.5em 20px; }



.post a:link, .post a:visited {font-weight: bold;}







#more {

 margin-top: -8px;

 background: url(images/more.gif) no-repeat;

 padding-left: 18px;

 font-weight: bold;

 float:right;

}



.blog-meta {

 background: #FAFAFA;

 color: #808080;

 font-size: 1.4em;

 text-align: center;

 padding: 5px;

 border-bottom: 1px solid #ddd;

 margin-bottom: 30px;

}



.blog-meta a:link, .blog-meta a:visited, .blog-meta a:active { color: #8a0202; font-weight: bold; text-decoration: none;}



.blog-meta a:hover { color: black; text-decoration: underline;}



/* LISTS  --------------------------------- */





#lside2 li, #rside li {list-style: none; margin:0; padding:0}



#lside2 ul ul, #rside ul ul {list-style: none;  color: black; background: #f2f2f2; margin: 0 0 10px 0;}



#lside2 ul ul li, #rside ul ul li { font-size: 9pt; border-bottom: 1px solid #c0c0c0;  background: transparent; padding: 0 0 0 5px;}



#lside2 ul ul li a:hover , #rside ul ul li a:hover {color:#fff; background: #8a0202; text-decoration:none;}



#lside2 ul ul ul li, #rside ul ul ul li{font-size: 0.8em; padding: 0 0 0 10px; border:none; margin:0; display:block;}











/* COMMENT STYLES  --------------------------------- */



.commentlist a {color: #8a0202; font-weight: bold; text-decoration: none; }

.commentlist a:visited {color: #8a0202; }

.commentlist a:hover {color: #000; text-decoration: underline; }



.commentlist blockquote {margin-right: 50px; background: white url(images/quote.jpg) top left no-repeat; border: 1px solid #404040; padding: 5px;}



ul.commentlist {list-style:none; margin:0;}



.comment_top a {color: #8a0202;}

.comment_top a:visited {color: #8a0202; }

.comment_top a:hover {color: #8a0202; background: white; }



ul.commentlist li .comment_top {width: 510px; background: url(images/commenta.jpg) no-repeat; color: #000; }



ul.commentlist li p { padding: 6px; line-height: 1.5em; margin:0; font-size: 1.5em;}



ul.commentlist li .comment_bottom {width: 510px; height: 53px; padding: 15px 0 0 10px; background: url(images/comment_bota.jpg) no-repeat; text-align: left; font-size: 1.2em;}





li.alt .comment_top a {color: #8a0202; text-decoration: none; }

li.alt .comment_top a:visited {color: #8a0202; }

li.alt .comment_top a:hover {color: black; text-decoration: none; }



ul.commentlist li.alt .comment_top {width: 510px; background: url(images/commentb.jpg) no-repeat; color: #000; }



ul.commentlist li.alt .comment_bottom {width: 510px; height: 53px; padding: 15px 0 0 10px; background: url(images/comment_botb.jpg) no-repeat; text-align: left; font-size: 1.2em; }



ul.commentlist li.alt p {padding: 10px; line-height: 1.5em; margin:0; font-size: 1.5em;}



#comments {position: relative; width: 324px; height: 97px; background: url(images/discussion.jpg) 0 100% no-repeat; padding-top: 40px; margin-bottom: 5px; }



#comments .number {position: absolute; width: 55px; top: 42px; left: 122px; text-align: center; color: #fff; font-size: 28px; font-weight: bold; }



.cmeta {font-size: 10pt;}



.comment_form {width: 495px; height: 429px; background: url(images/comment_formbg.jpg) no-repeat; padding: 35px 0 0 10px; color: #000; float: left; margin: 0; font-size: 1.2em; }



.comment_form a, .comment_form a:active, .comment_form a:visited {color: #8a0202; text-decoration: none;}

.comment_form a:hover {color: white; text-decoration: underline;}



.commentnumber {

 font: italic 14px 'Times New Roman', Times, serif;

 margin-top: -8px;

 padding: 0 5px 0 0;

 float:right;

 color: #808080;

 font-size: 28pt;

}











/* FORM STYLES  --------------------------------- */



form {margin: 0; padding: 0;}



#searchform {
  margin: 0 auto;
  max-width: 300px;
  width: 90%;
}

@media (min-width: 475px) {
  #searchform {
    margin: 20px auto 0;
  }
}

@media (min-width: 768px) {
  #searchform {
    margin: 0;
    padding:0; 
    float:right;
    width: auto;
  }
}


#s {

 border:1px solid #404040;

 background: #fff; color: #000;

 width: 85%;
}

@media (min-width: 768px) {
  #s {
    width: 200px;
  }
}



#button {

 border:0px;

 background: transparent;

 height: 16px;

 width: 16px;

 margin-top:5px;

}



#archive_b {

 border:1px solid #000;

 background: #fff; color: #000;

 margin-top:5px;

 width: 60px;

}





input {

 border:1px solid #000;

 background: #fff; color: #000;


}





textarea {

 border:1px solid #000;

 background: #fff; color: #000;

 width: 470px;

}



/* ASIDES  --------------------------------- */



.asides {

 background: #f8f6f7 url(images/aside.jpg) no-repeat; padding: 15px 8px 5px 8px; margin: 10px; width: 95%; font-size: 1.4em; border-bottom: 1px solid #cfcdce;}



/* UTW  --------------------------------- */

.utwreltags a {font-size: 70%; color:silver; text-decoration:none}



/* CALENDAR --------------------------------- */



#wp-calendar {empty-cells: show; color: #808080;margin: 0;width: 98%;}

#wp-calendar #next a{padding-right: 10px;text-align: right;}

#wp-calendar #prev a{padding-left: 10px;text-align: left;}

#wp-calendar a{font-weight:bold; display: block;text-decoration: none;}

#wp-calendar a:hover{color: red; font-weight:bold; background: #eee;text-decoration: none;border: none;}



#wp-calendar td{color: #404040;letter-spacing: normal;padding: 1px 0;text-align: center;}

#wp-calendar td.pad:hover{color: #4b572b;background: #eee;text-decoration: none;border: none;}

#wp-calendar #today{background: #eee;color: #000;}

#wp-calendar th{font-style: normal;text-transform: capitalize;}



/* RELATED POSTS  --------------------------------- */

.related {padding: 10px; font-size: 10pt;background: #eee; border-left: 2px #808080 solid;}

.related ul {margin: 8px;}

.related ul li {list-style: none; background: url(images/bullet.gif) no-repeat 0 50%; padding-left: 18px;}





/* FLICKR RSS  --------------------------------- */

li.widget_flickrrss {text-align:center; }			

li.widget_flickrrss a img {border: 1px solid silver; margin: 5px; padding: 3px; }

li.widget_flickrrss a:hover img { background: #900101; }



/* ARCHIVES PAGE  --------------------------------- */



.postspermonth {

 margin: 5px 0 10px 0;

 list-style: none;

 padding-left: 25px;

}







/* FOOTER -------------------------------------------- */



#footer {

 float:left;

 width: 100%;

 margin: 15px 0 0 0;

 color: #c0c0c0;

 font-size: 1.4em;

 border-top: 1px black solid;

 border-bottom: 1px black solid;

 background: #625e5e;

 padding: 2px;

 text-align: center;

 margin-bottom: 10px;

}



#footer a, #footer a:visited, #footer a:active {color: #c0c0c0; text-decoration:none}

#footer a:hover {color: #000; text-decoration: none;}


#rside h2 a:link, #rside h2 a:visited, #rside h2 a:active {
  color: white;
}


