:root {
    --main-color: #76C45F;
}
@font-face {
	font-family: 'Roboto'; 
	src: url('fonts/Roboto-Regular.ttf') format('truetype'); 
}
@font-face {
	font-family: 'Roboto-Medium'; 
	src: url('fonts/Roboto-Medium') format('truetype'); 
    font-weight: 600;
}
@font-face {
	font-family: 'Poppins'; 
	src: url('fonts/Poppins-Medium.ttf') format('truetype'); 
}
.full button span {
	background-color: limegreen;
	border-radius: 32px;
	color: black;
}
.partially button span {
	background-color: orange;
	border-radius: 32px;
	color: black;
}
#toast-container > .toast-error
{
	background-image: none !important;
}

.version
{	
	color: #A4A4A4; 
	text-align: right; 
	/*top: 6.5em;*/
	font-size: 10px;
}

.version.left {
	left: 17em;
}

.version.right
{
	right: 4em; 
	margin:0px !important;
}

.version.center
{
	position: relative;
	text-align: center; 
	top: 0;
}

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

h5 
{
    color: #939176;
}

label, span
{    
    color:#939176;
    font-size:0.8em;
}
label.options {
	color: var(--main-color);
	margin:15px;
	font-size:15px;
}

span.input-group-addon {
	border: 0px !important;
	background-color: #f1f1f1;
}

button > span, .btn-file > span
{
    color: inherit;
    font-size: inherit;
}

span.text-info
{
    color: inherit;
}

.img-details
{
    margin: 0 auto 9px auto;
}

.img-container-list{
    display: flex;
    justify-content: center;
}

.img-container-placeholder {
    background-color: #CFD0D2;
    width: 84px;
    height: 84px;
    border-radius: 9px !important;
}

.img-container-placeholder-modal {
    background-color: #CFD0D2;
    width: 36px;
    height: 36px;
    border-radius: 9px !important;
}

.img-container-placeholder-modal-videos {
    background-color: #CFD0D2;
    width: 60px;
    height: 45px;
    border-radius: 9px !important;
}

.img-container-edit-placeholder {
    background-color: #CFD0D2;
    width: 89%;
    margin: 0 2em;
      
}
.img-video-edit-placeholder{
    background-color: #CFD0D2;
    width: 60%;
    margin: 0 2em;
    margin-left: 122px;
    border-radius:5px;
}

.btn-list-container{
    display: flex;
    justify-content: center;
}

ul
{
    border-color:#e7ecf1;
}

.breadcrumb
{
	background-color: transparent;
	padding: 0px;
	margin: 0px;
    font-size:0.9em;

}
.active-main-tittle{
    
    color:#222222;
    font-weight: 600;
    font-size:36px;
    margin-left: 125px;
    letter-spacing: 1.08px;


}
.breadcrumb > li.active
{
    color:#222222;
    font-family: Roboto;
    font-weight: 500;
    font-size:36px;
}



.navbar
{
	border-radius: 0px;
   
    background-color: transparent;
     border: none;
    /* border-color: #e7e7e7; */

/*	mn-height: 0px;*/
}
.navbar > .container-fluid
{
	background-color:transparent;
   
}
.navbar > .container-fluid > .breadcrumb
{
	background-color: #F3F3F3;
	margin: 0px;
	padding-top: 5px;
	padding-bottom: 0px;
    border: none;
    font-size:0.9em;
}

.navbar > .container-fluid > div, .navbar > .container-fluid > form
{
	padding: 8px;
    padding-top: 20px;
}
.navbar > .container-fluid > .row
{
	padding: 0px;
	display: flex;
	align-items: center;
}

.btn .caret
{
	margin-left: 2px;
}

.btn-default
{
	background-color:#c8c6c6;
    border-color:#c8c6c6;
}
.btn-default:hover
{
	background-color:#b8b4b4;
    border-color:#b8b4b4;
}
.btn-danger {
	background-color: #b8b4b4;
	border-color: var(--danger-color);
}
.btn-danger:hover
{
	background-color:#e31d2d;
    border-color:#e31d2d;
}
.btn-info
{
	background-color:#bfbb82;
    border-color:#bfbb82;
}
.btn-info:hover
{
	background-color:#a5a055;
    border-color:#a5a055;
}
.btn-info.focus, .btn-info:focus
{
	background-color:#a5a055;
    border-color:#a5a055;
}
.btn-info.active, .btn-info:active, .btn-info:hover, .open > .btn-info.dropdown-toggle
{
	background-color:#a5a055;
    border-color:#a5a055;
}
.btn-info.active.focus, .btn-info.active:focus, .btn-info.active:hover, .btn-info.focus:active, .btn-info:focus:active, 
.btn-info:hover:active, .open > .btn-info.dropdown-toggle.focus, .open > .btn-info.dropdown-toggle:focus, 
.open > .btn-info.dropdown-toggle:hover
{
	background-color:#a5a055;
    border-color:#a5a055;
}
.btn-success
{
	background-color:#c8c6c6;
    border-color:#c8c6c6;
}
.btn-success:hover
{
	background-color:#b8b4b4;
    border-color:#b8b4b4;
}

.btn-login
{
	background-color:#bfbb82;
    color:white;
}
.btn-login:hover
{
	background-color:#a5a055;
    color:white;
}

.btn-principal {
  
   background-color:#bfbb82;
    color:white; 
}
.btn-principal:hover, .btn-principal:active, .btn-principal:focus, 
.open > .btn-principal.dropdown-toggle {    
    background-color:#a5a055;
    color:white;
}

.btn-group > .btn
{
    margin-left: 5px;
    margin-right: 5px;
}
.btn-group > .btn.dropdown-toggle
{
    margin-left: 0px;
    margin-right: 0px;
}

.input-group-btn > .btn-file + .btn
{
    margin-left: 10px;
}

.btn-stadistics
{
    border-color: #dcdab8;
    background-color: #ceca9a;
    color: white;
}

.btn-stadistics:hover
{
    background-color:#bfbb82;
    color:white;
    border:solid 1px #bfbb82;
}

.btn-errors {
	background-color:#bb4646;
    border: solid 5px #bb4646;
    color:white;
}

.btn-errors:hover {
	background-color: #a42929;
    border: solid 5px #a42929;
    color: white !important;
}

.center-buttons {
    display: flex;
    justify-content: center;
}

.panel-body
{
	background-color:#ebe9c6;
    border:0px !important;
}

.form-control
{
    border:0px;
    background-color:#f1f1f1;
}

.input
{
    border: 1px solid #e7ecf1 !important;
    background: #fff;
}

img.img-border
{
	border-style: dotted;
	border-width: 2px;
}

.img-container{
    display: flex;
}

.list-group {
	border-radius: 10px !important;
	box-shadow: 2px 2px 10px rgba(0,0,0,0.16);
	padding-left: 0;
	padding-right: 0;
}

.list-group-item {
	background-color: white;
	border-width: 2px;
    border-top: none;
	border-left: none;
	border-right: none;
    border-bottom-color: #F3F3F3;
    padding-left: 0;
    padding-right: 0;
  
}

.list-group-item .row {
	cursor: pointer;
}

.item-modal-assign-products{
    padding: 5px 0;
}

.video-list {
	background-color: white;
	border-width: 2px;
    border-top: none;
	border-left: none;
	border-right: none;
    border-bottom-color: #F3F3F3;
    padding-left: 0;
    padding-right: 0;
    height: 120px;
}
.video-image-size{

    width: 300px;
    height: 250px;
}

.list-group-edit-page {
    display: flex;
    align-items: center;
}

.list-group-item:hover {
	background-color: #F3F3F3;
}

.list-group-item:first-child {
    border-top-right-radius: 10px !important;
    border-top-left-radius: 10px !important;
}

.list-group-item:last-child {
    border-bottom-right-radius: 10px !important;
    border-bottom-left-radius: 10px !important;
	border-bottom-color: transparent;
}

.list-group-item > .row,
.list-group-item .row {
	display: flex;
	align-items: center;
    justify-content: initial;
}

.list-group-item .form-control {
    background-color: white;
}

.list-group-item.userProduct h4
{
    font-size: 15px;
    color: #939176;
}

.list-group-item-heading{
    color: #222222;
    margin-top: 10px;
	font-size: 18px;
}

.list-group-item-heading-modal{
    color: #222222;
    margin-top: 10px;
	font-size: 15px;
}
.img-video-container{
        margin-left: 20px;
}

.list-group-item-text {
	font-size: 14px;
	color: #989898;
}

.magazine-edit-header {
	margin-left: 1px;
	margin-right: 1px;
}

.img-list-item {
    max-width: 84px;
    max-height: 84px;
    border-radius: 9px !important;
    object-fit: contain;
}

.img-list-item-modal {
    max-width: 36px;
    max-height: 36px;
    border-radius: 9px !important;
    object-fit: contain;
}

.img-list-item-modal-videos {
    max-width: 60px;
    max-height: 45px;
    border-radius: 9px !important;
}

.img-detail {
    padding: 25px 0px;
}

.checkbox
{
    width: 16px;
}

.checkbox-list-item {
    -webkit-appearance: none;
    width: 14px;
    height: 14px;
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 1.5px solid #D3D3D3;
    opacity: 1;
}

.checkbox-list-item:checked {
    -webkit-appearance: none;
    width: 16px;
    height: 16px;
    background: #76C45F 0% 0% no-repeat padding-box;
    border: 1.5px solid #616161;
    opacity: 1;
}

/*#chkDoublePage {
    background: var(--main-color)
}

input[type="checkbox"]:checked +label {
    filter: invert(100%) hue-rotate(18deg) brightness(1.7);
}*/


.row-height
{
	display: table;
	table-layout: fixed;
	width: 100%;
}
.div-main-video-container{

        margin-left: 120px;
}

@media (min-width:992px) {
	.row-height > .col-md-height {
		display: table-cell;
		float: none;
	}
}
@media (min-width:768px) {
	.row-height > .col-sm-height {
		display: table-cell;
		float: none;
	}
}

.sticker-container
{
    position: relative;
    text-align: center;
}

.sticker-text
{
    position: absolute;
    top: 35%;
    left: 29%;
    /*transform: translate(-50%, -50%);*/
    font-family: Bahnschrift;
}

.sticker-page-container
{
    position: relative;
    /*text-align: center;*/
}

.sticker-page-text
{   
    text-align: center;
    position: absolute;
    /*transform: translate(-50%, -50%);*/
    font-family: Bahnschrift;
    top: 30%;
    left: 30px;
    font-size: 11px;
}

.sticker-text-edit
{
    position: absolute;
    top: 30%;
    left: 25%;
    /*transform: translate(-50%, -50%);*/
    font-family: Bahnschrift;
}

/*.sticker-container-edit
{
    position: relative;
    text-align: center;
    margin-left: auto;
    margin-top: auto;
    width: 90%;
    height: 90%;
}*/

.sticker-title
{
    font-size: 13px;
    font-weight: 400;
}

.sticker-detail {
    font-size: 13px;
    font-weight: 400;
}

.stickerImg {
    max-width: 22%;
}

.stickerImgSelect {
    max-width: 30px; 
    max-height: 30px; 
}

.stickerSelect_option{
    cursor: pointer;
    display: flex;
    align-items: center;
    margin: 10px 0px;
}

.sticker-selection {
    max-height: 23em;
    /*height: 270px;
    width: 180px;
    margin-top: 10px;*/
    overflow: auto;
    /*min-width: 160px;
    margin: 9px 0 0;*/
    padding: 5px 0;
    list-style: none;
    border-style: solid;
    border-width: 1px;
}

/*Utilizado en Stickers*/
.sticker-delete {
    width:1.6em;
    height:1.6em;
	padding: 0px;
}

.phone {
    /*width: 70%;
    height: 60%;
    margin-top: 5%;
    margin-left: 25%;*/
	max-width:100%;
	margin:auto;
}

.titlesWithSearchFields > th  input,
.titlesWithSearchFields > th  li {
    color: #989898;
    font-weight: 400;
    /*background-color: #fff !important;*/
}

.dropdown
{
    /*border-right: solid 1px #efefef;*/
}

.dropdown.first
{
    /*border-left: solid 1px #efefef;*/
}

.filter
{
    background-color: #FFFFFF;
}

.filter-container {
    display: flex;
    border: none;
    padding-top: 36px;
    padding-bottom: 20px;
    background-color: white;
    border-top-right-radius: 10px !important;
    border-top-left-radius: 10px !important;
}

.filter-container-modal {
    display: flex;
    border: none;
    padding: 16px 0px;
    background-color: white;
    border-top-right-radius: 10px !important;
    border-top-left-radius: 10px !important;
}

.filter-item {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 1px solid var(--input-border-color) !important;
    border-radius: 5px;
    opacity: 1;
    border: none;
}

.filter-item:focus {
    border: 1px solid var(--input-border-color-focus) !important;
}

.filter-btn {
    padding-left: 15px;
}

.table .input-group-btn .btn
{
	margin-right: 0px;
}

/*.tableContent > td
{
    border: 1px solid #fff !important;
    background-color: #f1f1f1 !important;
}*/

tbody > tr > td
{
    border: 1px solid #fff !important;
    background-color: white;
}

/*tbody > tr > td > .sorting_1
{
    border: 1px solid #fff !important;
    background-color: #f1f1f1 !important;
}*/

tbody > tr.rowClick
{
	cursor: pointer;
}

.table-hover > tbody > tr:hover,
.table-hover > tbody > tr:hover > td {
  background-color: #F3F3F3 !important;
}

thead 
{
    background-color:white;
    color:#333333;
    border:0px !important;
}

thead th
{
    border: 1px solid #fff !important;
}

/*DataTables: Botón Excel en Estadisticas/Información de usuario*/
.dt-buttons 
{
    position: relative !important;
    float: right !important;
    margin-top: 0px !important;
    /*position: absolute !important;    
    float:none !important;*/
}

.dataTables_filter
{
    float: left !important;
}
.change-password .panel-default {
	border-color: transparent;
}
.change-password .panel-body {
	border-radius: 10px !important;
	display: flex !important;
	font-size: 1em !important;
	padding: 20px !important;
}
.change-password .btn{
	margin: 0px;
	/*border-radius: 5px !important;*/
}
.change-password .btn:hover {
	margin: 0px;
	/*background-color: #ff0000;*/
}
.stadistics>.panel>.panel-heading
{
    background: #ebe9c6;
    color: #333333;
    border-color: white;
}

.stadistics>.panel>.panel-body
{
    background-color: #f1f1f1 !important;
    border-color: white !important;
}

.stadistics > .panel-default {
	border-color: white;
}

.stackedChart, .barChart
{
    min-height: 180px;
}

.pieChart
{
    min-height: 300px;
}

.userTrend
{
    text-align:right;
}

.dataTables_filter > label > .input-sm
{
    margin-left: 0px !important;
    /*background-color: white !important;*/
}

.dataTables_paginate
{
    float: left !important;
}

.publications span
{
    font-size:0.7em;
}

.pages a
{
    color: #777;
}

.userTrendList
{
    background-color: #fcfcfc;
    border-color: #f1f1f1;
}

.mainPanel
{
    background-color: #e6e4d0 !important;
    border-color: #e4e2cd !important;
    margin-bottom:2px !important;
    cursor:pointer !important;
}

.mainPanel i
{
    color:#7b7b79; 
    font-size:1em;
}

.mainPanel h4
{
    color: #595959; 
    font-family: sans-serif;
}

.clientParam input
{
    border: 1px solid #c2cad8 !important;
    background-color:white;
}

.clientParam .panel-default
{
    border: none;
}

.clientParam .panel-body 
{       
    border-color: #ddd !important;
    font-size: 1em !important;
    background-color: #f5f5f5;
    padding: 10px 15px !important;
    border-bottom: 1px solid #dedbdb !important;
}

.clientParam .checkbox
{
    width:20px;
    height:20px;
    margin-top:10px; 
    margin-bottom:10px;
}

.clientParam select
{
    background-color:white; 
    border: 1px solid #c2cad8 !important;
}

.imgClientParam > h4 
{
    margin-top: 0px;
    margin-bottom: 0px;
}

.imgClientParam > span {
    font-size: 0.7em;
    color: #b3b3b3;
}

.paramConfig
{
    display: flex; 
    align-items: center; 
    margin-bottom: 5px;
}

.paramConfig h4
{
    font-size: 0.8em;
    color: #7c7a7a;
}

.modal-terms .modal-dialog
{
	width: 80%;
}

.magazine-title {
    font-weight: 600;
    font-size: 36px;
    letter-spacing: 1.08px
}

.magazine-title > a, .magazine-title > a :hover {
    color: #333;
}

.magazine-description {
    font-size: 14px;
    letter-spacing: 0.42px;
    font-family: 'Roboto';
}

.magazine-description > a:hover {
  color: #989898;
}

.magazine-aligment-buttons {
    display: flex;
    justify-content: space-evenly;
}

.magazine-side-padding {
    padding-left: 35px  !important;
    padding-top:27px !important;
    padding-bottom:27px !important;
}

.magazine-form-group{
    margin-bottom: 30px; 
}

.magazine-divider{
    margin-left: 15px !important;
    width: 94%;
    padding-top:5px;
}

.magazine-vertical-center-element{
    margin-bottom: 0;
    margin-top:5px;
}

.magazine-text-form {
    color:#222222;
    font-size: 14px;
} 

.magazine-text-form-2 {
    color:#222222;
    font-size: 18px;
} 
.magazine-separator {
    margin-top:60px; 
}

.magazine-image-size {
    width: 100%;
    height: 465px;
	object-fit: contain;
}

.magazine-video-image-size {
	width: 100%;
	height: 365px;
	object-fit: contain;
}

.magazine-vertical-align{
    vertical-align: middle
}

.magazine-image-list {
    width: 84px;
    height: 84px;
    border-radius: 9px !important;
    object-fit: contain;
}

.magazine-delete-padding {
    padding-right: 0px;
}

.page-bar > .action-buttons > div{
    margin-left: 15px;
}


.magazine-calendar-drop-button > .btn{
    border-top-right-radius: 10px!important;
    border-bottom-right-radius: 10px!important;
    border-top-left-radius: 0px !important;
    border-bottom-left-radius: 0px !important;
    
    padding-left: 10px!important;
    padding-right: 10px!important;

}


.magazine-calendar-drop-icon {
    font-size: 15px;
}

.uib-daypicker th{padding:5px 0;}
/* .uib-datepicker{
  padding:0 9px 9px;
} */
  .uib-daypicker, .uib-monthpicker, .uib-yearpicker{
      outline:none;
  }
button.btn.btn-default.btn-sm.active {
	background-color: white;
}
button.btn.btn-default.btn-sm.active:hover {
	background-color: #f6f6f6;
}
button.btn.btn-default.btn-sm {
	border-radius: 2px !important;
	color: #434A54;
	outline: none;
	box-shadow: none;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-left: 0px !important;
	width: 30px;
	padding: 2px;
	border: none;
}

button.btn.btn-default:hover{
  
  outline:none;
  box-shadow:none;
  background-color:#f6f6f6;
}

button.btn.btn-default:focus {
    background-color: white;
    opacity: 1;
}

 .uib-month button.btn.btn-default{
    border-radius: 50%;
    border: none;
    height:53px;
    border: none;
    font-size: 14px;
    color: #434A54;
    outline:none;
   box-shadow:none;
    
} .uib-year button.btn.btn-default{
    border-radius: 50%;
    border: none;
  
    width: 53px;
    height:53px;
    border: none;
    font-size: 14px;
    color: #434A54;
    outline:none;
  box-shadow:none;
    
}
.uib-day, .uib-month, .uib-year{
  /*padding:2px;*/
}
.uib-datepicker .uib-title {
    width: 100% !IMPORTANT;
}
.uib-monthpicker .uib-title {
    width: 100% !IMPORTANT;
}
.uib-daypicker tr:first-child th{
   border-bottom: 1px solid #EAEAEA !important;
      padding-bottom: 0;
  padding-top:0;
}

.uib-monthpicker th{
      border-bottom: 1px solid #EAEAEA !important;
}
.uib-yearpicker th{
      border-bottom: 1px solid #EAEAEA !important;
}

.well{
box-shadow:none;
background-color:transparent;padding: 0 9px 10px;}
/* th {
    text-align: left;
    padding:5px 0;
    font-size: 12px;
    text-align: center;
    color: #aaa;
} */
.uib-left, .uib-title, .uib-right{
    width:auto !important;
    outline:none;
    color:#000000 !Important;
    border-radius:0 !important;
}
.uib-left, .uib-right{
  font-size:16px !important
}
.uib-left:hover, .uib-title:hover, .uib-right:hover,.uib-left:focus, .uib-title:focus, .uib-right:focus{
      background-color: transparent !important;
      color:#008CCD !important;
      outline:none;
      box-shadow:none;
}
.uib-left:hover i,.uib-left:focus i,.uib-right:hover i,.uib-right:focus i{
  color:#008CCD;
}
.uib-day .btn-info.active, .uib-day .btn-info:active, .uib-day .open>.dropdown-toggle.btn-info, .uib-day .btn-info, .uib-day .btn-info:focus, .uib-day .btn-info:hover {
    color: #ffffff !important;
    background-color: #008CCD !important;
    outline:none;
    box-shadow:none;

}
.uib-month .btn-info.active, .uib-month .btn-info:active, .uib-month .open>.dropdown-toggle.btn-info, .uib-month .btn-info, .uib-month .btn-info:focus, .uib-month .btn-info:hover {
   
    background-color: transparent !important;
    outline:none;
    box-shadow:none;

}
.uib-year .btn-info.active, .uib-year .btn-info:active, .uib-year .open>.dropdown-toggle.btn-info, .uib-year .btn-info, .uib-year .btn-info:focus, .uib-year .btn-info:hover {
   
    background-color: transparent !important;
    outline:none;
    box-shadow:none;
}
.uib-day .text-info{
     color: #434A54; 
}
.uib-month .text-info{
     color: #434A54; 
}
.uib-year .text-info{
     color: #434A54; 
}
.uib-month .btn-default.btn-info.active,
.uib-month .btn-default.active,
.uib-month .btn-default.active:focus,
.uib-month .btn-default.btn-info.active .text-info{
  outline:none;
     color: #000000; 
     font-weight:bold;
  box-shadow:none;
   background-color:transparent;
}
.uib-year .btn-default.btn-info.active,.uib-year .btn-default.active, .uib-year .btn-default.btn-info.active .text-info{
     color: #000000; 
    outline:none;
    box-shadow:none;
  background-color:transparent;
     font-weight:bold;
}
.uib-day .btn-info.active .text-info, .uib-day .btn-info .text-info, .uib-day .btn-info .text-muted{
  color:#ffffff;
}
.uib-datepicker-popup .uib-button-bar{
    padding: 0px 15px 0px;
}

.uib-button-bar .btn-group {
    padding-bottom: 9px;
}
.uib-datepicker-popup .uib-button-bar .btn-group .uib-datepicker-current,
.uib-datepicker-popup .uib-button-bar .btn-group .uib-clear,
.uib-datepicker-popup .uib-close {
	font-size: 12px;
	padding: 4px;
	border-radius: 3px !important;
	background-color: var(--main-color);
	border: none;
}
.uib-datepicker-current:hover .uib-close:hover, .uib-clear:hover {
	background-color: var(--main-color);
	color: white !important;
	border-width: 2px;
	border: none;
}
.parameter-image-splash {
    width: 270px;
    height: 360px;
    object-fit: contain;
}
.parameter-space-images {
    margin-top: 18px;
}
.imgSocialNetwork {
	width: 25px;
	height: 25px;
	background-color: #2c2c2c;
	border-radius: 4px !important;
	margin:5px;
}
.dragElement:hover{
    cursor: move;
}
.btn-addSocialNetwork {
    margin-top: 3px;
    margin-bottom: 3px;
}
.imgDrag {
    visibility: hidden;
    cursor: move;
}
.dragRow:hover .imgDrag {
    visibility:visible;
}
.lineBottomLink {
    border-width: 1px;
    border-style: solid;
    border-color: #e6e6e6;
    border-top-style: hidden;
    border-left-style: hidden;
    border-right-style: hidden;
}
.text-angular .ta-scroll-window > .ta-bind {
	height: calc(100vh - 400px);
	padding: 6px 12px;
	overflow-y: auto;
}
.text-angular a {
	color: var(--main-color);
}
.text-angular b {
	color: black;
}
.break-word {
    word-break: break-all;
}
@keyframes spinner {
	to {
		transform: rotate(360deg);
	}
}
.spinner {
	content: '';
	box-sizing: border-box;
	position: relative;
	width: 20px;
	height: 20px;
	margin-left: 10px;
	border-radius: 50% !important;
	border: 2px solid #ccc;
	border-top-color: var(--main-color);
	animation: spinner .6s linear infinite;
}

.magazine-loading {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
}

.magazine-import-successfuly {
	color: green;
}

.magazine-import-error {
	color: red;
}
.magazine-upload-btn {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
}

.magazine-upload-btn .btn {
	margin-top: 20px;
	margin-left: 0px;
}

input {
    accent-color: var(--main-color);
}

/* Estilo para mantener el tamaño del modal de recortar imagenes (stickers, templates y promociones) */
@media (min-width: 576px) {
    #imageSelect .modal-dialog {
        transform: translateY(-30%) scale(0.40);
    }
}

@media (min-width: 768px) {
    #imageSelect .modal-dialog {
        transform: translateY(-25%) scale(0.50);
    }
}

@media (min-width: 892px) {
    #imageSelect .modal-dialog {
        transform: translateY(-19%) scale(0.60);
    }
}

@media (min-width: 992px) {
    #imageSelect .modal-dialog {
        transform: translateY(-14%) scale(0.70);
    }
}

@media (min-width: 1190px) {
    #imageSelect .modal-dialog {
        transform: translateY(-8%) scale(0.75);
    }
}

@media (min-width: 1200px) {
    #imageSelect .modal-dialog {
        transform: translateY(-4%) scale(0.85); /* Ajusta el modal a un 85% del tamaño original */
    }
}

@media (min-width: 1300px) {
    #imageSelect .modal-dialog {
        transform: scale(1); /* Modal en su tamaño original */
    }
}