* {
    box-sizing: border-box;
  }

.text-left { text-align: left; }
.text-right { text-align: right; }
.text-center { text-align: center; }
.text-bold { font-family: 'font-bold'; }
.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; }
.pos-relative { position: relative; }

h1.uform-title { font-family: 'font-bold'; 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: 'font-regular'; 
            font-size: 14px; 
        }

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

select.thin {
    padding: 5px 20px 5px 8px;
}

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; 
}

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

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

.ufield span.error-msg { 
    color: #cc0001; 
    display: block; 
    line-height: 18px;
    padding-top: 6px;
    font-size: 14px;
    font-family: 'font-regular';
    display: none;
}

.ufield.error span.error-msg { 
    display: block;
}

.uoption-group { border: #5065da 1.5px solid; border-radius: 10px; overflow: hidden; display: inline-block; align-self: center; }
.uoption-group span { cursor: pointer; display: inline-block; padding: 8px 15px; color: #5065da; margin: 0; }
.uoption-group span.selected { background-color: #5065da; color: #fff; cursor:default; }

/*  ---
    form layouts
    ---
*/
/* common css */
.dspBlock { display: block; }
.dspInline { display: inline-block; }
.dflex { display: flex; }
.fd-col {flex-direction: column !important; }
.fd-row {flex-direction: row !important; }
.fd-wrap { flex-wrap: wrap; }
.fas-end { align-self: flex-end !important; }
.fas-start { align-self: flex-start !important; }
.f-asc { align-self: center !important;}
.f-jcc { justify-content: center !important; }
.f-jcfe { justify-content: flex-end !important; }
.f-jcsb { justify-content: space-between; }
.flex-form { position: absolute; left: 0; top: 0; right: 0; bottom: 0; display: flex; flex-direction: column; }
.mce-tinymce { width: 100% !important; } /* tinymce container */


.ufield { display: flex; padding: 0 5px; flex-direction: row; margin-bottom: 10px; }
.ufield.hovered { padding: 10px 15px; margin: 0; }
.ufield.hovered:hover { background-color: #f5f5f5; }
..ufield ufield { display: flex; flex: 1; flex-direction: row; align-self: center; }
.form.horizontal .ufield ufield { flex-direction: column; }
.ufield label {  position: relative; display: flex; color: #172b4d;  font-size: 13px;  font-family: 'font-regular';  padding: 10px; align-self: flex-start; }
.ufield label i { font-size: 14px; position: absolute; right: 0px; top: 7px; cursor: default; padding: 5px; }
.ufield.vertical { flex-direction: column; min-height: 78px; }
.ufield.vertical label {  line-height: 30px;  font-size: 14px;  font-family: 'font-bold'; align-self: flex-start; }
..ufield ufield input, 
    ..ufield ufield select, 
        ..ufield ufield textarea { width: 100%; padding: 6px 12px;  }
..ufield ufield.checkbox { float: left;  padding: 11px 8px 0 0;  }
..ufield ufield .field-validation-error { border-color: #cc0001; }
.ufield p { font-size: 15px; margin: 0; padding: 0; }

..ufield.vertical ufield { width: 100%; }

..ufield.vertical ufield input, 
    ..ufield.vertical ufield select, 
        ..ufield.vertical ufield textarea { width: 100%; padding: 12px;  }

.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: 'font-bold';
    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: 28px;
}

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;
}

span.ucheck:hover i {
    color: #999;
}

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

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

/* button */
.btn { cursor: pointer; padding: 10px 30px; border: transparent 1px solid; outline: none; border-radius: 4px; margin: 0 5px; font-family: 'font-regular'; font-size: 15px; transition: background-color 0.5s ease; }
.btn.thin { padding: 7px 15px; font-size: 13px; }
.btn.mini { padding: 3px 7px 1px 7px; font-size: 11px; }
.btn.normal { padding: 7px 15px; font-size: 15px; }
.btn.large { padding: 12px 30px; }
.btn.radius { border-radius: 22px; }
.btn.green { color: #fff; background-color: #006b2b; }
.btn.green:hover { background-color: #005020; }
.btn.whiteblue { color: #242424; background-color: #fff; }
.btn.whiteblue:hover { background-color: #0066cc; color: #fff; }
.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.gray-blue { background-color: #f2f2f2; color: #242424; }
.btn.gray-blue:hover { background-color: #0066cc; color: #fff; }
.btn.green-light { background-color: #f2f2f2; color: #242424; }
.btn.green-light:hover { background-color: #0066cc; color: #fff; }

.btn.blue { border: #5065da 1.5px solid; background-color: #5065da; color: #fff; }
.btn.blue:hover { background-color: #485bc5; border: #485bc5 1.5px solid; }
.btn.blue-border { border: #5065da 1.5px solid; background-color: #fff; color: #5065da; }
.btn.blue-border:hover { background-color: #5065da; color: #fff; }

button:disabled { background-color: #d4d4d4 !important; color: #999 !important; }

/* 
    ---
    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-120 { width: 120px !important; }
.w-130 { width: 130px !important; }
.w-140 { width: 140px !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; }
.w-550 { width: 550px !important; }
.w-600 { width: 600px !important; }
.w-550 { width: 650px !important; }
.w-700 { width: 700px !important; }
.w-750 { width: 750px !important; }
.w-800 { width: 800px !important; }
.w-850 { width: 850px !important; }
.w-900 { width: 900px !important; }

.d-flex {display: flex; flex-wrap: wrap; }
.flex-row { flex-direction: row; }
.flex-col { flex-direction: column; }

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

.no-padding { padding: 0 !important; }
.no-ver-padding { padding-top: 0 !important; padding-bottom: 0 !important; }
.no-hor-padding { padding-right: 0 !important; padding-left: 0 !important; }
.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 */

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

/* MATERIAL PROGRESS */
.u-progress { top: 0; left: 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{ flex: 0 0 100%; }
    .th-col-1 { flex: 0 0 8.33%; }
    .th-col-2 { flex: 0 0 16.66%; }
    .th-col-3 { flex: 0 0 24.99%; }
    .th-col-4 { flex: 0 0 33.32%; }
    .th-col-5 { flex: 0 0 41.65%; }
    .th-col-6 { flex: 0 0 49.98%; }
    .th-col-7 { flex: 0 0 58.31%; }
    .th-col-8 { flex: 0 0 66.64%; }
    .th-col-9 { flex: 0 0 74.97%; }
    .th-col-10 { flex: 0 0 83.3%; }
    .th-col-11 { flex: 0 0 91.63%; }
    .th-col-12 { flex: 0 0 100%; }
}

/* 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{ flex: 0 0 100%; }
    .tp-col-1 { flex: 0 0 8.33%; }
    .tp-col-2 { flex: 0 0 16.66%; }
    .tp-col-3 { flex: 0 0 24.99%; }
    .tp-col-4 { flex: 0 0 33.32%; }
    .tp-col-5 { flex: 0 0 41.65%; }
    .tp-col-6 { flex: 0 0 49.98%; }
    .tp-col-7 { flex: 0 0 58.31%; }
    .tp-col-8 { flex: 0 0 66.64%; }
    .tp-col-9 { flex: 0 0 74.97%; }
    .tp-col-10 { flex: 0 0 83.3%; }
    .tp-col-11 { flex: 0 0 91.63%; }
    .tp-col-12 { flex: 0 0 100%; }

    .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,
            .th-col-1, .th-col-2, .th-col-3, .th-col-4, .th-col-5, .th-col-6, .th-col-7, .th-col-8, .th-col-9, .th-col-10, .th-col-11, .th-col-12 { 
            flex: 0 0 100%;
        }
    .p-col-1 { flex: 0 0 8.33%; }
    .p-col-2 { flex: 0 0 16.66%; }
    .p-col-3 { flex: 0 0 24.99%; }
    .p-col-4 { flex: 0 0 33.32%; }
    .p-col-5 { flex: 0 0 41.65%; }
    .p-col-6 { flex: 0 0 49.98%; }
    .p-col-7 { flex: 0 0 58.31%; }
    .p-col-8 { flex: 0 0 66.64%; }
    .p-col-9 { flex: 0 0 74.97%; }
    .p-col-10 { flex: 0 0 83.3%; }
    .p-col-11 { flex: 0 0 91.63%; }
    .p-col-12 { flex: 0 0 100%; }

    .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; }
}