html { scroll-behavior: smooth;}
header { background-color: #ffffff; top:0; left:0; right:0; position:fixed; font-weight:bold; color:black; text-align:center; font-size:2em; scroll-behavior: smooth;}
footer { background-color: #ffffff; bottom:0; left:0; right:0; position:fixed; font-weight:bold; color:black; text-align:center; font-size:2em;}
nav { background-color:#ffffff; top:35px; left:0; right:0; position:fixed; font-weight:bold; color:black; text-align:center; font-size:.58em;}
.dots-top { border-top: 2px dotted #06f; background-color: #fff; top:10; left:0; right:0; bottom:2; position:fixed;}
body { background-color: #ffffff; font-family:'poppins', sans-serif; position:relative; top:0px; padding:35px; padding-bottom:100px; max-width:100%;}
.btn {border: 2px solid black; background-color: white; color: black; padding: 12px 24px; font-size: 15px; cursor: pointer;}
.linkedin {border-color: #008080; color: green;}
.linkedin:hover {background-color: #008080; color: white;}
@media only screen and (max-width: 600px) { body {top:32px;}}
a {color: #06f; font-size:1.125em; font-weight:bold; text-decoration:none;}
a:hover {color:rgb(255, 0, 98);}
h1 {font-family:arial; font-size:5.5vw; -webkit-text-stroke: px black; color: white; text-shadow: 0px 3px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;}
.h1-small {text-align:right;}
.content-left {text-align:left;}
.content-center {text-align:center;}
.content-right {text-align:right;}
p {font-size:1em; padding:0% 25%;}
p.summary {font-size:1em; padding:0% 25%; text-align:left; border: 0px solid #000000}
@media only screen and (max-width: 600px) {p.summary {padding: 5% 0%; border: 0px solid #000000; margin: 2px; text-align:left;}}
p.center {font-size:1em; padding:0% 0%; text-align:center; border: 0px solid #000000}
@media only screen and (max-width: 600px) {p {padding: 0% 10%; border: 2px solid #000000; margin: 2px; text-align: center;}}
.vertical {writing-mode: vertical-rl; text-orientation: mixed; padding: 10px; font-weight: bold; background-color: yellow; font-size: 10px;}
.small-font {font-size: 8px;}
.social-img {margin-top:10px; text-align:center;}
.social-links {margin-top:10px; text-align:left;}
a.social-links {color: aqua;} 
blockquote {text-align: left; }
*{box-sizing: border-box;}
.flex-container-marketing {display: flex; flex-direction: row; font-family:'poppins', sans-serif; text-align: center;}
.flex-item-left-marketing {padding: 10px; flex: 20%;}
.flex-item-middle-marketing {padding: 10px; flex: 60%;}
.flex-item-right-marketing {padding: 10px; flex: 20%;}
/* Responsive layout - makes a one column-layout instead of two-column layout */
@media (max-width: 600px) {.flex-container-marketing {flex-direction:row;}}
span {text-align: center;}    
@media (max-width: 600px) {span {text-align: center;}}
*{box-sizing: border-box;}
.flex-container-services {display: flex; flex-direction: row;}
.flex-item-left-services {padding: 10px; flex: 20%;}
.flex-item-middle-services {padding: 10px; flex: 60%; text-align: left;}
.flex-item-right-services {padding: 10px; flex: 20%;}
/* Responsive layout - makes a one column-layout instead of two-column layout */
@media (max-width: 800px) {.flex-container {flex-direction: column;}}
*{box-sizing: border-box;}
.flex-container-recommendations {display: flex; flex-direction: row; font-size: 1em; font-family:'poppins', sans-serif; text-align: center;}
.flex-item-left-recommendations {padding: 10px; flex: 33%;}
.flex-item-middle-recommendations {padding: 10px;flex: 33%;}
.flex-item-right-recommendations {padding: 10px; flex: 33%;}
/* Responsive layout - makes a one column-layout instead of two-column layout */
@media (max-width: 800px) {.flex-container-recommendations {flex-direction: column;}}
.img {width: 80%; height: auto; margin: 2px; max-width: 300px;}
.grid {text-align: center;}