/* RTL additions */

html {
  scroll-padding-top: 60px; /* height of sticky header */
}

.text-focal {
  color: #ff8800;
}

.navbar-icon {
  font-size: 1.5em !important
}



.rtl-button {
  font-family: "Roboto", sans-serif;
  font-weight: 500;
  font-size: 14px;
  /*letter-spacing: 1px;*/
  display: inline-block;
  padding: 12px 32px;
  border-radius: 50px;
  transition: 0.5s;
  line-height: 1;
  color: #ff8800;
  animation-delay: 0.8s;
  margin-top: 0.25em;
  margin-bottom: 0.25em;
  border: 1px solid #ff8800;
  box-shadow: 2px 6px 8px rgba(0, 0, 0, 0.1);
}

.rtl-button:hover {
  background: #ff8800;
  color: #fff;
  text-decoration: none;
}

.rtl-button.solid {
  background: #ff8800;
  color: #fff;
}

.rtl-button.solid:hover {
  background: #fff;
  color: #ff8800;
}

.rtl-button.inline {
  padding: 6px 12px;
  vertical-align: middle;
}

/* Dropdown for camera chooser */
.rtl-dropdown {
  width: 100%;
  height: 40px;
  border: 1px solid #ccc;
  font-size: 18px;
  color: #333;
  background-color: #eee;
  padding-left: 5px;
  margin-top: 0.25em;
  margin-bottom: 0.25em;
  border-radius: 3px;
}

.services .location {
  font-size: 1.1em;
  line-height: 28px;
  margin-bottom: 0.75em;
  color: #888;
}

.services .bigger-title {
  font-weight: 700;
  margin-bottom: 15px;
  font-size: 24px;
}

.service-icon-img {
  width: 72px;
  padding-bottom: 17px;
}

.service-icon-img-nofix {
  width: auto;
  max-width: 100%;
  max-height: 96px;
  padding-bottom: 17px;
}

.service-icon-img-larger {
  width: auto;
  max-width: 100%;
  max-height: 128px;
  padding-bottom: 17px;
}

.why-us-icon-img {
  width: 72px;
}



span.badge-plus {
  content: url("../img/badges/badge-focal-plus.svg");
  height: 1em;
  padding-right: 5px;
  padding-left: 5px;
}

span.badge-pro {
  content: url("../img/badges/badge-focal-pro.svg");
  height: 1em;
  padding-right: 5px;
  padding-left: 5px;
}

span.badge-mobile {
  content: url("../img/badges/badge-mobile-free.svg");
  height: 1em;
  padding-right: 5px;
  padding-left: 5px;
}

span.badge-mobilepro {
  content: url("../img/badges/badge-mobile-pro.svg");
  height: 1em;
  padding-right: 5px;
  padding-left: 5px;
}

span.badge-snaps {
  content: url("../img/badges/snaps.png");
  height: 1em;
  padding-right: 5px;
  padding-left: 5px;
}



/* Camera support table */
table.support {
  width: 100%;
  background-color: #f5f5f5;
}

table.support th,
td {
  border: 1px solid #cccccc;
}

table.support th {
  background: #ff9c31;
  background: -webkit-linear-gradient(#ff9c31, #f0a943);
  background: linear-gradient(#ff9c31, #f0a943);
  color: white;
  text-align: center;
}

table.support td,
th {
  padding: 10px;
  text-align: left;
}

/* Expandable sections */

details {
  margin-bottom: 1.25em;
}

details summary {
  background-color: #eee;
  cursor: pointer;
  padding: 0.5em 1.25em;

  /* Stop selection of the title */
  -moz-user-select: none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

details summary:hover {
  background-color: #ddd;
}

details summary>* {
  display: inline;
}

details>div {
  margin-top: 0;
  padding: 1rem;
}

details>summary {
  list-style: none;
  /* Hide left-side marker */
}

summary {
  display: flex;
  align-items:center;
}

summary h5 {
  margin-top: 0;
  margin-bottom: 0;
}

summary::after {
  margin-left: auto;
  margin-right: 0;
  font-family: sans-serif;
  font-size: 2em;
  font-weight: bold;
  content: "\002B";
}

details[open] summary:after {
  content: "\2212";
}


.feature-list ul {
  color: #777;
}

.feature-list ul .na {
  color: #bbb;
}

.feature-list ul .na i {
  color: #bbb;
}




.svg-icon {
  height: 0.9em;
  margin-right: 0.5em;
  vertical-align: -5%;
}


.compare-caption {
  text-shadow: 2px 2px 4px #000000;
}



.map-text {
  font-family: "Inter", sans-serif;
  font-weight: 600;
  text-transform: uppercase;
  text-align: center;
}

.testi-quote {
  font-family: Georgia, 'Times New Roman', Times, serif;
  color: #888;
}

.spec-heading {
  font-size: 2.25em;
  font-weight: 100;
  padding-bottom: 0.75em;
}

ul.spec-list {
  list-style: disc;
  padding-left: 1.25em;
}


.link-span {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;

  z-index: 1;

  /* fixes overlap error in IE7/8, 
     make sure you have an empty gif */
  background-image: url('empty.gif');
}






.why-us .progress {
  height: 35px;
  margin-bottom: 10px;
}

.why-us .progress .skill {
  line-height: 35px;
  padding: 0;
  margin: 0 0 0 20px;
  text-transform: uppercase;
}

.why-us .progress .skill .val {
  float: right;
  font-style: normal;
  margin: 0 20px 0 0;
}

.why-us .progress-bar {
  width: 1px;
  text-align: left;
  transition: 0.9s;
}


.smaller-text {
  font-size: 0.8em;
}

.very-small-text {
  font-size: 0.75em;
}

.caption {
  font-size: 0.8em;
  text-align: center;
}

.text-black {
  color: #000;
}

.text-typical {
  color: #3838af;
}

.div-box-icon {
  font-size: 20px;
  vertical-align: -0.125em;
  -webkit-font-smoothing: antialiased;
}





.banner {
  padding: 15px 0;
  background-color: #f3f8fa;
  min-height: 40px;
}

.banner a {
  color: #fff;
  font-weight: normal;
}

.banner a:hover {
  color: #ccc;
}

.bg-green {
  background-color: #03c53d;
  color: #fff;
}

.bg-pink {
  background-color: #eb0046;
  color: #fff;
}

.bg-offer {
  /*
  background-color: #117005;
  color: #fff;
  */
  background-color: #146e0b;
  background-image: linear-gradient(225deg, #07441e 0%, #127e3b 50%, #2B86C5 100%);
  border-radius: 0.5em;
  margin-left: 0.5em;
  margin-right: 0.5em;
}  


.bg-offer2 {
  background-color: #e4491a;
  color: #fff;
}


.bg-offer-nikon {
  background-color: #ffe600;
  color: #fff;
}

.bg-offer-canon {
  background-color: #f00b0b;
  color: #fff;
}


.text-pink {
  color: #eb0046;
}

.text-offer2 {
  font-size: 0.8em;
  color: #eee;
}

.text-offer2-dark {
  color: #444;
}

.banner-icon-img {
  width: 1.1em;
}

.text-info {
  color: #004077 !important;
}





/*--------------------------------------------------------------
# Help
--------------------------------------------------------------*/

.help h1 {
  font-weight: normal;
  font-size: 32px;
  padding-bottom: 8px;
}

.help h2 {
  font-weight: 400;
  font-size: 24px;
  padding-top: 1em;
}


.help h3 {
  font-weight: 600;
  font-size: 20px;
  padding-top: 1em;
}

.help h4 {
  font-weight: 600;
  font-size: 18px;
  padding-top: 1em;
}

.help ol li {
  padding-bottom: 8px;
}

/*
.help ul {
  list-style: none;
  padding: 0;
}
*/

.help ul li {
  padding-bottom: 10px;
}

.help ul i {
  font-size: 20px;
  padding-right: 4px;
  color: #ff8800;
}

.help p:last-child {
  margin-bottom: 0;
}

.help img {
  display:block; 
  max-width:800px; 
  max-height:auto; 
  margin:0 auto;
}


.help table {
  width: 99%;
  /* 99% so scrollbar is not shown! */
  background-color: #f5f5f5;
  margin-bottom: 2em;
}

.help table th {
  background: #ff9c31;
  background: -webkit-linear-gradient(#ff9c31, #f0a943);
  background: linear-gradient(#ff9c31, #f0a943);
  color: white;
  text-align: center;
}

.help table td,
th {
  padding: 10px;
  text-align: center;
}

.anchor-offset {
    position: relative;
    top: -60px; /* Adjust this value as needed */
}

.rtl-highlight {
  color: #10a517;
}

.cam-anchor {
  scroll-margin-top: 80px;
}