* {
  box-sizing: border-box; }

body {
  padding: 0;
  margin: 0;
  font-family: Asap, "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 16px;
  line-height: 1.5;
  color: #606c71; }

a {
  color: #1e6bb8;
  text-decoration: none; }
  a:hover {
    text-decoration: underline; }

.btn {
  display: inline-block;
  margin-bottom: 1rem;
  color: rgba(255, 255, 255, 0.7);
  background-color: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.2);
  border-style: solid;
  border-width: 1px;
  border-radius: 0.3rem;
  transition: color 0.2s, background-color 0.2s, border-color 0.2s; }
  .btn:hover {
    color: rgba(255, 255, 255, 0.8);
    text-decoration: none;
    background-color: rgba(255, 255, 255, 0.2);
    border-color: rgba(255, 255, 255, 0.3); }
  .btn + .btn {
    margin-left: 1rem; }
  @media screen and (min-width: 64em) {
    .btn {
      padding: 0.75rem 1rem; } }
  @media screen and (min-width: 42em) and (max-width: 64em) {
    .btn {
      padding: 0.6rem 0.9rem;
      font-size: 0.9rem; } }
  @media screen and (max-width: 42em) {
    .btn {
      padding: 0.75rem;
      font-size: 0.9rem; } }
.page-header {
  color: #fff;
  text-align: center;
  background-color: #f1dd76;
  background-image: linear-gradient(120deg, #62bfd4, #f1dd76); }
  @media screen and (min-width: 64em) {
    .page-header {
      padding: 5rem 6rem; } }
  @media screen and (min-width: 42em) and (max-width: 64em) {
    .page-header {
      padding: 3rem 4rem; } }
  @media screen and (max-width: 42em) {
    .page-header {
      padding: 2rem 1rem; } }
.project-name {
  margin-top: 0;
  margin-bottom: 0.1rem; }
  @media screen and (min-width: 64em) {
    .project-name {
      font-size: 3.25rem; } }
  @media screen and (min-width: 42em) and (max-width: 64em) {
    .project-name {
      font-size: 2.25rem; } }
  @media screen and (max-width: 42em) {
    .project-name {
      font-size: 1.75rem; } }
.project-tagline {
  margin-bottom: 2rem;
  font-weight: normal;
  opacity: 0.7; }
  @media screen and (min-width: 64em) {
    .project-tagline {
      font-size: 1.25rem; } }
  @media screen and (min-width: 42em) and (max-width: 64em) {
    .project-tagline {
      font-size: 1.15rem; } }
  @media screen and (max-width: 42em) {
    .project-tagline {
      font-size: 1rem; } }
.main-content {
  word-wrap: break-word; }
  .main-content :first-child {
    margin-top: 0; }
  @media screen and (min-width: 64em) {
    .main-content {
      max-width: 64rem;
      padding: 2rem 6rem;
      margin: 0 auto;
      font-size: 1.1rem; } }
  @media screen and (min-width: 42em) and (max-width: 64em) {
    .main-content {
      padding: 2rem 4rem;
      font-size: 1.1rem; } }
  @media screen and (max-width: 42em) {
    .main-content {
      padding: 2rem 1rem;
      font-size: 1rem; } }
  .main-content img {
    max-width: 100%; }
  .main-content h1,
  .main-content h2,
  .main-content h3,
  .main-content h4,
  .main-content h5,
  .main-content h6 {
    margin-top: 2rem;
    margin-bottom: 1rem;
    font-weight: normal;
    color: #57a5b6; }
  .main-content p {
    margin-bottom: 1em; }
  .main-content code {
    padding: 2px 4px;
    font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace;
    font-size: 0.9em;
    color: #567482;
    background-color: #f3f6fa;
    border-radius: 0.3rem; }
  .main-content pre {
    padding: 0.8rem;
    margin-top: 0;
    margin-bottom: 1rem;
    font: 1rem Consolas, "Liberation Mono", Menlo, Courier, monospace;
    color: #567482;
    word-wrap: normal;
    background-color: #f3f6fa;
    border: solid 1px #dce6f0;
    border-radius: 0.3rem; }
    .main-content pre > code {
      padding: 0;
      margin: 0;
      font-size: 0.9rem;
      color: #567482;
      word-break: normal;
      white-space: pre;
      background: transparent;
      border: 0; }
  .main-content .highlight {
    margin-bottom: 1rem; }
    .main-content .highlight pre {
      margin-bottom: 0;
      word-break: normal; }
  .main-content .highlight pre,
  .main-content pre {
    padding: 0.8rem;
    overflow: auto;
    font-size: 0.9rem;
    line-height: 1.45;
    border-radius: 0.3rem;
    -webkit-overflow-scrolling: touch; }
  .main-content pre code,
  .main-content pre tt {
    display: inline;
    max-width: initial;
    padding: 0;
    margin: 0;
    overflow: initial;
    line-height: inherit;
    word-wrap: normal;
    background-color: transparent;
    border: 0; }
    .main-content pre code:before, .main-content pre code:after,
    .main-content pre tt:before,
    .main-content pre tt:after {
      content: normal; }
  .main-content ul,
  .main-content ol {
    margin-top: 0; }
  .main-content blockquote {
    padding: 0 1rem;
    margin-left: 0;
    color: #819198;
    border-left: 0.3rem solid #dce6f0; }
    .main-content blockquote > :first-child {
      margin-top: 0; }
    .main-content blockquote > :last-child {
      margin-bottom: 0; }
  .main-content table {
    display: block;
    width: 100%;
    overflow: auto;
    word-break: normal;
    word-break: keep-all;
    -webkit-overflow-scrolling: touch; }
    .main-content table th {
      font-weight: bold; }
    .main-content table th,
    .main-content table td {
      padding: 0.5rem 1rem;
      border: 1px solid #e9ebec; }
  .main-content dl {
    padding: 0; }
    .main-content dl dt {
      padding: 0;
      margin-top: 1rem;
      font-size: 1rem;
      font-weight: bold; }
    .main-content dl dd {
      padding: 0;
      margin-bottom: 1rem; }
  .main-content hr {
    height: 2px;
    padding: 0;
    margin: 1rem 0;
    background-color: #eff0f1;
    border: 0; }

.site-footer {
  padding-top: 2rem;
  margin-top: 2rem;
  border-top: solid 1px #eff0f1; }
  @media screen and (min-width: 64em) {
    .site-footer {
      font-size: 1rem; } }
  @media screen and (min-width: 42em) and (max-width: 64em) {
    .site-footer {
      font-size: 1rem; } }
  @media screen and (max-width: 42em) {
    .site-footer {
      font-size: 0.9rem; } }
.site-footer-owner {
  display: block;
  font-weight: bold; }

.site-footer-credits {
  color: #819198; }

/**********/
/* Custom */
/**********/
/* Testimonials */
.testimonial {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background-color: #f9f9f9;
  border-radius: 10px;
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
  /*max-width: 400px;*/
  margin: 20px auto; }

h4.author {
  margin-top: 10px;
  margin-bottom: 5px;
  color: #333; }

.testimonial-content {
  flex: 2;
  margin-left: 20px;
  font-style: italic;
  color: #555; }

.title {
  font-size: 14px;
  color: #666;
  margin: 0; }

.testimonial-profile {
  flex: 1;
  text-align: center; }

.testimonial-profile-image {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid #ddd; }

/* Mailing List Box */
.mailing-list-box {
  text-align: center;
  background-color: #fffae1;
  border-radius: 8px;
  padding: 10px;
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
  margin: 10px; }

/* Video Samples */
.portfolio-section {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 20px;
  margin: 20px;
  padding: 20px;
  border: 1px solid #ddd;
  border-radius: 8px;
  max-width: 800px;
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1); }

.image-container {
  flex: 0 0 auto;
  width: 180px;
  /* Fixed width for maintaining aspect ratio */
  height: 320px;
  /* Fixed height for maintaining aspect ratio */
  overflow: hidden;
  border-radius: 8px; }

.image-container img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 8px; }

.description-container {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap: 10px;
  justify-content: flex-start; }

.description-container h2 {
  margin: 0; }

.description-container p {
  margin: 0;
  padding: 0;
  line-height: 1.6; }

.view-count {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 0.9em;
  color: #666; }

.view-link {
  padding: 8px 16px;
  font-size: 0.9em;
  color: #fff;
  background-color: #71c2ca;
  border-radius: 4px;
  text-decoration: none;
  display: inline-block;
  margin-top: 10px;
  width: fit-content; }

.view-link:hover {
  background-color: #e9db7b; }

@media (max-width: 768px) {
  .portfolio-section {
    flex-direction: column;
    align-items: flex-start;
    /* Ensures text is left-aligned */ }
  .image-container {
    width: 60%;
    /* Reduced width for smaller screens */
    max-width: 240px;
    /* Absolute max width */
    height: auto;
    /* Auto height to maintain aspect ratio */
    margin: 0 auto;
    /* Center the thumbnail */ }
  .description-container {
    margin-top: 10px;
    /* Add margin to separate from image */ } }

/* Intro Section */
/* Container for the photo and text */
.video-editor-portfolio {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  margin: 0 auto 20px;
  max-width: 800px;
  /*border: 1px solid #ccc;*/
  /*box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);*/
  background-color: #fff; }

/* Picture styling to make it circular and add border */
.portfolio-photo {
  flex: 0 0 150px;
  width: 150px;
  height: 150px;
  border-radius: 50%;
  border: 3px solid #e9db7b;
  overflow: hidden;
  margin-right: 20px; }

.portfolio-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover; }

/* Text styling */
.portfolio-text {
  flex: 1; }

.portfolio-text h2 {
  margin: 0 0 10px 0;
  /*font-size: 24px;*/ }

.portfolio-text p {
  margin: 0;
  /*font-size: 16px;*/
  line-height: 1.5; }

/* Responsive styles for smaller screens */
@media (max-width: 600px) {
  .video-editor-portfolio {
    flex-direction: column;
    align-items: center;
    text-align: center; }
  .portfolio-photo {
    margin-bottom: 15px;
    margin-right: 0; } }

/* Mailchimp Styles */
#mc_embed_signup {
  /*background:#fff;*/
  /*false;*/
  clear: left;
  /*font:14px Helvetica,Arial,sans-serif;*/
  max-width: 500px;
  margin: 0 auto; }

/* Add your own Mailchimp form style overrides in your site stylesheet or in this style block.
         We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */
/* MailChimp Form Embed Code - Classic - 12/17/2015 v10.7 */
#mc_embed_signup form {
  display: block;
  position: relative;
  text-align: left;
  margin: 20px; }

#mc_embed_signup h2 {
  /*font-weight:bold;*/
  padding: 0;
  margin: 15px 0;
  /*font-size:1.4em;*/
  text-align: center; }

#mc_embed_signup input {
  border: 1px solid #ABB0B2;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px; }

#mc_embed_signup input[type=checkbox] {
  -webkit-appearance: checkbox; }

#mc_embed_signup input[type=radio] {
  -webkit-appearance: radio; }

#mc_embed_signup input:focus {
  border-color: #333; }

#mc_embed_signup .button {
  clear: both;
  background-color: #71c2ca;
  border: 0 none;
  border-radius: 4px;
  transition: all 0.23s ease-in-out 0s;
  color: #FFFFFF;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: normal;
  height: 32px;
  line-height: 32px;
  margin: 0 5px 10px 0;
  padding: 0 22px;
  text-align: center;
  text-decoration: none;
  vertical-align: top;
  white-space: nowrap;
  width: fit-content;
  width: -moz-fit-content; }

#mc_embed_signup .button:hover {
  background-color: #222; }

#mc_embed_signup .small-meta {
  font-size: 11px; }

#mc_embed_signup .nowrap {
  white-space: nowrap; }

#mc_embed_signup .mc-field-group {
  clear: left;
  position: relative;
  width: 96%;
  padding-bottom: 3%;
  min-height: 50px;
  display: grid; }

#mc_embed_signup .size1of2 {
  clear: none;
  float: left;
  display: inline-block;
  width: 46%;
  margin-right: 4%; }

* html #mc_embed_signup .size1of2 {
  margin-right: 2%;
  /* Fix for IE6 double margins. */ }

#mc_embed_signup .mc-field-group label {
  display: block;
  margin-bottom: 3px; }

#mc_embed_signup .mc-field-group input {
  display: block;
  width: 100%;
  padding: 8px 0;
  text-indent: 2%; }

#mc_embed_signup .mc-field-group select {
  display: inline-block;
  width: 99%;
  padding: 5px 0;
  margin-bottom: 2px; }

#mc_embed_signup .mc-address-fields-group {
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  width: 96%;
  gap: 15px; }

#mc_embed_signup .mc-sms-phone-group {
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  width: 96%;
  gap: 15px;
  padding-top: 5px; }

#mc_embed_signup .datefield, #mc_embed_signup .phonefield-us {
  padding: 5px 0; }

#mc_embed_signup .datefield input, #mc_embed_signup .phonefield-us input {
  display: inline;
  width: 60px;
  margin: 0 2px;
  letter-spacing: 1px;
  text-align: center;
  padding: 5px 0 2px 0; }

#mc_embed_signup .phonefield-us .phonearea input, #mc_embed_signup .phonefield-us .phonedetail1 input {
  width: 40px; }

#mc_embed_signup .datefield .monthfield input, #mc_embed_signup .datefield .dayfield input {
  width: 30px; }

#mc_embed_signup .datefield label, #mc_embed_signup .phonefield-us label {
  display: none; }

#mc_embed_signup .indicates-required {
  text-align: right;
  font-size: 11px;
  margin-right: 4%; }

#mc_embed_signup .asterisk {
  color: #e85c41;
  font-size: 150%;
  font-weight: normal;
  position: relative;
  top: 5px; }

#mc_embed_signup .clear {
  clear: both; }

#mc_embed_signup .foot {
  display: grid;
  grid-template-columns: 3fr 1fr;
  width: 96%;
  align-items: center; }

@media screen and (max-width: 400px) {
  #mc_embed_signup .foot {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
    align-items: center; } }

@media screen and (max-width: 400px) {
  #mc_embed_signup .referralBadge {
    width: 50%; } }

#mc_embed_signup .brandingLogo {
  justify-self: right; }

@media screen and (max-width: 400px) {
  #mc_embed_signup .brandingLogo {
    justify-self: left; } }

#mc_embed_signup .mc-field-group.input-group ul {
  margin: 0;
  padding: 5px 0;
  list-style: none; }

#mc_embed_signup .mc-field-group.input-group ul li {
  display: block;
  padding: 3px 0;
  margin: 0; }

#mc_embed_signup .mc-field-group.input-group label {
  display: inline; }

#mc_embed_signup .mc-field-group.input-group input {
  display: inline;
  width: auto;
  border: none; }

#mc_embed_signup div#mce-responses {
  float: left;
  top: -1.4em;
  padding: 0em .5em 0em .5em;
  overflow: hidden;
  width: 90%;
  margin: 0 5%;
  clear: both; }

#mc_embed_signup div.response {
  margin: 1em 0;
  padding: 1em .5em .5em 0;
  font-weight: bold;
  float: left;
  top: -1.5em;
  z-index: 1;
  width: 80%; }

#mc_embed_signup #mce-error-response {
  display: none; }

#mc_embed_signup #mce-success-response {
  color: #529214;
  display: none; }

#mc_embed_signup label.error {
  display: block;
  float: none;
  width: auto;
  margin-left: 1.05em;
  text-align: left;
  padding: .5em 0; }

#mc_embed_signup .helper_text {
  color: #8d8985;
  margin-top: 2px;
  display: inline-block;
  padding: 3px;
  background-color: rgba(255, 255, 255, 0.85);
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  font-size: 14px;
  font-weight: normal;
  z-index: 1; }

#mc-embedded-subscribe {
  clear: both;
  width: auto;
  display: block;
  margin: 1em 0 1em 5%; }

#mc_embed_signup #num-subscribers {
  font-size: 1.1em; }

#mc_embed_signup #num-subscribers span {
  padding: .5em;
  border: 1px solid #ccc;
  margin-right: .5em;
  font-weight: bold; }

#mc_embed_signup #mc-embedded-subscribe-form div.mce_inline_error {
  display: inline-block;
  margin: 2px 0 1em 0;
  padding: 3px;
  background-color: rgba(255, 255, 255, 0.85);
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  font-size: 14px;
  font-weight: normal;
  z-index: 1;
  color: #e85c41; }

#mc_embed_signup #mc-embedded-subscribe-form input.mce_inline_error {
  border: 2px solid #e85c41; }