@media (min-width: 576px/*768px*/) {
    .navbar,
    .viewport,
    .layer,
    .container { width: 550px !important; margin: 0 auto; }

}

.gt_float_switcher .gt-selected .gt-current-lang {
    padding: 10px 15px !important;
    color: #333;
    font-weight: bold;
}

.no-show { display: none !important; }

/** fixed toolbar */
.fixed-toolbar {
    position: fixed; z-index:1; top:0; background-color: white;
}

.tabs { display: flex; flex-direction: row; width: 100%; list-style-type: none; justify-content: space-around; align-items: center; padding: 0px; border-bottom: 1px solid #c0c0c0; }
.tabs__item { display: inline-block; height: 30px; width: 100px; text-align: center;}
.tabs__item .tabs__item-a { text-decoration: none; }
.tabs__item.tabs__item-active { border-bottom: 3px solid #1A73E8; margin-bottom: -3px; width: 100px; }
.content__tabs { }
.content__tab { display: none; }
.content__tab.content__tab-active { display: block !important; }

/** file-upload */
.form .row {
  margin-top:0px;
  display:flex;
  justify-content:space-around;
  flex-wrap:wrap;
  gap:20px;
}
.form .row .form-element {
  width: 100%;
  height:100%;
  box-shadow:0px 0px 20px 5px rgba(100,100,100,0.1);
  margin-bottom: 50px;
}
.form .row .form-element input {
  display:none;
}
.form .row .form-element img {
  width:100vw;
  height:210px;
  object-position: center center;
  object-fit:cover;
}
.form .row .form-element div {
  position:relative;
  height:40px;
  margin-top:-40px;
  background:rgba(0,0,0,0.5);
  text-align:center;
  line-height:40px;
  font-size:13px;
  color:#f5f5f5;
  font-weight:600;
}
.form .row .form-element div span {
  font-size: 1rem;
}

.form .row .form-element div span i {
  font-size: 2rem;
}

.form .row .form-element div button {
	position: absolute;
	right: 20px;
	bottom: -30px;
	border: none;
	border-radius: 50%;
	width: 64px;
	height: 64px;
}

.form textarea:focus, .form textarea { font-size: 1rem; }


/*
.upload{
  width: 100%;
  position: relative;
  margin: 0px;
  padding: 0px;
}

.upload img{
  width: 100%;
  height: 210px;
}

.upload .round{
  position: absolute;
  bottom: -15px;
  right: 15px;
  background: #00B4FF;
  width: 48px;
  height: 48px;
  line-height: 48px;
  text-align: center;
  border-radius: 50%;
  overflow: hidden;
}

.upload .round input[type = "file"]{
  position: absolute;
  transform: scale(2);
  opacity: 0;
}

input[type=file]::-webkit-file-upload-button{
    cursor: pointer;
}
*/


/*
.icon-menu {
    border-radius: 5px;
    padding: 5px;
}

.icon-menu a i { font-weight: bolder !important; font-size: 1.8rem !important; color: #333 !important;  }

.navbar {
    padding: 0px;
    height: 100vh;
    width: 85vw;
    position: fixed;
    top: 0;
    left: 0;
    background-color: white;
    z-index: 999999;
}

.navbar img { height: 210px; width: 100%; object-fit: cover; position: absolute; top: 0; padding: 0; margin: 0;}

.navbar nav { display: flex; flex-direction: column; justify-content: end; align-items: begin; position: absolute; top: 0; margin-top: 20px; }

.navbar ul li { list-style: none !important; padding-left: 0px !important; }
.navbar ul li a { text-decoration: none !important; }
*/

nav,.offcanvas { background-color: #1e293b; }
.navbar-toggler { border: none; }
.navbar-toggler:focus { outline: none; box-shadow: none; }
.offcanvas img {  height: 210px; width: 100%; object-fit: cover; position: absolute; top: 0; left: 0; padding: 0; margin: 0; }

.btn-contenidos {
    width: 80%;
    margin: 0 auto;
    display: flex;
    align-content: space-around;
    height: 60px;
    cursor: pointer;
}

.btn-content {
    width: 80%;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 60px;
    cursor: pointer;
}

.btn-menu:after {
    content: '';
    background-image: url('../../img/ico-right.svg');
    background-size: cover;
    background-repeat: no-repeat;
    margin-left: 50px;
    width: 16px;
    height: 16px;
    margin-bottom: 2px;
}

.btn-menu span { text-align: left; }

@media (max-width: 768px) {
  .navbar-nav > li:hover {
    background-color: #c0c0c0;
  }

  .form-control {
	  font-size: 1rem;
	  border-radius: 5px;
  }
}

.card { background: #dedede; }
.card img { border-bottom-left-radius: 0% !important; border-bottom-right-radius: 0% !important; height: 110px; }
.t-primary { color: #0046AA; font-style: italic; }
.label span a { text-decoration: none; }
.card .row .price { text-align: right; }
.footer a { text-decoration: none; color: white !important; }
/*
.layer {
    position: fixed;
    top: 0;
    right: 0;
    left: -5px;
    background-image: url('../../img/figure.png');
    background-repeat: repeat-y;
    background-position: left;
    opacity: 0.15;
    height: 100%;
    z-index: -1;
}
*/

.col img { object-fit: cover; width: 90px; height: 90px;}

/*
.sfera1 { background: #A50505; position: fixed; bottom: 50%; left: 0; border-radius: 50%; height: 200px; width: 200px; opacity: 0.2; margin-left: -35%; }
.sfera2 { background: #A50505; position: fixed; bottom: 25%; left: 0; border-radius: 50%; height: 200px; width: 200px; opacity: 0.1; margin-left: -35%; }
.sfera3 { background: #0046AA; position: fixed; bottom: 35%; left: -180px; border-radius: 50%; height: 200px; width: 200px; opacity: 0.2; }
*/

/** Grid Layout */
.grid-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

/** bg-logo */
/*
.bg-logo {
    position: relative;
    background-image: url('../../img/postres.jpg');
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    height: 100vh;
    color: black;
    z-index: 1;
}
.bg-logo::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-image: linear-gradient(to right, rgba(255,255,255,0.2), rgba(255,255,255,0.8));
    height: 100%;
    width: 100%;
    z-index: -1;
}
*/

/** picture card */
div.box {
    width: 100%;
    height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
  }

  div.box::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(to right, rgba(255,0,0,0.5), rgba(0,0,255,0.5));
  }

  div.box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  div.box p {

    color: white;
    font-size: 24px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-weight: 600;
    text-wrap: nowrap;
  }