
.szopki_cat{
	display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.full-width{
    width: 100%;
}
.half-width{
    width: 50%;
}
.three-width{
    width: 33%;
}
.twothree-width{
    width: 66%;
}
.catform-role{
    width: 100%;
    font-weight: 700;
}
.szopki-button{
    cursor: pointer;
    display: inline-flex;
    border: 2px solid #282828;
    align-items: center;
    justify-content: center;
    min-height: 1.5rem;
    min-width: 6.04545rem;
    padding: .27273rem .90909rem;
    margin: 20px;
}
.szopki-button-yellow{
    background: transparent;
    background-image: linear-gradient(270deg, transparent 50%, #ffc14f 0);
    background-position: 100% 0;
    background-size: 200% 100%;
    transition: all .4s cubic-bezier(.12,.87,1,1);
}
.szopki-button-yellow:hover {
    background-position: 0 100%;
}


/* Customize the label (the container) */
.container {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default radio button */
.container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom radio button */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
  border-radius: 50%;
}
.checkmarkbox {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
}

/* On mouse-over, add a grey background color */
.container:hover input ~ .checkmark,.container:hover input ~ .checkmarkbox {
  background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.container input:checked ~ .checkmark,.container input:checked ~ .checkmarkbox {
  background-color: #111;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after,.checkmarkbox:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.container input:checked ~ .checkmark:after,.container input:checked ~ .checkmarkbox:after {
  display: block;
}

/* Style the indicator (dot/circle) */
.container .checkmark:after {
  top: 3px;
    left: 3px;
    width: 19px;
    height: 19px;
  border-radius: 50%;
  background: #ffc14f;
}
.container .checkmarkbox:after {
  top: 3px;
    left: 3px;
    width: 19px;
    height: 19px;
  background: #ffc14f;
}
.szopki-cat-box{
    margin-top: 20px;
    margin-bottom: 20px;
    background: #7cab7d;
    display: flex;
    flex-wrap: wrap;
    grid-gap: .81818rem;
    grid-template-columns: calc(30% - .54545rem) calc(50% - .54545rem) calc(20% - .54545rem);
    padding: 1.18182rem 1.40909rem;
    grid-template-areas:
        "calendar-list-date calendar-list-name calendar-list-name"
        "calendar-list-place calendar-list-place calendar-list-go";
    align-items: center;
    border-bottom: 1px solid rgba(40, 40, 40, .5);
}
.szopki-cat-name{
    font-size: 1.4rem;
}
.szopki-cat-header, .szopki-cat-desc{
    width: 100%;
}
.message{
    display: none;
    margin: 1rem;
    padding: 1rem;
    width: 100%;
    max-width: 20rem;
    margin-bottom: 1.77778rem;
    position: relative;
    overflow: hidden;
}
.message-error{
    background: #f66e44;
}
.message-succes{
    background: #99c1b1;
}
.input-error{
    border: 4px solid #f66e44 !important;
}
.szopki-agree{
    display: flex;
}
.szopki-agree-link,.szopki-agree label{
    margin: 20px;
}
.zgloszenia-list{
    display: flex;
    flex-wrap: wrap;

}
.zgloszenia-list-item{
    width: 100%;
    margin-top: 10px;
    background: #99c1b1;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 1.18182rem 1.40909rem;
}
.zgloszenia-list-more{
    width: 100%;
    margin-bottom: 5px;
    background: #fffaf2;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 1.18182rem 1.40909rem;
}

.zgloszenia-list-more{
    display: none;
}
#szopkiExcelOptions{
    display: none;
    position: absolute;
    background: #fff;
    padding: 5px;
    border: 1px solid #aaa;
    z-index: 2;
}

.slidecontainer {
  width: 100%;
}

.slider {
  -webkit-appearance: none;
  width: 100%;
  height: 25px;
  background: #ebebeb;
  outline: none;
  opacity: 0.7;
  -webkit-transition: .2s;
  transition: opacity .2s;
}

.slider:hover {
  opacity: 1;
}

.slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 25px;
  height: 25px;
  background: #ffc14f;
  cursor: pointer;
}

.slider::-moz-range-thumb {
  width: 25px;
  height: 25px;
  background: #ffc14f;
  cursor: pointer;
}

.form-control {
    width: 100%;
    height: 34px;
    padding: 2px 2px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fffaf2;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}
.form-control-area{
    width: 100%;
    height: 144px;
    padding: 2px 2px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fffaf2;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}
.form-group{
    padding: 10px;
}
label {
    display: inline-block;
    max-width: 100%;
    margin-bottom: 5px;
    font-weight: 700;
}
.szopki-showpass{
    display: block;
    margin-top: -31px;
    margin-right: 0;
    text-align: right;
    cursor: pointer;
}
.table {
    width: 100%;
    max-width: 100%;
    margin-bottom: 20px;
}
table {
    border-spacing: 0;
    border-collapse: collapse;
}
td, th {
    padding: 0;
}
fieldset{
    border: none;
    padding: 0;
    margin: 0;
}
button, input, optgroup, select, textarea {
    margin: 0;
    font: inherit;
    color: inherit;
}
.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th {
    padding: 8px;
    line-height: 1.42857143;
    vertical-align: top;
/*    border-top: 1px solid #ddd;*/
}
.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-sz-1, .col-sz-10, .col-sz-11, .col-sz-12, .col-sz-2, .col-sz-3, .col-sz-4, .col-sz-5, .col-sz-6, .col-sz-7, .col-sz-8, .col-sz-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
    position: relative;
    min-height: 1px;
}
@media (min-width: 992px) {
    .col-sz-2 {
        width: 12%;
    }
    .col-sz-3 {
        width: 25%;
    }
    .col-sz-4 {
        width: 33%;
    }
    .col-sz-6 {
        width: 50%;
    }
    .col-sz-8 {
        width: 66%;
    }
    .col-sz-10 {
        width: 87%;
    }
    .col-sz-12 {
        width: 100%;
    }
}
@media (min-width: 992px) {
    .col-sz-1, .col-sz-10, .col-sz-11, .col-sz-12, .col-sz-2, .col-sz-3, .col-sz-4, .col-sz-5, .col-sz-6, .col-sz-7, .col-sz-8, .col-sz-9 {
        float: left;
    }
}
.btn-danger {
    color: #fff;
    background-color: #d9534f;
    border-color: #d43f3a;
}
.btn-danger:hover {
    color: #fff;
    background-color: #c9302c;
    border-color: #ac2925;
}
.btn-warning {
    color: #fff;
    background-color: #f0ad4e;
    border-color: #eea236;
}
.btn-warning:hover {
    color: #fff;
    background-color: #ec971f;
    border-color: #d58512;
}
.btn-success {
    color: #fff;
    background-color: #5cb85c;
    border-color: #4cae4c;
}
.btn-success:hover {
    color: #fff;
    background-color: #449d44;
    border-color: #398439;
}
.btn-primary {
    color: #fff;
    background-color: #337ab7;
    border-color: #2e6da4;
}
.btn-primary:hover{
    color: #fff;
    background-color: #286090;
    border-color: #204d74;
}
.btn {
    display: inline-block;
    padding: 6px 12px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
}
.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
    background-color: #eee;
    opacity: 1;
    cursor: not-allowed;
}