@charset "utf-8";


* {
  box-sizing: border-box;
}

body {
  font-family: Trebuchet ms, Verdana, sans-serif;
  padding: 5px;
  background-image: url(../figs/decor/blue_texture-dark.png); background-repeat: repeat;
  max-width: 1040px;
  margin: auto;
}

.searchword {
color: #222; 
background-color: #ff6; 
border: 1px dotted #ff6;
}
.searchword0 {
color: #222; 
background-color: #ff6; 
border: 1px dotted #ff6;
}
.searchword1 {
color: #222; 
background-color: #a0ffff; 
border: 1px dotted #0affff;
}
.searchword2 {
color: #222; 
background-color: #9f9; 
border: 1px dotted #9f9;
}
.searchword3 {
color: #222; 
background-color: #f99; 
border: 1px dotted #f99;
}
.searchword4 {
color: #222; 
background-color: #f6f; 
border: 1px dotted #f6f;
}
.searchword5 {
color: #fff; 
background-color: #800; 
border: 1px dotted #800;
}
.searchword6 {
color: #fff; 
background-color: #0a0; 
border: 1px dotted #0a0;
}
.searchword7 {
color: #fff; 
background-color: #886800; 
border: 1px dotted #886800;
}
.searchword8 {
color: #fff; 
background-color: #004699; 
border: 1px dotted #004699;
}
.searchword9 {
color: #fff; 
background-color: #909; 
border: 1px dotted #909;
}

    
h1	{	
	font-family:		Trebuchet ms, Verdana, sans-serif;
	font-size:		28px;
	font-weight:		500;
	font-style:		normal;
	text-decoration:	none;
	word-spacing:		normal;
	letter-spacing:		normal;
	text-transform:		none;
	margin-top: 		0;
	padding-right: 		15px;
	padding-left: 		15px; 
	}	
		
h2	{	
	font-family:		Trebuchet ms, Verdana, sans-serif;
	font-size:		1.5em;
	font-weight:		400;
	font-style:		normal;
	text-decoration:	none;
	word-spacing:		normal;
	letter-spacing:		normal;
	text-transform:		none;
	margin-top: 		0;
	padding-right: 		15px;
	padding-left: 		15px; 
	}	
		
h3	{	
	font-family:		Trebuchet ms, Verdana, sans-serif;
	font-size-adjust:	.53;
	font-size:		1.3em;
	font-weight:		400;
	font-style:		normal;
	text-decoration:	none;
	word-spacing:		normal;
	letter-spacing:		normal;
	text-transform:		none;
	margin-top: 		1em;
	margin-left:		0;
	padding-right: 		15px;
	padding-left: 		15px; 
	}	
	
h4	{	
	font-family:		Trebuchet ms, Verdana, sans-serif;
	font-size-adjust:	.53;
	font-size:		1.1em;
	font-weight:		400;
	font-style:		normal;
	text-decoration:	none;
	color: 			#333;
	word-spacing:		normal;
	letter-spacing:		normal;
	text-transform:		none;
	margin-top: 		0;
	margin-left:		1em;
	padding-right: 		30px;
	padding-left: 		10px; 
	}	
		
h5, dt	{	
	font-family:		Trebuchet ms, Verdana, sans-serif;
	font-size:		1.17em;
	font-weight:		400;
	font-style:		normal;
	text-decoration:	none;
	word-spacing:		normal;
	letter-spacing:		normal;
	text-transform:		none;
	margin-top: 		0;
	padding-right: 		15px;
	padding-left: 		15px; 
	}	
		
h6	{	
	font-family:            Trebuchet ms, Verdana, sans-serif;
	font-size-adjust:	.53;
	font-size:		1em;
	font-weight:		700;
	font-style:		normal;
	text-decoration:	none;
	word-spacing:		normal;
	letter-spacing:		normal;
	text-transform:		none;
	margin-top: 		0;
	padding-right: 		15px;
	padding-left: 		15px; 
	}	
		

p	{
  	font-family: 	       Trebuchet ms, Verdana, sans-serif;
        margin-top:            0;
	padding-right:         15px;
	padding-left:          15px;
        font-size : 	       16px;
	text-align:            justify;
	line-height:           1.2;
}

p.year	{
	margin-top:	      0px;
	margin-bottom:	      12px;
  	font-family: 	      Trebuchet ms, Verdana, sans-serif;
	font-size : 	      150%;
	font-weight : 	      bold;
	text-align: 	      left;
	color: 		      #003;
}

p.indent {
  	font-family: 	      Trebuchet ms, Verdana, sans-serif;
	font-weight :         normal;
	color: 		      #000000;    
	margin-top: 	      0;
	text-align:           justify;
	text-indent:	      1em;
}

p.quote	{
  	font-family:         Trebuchet ms, Verdana, sans-serif;
	font-weight : 	     normal;
	text-align:          justify;        
	color: 		     #000000;
  	margin-left: 	     1em;        
}

p.details {
	text-align:          justify;
  	font-family: 	     Trebuchet ms, Verdana, sans-serif;
        font-size : 	     14px;
	color : 	     #000000;
        padding-left: 	     15px;
	padding-right: 	     15px;
}

p.contents {
	color:			#003300;
	font-family:		Trebuchet ms, Verdana, sans-serif;

	font-size : 		16px;
	font-weight:		400;
	background: 		none;
	text-decoration: 	none;
}


/* ~~ Styling for your site's links must remain in this order - including the group of selectors that create the hover effect. ~~ */
a:link {
	color:		       #003300;
	background:            none;
	text-decoration:       none;
	font-family:           Trebuchet ms, Verdana, sans-serif;
}
a:visited {
	color: 			#003300;
	text-decoration: 	none;
	font-family: 		Trebuchet ms, Verdana, sans-serif;
	font-size: 		0.9em;
}
a:hover, a:active, a:focus { /* this group of selectors will give a keyboard navigator the same hover experience as the person using a mouse. */
	color: 			#ffcc00;
	background: 		#999999;
	text-decoration: 	none;
	font-family: 		Trebuchet ms, Verdana, sans-serif;
}

a.more:link 	{
	color:			#960;
	font-family:		Trebuchet ms, Verdana, sans-serif;
	font-size : 		1em;
	font-weight:		400;
	background: 		none;
	text-decoration: 	none;
}

a.more:visited {
	color:			#960;
	font-family:		Trebuchet ms, Verdana, sans-serif;
	font-size : 		1em;
	font-weight:		400;
	background: 		none;
	text-decoration: 	none;
}

a.more:hover {
	color:			#003;
	font-size : 		1em;
	font-weight:		400;
	background: 		none;
	text-decoration: 	none;
}    

a.contents:link 	{
	color:			#003300;
	font-family:		Trebuchet ms, Verdana, sans-serif;

	font-size : 		16px;
	font-weight:		400;
	background: 		none;
	text-decoration: 	none;
}

a.contents:visited {
	color:			#003300;
	font-family:		Trebuchet ms, Verdana, sans-serif;
	font-size : 		16px;
	font-weight:		400;
	background: 		none;
	text-decoration: 	none;

}

a.contents:hover {
	color:			#960;
	text-decoration: 	none;
	font-family:		Trebuchet ms, Verdana, sans-serif;
	font-size : 		16px;
	font-weight:		400;
}

/* Header/Blog Title */
.header {
  padding-left: 10px;
  padding-right: 40px;
  padding-top: 0px;
  padding-bottom: 0px;  
  margin-top: 0px;  
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
  text-align: left;
  background-image: url(../figs/decor//blue_texture-dark.png); background-repeat: repeat;
}


/* Style the top navigation bar */
.topnav {
  overflow: hidden;
  background-image: url(../figs/decor/blue-light.png); background-repeat: repeat;
}

/* Style the topnav links */
.topnav a {
  float: left;
  display: block;
  color: black;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

/* Change color on hover */
.topnav a:hover {
  background-color: #ddd;
  color: black;
}

/* Create two unequal columns that floats next to each other */
/* Left column */
.leftcolumn {   
  float: left;
  width: 75%;
}

/* Right column */
.rightcolumn {
  float: left;
  width: 25%;
  margin-left: 0px;   
  margin-right: 0px;  
  padding-left: 10px;
  padding-right: 1px;  
  background-image: url(../figs/decor//blue_texture-dark.png); background-repeat: repeat;
  padding-left: 5px;
}

/* Fake image */
.fakeimg {
  background-image: url(../figs/decor/blue_texture-dark); background-repeat: repeat;
  width: 100%;
  padding: 15px;
}

/* Add a card effect for articles */
.card {
  background-image: url(../figs/decor/blue_texture-light.png); background-repeat: repeat;
  padding-left: 10px;
  padding-right: 40px;
  padding-top: 20px;
  padding-bottom: 20px;  
  margin-top: 20px;  
  margin-bottom: 20px;
  margin-left: 5px;
  margin-right: 10px;
}

/* Add a card effect for articles */
.card-contents {
  background-image: url(../figs/decor/blue_texture-light.png); background-repeat: repeat;
  padding-left: 10px;
  padding-right: 1px;
  padding-top: 20px;
  padding-bottom: 20px; 
  margin-top: 20px;
  margin-bottom: 20px;
  margin-left: 5px;
  margin-right: 0px;
}

/* Add a card effect for articles */
.card-rightdark {
  background-image: url(../figs/decor/blue_texture-dark.png); background-repeat: repeat;
  padding-left: 10px;
  padding-right: 1px;
  padding-top: 0px;
  padding-bottom: 20px; 
  margin-top: 20px;
  margin-bottom: 20px;
  margin-left: 5px;
  margin-right: 0px;
}

/* Add a card effect for articles */
.card-rightlight {
  background-image: url(../figs/decor/blue_texture-dark.png); background-repeat: repeat;
  padding-left: 0px;
  padding-right: 0px;
  padding-top: 
  0px;
  padding-bottom: 20px; 
  margin-top: 20px;
  margin-bottom: 20px;
  margin-left: 5px;
  margin-right: 0px;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

/* Footer */
.footer {
  padding-left: 10px;
  padding-right: 40px;
  padding-top: 0px;
  padding-bottom: 20px;  
  margin-top: 0px;  
  margin-bottom: 20px;
  margin-left: 5px;
  margin-right: 10px;
  text-align: center;
  background-image: url(../figs/decor/blue_texture-dark.png); background-repeat: repeat;
  margin-top: 5px;
}

/* Responsive layout - when the screen is less than 820px wide, make the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 800px) {
  .leftcolumn, .rightcolumn {   
    width: 100%;
    padding: 0;
  }
}

/* Responsive layout - when the screen is less than 400px wide, make the navigation links stack on top of each other instead of next to each other */
@media screen and (max-width: 800px) {
  .topnav a {
    float: none;
    width: 100%;
    
  }
}

div.smartinfo {
  background-color: none;
  padding: 0px;
}

@media screen and (min-width: 800px) {
  div.smartinfo {
    display: none;
  }
}
