@import url('https://fonts.googleapis.com/css2?family=Poppins: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'); @font-face {

    font-family: 'Baloo 2';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(https://fonts.gstatic.com/s/baloo2/v21/wXK0E3kTposypRydzVT08TS3JnAmtdgazZpo_lI.ttf) format('truetype');
}

.container {
    width: 1300px;
    margin: auto;
    font-family: 'Baloo 2';
}

.top {
    width: 100%;
    float: left;
    background: #258fe3;
    font-family: 'Baloo 2';
    font-size: 15px;
    margin-top: 0;
    min-width: 1300px;
}

.top a {
    color: white;
    padding: 8px;
    float: left;
}

.top .left {
    float: left;
}

.top .right {
    float: right;
}

.header {width: 100%;float: left;padding-top: 20px;padding-bottom: 20px;background-repeat: repeat-x;animation: slide-left 20s linear infinite;background: #4facf5 url('../images/cloud.png');min-width: 1300px;}

@keyframes slide-left {
    0% {
        background-position: 0 0;
    }

    25% {
        background-position: -25% 10px;
    }

    50% {
        background-position: -50% -10px;
    }

    75% {
        background-position: -75% 5px;
    }

    100% {
        background-position: -100% 0;
    }
}

.logo {
    float: left;
}

.logo img {
}

.arama-1 {
    float: left;
    margin-left: 130px;
    width: 580px;
    margin-top: 13px;
}

.arama-1 .kriter {
    border: none;
    padding-left: 30px;
    font-family: 'Baloo 2';
    float: left;
    width: 570px;
    background-position: 20px;
    background-image: none;
    border-radius: 30px;
    text-align: left;
}

.arama-1 img {
    margin-left: -75px!important; }

.arama-1 .AraButon {
    border: none;
    border-radius: 0px;
    border-top-right-radius: 30px;
    border-bottom-right-radius: 30px;
    margin-top: 0px;
    float: left;
    border-radius: 100%;
    width: 40px;
    height: 40px;
    margin-left: -46px;
    margin-top: 5px;
    text-indent: -9999px;
    background: #4fadf5;
    background-image: url('http://www.gamegross.com/tema/Tema_01/images/ara-bg-1.png');
    background-size: 22px;
    background-position: center;
    background-repeat: no-repeat;
}

.cm {
    float: left;
    background: #65b5f6;
    width: 166px;
    border-radius: 30px;
    color: white;
    margin-left: 60px;
    border: 1px solid rgba(255,255,255,.35);
    font-family: 'Baloo 2';
    padding-right: 10px;
    padding-left: 10px;
    margin-top: 10px;
}

.cm .icon {
    float: left;
    height: 38px;
    font-size: 22px;
    margin-left: 15px;
    margin-top: 15px;
}

.cm .ixon svg {
}

.cm .text {
    margin-left: 12px;
    margin-top: 7px;
    border: none;
    padding: 0;
    float: left;
    width: auto;
    line-height: 23px;
}

.cm .text span {
    font-weight: 100;
    color: white;
}

.cm .text h4 {
    margin: 0;
    font-weight: 600;
    font-size: 22px;
    margin-top: -6px;
}

.butonlar {
    float: right;
    margin-top: 16px;
}

.butonlar ul {
    margin: 0;
    padding: 0;
}

.butonlar li {
    float: left;
    list-style-type: none;
}

.butonlar li a {
    color: white;
    background: #f88e0f;
    width: 42px;
    height: 42px;
    float: left;
    border-radius: 30px;
    text-align: center;
    line-height: 40px;
    margin-left: 13px;
    position: relative;
}

.butonlar li svg {
    font-size: 19px;
    margin-top: 11px;
}

.butonlar li svg {
    font-size: 19px;
    margin-top: 11px;
    transition: transform 0.2s ease;
}

.butonlar li svg {
    font-size: 19px;
    margin-top: 11px;
    transition: transform 0.2s ease;
}

.butonlar li svg {
    font-size: 19px;
    margin-top: 11px;
    transition: transform 0.3s ease;
}

.butonlar li svg:hover {
  font-size:21px;
 }
 

.butonlar span {
    position: absolute;
    top: -5px;
    background: #13325e;
    height: 15px;
    width: 16px;
    line-height: 15px;
    border-radius: 30px;
    font-size: 11px;
    font-family: 'Baloo 2';
    left: 27px;
    color: white;
}

.menu-1 {
    width: 100%;
    float: left;
    font-family: 'Baloo 2';
    margin-bottom: 30px;
    border-bottom: 1px solid #f8f8f8;
    box-shadow: 0px 10px 20px #f3f3f3;
}

.menu-1 span {
    font-family: 'Baloo 2';
    font-size: 17px;
    padding: 0px!important;
    !importan;!importa;!import;!impor;!impo;!imp;!im;!i;!;margin-right: 30px;
    border-left: none!important;
    !importan;!importa;!import;!impor;!impo;!imp;!im;!i;!;color: #30363a;
}

.menu-1 span:hover {
    color: #50acf5;
}

.slider-1 {
    width: 100%;
    float: left;
}

.slider-1 div.slider-nav span.right {
    background: url('../images/right-w.png');
    height: 86px;
    width: 43px;
    background-repeat: no-repeat;
    right: 0;
}

.slider-1 div.slider-nav span.left {
    background: url('../images/left-white.png');
    height: 86px;
    width: 43px;
    background-repeat: no-repeat;
    left: 0;
}

. .tab {
    overflow: auto;
    width: 100%;
    text-align: center;
    margin-top: 20px;
}

/* Style the buttons that are used to open the tab content */
.tab button {
    background-color: FFFFFF;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 21px 5px 0px 18px;
    transition: 0.3s;
    color: #3a3939;
    font-weight: normal;
    font-family: "Poppins", sans-serif;
    font-size: 17px;
    border-bottom: 3px solid #FFFFFF;
    float: left;
    font-weight: 600;
    margin-top: 6px;
    border: 2px solid #e7e7e7;
    border-radius: 30px;
    line-height: 10px;
    padding-bottom: 20px;
    font-size: 15px;
    margin-right: 20px;
    padding-right: 20px;
}

/* Create an active/current tablink class */
.tab button.active {
    background-color: #FFFFFF;
    color: #50adf5;
    font-weight: 600;
    border: 2px solid #50adf5;
    background: #50adf5;
    color: white;
}

/* Style the tab content */
.tabcontent {
    display: none;
    padding: 0;
    padding-top: 0;
    animation: fadeEffect 0.5s;
    border-top: 1px solid #e7e7e7;
}

/* Go from zero to full opacity */
@keyframes fadeEffect {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.tabcontent .cerceve {
    1px:solid;1px:solid;1px:solid;1px:soli;1px:sol;1px:so;1px:unset;1px:unset;1px:s;border: 1px solid #e7e7e7;
    border-radius: 15px;
}

.tabcontent .item .grow img {
    border-radius: 15px;
}

#fixmenu .dropnew a:hover {
    background-color: inherit!important;
}

#fixmenu .dropnew:hover {
    background-color: inherit!important;
}

.dropnew {
    background-color: inherit!important;
    !importan;!importa;!import;!impor;!impo;!imp;!im;!i;!;!importan;!importa;!import;!impor;!impo;!imp;!im;!i;!; !importan;!importa;!import;!impor;!impo;!imp;!im;!i;!; padding: 0px!important;
    !importan;!importa;!import;!impor;!impo;!imp;!im;!i;!; float: left;
}

.dropnew a {
    font-family: 'Baloo 2';
    /* color: white!important; */
    !importan;!importa;!import;!impor;!impo;!imp;!im;!i;!; font-size: 17px;
    padding-top: 15px;
    float: left;
    padding-bottom: 15px;
}

.dropnew a:hover {
    background-color: inherit!important;
}

.dropnew:hover {
    background-color: inherit!important;
    color: #12325E;
}

.firsat-urunleri {
    width: 100%;
    float: left;
    background: #fff7ed;
    padding-bottom: 20px;
    margin-bottom: 10px;
    margin-top: 10px;
    padding-top: 30px;
}

.firsat-urunleri .cerceve b {
    font-family: "Poppins", sans-serif;
    color: #4fadf5;
}

.firsat-urunleri .cerceve a font {
    font-family: "Poppins", sans-serif;
    font-size: 19px;
}

.firsat-urunleri .cerceve {
    border: 1px solid #e7e7e7;
    border-radius: 15px;
    background: white;
}

.firsat-urunleri .cerceve .grow img {
    border-radius: 15px;
}

.cerceve b {
    font-family: "Poppins", sans-serif;
    color: #4fadf5;
}

.cerceve a font {
    font-family: "Poppins", sans-serif;
    font-size: 19px;
}

.banner-2li {
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: -3px;
}

.banner-2li .banner {
    width: 624px;
    margin-right: 30px;
}

.banner-2li .banner img {
    width: 100%;
    height: auto;
}

.banner-2li .resbanner2 {
    width: 100%;
}

.banner-2li .resbanner2:hover {
    width: 624px!important;
}

.banner-2li .resbanner3 {
    width: 100%;
}

.banner-2li .resbanner3:hover {
    width: 624px!important;
}

.blog {
    width: 100%;
    float: left;
    margin-bottom: 60px;
    margin-top: 30px;
}

.blog .blog-item {
    width: 260px;
    float: left;
    margin-right: 30px;
    padding: 20px;
    border: 1px solid #e7e7e7;
    border-radius: 15px;
    margin-top: 30px;
    font-family: "Poppins", sans-serif;
}

.blog .blog-item img {
    width: 100%;
    border-radius: 20px;
}

.blog .blog-item span {
    border: 1px solid #e7e7e7;
    padding: 9px;
    float: left;
    border-radius: 15px;
    margin-top: 15px;
    color: gray;
    font-size: 12px;
}

.blog .blog-item h4 {
    width: 100%;
    float: left;
    margin: 0;
    margin-top: 15px;
    font-size: 15px;
}

.blog .blog-item p {
    width: 100%;
    float: left;
    margin: 0;
    margin-top: 10px;
    margin-bottom: 10px;
    color: gray;
}

.blog .blog-item span svg {
    color: #4fadf5;
    margin-right: 7px;
}

.blog .blog-item:last-child {
    margin-right: 0px!important;
}

.firsat-urunleri center {
    margin-top: -45px;
    width: 100%;
    float: left;
    margin-bottom: 10px;
    display: none;
}

.menu > li > .megadrop {
    width: 1300px!important;
}

.menu > li > a {
    font-family: "Poppins", sans-serif;
    font-weight: 500;
}

#fixmenu .dropdown {
    float: left;
}

#fixmenu .menu > li > .megadrop {
    width: 1300px!important;
}

.footer {
    width: 100%;
    float: left;
    padding: 30px;
    border-top: 1px solid #d8e2e8;
    padding-left: 0px;
    padding-right: 0px;
    position: relative;
    text-align: left;
    padding-top: 60px;
    padding-bottom: 0px;
    background: #f0f9fe url('../images/cloud-bg.png');
    background-size: 100%;
    background-position: bottom;
    background-repeat: no-repeat;
    overflow: hidden;
    min-width: 1300px;
}

.col-info {
    width: 300px;
    float: left;
    margin-right: 70px;
    margin-bottom: 110px;
}

.footer h3 {
    font-family: "Poppins", sans-serif;
    text-align: left;
}

.col-info p {
    color: gray;
    width: 100%;
    float: left;
    font-size: 15px;
}

.col-info ul {
    margin: 0;
    padding: 0;
}

.col-info li {
    list-style-type: none;
    color: gray;
    margin-bottom: 5px;
    font-size: 15px;
    width: 100%;
    float: left;
    margin-bottom: 15px;
}

.col-info li a {
    color: gray;
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
}

.col-info li svg {
    background: white;
    padding: 10px;
    border-radius: 100%;
    float: left;
    margin-right: 8px;
}

.f-menu .col-info li a span {
    width: auto;
    height: auto;
    background: none;
}

.f-menu {
    float: left;
    width: 270px;
}

.f-menu h3 {
    font-family: "Poppins", sans-serif;
    width: 100%;
    float: left;
    margin-bottom: 7px;
    text-align: left;
}

.f-menu p {
}

.f-app {
    float: right;
    width: 360px;
}

.f-menu ul {
    padding: 0;
    margin: 0;
    color: #7b8798;
    float: left;
    width: 100%;
    margin-top: 15px;
}

.f-menu li {
    list-style-type: none;
    padding: 0;
    margin: 0;
    line-height: 36px;
}

.f-menu ul li a {
    color: gray;
    font-size: 15px;
    font-weight: 400;
}

.footer span {
    width: 40px;
    float: left;
    background: #eb8e02;
    height: 2px;
}

.f-menu a span {
    width: auto;
    height: auto;
    background: none;
}

.footer ul li span {
    width: auto;
    background: no-repeat;
    height: auto;
    margin-top: 11px;
}
.footer-bottom { width:100%; float:left;  }  


@keyframes yavasSallan {
    0% { transform: translateY(0); }
    50% { transform: translateY(10px); }
    100% { transform: translateY(0); }
}

.sallan {
    animation: yavasSallan 3s ease-in-out infinite;
}




.copyright {background: #50adf5;width:100%;float:left;color: white;min-width: 1300px;}
.copyright span {padding: 18px;width: 100%;float: left;border-top: 1px solid #73bcf3;margin-top: 30px;font-size: 14px;text-align: center;} 
.social-media {}
.social-media ul {
    padding: 0;
}
.social-media ul li {
    list-style-type: none;
    float: left;
    font-size: 21px;
    margin-right: 15px;
    margin-top: 20px;
}
.social-media ul li a {} 
.social-media ul li a:hover { color:#f98e11; }
.cloud {}
.cloud img {  }
.f-cloud {
 width: 100%;
 float: left;
 position: absolute;
}


.f-cloud img {
    animation: cloudMove 20s linear infinite;
}
@keyframes cloudMove {
    0% {
        transform: translateX(100%) translateY(0);
    }
    25% {
        transform: translateX(75%) translateY(-5px);
    }
    50% {
        transform: translateX(50%) translateY(5px);
    }
    75% {
        transform: translateX(25%) translateY(-5px);
    }
    100% {
        transform: translateX(0) translateY(0);
    }
}


.logolar {
    width: 100%;
    float: left;
    margin-bottom: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.logolar img { filter:grayscale(100%);   }
.logolar img:hover { filter:grayscale(0%);  }
.logolar .owl-item { text-align:center; }
.logolar .owl-controls { margin-top:30px; }

.products  {}
.product-card .top-inf {
    position: absolute;
}
.product-card .top-inf span {
    float: left;
}
.product-card .top-inf .indirimli {}

.product-card {
    border: 1px solid #e7e7e7;
    padding: 15px;
    position: relative;
    width: 100%;
    float: left;
}
.product-card img {
    width: 100%;
    float: left;
}
.product-card h6 {
    font-size: 18px;
    color: #4facf5;
}
.product-card .info {}
.product-card .info .rating {
    width: 100%;
    float: left;
}
.product-card .info .rating i {
    color: red;
    float: left;
}
.product-card .price {}
.product-card .price h5 {}
.product-card .price span {}
.product-card .meta {
    border: 1px solid #e7e7e7;
    float: left;
    border-radius: 4px;
    padding: 5px;
}
.product-card .stok-var {}
.product-card .stok-yok {}
.indirimli img {
    width: 20px;
    float: left;
}
.product-card .incele-buton {}
.blog .blog-item:hover { border:1px solid #4fadf5; }

 


.blog-item {
    position: relative;
    display: inline-block;
    overflow: hidden;
}

.blog-item  img {
    display: block;
    width: 100%;
    transition: 0.4s ease-in-out;
}

.blog-item::before {
    content: "";
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(120deg, rgba(255, 255, 255, 0) 40%, rgba(255, 255, 255, 0.8) 50%, rgba(255, 255, 255, 0) 60%);
    transition: 0.5s;
}

.blog-item:hover::before {
    left: 100%;
}
.f-menu ul li a:hover { color:#258fe3;}
.incele-buton-2 {
    width: 60%;
    border: 2px solid #4fadf5;
    background: #4fadf5;
    border-radius: 30px;
    color: white;
    padding: 9px;
    background: white;
    color: #4fadf5!important;!importan;!importa;!import;!impor;!impo;!imp;!im;!i;!;
    font-weight: bold;
    margin-top: 10px;
    background: white;
    color: white;
    float: left;
    margin-left: 16%;
    margin-bottom: 15px;
} 
.incele-buton-2:hover { background:#4fadf5; color:white!important;}