div#johannesburg .phone-holder {
    display: none !important;
}

.single-package {
    width: 100%;
}

.package-filter-wrapper > * {
    width: 100%;
}

.selectize-control {
    position: relative;
    text-align: left;
}

.selectize-dropdown [data-selectable].option{
  color: #a8a8a8;
  font-family: "robotomedium";
  font-size: 14px;
  padding: 8px 15px !important;
  cursor: pointer;
      position: relative;
}

.selectize-dropdown [data-selectable].option:after{
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    right: 15px;
    border-radius: 50%;
    background-color: transparent;
    border: 1px solid #00B84B;
    opacity: 1;
    width: 16px;
    height: 16px;
    transition: all 0.2s ease-in-out;
    transform: translateY(-50%);
  }

.selectize-dropdown, .selectize-dropdown.form-control {
    border: 4px solid #00B84B;
    border-radius: 10px !important;
}

.package-filter-wrapper .bootstrap-select .dropdown-menu.inner li a {
    padding: 8px 20px !important;
}

.selectize-input {
    min-height: 48px !important;
    margin-top: 5px;
    padding: 13px;
    width: 100%;
    border-radius: 10px !important;
    border: 0px !important;
    color: #002846;
    font-family: "robotomedium";
}

.selectize-input input{
  opacity: 1 !important;
  color: #002846 !important;
}

.package-filter-wrapper ::-webkit-input-placeholder { /* Edge */
  color: #002846;
  opacity: 1 !important;
}

.package-filter-wrapper :-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: #002846;
  opacity: 1 !important;
}

.package-filter-wrapper ::placeholder {
  color: #002846;
  opacity: 1 !important;
}

.selectize-control.single .selectize-input:after{
    content: "";
    display: block;
    position: absolute;
    top: 56%;
    right: 15px;
    width: 10px;
    height: 10px;
    background-image: url('/wp-content/themes/frogfoot/assets/images/arrow-down-gray.png');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    transition: all 0.2s ease-in-out;
    transform: translateY(-50%) rotate(180deg);
    border: 0px !important;
}

.selectize-control.single .selectize-input.dropdown-active:after {
    transform: translateY(-50%) rotate(0deg);
}

.package-filter-wrapper.all-packages .btn{
  margin: 0px !important;
  margin-top: 5px !important;
}

.internet-speeds .active a{
  font-family: "robotoblack" !important;
  text-decoration: underline;
}

/* 18 OCTOBER CHANGES */
.map-tooltip-content {
    padding-bottom: 3rem !important;
}

.header-wrapper {
    padding: 40px 15px 25px !important;
}

#searchAddress {
    margin-bottom: 5rem !important;
}

.network-status-content .nav-tabs > li a span{
  padding-right: 0px !important;
}

/* DESKTOP ONLY */
@media (min-width:1024px) {

  .dropdown-menu.open {
      position: absolute;
      top: 6rem;
  }

.single-package .package-features .feature {
      min-height: 5.5rem;
  }

  .package-filter-wrapper .filters-logo {
      padding: 6px;
      width: 70px !important;
      text-align: left;
  }

  .package-filter-wrapper > * {
    width: 14.6% !important;
    float: left;
    margin-right: 1rem;
  }

}


/* .selectize-control {
    position: relative;
    text-align: left;
    background-color: #ffffff;
    border-radius: 12px;
}

.selectize-control.single .selectize-input, .selectize-control.single .selectize-input input {
    cursor: pointer;
    max-width: 83%;
    overflow: inherit;
}

.selectize-control.single .selectize-input:after {
    z-index:99;
    right: -16px !important;
} */

.package-dropdown {
    position: relative;
}

span.dropdown-toggle {
    position: absolute;
    height: 40px;
    width: 40px;
    top: 10px;
    right: 0;
    z-index: 999;
}

.selectize-input span {
    position: absolute;
    height: 30px;
    width: 30px;
    top: 15%;
    right: 0;
    z-index: 9999;
    cursor: all-scroll;
}

/* MOBILE ONLY */
@media (max-width:780px) {
  .package-dropdown.list-select {
      margin-bottom: 5px;
  }
	.package-dropdown.list-select {
      margin-bottom: 5px;
  }

  .content-holder.network-status-content {
    position: relative !important;
    z-index: 0 !important;
  }

	.sweet-modal.is-mobile-fullscreen,
	.sweet-modal{
    	width: 100% !important;
	}
	
	.focus.input-active.dropdown-active ~ .selectize-dropdown.single.selectSearch {
		position: relative;
		top: 0 !important;
		display: block !important;
		visibility: visible !important;
	}
	

	.v--modal-box.v--modal {
		width: 95% !important;
		left: 0 !important;
		margin: 10px;
	}

  .package-details-holder {
    padding: 2rem !important;
  }

  .container.packages-detail-container.pt-40 {
      padding-left: 0px !important;
      padding-right: 0px !important;
  }
	
	.carousel-caption h3 {
		position:relative;
		z-index:99;
	}
	
	.carousel-inner > .item > .carousel-caption:after {
		background-color: #000000;
		position: absolute;
		opacity:0.0;
		width: 114vw;
		height: 74vh;
		z-index: 0;
		top: -22px;
		left: -8rem;
		content: "";
	}
	
	.network-status-content .tab-filters {
		display: grid !important;
	}
	
	.row.tab-filters .col-md-10 {
		order: 3;
	}
	
	.row.tab-filters .col-md-2.area-filter.text-right {
		margin-bottom: 1rem;
	}
	
	.status-table .table-row > *.title {
		width: 45% !important;
	}

  .package-filter-wrapper.all-packages button.btn.btn-yellow {
    margin-bottom: 5px !important;
  }

  .package-filter-wrapper.all-packages .dropdown-holder .dropdown-menu {
    margin-top: 2px !important;
    border-radius: 10px;
    left: 0 !important;
        position: relative !important;
  }

  .selectize-dropdown.single.selectSearch {
    position: relative;
    top: 0 !important;
  }

  .package-details-holder .package-details .basic-info .content-holder .row {
    display: block !important;
  }

  .package-details-holder .package-details .basic-info .product-specification {
    width: 100% !important;
    margin: 10px 5px;
  }

  .package-details-holder .package-details .basic-info .product-specification img {
    margin-right: 10px !important;
  }

  .package-details-holder .package-details .basic-info .product-specification span {
      margin-top: 0 !important;
  }

  #homepage-slider {
    display: block !important;
  }
  .container.product-section .header-wrapper.text-center {
    display: none;
  }

  .gm-style .gm-style-iw-c {
      max-width: 88vw !important;
   	 width: 88vw !important;
  }

  .map-tooltip-content .header {
    font-size: 30px !important;
  }
	
	.termsbox {
		width: 100% !important;
		margin-left: 0px !important;
		margin-right: 0px !important;
	}
	
	.status-table .table-row .description {
		width: 60% !important;
		font-family: "robotolight";
	}
	
	.entry-header .entry-title {
		padding-left: 0px !important;
		display: inline-block !important;
		width: 80% !important;
	}
	
	.entry-header img {
		display: inline-block !important;
	}
	
	.page-template-page-user-profile .row.content-holder {
		margin: 0 !important;
	}
	
	.page-template-page-user-profile .col-md-7.col-md-offset-3.col-sm-8.col-sm-offset-2.col-xs-10.col-xs-offset-1.mainImg {
		width: 100% !important;
		margin: 0 !important;
	}
	
	h1.mb-40.faq-title img {
		display: inline-block;
		float: left;
	  }
	
}

 /* disable indicators on mobile */

   @media(max-width:780px) {ol.carousel-indicators {
           display:none; 
        }
        }
        
        
.covid-19-banner {
background-color:#002a41!important;
text-align:center;
padding:10px;
}

 .covid-19-banner p{
       margin: 10px auto;
       color:#ffffff !important;
        }
        
 .covid-19-banner a{
 color:#0db14b!important;}
 
 
 
  
 @media screen and (max-width:767px){.frogfoottest h1.heading-large,
 .frogfoottest h2.heading-large
 {font-size:34px !important;
 text-align:center;
 line-height: 32px;
 display:block;
 }
 }
 
 @media screen and (max-width:767px){.frogfoottest img
 {
    text-align: center;
    display: block;
    padding-left: 0;
    padding-right: 0;
    margin: 20px auto !important;
 }
 }
 
.feature-content {
      font-family: "robotoregular"!important;
      font-size: 16px !important;
      line-height: 20px !important;
  }
  
.feature-title {
      font-family: "robotobold" !important;
      font-size: 20px !important;
      line-height: 24px !important;
      margin-bottom: 5px !important;
      }
 
.faq-section h2.business-fibre-title {
    font-size: 42px;
    line-height: 46px;
    font-family: "robotoregular";
}

#fibre-title1{
margin-top:120px;
font-size: 42px;
padding-left:205px;
}


@media screen and (min-width:767px){#fibre-title2
 {
    display:none;
 }
 }
 
 
@media screen and (max-width:768px){#fibre-title1
 {
    display:none;
 }
 }
 
 @media screen and (max-width:768px){#fibre-title2
 {
 font-size:34px !important;
 text-align:center;
 line-height: 32px;
 display:block;
 }
 }
 
 @media screen and (min-width:801px){#fibre-title1
 {
 
 text-align:center;
 display:block;
 padding-left:0;
 }
 }
 
 
 
 13.Blog Index / Archive Styling
-------------------------------------------------------------------------------*/
.blog .page-title, .archive .page-title{
    background-color:transparent;
    color:#1a3794;
} 
@media only screen and (min-width:767px){
    .blog-posts{
        display:flex;
        justify-content:space-between;
        flex-wrap: wrap;
    }
    .blog-posts .blog-post{
        width:48%;
    }
}
.blog-posts .blog-post{ 
    background-color:#ffffff;
    padding:15px;
    margin-bottom:20px;
}
.blog-posts .blog-post h2 a{
    color:#00B84B;
    font-size:28px;
    font-family:robotoregular;
}
.blog-posts .blog-post h2 a:hover{
    color:#002846;
    text-decoration:none;
}
.blog-posts .blog-post h2{
    line-height:30px;
    font-size:28px;
}
.blog-post-thumb{
    margin-bottom:15px;
}
.blog-posts .blog-post p{
    font-size:16px;
}
.read-more-link, .posted-in a{
    color:#00B84B;
    margin-bottom:10px;
    display:inline-block;
}
.posted-in{
    font-size:12px;
}
.posted-in span{
    color:#ccc;
}
.read-more-link:hover, .posted-in a:hover{
    color:black;
    border-bottom-color:#333;
    text-decoration:none;
    color:#002846;
}

h1.frogfoot-blog-title {
font-size:50px;
font-weight:bold;
margin-bottom:40px;
}

h1.frogfoot-blog-title-archive {
font-size:50px;
font-weight:bold;
margin-bottom:40px;
margin-top:50px;
}

h1.news-page-title{
font-size:50px;
font-weight:bold;
margin-bottom:40px;
margin-top:50px;
text-align:center;
}

/*-------------------------------------------------------------------------------
  16.Single Blog Post page styling
-------------------------------------------------------------------------------*/
.single .full-width-featured-image{
    min-height:500px;
    display:flex;
    justify-content: center;
    align-items: center;
    background-repeat: no-repeat;
    background-size:cover;
    background-position:center center;
    position:relative;
}
.single .full-width-featured-image h2{
    color:#ffffff;
    position:relative;
    z-index:2;
    font-size:50px;
    text-align:center;
    max-width:1000px;
    margin:0 auto;
}
.single .full-width-featured-image:after{
    width:100%;
    height:100%;
    content:"";
    background-color:rgba(0,0,0,0);
    position:absolute;
    top:0;
    left:0;
}
.single .article-info h4{
    color:#000000;
    font-size:20px;
    text-transform:lowercase;
    margin-bottom:10px;
    margin-top:30px;
}
.single .article-info a{
    font-size:16px;
    color:#000000;
}
.single #actual-article{
    padding:30px 0;
}
.single #actual-article p{
    font-size:16px;
}

/*-------------------------------------------------------------------------------
  Blog sidebar
-------------------------------------------------------------------------------*/

#blog-sidebar a, #post-sidebar a{
color:#00B84B !important;
font-size:14px !important;
}

#blog-sidebar a:hover{
color:#002846 !important;
text-decoration:none;
}

#post-sidebar a:hover{
color:#002846 !important;
text-decoration:none;
}

#blog-sidebar {
padding-top:50px;
}

@media screen and (max-width:789px){#post-sidebar{
display:none;
}
}

@media screen and (max-width:789px){#blog-sidebar{
padding-top:20px;
}
}
/*-------------------------------------------------------------------------------
  Pagination Styling
-------------------------------------------------------------------------------*/
.pagination{
    width:100%;
    margin-bottom:50px;
}

.pagination .nav-links a, .pagination .nav-links .current{
    background-color:#00B84B;
    padding:12px 12px;
    color:white;
    border-radius:4px;
    font-family:robotoregular;
    text-decoration:none;
}
.pagination .nav-links .current{
    background-color:#002846;
}



.frogfoot-category-title{
    color:#ffffff; 
    font-size:50px;
    text-align:center;
    margin-top:0px;
    font-weight:600;
    
}

#category-header{
background-color: #00B84B;
padding: 20px 20px;
}


/*  mobile for blog post */
@media screen and (max-width:789px){.single #actual-article
{margin-left:20px !important;
margin-right:20px;
padding:5px 0px 50px;
}
}

@media screen and (max-width:789px){.article-info {
margin-left:8px;}}

@media screen and (max-width:789px){.ff-responsive {
  width: 100%;
  height: auto;
}
}

@media screen and (max-width:789px){.blog-post-thumb img {
  width: 100%;
  height: auto;
}
}

@media screen and (max-width:789px){.blog-posts .blog-post {
  width: 100%;
  height: auto;
}
}

/*-------------------------------------------------------------------------------
Search Form
-------------------------------------------------------------------------------*/



#searchform input[type=submit] {
    background: #002846;
    border-radius: 30px;
    color: #FFF;
    padding: 12px 0px;
    font-size: 12px;
    letter-spacing: 2px;
    font-weight: 500;
    position: absolute;
    box-shadow: 0 0 25px rgb(0 0 0 / 50%);
    margin-right:253px;
    right:0px;
    width:30%;
    height:42px;
     }
     
 
 @media screen and (max-width:1000px){ #searchform {  
  display:none;
 }}
 
  
 @media screen and (max-width:1200px){#searchform input[type=submit] {  
   margin-right:230px;
 }}
     
 #searchform input[type=submit] [value=search] {
   padding-right:10px;
     }    
     
     
 #searchform input[type=text]{
 padding:10px -20px 10px 20px;
 }
 
   
 @media screen and (max-width:998px){
.site-header .nav-actions {
padding-top:10px !important;
}
}

 @media screen and (max-width:998px){
.site-header .status-holder {
padding-top:10px !important;
}
}



     
 /*-------------------------------------------------------------------------------
spacing on feasibility app
-------------------------------------------------------------------------------*/    
 @media screen and (max-width:789px){
.product-section {
    padding-bottom: 0px;
}
}