/*****************************************************************************************************
  LANDING (Home) Page
*****************************************************************************************************/
#top-banner1 {
   background-repeat: no-repeat;
   background-size:cover;
   background-position: center top;
}
#top-banner2 {
   background-repeat: no-repeat;
   background-size:cover;
   background-position:center top;
}
#top-banner3 {
   background-size:cover;
   background-position:center 40%;
}
.top-banner-inner H1 {
    	margin-top: 65px;
}
div.top-steps {
   margin-top:100px;
 }
 
 div.videothumb {
   position:absolute;
   z-index:900;
   width:284px;
   left:20%;
   top: 58%;
 }
 
 div.play-btn {
   position:absolute;
   z-index:200;
   top:50%;
   left:50%;
   transform: translate(-50%, -50%);
 }
 div.play-btn i {
   color:#fff;
   font-size: 55px;
 }
 
 div.videothumb img {
   width:284px;
 }
  .mobile-logo {
    display: none;
  }
  
  .row-eq-height {
     display: -webkit-box;
     display: -webkit-flex;
     display: -ms-flexbox;
     display: flex;
   }
  
  a.popular-nav-prev {
    text-align:left;
    width:40px;
    height:60px;
    top:50%;
  }
  a.popular-nav-next {
    text-align:right;
    width:40px;
    height:60px;
    top:50%;
  }
  
  a.banner-nav-prev {
    margin-top:0; 
    top:44%; width:30px; 
    text-align:left; 
    margin-left:30px;
  }

  a.banner-nav-next {
    margin-top:0; 
    top:44%; width:30px; 
    text-align:right; 
    margin-right:30px;
  }
  
  div.step2b {
    width:250px;
    text-align:center;
  }
  
  .top-container H1 {
    font-size: 40px;
    line-height: 45px;
    font-weight:normal;
  }
  html[dir="rtl"] .top-container H1 {
    text-align:right;
    margin-right: auto;
    margin-left: auto;
  }

  .top-container H1.light {
    font-weight:lighter;
  }
 
   .pad-h1 {
	  padding-left:70px;
	}

	html[dir="rtl"] .pad-h1 {
	  padding-left:0px;
  	}

div.reason {text-align: center; color:#000; font-size: 16px; margin-top:-25%; padding:10% 0 40px 0;}

.reviews DIV:nth-child(odd) DIV.review{
  background-image: url("https://www.shipito.com/imgs/home/review2.svg");
  color: #000000;
}
.reviews DIV:nth-child(even) DIV.review {
  background-image: url("https://www.shipito.com/imgs/home/review1.svg");
  color: #FFFFFF;
}

.top-container {
   height: 492px;
   padding: 0px;
   margin: 0px 0px 80px 0px;
}
.top-image {
   height: 492px;
   max-height:492px;
}

.scroll {
  white-space: nowrap; /* [1] */
  overflow-x: auto; /* [2] */
  -webkit-overflow-scrolling: touch; /* [3] */
  -ms-overflow-style: -ms-autohiding-scrollbar; /* [4] */ }

.scroll::-webkit-scrollbar {
  display: none; 
}

td.brand-cell { padding: 0 3px 0px 3px}
td.brand-cell-left { padding-right:3px; vertical-align:top;}
td.brand-cell-right {padding-left:3px;}
td.brand-even { padding-top:55px;}
td.brand-odd { vertical-align:top;}

.brand-image-top {margin-bottom:6px; width:110px;}
.brand-image {width:110px;}

.columns DIV.step-description {
  margin: 10px 0px 0px 0px;
  padding: 0 15px 15px 15px;
  font-size: 16px;
  color: #808080;
  display: block;
  text-align: center;
  vertical-align:top;
}
.middle-column DIV.step-description {
  border-left: solid 1px #D7D7D7;
  border-right: solid 1px #D7D7D7;
}

.columns img.step-image {
  margin-bottom:20px;
}

.columns div.step-header {
  text-align:center;
  font-size:18px;
  height:72px;
}

div.section-title {
	margin-top: 100px;
	margin-bottom: 50px;
}

/*
div.section-title {
}
.section-title {
   text-align: center;
}
.section-title .bar {
    margin-top: -20px;
    margin-bottom: 20px;
    height: 1px;
    background-color: #D7D7D7;
}
.section-title SPAN {
   display: inline-block;
   line-height: 40px;
   vertical-align: middle;
   background-color: #FFFFFF;
   color: #545454;
   font-size: 30px;
   padding: 0px 20px 0px 20px;
}
*/

.section-caption {
   text-align: center;
   margin-bottom: 50px;
   font-size: 16px;
}

.section-caption-blue {
   text-align: center;
   font-size: 18px;
   color: #00A9CE;
   margin-bottom:50px;
}

.reviews DIV.review {
   height: 320px;
   width: 350px;
   margin: 20px 40px 20px 5px;
   padding: 10px 20px 0px 20px;
   background-size: cover;
   background-repeat: no-repeat;
   font-size: 17px;
   text-align: left;
}
.review SPAN {
   display: block;
}
.review SPAN.stars {
   height: 30px;
   line-height: 30px;
   font-size: 15px;
}
.review SPAN.review-text {
   height: 150px;
   overflow-y: auto;
}
.review SPAN.reviewer {
   height: 20px;
   font-weight: bold;
}
.review SPAN.reviewer-country {
   height: 20px;
}
.review SPAN.review-date {
   height: 20px;
}

.reviews DIV:nth-child(odd) DIV.review{
  background-image: url("https://www.shipito.com/imgs/home/review2.svg");
  color: #000000;
}
.reviews DIV:nth-child(even) DIV.review {
  background-image: url("https://www.shipito.com/imgs/home/review1.svg");
  color: #FFFFFF;
}
.reviews TD:nth-child(odd) DIV.review{
  background-image: url("https://www.shipito.com/imgs/home/review2.svg");
  color: #000000;
}
.reviews TD:nth-child(even) DIV.review {
  background-image: url("https://www.shipito.com/imgs/home/review1.svg");
  color: #FFFFFF;
}

.reviews DIV:nth-child(odd) DIV.review SPAN.stars {
  color: #01B2D4;
}
.reviews DIV:nth-child(even) DIV.review SPAN.stars {
  color: #FFFFFF;
}
.reviews TD:nth-child(odd) DIV.review SPAN.stars {
  color: #01B2D4;
}
.reviews TD:nth-child(even) DIV.review SPAN.stars {
  color: #FFFFFF;
}

.sign-up {
   background-color: #E8E8E8;
   padding: 30px;
   margin-top: 130px;
   display: none;
}

.mobile-image, .mobile-only, #ppopular-mobile {
   display: none;
}

/* Carousel base class */
.carousel {
  height: auto;
  margin-bottom: 0px;
}
/* Since positioning the image, we need to help out the caption */


.carousel-inner {
  background-color: #fff;
  text-align: center;
  padding: 0 0 0 0;
}
/* Declare heights because of positioning of img element */
.carousel .item {
  height: auto;
  background-color: #fff;
}
.carousel-control.left, .carousel-control.right {
  background-image: none;
}

.carousel-caption {
  position: relative;
  left: 0px;
  z-index: 10;
}

html[dir="rtl"] .carousel-caption {
  right: 0px;
}
 
 .carousel-caption H1 {
	text-shadow: none;
}


.carousel-caption p {
  font-size: 18pt;
  width:60%;
  margin-left: 54px;
  margin-top: 40px;
}

div.youshop {
    position:absolute;
    margin: 5% 0 0 5%;
    font-size: 16px;
    color: #000;
    width:90%;
    line-height:1.5em;
  }
  div.step2a {
    position:absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
  }
  
  div.step2b {
    position:absolute;
    left: 50%;
    top:90%;
    transform: translate(-50%,0);
    -webkit-transform: translate(-50%,0);
    width:250px;
    text-align:center;
  }
  div.youshop3a {
    position:absolute;
    margin: 35% 3% 0 5%;
    color: #000;
    width:55%;
    font-size: 15px;
  }
  div.youshop3b {
    position:absolute;
    margin: 55% 3% 0 5%;
    color: #000;
    width:55%;
    font-size: 15px;
  }
  div.youshop3c {
    position:absolute;
    margin: 78% 3% 0 5%;
    color: #000;
    width:55%;
    font-size: 15px;
  }
  td.youshop {
    padding-left:8px;
    padding-right:5px;
    vertical-align:top;
  }
  .numberCircle {
    display:inline-block;
 	width: 24px;
    line-height: 22px;
    border-radius: 50%;
    text-align: center;
    font-size: 18px;
    border: 1px solid #000;
    margin-right:10px;
    }
    
   .popular-items > .row {
	 overflow-x: auto;
	 white-space: nowrap;
	}
	.popular-items > .row > .col-xs-4 {
	  display: inline-block;
	  float: none;
	}
	.popular-items > .row > .col-xs-6 {
	  display: inline-block;
	  float: none;
	}
	
	div.popular-item {
	  vertical-align:top;
	  padding-left:25px;
	  padding-right:25px;
	}

    div.popular-item-caption {
     font-size:18px;
     margin-bottom:50px;
     text-align:center;
     font-color: #000;
     white-space: normal;
     word-wrap:break-word;
     line-height: 2em;
   }
   div.popular-item-caption-small {
     font-size:16px;
     font-color: #808080;
     white-space: normal;
     word-wrap:break-word;
     line-height: 2em;
     font-weight:500;
   }
   img.popular-item-img {
     margin-bottom:60px;
     width:300px;
     margin-left:auto;
     margin-right:auto;
   }

   table.table-popular-items {
     width:100%;
   }
   
   table.table-popular-items td {
    vertical-align: top;
    padding-left: 25px;
    padding-right: 25px;
  }
   
   
  .carousel-control{
    &.left, &.right{
      background-image: none;
    }
  }
  
  
@media (max-width:767px) {

    .top-banner-inner H1 {
    	margin-top: 55px;
    }
	.pad-h1 {
	  padding-left:25px;
	}
	
	html[dir="rtl"] .pad-h1 {
	  text-align: right;
	  padding-left:0px;
  	}
  .top-container H1 {
    font-size: 32px;
    line-height: 32px;
    font-weight:normal;
  }
  
  html[dir="rtl"] .top-container H1 {
    text-align:right;
    width:70%;
  }
  
  .top-container H1.light {
    font-weight:normal;
  }
  

  div.container-mobile div.col-xs-4 {
    height:200px;
  }
  #top-banner1 {
     /* background-image: url("https://www.shipito.com/imgs/home/TopBannerMobile1.jpg"); */
    background-image: url(../../imgs/home/TopBannerMobile1.jpg);
     background-position:35% top;
     background-size: cover;
  }

  #top-banner2 {
     background-position:center top;
  }

  div.reason {font-size: 15px;}
  .main-box {
    display: none;
  }
  .sign-up {
    display: block;
    margin-top: 20px;
  }
  .mobile-image, .mobile-only {
   display: block;
  }
  .mobile-logo {
    display: inline;
  }
  .carousel-caption {
    padding: 0px;
  }
  
  .mobile-image, .mobile-only {
   display: block;
  }
  .not-mobile {
   display: none;
  }
  .full-size-image, .full-size-container {
   display: none;
  }
  .columns {
    margin-bottom: 0px;
  }
  .columns div.step-header {
    font-size:16px;
    text-align:left;
  }
 .columns DIV.step-description {
   text-align:left;
   margin: 5px 0px 40px 0px;
  }
 .middle-column DIV.step-description {
   border-left: none;
   border-right: none;
 }

 
 .carousel-indicators {
   display:none;
 }
 
 div.top-steps {
   margin-top:100px;
   margin-bottom:0px;
 }
 div.container-popular {
   margin-top:-40px;
 }
 
 div.videothumb {
   margin-top:-142px;
   position:relative;
   left: 50%;
   transform: translate(-50%, 0);
   width:200px;
 }

   html[dir="rtl"] div.videothumb {
   margin-top:-142px;
   position:relative;
   right: 50%;
   transform: translate(50%, 0);
   width:200px;
 }

 div.play-btn i {
   font-size: 45px;
 }

 div.videothumb img {
   width:200px;
 }

 div.section-title {
   margin-bottom:45px;
   margin-top:60px;
   line-height:16px;
 }
 div.section-caption {
   margin-bottom: 30px;
}
 div.section-caption-mobile {
   margin-bottom:60px;
 }
 
 div.section-caption-mobile {
   margin-top:80px;
 }
 
 div.container-mobile {
   padding: 0;
   margin:0;
   overflow:hidden;
 }
 .main-body {
   padding:0;
 }
 
 .table-popular-items img {
   width:225px;
   margin-bottom:40px;
 }
 .table-popular-items td {
   vertical-align:top;
 }
 
 td.popular-item-caption1 {
     font-size:18px;
     text-align:center;
     font-color: #000;
     white-space: normal;
     word-wrap:break-word;
     line-height: 1.5em;
     padding-bottom:30px;
 }
 td.popular-item-caption2 {
     font-size:18px;
     text-align:center;
     font-color: #000;
     white-space: normal;
     word-wrap:break-word;
     line-height: 1.5em;
     padding-bottom:40px;
   }
 td.popular-item-caption-small {
     text-align:center;
     font-size:16px;
     font-color: #808080;
     white-space: normal;
     word-wrap:break-word;
     line-height: 1.5em;
 }
 .reviews DIV.review {
   height: 270px;
   width: 290px;
   margin: 20px 40px 20px 0;
   padding: 10px 5px 0px 20px;
   background-size: cover;
   background-repeat: no-repeat;
   font-size: 16px;
   text-align: left;
 }
 
 .review DIV.review-text {
   height:120px;
   white-space:normal;
   word-wrap: break-word;
  }
}

.signup-banner.top-signup-banner {
  background-color: #BFBFBF;
  color: #FFFFFF;
  margin-top: -80px;
  background-image: url("https://www.shipito.com/imgs/signup/mapblue.svg");
}


