/* CSS Document */
/* responsive design*/
*{
	box-sizing: border-box;
}
/*end responsive design*/

p {
	margin-bottom: 1rem;
}

p.intro {
  color: var(--color-text-grey);
  font-size: smaller;
}

a:hover{
  font-weight: bolder;	
}

a:link{
  color: darkcyan;
}
a:visited{
  color: darkcyan;
}

article.card {
  border: 1px solid #dde4f0;
  border-radius: 12px;
  padding: 24px;
  background: #fff;
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.08);
  max-width: 420px;
}
.mytext h1 {
  margin-top: 0.5em;
  margin-bottom: 0.5em;
  font-size: 1.5em;
  font-weight: 500;
	
}
.mytext h2 {
  margin-top: 0.5em;
  margin-bottom: 0;
  font-size: 1.2em;
  font-weight: 400;

}

.mytext li {
  list-style: disc;
  margin-left: 1em;
  padding-left: 1em; 
}

/*button - used in switch to adobe */
.button {
	  background-color: deepskyblue;
  	  border: none;
  	  color: black;
  	  padding: 10px 20px;
  	  text-align: center;
      text-decoration: none;
      display: inline-block;
      font-size: 16px;
      margin: 2rem 2rem;
      cursor: pointer;
      transition-duration: 0.2s;
	  border-radius: 3px;
	  box-shadow: 4px 4px 2px rgba(137,219,248,1.00);
    }
	.button:hover {
		opacity: 90%;
	}
	.button:link{
  		color: blue;
	}
	.button:visited{
  		color: blue;
	}

/*video container for responsive youtube old*/
.video-container {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px; height: 0; overflow: hidden;
}
 
.video-container iframe,
.video-container object,
.video-container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/*Class for cover picture on home screen*/
.figclass {
	aspect-ratio: 3 / 4;
	overflow: hidden;
}