html,
body {

  background-color: black;
  width: 100%;
  height: 100%;

}

body.clear {
    background-color: white;
     width: 100%;
  height: 100%;
}

.bits-normal{

  background-image: url("../img/pattern_bits.png");
  background-repeat: repeat;
  background-size: 300px;
      background-attachment: fixed;

}
.bits-blur {

  background-color: black;
  background-image: url("../img/pattern_bits_blur.png");
  background-repeat: repeat;
  background-size: 300px;
      background-attachment: fixed;
      z-index: 6;
position: relative;
margin-top: -180px;

}
.bits-black {

  background-color: black;
position: relative;


}


h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: 'Roboto', sans-serif;
}

h3 {
text-transform: uppercase;
}

.pink{

  color:#e60055;
}
.black{

  color: black;
}

.white {
color: white;

}


.hero{
    height: 60%;
}

.whole {
    background-color: white;

}

button.form-yellow {
    background-color: transparent;
    border: none;
}


.modal-footer {
    padding: 15px;
    text-align: cenyer;
    border-top: none;
    float: left;
}

.bit-1 {
    margin-top: 20%;
    height: 200px;
    width: 525px;
    /* color: aquamarine; */
    position: absolute;
    display: block;
    z-index: 2;
    margin-left: -160px;
    border-radius: 95px;
    transform: rotate(45deg);
    background-color: rgb(0, 173, 255);
    -webkit-box-shadow: -9px 13px 46px 0px rgba(0,0,0,0.6);
    -moz-box-shadow: -9px 13px 46px 0px rgba(0,0,0,0.6);
    box-shadow: -9px 13px 46px 0px rgba(0,0,0,0.6);
}

.splash-top{
  background-image: url('../img/white_splash.png');
  background-size: contain;
  height: 400px;
  background-position: bottom right;
  width: 100%;
  height: 800px;
      position: relative;
    background-repeat: no-repeat;
}

.text-logo >h1 {
    color: white;
    font-weight: 100;
    font-size: 120px;
    position: fixed;
    left: 0;
     width: 100%;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    background-color: black;
}

.text-logo >h2 {
    color: white;
    font-weight: 100;
    font-size: 22px;
    position: fixed;
    left: 0;
    margin-top: 130px;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    background-color: black;
    text-transform: uppercase;
    letter-spacing: 7px;
}
span.bit-hero {
    font-weight: 900;
}

.text-logo {
    margin-top: 20%;
}

section.about {
    height: 900px;
    background-color: white;
position: relative;
        margin-top: -20px;
}


section#work {
    margin-top: -20px;
}

.bit-0 {
    background-color: #e60055;
    height: 600px;
    width: 600px;
    border-radius: 500px;
    position: relative;
    z-index: 10;
    -webkit-box-shadow: -9px 13px 46px 0px rgba(0,0,0,0.6);
    -moz-box-shadow: -9px 13px 46px 0px rgba(0,0,0,0.6);
    box-shadow: -9px 13px 46px 0px rgba(0,0,0,0.6);
}

.bit-0-inner {
    background-color: white;
    width: 180px;
    height: 180px;
    right: 0;
    left: 0;
    margin-left: 35%;
    margin-right: auto;
    position: absolute;
    margin-top: 36%;
    border-radius: 200px;
    -webkit-box-shadow: inset 8px 14px 25px 7px rgba(0,0,0,0.26);
  -moz-box-shadow: inset 8px 14px 25px 7px rgba(0,0,0,0.26);
  box-shadow: inset 8px 14px 25px 7px rgba(0,0,0,0.26);
}

/*.bit-0-margin {
    position: absolute;
    right: 0;
    margin-top: -10%;
}*/

.about-us >h3 {
  position: absolute;
width: 600px;
font-size: 76px;
text-transform: uppercase;
font-weight: 100;
}

span.black {
    font-weight: 900;
}

span.black.blue {
    color: #05b6ff;
        text-transform: uppercase;
}

span.black.pink {
    color: #ff015b;
    text-transform: uppercase;
}

.about-us {
    padding-left: 60px;
    margin-top: 40px;
}

.about-us >p {
    margin-top: 200px;
    text-align: justify;
    font-weight: 300;
}

.about-us.shopi >p {
    margin-top: 200px;
    text-align: justify;
    font-weight: 300;
}

section.mercado-head {
    margin-top: 110px;
    display: inline-block;
    position: relative;
    height: 600px;
    background-color: white;
    width: 100%;
    background-image: url(../img/mercado-partners.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position-x: 120%;
    background-position-y: 10%;
    background-size: 700px;
    -webkit-animation-name: slide-left;
    -webkit-animation-duration: 1s;
    -webkit-animation-timing-function: linear;
}

.bit-button1 {
    background-color: black;
    color: white;
    padding-left: 40px;
    padding-right: 40px;
    padding-top: 10px;
    padding-bottom: 10px;
    border-radius: 5px;
    font-weight: 400;
    letter-spacing: 5px;
    text-transform: uppercase;
    margin-top: 50px;
}

.bit-button2 {
    background-color: black;
    color: white;
    padding-left: 40px;
    padding-right: 40px;
    padding-top: 10px;
    padding-bottom: 10px;
    border-radius: 5px;
    font-weight: 400;
    letter-spacing: 5px;
    text-transform: uppercase;
}

.splash-bottom{
  background-image: url(../img/bg-do.png);
  background-size: cover;
      background-color: #e6e6e6;
      height: 420px;
      background-position: bottom center;
      width: 100%;
}

.big-bits-blur{
  background-image: url('../img/big_bits_blur.png');
  background-size: contain;
  background-position: top center;
  background-repeat: repeat;

}

.bg-circle{
  background-image: url('../img/circle-pink.jpg');
  background-size: 570px;
    background-position: right center;
    background-repeat: no-repeat;

}
.row.copy-footer {
    padding-bottom: 50px;
    background-color: black;}

.ur-test {
    height: 400px;

    background-color: #e6e6e6;
    position: relative;
    width: 100%;
    margin-top: -25px;
}
.d-test {
    height: 400px;
    z-index: 6;
}

p.portfolio-header.pink {
    font-weight: 600;
    font-size: 30px;
    width: 400px;
    letter-spacing: 5px;
    text-transform: uppercase;
        cursor: pointer;
}

span.subheader {
    color: white;
    font-weight: 100;
    font-size: 14px;
    margin-top: -20px;
}

.yellow-stripe{

height: 600px;
background-color: #ffde00;
position: relative;
}

section.shopi-head {
    margin-top: 110px;
    display: inline-block;
    position: relative;
    height: 600px;
    background-color: white;
    width: 100%;
    background-image: url('../img/hand-bag.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position-x: 120%;
    background-position-y: 10%;
    background-size: 700px;
    -webkit-animation-name: slide-left;
    -webkit-animation-duration: 1s;
    -webkit-animation-timing-function: linear;
}

section.shopi-get {
    height: 630px;
    background-color: white;
    color: black;
    width: 100%;
    background-image: url('../img/get-background.jpg');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: bottom;
    margin-top: 0px;
    padding-top: 100px;
}

.instagram-section{
background-color: black;
  height: 600px;
margin-top: -20px;
  position: relative;

}

h3.heading-section {
    font-weight: 100;
    text-transform: uppercase;
    /* left: 0; */
    /* right: 0; */
    /* position: absolute; */
    text-align: center;
    font-size: 75px;
    margin-bottom: 10px;
        padding-top: 50px;
}
p.sub-heading{

    text-align: center;
    padding-top: 10px;
    font-weight: 100;

}

h3.heading-yellow {
    font-weight: 100;
    text-transform: uppercase;
    /* left: 0; */
    /* right: 0; */
    /* position: absolute; */
    text-align: center;
    margin-top: 100px;
    font-size: 75px;
    margin-bottom: 80px;
}

img.img-responsive.img-istagram {
    border-radius: 100%;
    height: 220px;
    opacity: 0.2;
    -webkit-transition: all 0.3s ease-in;
    -moz-transition: all 0.3s ease-in;
    -o-transition: all 0.3s ease-in;
    transition: all 0.3s ease-in;

}

img.img-responsive.img-istagram:hover {
  opacity: 1;
    border-radius: 5px;
    height: 220px;
    -webkit-transition: all 0.3s ease-in;
    -moz-transition: all 0.3s ease-in;
    -o-transition: all 0.3s ease-in;
    transition: all 0.3s ease-in;
}

.middle {
  transition: .5s ease;
  position: absolute;
  top: 50%;
  color: white;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%)
}

.like-heart{
color: red;

}

.instagram-likes {
    font-size: 22px;
    font-weight: 500;
}


/* Change the white to any color ;) */
input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 30px white inset;
    -webkit-text-fill-color: black !important;
    color: black;

}



form.form-horizontal.yellow-contact {
    margin-top: 50px;
}

.instagram-picture {
    margin-top: 100px;
}

.form-inputs {
    color: #000000;
    border: none;
    padding: 10px;
    width: 100%;
    border-radius: 5px;
    -webkit-box-shadow: -1px -1px 43px -2px #f0ad4e;
    -moz-box-shadow: -1px -1px 43px -2px rgba(0,0,0,0.42);
    box-shadow: -1px -1px 43px -2px #f0ad4e;
    margin-bottom: 10px;
}

span#bullet_1 {
    background-color: pink;
    height: 20px;
    width: 20px;
    position: absolute;
    display: block;
    margin-left: -30px;
    border-radius: 100%;
    margin-top: 10px;
}

.TEST {
    position: fixed;
    background-color: white;
    width: 100%;
    height: 100%;
    z-index: 9999;
    display: none;
}

/* The animation code */
@keyframes example {
    0%   {width: 0%;display: block;}
    25%  { width: 25%;height:25%; display: block;}
    50%  { width: 50%; height:50%; display: block;}
    75%  { width: 75%;height:75%; display: block;}
    100% {width: 100%;height:100%;display: block;}
}

.effect_overlay{

  animation-name: example;
     animation-duration: 0.3s;
     animation-iteration-count: 1;
animation-fill-mode: forwards;
animation-timing-function: linear;
display: block;
}

ul.navbar-black {


  left:0;
  right:0;
  margin-left:auto;
  margin-right: auto;
  margin-top: 20px;
  position: fixed;
  text-align: center;
}


ul.navbar-white {
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    margin-top: 0px;
    position: relative;
    text-align: center;
    padding-top: 20px;
}


img.partners {
    width: 230px;
}

ul.navbar-black >li {
padding-right: 10px;
padding-left: 10px;
margin-top: 20px;
list-style:none;
display: inline;
background-color: black;

}

ul.navbar-white >li {
padding-right: 10px;
padding-left: 10px;
margin-top: 20px;
list-style:none;
display: inline;
background-color: transparent;

}

ul.navbar-black >li>a {
  list-style: none;
  color: white;
  font-family: 'Roboto', sans-serif;
  text-transform: uppercase;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 2px;

}

ul.navbar-white >li>a {
  list-style: none;
  color: black;
  font-family: 'Roboto', sans-serif;
  text-transform: uppercase;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 2px;

}

.invisible{

display: none;
}



p.copy {
    color: white;
    font-size: 12px;
    text-align: center;
    display: inline-block;
    position: absolute;
    bottom: 0;
}





img.hand {
    float: left;
    height: 100%;
    overflow: hidden;
}






img.truck {
    position: absolute;
    right: 0;
    /* width: 100%; */
    margin-left: -65px;
    bottom: 0;

    height: 400px;
}

form.form-horizontal.yellow-contact {
    margin-top: 30px;
    position: relative;
    left: 0;
    margin-left: -30px;
}


@keyframes b-in {
  0%   { left: -10%; }
  100% { left: 0%; }

}

/*Shoppify page*/

.about-us2 >h3 {
    width: 600px;
    font-size: 76px;
    text-transform: uppercase;
    font-weight: 100;
}

.about-us2 >p {
  margin-top: 20px;
  font-weight: 300;
}


.about-us2.get >h3 {
    width: 600px;
    font-size: 76px;
    text-transform: uppercase;
    font-weight: 100;
    text-align: center;
}

/*Menu*/
.burger_menu {
    position: fixed;
    z-index: 200;
    left: 0;
    padding-left: -16px;
    background-color: black;
    padding-right: 10px;
    border-radius: 20%;
    margin-top: 1%;
    cursor: pointer;
    animation-name: b-in;
    animation-duration: .5s;
    animation-iteration-count: 1;
    animation-timing-function: ease;
}
.reverse{

  animation-direction: reverse;
}

ul.navbar-burger> li >a {
    color: white;
    text-decoration: none;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
        font-size: 13px;
        letter-spacing: 1px;
}
ul.navbar-burger> li >a:hover {
    text-decoration: underline;
}

.row.truck {
    margin-top: 50px;
}

/*Menu*/

.bg_blue{
  background-color: #05b6ff;

}

.bg_pink{
  background-color: #ff015b;

}

.bg_yellow{
  background-color: #f2d300;
}

.bg_black{

background-color: #262626;

}

.circle-pattern{
  background-image: url('../img/circles-pattern.png');
  background-size: 220px;
      background-position: center center;
      background-repeat: no-repeat;
      height: 160px;
      width: 160px;
      border-radius: 50%;
        left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
}



.circle-pattern >img {
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;

    display: block;
        position: absolute;
    width: inherit
}

p.circle-desc {
  text-align: center;
  margin-top: 15px;
  font-size: 13px;

}

p.circle-title {
  color: #4e4e4e;
  text-align: center;
  margin-top: 175px;
  font-size: 14px;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-weight: 500;
  position: absolute;
  margin-left: 0;
  margin-right: 0;
  left: 0;
  right: 0;
}

section.portfolio-d1 {
    background-color: #e6e6e6;
margin-top: -20px;
position: relative;
    padding-bottom: 30px;
}

section.portfolio-d1.shopi {
    background-color: white;
}

.infobox {
  margin: 10px 10px 20px 10px;
      background: #fff;
      -webkit-border-radius: 4px;
      -moz-border-radius: 4px;
      -ms-border-radius: 4px;
      border-radius: 4px;
      overflow: hidden;
      -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.07);
      -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.07);
      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.07);
}

.infobox >p {
    font-size: 13px;
    margin-top: 10px;
        padding: 10px;
        font-weight: 300;
font-size: 15px;
line-height: 26px;
color: #818892;
}

.row.portfolio-start {
    margin-top: 100px;
}


h3.circle-title {
    text-align: center;
    margin-top: 20px;
    text-transform: uppercase;
    font-weight: 300;
    letter-spacing: 1px;
    font-size: 22px;
}

section.copyfo {
    color: white;
    position: relative;
    bottom: 0;
    margin-top: 50px;
    padding-bottom: 30px;
}

.row.big-foot {
    display: block;
    text-align: center;
}

.logo-txt {
    color: white;
    text-align: center;
    font-weight: 100;
    letter-spacing: 1px;
        text-transform: uppercase;
}

.subfooter {
    color: white;
    text-transform: uppercase;
    font-weight: 100;
}

.row.big-foot {
    display: block;
    text-align: center;
    /* margin-top: 0px; */
    padding-bottom: 170px;
    background-color: black;
    padding-top: 50px;
}

.social-footer {
    margin-bottom: 20px;
}

img.img-responsive.facebook-footer {
    margin-right: 8px;
}
img.img-responsive.instagram-footer {
    margin-left: 8px;
}

.shops-footer {
    float: right;
    display: flex;
}

img.img-responsive.shopify-footer {
    margin-right: 30px;
    height: 40px;
}

h1.foot-title {
    font-weight: 100;
}

img.img-responsive.mercado-footer {
    height: 40px;
}
img.shopi-home {
    height: 60px;
}

img.item-portfolio {
    width: 100%;
}


p.sub-heading {
    position: relative;
}

.row.truck {
    margin-top: 50px;
}

.bit-1.yellow {
    margin-top: 20%;
    height: 240px;
    width: 696px;
    color: aquamarine;
    position: absolute;
    display: block;
    z-index: 2;
    margin-left: -420px;
    border-radius: 155px;
    transform: rotate(143deg);
    background-color: rgb(255, 212, 0);
    -webkit-box-shadow: -9px 13px 46px 0px rgba(0,0,0,0.6);
    -moz-box-shadow: -9px 13px 46px 0px rgba(0,0,0,0.6);
    box-shadow: -19px -20px 20px 0px rgba(0,0,0,0.2);
}

img.img-responsive.img-thanks {
    width: 70%;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    display: block;
}
.modal-body >p{

padding-left: 20px;
padding-right: 20px;
text-align: center;

}

.get >p {

    text-align: center;

}

a.btn.btn-defult.bit-button1.more {
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
}




.get >p {

    text-align: center;
 width: 100%;
}


.about-us.get {
    padding-left: 0px;
    width: 100%;
}

.about-us.get >h3 {
    position: absolute;
    width: 600px;
    font-size: 76px;
    text-transform: uppercase;
    font-weight: 100;
    text-align: center;
}

.get >.bit-button1 {
    background-color: black;
    color: white;
    padding-left: 40px;
    padding-right: 40px;
    padding-top: 10px;
    padding-bottom: 10px;
    border-radius: 5px;
    font-weight: 400;
    letter-spacing: 5px;
    text-transform: uppercase;
    margin-top: 50px;
    font-size: 21px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    display: block;
}




.slide-left {
	-webkit-animation: slide-left 1s ease-in 1s both;
	        animation: slide-left 1s ease-in 1s both;
}


.row.row-test {
    justify-content: space-around;
}

header#navigation-1 {
    background-color: white;
}

button.btn.btn-defult.bit-button1.more {
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
}


section.portfolio-d1.portafolio-page {
    background-color: white;
}


.clear {
    background-color: white;
}

section#portfolio {
    padding-bottom: 80px;
}


section.ban-shop {
    background-color: white;
    position: relative;
    height: 410px;
    padding-top: 70px;
}
p.sub-heading.left {
    text-align: left;
}

a.btn.btn-defult.bit-button1.more-ban {
    margin-top: 0px;
}


h3.banner {
    font-size: 40px;
    font-weight: 300;
    top: 0;
    bottom: 0;
    margin-bottom: auto;
    margin-top: 20px;
    display: block;
    position: relative;
}

img.img-responsive.shop-home {
    width: 45%;
}
img.img-responsive.merca-home {
    width: 45%;
}

.ribbons {
    margin-top: -70px;
}

.row-ban {
    display: flex;
}

@media only screen and (device-width:2560px){

ul.navbar-black >li>a {
    list-style: none;
    color: white;
    font-family: 'Roboto', sans-serif;
    text-transform: uppercase;
    font-size: 33px;
    font-weight: 400;
    letter-spacing: 2px;
}

    ul.navbar-black {
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    margin-top: 100px;
    position: fixed;
    text-align: center;
    /* width: 100%; */
}

    .text-logo {
    margin-top: 40%;
}

    .text-logo >h1 {
    color: white;
    font-weight: 100;
    font-size: 170px;
    position: fixed;
    left: 0;
    width: 100%;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    background-color: black;
}


    .text-logo >h2 {
    color: white;
    font-weight: 100;
    font-size: 36px;
    position: fixed;
    left: 0;
    margin-top: 160px;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    background-color: black;
    text-transform: uppercase;
    letter-spacing: 7px;
    padding-top: 60px;
    padding-bottom: 30px;
}


    .splash-top {
    background-image: url(../img/white_splash.png);
    background-size: cover;
    height: 400px;
    background-position: top right;
    width: 100%;
    z-index: 7;
    height: 1180px;
    position: relative;
    background-repeat: no-repeat;
}


    .bit-1 {
    margin-top: 11%;
    height: 340px;
    width: 1265px;
    /* color: aquamarine; */
    position: absolute;
    display: block;
    z-index: 2;
    margin-left: -290px;
    border-radius: 185px;
    transform: rotate(45deg);
    background-color: rgb(0, 173, 255);
    -webkit-box-shadow: -9px 13px 46px 0px rgba(0,0,0,0.6);
    -moz-box-shadow: -9px 13px 46px 0px rgba(0,0,0,0.6);
    box-shadow: -9px 13px 46px 0px rgba(0,0,0,0.6);
}


    section.about {
    height: 1210px;
    background-color: white;
    position: relative;
    margin-top: -20px;
    padding-top: 50px;
}

    .big-bits-blur {
    background-image: url(../img/big_bits_blur.png);
    background-size: cover;
    background-position: top center;
    background-repeat: repeat;
}

    .about-us >h3 {
    position: absolute;
    width: 1000px;
    font-size: 116px;
    text-transform: uppercase;
    font-weight: 100;
}

    .about-us >p {
    margin-top: 300px;
    text-align: justify;
    font-weight: 100;
    font-size: 30px;
    width: 1000px;
}

    .bit-button1 {
    background-color: black;
    color: white;
    padding-left: 54px;
    padding-right: 54px;
    padding-top: 19px;
    padding-bottom: 19px;
    border-radius: 5px;
    font-weight: 400;
    letter-spacing: 7px;
    text-transform: uppercase;
    margin-top: 50px;
    font-size: 30px;
}

    .bg-circle {
    background-image: url(../img/circle-pink.jpg);
    background-size: 760px;
    background-position: right center;
    background-repeat: no-repeat;
}


    .splash-bottom {
    background-image: url(../img/bg-do.png);
    background-size: cover;
    background-color: #e6e6e6;
    height: 640px;
    background-position: bottom center;
    width: 100%;
}

    h3.heading-section {
    font-weight: 100;
    text-transform: uppercase;
    /* left: 0; */
    /* right: 0; */
    /* position: absolute; */
    text-align: center;
    font-size: 116px;
    margin-bottom: 10px;
    padding-top: 50px;
}

    .splash-bottom >p.sub-heading {
    font-size: 38px;
}

    .ur-test {
    height: 900px;
    background-color: #e6e6e6;
    position: relative;
    width: 100%;
    margin-top: -25px;
}

    .circle-pattern {
    background-image: url(../img/circles-pattern.png);
    background-size: 220px;
    background-position: center center;
    background-repeat: no-repeat;
    height: 270px;
    width: 270px;
    border-radius: 50%;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
}

    .circle-pattern >img {
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    display: block;
    position: absolute;
    width: 270px;
}
    h3.circle-title {
    text-align: center;
    margin-top: 20px;
    text-transform: uppercase;
    font-weight: 300;
    letter-spacing: 1px;
    font-size: 35px;
}

    p.circle-desc {
    text-align: center;
    margin-top: 15px;
    font-size: 28px;
}

    p.sub-heading {
    text-align: center;
    padding-top: 10px;
    font-weight: 100;
    font-size: 38px;
}

  .bit-1.yellow {
    margin-top: 20%;
    height: 300px;
    width: 835px;
    color: aquamarine;
    position: absolute;
    display: block;
    z-index: 2;
    margin-left: -590px;
    border-radius: 155px;
    transform: rotate(143deg);
    background-color: rgb(255, 212, 0);
    -webkit-box-shadow: -9px 13px 46px 0px rgba(0,0,0,0.6);
    -moz-box-shadow: -9px 13px 46px 0px rgba(0,0,0,0.6);
    box-shadow: -19px -20px 20px 0px rgba(0,0,0,0.2);
}

}


@media only screen and (min-width: 1400px) and (max-width:2000px){

    .splash-top {
    background-image: url('../img/white_splash.png');
    background-size: cover;
    height: 400px;
    background-position: top left;
    width: 100%;
    z-index: 7;
    height: 800px;
    position: relative;
    background-repeat: no-repeat;
}


.bit-1 {
    margin-top: 10%;
    height: 300px;
    width: 835px;
     color: aquamarine;
    position: absolute;
    display: block;
    z-index: 2;
    margin-left: -240px;
    border-radius: 155px;
    transform: rotate(45deg);
    background-color: rgb(0, 173, 255);
    -webkit-box-shadow: -9px 13px 46px 0px rgba(0,0,0,0.6);
    -moz-box-shadow: -9px 13px 46px 0px rgba(0,0,0,0.6);
    box-shadow: -9px 13px 46px 0px rgba(0,0,0,0.6);
}

ul.navbar-black >li>a {
    list-style: none;
    color: white;
    font-family: 'Roboto', sans-serif;
    text-transform: uppercase;
    font-size: 20px;
    font-weight: 400;
    letter-spacing: 2px;
}

ul.navbar-black {
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    margin-top: 0px;
    position: fixed;
    text-align: center;
     width: 100%;
    padding-top: 50px;
    background-color: black;
    padding-bottom: 30px;
}
    .about-us >p {
    margin-top: 200px;
    text-align: justify;
    font-weight: 100;
    font-size: 20px;
    width: 700px;
}
.bit-button1 {
    background-color: black;
    color: white;
    padding-left: 40px;
    padding-right: 40px;
    padding-top: 10px;
    padding-bottom: 10px;
    border-radius: 5px;
    font-weight: 400;
    letter-spacing: 5px;
    text-transform: uppercase;
    margin-top: 50px;
    font-size: 21px;
}

p.sub-heading {
    text-align: center;
    padding-top: 10px;
    font-weight: 100;
    font-size: 24px;
}

.ur-test {
    height: 630px;
    background-color: #e6e6e6;
    position: relative;
    width: 100%;
    margin-top: -25px;
    padding-top: 60px;
}

p.circle-desc {
    text-align: center;
    margin-top: 15px;
    font-size: 18px;
    font-weight: 300;
}

.infobox >p {
    font-size: 13px;
    margin-top: 10px;
    padding: 10px;
    font-weight: 300;
    font-size: 19px;
    line-height: 26px;
    color: #818892;
    margin-top: 11px;
    margin-bottom: 11px;
}

.yellow-stripe {
    height: 800px;
    background-color: #ffde00;
    position: relative;
    padding-top: 50px;
}

label.col-md-6.control-label {
    font-size: 20px;
}

.bit-button2 {
    background-color: black;
    color: white;
    padding-left: 40px;
    padding-right: 40px;
    padding-top: 10px;
    padding-bottom: 10px;
    border-radius: 5px;
    font-weight: 400;
    letter-spacing: 5px;
    text-transform: uppercase;
    font-size: 17px;
}

   section.shopi-head {
    margin-top: 110px;
    display: inline-block;
    position: relative;
    height: 600px;
    background-color: white;
    width: 100%;
    background-image: url(../img/hand-bag.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position-x: 120%;
    background-position-y: 10%;
    background-size: 700px;
   -webkit-animation-name: slide-left1400;
    -webkit-animation-duration: 1s;
    -webkit-animation-timing-function: linear;
}


}



@media only screen and (min-width:768px) and (max-width: 1024px){
      /* default iPad screens */

      .circle-pattern {
      background-image: url('../img/circles-pattern.png');
      background-size: 220px;
      background-position: center center;
      background-repeat: no-repeat;
      height: 160px;
      width: 160px;
      border-radius: 50%;
      left: 0;
      right: 0;
      margin-left: auto;
      margin-right: auto;
  }

  .circle-pattern >img {
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    display: block;
    position: relative;
    width: 120px;
}

img.img-responsive.img-istagram {
    border-radius: 100%;
    height: 165px;
    opacity: 0.2;
    -webkit-transition: all 0.3s ease-in;
    -moz-transition: all 0.3s ease-in;
    -o-transition: all 0.3s ease-in;
    transition: all 0.3s ease-in;
}


 .circle-pattern {
    background-image: url('../img/circles-pattern.png');
    background-size: 220px;
    background-position: center center;
    background-repeat: no-repeat;
    height: 120px;
    width: 120px;
    border-radius: 50%;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
}


  h3.circle-title {
    text-align: center;
    margin-top: 20px;
    text-transform: uppercase;
    font-weight: 300;
    letter-spacing: 1px;
    font-size: 19px;
}

.bg-circle {
    background-image: url('../img/circle-pink.jpg');
    background-size: contain;
    background-position: right center;
    background-repeat: no-repeat;
    background-size: 370px;
}

.bit-1 {
    margin-top: 0%;
    height: 200px;
    width: 525px;
    /* color: aquamarine; */
    position: absolute;
    display: block;
    z-index: 2;
    margin-left: -210px;
    border-radius: 95px;
    transform: rotate(45deg);
    background-color: rgb(0, 173, 255);
    -webkit-box-shadow: -9px 13px 46px 0px rgba(0,0,0,0.6);
    -moz-box-shadow: -9px 13px 46px 0px rgba(0,0,0,0.6);
    box-shadow: -9px 13px 46px 0px rgba(0,0,0,0.6);
}

  .splash-top {
    background-image: url('../img/white_splash.png');
    background-size: cover;

    background-position: bottom right;
    width: 100%;
    z-index: 7;
    height: 550px;
    position: relative;
    background-repeat: no-repeat;
}


       section.shopi-head {
    margin-top: 110px;
    display: inline-block;
    position: relative;
    height: 600px;
    background-color: white;
    width: 100%;
    background-image: url(../img/hand-bag.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position-x: 610%;
    background-position-y: 40%;
    background-size: 700px;
   -webkit-animation-name: slide-left760;
    -webkit-animation-duration: 1s;
    -webkit-animation-timing-function: linear;
}

section.mercado-head {
margin-top: 110px;
display: inline-block;
position: relative;
height: 600px;
background-color: white;
width: 100%;
background-image: url(../img/mercado-partners.png);
background-size: contain;
background-repeat: no-repeat;
background-position-x: 610%;
background-position-y: 40%;
background-size: 700px;
-webkit-animation-name: slide-left760;
-webkit-animation-duration: 1s;
-webkit-animation-timing-function: linear;
}

    .about-us2.get >h3 {
    width: 100%;
    font-size: 66px;
    text-transform: uppercase;
    font-weight: 100;
    text-align: center;
}
    h3.banner {
    font-size: 30px;
    font-weight: 300;
    top: 0;
    bottom: 0;
    margin-bottom: auto;
    margin-top: 20px;
    display: block;
    position: relative;
}


   }



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

  .text-logo {
      margin-top: 40%;
  }

  ul.navbar-black {
    display: none;
  }



 .bits-normal {
    background-image: none;
    background-repeat: repeat;
    background-size: 165px;
    background-attachment: inherit;
    background-color: transparent;
}

   .text-logo >h1 {
      color: white;
      font-weight: 100;
      font-size: 50px;
      position: absolute;
      left: 0;
      width: 100%;
      right: 0;
      margin-left: 0px;
      margin-right: 0px;
      text-align: center;
      background-color: black;
  }

  .text-logo >h2 {
    color: white;
font-weight: 100;
font-size: 13px;
position: absolute;
margin-top: 70px;
margin-left: 0px;
margin-right: 0px;
text-align: center;
background-color: black;
text-transform: uppercase;
letter-spacing: 3px;
width: 100%;
  }

      ul.navbar-black {
      z-index: 4;
      margin-left: 0px;
      margin-top: 20px;
      position: fixed;
      text-align: center;
      width: 100%;
      padding-left: 0px;
      padding-right: 0px;
      margin-right: 0px;
          display: none;
  }

   .splash-top {
    background-image: url('../img/white_splash.png');
    background-size: contain;
    height: 400px;
    background-position: bottom right;
    width: 100%;
    z-index: 7;
    height: 740px;
    position: relative;
    background-repeat: no-repeat;
     margin-top: 0px;
}
 .bit-1 {
    margin-top: 101%;
    height: 110px;
    width: 415px;
    /* color: aquamarine; */
    position: absolute;
    display: block;
    z-index: 2;
    margin-left: -230px;
    border-radius: 95px;
    transform: rotate(45deg);
    background-color: rgb(0, 173, 255);
    -webkit-box-shadow: -9px 13px 46px 0px rgba(0,0,0,0.6);
    -moz-box-shadow: -9px 13px 46px 0px rgba(0,0,0,0.6);
    box-shadow: -9px 13px 46px 0px rgba(0,0,0,0.6);
}


  section.about {
      height: 700px;
      background-color: white;

      position: relative;
  }

  .about-us {
      padding-left: 30px;
      margin-top: 170px;
  }

  .about-us >p {
      margin-top: 130px;
      text-align: justify;
      font-weight: 100;
  }

   .about-us >h3 {
     position: absolute;
         width: 235px;
         font-size: 40px;
         text-transform: uppercase;
         font-weight: 100;
         margin-top: -20px;
  }

    .text-logo {
      margin-top: 56%;
  }

 .hero {
    height: 90%;
    background-image: url('../img/pattern_bits.png');
    background-repeat: repeat;
    background-size: 165px;
    background-attachment: inherit;
    background-color: black;
    position: fixed;
    display: block;
    width: 100%;
}

    body#main {
    background-color: white;
}





  h3.heading-section {
      font-weight: 100;
      text-transform: uppercase;
      text-align: center;
      font-size: 46px;
      margin-bottom: 10px;
      padding-top: 50px;
  }
  .ur-test {
      height: 1220px;

      background-color: #e6e6e6;
      position: relative;
      width: 100%;
      margin-top: -5px;
  }

  section.portfolio-d1 {
      background-color: #e6e6e6;

      position: relative;
      margin-top: -30px;
  }

  .circle-pattern {
      background-image: url('../img/circles-pattern.png');
      background-size: 180px;
      background-position: center center;
      background-repeat: no-repeat;
      height: 90px;
      width: 90px;
      border-radius: 50%;
      left: 0;
      right: 0;
      margin-left: auto;
      margin-right: auto;
      margin-top: 30px;
  }

  section.portfolio-d1 {
      background-color: #e6e6e6;

      position: relative;
      margin-top: 0px;
      padding-top: 50px;
  }

  yellow-contact >row {
      display: flex;
      flex-direction: column-reverse;
  }

  .row.truck {
      display: flex;
      flex-direction: column-reverse;
  }

  .yellow-stripe {
      height: 810px;
      background-color: #ffde00;
      position: relative;

  }

  img.truck {
      position: relative;
      right: 0;
      width: 100%;
      margin-left: 0px;
      bottom: 0;

      height: auto;
      margin-top: 20px;
  }

  form.form-horizontal.yellow-contact {
      margin-top: 30px;
      position: relative;
      left: 0;
      margin-left: 0px;
  }
  .bit-button2 {
      background-color: black;
      color: white;
      padding-left: 40px;
      padding-right: 40px;
      padding-top: 10px;
      padding-bottom: 10px;
      border-radius: 5px;
      font-weight: 400;
      letter-spacing: 5px;
      text-transform: uppercase;
      text-align: center;
      left: 0;
      right: 0;
      margin-left: auto;
      margin-right: auto;
      position: relative;
      display: block;
      width: 100%;
  }

  .instagram-section {
      background-color: black;
      height: 700px;

      position: relative;
  }

  img.img-responsive.img-istagram {
    border-radius: 100%;
  height: 135px;
  width: 135px;
  opacity: 0.2;
  -webkit-transition: all 0.3s ease-in;
  -moz-transition: all 0.3s ease-in;
  -o-transition: all 0.3s ease-in;
  transition: all 0.3s ease-in;
  margin-top: 50px;
  }

  .middle {
      transition: .5s ease;
      position: absolute;
      top: 55%;
      color: white;
      left: 48%;
      transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      bottom: 45%;
      right: 20%;
  }

  .instagram-picture {
      margin-top: -50px;
  }

  section.copyfo {
      color: white;
      position: relative;
      bottom: 0;
      margin-top: 50px;
      padding-bottom: 30px;
      /* text-align: center; */
      width: 100%;
      display: flex;
  }




  section.footer {
      display: block;
      height: 130px;
      width: 100%;
      color: white;
      /* background-color: aliceblue; */
      position: absolute;
      z-index: 999;
      vertical-align: bottom;
  }
  .bg-circle {
      background-image: url('../img/circle-pink.jpg');
      background-size: contain;
      background-position: right center;
      background-repeat: no-repeat;
      background-size: 200px;
  }

  .about-us >p {
      margin-top: 130px;
      text-align: left;
      font-weight: 100;
      width: 270px;
  }

  .about-us {
      padding-left: 30px;
      margin-top: 60px;
  }

  .circle-pattern >img {
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    display: block;
    position: absolute;
    width: 85px;
}
img.img-responsive.shopify-footer {
    margin-right: 30px;
    height: 20px;
}
    img.img-responsive.mercado-footer {
    height: 20px;
}

  .shops-footer {
    float: right;
    display: flex;
}

    .big-bits-blur {
    background-image: url('../img/big_bits_blur.png');
    background-size: contain;
    background-position: top center;
    background-repeat: no-repeat;
}


    .instagram-likes {
   font-size: 22px;
   font-weight: 500;
   display: none;
}



img.img-responsive.img-istagram {

   opacity: 1;
}


.about-us2 >h3 {
    width: 100%;
    font-size: 26px;
    text-transform: uppercase;
    font-weight: 100;
}
.about-us2.get >h3 {
    width: 100%;
    font-size: 26px;
    text-transform: uppercase;
    font-weight: 100;
}

.bit-1.yellow {
    margin-top: 10%;
    height: 284px;
    width: 806px;
    color: aquamarine;
    position: absolute;
    display: block;
    z-index: 0;
    margin-left: -419px;
    border-radius: 155px;
    transform: rotate(143deg);
    background-color: rgb(255, 212, 0);
    -webkit-box-shadow: -9px 13px 46px 0px rgba(0,0,0,0.6);
    -moz-box-shadow: -9px 13px 46px 0px rgba(0,0,0,0.6);
    box-shadow: -19px -20px 20px 0px rgba(0,0,0,0.2);
}
    .col-md-7.offset-md-3.about-us2.get {
    z-index: 1;
}
section.shopi-get {
    margin-top: 0px;
    height: 530px;
    position: relative;
    padding-bottom: 20px;
    background-size: inherit;
    background-repeat: repeat;
}
    section.shopi-head {
    margin-top: 110px;
    display: inline-block;
    position: relative;
    height: 720px;
    background-color: white;
    width: 100%;
    background-image: url(../img/hand-bag.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position-x: -950%;
    background-position-y: 0%;
    background-size: 440px;
    -webkit-animation-name: slide-left420;
    -webkit-animation-duration: 1s;
    -webkit-animation-timing-function: linear;
    padding-top: 220px;
}
    section.ban-shop {
    background-color: white;
    position: relative;
    height: 690px;
    padding-top: 70px;
        text-align: center;
}

    .row-ban {
    display: flex;
    flex-direction: column-reverse;
    text-align: center;
}
    p.sub-heading.left {
    text-align: center;
}
}

a.home-return {
    color: black;
    text-decoration: none;
}



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

 .hero {
    height: 100%;
    background-image: url('../img/pattern_bits.png');
    background-repeat: repeat;
    background-size: 165px;
    background-attachment: inherit;
    background-color: black;
    position: fixed;
    display: block;
    width: 100%;
}

 .splash-top {
    background-image: url('../img/white_splash.png');
    background-size: contain;
    height: 400px;
    background-position: bottom right;
    width: 100%;
    z-index: 7;
    height: 640px;
    position: relative;
    background-repeat: no-repeat;
    margin-top: 0px;
}

    .bit-1.yellow {
    margin-top: 20%;
    height: 246px;
    width: 576px;
    color: aquamarine;
    position: absolute;
    display: block;
    z-index: 0;
    margin-left: -289px;
    border-radius: 155px;
    transform: rotate(143deg);
    background-color: rgb(255, 212, 0);
    -webkit-box-shadow: -9px 13px 46px 0px rgba(0,0,0,0.6);
    -moz-box-shadow: -9px 13px 46px 0px rgba(0,0,0,0.6);
    box-shadow: -19px -20px 20px 0px rgba(0,0,0,0.2);
}

    section.shopi-head {
    margin-top: 20px;
    display: inline-block;
    position: relative;
    height: 750px;
    background-color: white;
    width: 100%;
    background-image: url(../img/hand-bag.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position-x: -50%;
    background-position-y: 0%;
    background-size: 480px;
    -webkit-animation-name: slide-left300;
    -webkit-animation-duration: 1s;
    -webkit-animation-timing-function: linear;
    padding-top: 300px;
}

section.mercado-head {
margin-top: 20px;
display: inline-block;
position: relative;
height: 750px;
background-color: white;
width: 100%;
background-image: url(../img/mercado-partners.png);
background-size: contain;
background-repeat: no-repeat;
background-position-x: -50%;
background-position-y: 0%;
background-size: 480px;
-webkit-animation-name: slide-left300;
-webkit-animation-duration: 1s;
-webkit-animation-timing-function: linear;
padding-top: 300px;
}



    section.ban-shop {
    background-color: white;
    position: relative;
    height: 380px;
    padding-top: 70px;
    text-align: center;
}



}

.home-return{


}


@-webkit-keyframes slide-left {
  0% {
  background-position: 170% 10%;
  }
  100% {
    background-position: 120% 10%;
  }
}
@keyframes slide-left {
  0% {
   background-position: 170% 10%;
  }
  100% {
   background-position: 120% 10%;
  }
}


@-webkit-keyframes slide-left1400 {
  0% {
  background-position: 200% 10%;
  }
  100% {
    background-position: 120% 10%;
  }
}
@keyframes slide-left1400 {
  0% {
   background-position: 200% 10%;
  }
  100% {
   background-position: 120% 10%;
  }
}


@-webkit-keyframes slide-left1100 {
  0% {
  background-position: 310% 10%;
  }
  100% {
    background-position: 190% 10%;
  }
}
@keyframes slide-left1100 {
  0% {
   background-position: 310% 10%;
  }
  100% {
   background-position: 190% 10%;
  }
}

@-webkit-keyframes slide-left760 {
  0% {
  background-position: 1110% 40%;
  }
  100% {
    background-position: 610% 40%;
  }
}
@keyframes slide-left760 {
  0% {
   background-position: 1110% 40%;
  }
  100% {
   background-position: 610% 40%;
  }
}


@-webkit-keyframes slide-left420 {
  0% {
  background-position: -2750% 0%;
  }
  100% {
    background-position: -950% 0%;
  }
}
@keyframes slide-left420 {
  0% {
   background-position: -2750% 0%;
  }
  100% {
   background-position: -950% 0%;
  }
}

@-webkit-keyframes slide-left300 {
  0% {
  background-position: -200% 0%;
  }
  100% {
    background-position: -50% 0%;
  }
}
@keyframes slide-left300 {
  0% {
   background-position: -200% 0%;
  }
  100% {
   background-position: -50% 0%;
  }
}