@charest "utf-8";
/* author Wathek Hafez */

/* Master Sayfaları */

@import url("master.css");

/* Banner */
.slider {
    width: 100%;
    height: 555px;
    border-radius: 0 0 6px 6px;
    position: relative;
    overflow: hidden
}

.slider div div {
    height: 270px;
    overflow: hidden;
    text-transform: uppercase;
    line-height: 470px;
    color: #344b06;
    text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.28);
    font-size: 70px;
    font-family: 'icon';
    text-align: center;
    margin-bottom: 20px
}

.slider h1 {
    text-transform: capitalize;
    text-align: center;
    text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.28);
    font-family: 'adelle-bold';
    font-size: 88px;
    color: #344b06
}

.slider p {
    text-align: center;
    text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.28);
    font-family: 'adelle-semibold';
    font-size: 21px;
    color: #344b06;
    padding: 0 85px
}

section .banner {
    width: 100%;
    height: 485px;
    overflow: hidden;
    position: relative;
    border: 1px solid #fff
}

section .banner .urun-k {
    display: flex
}

section .banner .urun-n {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translate(-50%, 0)
}

section .banner .urun-n li {
    width: 15px;
    height: 15px;
    border-radius: 15px;
    background-color: #fff;
    opacity: .84;
    display: inline-block;
    border-color: #fff;
    margin: 0 2px;
    cursor: pointer;
    -webkit-transition: all .1s ease-in-out;
    -moz-transition: all .1s ease-in-out;
    transition: all .1s ease-in-out
}

section .banner .urun-n li:hover,
section .banner .urun-n .urun-active {
    border: 2px solid #fff;
    background-color: transparent;
    transform: scale(1.25);
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out
}

section .banner .banner-sag,
section .banner .banner-sol {
    width: 65px;
    height: 59px;
    background-image: url(../img/urunler-banner-ok.png);
    background-position: right center;
    position: absolute;
    top: 220px;
    cursor: pointer;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out
}

section .banner .banner-sol {
    left: 20px
}

section .banner .banner-sag {
    right: 20px;
    transform: rotate(180deg)
}

section .banner .banner-sag:hover,
section .banner .banner-sol:hover {
    background-position: left center;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out
}

section .urunler {
    width: 100%;
    padding-top: 10px;
    background-image: url(../img/urunler-banner-zemin.jpg);
    background-position: bottom center;
    position: relative;
    height: 510px
}

section .ciz-1 {
    width: 100%;
    height: 5px;
    border-top: 1px solid #3e424b;
    border-bottom: 1px solid #3e424b;
    top: 45px;
    position: absolute
}

section .urunler h2 {
    background-color: #1b1f27;
    text-align: center;
    height: 75px;
    line-height: 75px;
    background-image: url(../img/faaliyet.png);
    text-transform: uppercase;
    font-family: 'Roboto';
    font-weight: 300;
    font-size: 23px;
    position: relative;
    width: 350px;
    margin: 0 auto;
    color: #c3c6ce;
    margin-bottom: 35px
}

section .urunler .urunlerbanner {
    width: 100%;
    overflow: hidden;
    position: relative
}

section .urunler .urunlerbanner .bannerler {
    margin: 0 49px 0 65px
}

section .urunler .urunlerbanner .bannerler .banner {
    height: 323px;
    float: left;
    margin-right: 16px;
    width: 248px;
    border: 1px solid #acaeb1;
    position: relative;
    padding: 215px 0 0 25px;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

section .urunler .urunlerbanner .bannerler .banner:hover {
    padding-top: 200px;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

section .urunler .urunlerbanner .bannerler .banner:after {
    content: "";
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center bottom;
    background-image: url(../img/urun-shadow.png);
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1
}

section .urunler .urunlerbanner .bannerler .banner {
    color: #fff;
    text-transform: uppercase;
    text-shadow: 0px 1px 1px rgba(5, 5, 5, 0.34);
    font-family: 'adelle-extrabold';
    font-size: 21px;
    letter-spacing: .8px;
    position: relative;
    z-index: 2
}

section .urunler .urunlerbanner .bannerler .banner p span {
    display: block;
    font-family: 'adelle-regular'
}

section .urunler .urunlerbanner .bannerler .banner a {
    color: #c3c6ce;
    font-family: 'Roboto';
    font-weight: 300;
    font-size: 15px;
    text-transform: capitalize;
    text-shadow: 0px 1px 1px rgba(5, 5, 5, 0.44);
    padding-right: 22px;
    background-image: url(../img/urunler-detay-ok.png);
    background-position: right bottom;
    position: relative;
    z-index: 2
}

.slick-dots {
    display: inline-block;
    position: relative;
    left: 50%;
    transform: translate(-50%, 0);
    margin-top: 25px
}

.slick-dots li {
    background-color: #434852;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    float: left;
    margin: 0 2px;
    cursor: pointer
}

.slick-dots li * {
    font-size: 0
}

.slick-dots li:hover,
.slick-dots .slick-active {
    background-color: transparent;
    border: 2px solid #434852
}

.slick-arrow {
    background-image: url(../img/urunler-ok.png);
    background-position: right center;
    opacity: .87;
    width: 57px;
    height: 54px;
    position: absolute;
    top: 140px;
    cursor: pointer;
    background-color: transparent;
    font-size: 0;
    -webkit-transition: all .1s ease-in-out;
    -moz-transition: all .1s ease-in-out;
    transition: all .1s ease-in-out
}

.slick-prev {
    left: -64px
}

.slick-next {
    right: -49px;
    transform: rotate(180deg)
}

.slick-arrow:hover {
    opacity: 1;
    background-position: left center;
    -webkit-transition: all .1s ease-in-out;
    -moz-transition: all .1s ease-in-out;
    transition: all .1s ease-in-out
}

section .hizli-menu {
    padding: 20px 15px 5px 0
}

section .hizli-menu .nedenbiz,
section .hizli-menu .sertifika {
    margin: 0 0 15px 15px;
    float: left;
    height: 220px;
    width: 48.702%;
    background-size: cover;
    padding: 63px 35px;
    position: relative
}

section .hizli-menu .nedenbiz {
    background-image: url(../img/tarihcemiz-zemin.jpg);
    border: 1px solid #ffb84b
}

section .hizli-menu .sertifika {
    background-image: url(../img/sertifikalar-zemin.jpg);
    border: 1px solid #96d20f
}

section .hizli-menu > div h3 {
    color: #f1f1f1;
    font-size: 34px;
    font-family: 'adelle-extrabold';
    text-transform: uppercase;
    text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.27);
    position: relative
}

section .hizli-menu > div h3 span {
    font-size: 23px;
    font-family: 'adelle-regular';
    display: block
}

section .hizli-menu >div h3:before {
    content: "";
    width: 40px;
    height: 3px;
    background-color: #f2f2f2;
    position: absolute;
    top: -11px;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out
}

section .hizli-menu > div:hover h3:before {
    width: 290px;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out
}

section .hizli-menu > div p {
    font-size: 14px;
    font-family: 'Roboto';
    font-weight: 400;
    text-shadow: 0px 1px 1px rgba(151, 98, 14, 0.38);
    width: 325px;
    color: #fff;
    display: inline
}

section .hizli-menu > div > a {
    height: 34px;
    line-height: 35px;
    position: absolute;
    bottom: 35px;
    text-transform: uppercase;
    font-size: 14px;
    font-family: 'Roboto';
    font-weight: 400;
    border-radius: 17px;
    background-position: right 22px center;
    padding: 0 45px 0 22px;
    cursor: pointer;
    display: block;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out
}

section .hizli-menu > div > a:hover {
    letter-spacing: 1px;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out
}

section .hizli-menu .nedenbiz > a {
    background-color: #ffd672;
    color: #bc7910;
    background-image: url(../img/nedenbiz-ok.png)
}

section .hizli-menu .sertifika > a {
    background-color: #99cb24;
    color: #5b7e07;
    background-image: url(../img/sertifikalar-ok.png)
}

@media (max-width: 1150px) {
    
    .slider {
        height: 525px
    }
    
    .slider div div {
        font-size: 55px;
        margin-bottom: 10px
    }
    
    .slider h1 {
        font-size: 35px
    }
    
    .slider p {
        font-size: 15px;
        padding: 0 10px
    }
    
    section .banner {
        height: 140px
    }
    
    section .banner .urun-k li {
        background-size: cover
    }
    
    section .banner .urun-n {
        bottom: 10px
    }
    
    section .banner .urun-n li {
        width: 10px;
        height: 10px
    }
    
    
    section .banner .banner-sag,
    section .banner .banner-sol {
        background-size: contain;
        height: 30px;
        width: 33px;
        top: 60px
    }
    
    section .urunler .urunlerbanner .bannerler .banner,
    section .urunler .urunlerbanner .bannerler .banner:after {
        background-size: cover;
        background-position: center bottom
    }

    section .hizli-menu .sertifika,
    section .hizli-menu .nedenbiz {
        width: 100%;
        padding: 50px 25px
    }
}