/**
 * If using a CSS pre-processor, tell it to overwrite this file. If not, place
 * your custom CSS modifications here.
 */
 #top-banner-side-text{
  text-align: center;
}
#social {
  margin-top: -1em;
  padding-right: 35px;
}
#footer-left {
float:left;
background:Red;
width:33%;
height:280px;
}
#footer-middle{
float:left;
background:Green;
width:33%;
height:280px;
}
#footer-right{
float:right;
background:blue;
width:34%;
height:280px;
}
#titleBlock{
  background-color: black;
  color: white;
  font-size: 20px;
  font-weight: bold;
  text-align: center;
}
#bodyBlock{
  background-color: white;
  color: black;
  font-size: 15px; 
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
#blockSpacing{
  padding-top: 10px;
  padding-right: 20px;
  padding-bottom: 10px;
  padding-left: 20px;
}
#client_cnt_heading{
background-color: #ffffff;
font-size: 30px;
}
#news_cnt_heading{
background-color: #f1bcbc;
font-size: 20px;
font-weight: bold;
text-align: center; 
}
#news_cnt_heading{
  background-color: #f1bcbc;
  font-size: 20px;
  font-weight: bold;
  text-align: center; 
}
#client_title{
background-color: #000000;
color: #ffffff;
font-size: 20px;
font-weight: bold;
text-align: center; 
}
#client_cnt_Flexlink_button{
padding-top: 10px;
padding-right: 20px;
padding-bottom: 10px;
padding-left: 20px;
font-size: 20px;
font-weight: bold;
text-align: center; 
}
#usecaseHeading{
background-color: black;
  color: white;
  font-size: 25px;
  font-weight: bold;
  text-align: center;
  width: 100%;
  height: 60px;
  padding: 10px;
}
@font-face{
  font-family: 'PublicoHeadline-Roman'; 
  src:url('../fonts/PublicoHeadline-Roman.otf'); 
}
@font-face{
  font-family: 'PublicoHeadline-Bold'; 
  src:url('../fonts/PublicoHeadline-Bold.otf'); 
}
@font-face{
  font-family: 'Graphik-Black'; 
  src:url('../fonts/Graphik/Graphik-Black.otf'); 
}
@font-face{
  font-family: 'Graphik-Light'; 
  src:url('../fonts/Graphik/Graphik-Light.otf'); 
}
@font-face{
  font-family: 'Graphik-LightItalic'; 
  src:url('../fonts/Graphik/Graphik-LightItalic.otf'); 
}
@font-face{
  font-family: 'Graphik-Medium'; 
  src:url('../fonts/Graphik/Graphik-Medium.otf'); 
}
@font-face{
  font-family: 'Graphik-Regular'; 
  src:url('../fonts/Graphik/Graphik-Regular.otf'); 
}
@font-face{
  font-family: 'Graphik-Semibold'; 
  src:url('../fonts/Graphik/Graphik-Semibold.otf'); 
}

ol {
  max-width: 350px;
  counter-reset: my-awesome-counter 0;
  list-style: none;
  padding-left: 40px;
}
ol li {
  margin: 0 0 1rem 0;
  counter-increment: my-awesome-counter 1;
  position: relative;
}
ol li::before {
  content: counter(my-awesome-counter);
  color: #FFFFFF;
  font-size: 1.5rem;
  font-weight: bold;
  position: absolute;
  --size: 32px;
  left: calc(-1 * var(--size) - 10px);
  line-height: var(--size);
  width: var(--size);
  height: var(--size);
  top: 0;
  background: #18a3a5;
  border-radius: 50%;
  text-align: center;
  box-shadow: 1px 1px 0 #999;
}
.numberDesign{
  color: #FFFFFF;
  font-size: 1.5rem;
  font-weight: bold;
  position: absolute;
  --size: 25px;
  line-height: var(--size);
  width: var(--size);
  height: var(--size);
  background: #18a3a5;
  border-radius: 50%;
  text-align: center;
  box-shadow: 1px 1px 0 #999;
  font-family: 'Graphik-Regular';
}
.bulletDotColor{
  color: #18a3a5;
  font-size: 3rem;
  font-weight: bold;
  position: static;
  --size: 25px;
  line-height: var(--size);
  width: var(--size);
  height: var(--size);
  text-align: center;
}

ul.sf-menu.sf-style-white a, ul.sf-menu.sf-style-white a:visited, ul.sf-menu.sf-style-white span.nolink {
  color: #000000;
}
ul.sf-menu.sf-style-white {
  float: right;
}
ul.sf-menu.sf-style-white a, ul.sf-menu.sf-style-white a:visited, ul.sf-menu.sf-style-white span.nolink {
  background-color: #ffffff;  
}
#block-mainnavigation-superfish {
  padding-right: 50px;
}
ul.sf-menu.sf-style-white span.nolink:hover{
  background-color:#FFFFFF;
}
.dropdown-selector-content {
  min-width: 350px !important;
}
.bulletListLineSpacing{
  line-height: 35px;
}
.supportBodyBlock{
  color: black;
  font-size: 18px;
  padding-top: 10px;
  padding-right: 150px;
  padding-bottom: 10px;
  padding-left: 150px;
  font-family: 'Graphik-Regular'
}
.navigation_left.container-fluid {
  float: left;
  text-align: left;
  font-size: 28px;
  font-family: 'Graphik-Light';
  padding-left: 25px;
}
.navigation_middle.container-fluid {
  text-align: left;
  float: left;
  width: 45%;
  font-size: 28px;
  font-family: 'Graphik-Light';
  padding-top: 10px;
}
.navigation_right.container-fluid {
  text-align: left;
  float: right;
  width: 45%;
  font-size: 18px;
  padding-top: 10px;
  font-family: 'Graphik-Medium';
  padding-right: 25px;
}
.div-three-boxes{
	width:994px;
}
.left-box-three {
  float: left;
  width: 311px;
  height: 164px;
  border: 1px solid #d1cece;
  margin: 10px;
}
.middle-box-three {
  float: left;
  width: 311px;
  height: 164px;
  border: 1px solid#d1cece;
  margin: 10px;
}
.right-box-three {
  float: right;
  width: 311px;
  height: 164px;
  border: 1px solid #d1cece;
  margin: 10px;
}
.webform-button--submit{
  margin-right: 10px;
}
.webform-button--reset{
  margin-left: 10px;
}
@media only screen and (min-width: 320px) and (max-width: 360px) {
  .toolbar .toolbar-bar {
    width: 375px;
  }
  /*.region-header.container-fluid{
    max-width: 300px;
  }*/
  #superfish-main-toggle {
    background-image: url(/themes/APIDevPortalTheme/images/Menu_Icon.svg);
    background-size: 70px 35px;
    background-color: white;
  }
  div.sf-accordion-toggle.sf-style-white a {
    border: none;
  }
  #superfish-main-toggle span {
    display:none;
  }
  .region-header {
      display: block;
  }
  .col-sm-12{
    padding-left:0px;
    padding-right:0px;
  }
  .sitelogo-image-style {
    margin-left: 5px;
    padding-left:40px
  }
  .frontPageBannerAlignment {
    padding-left:40px;
  }
  .navigation_middle {
    width: 47%;
  }
  .navigation_right {
    width: 25%;
    margin-right: 0px;
    padding-top: 20px;
  }
  .frontPageBannerBodyTitle {
    font-size: 40px;
  }
  .block-content-image-style {
    width: 295px;
    height: 180px;
  }
  .workflow-image-style {
    width: 340px;
  }
  .block-top-image-style {
    width: 100%;
  }
  .block-integration-image-style {
    height: auto;
  }
  .use-cases-image-style {
    width: 325px;
    height: 150px;
  }
  .useCaseTitle{
    width:325px;
  }
  .useCaseBody{
    width:325px;
  }
  .pageTitleFont {
    font-size: 30px;
  }
  .pageBodyTitleFont {
    font-size: 26px;
  }
  .footer-left {
    padding-top: 15px;
  }
  .footer-middle-second {
    width: 100%;
    padding-top: 20px;
    text-align: left;
    padding-left: 36px;
  }
  .footer-right {
    padding-top: 20px;
    padding-left: 40px;
  }
  .linkTextWhite {
    margin-top: -20px;
  }
  .navigation_left.container {
    clear: left;
    margin-left: -25px;
  }
  .navigation_middle.container {
    clear: left;
    margin-left: -5x;
    font-size: 18px;
    width:200px
  }
  .navigation_right.container {
    margin-top: 20px;
    width: 60px;
    float: left;
    margin-left: 60px;
  }
  .navigation_left.container-fluid {
    float: left;
    margin-left: -50px;
  }
  .navigation_middle.container-fluid {
    float: left;
    margin-left: 0px;
    font-size: 18px;
    width: 70%;
  }
  .navigation_right.container-fluid {
    margin-top: 20px;
    width: 80px;
    float: left;
    margin-left: 7px;
  }
  #block-apidevelopercenter div {
    margin-top: -20px;
    margin-bottom: 20px;
    padding-left:21px;
  }
  #block-mainnavigation-superfish {
    margin-top:-70px;
  }
  .region-footer {
      display: block;
      clear: left;
  }
  .footer {
    height: 250px;
    width: 375px;
  }
  .footer-middle-first {
    padding-top: 20px;
  }
  .footer-right {
    text-align:left;
    float: left;
    padding-top: 20px;
    width:100%;
  }
  .footer-middle-first.pageFooterFont {
    text-align: left;
    padding-left: 40px;      
  }
  .footer-middle-first.pageFooterFont a {
    display:block;      
  }
  .region-sidebar-first {
    margin-left: 35px;
  }
  .supportBodyBlock {
    padding-right: 20px;
    padding-left: 40px;
  }
  .sc-pZOBi.bDYA-Dn{
    right: 27px;
    z-index: 100;
    border-radius: 50%;
    bottom: 65px;
    width: 40px;
    height: 40px;
    padding: 0px 10px;
  }   
  #backtotop {
    background-size: 40px 40px;
    bottom: 4px;
    right: 10px;
  }
  .div-three-boxes {
    width: 331px;
  }
  .pageTitleSubTextAlignment {
    display: none;
  }
}
@media only screen and (min-width: 361px) and (max-width: 415px) {
  .toolbar .toolbar-bar {
    width: 430px;
  }
  /*.region-header.container-fluid{
    max-width: 414px;
  }*/
  #superfish-main-toggle {
    background-image: url(/themes/APIDevPortalTheme/images/Menu_Icon.svg);
    background-size: 70px 35px;
    background-color: white;
  }
  div.sf-accordion-toggle.sf-style-white a {
    border: none;
  }
  #superfish-main-toggle span {
    display:none;
  }
  .region-header {
      display: block;
  }
  .col-sm-12{
    padding-left:0px;
    padding-right:0px;
  }
  .sitelogo-image-style {
    margin-left: 15px;
    padding-left:40px
  }
  .frontPageBannerAlignment {
    padding-left:40px;
  }
  .navigation_middle {
    width: 47%;
  }
  .navigation_right {
    width: 25%;
    margin-right: 8px;
    padding-top:20px;
  }
  .frontPageBannerBodyTitle {
    font-size: 40px;
  }
  .block-content-image-style {
    width: 340px;
    height: 180px;
  }
  .workflow-image-style {
    width: 400px;
  }
  .block-top-image-style {
    width: 100%;
  }
  .block-integration-image-style {
    height: auto;
  }
  .use-cases-image-style {
    width: 380px;
    height: 180px;
  }
  .useCaseTitle{
    width:380px;
  }
  .useCaseBody{
    width:380px;
  }
  .pageTitleFont {
    font-size: 30px;
  }
  .pageBodyTitleFont {
    font-size: 26px;
  }
  .footer-left {
    padding-top: 15px;
  }
  .footer-middle-second {
    width: 100%;
    padding-top: 20px;
    text-align: left;
    padding-left: 36px;
  }
  .footer-right {
    padding-top: 20px;
    padding-left: 40px;
  }
  .linkTextWhite {
    margin-top: -20px;
  }
  .navigation_left.container {
    clear: left;
    margin-left: -30px;
  }
  .navigation_middle.container {
    clear: left;
    margin-left: 5px;
    font-size: 18px;
    width:215px
  }
  .navigation_right.container {
    margin-top: 20px;
    width: 60px;
    float: left;
    margin-left: 85px;
  }
  .navigation_left.container-fluid {
    clear: left;
    margin-left: -55px;
  }
  .navigation_middle.container-fluid {
    clear: left;
    margin-left: 5px;
    font-size: 18px;
    width: 66%;
  }
  .navigation_right.container-fluid {
    margin-top: 20px;
    width: 80px;
    float: left;
    margin-left: 28px;
  }
  #block-apidevelopercenter div {
    margin-top: -20px;
    margin-bottom: 20px;
    padding-left:22px;
  }
  #block-mainnavigation-superfish {
    margin-top:-70px;
  }
  .region-footer {
      display: block;
      clear: left;
  }
  .footer {
    height: 250px;
    width: 430px;
  }
  .footer-middle-first {
    padding-top: 20px;
  }
  .footer-right {
    text-align:left;
    float: left;
    padding-top: 20px;
    width:100%;
  }
  .footer-middle-first.pageFooterFont {
    text-align: left;
    padding-left: 40px;      
  }
  .footer-middle-first.pageFooterFont a {
    display:block;      
  }
  .region-sidebar-first {
    margin-left: 35px;
  }
  .supportBodyBlock {
    padding-right: 20px;
    padding-left: 40px;
  }
  .sc-pZOBi.bDYA-Dn{
    right: 27px;
    z-index: 100;
    border-radius: 50%;
    bottom: 65px;
    width: 40px;
    height: 40px;
    padding: 0px 10px;
  }
  #backtotop {
    background-size: 40px 40px;
    bottom: 4px;
    right: 10px;
  }
  .div-three-boxes {
    width: 331px;
  }
  .pageTitleSubTextAlignment {
    display: none;
  }
}
@media only screen and (min-width: 416px) and (max-width: 480px) {
  .toolbar .toolbar-bar {
    width: 495px;
  }
  /*.region-header.container-fluid{
    max-width: 480px;
  }*/
  #superfish-main-toggle {
    background-image: url(/themes/APIDevPortalTheme/images/Menu_Icon.svg);
    background-size: 70px 35px;
    background-color: white;
  }
  div.sf-accordion-toggle.sf-style-white a {
    border: none;
  }
  #superfish-main-toggle span {
    display:none;
  }
  .region-header {
      display: block;
  }
  .col-sm-12{
    padding-left:0px;
    padding-right:0px;
  }
  .sitelogo-image-style {
    margin-left:15px;
    padding-left:40px
  }
  .frontPageBannerAlignment {
    width: 510px;
    padding-left:40px;
  }
  .frontPageBannerBodyTitle {
    font-size: 50px;
  }
  .block-content-image-style {
    width: 400px;
    height: 180px;
  }
  .block-top-image-style {
    width: 450px;
  }
  .workflow-image-style {
    width: 460px;
  }
  .block-integration-image-style {
    height: auto;
  }
  .use-cases-image-style {
    width: 440px;
    height: 190px;
  }
  .useCaseTitle{
    width:440px;
  }
  .useCaseBody{
    width:440px;
  }
  .pageTitleFont {
    font-size: 30px;
  }
  .footer-left {
    padding-top: 15px;
  }
  .footer-middle-second {
    width: 75%;
    padding-top: 20px;
  }
  .footer-right {
    padding-top: 20px;
    padding-left: 40px;
  }
  .linkTextWhite {
    margin-top: -20px;
  }
  .navigation_right {
    width: 25%;
    margin-right: 8px;
    padding-top:20px;
  }
  .navigation_left.container {
    clear: left;
    margin-left: -30px;
  }
  .navigation_middle.container {
    clear: left;
    margin-left: 5px;
    font-size: 18px;
    width:215px
  }
  .navigation_right.container {
    margin-top: 20px;
    width: 60px;
    float: left;
    margin-left: 135px;
  }
  .navigation_left.container-fluid {
    clear: left;
    margin-left: -55px;
  }
  .navigation_middle.container-fluid {
    clear: left;
    margin-left: 5px;
    font-size: 18px;
    width: 66%;
  }
  .navigation_right.container-fluid {
    margin-left: 35px;
    margin-top: 20px;
    width: 80px;
    float: left;
  }
  #block-apidevelopercenter div {
    margin-top: -20px;
    margin-bottom: 20px;
    padding-left:22px;
  }
  #block-mainnavigation-superfish {
    margin-top:-70px;
  }
  .region-footer {
      display: block;
      clear: left;
  }
  .footer {
    height: 250px;
    width: 495px;
  }
  .footer-middle-first {
    padding-top: 20px;
  }
  .footer-right {
    text-align:left;
    float: left;
    padding-top: 20px;
    width:100%;
  }
  .footer-middle-first.pageFooterFont {
    text-align: left;
    padding-left: 40px;      
  }
  .footer-middle-first.pageFooterFont a {
    display:block;      
  }
  .region-sidebar-first {
    margin-left: 35px;
  }
  .supportBodyBlock {
    padding-right: 20px;
    padding-left: 40px;
  }
  .sc-pZOBi.bDYA-Dn{
    right: 27px;
    z-index: 100;
    border-radius: 50%;
    bottom: 65px;
    width: 40px;
    height: 40px;
    padding: 0px 10px;
  }
  #backtotop {
    background-size: 40px 40px;
    bottom: 4px;
    right: 10px;
  }
  .div-three-boxes {
    width: 331px;
  }
  .pageTitleSubTextAlignment {
    display: none;
  }
}

div.sf-accordion-toggle.sf-style-white  > a:after {
  content: "";
}
.form-actions{
  text-align:center;
}
.clientNumberBulletAlignment{
  margin-top:7px;
}
.bodySubContentAlignment{
  margin-left:45px;
}
.pageTitleSubTextAlignment{
  margin-top:11px;
}
.region-sidebar-first{
  margin-top:10px;
}
.table-border {
  border: 1px solid black;
  border-collapse: collapse;
}