.sxly-badge {
    max-width: 150px;
    position: absolute;
    bottom: 12%;
    top: auto;
    left: auto;
    right: 2%;
    z-index: 9;
  }
  .page-socxly #svgicon .st0{
    fill: #2A2B3D !important;
  }
  .page-socxly-socxly-home .menu-bar.black {
    background: url(/wp-content/themes/writee/assets/images/socxly/home/banner.jpg) !important;
    transition: none;
    -webkit-transition: none;
    background-position: bottom !important;
    background-repeat: no-repeat;
    background-size: cover !important;

  }
  .page-socxly-socxly-home .menu-bar.black .socxly-menu li a {
    color: white !important;
    }
     .page-socxly-socxly-home .menu-bar.black .socxly-menu .dropdown-menu li a {
        color: black !important;
    }
   .page-socxly-socxly-home .menu-bar.black .socxly-mobile-menu a.menu-trigger{

    filter: invert(0) !important;

  }
  .page-socxly-socxly-home .menu-bar.black #svgicon .st0 {
    fill: white;
}
   .page-socxly-socxly-home .menu-bar.black a.menu-trigger+span{
    color:white !important;
  }

   .page-socxly-socxly-home .menu-bar.black .socxly-menu .dropdown-menu li a{
    color:black !important;
  }
   .page-socxly-socxly-home .menu-bar.black .logo .scroll-logo {
    display: none;
  }
   .page-socxly-socxly-home .menu-bar.black .logo .scroll-logo.home {
    display: block !important;
  }

  .socxly-home {
    position: relative;
    width:100%;
    overflow: hidden;
  } 
  .bread-crumb{
    display: none;
  } 
  body.page-socxly .menu-bar {
    position: fixed !important;
    top: 0px;
    bottom: auto;
    left: 0px;
    right: 0px;
  }
  
  .socxly-banner {
    position: relative;
  }
  .socxly-banner .banner-text {
    position: absolute;
    top: 27%;
    left: 3%;
    right: auto;
    bottom: auto;
    text-align: center;
  }
  .socxly-banner .banner-text h1{
    font-size:45px;
    font-weight:600;        
  }
  .socxly-banner .banner-text p {
    font-size: 20px;
    font-weight: 600;
    text-align: center;
}

.socxly-banner .banner-text h1,
.socxly-banner .banner-text p {
    color: white;
    margin-bottom: 20px

  }
  .socxly-banner .middle-download {
    line-height: normal;
    font-size: 17px;
    max-width: 235px;
    font-weight:600;
  }
  .section h2{
    font-size: 35px;
    font-weight: 600;
    color: rgb(18 60 95);
    position: relative;
    padding: 25px 0px;
    text-align: center;
  }
  .section h2:after{
    content: '';
    background: url(https://www.socxo.com/themes/socxo/assets/images/socxly/home/line.png);
    background-size: 100%;
    width: 380px;
    height: 17px;
    position: absolute;
    bottom: -10px;
    left: 0px;
    right: 0px;
    margin: auto;
    background-repeat: no-repeat;
    background-position: center;
  }

  .points-box .img-box img {
    max-width: 150px;
    margin: auto;
  }
  .points-box .img-box {
    display: flex;
    align-items: center;    
  }
  .points-box{
     position: relative;
     text-align: center;
  }
   
  .section.one {
    position: relative;
    margin-bottom: 160px;
  }
  .points-box.one {   
    top: 140px;
  } 
  .points-box.two {   
    top: 80px;
  }  
  .points-box img{
    box-shadow: 0 21px 21px 0 rgb(0 0 0 / 20%);
    border-radius: 100%;
  }
  .points-box.two img{
    background: #ef6822;
}

.points-box.one img,
.points-box.three img {
    background: #123c5f;
  }
  
  .points-box.two img {
    max-width: 180px;
    
  }

  .points-box.three {   
    top: 180px;
  }

  .points-box .text {
    margin: 20px auto 100px auto;
  }

  .section.two{
    background:rgb(247 248 252);
  }
  .feature-box {
    margin: 60px auto;
}
  .feature-points {
    display: flex;
    align-items: center;
    justify-content: start;
    min-height: 555px;
    flex-direction: row;
  }
  .feature-points h3 {
    font-size: 30px;
    font-weight: 600;
    color: rgb(18 60 95);
  }
  .feature-points ul li{
    position:relative;
    padding-left:20px;
  }

  .feature-points ul li:before {
    content: '';
    width: 10px;
    height: 10px;
    background: #ef6822;
    position: absolute;
    border-radius: 100%;
    left: 0px;
    right: auto;
    top: 35%;
    bottom: auto;
  }

  .tab-section {
        background:#eaeaea;
        display: inline-flex;
        align-items: center;
        justify-content: center;        
        border-radius: 45px;
        margin: auto;
    }
    
    .tab-section .tab {
        padding: 10px 20px;
        font-size: large;
        font-weight: bold;
        cursor: pointer;
    }
    .tab-section .tab.active {
        background: #18446a;
        color: white;
        border-radius: 40px;
    }
  /* The switch - the box around the slider */
  .switch {
    position: relative;
    display: inline-block;
    width: 50px;
    height: 25px;
  }
  .switch-box span {
      padding: 0px 5px 5px 5px;
      display: inline-block;
      font-weight:normal;
      color: #606060;
  }
  .switch-box span span {
    padding: 0px;
    font-size: 20px;
}

  /* Hide default HTML checkbox */
  .switch input {
    opacity: 0;
    width: 0;
    height: 0;
  }

  /* The slider */
  .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #18446a;
    -webkit-transition: .4s;
    transition: .4s;
  }

  .slider:before {
    position: absolute;
    content: "";
    height: 18px;
    width: 18px;
    left: 0px;
    margin:auto 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
  }

  input:checked + .slider {
    background-color: #18446a;
  }

  input:focus + .slider {
    box-shadow: 0 0 1px #18446a;
  }

  input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
  }

  /* Rounded sliders */
  .slider.round {
    border-radius: 34px;
  }

  .slider.round:before {
    border-radius: 50%;
  }
  .switch-box {
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    margin:20px auto;
    text-transform: uppercase;
    min-height: 32px;
  }
  .plan-box sup {
    font-size: 22px;
  }
  .plan-box p {
    margin-bottom: 5px;
    line-height: normal;
    font-size:large;
  }
  p.plan_price {    
    font-size: 40px !important;
    font-weight: 600;
    color:#606060;
  }
  p.plan_price small {
      font-size: 16px;
  }
  p.plan_name {  
    border-top: 5px solid #fe5c01;
    padding: 15px 0px;
    font-size: 20px;
    margin: auto;
    font-weight: 600;
    padding-bottom: 0px;
    color: #606060;
  }

/*  .plan-box .middle-download {
	  max-width: 100px !important;
    min-width: 100px !important;
    margin: auto;
    margin-left: 10px;
    line-height: normal;
    min-height: 33px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-weight:600;
  }*/
  .plan-box {
    background: #f9f9f9;
    padding: 30px;
    text-align: center;
    border-radius: 10px;
    box-shadow: 0px 0px 10px rgb(0 0 0 / 60%);
    margin: auto;
    margin-bottom: 30px;
    
  }
  .light-background th, .light-background td {
    min-height: 70px;
    vertical-align: middle !important;
  }
  .pricing-table table{    
    width: 100%;
    display: table;
    text-align: center;
    display: none;
    margin-bottom:0px;
  }

  .plans .col-md-4{
    display: none;
  }
  .plans .active{
    display: block;
  }
  .pricing-table table.active{
    display: block;
    display: table;
  }
  
  .pricing-table table th{
    
      padding: 10px;
      text-align: center;
      font-weight: 600;
  }
  
  .pricing-table table th.active, .pricing-table table td.active{
    display: block;
  }
  .light-background{

    background: #f7f8fc;
    font-size: 20px;
    font-weight:600;
    position: relative;
    text-align:left;
  }

  
  .light-background td, .light-background th{
    border-width: 0px 0px 0px 0px;
  }
  tr.light-background td {
      border-right: 1px solid #f7f8fc !important;
  }
  .table>tbody>tr>td:nth-child(2), .table>tbody>thead>th:nth-child(2){
    text-align: left;
  }
  
  .table>tbody>tr>td, .table>tbody>tr>th{
    border:0px;
    border-right: 1px solid #ddd;
    padding:10px;
  }
  .table>thead>tr>th{
    border:0px;
  }
  button.popbtn {
  background: #124266;
    font-size: 10px;
    padding: 0px;
    width: 16px;
    border-radius: 100%;
    height: 16px;
  }
  .popbtn.focus, .popbtn:focus, .popbtn:hover{
    color:white;
  }
  .popover {
      font-family: 'Titillium Web';
  }
  .popover.top {    
      background: #124266;
  }
  .popover-content {
      color: white;
      padding:5px;
  }
  .popover.top>.arrow:after {
      border-top-color: #124266;
  }
 
  .savings-box {
    min-height: 65px;
  }
  .savings-box p {
    color: #fd5b02;
  }
  .features-list li {
    list-style: none;
    color:#606060;
  }
  .features-list+p{
    color:#606060;
  }

  .features-list {
    min-height: 210px;
  }
  
  p.savings-text {
    color: #fd5b02;
    min-height:55px;
    margin-bottom:15px;
  }

  .extra-space {
      min-height: 30px;
  }
  span.big {
    font-size: 25px;
    font-weight: 600;
  }
  .tab-content-box{
    display: none;
  }
  .tab-content-box.active{
    display: block;
  }
  span.small-icon {
  font-size: 10px;
    width: 20px;
    height: 20px;
    line-height: 20px;
    background: #606060;
    border-radius: 100%;
    display: inline-block;
    text-align: center;
    color: white;
    text-transform: none;
    position: relative;
    top: -2px;
    margin-left: 3px;
    font-weight:bold;
  }
.active span.small-icon {
    background: white;
    color: #18446a;
}
.campaigns .plan-box p small {
    line-height: normal;
    font-size: small;
    flex-flow: wrap;
    max-width: 160px;
    display: inline-block;
    text-align: left;
}
.tabs-center {
    text-align: center;
    margin: 30px auto auto auto;
}

.comparison {
  padding: 0px 0px 50px 0px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}
/*.comparison a.middle-download {
  min-width: 110px;
  min-height: 33px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  font-weight: 600;
  padding: 5px !important;
  margin: 20px auto;
  line-height: normal;
  font-size: 17px;
}*/
.comparison p {
  font-size: 25px;
  color: #18446a;
  display: inline-flex;
  margin: auto;
  line-height: normal;
  padding-right: 10px;
}
.tos {
    text-align: center;
    margin-bottom: 50px;
}
.tos a {
  color: blue;
  font-style: italic;
  text-decoration: underline;
}
a.signup {
  color: blue;
  background: none !important;
  font-size: 15px;
  border: none !important;
  margin-top: 20px;
  display: block;
  font-weight: 600;
  text-decoration: underline;
}
.section.four{
  background:rgb(233 239 255);
}
.faq-accordion {    
  max-width: 60%;
  margin: 30px auto;
}
.faq-accordion .item .content{
  background:transparent;
}
.faq-accordion .item .heading {
  font-weight: 600 !important;
  font-size: 20px !important;
  border: 0px !important;
}
.socxly-banner .mobile{
  display: none;
}

.wave-line-block {
    position: absolute;
    left: 0;
    top: 50%;
    z-index: -5;
}
.section.five p,.section.five a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: auto 5px;
}
.section.five {
  padding: 40px 0px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.section.five p{
  font-size: 25px;
  color: #18446a;
  display: inline-block;
  margin: auto;
  line-height: normal;
}
a.middle-download{
	font-weight:600;
}
.section.five a.middle-download {
    max-width: 100px !important;
    min-width: 100px !important;
    margin: auto;
    margin-left: 10px;
    line-height: normal;
    min-height: 33px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}
.section.four a.middle-download {
    padding: 5px !important;
    margin: 20px auto;
    line-height: normal;
    font-size: 17px;
    
}
.content a{
  color:blue;
}

.wave-line-block .st0{
  fill:none;
  stroke:#EF6823;
  stroke-width:0.75;
  stroke-miterlimit:10;
  stroke-dasharray: 2185px;
  stroke-dashoffset: 2185px;
  animation: dash 3s linear forwards infinite;

}
@keyframes dash {
  to {
    stroke-dashoffset: 0;
  }
}
.notvisible {

  visibility: hidden;
  opacity: 0;
  transition: linear 0.3s;
}
@media only screen and (max-width:1024px) {

  .plan-box .middle-download{
    margin-top:20px;
  }

  .socxly-banner .banner-text h1{
    font-size: 25px;
  }
  .socxly-banner .middle-download {
    line-height: normal;
    font-size: 15px;
    max-width: 180px;
  }
  .feature-points{
    min-height:0px;
    margin-bottom:20px;
    justify-content: center;
  }
  .section h2:after{
    background-size: 60%;
  }
  .section h2 {
    font-size: 22px;
  }
  .feature-points h3 {
    font-size: 18px;
  }
  .fl-r, .fl-l{
    float:none !important;
  }
  
  .faq-accordion .item .heading{
    font-size: 16px !important;
    padding: 7px !important;
  }
  .faq-accordion .item .content{
    padding:9px;
  }
  p.savings-text{
    min-height:0px;
  }
  p.plan_price {
    font-size: 28px !important;
  }
  span.big {
    font-size: 22px;
  }
  a.middle-download {    
    font-size:15px;
  }
  .plan-box sup {
    font-size: 17px;
  }
  .extra-space{
    min-height:0px;
  }
  .tos {
    margin-bottom: 20px;
  }
  .comparison {
    padding: 0px 0px 20px 0px;

  }
  .feature-box {
    margin: 60px auto;
    max-width: 60%;
  }
  .points-box.three {
    top: 130px;
  }
  .points-box.one {
    top: 125px;
  }
  .points-box .img-box img {
    max-width: 90px;
  }
  .points-box.two img {
    max-width: 110px;
  }
}
@media only screen and (max-width:769px) {

  a.middle-download {
    font-size: 14px !important;
    max-width: 190px !important;
    padding: 3px !important;
    font-weight: 600 !important;
  }
  .points-box {
    position: static;
    margin: 40px auto;
  }
  .section.one{
    margin-bottom: 0px;
  }
  .points-box .text {
    margin: 10px auto;
  }
  .plan-box{
    max-width: 280px
  }
  p.plan_price small {
    font-size: 14px;
  }

  .points-box.two img{
    max-width:140px;
  }
  .points-box .img-box img{
    max-width:110px;
  }
  .feature-box {
      margin: 30px auto;
      max-width: 90%;
  }
  .tab-section .tab {
    padding: 6px;
    font-size: 14px;
  }
  .faq-accordion {

    max-width: 100%;
  }
  .section h2:after{
    width:300px;
  }
  .menu-bar .menu-button, .menu-bar .logo{
    height: 50px !important;
  }
  .socxly-menu .static-logo img {
    max-width: 45px !important;
  }
  .socxly-menu .scroll-logo img {
    max-width: 90px !important;
  }
  .socxly-banner .desktop{
    display: none;
  }
  .socxly-banner .mobile{
    display: block;
  }
  .socxly-banner .banner-text {
    position: absolute;
    bottom: 28% !important;
    left: 0px;
    right: 0px;
    top: auto;
    text-align: center;
  }
  .page-socxly-socxly-home .menu-bar.black{
    background: url('https://www.socxo.com/themes/socxo/assets/images/socxly/home/socxly-mobile-banner.jpg') !important;
    background-position: bottom !important;
  }
  p, li, .plan-features-table .table_row .table_cell, .plan-features-table h3, footer#footer ul li a{
    font-size:inherit !important;
  }
  p.plan_price {
    font-size: 25px !important;
  }
  .section.five p {
    font-size: 19px !important;
  }
  .switch-box span span {    
    font-size: 17px;
  }

  span.big {
    font-size: 18px;
  }
}
.owl-dots {  
  position: absolute;
  bottom: 0px;
  width: 100%;
  display: none;
}

div#socxly-intro-slider .item .bgimg {
  width: 100%;
  height: 100vh; 

}
.overlay-image {
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  
 
}

.overlay-image img {
  width: 1200px !important;
  height: auto;
  display: block !important;
  max-width: 100%;  
  z-index: 999;
  border-radius: 5px;
  
  /*box-shadow: 1px 1px 5px 0px rgb(16 16 16);*/
  
}
.menu-bar, .socxly-menu {
  background: transparent !important;
  box-shadow: none !important;
}
/*.page-socxly .main-navbar ul li a {
    color: white;
}*/
.page-socxly .menu-bar .dropdown-menu li a{
  color: black !important;
}
.page-socxly .menu-bar input.search-field.form-control{
  box-shadow:none;
  border:1px solid white;
  color:white;
}
.page-socxly .menu-bar .search-box i.fa.fa-search {
    color: white;
}
.socxly-menu {
  border-top: 1px solid white !important;
}
.page-socxly  .menu-bar a.menu-trigger{
  filter: none;
}
.page-socxly .menu-bar a.menu-trigger+span{

  color:white;
}
.page-socxly .menu-bar .search-box input::-webkit-input-placeholder { 
  color: white;
}

.page-socxly .menu-bar .search-box input:-ms-input-placeholder { 
  color: white;
}

.page-socxly .menu-bar .search-box input::placeholder {
  color: white;
}

.slide-text {
  position: absolute;
  top: 35%;
  right: 15%;
  left:auto;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  z-index: 999;
  width: 400px;
  flex-direction: row;
  text-align: left;
  background: rgb(0 0 0 / 20%);
  padding: 20px;
}
.slide-text .title {
  font-size: 33px;
  font-weight: bold;
  list-style: normal;
}
.slide-text p {
    color: white;
    text-shadow: none;
    font-size:18px;
    line-height:normal;
}
.slide-text a.middle-download{
  line-height: normal;
  margin-left: 0px;
  background-position: left bottom!important;
   color: #fff!important;
}
/*.owl-item.active .overlay-image {
  opacity: 1;  
}*/
.owl-carousel .owl-nav .owl-prev, .owl-carousel .owl-nav .owl-next {
 position: absolute;
  top: 50%;
  left: 0px;
  right: 0px;
  width: 50px;
  height: 50px;
  color: white;
  font-size: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.owl-carousel .owl-nav .owl-prev{
  left:0px;
  right:auto;
}
.owl-carousel .owl-nav .owl-next{
  right:0px;
  left:auto;
}
.owl-item.active .overlay-image .slide-text p, .owl-item.active .overlay-image .slide-text a{
  transform-origin: 50% 50% 0px;
}


.owl-dot {
  border: 1px solid white;
  width: 10px;
  height: 10px;
  display: inline-block;
  border-radius: 100%;
  margin: 10px;

}
.owl-dot.active {
    background: white;
}
.icon-section {
  position: absolute;
  bottom: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
  width:100%;
}

.icon-section .icon img{
  width: 30px;
  height: auto;
  display: block;
}
.icon-section .icon{
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: column;
  background: white;
  margin: 10px;
  padding: 10px;
  color:white;
  border-radius:10px;
}
.slider-section{
  position:relative;
}
.icon-section .icon a{
  color: white !important;
  display: block;
  cursor: pointer;
}

img.mobile-image {
    display: none !important;
}
.slide-text p strong {
    font-weight: bold !important;
}
.slide-text .orange-filled-btn {
  text-align: center;
  font-weight: 600;
  text-transform: uppercase !important;
  margin: auto;
  margin-left: 0px;
  margin-top: 20px;
  max-width: 150px;
  min-width: 150px;
}
.slide-text.transparent {
  background: none;
}
.slide-text.transparent .app_store {
  display: flex;
  align-items: center;
  justify-content: left;
  margin-bottom: 20px;
}
.slide-text.transparent .app_store img {
  max-width: 110px;
  display: block !important;
  margin: 5px;
}

@media only screen and (max-width:992px) {

  .slide-text, .slide-text.transparent {
        background: rgb(0 0 0 / 65%) !important;
  }

  img.mobile-image {
    display: block !important;
  }
  img.bgimg.bgimg-1, .overlay-image img {
    display: none !important;
  }
  div#socxly-intro-slider .item>img{
    height: auto;
    display: none;
    margin: auto;
  }
  .slide-text {
    right: 0px;
    left: 0px;
    margin: auto;
    max-width: 75%;
    min-height: 300px;
    top: 25% !important;
}
  .icon-section .icon {    
    margin: 10px;
    padding: 6px;
    color: white;
    text-align: center;
  }
.slide-text .title {
    font-size: 25px !important;
    line-height: normal !important;
    text-align: center;
}
  .socxly-menu .menu-button.socxly-mobile-menu #button-menu{
    color: white !important;
    -webkit-font-smoothing: antialiased;
  }

}
@media only screen and (max-width:769px) {
    
    .switch {
        width: 45px;
        height: 20px;
    }
    .slider:before {
        height: 10px;
        width: 10px;
        left: 0px;
        bottom: 0px;
        top: 0px;
    }
    .tab-section .tab {
        padding: 10px;
        font-size: 14px;
    }
    .features-list{
        min-height:0px;
    }
    .campaigns.tab-content-box .savings-text {
    display: none;
    }
    .socxly-menu{
        border-top:none !important;
    }
    
}