
@font-face {
    font-family: oswald;
    src: url("https://do-commerce.com/docommerce/ebay/mequedouno/fonts/oswald/Oswald-Light.ttf");
    font-weight: 300;
}
@font-face {
    font-family: oswald;
    src: url("https://do-commerce.com/docommerce/ebay/mequedouno/fonts/oswald/Oswald-Regular.ttf");
    font-weight: normal;
}
@font-face {
    font-family: oswald;
    src: url("https://do-commerce.com/docommerce/ebay/mequedouno/fonts/oswald/Oswald-Bold.ttf");
    font-weight: bold;
}
@font-face {
    font-family: rokkitt;
    src: url("https://do-commerce.com/docommerce/ebay/mequedouno/fonts/rokkitt/Rokkitt-Regular.ttf");
    font-weight: normal;
}
@font-face {
    font-family: rokkitt;
    src: url("https://do-commerce.com/docommerce/ebay/mequedouno/fonts/rokkitt/Rokkitt-Bold.ttf");
    font-weight: bold;
}

body{
    color: #333333;
    font-family: oswald;
}

h2, h3, h4 {
    color: #008ED7;
}
#header{
    padding-top: 1em;
    background-color: #ffffff;
}

#top_menu{
    background-color: #222222;
    color: white;
    font-family: oswald;
}

#top_menu a{
    color: white;
    text-decoration: none;
    text-align: center;
    font-size: 12px;
    font-weight: bold;
    text-transform: uppercase;
}

#top_menu a:hover{
    color:#222222;
}

#logo img{
    width: auto;
    max-width: 150px;
}

#logo_text{
    color: #009ee3;
    font-weight: bold;
}

#contact{
    text-align: right;
    margin-top: 10px;
    font-family: oswald;
    padding-bottom: 25px;
}

#contact a{
    color: #222222;
    text-decoration: none;
    display: inline;
    font-size: 14px;
    font-weight: bold;
}

#contact_link{
    border-right-style: solid;
    border-right-width: thin;
    border-right-color: #222222;
    margin-right: .5em;
    padding-right: 1em;
}

#title_description{
    padding: 0;
}

/*IMAGENES DEL PRODUCTO*/
#principal_picture{
    margin-top: 16px;
    text-align: center;
    height: 100%;
   /* min-height: 480px;
    max-height: 480px;*/
    padding-left: 0;
    padding-right: 0;
}

.previews div:first-child{
    border: thin solid #cccccc;
    display: block;
    margin: 0 auto;
    padding: 0em 2em;
    max-width: 100%;
    height: auto;
}

.previews div:first-child img{
	display: block;
    margin: 0 auto;
    padding: 0em 2em;
    max-width: 100%;
    height: auto;
}

#preview_picture{
    padding-left: 0;
    padding-right: 0;
}

.zoom{
    padding-top: 15px;
    font-family: oswald;
    font-size: 13px;
    color:grey;
}

#principal_picture > div > a > img{ 
    margin-left: auto;
    margin-right: auto;
    max-height: 478px;
    min-height: 478px;
    padding: 20px;
}

#thumbnail_pictures{
    width: 100%;
    padding-right: 0;
    padding-left: 0;
}

.product_thumbnail{
    padding: 3px;
    text-align: center;
    cursor: pointer;
}

.thumb_wrap{
    padding: 0;
    margin:20px 0 0 0;
}

.product_thumbnail {
    margin: 0 5px 0 0;
}
/*FIN DE IMAGENES DEL PRODUCTO*/
/*MODAL*/
.dialogo{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
    opacity: 0;
    display: none;
    background-color: rgba(0,0,0,.5);
    transition: all 0s;
}

.m_modal{
    margin-top: 1em;
    position: relative;
    margin: 2% auto;
    float: none;
}

.dialogo:target{
    opacity: 1;
    display: block;
    pointer-events: auto;
}

.complete_picture{
    max-width: 100%;
    margin: 0 auto;
    display: block;
    max-height: 82vh;
}

.previews{
    display:none;
    height: 100%;
    width: 100%;
    background-color: white;
}

#preview_image_1{
    float:left;
    display: block;
}

#preview_image_1:target{
    display: block;
    /*position: absolute;*/
}

#preview_image_2:target{
    display: block;
    position: absolute;
    padding-right: 20px;
}

#preview_image_3:target{
    display: block;
    position: absolute;
    padding-right: 20px;
}

#preview_image_4:target{
    display: block;
    position: absolute;
    padding-right: 20px;
}

#preview_image_5:target{
    display: block;
    position: absolute;
    padding-right: 20px;
}

#preview_image_6:target{
    display: block;
    position: absolute;
    padding-right: 20px;
}

#preview_image_7:target{
    display: block;
    position: absolute;
    padding-right: 20px;
}

#preview_image_8:target{
    display: block;
    position: absolute;
    padding-right: 20px;
}

#preview_image_9:target{
    display: block;
    position: absolute;
    padding-right: 20px;
}

#preview_image_10:target{
    display: block;
    position: absolute;
    padding-right: 20px;
}

#preview_image_11:target{
    display: block;
    position: absolute;
    padding-right: 20px;
}

#preview_image_12:target{
    display: block;
    position: absolute;
    padding-right: 20px;
}

#preview_image_13:target{
    display: block;
    position: absolute;
    padding-right: 20px;
}

#preview_image_14:target{
    display: block;
    position: absolute;
    padding-right: 20px;
}

#preview_image_15:target{
    display: block;
    position: absolute;
    padding-right: 20px;
}

#preview_image_16:target{
    display: block;
    position: absolute;
    padding-right: 20px;
}

#preview_image_17:target{
    display: block;
    position: absolute;
    padding-right: 20px;
}

#preview_image_18:target{
    display: block;
    position: absolute;
    padding-right: 20px;
}

#preview_image_19:target{
    display: block;
    position: absolute;
    padding-right: 20px;
}

#preview_image_20:target{
    display: block;
    position: absolute;
    padding-right: 20px;
}

.flecha-derecha{
    position: absolute;
    top: 50%;
    right: 2%;    
}

.flecha-derecha a{
    float: right;
}

.flecha-izquierda{
    position: absolute;
    top: 50%;
    left: 2%;
}

.imagen-central{
    left: 8%;
    min-height: 60px;
}

.imagen-central img{
    max-width: 100%;
    margin: 0 auto;
    display: block;
    max-height: 82vh;
}

.cerrar{
    color:#222222;
    font-weight: bold;
    font-size: 20px;
}

.cerrar:hover{
    color:#222222;
    text-decoration: none;
}


.bar1, .bar3 {
    width: 27px;
    height: 5px;
    background-color: #333;
    margin: 6px 0;
    transition: 0.4s;
}

.bar1 {
    -webkit-transform: rotate(-45deg) translate(0px, 6px) ;
    transform: rotate(-45deg) translate(0px, 6px) ;
}

.bar3 {
    -webkit-transform: rotate(45deg) translate(-1px, -8px) ;
    transform: rotate(45deg) translate(-1px, -8px) ;
}
/*FIN DE MODAL*/
#title{
    color: #555555;
    font-weight: bold;
    font-size: 25px;
}

#title{
    border-bottom: solid thin #cccccc;
    margin-bottom: 10px;
    padding-bottom: 10px;
}

#title_description p{
    font-size: 13px;
    padding: 0;
}

.more_description {
    margin-top: 20px;
}

.price{
    padding-top: 1em;
}

#standar_price{
    font-size: 13px;
    padding-bottom: 5px;
}

#iva_inc{
    color: #0088dd;
    font-weight: bold;
}

#standar_shipping, #personal_shipping
{
    color: #0088dd;
    font-weight: bold;
}

#shipping h2, #payment h2, #return h2{
    font-size: 1.15em;
    font-weight: bold;
    color: #222222;
}

#shipping, #payment, #return{
    padding: 0;
    font-family: oswald;
}

#shipping_price_value{
    font-weight: bold;
}

#payment_description{
    font-size: .85em;
    /*color: #a8d5f2;*/
}

#payment{
    margin-bottom: .7em;
}

#shipping p, #payment p, #return p{
    font-size: 11.5px;
    text-align: justify;
    line-height: 1.5em;
}

#previous{
    color: #909090;
}

#previous_price{
    text-decoration: line-through;
}

#price_value{
    font-size: 2.7em;
    color: #0088dd;
    font-weight: bold;
}

#price_currency{
    font-size: 2em;
    color: #0088dd;
}

#price_info_footer{
    border-bottom-style: dotted;
    border-bottom-width: thin;
    border-bottom-color: #878787;
    padding-bottom: .3em;
    margin-bottom: 1em;
}

#info{
    font-family: oswald;
    padding-top: 10px;
}

#price_info{
    margin-top: 1em;
    font-family: oswald;
}

@media(max-width: 1000px){
    #price_info{
        margin-top: 2.5em;
    }
}

#price_info , #shipping_description{
    background-color: #f6f6f6;
}

#preview_picture{
    margin-top: 16px;
    text-align: center;
    padding-right: 15px;
}

.selected_product_picture{
    display: block;
    margin: 0 auto;
    padding: 0em 2em;
}

#thumbnail_pictures{
    width: 100%;
}

.product_thumbnail{
    padding: 3px;
    text-align: center;
    cursor: pointer;
}

.product_thumbnail img{
    width: 100%;
    display: block;
    padding: 4px;
    /*min-height: 190px;*/
    border: solid thin #cccccc;
    max-width: 100%;
    height: auto;
}

#complete_picture{
    text-align: center;
    margin-top: 2em;
    margin-bottom: 2em;
}

.complete_picture{
    width: 100%;
}

.dialogo .complete_picture{
    width: auto;
}

.complete_picture_link{
    cursor: pointer;
    font-size: .85em;
    color: grey;
}

@media(min-width: 900px){
    #pictures{
        min-height: 950px;
    }   
}

#picture_link_logo{
    width: 4%;
    margin-right: 1em;
}

.more_info_border{
    border-style: solid;
    border-width: thin;
    border-color: #cccccc;
    padding: 2em;
}

@media (max-width: 800px){
    .more_info_border{
        padding: .8em;
    }
    
    #more_info{
        padding: .3em;
    }
    
    #contact {
        text-align: center;
    }

    #logo {
        text-align: center;
    }

    .previews {
        padding-right: 0!important;
    }
}

#more_description_title,
#more_info_title{
    font-size: 21px;
    margin-bottom: 1.5em;
    color: #555555;
}

#more_info{
    margin-top: 3em;
    font-family: oswald;
    padding: 0;
}

.more_description_feature_title,
.more_info_feature_title{
    font-size: 18px;
    color: #0088dd;
    border-bottom-style: solid;
    border-bottom-width: thin;
    border-bottom-color: #cccccc;
    margin-bottom: 1em;
    padding-bottom: .3em;
    font-family: oswald;
}

.feature_list{
    font-size: 12.8px;
    font-family: oswald;
}

.thumbnails{
    background-color: #f6f6f6;
    margin-top: 2em;
    padding: 1.5em;
    padding-bottom: 5em;
}


@media(min-width: 800px){
    .featured_thumbnails{
        width: 90vw;
    }
}

#thumbnail_left_arrow{
    position: absolute; 
    top: 5em; 
    bottom: 5em; 
    left: -3vw; 
    cursor: pointer;
    width: 1em;
}

#thumbnail_right_arrow{
    position: absolute; 
    top: 5em; 
    bottom: 5em; 
    right: -3vw; 
    cursor: pointer;
    width: 1em;
}

#thumbnail_left_arrow_mobile{
    position: absolute; 
    top: 30%; 
    left: -7vw; 
    cursor: pointer;
    width: 1em;
}

#thumbnail_right_arrow_mobile{
    position: absolute; 
    top: 30%; 
    right: 0vw; 
    cursor: pointer;
    width: 1em;
}


footer{
    background: #000000;
    padding: 0px 0px 0px 0px;
    cursor: pointer;
    margin-top: 5em;
	color: #ffffff;
	text-align: center;
}

footer .text-muted{
    margin: 0;
    color: #FFFFFF;
    font-family: rokkitt;
}
footer .text-muted:first-child {
    font-size: 18px;
    font-weight: bold;
}

footer .street{
    color: #838382;
    font-size: 14px;
}

footer div img {
  padding: 0;
  margin: 0;
  display: inline;
}


footer div div {
  padding: 0;
  margin: 0;
}





    /* TABS */
        

        .tabs-container {
            padding: 30px;
            background-color: #000000;
            text-align: center;
            margin-bottom: 30px;
        }
    
        /* Style the tab */
        .tab {
            /*overflow: hidden;*/
            /*border: 1px solid #ccc;*/
            /*background-color: #f1f1f1;*/
        }

        /* Style the buttons inside the tab */
        .tab div {
            background-color: #ff9d00;
            /*border-left: 8px solid #000000;
            border-right: 8px solid #000000;*/
            /*float: left;*/
            /*border: none;*/
            /*outline: none;*/
            cursor: pointer;
            padding: 14px 16px 14px 16px;
            transition: 0.3s;
            font-size: 17px;
            color: #000000;
            display: inline;
            margin: 0px 4px;
            border: 1px solid #ffffff;

        }

        /* Change background color of buttons on hover */
        .tab div:hover {
            background-color: #ddd;
        }

        /* Create an active/current tablink class */
        .tab div.active {
            background-color: #ffffff;
            /*border-bottom: 4px solid #ffffff;*/
        }

        /* Style the tab content */
        .tabcontent {
            display: none;
            background-color: #ffffff;
            padding: 30px 15px;
            margin-top: 15px;
            border: 3px solid #ffffff;
            border-top: none;
            /*animation: fadeEffect 1s; /* Fading effect takes 1 second */
            z-index: 999;
        }



        /* Go from zero to full opacity */
       /* @keyframes fadeEffect {
            from {opacity: 0;}
            to {opacity: 1;}
        }*/




main {
  padding: 0px;
  margin: 0 auto;
  /*background: #000;*/
}
section {
  display: none;
  padding: 20px 20px;
  border-top: 1px solid #ddd;
  background: #fff;
}
input {
  display: none;
}

label {
  display: inline-block;
  margin: 0 0 -1px;
  padding: 15px 25px;
  font-weight: 600;
  text-align: center;
  color: #000000;
  border: 1px solid transparent;
  background-color: orange;
}

label:hover {
  color: #888;
  cursor: pointer;
}

input:checked + label {
  color: #555;
  border: 1px solid #ddd;
  border-top: 2px solid orange;
  border-bottom: 1px solid #fff;
  background-color: #fff;
}

#tab1:checked ~ #content1,
#tab2:checked ~ #content2,
#tab3:checked ~ #content3,
#tab4:checked ~ #content4 {
  display: block;
}

@media screen and (max-width: 650px) {
  label {
    font-size: 0;
  }
  label:before {
    margin: 0;
    font-size: 18px;
  }
}

@media screen and (max-width: 400px) {
  label {
    padding: 15px;
  }
}


    /* / TABS */ 

