body, html { height: 100%; }
body { font-family: "Brandon Grotesque"; padding-top: 132px; overflow: hidden; }
    body.load { overflow: auto; }
a, a:hover, a:focus { outline: 0; text-decoration: none; transition: 1s ease; -moz-transition: 1s ease; -webkit-transition: 1s ease; }

/*short*/
.fr { float: right; }
.fl { float: left; }
.di { display: inline-block; }
.db { display: block; }
.dn { display: none; }
.pr { position: relative; }
.pa { position: absolute; }
.pf { position: fixed; }
.tc { text-align: center; }
.tr { text-align: right; }
.mp { margin: 0; padding: 0; }
.pl { padding-left: 0; }
.pr0 { padding-right: 0; }
.fs30 { font-size: 30px; }
.fs24 { font-size: 24px; }
.fs16 { font-size: 16px; }
.tcell { display: table-cell; width: 999999px; vertical-align: middle; }
.wp { opacity: 0; -webkit-animation-delay: 0s; animation-delay: 0s; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; animation-name: none; }
    .wp.activeWp { opacity: 1; -webkit-animation-delay: 0s; animation-delay: 0s; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; }

ul { margin: 0; padding: 0; list-style-type: none; }
a:hover { text-decoration: none; }



/*header*/
#header { background-color: #fff; left: 0; position: fixed; top: 0; width: 100%; z-index: 99; }
    #header .wrapper { margin: 15px 0 0; }
    #header .logo { margin: 15px 0 20px; }
    #header .bayigirisi a { color: #fff; background: #1d93d1; display: inline-block; padding: 13px 30px; font-weight: 700; line-height: 0.96; }
    #header .logo img { height: 97px; transition: .5s ease; -moz-transition: .5s ease; -webkit-transition: .5s ease; }

    #header.s { box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); }
        #header.s .logo img { height: 60px; transition: .5s ease; -moz-transition: .5s ease; -webkit-transition: .5s ease; }
        #header.s .socialvbayigirisi { position: absolute; top: -200px; transition: .3s ease; }

/*sosyal*/
.social { margin: 2px 0 0 25px; }
    .social .fa { border: 1px solid; border-radius: 100%; color: #dadada; font-size: 16px; margin-right: 4px; overflow: hidden; white-space: pre; width: 35px; }
        .social .fa:Hover { color: #fff; border-color: transparent; }
        .social .fa::before { border-radius: 5px; display: inline-block; margin: 0 9999px 0 auto; min-width: 32px; padding: 8px 5px; text-align: center; }
        .social .fa.fa-facebook:hover { background: #3B5998; }
        .social .fa.fa-twitter:hover { background-color: #00acee; }
        .social .fa.fa-instagram:hover { background-color: #000; }
        .social .fa.fa-linkedin:hover { background-color: #3272BD; }
        .social .fa.fa-google-plus:hover { background-color: #D13F2D; }
        .social .fa.fa-pinterest:hover { background-color: #CE1E27; }
        .social .fa.fa-youtube:hover { background-color: #CE332D; }
        .social .fa.fa-envelope-o:hover { background-color: #000; }

/*menu*/
#nav { margin: 5px 0 0; }
    #nav li { display: block; float: left; }
        #nav li a { color: #b4b4b4; font-size: 16px; font-weight: 700; display: block; padding: 20px 15px 20px; border-bottom: 2px solid transparent; -webkit-transition: 0.3s ease-out; -moz-transition: 0.3s ease-out; -ms-transition: 0.3s ease-out; -o-transition: 0.3s ease-out; transition: 0.3s ease-out; }
            #nav li a:hover { color: #1d93d1; border-bottom: 2px solid #1d93d1; }
        #nav li:last-child a { padding-right: 0; }
            #nav li:last-child a:hover { padding-right: 15px; }

    #nav ul li { display: inline-block; position: relative; }
    #nav > ul ul { background: #1d93d1 none repeat scroll 0 0; display: none; left: 0; margin: 0; min-width: 250px; padding: 0; position: absolute; text-align: left; top: 55px; width: 100%; z-index: 9; }
    #nav > ul li:hover > ul { animation-delay: 0s; animation-duration: 0.5s; animation-fill-mode: both; animation-name: pulse; display: block; }
    #nav ul ul li { border-bottom: 1px solid rgba(255, 255, 255, 0.2); display: block; float: none; }
        #nav ul ul li a { border: medium none; color: #fff; display: block; font-size: 16px; font-weight: 600; padding: 10px 15px; }
        #nav ul ul li:hover { background-color: #d8d8d8; }
            #nav ul ul li:hover a { color: #fff; border: medium none; }





/*footer*/
#footer { margin: 75px 0 0; }
    #footer #ust { padding-bottom: 45px; }
    #footer #alt { background: #1d93d1; padding: 35px 0 25px; color: #fff; font-size: 16px; font-weight: 500; }
        #footer #alt a { color: #fff; display: block; font-size: 15px; font-weight: 500; }
        #footer #alt div { font-size: 15px; padding-left: 25px; }
        #footer #alt .adres { width: 55%; background: url(/images/adres.png) no-repeat; }
        #footer #alt .tel { width: 25%; background: url(/images/tel.png) no-repeat left 1px; }
        #footer #alt .mail { width: 14.5%; text-align: right; background: url(/images/mail.png) no-repeat left 3px; }
    #footer aside { padding: 35px 0 25px; color: #949494; font-weight: 500; }


/*iletşim*/
.sube h4, .contact h4 { font-size: 27px; margin: 10px 0; }
.sube > tbody > tr:first-child th { border: medium none; }
.contact > h4 { border-bottom: 1px solid #ddd; padding: 8px 0 18px; }
.sube .gmap a { color: #aaa !important; font-size: 14px; }
.contact .form-horizontal .control-label { text-align: left; }
.contact .btn { background-color:#1d93d1; color: #fff; font-size: 16px; font-weight: 600; margin-top: 31px; }
.form-control { border: 1px solid #ddd; box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1) inset; }
    .form-control:focus { border-color: #E61276; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(230, 18, 118, 0.30); outline: 0 none; }
.captcha > img { height: 28px; position: absolute; right: 16px; top: 3px; width: auto; }


/*ik*/
.mapHolder h3 { font-size: 20px; margin: 0 15px 10px; padding: 0; position: relative; text-align: center; }
    .mapHolder h3 span { background-color: #1d93d1; border-radius: 100%; color: #fff; display: block; font-size: 15px; height: 30px; line-height: 2; margin: 0 auto 15px; text-align: center; width: 30px; }
        .mapHolder h3 span::before { background-color: #eee; content: ""; height: 1px; left: 0; position: absolute; top: 15px; width: 100%; z-index: -1; }
#cv .formHolder input[type="file"] { margin: 0 auto 10px; max-width: 70px; }
.mapHolder .small, .formHolder .helper { color: #888; font-size: 12px; }
#personal .formHolder .img-thumbnail > img { max-width: 100%; }
#personal .btn { background: #E61276 none repeat scroll 0 0; }
.disabledHolder { opacity: 0.3; }


/*haberler*/
.haberlistesi .haberbaslik { color: #000; display: block; font-size: 18px; font-weight: 700; line-height: 20px; margin: 15px 0; }
.haberlistesi .haberaciklama { color: #949494; font-size: 14px; font-weight: 500; }
.haberlistesi a { display: block; margin-bottom: 40px; }
.haberlistesi .haberresim { height: 180px; overflow: hidden; width: 100%; }
    .haberlistesi .haberresim img { height: 100%; object-fit: cover; width: 100%; }
.haberlistesi a:hover .haberresim img { animation-delay: 0s; animation-duration: 0.5s; animation-fill-mode: both; animation-name: pulse; }

.haberdetay > h2 { margin: 0; }
.haberdetay .habertarih { color: #aaa; margin-bottom: 20px; }
.haberdetay .habericerik { text-align: justify; }


/*ürünler*/
#urunler.owl-carousel { z-index: 35; }
#urunler .owl-dot span { background-color: transparent; border-radius: 0; display: block; height: auto; margin: 0; text-align: right; width: auto; background-image: url("/images/menu-li.png"); background-position: 95% center; background-repeat: no-repeat; color: #fff; padding: 10px 35px 10px 15px; }
#urunler .owl-dot { display: block; text-align: right; border-radius: 4px; }
    #urunler .owl-dot:Hover,
    #urunler .owl-dot.active { background-color: #337ab7; }
#urunler .owl-controls { padding: 20px; }
#urunler .row.item.biurun { width: calc(100% - 300px); }
#urunler .anagorsel img { box-shadow: 5px 15px 20px rgba(0, 0, 0, 0.3); object-fit: cover; }

.urunfotogaleri { padding: 30px 0; }
    .urunfotogaleri a { border-radius: 10px; box-shadow: 0 10px 10px #eee; display: block; height: 100px; margin: 0 0 20px; overflow: hidden; width: 100%; }
        .urunfotogaleri a img { height: 100%; object-fit: cover; width: 100%; }
        .urunfotogaleri a:hover img { animation-delay: 0s; animation-duration: 0.5s; animation-fill-mode: both; animation-name: pulse; }



/*loader*/
body.load .loader { display: none; }
.loader { background-color: #fff; height: 100%; left: 0; position: fixed; top: 0; width: 100%; z-index: 9999999; }
.cssload-loader-inner { bottom: 0; height: 105px; left: 0; margin: auto; position: absolute; right: 0; top: 0; width: 175px; }

.cssload-cssload-loader-line-wrap-wrap { animation: cssload-spin 1600ms cubic-bezier(.175, .885, .32, 1.275) infinite; -o-animation: cssload-spin 1600ms cubic-bezier(.175, .885, .32, 1.275) infinite; -ms-animation: cssload-spin 1600ms cubic-bezier(.175, .885, .32, 1.275) infinite; -webkit-animation: cssload-spin 1600ms cubic-bezier(.175, .885, .32, 1.275) infinite; -moz-animation: cssload-spin 1600ms cubic-bezier(.175, .885, .32, 1.275) infinite; box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; height: 88px; left: 0; overflow: hidden; position: absolute; top: 0; transform-origin: 50% 100%; -o-transform-origin: 50% 100%; -ms-transform-origin: 50% 100%; -webkit-transform-origin: 50% 100%; -moz-transform-origin: 50% 100%; width: 175px; }
.cssload-loader-line-wrap { border: 7px solid transparent; border-radius: 100%; -o-border-radius: 100%; -ms-border-radius: 100%; -webkit-border-radius: 100%; -moz-border-radius: 100%; box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; height: 175px; left: 0; margin: 0 auto; position: absolute; right: 0; top: 0; width: 175px; }
.cssload-cssload-loader-line-wrap-wrap:nth-child(1) { animation-delay: -40ms; -o-animation-delay: -40ms; -ms-animation-delay: -40ms; -webkit-animation-delay: -40ms; -moz-animation-delay: -40ms; }
.cssload-cssload-loader-line-wrap-wrap:nth-child(2) { animation-delay: -80ms; -o-animation-delay: -80ms; -ms-animation-delay: -80ms; -webkit-animation-delay: -80ms; -moz-animation-delay: -80ms; }
.cssload-cssload-loader-line-wrap-wrap:nth-child(3) { animation-delay: -120ms; -o-animation-delay: -120ms; -ms-animation-delay: -120ms; -webkit-animation-delay: -120ms; -moz-animation-delay: -120ms; }
.cssload-cssload-loader-line-wrap-wrap:nth-child(4) { animation-delay: -160ms; -o-animation-delay: -160ms; -ms-animation-delay: -160ms; -webkit-animation-delay: -160ms; -moz-animation-delay: -160ms; }
.cssload-cssload-loader-line-wrap-wrap:nth-child(5) { animation-delay: -200ms; -o-animation-delay: -200ms; -ms-animation-delay: -200ms; -webkit-animation-delay: -200ms; -moz-animation-delay: -200ms; }

.cssload-cssload-loader-line-wrap-wrap:nth-child(1) .cssload-loader-line-wrap { border-color: rgb(255,255,255); height: 158px; width: 158px; top: 12px; }
.cssload-cssload-loader-line-wrap-wrap:nth-child(2) .cssload-loader-line-wrap { border-color: rgb(255,255,255); height: 133px; width: 133px; top: 25px; }
.cssload-cssload-loader-line-wrap-wrap:nth-child(3) .cssload-loader-line-wrap { border-color: rgb(29,147,209); height: 109px; width: 109px; top: 37px; }
.cssload-cssload-loader-line-wrap-wrap:nth-child(4) .cssload-loader-line-wrap { border-color: rgb(29,147,209); height: 84px; width: 84px; top: 49px; }
.cssload-cssload-loader-line-wrap-wrap:nth-child(5) .cssload-loader-line-wrap { border-color: rgb(29,147,209); height: 60px; width: 60px; top: 61px; }




@keyframes cssload-spin {
    0%, 15% { transform: rotate(0); transform: rotate(0); }
    100% { transform: rotate(360deg); transform: rotate(360deg); }
}

@-o-keyframes cssload-spin {
    0%, 15% { -o-transform: rotate(0); transform: rotate(0); }
    100% { -o-transform: rotate(360deg); transform: rotate(360deg); }
}

@-ms-keyframes cssload-spin {
    0%, 15% { -ms-transform: rotate(0); transform: rotate(0); }
    100% { -ms-transform: rotate(360deg); transform: rotate(360deg); }
}

@-webkit-keyframes cssload-spin {
    0%, 15% { -webkit-transform: rotate(0); transform: rotate(0); }
    100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}

@-moz-keyframes cssload-spin {
    0%, 15% { -moz-transform: rotate(0); transform: rotate(0); }
    100% { -moz-transform: rotate(360deg); transform: rotate(360deg); }
}

@keyframes imageAnimation {
    0% { opacity: 1; }
    100% { opacity: 1; transform: scale(1.25); }
}