/*@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,600&display=swap');*/
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;500;600&display=swap');

/* var(--r) */

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
	margin: 0;
	padding: 0;
	-html-user-select: none;
	-moz-user-select: -moz-none;
	-o-user-select: none;
	user-select: none;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	-webkit-tap-highlight-color: transparent; 
}




body {
	margin:0;
	padding:0;
    max-width: 100% !important;/*yatay kaydırma yok*/
    overflow-x: hidden !important;/*yatay kaydırma yok*/
    background-image: url(../i/bg.png);
    background-repeat: repeat;
}
body,p,li{
	font-size: 100%;
	//font-family: 'Open Sans', sans-serif;
	font-family: 'Montserrat', sans-serif;
	font-size: 1.2vw; /*k39ss*/
	font-weight: 400;
	font-style: normal;
	-webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
	color:#333;
	line-height:1.5;
}

.yatayscrollengelle{ max-width:100%;position: relative;top: 0;bottom: 0;left: 0;right: 0;overflow: hidden;}

h1,h2,h3,h4{font-weight:300;text-align:center;color:var(--r);margin:2vw 0 0.5vw 0;line-height:140%;}
h1{font-size:2vw;}
h2{font-size:1.7vw;}
h3{font-size:1.5vw;}
h4{font-size:1.3vw;}

p{text-align:justify;}/*k39ss*/
strong{font-weight:600}
a{text-decoration:none;color:#333;}
b{font-weight:600}

.divCabFull{
	padding:3vw;
	width:100vw;
	height:auto;
	display: inline-block;
}

.urunsadeCab {
	display: flex;
	flex-wrap: wrap;
	justify-content: center; 
	align-items: center;
}


.urunsade{
	width:23vw;
	height:23vw;
	background-size: 100%;
	background-repeat: no-repeat;
    position: relative;
	margin: 1vw;
	cursor:pointer;
}

/* Transparan Siyah Katman (Overlay) */
.urunsade::before {
    content: ""; 
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

    z-index: 1;
	
    background: linear-gradient(
        to top right, /* Geçiş yönü: Sol alttan (başlangıç) sağ üste (bitiş) */
        rgba(0, 0, 0, 0.8) 0%, /* Sol Alt Köşe: %50 Opaklıkta Siyah (Başlangıç) */
        rgba(0, 0, 0, 0) 75% /* Sağ Üst Köşe: %0 Opaklıkta Siyah (Bitiş) */
    );
	
}

.urunsade h3 {

    color: white; 
    position: absolute;
    z-index: 2;
    bottom: 5%;
    left: 50%;
    transform: translateX(-50%);
    width: 90%;
    text-align: center;
    font-size: 1.5vw;
	font-weight:600;
}

.cols {
    width: 100%;
    margin: 0 auto;
    position: relative;
    display:flex;
    flex-wrap:wrap;
    justify-content:center;/*yatay*/
	align-items: top;/*center;/*dikey*/
}
.col1 {
	width: 78vw;
    height: auto;
    margin: 0 1vw 0 1vw;
	padding:0vw;
  -webkit-transition: all 0.3s;
     -moz-transition: all 0.3s;
       -o-transition: all 0.3s;
      -ms-transition: all 0.3s;
          transition: all 0.3s;
}

.col2 {
	width: 39vw;
    height: auto;
    margin: 0 1vw 0 1vw;
	padding:0vw;
  -webkit-transition: all 0.3s;
     -moz-transition: all 0.3s;
       -o-transition: all 0.3s;
      -ms-transition: all 0.3s;
          transition: all 0.3s;
}
.col3 {
	width: 29vw;
    height: auto;
    margin: 0 1vw 0 1vw;
	padding:0vw;
  -webkit-transition: all 0.3s;
     -moz-transition: all 0.3s;
       -o-transition: all 0.3s;
      -ms-transition: all 0.3s;
          transition: all 0.3s;
}

.col4 {
	width: 22.4vw;
    height: auto;
    margin: 0 1vw 0 1vw;
	padding:0vw;
  -webkit-transition: all 0.3s;
     -moz-transition: all 0.3s;
       -o-transition: all 0.3s;
      -ms-transition: all 0.3s;
          transition: all 0.3s;
}

.col5 {
	width: 18vw;
    height: auto;
    margin: 0 1vw 0 1vw;
	padding:0vw;
  -webkit-transition: all 0.3s;
     -moz-transition: all 0.3s;
       -o-transition: all 0.3s;
      -ms-transition: all 0.3s;
          transition: all 0.3s;
}

.imgfull{width:100%;}
.imgyarim{width:50%;}
.imgceyrek{width:25%;}

.ftrBg {
	background-image: linear-gradient(318deg, #0B1727 13%, #008FD6 62%);
	background: -webkit-linear-gradient(318deg, #0B1727 13%, #008FD6 62%);
	background: -moz-linear-gradient(318deg, #0B1727 13%, #008FD6 62%);
	width: 100%;
	height: auto;
	color: #fff !IMPORTANT;
	padding:30px;
	list-style: none;

}
.ftrBg a, .ftrBg p, .ftrBg h2 {
	font-size:1vw;
	text-align:left;
	color: #fff !important;
}

.ftrBg h2{font-size:2vw;}

.ftrico{
	vertical-align:middle;width:1.5vw;
	-webkit-filter: filter: invert(100%) grayscale(100%) brightness(200%) ;
	filter: invert(100%) grayscale(100%) brightness(200%);
	margin-right:.6vw;
}

.ico{
	vertical-align:middle;width:1.5vw;
	margin-right:.6vw;
}
.epostaimage{width:22vw;height:auto;vertical-align:middle}

/* Mobil Responsive */
@media screen and (max-width: 799px) {
	body,p{font-size: 4vw;}/*ofs7a*/
	h1,h2,h3,h4{margin:6vw 0 1vw 0;}
	h1{font-size:6vw;}
	h2{font-size:5vw;}
	h3{font-size:4.5vw;}
	h4{font-size:4vw;}	
	.col1,.col2,.col3,.col4,.col5 {width:80vw;margin: 4vw 0 4vw 0;}
	.imgyarim{width:80%;}
	.ftrico,.ico{width:5vw;margin-right:3vw;}
	.ftrBg a, .ftrBg p, .ftrBg h2 {font-size:3vw;}
	.ftrBg h2{font-size:4vw;}
	.epostaimage{width:60vw;}
    .urunsade{
        width: 100vw;
		height:100vw;
        margin: 5vw 0 5vw 0;
    }

    .urunsadeCab {
        flex-direction: column; 
    }

}
