@import url('https://fonts.googleapis.com/css2?family=Kanit:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

:root {
    --first-color : #21294f;
    --second-color : #d1d3de;
    --body-fonts: 'Kanit Sans', sans-serif;
    --title-fonts: 'Kanit Sans', sans-serif;
}

.quform-elements input,
.quform-elements textarea{
  border: 1.6px solid black;
}


.grayBackground{
  background: #ECEEF0;
  color:black;
}
.blueBackground{
  background: #074795;
  color:white;
}

.overlay {
  border-image: fill 0 linear-gradient(#0003,#000); /* your gradient here */
}

.cardStyle {
    box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.2);
    word-break: break-word;
    border-radius: 20px;
}

.urunButton{
  background: #074795;
  border-radius: 45px;
  color:white;
  width: 80%;
  height: 50px;
  font-size: 12.6px;
  font-weight: bold;
  text-align: center;
  text-transform: uppercase;
  padding: 10px 35px 10px 35px;
}

.urunButton:hover{
  color: #074795;
  background: white;
}

.katalogButton{
   background: #074795;
   color:white;
   padding: 23px 34px 23px 34px;
   font-size: 16px;
   font-weight: bold;
}

.katalogButton:hover,
.katalogButton:focus,
.katalogButton:active{
   background: white;
   color: #074795;
   border: 1px solid #074795;
}
/**/
.katalogKurumsalButton{
   background: #074795;
   color:white;
   font-size: 16px;
   font-weight: bold;
}

.katalogKurumsalButton:hover,
.katalogKurumsalButton:focus,
.katalogKurumsalButton:active{
   background: white;
   color: #074795;
   border: 1px solid #074795;
}

.normalButton{
  background: #074795;
  padding: 10px 15px 10px 15px;
  margin: 0px;
  color: white;
  width: 200px;
  font-weight: 500;
  font-size:10px;
}

.normalButton:hover{
  color: #074795;
  background: white;
  border: 1px solid #074795;
}
/*** **/



.referans {
    width: 100%;
    -webkit-filter: grayscale(1);
    filter: grayscale(1);
}

.referans:hover {
    -webkit-filter: grayscale(0);
    filter: grayscale(0);
}

#text-none{
    text-transform: none;
}

#uppercase{
    text-transform: uppercase;
}

#lowercase{
    text-transform: lowercase;
}

#capitalize{
    text-transform: capitalize;
}

.text-none{
    text-transform: none;
}

.uppercase{
    text-transform: uppercase;
}

.lowercase{
    text-transform: lowercase;
}

.capitalize{
    text-transform: capitalize;
}


.f-s-14{
    font-size: 14px;
}
.f-s-16{
    font-size: 16px;
}
.f-s-18{
    font-size: 18px;
}
.f-s-20{
    font-size: 20px;
}
.f-s-22{
    font-size: 22px;
}
.f-s-24{
    font-size: 24px;
}
.f-s-26{
    font-size: 26px;
}
.f-s-28{
    font-size: 28px;
}
.f-s-30{
    font-size: 30px;
}
.f-s-32{
    font-size: 32px;
}
.f-s-34{
    font-size: 34px;
}
.f-s-36{
    font-size: 36px;
}
.f-s-38{
    font-size: 38px;
}
.f-s-40{
    font-size: 40px;
}

#f-s-14{
    font-size: 14px;
}
#f-s-16{
    font-size: 16px;
}
#f-s-18{
    font-size: 18px;
}
#f-s-20{
    font-size: 20px;
}
#f-s-22{
    font-size: 22px;
}
#f-s-24{
    font-size: 24px;
}
#f-s-26{
    font-size: 26px;
}
#f-s-28{
    font-size: 28px;
}
#f-s-30{
    font-size: 30px;
}
#f-s-32{
    font-size: 32px;
}
#f-s-34{
    font-size: 34px;
}
#f-s-36{
    font-size: 36px;
}
#f-s-38{
    font-size: 38px;
}
#f-s-40{
    font-size: 40px;
}

#f-s-45{
    font-size: 45px;
}

#br-10
{
  border-radius: 10px;
}



.boyutla{
    width: 100%;
    height: auto;
}

.sifirla{
    padding: 0px;
    margin: 0px;
}

#boyutla{
    width: 100%;
    height: auto;
}

#sifirla{
    padding: 0px;
    margin: 0px;
}

#kisalt{
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
    width:100%;
}

.kisalt{
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
    width:100%;
}

/* FONT-YAZI --> CSS-LERÄ° */
#Kanit{
    font-family: var( --body-fonts );
}

.Kanit{
    font-family: var( --body-fonts );
}

.yazi_100
{
    font-weight: 100;
}

.yazi_200
{
    font-weight: 200;
}

.yazi_300
{
    font-weight: 300;
}

.yazi_400
{
    font-weight: 400;
}

.yazi_500
{
    font-weight: 500;
}

.yazi_600
{
    font-weight: 600;
}

.yazi_700
{
    font-weight: 700;
}

.yazi_800
{
    font-weight: 800;
}

.yazi_900
{
    font-weight: 900;
}


/* FONT-YAZI --> CSS-LERÄ° */

.bg-overlay-black-10 {
    position: relative;
    z-index: 1; }
.bg-overlay-black-10:before {
    background: rgba(11, 35, 122,0.1);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 0; }

.bg-overlay-black-20 {
    position: relative;
    z-index: 1; }
.bg-overlay-black-20:before {
    background: rgba(11, 35, 122,0.2);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 0; }

.bg-overlay-black-30 {
    position: relative;
    z-index: 1; }
.bg-overlay-black-30:before {
    background: rgba(11, 35, 122,0.3);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 0; }

.bg-overlay-black-40 {
    position: relative;
    z-index: 1; }
.bg-overlay-black-40:before {
    background: rgba(11, 35, 122,0.4);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 0; }

.bg-overlay-black-50 {
    position: relative;
    z-index: 1; }
.bg-overlay-black-50:before {
    background: rgba(11, 35, 122,0.5);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 0; }

.bg-overlay-black-60 {
    position: relative;
    z-index: 1; }
.bg-overlay-black-60:before {
    background: rgba(11, 35, 122,0.6);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 0; }

.bg-overlay-black-70 {
    position: relative;
    z-index: 1; }
.bg-overlay-black-70:before {
    background: rgba(11, 35, 122,0.7);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 0; }

.bg-overlay-black-80 {
    position: relative;
    z-index: 1; }
.bg-overlay-black-80:before {
    background: rgba(11, 35, 122,0.8);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 0; }

.bg-overlay-black-90 {
    position: relative;
    z-index: 1; }
.bg-overlay-black-90:before {
    background: rgba(11, 35, 122,0.9);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 0; }

.margin-top-10{margin-top:10px}.margin-bottom-10{margin-bottom:10px}.padding-top-10{padding-top:10px}.padding-bottom-10{padding-bottom:10px}.margin-top-20{margin-top:20px}.margin-bottom-20{margin-bottom:20px}.padding-top-20{padding-top:20px}.padding-bottom-20{padding-bottom:20px}.margin-top-30{margin-top:30px}.padding-top-30{padding-top:30px}.margin-bottom-30{margin-bottom:30px}.padding-bottom-30{padding-bottom:30px}.margin-top-40{margin-top:40px}.padding-top-40{padding-top:40px}.margin-bottom-40{margin-bottom:40px}.padding-bottom-40{padding-bottom:40px}.margin-top-50{margin-top:50px}.padding-top-50{padding-top:50px}.margin-bottom-50{margin-bottom:50px}.padding-bottom-50{padding-bottom:50px}.margin-top-60{margin-top:60px}.padding-top-60{padding-top:60px}.margin-bottom-60{margin-bottom:60px}.padding-bottom-60{padding-bottom:60px}.margin-top-70{margin-top:70px}.padding-top-70{padding-top:70px}.margin-bottom-70{margin-bottom:70px}.padding-bottom-70{padding-bottom:70px}.margin-top-80{margin-top:80px}.padding-top-80{padding-top:80px}.margin-bottom-80{margin-bottom:80px}.padding-bottom-80{padding-bottom:80px}.hidden{display:none!important}.affix{position:fixed}.visible-lg,.visible-md,.visible-sm,.visible-xs{display:none!important}.visible-lg-block,.visible-lg-inline,.visible-lg-inline-block,.visible-md-block,.visible-md-inline,.visible-md-inline-block,.visible-sm-block,.visible-sm-inline,.visible-sm-inline-block,.visible-xs-block,.visible-xs-inline,.visible-xs-inline-block{display:none!important}@media (max-width:767px){.visible-xs{display:block!important}table.visible-xs{display:table!important}tr.visible-xs{display:table-row!important}td.visible-xs,th.visible-xs{display:table-cell!important}.visible-xs-block{display:block!important}.visible-xs-inline{display:inline!important}.visible-xs-inline-block{display:inline-block!important}}@media (min-width:768px) and (max-width:991px){.visible-sm{display:block!important}table.visible-sm{display:table!important}tr.visible-sm{display:table-row!important}td.visible-sm,th.visible-sm{display:table-cell!important}.visible-sm-block{display:block!important}.visible-sm-inline{display:inline!important}.visible-sm-inline-block{display:inline-block!important}}@media (min-width:992px) and (max-width:1199px){.visible-md{display:block!important}table.visible-md{display:table!important}tr.visible-md{display:table-row!important}td.visible-md,th.visible-md{display:table-cell!important}.visible-md-block{display:block!important}.visible-md-inline{display:inline!important}.visible-md-inline-block{display:inline-block!important}}@media (min-width:1200px){.visible-lg{display:block!important}table.visible-lg{display:table!important}tr.visible-lg{display:table-row!important}td.visible-lg,th.visible-lg{display:table-cell!important}.visible-lg-block{display:block!important}.visible-lg-inline{display:inline!important}.visible-lg-inline-block{display:inline-block!important}}@media (max-width:767px){.hidden-xs{display:none!important}}@media (min-width:768px) and (max-width:991px){.hidden-sm{display:none!important}}@media (min-width:992px) and (max-width:1199px){.hidden-md{display:none!important}}@media (min-width:1200px){.hidden-lg{display:none!important}}.visible-print{display:none!important}@media print{.visible-print{display:block!important}table.visible-print{display:table!important}tr.visible-print{display:table-row!important}td.visible-print,th.visible-print{display:table-cell!important}}.visible-print-block{display:none!important}@media print{.visible-print-block{display:block!important}}.visible-print-inline{display:none!important}@media print{.visible-print-inline{display:inline!important}}.visible-print-inline-block{display:none!important}@media print{.visible-print-inline-block{display:inline-block!important}}@media print{.hidden-print{display:none!important}}