.transition, .menu ul li.inner-parent-li > a > span:before, .menu ul li.inner-parent-li.collapsed > a > span:before, .menu li.parent-li > a > span:before, .menu li.parent-li > a, .menu li.parent-li > a:hover, .menu li.parent-li.collapsed > a > span:before, .menu li.parent-li.collapsed a.li-collapse + ul, .api-doc-body, .api-doc-body.hidden > div, .api-doc-body > div {
  -webkit-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out; }

.clearfix:after {
  display: block;
  content: "";
  clear: both; }

.body-wrapper {
  background-repeat: no-repeat; }
  @media (max-width: 767px) {
    .body-wrapper {
      background-image: url(/images/voipstudio/homepage/blue-bg.svg);
      background-position: right -0.625rem top -1.25rem;
      background-size: 14.75rem auto; } }
  @media (min-width: 768px) {
    .body-wrapper {
      background-image: url(/images/voipstudio/homepage/blue-bg.svg);
      background-position: right 0 top 1.875rem;
      background-size: 22.5625rem auto; } }
  @media (min-width: 1920px) {
    .body-wrapper {
      background-image: url(/images/voipstudio/homepage/blue-bg.svg), url(/images/voipstudio/homepage/blue-bg.svg);
      background-position: left -5rem top 41.875rem, right -3.125rem top 5.3125rem;
      background-size: 34.625rem auto, 35.3125rem auto; } }

@media (max-width: 767px) {
  .hero .hero-heading {
    text-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); } }

@media (min-width: 768px) {
  .hero h1, .hero .hero-heading, .hero p.paragraph-large {
    text-shadow: 0 6px 12px rgba(0, 0, 0, 0.16); } }

#sticky-container {
  position: relative; }

#sidenav-sticky-unstick-anchor {
  position: absolute;
  bottom: 0; }

#sidenav-sticky.sticked-bottom {
  position: absolute;
  bottom: 0; }

#sidenav-sticky.sticky {
  position: fixed;
  top: 0;
  bottom: 1.25rem;
  overflow-y: auto;
  z-index: 299; }

#sidenav-sticky::-webkit-scrollbar {
  width: 12px; }

#sidenav-sticky::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
  border-radius: 10px; }

#sidenav-sticky::-webkit-scrollbar-thumb {
  border-radius: 10px;
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5); }

.bullet-list, .introduction-content ul, .introduction-content ol {
  list-style: none;
  margin-bottom: 0; }
  .bullet-list li, .introduction-content ul li, .introduction-content ol li {
    padding-left: 2.0625rem; }
    .bullet-list li:before, .introduction-content ul li:before, .introduction-content ol li:before {
      content: '';
      border-radius: 50%;
      display: inline-block;
      background-color: #E8B300; }
  .bullet-list.blue li:before, .introduction-content ul.blue li:before, .introduction-content ol.blue li:before {
    background-color: #20BAEF; }
  .bullet-list.white li:before, .introduction-content ul.white li:before, .introduction-content ol.white li:before {
    background-color: white; }
  @media (max-width: 767px) {
    .bullet-list, .introduction-content ul, .introduction-content ol {
      padding-left: 0.5rem; }
      .bullet-list li, .introduction-content ul li, .introduction-content ol li {
        font-size: 0.875rem;
        line-height: 1.5rem; }
        .bullet-list li:before, .introduction-content ul li:before, .introduction-content ol li:before {
          width: 0.375rem;
          height: 0.375rem;
          margin-right: 1.4375rem;
          margin-left: -1.8125rem; } }
  @media (min-width: 768px) {
    .bullet-list, .introduction-content ul, .introduction-content ol {
      padding-left: 1rem; }
      .bullet-list li, .introduction-content ul li, .introduction-content ol li {
        font-size: 1.125rem;
        line-height: 2.25rem; }
        .bullet-list li:before, .introduction-content ul li:before, .introduction-content ol li:before {
          width: 0.625rem;
          height: 0.625rem;
          margin-right: 1.4375rem;
          margin-left: -2.0625rem; } }
  @media (max-width: 767px) {
    .bullet-list.small-text li, .introduction-content ul.small-text li, .introduction-content ol.small-text li {
      font-size: 0.75rem;
      line-height: 1.25rem; } }
  @media (min-width: 768px) {
    .bullet-list.small-text li, .introduction-content ul.small-text li, .introduction-content ol.small-text li {
      font-size: 1rem;
      line-height: 1.75rem; } }
  @media (max-width: 767px) {
    .bullet-list.small-bullet li:before, .introduction-content ul.small-bullet li:before, .introduction-content ol.small-bullet li:before {
      width: 0.25rem;
      height: 0.25rem;
      margin-right: 1.4375rem;
      margin-left: -1.125rem; } }
  @media (min-width: 768px) {
    .bullet-list.small-bullet li:before, .introduction-content ul.small-bullet li:before, .introduction-content ol.small-bullet li:before {
      width: 0.375rem;
      height: 0.375rem;
      margin-right: 1.4375rem;
      margin-left: -1.25rem; } }
  @media (min-width: 1920px) {
    .bullet-list.small-bullet li:before, .introduction-content ul.small-bullet li:before, .introduction-content ol.small-bullet li:before {
      width: 0.5rem;
      height: 0.5rem;
      margin-right: 1.4375rem;
      margin-left: -1.375rem; } }

@media (max-width: 767px) {
  .hero {
    padding-top: 4.375rem;
    padding-bottom: 5.3125rem; }
    .hero .hero-heading {
      margin-bottom: 0; }
    .hero .hero-img {
      width: 17.3125rem;
      margin-top: 1.875rem;
      margin-bottom: 1.875rem; } }

@media (min-width: 768px) {
  .hero {
    padding-top: 3.125rem;
    padding-bottom: 5.3125rem; }
    .hero h1 {
      margin-top: 3.75rem; } }

@media (min-width: 1920px) {
  .hero {
    padding-top: 8.125rem;
    padding-bottom: 5.5rem; }
    .hero h1 {
      margin-top: 2.5rem; } }

.cta {
  background-color: #E8B300;
  color: #FFFFFF;
  padding-top: 1.25rem;
  padding-bottom: 1.25rem; }
  @media (max-width: 575px) {
    .cta .btn, .cta a.btn {
      padding-top: 0.5625rem;
      padding-right: 3.125rem;
      padding-bottom: 0.5625rem;
      padding-left: 1.0625rem; } }
  @media (max-width: 767px) {
    .cta .section-heading {
      margin-bottom: 0.75rem; }
    .cta .btn {
      margin-top: 0;
      margin-left: 1.0625rem; } }
  @media (min-width: 768px) {
    .cta .section-heading {
      margin-bottom: 0; }
    .cta .btn {
      margin-left: 4.375rem; } }

.li-parent-style, .menu li.parent-li > a, .menu li.parent-li > a:before {
  font-size: 1rem;
  line-height: 1.3;
  color: #20BAEF;
  text-transform: uppercase; }

.inner-li-style, .menu ul li a, .menu ul li.inner-parent-li a {
  font-size: 1rem;
  line-height: 1.75rem;
  color: #707E81; }

.menu-col .introduction-heading {
  color: #364550;
  font-size: 1.125rem;
  line-height: 1.75rem; }

@media (max-width: 991px) {
  .menu-col {
    position: relative;
    background-color: #E2F0F4;
    padding-top: 2.5rem;
    padding-right: 5%;
    padding-bottom: 16.25rem;
    padding-left: 5%;
    margin-bottom: 4.375rem; }
  .menu-col-inner {
    padding-right: 0.9375rem;
    padding-left: 0.9375rem; } }

.menu ol {
  padding-left: 0;
  margin-bottom: 0; }

.menu ul li {
  padding-left: 0.9375rem; }

.menu ul li a {
  padding-top: 0.3125rem;
  padding-bottom: 0.3125rem; }


.menu ul li.inner-parent-li > a > span:before {
  content: url(/images/voipstudio/manual-chapter/chevron-inner.svg);
  position: absolute;
  left: -0.75rem;
  top: 0.3125rem; }

.menu ul li.inner-parent-li.collapsed > a > span:before {
  -webkit-transform: rotateX(180deg);
          transform: rotateX(180deg); }

.menu li {
  position: relative; }
  .menu li a {
    display: inline-block; }

.menu li.parent-li {
  list-style-type: none;
  counter-increment: li;
  border-bottom: 1px solid #707070;
  padding-top: 0.8125rem;
  padding-right: 1.25rem;
  padding-bottom: 0.8125rem;
  padding-left: 1.25rem; }
  .menu li.parent-li > ul {
    padding-top: 0.625rem; }
  .menu li.parent-li > a > span:before {
    position: absolute;
    left: 0;
    top: 0.8125rem; }
  .menu li.parent-li > a:before {
    content: counter(li) ".";
    display: inline-block;
    margin-right: 0.3125rem; }
  .menu li.parent-li > a:hover {
    text-decoration: none;
    color: #0f9ccd; }
  .menu li.parent-li a.li-collapse + ul {
    display: none; }
  .menu li.parent-li.collapsed > a > span:before {
    -webkit-transform: rotateX(180deg);
            transform: rotateX(180deg); }

@media (max-width: 991px) {
  .menu li.parent-li > a > span:before {
    content: url(/images/voipstudio/manual-chapter/chevron-small.svg);
    width: 0.75rem; } }

@media (min-width: 992px) {
  .menu li.parent-li {
    padding-top: 0.9375rem;
    padding-right: 0.625rem;
    padding-bottom: 0.9375rem;
    padding-left: 2.5rem; }
    .menu li.parent-li > a > span:before {
      content: url(/images/voipstudio/manual-chapter/chevron.svg);
      top: 1rem;
      left: 0.625rem; } }

.introduction {
  position: relative;
  overflow: hidden;
  padding-bottom: 54px; }
  @media (max-width: 375px) {
    .introduction {
      padding-right: 0;
      padding-left: 0; } }
  @media (min-width: 768px) {
    .introduction {
      padding: 111px 0 93px; } }
  @media (min-width: 1920px) {
    .introduction {
      padding: 145px 0 220px; } }
  @media (max-width: 375px) {
    .introduction > .container {
      padding-right: 0.9375rem;
      padding-left: 0.9375rem; } }
  @media (max-width: 991px) {
    .introduction > .container {
      max-width: 100%; } }

@media (max-width: 375px) {
  .introduction-content {
    padding-right: 1.875rem;
    padding-left: 1.875rem; } }

.introduction-content h1, .introduction-content h2, .introduction-content h3 {
  color: #364550;
  text-transform: none; }

@media (max-width: 991px) {
  .introduction-content h1, .introduction-content h2 {
    font-size: 1.5625rem;
    line-height: 1.75rem;
    margin-bottom: 3.125rem; } }

@media (min-width: 992px) {
  .introduction-content h1, .introduction-content h2 {
    font-size: 1.9375rem;
    line-height: 2.125rem;
    margin-bottom: 2.5rem; } }


@media (max-width: 991px) {
    .introduction-content h3, .introduction-content h1 + p {
      font-size: 1.125rem;
      line-height: 1.5rem; } }
  @media (min-width: 992px) {
    .introduction-content h3, .introduction-content h1 + p {
      font-size: 1.375rem;
      line-height: 1.75rem; } }

.introduction-content h4 {
  color: #707E81; }
  @media (max-width: 767px) {
    .introduction-content h4 {
      font-size: 1rem;
      line-height: 1.5rem; } }
  @media (min-width: 768px) {
    .introduction-content h4 {
      font-size: 1.25rem;
      line-height: 1.75rem; } }

@media (max-width: 991px) {
  .introduction-content p {
    margin-bottom: 1.5625rem; } }

@media (min-width: 992px) {
  .introduction-content p {
    margin-bottom: 1.875rem; } }

.introduction-content p > img {
  max-width: 100%; }

.introduction-content img[alt='How VoIP works'] {
  width: 100%; }

@media (max-width: 991px) {
  .introduction-content ul {
    margin-bottom: 1.5625rem; } }

@media (min-width: 992px) {
  .introduction-content ul {
    margin-bottom: 1.875rem; } }

.introduction-content ul li p {
  display: inline-block;
  margin-bottom: 0; }

.introduction-content ol {
  counter-reset: list; }
  .introduction-content ol li {
    padding-left: 0; }
    .introduction-content ol li p {
      display: inline-block;
      margin-bottom: 0; }
  .introduction-content ol li:before {
    counter-increment: list;
    content: counter(list) ". ";
    color: #E8B300;
    width: 0;
    height: 0;
    min-width: 0.625rem;
    display: inline-block;
    background-color: transparent;
    border-radius: 0;
    margin-left: 0; }
  @media (max-width: 991px) {
    .introduction-content ol {
      margin-bottom: 1.5625rem; } }
  @media (min-width: 992px) {
    .introduction-content ol {
      margin-bottom: 1.875rem; } }

.introduction-content .figure {
  color: #20BAEF; }
  @media (max-width: 991px) {
    .introduction-content .figure {
      margin-bottom: 2.5rem; } }
  @media (min-width: 992px) {
    .introduction-content .figure {
      margin-bottom: 1.875rem; } }
  .introduction-content .figure > b {
    display: inline-block;
    margin-right: 0.625rem; }
  @media (max-width: 767px) {
    .introduction-content .figure {
      font-size: 0.875rem;
      line-height: 1.375rem; } }
  @media (min-width: 768px) {
    .introduction-content .figure {
      font-size: 1.125rem;
      line-height: 1.75rem; } }

.introduction-content code {
  font-size: 1rem;
  letter-spacing: -0.5px;
  padding: 2px 4px;
  color: #c7254e;
  background-color: #f9f2f4;
  border-radius: 4px; }

.introduction-content pre {
  font-size: 0.875rem;
  line-height: 1.2;
  color: white;
  border: 1px solid #707070;
  background-color: #364550;
  border-radius: 3px;
  padding: 0.625rem; }

.introduction-content > table {
  border: none !important;
  margin-top: 3.75rem; }
  @media (max-width: 767px) {
    .introduction-content > table {
      margin-bottom: 3.4375rem; } }
  @media (min-width: 768px) {
    .introduction-content > table {
      margin-bottom: 7.1875rem; } }
  @media (min-width: 1920px) {
    .introduction-content > table {
      margin-bottom: 4.375rem; } }
  .introduction-content > table > tbody > tr > td {
    padding: 0.5rem !important;
    border: none !important; }
    @media (max-width: 767px) {
      .introduction-content > table > tbody > tr > td {
        font-size: 0.875rem; } }
    @media (min-width: 768px) {
      .introduction-content > table > tbody > tr > td {
        font-size: 1.125rem; } }
    .introduction-content > table > tbody > tr > td:not(:last-child) {
      border-right: 1px solid #20BAEF !important; }
  .introduction-content > table > tbody > tr:first-child > td {
    border-bottom: 1px solid #20BAEF !important; }
  .introduction-content > table > tbody > tr:first-child td {
    text-transform: uppercase; }
    @media (max-width: 767px) {
      .introduction-content > table > tbody > tr:first-child td {
        font-size: 0.875rem; } }
    @media (min-width: 768px) {
      .introduction-content > table > tbody > tr:first-child td {
        font-size: 1.125rem; } }
  @media (max-width: 1919px) {
    .introduction-content > table > tbody tr > td > table > tbody > tr > td {
      display: table-row; }
      .introduction-content > table > tbody tr > td > table > tbody > tr > td img {
        margin-top: 0.9375rem; } }
  .introduction-content > table > tbody tr > td > table > tbody > tr > td:last-of-type {
    vertical-align: bottom; }
  .introduction-content > table > tbody tr > td > table > tbody > tr > td > img {
    max-width: 100%; }
  .introduction-content > table code {
    color: #FF1D31;
    font-size: inherit;
    letter-spacing: normal;
    background-color: transparent;
    border-radius: 0;
    padding: 0; }

.introduction-table h3 {
  text-transform: uppercase;
  border-bottom: 1px solid #20BAEF; }

.introduction-table span {
  word-break: break-word;
  color: #FF1D31; }

.introduction-table > .table-col:first-child {
  border-right: 1px solid #20BAEF; }
  .introduction-table > .table-col:first-child h3, .introduction-table > .table-col:first-child div {
    padding-right: 0.875rem; }

.introduction-table > .table-col:last-child h3, .introduction-table > .table-col:last-child div {
  padding-left: 0.875rem; }

@media (max-width: 767px) {
  .introduction-table {
    margin-top: 1.875rem;
    margin-bottom: 3.4375rem; }
    .introduction-table h3, .introduction-table div {
      font-size: 0.875rem;
      line-height: 1.125rem; }
    .introduction-table .table-col {
      padding-top: 0.75rem;
      padding-bottom: 0.75rem; }
      .introduction-table .table-col h3 {
        padding-bottom: 0.625rem; }
        .introduction-table .table-col h3 + div {
          margin-top: 0.75rem; }
      .introduction-table .table-col:first-child div:first-of-type {
        margin-bottom: 1rem; }
    .introduction-table img {
      margin-top: 0.5rem; } }

@media (min-width: 768px) {
  .introduction-table {
    margin-top: 1.25rem;
    margin-bottom: 7.1875rem; }
    .introduction-table h3, .introduction-table div {
      font-size: 1.125rem;
      line-height: 2.1875rem; }
    .introduction-table .table-col {
      padding-top: 0.3125rem;
      padding-bottom: 0.3125rem; } }

@media (min-width: 1920px) {
  .introduction-table {
    margin-bottom: 4.375rem; } }

.api-endpoint-doc-wrapper {
  border-radius: 0;
  background-color: white;
  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
          box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  margin: 20px 0 10px;
  padding: 0; }
  .api-endpoint-doc-wrapper h2 {
    font-size: 1rem;
    line-height: 1.2;
    color: #2d4454;
    margin: 0; }
  .api-endpoint-doc-wrapper .api-endpoint-url {
    display: inline-block;
    font-family: "Courier New", "Consolas", Courier, monospace;
    font-weight: bold;
    color: #2d4454;
    margin-right: 0.625rem; }
    @media (max-width: 767px) {
      .api-endpoint-doc-wrapper .api-endpoint-url {
        font-size: 1rem; } }

.api-doc-body {
  word-break: break-word; }
  .api-doc-body.hidden > div {
    overflow: hidden;
    max-height: 0; }
  .api-doc-body > div {
    max-height: 2500px; }

.api-body-header {
  height: 45px;
  padding: 10px 0 0 20px;
  background-color: rgba(60, 170, 181, 0.1); }
  .api-body-header h3 {
    font-size: 1rem;
    margin: 0;
    color: #2d4454; }


.api-body-content {
  padding: 10px 10px 10px 20px; }
  .api-body-content h4 {
    font-size: 1rem;
    padding: 0;
    margin: 0 0 5px 0;
    color: #2d4454; }

.api-request {
  padding: 10px 10px 0 0; }
  .api-request pre {
    padding: 5px;
    color: white;
    background-color: #41444e; }

.api-endpoint-doc-title {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: stretch;
  -webkit-align-items: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  min-height: 3.4375rem;
  cursor: pointer; }

.api-endpoint-url-block {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0.625rem; }

.api-endpoint-method {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-flex-shrink: 0;
      -ms-flex-negative: 0;
          flex-shrink: 0;
  width: 5rem;
  font-size: 1rem;
  color: white; }
  .api-endpoint-method:after {
    content: '';
    display: block;
    width: 100%;
    height: 1px;
    position: absolute;
    left: 0;
    bottom: 0; }
  @media (min-width: 992px) {
    .api-endpoint-method {
      width: 6.25rem;
   }}

.api-method-post {
  background-color: #78BC61; }

.api-method-get {
  background-color: #3CAAB5; }

.api-method-patch {
  background-color: #50E3C2; }

.api-method-delete {
  background-color: #ED6A5A; }

.header-post {
  border-top: 1px solid #78BC61; }

.header-get {
  border-top: 1px solid #3CAAB5; }

.header-patch {
  border-top: 1px solid #50E3C2; }

.header-delete {
  border-top: 1px solid #ED6A5A; }

.api-property-name {
  font-family: "Courier New",Courier,monospace;
  font-weight: bold;
  color: #2d4454; }

.api-property-type {
  color: gray;
  font-size: 14px;
  font-weight: bold; }

.api-property-type {
  font-size: 0.875rem; }

@media (min-width: 768px) {
  .api-row {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
        -ms-flex-direction: row;
            flex-direction: row; }
    .api-row .api-doc-col {
      width: 50%; } }

.body-wrapper {
  position: relative; }
  @media (max-width: 767px) {
    .body-wrapper {
      background-size: 11.25rem auto;
      background-position: right -0.625rem top 0; } }

.shape-img {
  position: absolute;
  height: auto; }
  @media (max-width: 991px) {
    .shape-img {
      width: 12.875rem;
      left: -3.75rem;
      bottom: 0;
      opacity: 0.61;
      z-index: 0; } }
  @media (min-width: 992px) {
    .shape-img {
      z-index: -1; } }
  @media (min-width: 992px) and (max-width: 1919px) {
    .shape-img {
      width: 29.375rem;
      left: -5.625rem;
      bottom: 1rem;
      opacity: 0.34; } }
  @media (min-width: 1920px) {
    .shape-img {
      width: 51.0625rem;
      right: -3.125rem;
      bottom: 11.5625rem; } }

@media (min-width: 992px) {
  #sidenav-sticky.sticky {
    margin-top: 8.75rem; } }

.api-description-content {
  padding: 10px;
}