/*!
 * Aspafone Styles
 */

 @font-face {
  font-family: 'vodafone_rg_b';
  src: url('vodafonerg_bd.eot');
  src: url('vodafonerg_bd.eot?#iefix') format('embedded-opentype'),
  url('vodafonerg_bd.woff2') format('woff2'),
  url('vodafonerg_bd.woff') format('woff'),
  url('vodafonerg_bd.ttf') format('truetype'),
  url('vodafonerg_bd.svg#vodafone_rgbold') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'vodafone_rg';
  src: url('vodafonerg.eot');
  src: url('vodafonerg.eot?#iefix') format('embedded-opentype'),
  url('vodafonerg.woff2') format('woff2'),
  url('vodafonerg.woff') format('woff'),
  url('vodafonerg.ttf') format('truetype'),
  url('vodafonerg.svg#vodafone_rgregular') format('svg');
  font-weight: normal;
  font-style: normal;
}


body{
  color: #000;
  font-size: 16px;
  font-family: 'vodafone_rg';
}

h1, h2, h3, h4, h5, h6, strong{
  font-family: 'vodafone_rg_b';
}

/*# header */
.navbar-top{
  padding: 0;
}

header{
  background: #fff;
}
.navbar-tabs.navbar{
  margin-left: 255px;
}

.navbar-expand-lg.navbar-top .navbar-nav .nav-link, .nav .nav-link{
  padding: .5rem 1.75rem;
  border-left: 1px solid #e2211c;
  color: #fff;
  font-size: 1rem;
}


.navbar-top .navbar-nav .active>.nav-link, .navbar-top .navbar-nav .nav-link.active, .navbar-top .navbar-nav .nav-link.show, .navbar-top .navbar-nav .show>.nav-link,
.navbar-top .nav .active>.nav-link, .navbar-top .nav .nav-link.active, .navbar-top .nav .nav-link.show, .navbar-top .nav .show>.nav-link{
  color: #e2211c;
  background: #fff;
}

.navbar-brand img{
  width: 215px;
  height: 50px;
}

.navbar .navbar-nav .nav-link{
  color: #000;
  font-size: 1.25rem;
  padding-left: 1rem;
  padding-right: 1rem;
}

.navbar .navbar-nav .active .nav-link{
  color: #e2211c;
}

.navbar-toggler{
  background: #e2211c;
}

.form-control{
  color: #e2211c;
  background-color: #fff;
  border: 1px solid #e2211c;
}



.form-control:focus {
  color: #e2211c;
  background-color: #fff;
  border-color: #e2211c;
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(226,33,28,.25);
}

.form-control::-webkit-input-placeholder { /* WebKit browsers */
  color:    #e2211c;
}
.form-control:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
  color:    #e2211c;
  opacity:  1;
}
.form-control::-moz-placeholder { /* Mozilla Firefox 19+ */
  color:    #e2211c;
  opacity:  1;
}
.form-control:-ms-input-placeholder { /* Internet Explorer 10+ */
  color:    #e2211c;
}

#styckyheader.sticky {
  opacity: 1;
  visibility: visible;
  -webkit-transform: translate(0,0);
  -ms-transform: translate(0,0);
  transform: translate(0,0);
}

#styckyheader{
  position: fixed;
  visibility: hidden;
  opacity: 0;
  background: #fff;
  top: 0;
  width: 100%;
  z-index: 99999;
  box-shadow: 0 2px 5px rgba(0,0,0,.1);
  -webkit-transform: translate(0,-220px);
  -ms-transform: translate(0,-220px);
  transform: translate(0,-220px);
  -webkit-transition: all 0.6s ease;
  transition: all 0.6s ease;

}

/*# front page */

#teaser{
  /*background: url(../img/aspafone-teaser.jpg);
  background-size: cover;
  background-position: center center; */
}
.carousel-item{
  background-size: cover;
}
.teaser-inner{
  position: relative;
  height: 75vh;
  min-height: 350px;
  background-size: cover;
  background-position: left center;
}
.teaser-content{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  padding-left: 2rem;
  padding-right: 2rem;
}
.teaser-content img{
  position: absolute;
  top: 50%;
  right: 0;
  transform: translate(0, -50%);
}



#carouselTeaserIndicators h1, #carouselTeaserIndicators h5, #carouselTeaserIndicators p{
  color: #080808;
}

#catalogo{
  background: url(../img/aspafone-section.jpg);
  background-size: cover;
  background-position: center center;
}
.catalogo-inner{
  position: relative;
  height: 800px;
  min-height: 350px;
}
.catalogo-content{
  position: absolute;
  top: 50%;
  left: auto;
  right: 0;
  transform: translate(0, -50%);
}

#carouselTeaserIndicators h1, #carouselTeaserIndicators h5, .catalogo-content h2{
  font-size: 1.5rem;
}
.catalogo-content p, .teaser-content p{
  font-size: 1rem;
}

.services-box h3{
  font-size: 1rem;
  color: #000;
  margin: 0 0 1rem;
  text-align: center;
}

.services-box img{
  width: 146px;
  margin: 0 auto 1rem;
  display: block;
}

.services-box{
  text-align: center;
}

.section-box{
  padding: 3rem;
}

.section-box h3{
  font-size: 1.25rem;
  font-weight: normal;
  margin: 0;
}
/*# Shop list */

#map, #map2, #map3,#map4,#map5,#map6,#map7,#map8,#map9,#map10,#map11,#map12,#map13{
  width: 100%;
  height: 380px;
  border: 10px solid #fff;
}

#slider{
  border: 10px solid #fff;
}

.carousel{
/*  left: 50%;
  -webkit-transform: translate(-50%,0);
  -ms-transform: translate(-50%,0);
  transform: translate(-50%,0);*/
}

.shop-list-item{
  border-bottom: 1px dashed #e2211c;
}

.shop-list-item a{
  color: #000;
  text-decoration: underline;
  font-size: 1.75rem;
}

.shop-list-item p{
  font-size: 1.15rem;
}

.list-sevices{
  text-align: center;
}
.list-sevices li{
  margin: 0 40px;
}
.list-sevices img{
  width: 100%;
  max-width: 360px;
  margin: 0 0 40px;
}
.services-tech-box, .services-vodafone-box {
  text-align: center;
  margin: 10px 0;
}
.services-tech-box img{
  height: 125px;
  width: 125px;
  margin: 0 auto 25px;
}

.services-vodafone-box img{
  display: block;
  margin: 0 auto 15px;
}
.services-vodafone-box h4{
  font-weight: normal;
  text-align: center;
  font-family: 'vodafone_rg', sans-serif;
}
.services-vodafone-box h4 span{
  display: block;
  font-family: 'vodafone_rg_b', sans-serif;
}

#google{
  text-align: center;
}
#google img, #microsoft img{
  width: 100%;
  max-width: 540px;
  margin: 0 auto;
  display: block;
}
/*# footer */
footer{
  color: #fff;
}
footer p, footer h1, footer h2, footer h3, footer h4, footer h5, footer h6, footer span, footer li, footer a, footer a:hover{
  color: inherit;
}

#footer-top{
  background: #333;
}

#footer-top h3{
  font-size: 1.15rem;
  margin: 0 0 .75rem;
}
#footer-top h3 img{
  width: 16px;
}
#footer-top ul li>a{
  color: inherit;
  text-decoration: none;
  line-height: 1.7;
}

#footer-bottom{
  background: #000;
  padding: 0.75rem 0;
}
#footer-bottom p, #footer-bottom ul{
  margin: 0;
}

#footer-bottom ul li:after{
  content: "|";
  margin-left: 10px;
}

#footer-bottom ul li:last-child:after{
  content: "";
  margin: 0;
}

.list-social img{
  width: auto;
  height: 38px;
}

/*# regular classes */

.section{
  padding-top: 70px;
  padding-bottom: 70px;
}

.section-light{
  background: #fff;
}

.section-dark{
  background: #eeeeee;
}

.section-darkgray{
  background: #333;
}

.section-red{
  background: #e2211c;
}

.section-red h1, .section-red h2, .section-red h3, .section-red h4, .section-red h5, .section-red h6, .section-red p, .section-red span, .section-red li, .section-red td, .section-darkgray td, .section-darkgray h1, .section-darkgray h2, .section-darkgray h3, .section-darkgray h4, .section-darkgray h5, .section-darkgray h6,
.section-darkgray p, .section-darkgray span, .section-darkgray li{
  color: #fff;
}

.section-dark .section-box{
  background: #fff;  
}
.section-light .section-box{
  background: #eee;  
}

.section-header{
  margin-bottom: 1.5rem;
}

.section-header h2{
  font-size: 2.5rem;
  color: #000;
  font-weight: normal;
  margin: 0;
  text-align: center;
}

.section-header h5{
  font-size: 1rem;
  color: #000;
  font-weight: normal;
  margin: 0;
  text-align: center;
}

.section p{
  color: #000;
  font-size: 1rem;
  line-height: 1.27;
}

.btn-aspa{
  background: #e2211c;
  color: #fff;
  font-size: 1rem;
  padding: 0.5rem 1.5rem;
}

.btn-aspa.btn-lg{
  font-size: 1.25rem;
}

.btn-aspa:hover{
  background: #f52e28;
  color: #fff;
}

.btn-aspa:hover,
.btn-aspa:active,
.btn-aspa:focus{
  outline: none !important;
  color: #fff;
}

.btn-aspa-action{
  background: transparent;
  color: #080808;
  font-size: 1rem;
  border: 1px solid #fff;
  padding: 0.5rem 1.75rem;
}
.btn-aspa-action:hover{
  background: #fff;
  color: #f52e28;
}

.btn-aspa-action:hover,
.btn-aspa-action:active,
.btn-aspa-action:focus{
  outline: none !important;
  box-shadow: none;
}

.list-aspa img{
  width: 36px;
}
.list-aspa li{
  color: #000;
}
.btn-link{
  color: #e2211c;
}
.btn-link:hover{
  color: #e2211c;
}



/*Custom*/
.img-height-icon {
  max-width: 100%;
  height: 150px;
  margin-bottom: 35px;
}

.simple-link,
.simple-link:hover,
.simple-link:active,
.simple-link:focus{
  color: black;
  text-decoration: none;
}

.section .smoothLink,
.section .smoothLink:hover,
.section .smoothLink:active,
.section .smoothLink:focus{
  color: red;
  text-decoration: none;
}
/* Extra small devices (portrait phones, less than 576px)*/
/* No media query since this is the default in Bootstrap*/

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {

}

/* Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) {
  
}

/* Large devices (desktops, 992px and up)*/
@media (min-width: 992px) {
  
}

/* Extra large devices (large desktops, 1200px and up)*/


@media (min-width: 576px){
  .teaser-content {
    width: 540px;
  }
  .teaser-inner{
    height: 70vh;
    background-size: cover;
    background-position: left center;
  }
  #carouselTeaserIndicators h1, #carouselTeaserIndicators h5, .catalogo-content h2{
    font-size: 1.5rem;
  }
  .catalogo-content p, .teaser-content p{
    font-size: 1rem;
  }
  .btn-aspa-action{
    font-size: 1.15rem;
    padding: 0.5rem 1.75rem;
  }
}
@media (min-width: 768px){
  .teaser-content {
    width: 720px;
  }
  .teaser-inner{
    height: 80vh;
    background-size: cover;
    background-position: left center;
  }
  #carouselTeaserIndicators h1, #carouselTeaserIndicators h5, .catalogo-content h2{
    font-size: 1.75rem;
  }
  .catalogo-content p, .teaser-content p{
    font-size: 1.15rem;
  }
  .btn-aspa-action{
    font-size: 1.25rem;
    padding: 0.5rem 2rem;
  }
}
@media (min-width: 992px){
  .teaser-content {
    width: 960px;
  }
  .teaser-inner{
    height: 90vh;
    background-size: cover;
    background-position: center center;
  }
  #carouselTeaserIndicators h1, #carouselTeaserIndicators h5, .catalogo-content h2{
    font-size: 2.5rem;
  }
  .catalogo-content p, .teaser-content p{
    font-size: 1.25rem;
  }
  .btn-aspa-action{
    font-size: 1.25rem;
    padding: 0.5rem 2rem;
  }
}
@media (min-width: 1200px){
  .teaser-content {
    width: 1140px;
  }
  .section p{
    font-size: 1.15rem;
  }
  .teaser-inner{
    height: 900px;
    background-size: cover;
    background-position: center center;
  }
  #carouselTeaserIndicators h1, #carouselTeaserIndicators h5, .catalogo-content h2{
    font-size: 3.5rem;
  }
  .catalogo-content p, .teaser-content p{
    font-size: 1.5rem;
  }
  .btn-aspa-action{
    font-size: 1.5rem;
    padding: 0.5rem 2rem;
  }

}
@media (min-width: 1661px) {
  .container{
    max-width: 1560px;
  }
  .teaser-content {
    width: 1560px;
  }
  .teaser-inner{
    height: 950px;
    background-size: cover;
    background-position: center center;
  }
  #carouselTeaserIndicators h1, #carouselTeaserIndicators h5, .catalogo-content h2{
    font-size: 3.5rem;
  }
  .catalogo-content p, .teaser-content p{
    font-size: 1.5rem;
  }
  .btn-aspa-action{
    font-size: 1.5rem;
    padding: 0.5rem 2rem;
  }
  .carousel-inner{
    background-size: cover;
  }
}

@media (max-width: 1199.98px) {
  .teaser-content img{
    width: 340px;
  }
}

@media (max-width: 991.98px) {
  .section-header h2 {
    font-size: 1.75rem;
  }
  .navbar-tabs.navbar {
    margin-left: 0;
  }
  #footer-bottom ul.list-menu-bottom{
    text-align: center;
    margin-bottom: 1rem;
  }
  #footer-bottom p{
    text-align: center;
  }
  .navbar .navbar-nav .nav-link {
    text-align: center;
  }
  .navbar-nav{
    border-top: 1px solid #f8f8f8;
  }
  .teaser-content img{
    width: 260px;
  }
}

@media (max-width: 767.98px) {
  .section-header h2 {
    font-size: 1.5rem;
  }
  #teaser{
    background-image: url(../img/aspafone-teaser-mob.jpg);
  }
  #catalogo{
    background-image: url(../img/aspafone-section-mob.jpg);
  }
  .services-box img {
    width: 128px;
  }

}

@media (max-width: 575.98px) {
  .section-header h2 {
    font-size: 1.25rem;
  }
  .navbar-brand img {
    width: 160px;
  }
  .teaser-content img{
    width: 220px;
    display: block;
    position: relative;
    top: auto;
    right: auto;
    left: 0;
    transform: translate(0, 0);
  }
  .navbar-expand-lg.navbar-top .navbar-nav .nav-link, .nav .nav-link {
    padding: .5rem .5rem;
    font-size: .85rem;
  }
}