body { font-size:large; line-height:180%; font-style:serif; padding:0;}
/* #stellantis {background: url('/pics/site/mopars.jpg');  } */

#lower-half {background-image: radial-gradient(blue,azure);}
.rumors {background-image:radial-gradient(aliceblue,lavender); padding:4px;font-weight:bold; text-align: center;border:solid black thin;font-family: sans-serif;line-height: 1.1x;}
.rumors a {text-decoration-style: dotted;}
.now {padding:4px;text-align: center;font-family: sans-serif;line-height: 15pt;margin-top:2px;}
.now p {margin-bottom:12px;}
.news {text-align:center;margin-top:3px;margin-bottom:3px;}
.news a {text-decoration:none;}

select {padding:4px;font-size:18px;background:linen;width:100%;}

#mopar {margin-left:auto;margin-right:auto;max-width:720px;padding-left:5px;padding-right:5px;background:white;}
header {text-align:center;margin-left:auto;margin-right:auto}

.sections { font-family: sans-serif; padding: 3px; border: solid 1px #003980; text-align: center; background:gray; background-image:radial-gradient(red,purple); font-weight:bold; color: white; line-height: 120%;border-radius:3px;max-width:40%; margin-left:auto;margin-right:auto;}
.sections a {color:white;text-decoration: none; border-bottom: thin dotted;}
.sections:hover,.menu a:hover {background-image:radial-gradient(pink,red);}
.sections a:hover {color:yellow;}
.inc {margin:0;border:thin solid navy;max-width:360px;background-image: linear-gradient(#E5F9FF,azure);padding-top:2px;padding-bottom:4px;text-align:center;margin-left:auto;margin-right:auto;font-family:sans-serif; }
.inc a {text-decoration: none;}
.bottomfeature {text-align: center;font-family: sans-serif;font-weight:bold;font-style:italic;background-image:radial-gradient(azure,silver);}
.bottomfeature a {text-decoration: none;border-bottom:thin dotted navy;}
.clear {clear:both;}

#mopar img { margin-left: auto;margin-right: auto;border:thin solid black; display:block;}

.caption { text-align: center;margin-top:1px;font-family: sans-serif; font-size:12px;font-style:oblique;padding-top:1px;}
.captionpre { margin-bottom:2px; text-align: center; margin-right: auto; margin-left: auto; }

#side {margin-left:2px;overflow:hidden;float:left;width:162px;position:relative;}

.wide {display: block;overflow: auto;overflow-y: hidden;}


/* #footer {clear: both;text-align:center;} */

.menu { clear:both;text-align:center; background-image:radial-gradient(#2e66a5,azure,#2e66a5); line-spacing:190%: margin: 3px; padding: 4px; } 

.menu a {font-family:Arial, Helvetica, sans-serif;font-weight:bold;text-decoration:none;padding:3px;margin: 5px;background:navy;border-radius:3px;color: white;}
.menu a:hover {color:yellow;}
.menubar {padding:2px;background:navy;}

a:hover {color:red;border-bottom:dotted thin red;}


img {max-width:100%; height:auto;}
a img {max-width:100%; height:auto;}

h1 {font-family:Arial, Helvetica, Geneva; font-size:16pt; font-weight:bold; padding:5pt; font-style:italic; color: white; border-radius: 3px;background-image: linear-gradient(to right,#00194d,azure);text-shadow:4px 4px 5px black;background:navy;}
h1 a {color:#F0F0F0;} 

h2 { font-style:italic; font-weight:bold; color:white; font-size:14pt; font-family:sans-serif; margin-top:22pt; margin-bottom:2px; line-height:130%; background-color:green; background-image: linear-gradient(to right,#00194d,#2b51a5,blue); padding:4px;}

h3 { color:#000066; font-style:italic; font-size:large; font-family:sans-serif; padding-top:12pt; border-bottom:1pt solid red }
th  { font-style: normal; font-weight: normal; }

#side ul { list-style-image: none; margin-top: 2px; margin-bottom: 2px; position: absolute; top: 2px; left: 4px;}
#side ul li { list-style-type: none; width: 120px; ; }
#side ul { display: inline; margin: 0 1pt; padding: 3pt; width: 112px; }
#side ul li a   { color: #00194d; font-family: arial, helvetica, sans-serif; list-style-type: none; display: block; margin-top: 2px; margin-bottom: 2px; padding: 2px 0.3em; border-top: 3px solid white; border-bottom: 3px solid white;border-right:10px solid white;  text-decoration: none; font-weight: bold;background-image:radial-gradient(azure,#D6E9F9);   }
#side ul li a:hover { color: red; background-color: #7AB654; }

.sidebar2 { font-size: small; font-family: sans-serif; float: right; margin: 3pt; padding: 3px; border: solid 1px #003980; width: 28%; background:gray; background-image:radial-gradient(red,purple); color: white; line-height: 120%; }
.sidebar2 a {color:yellow;}
.sidebar2 a:hover {color:black;}
.sidebar2:hover {background-image:none;color:black;}

.byline { font-family: Arial, Helvetica, Geneva; background-color: #dcdcdc; text-align: center; padding: 3px; border-top: 1px solid #45280e; border-bottom: 1px solid #45280e }
.center { text-align: center; }
.aright { float: right; }
.aright { float: left; }


.topnavlink { font-family: Arial,Helvetica,sans-serif;font-size:14px; font-weight:bold;text-align:center; margin-top:0px; margin-bottom:5px; position:relative; background-color:#7AB654; padding:5px; margin-left:auto;margin-right:auto;width:80px; display: inline-block; }

.indextd {max-width:630px;}

.topadwide {max-width:900px;}



/* .row1 td,.row1 th,.row2 th,.row2 td {border-bottom:solid 1px navy;} */

#mopar table {margin-left:auto;margin-right:auto;border:thin solid navy;}
.autotable {cellpadding:3px;cellspacing:0;}
.autotable tr:nth-child(even), .row1 {background: #DCE4E9;background-image:linear-gradient(#DCE4E9,azure);}
.autotable tr:nth-child(odd), .row2 {background:#F0F4F6;background-image:linear-gradient(#F0F4F6,white); } 
.autotable tr:first-child,.row0 {background-color:#D6E9F9!important; vertical-align: bottom; font-weight: bold;border-bottom:thinv solid navy!important;background-image:none; }
.row2:hover {background-image:none;background-color: #CCFFFF;}
.row1:hover {background-image:none;background-color: #C5DAEB;}
.row0:hover {background-color:#3333FF;color: #66FFFF;}
@-ms-viewport {
	width: device-width;
}

@viewport {
	width: device-width;
}

@media (max-width: 829px) {
#mopar {width:100%!important; padding:0px;margin:0px;} 
#side {display:none;}
}

@media (max-width:400px) {
select {padding:4px;font-size:24px;background:azure;}
p {font-size:16px;}
}

td, th{border-right:thin solid teal;}table {border-left:thin solid teal;}

/* @media (max-width: 318px) {
#mopar {width:100%; padding:0px;} 
}*/

.bottomfeature {text-align:center;background-color:white;}
.bottomfeature a {text-decoration:dotted;}

.article {padding-bottom:14px;font-family:sans-serif;border-bottom: dotted purple;overflow:hidden;font-weight:bold;} 
.article a {text-decoration: none;}
.icon {float:right;} 
.lastmod {font-size:small;font-weight:normal;color: gray;}

/* June 2025 */

.lite-youtube-fallback {
	aspect-ratio: 16 / 9; /* matches YouTube player */
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	gap: 1em;
	padding: 1em;
	background-color: #000;
	color: #fff;
	text-decoration: none;
}

/* right-facing triangle "Play" icon */
.lite-youtube-fallback::before {
	display: block;
	content: '';
	border: solid transparent;
	border-width: 2em 0 2em 3em;
	border-left-color: red;
}

.lite-youtube-fallback:hover::before {
	border-left-color: #fff;
}

.lite-youtube-fallback:focus {
	outline: 2px solid red;
}

/* August 2025 */


.widescreen {display:block;}
#narrowscreen {display:none;}

@media (max-width:500px) {
.widescreen,.menubar {display:none;}
#narrowscreen {display:block;}
}

#menuToggle
{
  display: block;
  position: absolute;
  margin-top:10px;margin-left:5px;
  z-index: 1;
  -webkit-user-select: none;
  user-select: none;
}

#menuToggle a
{ text-decoration: none; transition: color 0.3s ease;}

#menuToggle a:hover
{  color: teal;}


#menuToggle input
{
  display: block;
  width: 40px;
  height: 32px;
  position: absolute;
  cursor: pointer;
  
  opacity: 0; /* hide this */
  z-index: 2; /* and place it over the hamburger */
  
  -webkit-touch-callout: none;
}

/*
 * Just a quick hamburger
 */
#menuToggle span
{
  display: block;
  width: 33px;
  height: 4px;
  margin-bottom: 5px;
  position: relative;
/*  background: #cdcdcd; */
background:black;
border-radius: 3px;
  
  z-index: 1;
  
  transform-origin: 4px 0px;
  
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              opacity 0.55s ease;
}

#menuToggle span:first-child
{
  transform-origin: 0% 0%;
}

#menuToggle span:nth-last-child(2)
{
  transform-origin: 0% 100%;
}

/* 
 * Transform all the slices of hamburger
 * into a crossmark.
 */
#menuToggle input:checked ~ span
{
  opacity: 1;
  transform: rotate(45deg) translate(-2px, -1px);
  background: black;
}

/*
 * But let's hide the middle one.
 */
#menuToggle input:checked ~ span:nth-last-child(3)
{
  opacity: 0;
  transform: rotate(0deg) scale(0.2, 0.2);
}

/*
 * Ohyeah and the last one should go the other direction
 */
#menuToggle input:checked ~ span:nth-last-child(2)
{
  transform: rotate(-45deg) translate(0, -1px);
}

/*
 * Make this absolute positioned
 * at the top left of the screen
 */
#menu
{
  position: absolute;
  max-width: 400px;
  width: 100vw;
  max-height: 100vh;
  margin: -100px 0 0 -20px;
  padding: 50px;
  padding-top: 125px;
  box-sizing: border-box;
  overflow-y: auto;
/*   background: #ededed; */
background-image:linear-gradient(azure,white,azure);
  list-style-type: none;
  -webkit-font-smoothing: antialiased;
  /* to stop flickering of text in safari */
  
  transform-origin: 0% 0%;
  transform: translate(-100%, 0);
  
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
}

.smaller {font-size:18px;}


#menu li
{
  padding: 10px 0;
  font-size: 22px;
      text-align:left;
  font-family: sans-serif;
  margin-left:10px;

}

#menu li label
{
  cursor: pointer;
}

/*
 * And let's slide it in from the left
 */
#menuToggle input:checked ~ ul
{
  transform: none;
}