.matrix-textarea{
    min-width: 100%;
    max-width: 100%;
    min-height: 50px;
    height: 75px;
    padding: 5px;
}



/*-------------------- Matrix-Box Class -----------------*/

/*create new box*/
.box.box-matrix-purple{
    border-top-color: #914ec3;
}

.box.box-matrix-default-drag{
    border-top-color: #9c5e5e;
}

.box.box-matrix-teal{
    border-top-color: teal;
}

/*-------------------- Matrix-Box Class -----------------*/



/*-------------------- Matrix-button like matrix-box color -----------------*/

/*create new buttons*/
.btn-matrix-purple {
    color: #fff;
    background-color: #914ec3;
    border-color: #914ec3;
}

.btn-matrix-purple:hover,
.btn-matrix-purple:focus,
.btn-matrix-purple:active,
.btn-matrix-purple.active,
.open>.dropdown-toggle.btn-matrix-purple {
    color: #fff;
    background-color: #7434C3;
    border-color: #7434C3; /*set the color you want here*/
}

.btn-matrix-default-drag {
    color: #fff;
    background-color: #9c5e5e;
    border-color: #9c5e5e;
}

.btn-matrix-default-drag:hover,
.btn-matrix-default-drag:focus,
.btn-matrix-default-drag:active,
.btn-matrix-default-drag.active,
.open>.dropdown-toggle.btn-matrix-default-drag {
    color: #fff;
    background-color: #9c4b61;
    border-color: #9c4b61; /*set the color you want here*/
}

.btn-matrix-teal {
    color: #fff;
    background-color: teal;
    border-color: teal;
}

.btn-matrix-teal:hover,
.btn-matrix-teal:focus,
.btn-matrix-teal:active,
.btn-matrix-teal.active,
.open>.dropdown-toggle.btn-matrix-teal {
    color: #fff;
    background-color: #0D6680;
    border-color: #0D6680; /*set the color you want here*/
}

.btn-matrix-grey {
    color: #fff;
    background-color: #888888;
    border-color: #888888;
}

.btn-matrix-grey:hover,
.btn-matrix-grey:focus,
.btn-matrix-grey:active,
.btn-matrix-grey.active,
.open>.dropdown-toggle.btn-matrix-grey {
    color: #fff;
    background-color: #575757;
    border-color: #575757; /*set the color you want here*/
}

/*-------------------- Matrix-button like matrix-box color -----------------*/



/*-------------------- Matrix-Radio-Button -----------------*/

/* The label class */
.matrix-label-radio {
    display: block;
    position: relative;
    cursor: pointer;
    font-size: 22px;
}

/* Hide the browser's default radio button */
.matrix-label-radio input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

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

/* On mouse-over, add a grey background color */
.matrix-label-radio:hover input ~ .matrix-span-radio {
    background-color: #A4A4C5;
}

/* When the radio button is checked, add a blue background */
.matrix-label-radio input:checked ~ .matrix-span-radio {
    background-color: #1F5EF3;
    /* background-color: #2196F3; */
}

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

/* Show the indicator (dot/circle) when checked */
.matrix-label-radio input:checked ~ .matrix-span-radio:after {
    display: block;
}

/* Style the indicator (dot/circle) */
.matrix-label-radio .matrix-span-radio:after {
    top: 9px;
    left: 9px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: white;
}

/*-------------------- Matrix-Radio-Button -----------------*/



/*-------------------- Matrix-Checkbox-Button -----------------*/

.matrix-checkbox input[type="checkbox"] {
    opacity: 0;
}

.matrix-checkbox label {
    position: relative;
    display: inline-block;
    cursor: pointer;
    margin-bottom: 16px;
    /*16px width of fake checkbox + 6px distance between fake checkbox and text*/
    padding-left: 22px;
}

.matrix-checkbox label::before,
.matrix-checkbox label::after {
    position: absolute;
    content: "";
    /*Needed for the line-height to take effect*/
    display: inline-block;
}

/*Outer box of the fake checkbox*/
.matrix-checkbox label::before{
    height: 20px;
    width: 20px;

    border: 2px solid darkgray;
    left: 0px;

    /*(24px line-height - 16px height of fake checkbox) / 2 - 1px for the border
     *to vertically center it.
     */
    /*top: 3px;*/
}

/*Checkmark of the fake checkbox*/
.matrix-checkbox label::after {
    height: 10px;
    width: 18px;
    border-left: 5px solid rebeccapurple;
    border-bottom: 5px solid rebeccapurple;
    transform: rotate(-45deg);
    left: 4px;
    top: 2px;
}

/*Hide the checkmark by default*/
.matrix-checkbox input[type="checkbox"] + label::after {
    content: none;
}

/*Unhide on the checked state*/
.matrix-checkbox input[type="checkbox"]:checked + label::after {
    content: "";
}

/*Adding focus styles on the outer-box of the fake checkbox*/
.matrix-checkbox input[type="checkbox"]:focus + label::before {
    outline: rgb(59, 153, 252) auto 10px;
}

/*-------------------- Matrix-Checkbox-Button -----------------*/



/*-------------------- Aktif/Pasif Switch -----------------*/
.onoffswitch1 {
    position: relative; width: 90px;
    -webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;
}

.onoffswitch1-checkbox {
    display: none;
}

.onoffswitch1-label {
    display: block; overflow: hidden; cursor: pointer;
    border: 2px solid #999999; border-radius: 30px;
}

.onoffswitch1-inner {
    display: block; width: 200%; margin-left: -100%;
    -moz-transition: margin 0.3s ease-in 0s; -webkit-transition: margin 0.3s ease-in 0s;
    -o-transition: margin 0.3s ease-in 0s; transition: margin 0.3s ease-in 0s;
}

.onoffswitch1-inner:before, .onoffswitch1-inner:after {
    display: block; float: left; width: 50%; height: 30px; padding: 0; line-height: 30px;
    font-size: 14px; color: white; font-family: Trebuchet, Arial, sans-serif; font-weight: bold;
    -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
    border-radius: 30px;
    box-shadow: 0px 15px 0px rgba(0,0,0,0.08) inset;
}

.onoffswitch1-inner:before {
    content: "AKTİF";
    padding-left: 10px;
    background-color: #48d401; color: #FFFFFF;
    border-radius: 30px 0 0 30px;
}

.onoffswitch1-inner:after {
    content: "PASİF";
    padding-right: 10px;
    background-color: #EEEEEE; color: #999999;
    text-align: right;
    border-radius: 0 30px 30px 0;
}

.onoffswitch1-switch {
    display: block; width: 30px; margin: 0px;
    background: #FFFFFF;
    border: 2px solid #999999; border-radius: 30px;
    position: absolute; top: 0; bottom: 0; right: 56px;
    -moz-transition: all 0.3s ease-in 0s; -webkit-transition: all 0.3s ease-in 0s;
    -o-transition: all 0.3s ease-in 0s; transition: all 0.3s ease-in 0s;
    background-image: -moz-linear-gradient(center top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 80%);
    background-image: -webkit-linear-gradient(center top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 80%);
    background-image: -o-linear-gradient(center top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 80%);
    background-image: linear-gradient(center top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 80%);
    box-shadow: 0 1px 1px white inset;
}

.onoffswitch1-checkbox:checked + .onoffswitch1-label .onoffswitch1-inner {
    margin-left: 0;
}

.onoffswitch1-checkbox:checked + .onoffswitch1-label .onoffswitch1-switch {
    right: 0px;
}
/*-------------------- Aktif/Pasif Switch -----------------*/



/*-------------------- Matrix-Notices Class -----------------*/
.matrix-notices {
    padding: 1px 1px 1px 30px;
    margin: 15px 0;
}

.matrix-notices p{
    margin: 1.7rem 0;
}

.matrix-notices.blue {
    border-left: 10px solid #5bc0de;
    background: #f4f8fa;
    color: #28a1c5;
}

.matrix-notices.red {
    border-left: 10px solid #d9534f;
    background: #fdf7f7;
    color: #b52b27;
}

.matrix-notices.yellow {
    border-left: 10px solid #f0ad4e;
    background: #fcf8f2;
    color: #df8a13;
}
.matrix-notices.green {
    border-left: 10px solid #009831;
    background: #d4edda ;
    color: #155724 ;
}

/*-------------------- Matrix-Notices Class-----------------*/

.matrix-btn-circle {
    width: 40px;
    height: 40px;
    padding: 9px 0;
    font-size: 15px;
    line-height: 1.33;
    border-radius: 20px;
    box-shadow: none;
    border: 1px solid transparent;
}

@-webkit-keyframes blinker {
    /*from {opacity: 1.0;}
    to {opacity: 0.0;}*/
    50% { opacity: 0; }
}
.blink{
    animation: blinker 0.9s linear infinite;
    font-weight: bold;

   /* font-family: sans-serif;
   text-decoration: blink;
    -webkit-animation-name: blinker;
    -webkit-animation-duration: 0.6s;
    -webkit-animation-iteration-count:infinite;
    -webkit-animation-timing-function:ease-in-out;
    -webkit-animation-direction: alternate;*/
}