* {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    box-sizing: border-box;
  }

.text-left { text-align: left; }
.text-right { text-align: right; }
.text-center { text-align: center; }
.text-bold { font-family: textMedium; }
.ucopyright { font-size: 12px; text-align: center; color: #999; }
.to-left { float: left; }
.to-right { float: right; }
.to-center { margin: 0 auto; }
.floatNone {float: none !important; }
.dspNone { display: none !important; }
.captcha-area img { max-width: 100%; }
.uovh { overflow: hidden; }
.nopadding { padding: 0 !important; }

h1.uform-title { font-family: textMedium; font-weight: normal; font-size: 20px; background-color: #129954; color: #fff; margin: 0; padding: 15px 20px; }
h1.uform-title.popup { position: fixed; width: 100%; }

.uform-info { font-size: 12px; line-height: 18px; color: #242424; }
/* FORM ELEMENTS */
input, 
    select, 
        textarea { 
            border: #d4d4d4 1.25px solid; 
            border-radius: 3px; 
            padding: 12px; 
            font-family: textNormal; 
            font-size: 13px; 
        }

select {
    padding: 11px 12px 12px 12px;
}

input:focus, 
    select:focus, 
        textarea:focus { 
            border: #4c9afd 1.25px solid; 
            outline: #4c9afd 1.25px solid; 
        }

input:disabled,
    textarea:disabled,
        select:disabled {
        border: #f2f2f2 1.25px solid; 
        outline: #f2f2f2 1.25px solid; 
        background-color: #f2f2f2;
        color: #999;
    }


input[type="file"] { 
    padding: 9px; 
}

div.el.error input, 
    div.el.error select, 
        div.el.error textarea { 
        border: #cc0001 1.25px solid; 
    }

div.el.error input:focus, 
    div.el.error select:focus, 
        div.el.error textarea:focus { 
            border: #cc0001 1.25px solid; 
            outline: #cc0001 1.25px solid; 
        }

div.el span.error-msg { 
    color: #cc0001; 
    display: block; 
    line-height: 18px;
    padding-top: 6px;
    font-size: 11.5px;
    font-family: textMedium;
    display: none;
}

div.el.error span.error-msg { 
    display: block;
}

/*  ---
    form layouts
    ---
*/
.ufields {
    /* margin-bottom: 20px; */
    overflow: hidden;
    padding: 0 5px;
}

.uform-header {
    padding: 20px;
    background-color: #006b2b;
    color: #fff;
}

.uform-header h3 {
    font-family: textMedium;
    margin: 0; 
    padding: 0;
    font-size: 16px;
    font-weight: normal;
}

.uform-body {
    padding: 20px;
}

.uform-body.fixed-panels {
    padding-top: 60px;
    padding-bottom: 70px; 
}

.uform-body h3 {
    color: #009900;
    font-family: textMedium;
    font-size: 18px;
    border-bottom: #e8e8e8 1px solid;
    padding-bottom: 10px;
}

.urow-header {
    position: relative;
    padding: 10px 10px 10px 0;
}

.urow-header label {
    display: inline-block;
    background-color: #fff; /* form farklı bir renkse burayi degistirin */
    padding: 5px 10px 5px 0;
    position: relative;
    z-index: 2;
    font-family: textMedium;
    color: #009900;
    font-size: 15px;
    line-height: 22px;
}

.urow-header hr {
    height: 1.5px;
    position: absolute;
    width: 100%;
    top: 17px;
    border: 0;
    left: 0;
    border-top: #009900 1px solid;
    height: 0;
}

.urow {
    overflow: hidden;
}

.ufield {
    margin-bottom: 15px;
    display: flow-root;
    padding: 0 5px;
}

.ufield.hovered { padding: 10px 15px; margin: 0; }
.ufield.hovered:hover { background-color: #f5f5f5; }

.ufield label { 
    float: left; 
    color: #242424; 
    font-size: 13px; 
    line-height: 44px; 
    font-family: textMedium; 
}

.ufield.vertical label { 
    display: block; 
    padding-left: 5px;
    line-height: 30px; 
    float: none; 
    font-size: 13px; 
    font-family: textMedium; 
}

.ufield div.el input, 
    .ufield div.el select, 
        .ufield div.el textarea { 
            width: 100%; 
        }

.ufield div.el.checkbox { 
    float: left; 
    padding: 11px 8px 0 0; 
}

.ufield div.el .field-validation-error { 
    border-color: #cc0001; 
}

.ufield p { 
    font-size: 15px; 
    margin: 0; 
    padding: 0; 
}

.uinfo-panel {
    margin-bottom: 30px;
    padding: 22px 20px 20px 52px;
    background-color: #f5f5f5;
    border-radius: 5px;
    color: #707070;
    line-height: 22px;
    position: relative;
    font-size: 12px;
}

.uinfo-panel i {
    position: absolute;
    left: 20px;
}

span.uradio {
    display: inline-block;
    white-space: nowrap;
    padding: 10px 20px;
    margin-right: 5px;
    background-color: #f2f2f2;
    border-radius: 16px;
    font-size: 12px;
    font-family: textMedium;
    color: #707070;
    cursor: pointer;
}

span.uradio.selected {
    background-color: #006b2b;
    color: #fff;
    cursor: default;
}

span.uradio.fixed-100 {
    text-align: center;
    width: 100px;
}

span.uradio.fixed-150 {
    text-align: center;
    width: 150px;
}

span.uradio.fixed-200 {
    text-align: center;
    width: 200px;
}

span.ucheck {
    cursor: pointer;
    display: block; 
    font-size: 13px;
    line-height: 24px;
    margin-bottom: 5px;
    position: relative;
    padding-left: 32px;
}

span.ucheck.inline {
    display: inline-block;
    margin: 0 10px 0 0;
}

span.ucheck i {
    left: 0;
    color: #707070;
    position: absolute;
}

span.ucheck.checked i{
    color: #009900;
}

.uform-button-set {
    overflow: hidden;
    padding: 0 0 20px 0;
}

.uform-button-set.fixed {
    position: fixed;
    bottom: 0;
    width: 100%;
    padding: 20px;
    background-color: #f5f5f5;
    border-top: #e8e8e8 1px solid;
}

/* button */
.btn { font-family: textNormal; cursor: pointer; padding: 10px 30px; border: transparent 1px solid; outline: none; border-radius: 4px; text-decoration: none !important; }
.btn.large { padding: 12px 30px; }
.btn.radius { border-radius: 22px; }
.btn.green { color: #fff; background-color: #006b2b; }
.btn.green:hover { background-color: #005020; }
.btn.red { background-color: #cc0001; color: #fff; }
.btn.red:hover { background-color: #a70001; }
.btn.tgray { background-color: transparent; color: #242424; }
.btn.tgray:hover { background-color: #f2f2f2; color: #005020; }
.btn.primary { background-color: #64bb34; color: #fff; }
.btn.primary:hover { background-color: #57a22e; }
.btn.action { background-color: #0847a6; color: #fff; }
.btn.action:hover { background-color: #063d8f; }
.btn.yellow { background-color: #e5b112; color: #fff; }
.btn.yellow:hover { background-color: #ba9114; }
.btn.dark-gray { background-color: #666; color: #fff; }
.btn.dark-gray:hover { background-color: #242424; }
button:disabled { background-color: #d4d4d4 !important; color: #999 !important; }
.btn.option { padding: 10px 15px; background-color: #f2f2f2; border: #eaeaea 1px solid; }
.btn.option:hover { border: #d4d4d4 1px solid; }

.btn.light-blue { padding: 10px 15px; background-color: #33b5f7; border: #33b5f7 1px solid; color: #ffffff; }
.btn.light-blue:hover { background-color: #2a9cd4; border: #2a9cd4 1px solid; }

.btn.option.selected { background-color: #0847a6; color: #ffffff; border: #0847a6 1px solid; }



/* 
    ---
    common
    ---
*/

/* statik width classlari herseyi ezer */
.w-30 { width: 30px !important; }
.w-40 { width: 40px !important; }
.w-50 { width: 50px !important; }
.w-60 { width: 60px !important; }
.w-70 { width: 70px !important; }
.w-80 { width: 80px !important; }
.w-90 { width: 90px !important; }
.w-100 { width: 100px !important; }
.w-150 { width: 150px !important; }
.w-200 { width: 200px !important; }
.w-250 { width: 250px !important; }
.w-300 { width: 300px !important; }
.w-350 { width: 350px !important; }
.w-400 { width: 400px !important; }
.w-450 { width: 450px !important; }
.w-500 { width: 500px !important; }

.col-1 { width: 8.33%; float:left; }
.col-2 { width: 16.66%; float:left; }
.col-3 { width: 24.99%; float:left; }
.col-4 { width: 33.32%; float:left; }
.col-5 { width: 41.65%; float:left; }
.col-6 { width: 49.98%; float:left; }
.col-7 { width: 58.31%; float:left; }
.col-8 { width: 66.64%; float:left; }
.col-9 { width: 74.97%; float:left; }
.col-10 { width: 83.3%; float:left; }
.col-11 { width: 91.63%; float:left; }
.col-12 { width: 100%; float:left; }

.p-05 { padding: 5px; }
.pt-05 {padding-top: 5px; }
.pr-05 { padding-right: 5px; }
.pb-05 {padding-bottom: 5px; }
.pl-05 {padding-left: 5px; }
.p-1 { padding: 10px; }
.pt-1 {padding-top: 10px; }
.pr-1 { padding-right: 10px; }
.pb-1 {padding-bottom: 10px; }
.pl-1 {padding-left: 10px; }
.p-2 { padding: 20px; }
.pt-2 {padding-top: 20px; }
.pr-2 { padding-right: 20px; }
.pb-2 {padding-bottom: 20px; }
.pl-2 {padding-left: 20px; }
.p-3 { padding: 30px; }
.pt-3 {padding-top: 30px; }
.pr-3 { padding-right: 30px; }
.pb-3 {padding-bottom: 30px; }
.pl-3 {padding-left: 30px; }
.p-4 { padding: 40px; }
.pt-4 {padding-top: 40px; }
.pr-4 { padding-right: 40px; }
.pb-4 {padding-bottom: 40px; }
.pl-4 {padding-left: 40px; }
.p-5 { padding: 50px; }
.pt-5 {padding-top: 50px; }
.pr-5 { padding-right: 50px; }
.pb-5 {padding-bottom: 50px; }
.pl-5 {padding-left: 50px; }
.pre { padding-right: 5px; } /* sagdaki elemanla arayi ac */
.ple { padding-left: 5px; } /* soldaki elemanla arayi ac */

.m-05 { margin: 5px; }
.mt-05 {margin-top: 5px; }
.mr-05 { margin-right: 5px; }
.mb-05 {margin-bottom: 5px; }
.ml-05 {margin-left: 5px; }
.m-1 { margin: 10px; }
.mt-1 {margin-top: 10px; }
.mr-1 { margin-right: 10px; }
.mb-1 {margin-bottom: 10px; }
.ml-1 {margin-left: 10px; }
.m-2 { margin: 20px; }
.mt-2 {margin-top: 20px; }
.mr-2 { margin-right: 20px; }
.mb-2 {margin-bottom: 20px; }
.ml-2 {margin-left: 20px; }
.m-3 { margin: 30px; }
.mt-3 {margin-top: 30px; }
.mr-3 { margin-right: 30px; }
.mb-3 {margin-bottom: 30px; }
.ml-3 {margin-left: 30px; }
.m-4 { margin: 40px; }
.mt-4 {margin-top: 40px; }
.mr-4 { margin-right: 40px; }
.mb-4 {margin-bottom: 40px; }
.ml-4 {margin-left: 40px; }
.m-5 { margin: 50px; }
.mt-5 {margin-top: 50px; }
.mr-5 { margin-right: 50px; }
.mb-5 {margin-bottom: 50px; }
.ml-5 {margin-left: 50px; }

/* tables */
table { border-collapse: collapse; font-size: 12px; }
table.full-table { width: 100%; }
table.hovered tr:hover { background-color: #f5f5f5; cursor: default; }
th { padding: 12px 10px; color: #242424; font-family: textMedium; text-align: left; border-bottom: #e8e8e8 1px solid; background-color: #f2f2f2; }
th i { position: absolute; right: 10px; top: 13px; font-size: 16px !important; }
tr.header th { cursor: default; background-color: #f2f2f2; position: sticky; top: 0; z-index: 10; box-shadow: 0px 1px 1px -1px #cc0001; }
tr.header th.ordered { cursor: pointer; }
tr.header th.ordered:hover { background-color: #e8e8e8; }
th.seperate { padding-top: 25px; } /* ustten padding vererek kendinden onceki elemandan uzaklasmasi saglanir */
td { padding: 12px 10px; border-bottom: #e8e8e8 1px solid; vertical-align: top;  }
table.hovered tr.no-hover:hover { background-color: transparent; } /* hovered classini ezer */
table tr td.icon-cell { position: relative; padding-left: 40px; }
table tr td.icon-cell i { font-size: 20px; width: 20px; color: #a259a0; position: absolute; left: 12px; top: 8px; }

/* MATERIAL PROGRESS */
.u-progress { top: 0; position: absolute; z-index: 10000; height: 1px; display: block; width: 100%; background-color: #acece6; border-radius: 2px; background-clip: padding-box; overflow: hidden; }
.u-progress .determinate { position: absolute; background-color: inherit; top: 0; bottom: 0; background-color: #26a69a; transition: width .3s linear; }
.u-progress .indeterminate:before { content: ''; position: absolute; background-color: inherit; top: 0; left: 0; bottom: 0; will-change: left, right; -webkit-animation: indeterminate 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite; animation: indeterminate 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;  }
.u-progress .indeterminate:after { content: ''; position: absolute; background-color: inherit; top: 0; left: 0; bottom: 0; will-change: left, right; -webkit-animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite; animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite; -webkit-animation-delay: 1.15s; animation-delay: 1.15s;  }
@-webkit-keyframes indeterminate { 0% { left: -35%; right: 100%; } 60% { left: 100%; right: -90%; } 100% { left: 100%; right: -90%; } }
@keyframes indeterminate { 0% { left: -35%; right: 100%; } 60% { left: 100%; right: -90%; } 100% { left: 100%; right: -90%; } }
@-webkit-keyframes indeterminate-short { 0% { left: -200%; right: 100%; } 60% { left: 107%; right: -8%; } 100% { left: 107%; right: -8%; } }
@keyframes indeterminate-short { 0% { left: -200%; right: 100%; } 60% { left: 107%; right: -8%; } 100% { left: 107%; right: -8%; } }
/* customize progress */
.u-progress.px1 { height: 1px; }
.u-progress.px2 { height: 2px; }
.u-progress.px3 { height: 3px; }
.u-progress.px4 { height: 4px; }
.u-progress.px5 { height: 5px; }

.u-progress .indeterminate { background-color: #26a69a;  }
.u-progress.progress-red { background-color: #cc0001; }
.u-progress.progress-red .indeterminate { background-color: #ffdddd;  }
.u-progress.progress-orange { background-color: #ff5800; }
.u-progress.progress-orange .indeterminate { background-color: #ffd1b8;  }

/* NATIVE SNACK BAR */
/* The snackbar - position it at the bottom and in the middle of the screen */
#u-Snackbar {
    visibility: hidden; /* Hidden by default. Visible on click */
    min-width: 250px; /* Set a default minimum width */
    margin-left: -125px; /* Divide value of min-width by 2 */
    color: #fff; /* White text color */
    text-align: center; /* Centered text */
    padding: 16px; /* Padding */
    position: fixed; /* Sit on top of the screen */
    z-index: 1; /* Add a z-index if needed */
    left: 50%; /* Center the snackbar */
    bottom: 30px; /* 30px from the bottom */
}

#u-Snackbar div {
    padding: 16px; /* Padding */
    border-radius: 4px; /* Rounded borders */

}

#u-Snackbar div.info {
    background-color: #333; /* Black background color */
}

#u-Snackbar div.error { 
    background-color: #cc0001 !important; 
}

#u-Snackbar.show {
    visibility: visible; /* Show the snackbar */
    -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
    animation: fadein 0.5s, fadeout 0.5s 2.5s;
}

/* Animations to fade the snackbar in and out */
/* Animations to fade the snackbar in and out */
@-webkit-keyframes fadein {
from {bottom: 0; opacity: 0;} 
to {bottom: 30px; opacity: 1;}
}

@keyframes fadein {
from {bottom: 0; opacity: 0;}
to {bottom: 30px; opacity: 1;}
}

@-webkit-keyframes fadeout {
from {bottom: 30px; opacity: 1;} 
to {bottom: 0; opacity: 0;}
}

@keyframes fadeout {
from {bottom: 30px; opacity: 1;}
to {bottom: 0; opacity: 0;}
}

/* LAPTOP - PC */
@media only screen and (max-width : 1500px) {
    
}

/* TABLET YATAY */
@media only screen and (max-width : 1024px) {
    .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12{ float: none; width:100%; }
    .th-col-1 { width: 8.33%; float:left; }
    .th-col-2 { width: 16.66%; float:left; }
    .th-col-3 { width: 24.99%; float:left; }
    .th-col-4 { width: 33.32%; float:left; }
    .th-col-5 { width: 41.65%; float:left; }
    .th-col-6 { width: 49.98%; float:left; }
    .th-col-7 { width: 58.31%; float:left; }
    .th-col-8 { width: 66.64%; float:left; }
    .th-col-9 { width: 74.97%; float:left; }
    .th-col-10 { width: 83.3%; float:left; }
    .th-col-11 { width: 91.63%; float:left; }
    .th-col-12 { width: 100%; float:left; }
}

/* TABLET DIKEY */
@media only screen and (max-width : 768px) {
    .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12{ float: none; width:100%; }
    .tp-col-1 { width: 8.33%; float:left; }
    .tp-col-2 { width: 16.66%; float:left; }
    .tp-col-3 { width: 24.99%; float:left; }
    .tp-col-4 { width: 33.32%; float:left; }
    .tp-col-5 { width: 41.65%; float:left; }
    .tp-col-6 { width: 49.98%; float:left; }
    .tp-col-7 { width: 58.31%; float:left; }
    .tp-col-8 { width: 66.64%; float:left; }
    .tp-col-9 { width: 74.97%; float:left; }
    .tp-col-10 { width: 83.3%; float:left; }
    .tp-col-11 { width: 91.63%; float:left; }
    .tp-col-12 { width: 100%; float:left; }

    .pre { padding-right: 0px; /*margin-top: 10px;*/ } /* elemanlar alt alta gelecegi icin */
    .ple { padding-left: 0px;  /*margin-top: 10px;*/ } /* paddingleri kaldir */
    .tp-pre { padding-right: 5px; } /* sagdaki elemanla arayi ac */
    .tp-ple { padding-left: 5px; } /* soldaki elemanla arayi ac */
}

/* TELEFON */
@media only screen and (max-width : 760px) {
    #u-Snackbar { left: 0; width: 100%; margin-left: 0; padding: 0 30px; }
    .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12,
        .tp-col-1, .tp-col-2, .tp-col-3, .tp-col-4, .tp-col-5, .tp-col-6, .tp-col-7, .tp-col-8, .tp-col-9, .tp-col-10, .tp-col-11, .tp-col-12 { 
            float: none; width:100%; 
        }
    .p-col-1 { width: 8.33%; float:left; }
    .p-col-2 { width: 16.66%; float:left; }
    .p-col-3 { width: 24.99%; float:left; }
    .p-col-4 { width: 33.32%; float:left; }
    .p-col-5 { width: 41.65%; float:left; }
    .p-col-6 { width: 49.98%; float:left; }
    .p-col-7 { width: 58.31%; float:left; }
    .p-col-8 { width: 66.64%; float:left; }
    .p-col-9 { width: 74.97%; float:left; }
    .p-col-10 { width: 83.3%; float:left; }
    .p-col-11 { width: 91.63%; float:left; }
    .p-col-12 { width: 100%; float:left; }

    .tp-pre, .pre { padding-right: 0px; margin-top: 10px; } /* elemanlar alt alta gelecegi icin */
    .tp-ple, .ple { padding-left: 0px;  margin-top: 10px; } /* paddingleri kaldir */
    .p-ple { padding-left: 5px; }
    .p-pre { padding-right: 5px; }

    .urow-header { text-align: center; padding: 10px 20px; }
    .urow-header label { font-size: 14px; padding: 5px 10px 5px 10px; }
    span.uradio { margin-bottom: 10px; }
    .body .inner .uform-body { padding: 30px 0px 0 0px; }
    /*.uform-button-set {padding: 20px 0; }
    .uform-button-set button { margin: 5px 0px; width: 100%; }*/
}