/*
Theme Name: Nature - Responsive One Page Template
Description: Nature - Responsive One Page Template
Version: 1.0
Author: Metrothemes
Author URI: http://themeforest.net/user/metrothemes/profile?ref=metrothemes
*/


/* Global Styles

-------------------------------------------------- 

*/


body {
    font-size: 12px;
    color: #8a8a8a;
    font-family: 'OpenSansRegular', Arial, sans-serif;
    line-height: 18px;
    background: #fff;
}


#livechat-compact-container {
    /*height: 153px;*/
    position: fixed;
    right: 0;
    /*top: 200px;
    top: 86vh;*/
    bottom: 0px;
    z-index: 10000;
    width: 250px;
    position: fixed;
    text-align: center;
    right: -118px;
    bottom: -35px;
    z-index: 10000;
}

.btn-chat i {
    font-family: arial;
    color: #fff;
    text-decoration: none;
    background: red;
    padding: 11px 3px 15px;
    display: block;
    font-weight: bold;
    font-size: 14px;
    box-shadow: 0 0 0 1px red inset;
    /*border: 1px solid #144866;*/
    border-radius: 2px;
    -ms-transform: rotate(-40deg) translate(0, -20px);
    -webkit-transform: rotate(-40deg) translate(0, -20px);
    transform: rotate(-40deg) translate(0, -50px);
    position: relative;
    /*right: -27px;*/
    transition: background 0.2s, right 0.2s;
    cursor: pointer;
}



/*chat end*/
h1, h2, h3, h4, h5, h6 {
    font-weight: normal;
    font-family: 'BebasRegular', Arial, sans-serif;
    text-rendering: optimizeSpeed;
}

h1 {
    color: #13AFE2;
    font-size: 62px;
    line-height: 66px;
    word-spacing: 10px;
}

h2 {
    color: #000;
    font-size: 44px;
    line-height: 56px;
    word-spacing: 8px;
}

h3 {
    color: #2e2e2e;
    font-size: 20px;
    line-height: 24px;
    word-spacing: 3px;
}

h4 {
    color: #2e2e2e;
    font-size: 18px;
    line-height: 22px;
    word-spacing: 5px;
}

h5 {
    color: #333;
    font-size: 16px;
    line-height: 20px;
    word-spacing: 5px;
}

h6 {
    color: #000;
    font-size: 14px;
    line-height: 18px;
    word-spacing: 3px;
}

a {
    color: #13AFE2;
    text-decoration: none !important;
    -webkit-transition: color 1s;
    -moz-transition: color 1s;
    -o-transition: color 1s;
    -ms-transition: color 1s;
    transition: color 1s;
}

    a:hover {
        color: #333333;
    }

#note {
    color: #ff0000;
    font-size: 11px;
    line-height: 14px;
    margin-bottom: 15px;
}

.section-title {
    text-align: center;
    padding-bottom: 10px;
}

    .section-title h2 {
        margin: 0;
        padding-bottom: 20px;
    }

        .section-title h2 span {
            background: url(../img/section-title.png) no-repeat bottom center;
            padding: 0 20px 20px;
        }

    .section-title p {
        font-size: 18px;
        color: #000;
        line-height: 22px;
        margin: 0;
    }

.section-title-Deneme {
    text-align: center;
    padding-bottom: 10px;
}

    .section-title-Deneme h2 {
        margin: 0;
        padding-bottom: 20px;
    }

        .section-title-Deneme h2 span {
            /*background: url(../img/section-title.png) no-repeat bottom center;*/
            padding: 0 20px 20px;
        }

    .section-title-Deneme p {
        font-size: 18px;
        color: #000;
        line-height: 22px;
        margin: 0;
    }

.section-subtitle {
    text-align: center;
    padding-bottom: 58px;
}

    .section-subtitle h2 {
        margin: 0;
    }

ul.social {
    list-style: none;
    margin: 0px;
    text-align: center;
}

    ul.social > li {
        width: 30px;
        height: 30px;
        display: inline-block;
        padding: 0 2px;
    }

        ul.social > li a {
            display: block;
            width: 30px;
            height: 30px;
            overflow: hidden;
            -webkit-transition: background 0.5s;
            -moz-transition: background 0.5s;
            -o-transition: background 0.5s;
            -ms-transition: background 0.5s;
            transition: background 0.5s;
            text-indent: -999px;
        }

            ul.social > li a.twitter {
                background: url(../img/social-icon/twitter.png) no-repeat left top;
            }

                ul.social > li a.twitter:hover {
                    background: url(../img/social-icon/twitter.png) no-repeat left bottom;
                }

            ul.social > li a.facebook {
                background: url(../img/social-icon/facebook.png) no-repeat left top;
            }

                ul.social > li a.facebook:hover {
                    background: url(../img/social-icon/facebook.png) no-repeat left bottom;
                }

            ul.social > li a.rss {
                background: url(../img/social-icon/rss.png) no-repeat left top;
            }

                ul.social > li a.rss:hover {
                    background: url(../img/social-icon/rss.png) no-repeat left bottom;
                }

            ul.social > li a.forrst {
                background: url(../img/social-icon/forrst.png) no-repeat left top;
            }

                ul.social > li a.forrst:hover {
                    background: url(../img/social-icon/forrst.png) no-repeat left bottom;
                }

            ul.social > li a.dribbble {
                background: url(../img/social-icon/dribbble.png) no-repeat left top;
            }

                ul.social > li a.dribbble:hover {
                    background: url(../img/social-icon/dribbble.png) no-repeat left bottom;
                }

.flexslider {
    margin: 0 0 60px;
    background: none;
    border: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    -o-box-shadow: none;
    box-shadow: none;
}

    .flexslider .slides img {
        width: 100%;
        display: block;
        -webkit-border-radius: 10px;
        -moz-border-radius: 10px;
        -o-border-radius: 10px;
        border-radius: 10px;
    }


/* Home
-------------------------------------------------- */
.home {
    position: relative;
}

.logo {
    position: absolute;
    /*left:34%;*/
    top: 11%;
    width: 500px;
    z-index: 11;
    text-align: left;
    left: -3%;
}

.anket {
    position: fixed;
    bottom: 0;
    left: 0;
    margin: 30px;
}

/* Home Slider
-------------------------------------------------- */
#homeCarousel.carousel .container {
    position: relative;
    z-index: 9;
}

#homeCarousel .carousel-control {
    width: 66px;
    height: 65px;
    margin-top: 0;
    top: 44%;
    border: 0;
    text-indent: -9999px;
    z-index: 210;
    overflow: hidden;
}

    #homeCarousel .carousel-control.left {
        background: url(../img/home-slider/left.png) no-repeat left top;
        left: 2.5%;
    }

    #homeCarousel .carousel-control.right {
        background: url(../img/home-slider/right.png) no-repeat left top;
        right: 2.5%;
    }

    #homeCarousel .carousel-control.left:hover {
        background: url(../img/home-slider/left.png) no-repeat left bottom;
    }

    #homeCarousel .carousel-control.right:hover {
        background: url(../img/home-slider/right.png) no-repeat left bottom;
    }

#homeCarousel.carousel {
    margin: 0;
}

    #homeCarousel.carousel .item {
        height: 450px;
    }

    #homeCarousel.carousel img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

.fill {
    width: 100%;
    height: 100%;
    background-position: center center;
    background-size: contain;
    display: block;
    margin: 0 auto;
    background-repeat: no-repeat;
 
}

#homeCarousel .carousel-caption {
    background-color: transparent;
    position: static;
    padding: 0;
    padding: 22% 5% 0;
    text-align: center;
    text-shadow: 0px 3px 1px rgba(51,87,0,.5);
    word-spacing: 12px;
    width: 90%;
    margin: 0 auto;
}

    #homeCarousel .carousel-caption h1 {
        margin: 0;
        font-family: 'AngillaTattooPersonalUse', Arial, sans-serif;
        text-transform: none;
        padding-bottom: 12px;
        background: url(../img/carousel-caption.png) no-repeat 50% 70%;
        word-spacing: 0;
        color: #13AFE2;
    }

    #homeCarousel .carousel-caption h2 {
        margin: 0;
        line-height: 78px;
        font-size: 64px;
        color: #fff;
    }

    #homeCarousel .carousel-caption p {
        margin: 0;
        line-height: 60px;
        font-size: 44px;
        color: #13AFE2;
        font-family: 'BebasRegular', Arial, sans-serif;
    }

/* Navigation
-------------------------------------------------- */
.navbar {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 12;
    background: url(../img/navbar-top-border.png) repeat-x left top;
    padding-top: 2px;
}

    .navbar,
    .navbar .nav {
        margin: 0;
        float: none;
        background-color: #004882;
    }

        .navbar .navbar-inner {
            overflow: hidden;
            border: 0;
            min-height: 86px;
            background: none;
            padding: 0;
            -webkit-border-radius: 0px;
            -moz-border-radius: 0px;
            -o-border-radius: 0px;
            border-radius: 0px;
            -webkit-box-shadow: none;
            -moz-box-shadow: none;
            -o-box-shadow: none;
            box-shadow: none;
        }

        .navbar ul.nav {
            text-align: center;
        }

        .navbar .nav > li {
            display: inline-block;
            float: none;
        }

            .navbar .nav > li a {
                padding: 0px 10px;
                display: block;
                color: #fff;
                text-shadow: none;
                font-size: 18px;
                line-height: 86px;
                font-family: 'BebasRegular', Arial, sans-serif;
                -webkit-transition: background 1s;
                -moz-transition: background 1s;
                -o-transition: background 1s;
                -ms-transition: background 1s;
                transition: background 1s;
            }

                .navbar .nav > li a:hover,
                .navbar .nav > li a:focus,
                .navbar .nav > .active a,
                .navbar .nav > .active a:hover,
                .navbar .nav > .active a:focus {
                    background: rgba(0, 0, 0, 0.1);
                    -webkit-box-shadow: none;
                    -moz-box-shadow: none;
                    -o-box-shadow: none;
                    box-shadow: none;
                    color: #13AFE2;
                }


/* Main Content
-------------------------------------------------- */
#main-content {
    background: url(../img/main-content.png) repeat-x;
}


/* Service
-------------------------------------------------- */
.service {
    border-top: 9px solid #13AFE2;
    padding: 30px 0 0px 0;
    background: url(../img/section-arrow.png) no-repeat top center;
}

.service-row {
    padding: 0 120px;
}

.service-span {
    width: 290px;
}

.service-box {
    text-align: center;
    padding: 33px 10px 45px;
}

    .service-box img {
        width: 162px;
        height: 162px;
    }

    .service-box h3 {
        margin: 0;
        padding: 27px 0;
    }

    .service-box p {
        margin: 0;
        padding-bottom: 25px;
    }

    .service-box a.btn {
        background: none;
        border: none;
        background: #848484;
        border: 1px solid #5a5a5a;
        color: #ffffff;
        padding: 0 20px;
        text-shadow: 0px 2px 2px rgba(0,0,0,.3);
        -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 1px 1px rgba(0, 0, 0, 0.3);
        -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 1px 1px rgba(0, 0, 0, 0.3);
        -o-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 1px 1px rgba(0, 0, 0, 0.3);
        box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 1px 1px rgba(0, 0, 0, 0.3);
        font-size: 12px;
        line-height: 35px;
        font-family: 'BebasRegular', Arial, sans-serif;
        word-spacing: 3px;
        -webkit-transition: background 1s;
        -moz-transition: background 1s;
        -o-transition: background 1s;
        -ms-transition: background 1s;
        transition: background 1s;
        -webkit-transition: color 1s;
        -moz-transition: color 1s;
        -o-transition: color 1s;
        -ms-transition: color 1s;
        transition: color 1s;
    }

        .service-box a.btn:hover {
            color: #4d514e;
            text-shadow: 0px 2px 2px rgba(255,255,255,.7);
            border: 1px solid ##13AFE2;
            background-color: #13AFE2;
        }

.other-service-row {
    padding: 0 -12px;
}

.other-service-span {
    width: 216px;
    margin: 0 12px;
}

.other-service-bg {
    overflow: hidden;
    background: #f3f2f2;
    border-bottom: 9px solid #13AFE2;
    padding: 0px -12px;
    margin: 45px 0 0 -12px;
}

.other-service-box {
    padding: 30px 0px 12px;
}

    .other-service-box h4 {
        margin: 0;
        padding: 15px 0 15px 65px;
        word-spacing: 2px;
        margin-bottom: 20px;
        -webkit-transition: background 0.5s;
        -moz-transition: background 0.5s;
        -o-transition: background 0.5s;
        -ms-transition: background 0.5s;
        transition: background 0.5s;
    }

        .other-service-box h4.other-service-1 {
            background: url(../img/service/other-service-1.png) no-repeat left top;
        }

        .other-service-box h4.other-service-2 {
            background: url(../img/service/other-service-2.png) no-repeat left top;
        }

        .other-service-box h4.other-service-3 {
            background: url(../img/service/other-service-3.png) no-repeat left top;
        }

        .other-service-box h4.other-service-4 {
            background: url(../img/service/other-service-4.png) no-repeat left top;
        }

        .other-service-box h4.other-service-5 {
            background: url(../img/service/other-service-5.png) no-repeat left top;
        }

        .other-service-box h4.other-service-6 {
            background: url(../img/service/other-service-6.png) no-repeat left top;
        }

        .other-service-box h4.other-service-1:hover {
            background: url(../img/service/other-service-1.png) no-repeat left bottom;
        }

        .other-service-box h4.other-service-2:hover {
            background: url(../img/service/other-service-2.png) no-repeat left bottom;
        }

        .other-service-box h4.other-service-3:hover {
            background: url(../img/service/other-service-3.png) no-repeat left bottom;
        }

        .other-service-box h4.other-service-4:hover {
            background: url(../img/service/other-service-4.png) no-repeat left bottom;
        }

        .other-service-box h4.other-service-5:hover {
            background: url(../img/service/other-service-5.png) no-repeat left bottom;
        }

        .other-service-box h4.other-service-6:hover {
            background: url(../img/service/other-service-6.png) no-repeat left bottom;
        }

    .other-service-box p {
        padding-bottom: 8px;
        margin: 0;
    }


/* About Us
-------------------------------------------------- */
.about-us {
    padding: 130px 0 0px 0;
    background: url(../img/small-section-arrow.png) no-repeat top center;
}

.about-us-row {
    padding: 0 120px;
}

.about-us-span {
    width: 210px;
}

.team-box-1 {
    text-align: center;
    padding: 8px 0px 50px;
}

.team-profile-image-1 {
    margin: 0 auto;
    width: 184px;
    height: 184px;
    overflow: hidden;
    text-indent: -999px;
    background: #272727 url(../img/team/team-profile-image.png) no-repeat bottom center;
    -webkit-border-radius: 92px;
    -moz-border-radius: 92px;
    -o-border-radius: 92px;
    border-radius: 92px;
    -webkit-transition: background 1s;
    -moz-transition: background 1s;
    -o-transition: background 1s;
    -ms-transition: background 1s;
    transition: background 1s;
}

    .team-profile-image-1:hover {
        background: #13AFE2 url(../img/team/team-profile-image-hover.png) no-repeat bottom center;
    }

.team-box-2 {
    text-align: center;
    padding: 8px 0px 50px;
}

.team-profile-image-2 {
    margin: 0 auto;
    width: 184px;
    height: 184px;
    overflow: hidden;
    text-indent: -999px;
    background: #272727 url(../img/team/team-profile-image1.png) no-repeat bottom center;
    -webkit-border-radius: 92px;
    -moz-border-radius: 92px;
    -o-border-radius: 92px;
    border-radius: 92px;
    -webkit-transition: background 1s;
    -moz-transition: background 1s;
    -o-transition: background 1s;
    -ms-transition: background 1s;
    transition: background 1s;
}

    .team-profile-image-2:hover {
        background: #13AFE2 url(../img/team/team-profile-image-hover1.png) no-repeat bottom center;
    }

.team-box-3 {
    text-align: center;
    padding: 8px 0px 50px;
}

.team-profile-image-3 {
    margin: 0 auto;
    width: 184px;
    height: 184px;
    overflow: hidden;
    text-indent: -999px;
    background: #272727 url(../img/team/team-profile-image3.png) no-repeat bottom center;
    -webkit-border-radius: 92px;
    -moz-border-radius: 92px;
    -o-border-radius: 92px;
    border-radius: 92px;
    -webkit-transition: background 1s;
    -moz-transition: background 1s;
    -o-transition: background 1s;
    -ms-transition: background 1s;
    transition: background 1s;
}

    .team-profile-image-3:hover {
        background: #13AFE2 url(../img/team/team-profile-image-hover3.png) no-repeat bottom center;
    }

.team-box-4 {
    text-align: center;
    padding: 8px 0px 50px;
}

.team-profile-image-4 {
    margin: 0 auto;
    width: 184px;
    height: 184px;
    overflow: hidden;
    text-indent: -999px;
    background: #272727 url(../img/team/team-profile-image2.png) no-repeat bottom center;
    -webkit-border-radius: 92px;
    -moz-border-radius: 92px;
    -o-border-radius: 92px;
    border-radius: 92px;
    -webkit-transition: background 1s;
    -moz-transition: background 1s;
    -o-transition: background 1s;
    -ms-transition: background 1s;
    transition: background 1s;
}

    .team-profile-image-4:hover {
        background: #13AFE2 url(../img/team/team-profile-image-hover2.png) no-repeat bottom center;
    }



.team-box h5 {
    margin: 0;
    color: #171717;
    padding-top: 20px;
}

.team-box span {
    font-size: 11px;
    display: block;
    line-height: 14px;
    padding: 4px 0 8px;
}

.team-box p {
    margin: 0;
    padding-bottom: 20px;
}

.testimonial-skill-row {
    padding: 0 110px;
}

.testimonial-span,
.skill-span {
    width: 100%;
}

.testimonial-box,
.skill-box {
    padding: 20px 0px 35px;
    text-align: center;
}

    .testimonial-box h4,
    .skill-box h4 {
        margin: 0;
        background: url(../img/small-section-title.png) no-repeat bottom center;
        padding-bottom: 10px;
    }

    .testimonial-box p,
    .skill-box p {
        font-size: 14px;
        color: #000;
        line-height: 18px;
        margin: 0;
        padding-bottom: 20px;
    }

#testimonialCarousel.carousel .container {
    position: relative;
    z-index: 9;
    width: auto;
}

#testimonialCarousel .carousel-control {
    width: 12px;
    height: 26px;
    margin-top: 0;
    top: 40px;
    border: 0;
    text-indent: -9999px;
    z-index: 10;
    overflow: hidden;
}

    #testimonialCarousel .carousel-control.left {
        background: url(../img/testimonial-slider/left.png) no-repeat left top;
        left: 30%;
    }

    #testimonialCarousel .carousel-control.right {
        background: url(../img/testimonial-slider/right.png) no-repeat left top;
        right: 30%;
    }

    #testimonialCarousel .carousel-control.left:hover {
        background: url(../img/testimonial-slider/left.png) no-repeat left bottom;
    }

    #testimonialCarousel .carousel-control.right:hover {
        background: url(../img/testimonial-slider/right.png) no-repeat left bottom;
    }

#testimonialCarousel.carousel {
    margin: 0;
}

    #testimonialCarousel.carousel .item {
        height: auto;
    }

    #testimonialCarousel.carousel img {
        margin: 0 auto;
        width: 92px;
        height: 100px;
    }

#testimonialCarousel .carousel-caption {
    background-color: transparent;
    position: static;
    width: auto;
    margin-top: 15px;
    padding: 0;
    text-align: center;
}

    #testimonialCarousel .carousel-caption h4 {
        margin: 0;
        color: #0C7192;
        line-height: 22px;
        word-spacing: 2px;
        padding: 5px 50px 14px;
        background: url(../img/testimonial-slider/testimonial-quot-top.png) no-repeat left top;
    }

        #testimonialCarousel .carousel-caption h4 span {
            color: #13AFE2;
        }

    #testimonialCarousel .carousel-caption p {
        margin: 0;
        font-size: 12px;
        color: #8a8a8a;
        padding-bottom: 10px;
    }

.testimonial-meta {
    font-size: 11px;
    line-height: 20px;
    word-spacing: 2px;
    font-family: 'BebasRegular', Arial, sans-serif;
    background: url(../img/testimonial-slider/testimonial-quot-bottom.png) no-repeat right bottom;
    padding: 11px 50px;
}

    .testimonial-meta a {
        padding: 0 3px;
    }

.skill-value {
    padding-top: 15px;
}

.progress {
    height: 30px;
    margin-bottom: 36px;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    -o-border-radius: 15px;
    border-radius: 15px;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    -o-box-shadow: none;
    box-shadow: none;
    background: none;
    background: #eff0f4;
}

.progress-striped .bar {
    background-color: #13AFE2;
}

.progress .bar {
    line-height: 30px;
    text-align: left;
    padding-left: 25px;
}


/* Newsletter
-------------------------------------------------- */
.newsletter {
    margin: 70px 0 0;
    background: url(../img/newsletter.jpg) repeat center fixed;
    background-size: cover !important;
    border-bottom: 9px solid #13AFE2;
}

.newsletter-box {
    text-align: center;
    padding: 50px 10px 0px;
}

    .newsletter-box h3 {
        margin: 0;
        font-size: 21px;
        line-height: 26px;
        color: #fff;
        word-spacing: 2px;
        padding-bottom: 8px;
        text-shadow: 0px 3px 1px rgba(51,87,0,.5);
    }

    .newsletter-box p {
        margin: 0;
        font-size: 19px;
        line-height: 24px;
        font-family: 'BebasRegular', Arial, sans-serif;
        color: #13AFE2;
        word-spacing: 2px;
        padding-bottom: 5px;
        text-shadow: 0px 3px 1px rgba(51,87,0,.5);
    }

.newsletter-form {
    width: 390px;
    margin: 0 auto;
    padding: 20px 0 50px;
    background: url(../img/newsletter-form.png) no-repeat top center;
}

.newsletter-form-box {
    padding: 10px 0;
    border: 1px solid #fced00;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0px 0px 20px 10px rgba(255, 255, 255, 0.3) inset, 0px 3px 3px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0px 0px 20px 10px rgba(255, 255, 255, 0.3) inset, 0px 3px 3px rgba(0, 0, 0, 0.2);
    -o-box-shadow: 0px 0px 20px 10px rgba(255, 255, 255, 0.3) inset, 0px 3px 3px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 0px 20px 10px rgba(255, 255, 255, 0.3) inset, 0px 3px 3px rgba(0, 0, 0, 0.2);
}

    .newsletter-form-box form {
        margin: 0;
    }

    .newsletter-form-box input {
        color: #969696;
        font-size: 14px;
        font-family: 'OpenSansRegular', Arial, sans-serif;
        background: #f9f9f9 url(../img/newsletter-input.png) no-repeat 10px center;
        border: 1px solid #8fd247;
        height: 24px;
        width: 208px;
        line-height: 24px;
        margin-right: 5px;
        padding: 5px 10px 5px 40px;
    }

        .newsletter-form-box input[type="email"]:focus {
            color: #969696;
            border: 1px solid #fced00 !important;
            -moz-box-shadow: 0 0 6px #F8B9B7;
            -webkit-box-shadow: 0 0 6px #F8B9B7;
            -o-box-shadow: 0 0 6px #F8B9B7;
            box-shadow: 0 0 6px #F8B9B7;
        }

    .newsletter-form-box button.btn {
        background: none;
        border: none;
        background: rgba(157, 209, 74, 1);
        color: #ffffff;
        text-shadow: none;
        padding: 0 10px;
        font-size: 12px;
        line-height: 35px;
        font-family: 'BebasRegular', Arial, sans-serif;
        word-spacing: 3px;
        -webkit-box-shadow: 0 1px 0 rgba(19, 175, 226, 1) inset, 0px 3px 3px rgba(0, 0, 0, 0.2);
        -moz-box-shadow: 0 1px 0 rgba(19, 175, 226, 1) inset, 0px 3px 3px rgba(0, 0, 0, 0.2);
        -o-box-shadow: 0 1px 0 rgba(19, 175, 226, 1) inset, 0px 3px 3px rgba(0, 0, 0, 0.2);
        box-shadow: 0 1px 0 rgba(19, 175, 226, 1) inset, 0px 3px 3px rgba(0, 0, 0, 0.2);
        -webkit-transition: background 1s;
        -moz-transition: background 1s;
        -o-transition: background 1s;
        -ms-transition: background 1s;
        transition: background 1s;
    }

        .newsletter-form-box button.btn:hover {
            background-color: #13AFE2;
        }

    .newsletter-form-box .required {
        font-weight: bold;
        color: #F00;
    }
    /* chrome, safari */
    .newsletter-form-box ::-webkit-input-placeholder {
        color: #969696 !important;
        font-size: 14px;
        font-family: 'OpenSansRegular', Arial, sans-serif;
    }
    /* mozilla */
    .newsletter-form-box input:-moz-placeholder {
        color: #969696 !important;
        font-size: 14px;
        font-family: 'OpenSansRegular', Arial, sans-serif;
    }
    /* ie (faux placeholder) */
    .newsletter-form-box input.placeholder-text {
        color: #969696 !important;
        font-size: 14px;
        font-family: 'OpenSansRegular', Arial, sans-serif;
    }


/* Portfolio
-------------------------------------------------- */
.portfolio {
    background: url(../img/section-arrow.png) no-repeat top center;
}

.portfolio-box {
    padding: 130px 0 0px 0;
    background: url(../img/portfolio.png) no-repeat top center;
}

.portfolio-slider-row {
    padding: 0 115px;
}

.portfolio-slider-span {
    width: 940px;
}

    .portfolio-slider-span .flex-direction-nav {
        display: none;
    }

    .portfolio-slider-span .flex-control-paging li a {
        width: 47px;
        height: 10px;
        background: #404040;
        background: rgba(64,64,64,1);
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        -o-border-radius: 5px;
        border-radius: 5px;
        -webkit-transition: background 1s;
        -moz-transition: background 1s;
        -o-transition: background 1s;
        -ms-transition: background 1s;
        transition: background 1s;
    }

        .portfolio-slider-span .flex-control-paging li a:hover,
        .portfolio-slider-span .flex-control-paging li a.flex-active {
            background: rgba(125,187,57,1);
            -webkit-box-shadow: inset 0 10px 10px rgba(0,0,0,0.1);
            -moz-box-shadow: inset 0 10px 10px rgba(0,0,0,0.1);
            -o-box-shadow: inset 0 10px 10px rgba(0,0,0,0.1);
            box-shadow: inset 0 10px 10px rgba(0,0,0,0.1);
        }

/**** Isotope Filtering ****/
.isotope-item {
    z-index: 2;
}

.isotope-hidden.isotope-item {
    pointer-events: none;
    z-index: 1;
}

/**** Isotope CSS3 transitions ****/
.isotope,
.isotope .isotope-item {
    -webkit-transition-duration: 0.8s;
    -moz-transition-duration: 0.8s;
    -ms-transition-duration: 0.8s;
    -o-transition-duration: 0.8s;
    transition-duration: 0.8s;
}

.isotope {
    -webkit-transition-property: height, width;
    -moz-transition-property: height, width;
    -ms-transition-property: height, width;
    -o-transition-property: height, width;
    transition-property: height, width;
}

    .isotope .isotope-item {
        -webkit-transition-property: -webkit-transform, opacity;
        -moz-transition-property: -moz-transform, opacity;
        -ms-transition-property: -ms-transform, opacity;
        -o-transition-property: -o-transform, opacity;
        transition-property: transform, opacity;
    }

        /**** disabling Isotope CSS3 transitions ****/
        .isotope.no-transition,
        .isotope.no-transition .isotope-item,
        .isotope .isotope-item.no-transition {
            -webkit-transition-duration: 0s;
            -moz-transition-duration: 0s;
            -ms-transition-duration: 0s;
            -o-transition-duration: 0s;
            transition-duration: 0s;
        }

.portfolio-photo-row {
    padding: 0 93px;
}

.portfolio-photo-span {
    width: 984px;
    margin-top: -101px;
}

#portfolio-options {
    border-top: 1px solid #d8d8d8;
    border-bottom: 1px solid #d8d8d8;
    margin: 84px 0 15px 0;
}

    #portfolio-options ul {
        margin: 0;
        list-style: none;
        text-align: center;
    }

    #portfolio-options li {
        display: inline-block;
        line-height: 68px;
    }

        #portfolio-options li a {
            display: block;
            color: #333333;
            font-size: 18px;
            padding: 0 12px;
            text-decoration: none;
            font-family: 'BebasRegular', Arial, sans-serif;
            -webkit-transition: background 1s;
            -moz-transition: background 1s;
            -o-transition: background 1s;
            -ms-transition: background 1s;
            transition: background 1s;
        }

            #portfolio-options li a:hover,
            #portfolio-options li a:active,
            #portfolio-options li a.selected {
                background: rgba(216,216,216,.8);
            }

#portfolio-container {
    padding: 30px 0 48px;
}

.photo {
    float: left;
    margin: 12px;
    overflow: hidden;
    position: relative;
    height: 304px;
    width: 304px;
    -webkit-border-radius: 152px;
    -moz-border-radius: 152px;
    -o-border-radius: 152px;
    border-radius: 152px;
}

.photo_kurumsal_dokuman {
    float: left;
    margin: 12px;
    overflow: hidden;
    position: relative;
    height: 304px;
    width: 304px;
    -webkit-border-radius: 152px;
    -moz-border-radius: 152px;
    -o-border-radius: 152px;
    border-radius: 152px;
}

.photo img {
    display: block;
    height: 300px;
    width: 300px;
    -webkit-border-radius: 150px;
    -moz-border-radius: 150px;
    -o-border-radius: 150px;
    border-radius: 150px;
    margin: 2px;
}

.photo .portfolio-item-hover {
    position: absolute;
    top: 0;
    left: 0;
    height: 304px;
    width: 304px;
    background: url(../img/portfolio-photo/portfolio-item-hover.png) no-repeat;
    opacity: 0;
    -webkit-border-radius: 152px;
    -moz-border-radius: 152px;
    -o-border-radius: 152px;
    border-radius: 152px;
    text-align: center;
}

.photo:hover .portfolio-item-hover {
    opacity: 1;
}

.photo a {
    display: block;
    height: 49px;
    width: 48px;
    position: absolute;
    top: 34%;
}

    .photo a.info {
        background: url(../img/portfolio-photo/zoom.png) no-repeat left top;
        left: 33%;
    }

        .photo a.info:hover {
            background: url(../img/portfolio-photo/zoom.png) no-repeat left bottom;
        }

    .photo a.link {
        background: url(../img/portfolio-photo/link.png) no-repeat left top;
        right: 33%;
    }

        .photo a.link:hover {
            background: url(../img/portfolio-photo/link.png) no-repeat left bottom;
        }

.photo h6 {
    margin: 0;
    padding: 185px 50px 0;
}

.photo p {
    margin: 0;
    font-size: 11px;
    color: #000;
    line-height: 14px;
    padding: 5px 60px 10px;
}

#pp_full_res img {
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;
}

.pp_nav,
.pp_description,
.pp_social {
    display: none;
}


/* Contact Us
-------------------------------------------------- */
.contact-us,
.respond {
    margin: 100px 0 0;
    background: url(../img/contact-us-bottom-shadow.png) no-repeat bottom center;
    padding-bottom: 104px;
}

.contact-us-box,
.respond-box {
    padding: 130px 0 55px;
}

.contact-us-box {
    background: url(../img/contact-us-box.jpg) repeat center fixed;
    background-size: cover !important;
}

.respond-box {
    background: url(../img/respond-box.png) repeat top center;
}

.contact-us-row {
    padding: 0 122px;
}

.contact-us .section-title h2 span {
    color: #fff;
    background: url(../img/contact-us-title.png) no-repeat bottom center;
}

.contact-us .section-title p,
.contact-us .section-subtitle h5 {
    color: #fff;
}

.send-message-form-span {
    width: 600px;
}

.send-message-form-box,
.contact-info-box {
    padding-bottom: 45px;
    text-align: center;
}

    .send-message-form-box h3 {
        background: url(../img/small-section-title.png) no-repeat bottom center;
    }

    .send-message-form-box h3,
    .contact-info-box h3 {
        color: #fff;
        margin: 0;
        padding-bottom: 35px;
    }

    .send-message-form-box p,
    .contact-info p {
        color: #fff;
        line-height: 22px;
        margin: 0;
        padding-top: 14px;
    }

.send-message-form {
    padding: 30px 0 40px;
}

    .send-message-form form {
        margin: 0;
    }

.message-textarea {
    position: relative;
}

.send-message-form input, .send-message-form select,
.send-message-form textarea {
    color: #ffffff;
    font-size: 12px;
    font-family: 'OpenSansRegular', Arial, sans-serif;
    background: #004882;
    border: 1px solid #8fd247;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -o-border-radius: 0;
    border-radius: 0;
}

.send-message-form input {
    height: 35px;
    width: 156px;
    margin: 0 10px 20px;
    padding: 0 10px;
}

.send-message-form select {
    height: 35px;
    width: 156px;
    margin: 0 10px 20px;
    padding: 0 10px;
}

.send-message-form textarea {
    height: 120px;
    resize: none;
    width: 93%;
    padding: 10px 10px;
}

    .send-message-form textarea:focus,
    .send-message-form input[type="text"]:focus,
    .send-message-form input[type="email"]:focus {
        border: 1px solid #ffffff !important;
        color: #ffffff;
        -moz-box-shadow: 0 0 6px #F8B9B7;
        -webkit-box-shadow: 0 0 6px #F8B9B7;
        -o-box-shadow: 0 0 6px #F8B9B7;
        box-shadow: 0 0 6px #F8B9B7;
    }

.send-message-form .required {
    font-weight: bold;
    color: #F00;
}

.submit-btn {
    background: url(../img/contact-submit-button.png) no-repeat;
    width: 79px;
    height: 79px;
    position: absolute;
    left: 20px;
    bottom: -37px;
    -webkit-border-radius: 40px;
    -moz-border-radius: 40px;
    -o-border-radius: 40px;
    border-radius: 40px;
    overflow: hidden;
}

    .submit-btn button.btn {
        background: none;
        width: 79px;
        height: 79px;
        padding: 0;
        margin: 0;
        border: none;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        -o-box-shadow: none;
        box-shadow: none;
    }

    .submit-btn:hover {
        opacity: .9;
    }

.submit-btn2 {
    background: url(../img/attach.png) no-repeat;
    width: 79px;
    height: 79px;
    position: absolute;
    right: 20px;
    bottom: -37px;
    -webkit-border-radius: 40px;
    -moz-border-radius: 40px;
    -o-border-radius: 40px;
    border-radius: 40px;
    overflow: hidden;
}

    .submit-btn2 button.btn2 {
        background: none;
        width: 79px;
        height: 79px;
        padding: 0;
        margin: 0;
        border: none;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        -o-box-shadow: none;
        box-shadow: none;
    }

    .submit-btn2:hover {
        opacity: .9;
    }


/* chrome, safari */
.send-message-form ::-webkit-input-placeholder {
    color: #fff !important;
    font-size: 11px;
    font-family: 'OpenSansRegular', Arial, sans-serif;
}
/* mozilla */
.send-message-form input:-moz-placeholder,
.send-message-form textarea:-moz-placeholder {
    color: #fff !important;
    font-size: 11px;
    font-family: 'OpenSansRegular', Arial, sans-serif;
}
/* ie (faux placeholder) */
.send-message-form input.placeholder-text,
.send-message-form textarea.placeholder-text {
    color: #fff !important;
    font-size: 11px;
    font-family: 'OpenSansRegular', Arial, sans-serif;
}

.contact-info-span {
    width: 296px;
}

.contact-info-box {
    background: url(../img/globe.png) no-repeat left 45px;
}

.contact-info {
    margin: 170px 0 0 30px;
}

    .contact-info a {
        color: #fff;
        text-decoration: none;
    }

.map-marker {
    background: url(../img/map-marker.png) no-repeat left top;
    padding: 0 0 35px 45px;
}

    .map-marker p {
        margin: 0;
        padding: 10px;
        color: #FFFFFF;
        line-height: 16px;
        -webkit-border-radius: 10px;
        -moz-border-radius: 10px;
        -o-border-radius: 10px;
        border-radius: 10px;
        text-align: left;
        background-color: #004882;
    }


/* Footer
-------------------------------------------------- */
.footer {
    border-bottom: 52px solid #13AFE2;
    text-align: center;
}

.footer-span {
    padding-bottom: 45px;
    background: url(../img/footer-arrow.png) no-repeat bottom center;
}

.scroll-top {
    height: 68px;
    width: 68px;
    margin: 0 auto;
    padding-bottom: 20px;
}

    .scroll-top a {
        background: url(../img/scroll-top.png) no-repeat;
        height: 68px;
        width: 68px;
        display: block;
        -webkit-border-radius: 34px;
        -moz-border-radius: 34px;
        -o-border-radius: 34px;
        border-radius: 34px;
        -webkit-transition: background 1s;
        -moz-transition: background 1s;
        -o-transition: background 1s;
        -ms-transition: background 1s;
        transition: background 1s;
    }

        .scroll-top a:hover {
            opacity: .9;
        }

.footer p {
    font-family: 'BebasRegular', Arial, sans-serif;
    font-size: 18px;
    color: #333;
    line-height: 0px;
    margin: 0;
    padding-bottom: 20px;
    word-spacing: 2px;
}


/* Blog
-------------------------------------------------- */
.blog {
    border-top: 9px solid #13AFE2;
    padding: 130px 0 0px 0;
    background: url(../img/section-arrow.png) no-repeat top center;
}

.blog-post-row,
.single-blog-post-row {
    padding: 0 115px;
}

.blog-post-span,
.single-blog-post-span {
    width: 940px;
    padding-bottom: 60px;
}

.blog-post-box {
    text-align: center;
    padding-bottom: 75px;
    margin-bottom: 50px;
    background: url(../img/blog-post-box.png) no-repeat bottom center;
}

.single-blog-post-span .blog-post-box {
    background: none;
    padding-bottom: 0;
}

.blog-post-box h4 {
    margin: 0;
    padding-bottom: 18px;
}

    .blog-post-box h4 a {
        color: #2e2e2e;
    }

        .blog-post-box h4 a:hover {
            color: #13AFE2;
        }

.blog-post-box p {
    margin: 0;
    padding-bottom: 20px;
}

.post-meta {
    padding-bottom: 40px;
}

    .post-meta a {
        padding: 6px 30px;
        color: #333333;
        margin: 0 5px;
        background: #e9e9e9;
        -webkit-border-radius: 12px;
        -moz-border-radius: 12px;
        -o-border-radius: 12px;
        border-radius: 12px;
        -webkit-transition: background 1s;
        -moz-transition: background 1s;
        -o-transition: background 1s;
        -ms-transition: background 1s;
        transition: background 1s;
    }

        .post-meta a:hover {
            background: #13AFE2;
        }

.post-featured-box {
    margin-top: 40px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;
    overflow: hidden;
}

    .post-featured-box .flexslider {
        margin-bottom: 0;
    }

    .post-featured-box .flex-direction-nav {
        display: block;
    }

        .post-featured-box .flex-direction-nav a {
            width: 66px;
            height: 65px;
            overflow: hidden;
            margin: -20px 0 0;
            background: none;
            opacity: 1;
            -webkit-transition: none;
        }

        .post-featured-box .flex-direction-nav .flex-next,
        .post-featured-box .flexslider:hover .flex-next {
            opacity: 1;
            right: 15px;
        }

        .post-featured-box .flex-direction-nav .flex-prev,
        .post-featured-box .flexslider:hover .flex-prev {
            opacity: 1;
            left: 15px;
        }

        .post-featured-box .flex-direction-nav a.flex-prev {
            background: url(../img/post-featured-box/left.png) no-repeat left top;
        }

        .post-featured-box .flex-direction-nav a.flex-next {
            background: url(../img/post-featured-box/right.png) no-repeat left top;
        }

        .post-featured-box .flex-direction-nav a.flex-prev:hover {
            background: url(../img/post-featured-box/left.png) no-repeat left bottom;
        }

        .post-featured-box .flex-direction-nav a.flex-next:hover {
            background: url(../img/post-featured-box/right.png) no-repeat left bottom;
        }

    .post-featured-box .flex-control-paging {
        display: none;
    }

.post-featured-video {
    position: relative;
    padding-bottom: 56.25%; /* 16/9 ratio */
    padding-top: 30px; /* IE6 workaround*/
    height: 0;
    overflow: hidden;
}

    .post-featured-video iframe,
    .post-featured-video object,
    .post-featured-video embed {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }


/* Comments
-------------------------------------------------- */
.comments-row {
    padding: 0 115px;
}

.comments-span {
    width: 940px;
}

.comments-box h3 {
    margin: 0;
    text-align: center;
    padding-bottom: 50px;
    background: url(../img/blog-post-box.png) no-repeat bottom center;
}

.comments-list-box {
    padding: 40px 0 70px;
}

.comments-list {
    border-top: 1px solid #e1e1e1;
    overflow: hidden;
    padding-bottom: 30px;
}

div.comments-list:first-child {
    border-top: none;
}

div.comments-list:nth-child(even) {
    margin-left: 10%;
    width: 90%;
}

.comment-author {
    overflow: hidden;
    padding: 20px 0;
}

.comment-author-vcard {
    float: left;
    width: 50px;
    height: 50px;
    overflow: hidden;
    background: url(../img/commnet-author-vcard.png) no-repeat;
}

.comment-author-meta {
    float: left;
    padding: 7px 0 7px 12px;
}

.comment-author-name a {
    color: #36c332;
    font-size: 14px;
}

.comment-meta a {
    color: #2e2e2e;
}

    .comment-author-name a:hover,
    .comment-meta a:hover {
        color: #8a8a8a;
    }

.comment-body {
    color: #2e2e2e;
}




/* Respond
-------------------------------------------------- */
.sending {
    display: none;
    color: #FFFFFF;
    font-size: 20px;
    line-height: 20px;
}

.respond {
    margin-top: 0px;
}

.respond-box {
    padding: 60px 0 20px;
}

.respond-row {
    padding: 0 115px;
}

.respond .send-message-form-span {
    width: 940px;
}

.respond .send-message-form-box h3 {
    margin: 0 auto;
    width: 65%;
}

.respond .send-message-form-box p {
    font-size: 18px;
    line-height: 22px;
    padding-bottom: 24px;
}

.respond .send-message-form input {
    width: 262px;
}

.respond .submit-btn {
    left: 5%;
}

.respond .submit-btn2 {
    left: 250px;
}


/* Responsive
-------------------------------------------------- */

/* Desktop large
------------------------- */
@media (min-width: 1200px) {

    .nav-collapse.affix {
        top: 0;
        background: url(../img/section-arrow.png) no-repeat bottom center;
        padding-bottom: 99px;
        width: 100%;
    }

        .nav-collapse.affix ul.nav {
            background: url(../img/nav-affix-bg.jpg) repeat top center;
            background-size: cover !important;
            border-bottom: 9px solid #13AFE2;
        }
    .fill {
        width: 100%;
        height: 100%;
        background-position: center center;
        background-size: contain;
        display: block;
        margin: 0 auto;
        background-repeat: no-repeat;
        background-size: cover;
    }

}
@media (min-width: 981px) and (max-width: 1199px) {
    .nav-collapse.affix {
        top: 0;
        background: url(../img/section-arrow.png) no-repeat bottom center;
        padding-bottom: 99px;
        width: 100%;
    }

        .nav-collapse.affix ul.nav {
            background: url(../img/nav-affix-bg.jpg) repeat top center;
            background-size: cover !important;
            border-bottom: 9px solid #13AFE2;
        }

    .fill {
        width: 100%;
        height: 100%;
        background-position: center center;
        background-size: contain;
        display: block;
        margin: 0 auto;
        background-repeat: no-repeat;
        background-size: cover;
    }
}

    /* Desktop
------------------------- */
    @media (max-width: 980px) {

        .nav-collapse.affix {
            top: 0;
            background: url(../img/section-arrow.png) no-repeat bottom center;
            padding-bottom: 99px;
            width: 100%;
        }

            .nav-collapse.affix ul.nav {
                background: url(../img/nav-affix-bg.jpg) repeat top center;
                background-size: cover !important;
                border-bottom: 9px solid #13AFE2;
            }

        .service {
            border-bottom: 9px solid #85C63E;
        }

        .service-row {
            padding: 0 15px;
        }

        .other-service-row {
            padding: 0px;
        }

        .other-service-bg {
            padding: 30px 6px 0;
            margin-left: 20px;
            border: none;
        }

        .other-service-span {
            margin: 0 8px;
        }

        .about-us-row {
            padding: 0 20px;
        }

        .testimonial-skill-row,
        .portfolio-slider-row,
        .portfolio-photo-row,
        .blog-post-row,
        .single-blog-post-row,
        .comments-row,
        .respond-row {
            padding: 0;
        }

        .portfolio-photo-span {
            width: 940px;
        }

        #portfolio-container {
            margin: 0 auto;
            width: 656px;
        }

        .contact-us-row {
            padding: 0 12px;
        }
    }

    /* Tablet to desktop
------------------------- */
    @media (min-width: 651px) and (max-width: 979px) {

        h2 {
            font-size: 34px;
            line-height: 46px;
        }

        .navbar {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            background: none;
            padding-top: 0;
        }

            .navbar .nav {
                padding-top: 5px;
            }

            .navbar .navbar-inner {
                min-height: 40px;
                background: url(../img/respond-box.png) no-repeat top center;
            }

            .navbar ul.nav {
                text-align: left;
            }

            .navbar .nav > li {
                display: block;
                float: none;
            }

                .navbar .nav > li a {
                    font-size: 14px;
                    line-height: 30px;
                    font-weight: normal;
                }

                    .navbar .nav > li a:hover,
                    .navbar .nav > li a:focus,
                    .navbar .nav > .active a,
                    .navbar .nav > .active a:hover,
                    .navbar .nav > .active a:focus {
                        color: #000;
                    }

        .nav-collapse.affix {
            padding-bottom: 0px;
            position: static;
        }

        .logo {
            position: absolute;
            /* left: 34%; */
            top: 16%;
            width: 416px;
            height: 300px;
            z-index: 11;
            text-align: left;
            left: -150px;
        }

        #homeCarousel.carousel .item {
            height: 250px;
            top: 35px;
        }

        #homeCarousel .carousel-caption {
            padding-top: 27%;
        }

        #homeCarousel .carousel-control.left {
            left: 0;
        }

        #homeCarousel .carousel-control.right {
            right: 0;
        }

        #homeCarousel .carousel-caption h1 {
            font-size: 42px;
            line-height: 46px;
        }

        #homeCarousel .carousel-caption h2 {
            font-size: 32px;
            line-height: 46px;
        }

        #homeCarousel .carousel-caption p {
            font-size: 24px;
            line-height: 36px;
        }

        .service-row {
            padding: 0px;
        }

        .service-span {
            width: 228px;
        }

        .other-service-bg {
            padding: 0px 0px 10px;
            margin: 45px 0 0 20px;
        }

        .other-service-span {
            width: 322px;
            margin: 0 20px;
        }

        .other-service-box {
            padding: 30px 0px 12px;
        }

        .about-us-row {
            padding: 0px;
        }

        .about-us-span {
            width: 352px;
        }

        .team-box {
            padding: 8px 20px 60px;
        }

        .testimonial-skill-row {
            padding: 0;
        }

        .testimonial-span,
        .skill-span {
            width: 352px;
        }

        .testimonial-meta a {
            display: block;
        }

        .portfolio-slider-span,
        .portfolio-photo-span,
        .blog-post-span,
        .single-blog-post-span,
        .comments-span,
        .respond .send-message-form-span {
            width: 724px;
        }

        #portfolio-container {
            margin: 0 auto;
            width: 656px;
        }

        .contact-us-row,
        .respond-row {
            padding: 0px;
            padding-left: 20px;
        }

        .send-message-form-span,
        .contact-info-span {
            margin: 0 auto;
            float: none;
        }

        .respond .send-message-form input {
            width: 194px;
        }
    }

    @media (min-width: 480px) and (max-width: 650px) {

        h2 {
            font-size: 34px;
            line-height: 46px;
        }

        .navbar {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            background: none;
            padding-top: 0;
        }

            .navbar .nav {
                padding-top: 5px;
            }

            .navbar .navbar-inner {
                min-height: 40px;
                background: url(../img/respond-box.png) no-repeat top center;
            }

            .navbar ul.nav {
                text-align: left;
            }

            .navbar .nav > li {
                display: block;
                float: none;
            }

                .navbar .nav > li a {
                    font-size: 14px;
                    line-height: 30px;
                    font-weight: normal;
                }

                    .navbar .nav > li a:hover,
                    .navbar .nav > li a:focus,
                    .navbar .nav > .active a,
                    .navbar .nav > .active a:hover,
                    .navbar .nav > .active a:focus {
                        color: #000;
                    }

        .nav-collapse.affix {
            padding-bottom: 0px;
            position: static;
        }

        .logo {
            position: absolute;
            /* left: 34%; */
            top: 16%;
            width: 416px;
            height: 300px;
            z-index: 11;
            text-align: left;
            left: -150px;
        }

        #homeCarousel.carousel .item {
            height: 210px;
            top: 47px;
        }

        #homeCarousel .carousel-caption {
            padding-top: 27%;
        }

        #homeCarousel .carousel-control.left {
            left: 0;
        }

        #homeCarousel .carousel-control.right {
            right: 0;
        }

        #homeCarousel .carousel-caption h1 {
            font-size: 42px;
            line-height: 46px;
        }

        #homeCarousel .carousel-caption h2 {
            font-size: 32px;
            line-height: 46px;
        }

        #homeCarousel .carousel-caption p {
            font-size: 24px;
            line-height: 36px;
        }

        .service-row {
            padding: 0px;
        }

        .service-span {
            width: 228px;
        }

        .other-service-bg {
            padding: 0px 0px 10px;
            margin: 45px 0 0 20px;
        }

        .other-service-span {
            width: 322px;
            margin: 0 20px;
        }

        .other-service-box {
            padding: 30px 0px 12px;
        }

        .about-us-row {
            padding: 0px;
        }

        .about-us-span {
            width: 352px;
        }

        .team-box {
            padding: 8px 20px 60px;
        }

        .testimonial-skill-row {
            padding: 0;
        }

        .testimonial-span,
        .skill-span {
            width: 352px;
        }

        .testimonial-meta a {
            display: block;
        }

        .portfolio-slider-span,
        .portfolio-photo-span,
        .blog-post-span,
        .single-blog-post-span,
        .comments-span,
        .respond .send-message-form-span {
            width: 724px;
        }

        #portfolio-container {
            margin: 0 auto;
            width: 656px;
        }

        .contact-us-row,
        .respond-row {
            padding: 0px;
            padding-left: 20px;
        }

        .send-message-form-span,
        .contact-info-span {
            margin: 0 auto;
            float: none;
        }

        .respond .send-message-form input {
            width: 194px;
        }
    }

    /* Tablet
------------------------- */
    @media (min-width: 359px) and (max-width: 479px) {

        .navbar {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            background: none;
            padding-top: 0;
        }

            .navbar .nav {
                padding-top: 5px;
            }

            .navbar .navbar-inner {
                min-height: 40px;
                background: url(../img/respond-box.png) no-repeat top center;
            }

            .navbar ul.nav {
                text-align: left;
            }

            .navbar .nav > li {
                display: block;
                float: none;
            }

                .navbar .nav > li a {
                    font-size: 14px;
                    line-height: 30px;
                    font-weight: normal;
                }

                    .navbar .nav > li a:hover,
                    .navbar .nav > li a:focus,
                    .navbar .nav > .active a,
                    .navbar .nav > .active a:hover,
                    .navbar .nav > .active a:focus {
                        color: #000;
                    }

        .nav-collapse.affix {
            padding-bottom: 0px;
            position: static;
        }

        .logo {
            position: absolute;
            /* left: 34%; */
            top: 13%;
            width: 300px;
            height: 300px;
            z-index: 11;
            text-align: left;
            left: -150px;
        }

        #homeCarousel.carousel .item {
            height: 165px;
            top: 35px;
        }

        #homeCarousel .carousel-caption {
            padding-top: 200px;
        }

        #homeCarousel .carousel-control {
            display: none;
        }

            #homeCarousel .carousel-control.left {
                left: 0;
            }

            #homeCarousel .carousel-control.right {
                right: 0;
            }

        #homeCarousel .carousel-caption h1 {
            font-size: 32px;
            line-height: 36px;
        }

        #homeCarousel .carousel-caption h2 {
            font-size: 22px;
            line-height: 36px;
        }

        #homeCarousel .carousel-caption p {
            font-size: 20px;
            line-height: 30px;
        }

        .service-row,
        .other-service-row,
        .about-us-row,
        .testimonial-skill-row,
        .contact-us-row {
            padding: 0px;
        }

        .service-span,
        .about-us-span {
            width: 350px;
            float: none;
            margin: 0 auto;
        }

        .other-service-bg {
            margin: 0;
            padding: 30px;
        }

        .other-service-span,
        .testimonial-span,
        .skill-span,
        .comments-span,
        .send-message-form-span {
            margin: 0 auto;
            width: 100%;
            float: none;
        }

        .testimonial-meta a {
            display: block;
        }

        .portfolio-box {
            background: none;
        }

        .portfolio-slider-span,
        .portfolio-photo-span,
        .blog-post-span,
        .single-blog-post-span,
        .respond .send-message-form-span {
            width: 100%;
        }

        #portfolio-options li a {
            font-size: 12px;
            padding: 0 5px;
        }

        #portfolio-container {
            margin: 0 auto;
            width: 304px;
            padding: 0;
        }

        .photo {
            margin: 12px 0px;
        }

        .send-message-form-span {
            padding-left: 20px;
            padding-right: 20px;
        }

        .send-message-form input,
        .send-message-form textarea,
        .respond .send-message-form input {
            display: block;
            width: 94%;
            margin: 0 auto;
            margin-bottom: 10px;
        }

        .contact-info-span {
            margin: 0 auto;
        }
    }

    /* Landscape phones
------------------------- */
    @media (min-width: 200px) and (max-width: 358px) {

        h2 {
            font-size: 24px;
            line-height: 36px;
        }

        .service-span,
        .about-us-span {
            width: 100%;
            float: none;
            margin: 0 auto;
        }

        .navbar .navbar-inner {
            overflow: hidden;
            border: 0;
            min-height: 36px;
            background: none;
            padding: 0;
            -webkit-border-radius: 0px;
            -moz-border-radius: 0px;
            -o-border-radius: 0px;
            border-radius: 0px;
            -webkit-box-shadow: none;
            -moz-box-shadow: none;
            -o-box-shadow: none;
            box-shadow: none;
        }

        .other-service-bg {
            margin: 0;
            padding: 20px;
        }

        #homeCarousel.carousel .item {
            height: 200px;
            top: 40px;
        }

        #testimonialCarousel .carousel-control.left {
            left: 20%;
        }

        #testimonialCarousel .carousel-control.right {
            right: 20%;
        }

        .newsletter-form {
            width: 100%;
        }

        .newsletter-form-box input {
            width: auto;
            margin: 5px 2px;
        }

        .newsletter-form-box button {
            margin: 5px 2px;
        }

        .post-meta a {
            padding: 6px 10px;
            margin: 5px;
        }

        .post-featured-box .flexslider {
            margin-bottom: 30px;
        }

        .post-featured-box .flex-direction-nav {
            display: none;
        }

        .flex-control-nav {
            bottom: -30px;
        }

        .post-featured-box .flex-control-paging {
            display: block;
        }

            .post-featured-box .flex-control-paging li a {
                background: rgba(64,64,64,1);
            }

                .post-featured-box .flex-control-paging li a:hover,
                .post-featured-box .flex-control-paging li a.flex-active {
                    background: rgba(125,187,57,1);
                }
    }

    /* Landscape phones
------------------------- */
    @media (min-width: 100px) and (max-width: 200px) {

        .send-message-form input,
        .send-message-form textarea,
        .respond .send-message-form input {
            width: 90%;
        }

        .contact-info-span {
            width: 263px;
        }

        .navbar .navbar-inner {
            overflow: hidden;
            border: 0;
            min-height: 36px;
            background: none;
            padding: 0;
            -webkit-border-radius: 0px;
            -moz-border-radius: 0px;
            -o-border-radius: 0px;
            border-radius: 0px;
            -webkit-box-shadow: none;
            -moz-box-shadow: none;
            -o-box-shadow: none;
            box-shadow: none;
        }

        .contact-info {
            margin-left: 15px;
        }

        .post-meta a {
            display: block;
            margin: 5px;
        }
    }

    /* Portrait phones
------------------------- */
    @media (max-width: 320px) {

        #portfolio-container {
            width: 262px;
        }

        .photo {
            height: 262px;
            width: 262px;
        }

            .photo img {
                height: 258px;
                width: 2558px;
                -webkit-border-radius: 129px;
                -moz-border-radius: 129px;
                -o-border-radius: 129px;
                border-radius: 129px;
                margin: 2px;
            }

            .photo .portfolio-item-hover {
                height: 262px;
                width: 262px;
                background: url(../img/portfolio-photo/portfolio-item-hover-small.png) no-repeat;
                -webkit-border-radius: 131px;
                -moz-border-radius: 131px;
                -o-border-radius: 131px;
                border-radius: 131px;
            }

        .contact-info {
            margin: 170px 0 0 0px;
            padding: 0 5px;
        }

        .photo a {
            top: 34%;
        }

            .photo a.info {
                left: 30%;
            }

            .photo a.link {
                right: 30%;
            }
    }

    .ui-widget-overlay.custom-overlay {
        background-color: black;
        background-image: none;
        opacity: 0.9;
        z-index: 1040;
    }

    .modal-header {
        /*  background: url(../img/pop-back3.png);*/
        background-repeat: repeat-x;
        background-color: white;
        background-position: center;
        padding: 9px 15px;
        border-bottom: 1px solid #eee;
        background-color: white;
        -webkit-border-top-left-radius: 5px;
        -webkit-border-top-right-radius: 5px;
        -moz-border-radius-topleft: 5px;
        -moz-border-radius-topright: 5px;
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
    }

    .team-box-online-0 {
        text-align: center;
        padding: 8px 0px 5px;
    }

    .team-profile-onlime-0 {
        margin: 0 auto;
        width: 100px;
        height: 100px;
        overflow: hidden;
        text-indent: -999px;
        background: #272727 url(../img/online_icon/0.png) no-repeat center;
        -webkit-border-radius: 92px;
        -moz-border-radius: 92px;
        -o-border-radius: 92px;
        border-radius: 92px;
        -webkit-transition: background 1s;
        -moz-transition: background 1s;
        -o-transition: background 1s;
        -ms-transition: background 1s;
        transition: background 1s;
    }

    .team-box-online-1 {
        text-align: center;
        padding: 8px 0px 5px;
    }

    .team-profile-onlime-1 {
        margin: 0 auto;
        width: 100px;
        height: 100px;
        overflow: hidden;
        text-indent: -999px;
        background: #272727 url(../img/online_icon/1.png) no-repeat center;
        -webkit-border-radius: 92px;
        -moz-border-radius: 92px;
        -o-border-radius: 92px;
        border-radius: 92px;
        -webkit-transition: background 1s;
        -moz-transition: background 1s;
        -o-transition: background 1s;
        -ms-transition: background 1s;
        transition: background 1s;
    }

    /*.team-profile-onlime-1:hover {
        background: #13AFE2 url(../img/team/team-profile-image-hover.png) no-repeat bottom center;
    }*/
    .team-box-online-2 {
        text-align: center;
        padding: 8px 0px 5px;
    }

    .team-profile-onlime-2 {
        margin: 0 auto;
        width: 100px;
        height: 100px;
        overflow: hidden;
        text-indent: -999px;
        background: #272727 url(../img/online_icon/2.png) no-repeat center;
        -webkit-border-radius: 92px;
        -moz-border-radius: 92px;
        -o-border-radius: 92px;
        border-radius: 92px;
        -webkit-transition: background 1s;
        -moz-transition: background 1s;
        -o-transition: background 1s;
        -ms-transition: background 1s;
        transition: background 1s;
    }

    /*.team-profile-onlime-2:hover {
        background: #13AFE2 url(../img/team/team-profile-image-hover.png) no-repeat bottom center;
    }*/
    .team-box-online-3 {
        text-align: center;
        padding: 8px 0px 5px;
    }

    .team-profile-onlime-3 {
        margin: 0 auto;
        width: 100px;
        height: 100px;
        overflow: hidden;
        text-indent: -999px;
        background: #272727 url(../img/online_icon/3.png) no-repeat center;
        -webkit-border-radius: 92px;
        -moz-border-radius: 92px;
        -o-border-radius: 92px;
        border-radius: 92px;
        -webkit-transition: background 1s;
        -moz-transition: background 1s;
        -o-transition: background 1s;
        -ms-transition: background 1s;
        transition: background 1s;
    }

    /*.team-profile-onlime-3:hover {
        background: #13AFE2 url(../img/team/team-profile-image-hover.png) no-repeat bottom center;
    }*/
    .team-box-online-4 {
        text-align: center;
        padding: 8px 0px 5px;
    }

    .team-profile-onlime-4 {
        margin: 0 auto;
        width: 100px;
        height: 100px;
        overflow: hidden;
        text-indent: -999px;
        background: #272727 url(../img/online_icon/4.png) no-repeat center;
        -webkit-border-radius: 92px;
        -moz-border-radius: 92px;
        -o-border-radius: 92px;
        border-radius: 92px;
        -webkit-transition: background 1s;
        -moz-transition: background 1s;
        -o-transition: background 1s;
        -ms-transition: background 1s;
        transition: background 1s;
    }

    /*.team-profile-onlime-4:hover {
        background: #13AFE2 url(../img/team/team-profile-image-hover.png) no-repeat bottom center;
    }*/
    .team-box-online-5 {
        text-align: center;
        padding: 8px 0px 5px;
    }

    .team-profile-onlime-5 {
        margin: 0 auto;
        width: 100px;
        height: 100px;
        overflow: hidden;
        text-indent: -999px;
        background: #272727 url(../img/online_icon/5.png) no-repeat center;
        -webkit-border-radius: 92px;
        -moz-border-radius: 92px;
        -o-border-radius: 92px;
        border-radius: 92px;
        -webkit-transition: background 1s;
        -moz-transition: background 1s;
        -o-transition: background 1s;
        -ms-transition: background 1s;
        transition: background 1s;
    }

    /*.team-profile-onlime-5:hover {
        background: #13AFE2 url(../img/team/team-profile-image-hover.png) no-repeat bottom center;
    }*/
    .team-box-online-6 {
        text-align: center;
        padding: 8px 0px 5px;
    }

    .team-profile-onlime-6 {
        margin: 0 auto;
        width: 100px;
        height: 100px;
        overflow: hidden;
        text-indent: -999px;
        background: #272727 url(../img/online_icon/6.png) no-repeat center;
        -webkit-border-radius: 92px;
        -moz-border-radius: 92px;
        -o-border-radius: 92px;
        border-radius: 92px;
        -webkit-transition: background 1s;
        -moz-transition: background 1s;
        -o-transition: background 1s;
        -ms-transition: background 1s;
        transition: background 1s;
    }

    .team-box-online-7 {
        text-align: center;
        padding: 8px 0px 5px;
    }

    .team-profile-onlime-7 {
        margin: 0 auto;
        width: 100px;
        height: 100px;
        overflow: hidden;
        text-indent: -999px;
        background: #272727 url(../img/online_icon/engelli.png) no-repeat center;
        -webkit-border-radius: 92px;
        -moz-border-radius: 92px;
        -o-border-radius: 92px;
        border-radius: 92px;
        -webkit-transition: background 1s;
        -moz-transition: background 1s;
        -o-transition: background 1s;
        -ms-transition: background 1s;
        transition: background 1s;
    }

    .team-box-online-8 {
        text-align: center;
        padding: 8px 0px 5px;
    }

    .team-profile-onlime-8 {
        margin: 0 auto;
        width: 100px;
        height: 100px;
        overflow: hidden;
        text-indent: -999px;
        background: #272727 url(../img/team/bilgiGuncelleme.png) no-repeat center;
        -webkit-border-radius: 92px;
        -moz-border-radius: 92px;
        -o-border-radius: 92px;
        border-radius: 92px;
        -webkit-transition: background 1s;
        -moz-transition: background 1s;
        -o-transition: background 1s;
        -ms-transition: background 1s;
        transition: background 1s;
    }

    .modal3 {
        position: fixed;
        top: 5%;
        left: 50%;
        z-index: -1;
        width: 90%;
        /*height:80%;*/
        margin-left: -45%;
        margin-bottom: 5%;
        background-color: #ffffff;
        border: 1px solid #999;
        border: 1px solid rgba(0, 0, 0, 0.3);
        *border: 1px solid #999;
        -webkit-border-radius: 6px;
        -moz-border-radius: 6px;
        border-radius: 6px;
        outline: none;
        -webkit-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
        -moz-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
        box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
        -webkit-background-clip: padding-box;
        -moz-background-clip: padding-box;
        background-clip: padding-box;
        overflow-y: inherit;
    }

    .modal-body3 {
        position: relative;
        max-height: calc(100vh - 250px);
        overflow-y: auto;
        /*max-height: 400px;*/
        padding: 15px;
        overflow-y: auto;
    }
    /** Organizasyon şeması Test*/
    #myImg {
        border-radius: 5px;
        cursor: pointer;
        transition: 0.3s;
    }

        #myImg:hover {
            opacity: 0.7;
        }

    /* The Modal (background) */
    .modal_o_sema {
        display: none; /* Hidden by default */
        position: fixed; /* Stay in place */
        z-index: 1; /* Sit on top */
        padding-top: 100px; /* Location of the box */
        left: 0;
        top: 0;
        width: 100%; /* Full width */
        height: 100%; /* Full height */
        overflow: auto; /* Enable scroll if needed */
        background-color: rgb(0,0,0); /* Fallback color */
        background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
    }

    /* Modal Content (image) */
    .modal-content_o_sema {
        margin: auto;
        display: block;
        width: 80%;
        max-width: 700px;
    }

    /* Caption of Modal Image */
    #caption_o_sema {
        margin: auto;
        display: block;
        width: 80%;
        max-width: 700px;
        text-align: center;
        color: #ccc;
        padding: 10px 0;
        height: 150px;
    }

    /* Add Animation */
    .modal-content_o_sema, #caption {
        -webkit-animation-name: zoom;
        -webkit-animation-duration: 0.6s;
        animation-name: zoom;
        animation-duration: 0.6s;
    }

    @-webkit-keyframes zoom {
        from {
            -webkit-transform: scale(0)
        }

        to {
            -webkit-transform: scale(1)
        }
    }

    @keyframes zoom {
        from {
            transform: scale(0)
        }

        to {
            transform: scale(1)
        }
    }

    /* The Close Button */
    .close_o_sema {
        position: absolute;
        top: 15px;
        right: 35px;
        color: #f1f1f1;
        font-size: 40px;
        font-weight: bold;
        transition: 0.3s;
    }

    .close:hover,
    .close:focus {
        color: #bbb;
        text-decoration: none;
        cursor: pointer;
    }

    /* 100% Image Width on Smaller Screens */
    @media only screen and (max-width: 700px) {
        .modal-content_o_sema {
            width: 100%;
        }
    }

    /*.team-profile-onlime-6:hover {
        background: #13AFE2 url(../img/team/team-profile-image-hover.png) no-repeat bottom center;
    }*/

    /*Kurumsal Dökümanlar*/

    /* Portfolio
-------------------------------------------------- */
    .portfolio_kurumsal_dokuman {
        background: url(../img/section-arrow.png) no-repeat top center;
    }

    .portfolio-box_kurumsal_dokuman {
        padding: 130px 0 0px 0;
        background: url(../img/portfolio.png) no-repeat top center;
    }

    .portfolio-slider-row_kurumsal_dokuman {
        padding: 0 115px;
    }

    .portfolio-slider-span_kurumsal_dokuman {
        width: 940px;
    }

        .portfolio-slider-span_kurumsal_dokuman .flex-direction-nav_kurumsal_dokuman {
            display: none;
        }

        .portfolio-slider-span_kurumsal_dokuman .flex-control-paging li a {
            width: 47px;
            height: 10px;
            background: #404040;
            background: rgba(64,64,64,1);
            -webkit-border-radius: 5px;
            -moz-border-radius: 5px;
            -o-border-radius: 5px;
            border-radius: 5px;
            -webkit-transition: background 1s;
            -moz-transition: background 1s;
            -o-transition: background 1s;
            -ms-transition: background 1s;
            transition: background 1s;
        }

            .portfolio-slider-span_kurumsal_dokuman .flex-control-paging li a:hover,
            .portfolio-slider-span_kurumsal_dokuman .flex-control-paging li a.flex-active {
                background: rgba(125,187,57,1);
                -webkit-box-shadow: inset 0 10px 10px rgba(0,0,0,0.1);
                -moz-box-shadow: inset 0 10px 10px rgba(0,0,0,0.1);
                -o-box-shadow: inset 0 10px 10px rgba(0,0,0,0.1);
                box-shadow: inset 0 10px 10px rgba(0,0,0,0.1);
            }

    .modal-backdrop2 {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1040;
        background-color: white;
        /*background: url(../img/pop-back3.png) no-repeat;*/
        background-image: url('../img/loader.gif');
        background-repeat: no-repeat;
        /*background-size: contain;*/
        background-position: center;
        background-size: 200px 200px;
    }


    .modal-backdrop.fade2 {
        opacity: 0;
    }

    .modal-backdrop2,
    .modal-backdrop.fade.in2 {
        opacity: 0.8;
        filter: alpha(opacity=80);
    }




    #container {
        width: 80%;
        margin: 150px auto;
    }

    /* LIST */
    ul[_akordiyon] {
        list-style: none;
    }

    /* FORM */
    input[_akordiyon] {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    label[_akordiyon] {
        display: block;
        float: left;
        height: 100vh;
        width: 40px;
        overflow: hidden;
        background: #30354a;
        text-align: center;
        font-size: 14px;
        line-height: 50px;
        transition: background 300ms ease;
        color: #238bbf;
    }

    li:nth-child(even) > input[_akordiyon] + label[_akordiyon] {
        background: #3a4059;
    }

        label[_akordiyon]:hover,
        li:nth-child(even) > input[_akordiyon] + label[_akordiyon]:hover {
            background: #2196f3;
            color: #fff;
            cursor: pointer;
        }

    input[type="radio"]:checked ~ label[_akordiyon] {
        background: #2196f3;
        color: #fff;
        cursor: default !important;
    }

    /* SLIDES */
    .accslide {
        display: block;
        height: 100%;
        width: 0px;
        padding: 10px 0;
        float: left;
        overflow-x: hidden;
        font-sizes: 12px;
        line-height: 1.5;
        transition: all 700ms ease;
    }

        .accslide * {
            padding-left: 10px;
        }

        .accslide img {
            margin-top: 10px;
        }

    input[type="radio"]:not(:checked) ~ label[_akordiyon] > * {
        padding-left: 7px;
        font-size: 1.2em;
        white-space: nowrap;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
    }

    input[type="radio"]:checked ~ label[_akordiyon] > * {
        display: none;
    }

    li:nth-child(1):nth-last-child(2) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 80px);
    }

    li:nth-child(2):nth-last-child(1) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 80px);
    }

    li:nth-child(1):nth-last-child(3) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 120px);
    }

    li:nth-child(2):nth-last-child(2) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 120px);
    }

    li:nth-child(3):nth-last-child(1) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 120px);
    }

    li:nth-child(1):nth-last-child(4) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 160px);
    }

    li:nth-child(2):nth-last-child(3) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 160px);
    }

    li:nth-child(3):nth-last-child(2) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 160px);
    }

    li:nth-child(4):nth-last-child(1) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 160px);
    }

    li:nth-child(1):nth-last-child(5) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 200px);
    }

    li:nth-child(2):nth-last-child(4) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 200px);
    }

    li:nth-child(3):nth-last-child(3) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 200px);
    }

    li:nth-child(4):nth-last-child(2) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 200px);
    }

    li:nth-child(5):nth-last-child(1) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 200px);
    }

    li:nth-child(1):nth-last-child(6) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 240px);
    }

    li:nth-child(2):nth-last-child(5) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 240px);
    }

    li:nth-child(3):nth-last-child(4) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 240px);
    }

    li:nth-child(4):nth-last-child(3) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 240px);
    }

    li:nth-child(5):nth-last-child(2) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 240px);
    }

    li:nth-child(6):nth-last-child(1) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 240px);
    }

    /*/1-7*/
    li:nth-child(1):nth-last-child(7) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 280px);
    }

    li:nth-child(2):nth-last-child(6) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 280px);
    }

    li:nth-child(3):nth-last-child(5) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 280px);
    }

    li:nth-child(4):nth-last-child(4) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 280px);
    }

    li:nth-child(5):nth-last-child(3) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 280px);
    }

    li:nth-child(6):nth-last-child(2) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 280px);
    }

    li:nth-child(7):nth-last-child(1) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 280px);
    }
    /*1-8*/
    li:nth-child(1):nth-last-child(8) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 320px);
    }

    li:nth-child(2):nth-last-child(7) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 320px);
    }

    li:nth-child(3):nth-last-child(6) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 320px);
    }

    li:nth-child(4):nth-last-child(5) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 320px);
    }

    li:nth-child(5):nth-last-child(4) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 320px);
    }

    li:nth-child(6):nth-last-child(3) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 320px);
    }

    li:nth-child(7):nth-last-child(2) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 320px);
    }

    li:nth-child(8):nth-last-child(1) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 320px);
    }

    /*1-9*/
    li:nth-child(1):nth-last-child(9) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 370px);
    }

    li:nth-child(2):nth-last-child(8) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 370px);
    }

    li:nth-child(3):nth-last-child(7) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 370px);
    }

    li:nth-child(4):nth-last-child(6) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 370px);
    }

    li:nth-child(5):nth-last-child(5) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 370px);
    }

    li:nth-child(6):nth-last-child(4) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 370px);
    }

    li:nth-child(7):nth-last-child(3) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 370px);
    }

    li:nth-child(8):nth-last-child(2) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 370px);
    }

    li:nth-child(9):nth-last-child(1) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 370px);
    }

    /*1-10*/
    /*1-9*/
    li:nth-child(1):nth-last-child(10) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 410px);
    }

    li:nth-child(2):nth-last-child(9) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 410px);
    }

    li:nth-child(3):nth-last-child(8) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 410px);
    }

    li:nth-child(4):nth-last-child(7) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 410px);
    }

    li:nth-child(5):nth-last-child(6) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 410px);
    }

    li:nth-child(6):nth-last-child(5) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 410px);
    }

    li:nth-child(7):nth-last-child(4) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 410px);
    }

    li:nth-child(8):nth-last-child(3) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 410px);
    }

    li:nth-child(9):nth-last-child(2) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 410px);
    }

    li:nth-child(10):nth-last-child(1) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 410px);
    }

    /*1-11*/

    li:nth-child(1):nth-last-child(11) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 460px);
    }


    li:nth-child(2):nth-last-child(10) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 460px);
    }

    li:nth-child(3):nth-last-child(9) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 460px);
    }

    li:nth-child(4):nth-last-child(8) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 460px);
    }

    li:nth-child(5):nth-last-child(7) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 460px);
    }

    li:nth-child(6):nth-last-child(6) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 460px);
    }

    li:nth-child(7):nth-last-child(5) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 460px);
    }

    li:nth-child(8):nth-last-child(4) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 460px);
    }

    li:nth-child(9):nth-last-child(3) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 460px);
    }

    li:nth-child(10):nth-last-child(2) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 460px);
    }

    li:nth-child(11):nth-last-child(1) input[type="radio"]:checked ~ .accslide {
        width: calc(100% - 460px);
    }