/* ============ MAIN SLIDER SECTION ================= */

#MainSlider .Image-Box {
    width: 100%;
    height: 86vh;
    background: #1a1f35;
}


    #MainSlider .Image-Box img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        opacity: 0.6;
    }


#MainSlider .carousel-item {
    position: relative;
}

    #MainSlider .carousel-item a {
        width: 100%;
        height: 100%;
        text-decoration: none;
    }

#MainSlider .carousel-caption {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}



    #MainSlider .carousel-caption h5 {
        font-family: 'Roboto', sans-serif;
        /* font-family: Georgia-Font;*/
        font-size: 1.8em;
        font-weight: bold;
        animation: slideInDown;
        animation-duration: 4s;
    }

    #MainSlider .carousel-caption h2 {
        font-family: 'Roboto', sans-serif;
        font-size: 3.5em;
        font-weight: bold;
        margin-top: 20px;
        letter-spacing: 1px;
        animation: fadeInLeft;
        animation-duration: 3s;
    }

    #MainSlider .carousel-caption a {
        width: auto;
        height: auto;
        font-family: 'Roboto', sans-serif;
        font-size: 1.1em;
        font-weight: bold;
        padding: 15px 50px;
        /*background: linear-gradient(to right,#003366,#006db9);*/
        background: transparent;
        border-color: #fff;
        letter-spacing: 0.8px;
        border-radius: 50px;
        margin-top: 30px;
        animation: slideInUp;
        animation-duration: 3s;
        transition: 0.5ms ease all;
    }

        #MainSlider .carousel-caption a:hover {
            background: #1a1f35;
            transition: 0.5ms ease all;
        }


#MainSlider .carousel-indicators {
    padding-bottom: 20px;
}


    #MainSlider .carousel-indicators li {
        width: 18px;
        height: 18px;
        border-radius: 50%;
    }

@media only screen and (max-width: 1700px) {

    #MainSlider .Image-Box {
        height: 85vh;
    }
}

@media only screen and (max-width: 1550px) {

    #MainSlider .Image-Box {
        height: 95vh;
    }
}

@media only screen and (max-width: 1480px) {

    #MainSlider .Image-Box {
        height: 85vh;
    }

    #MainSlider .carousel-caption h5 {
        font-size: 1.8em;
    }

    #MainSlider .carousel-caption h2 {
        font-size: 3em;
        margin-top: 20px;
    }
}


@media only screen and (max-width: 1375px) {

    #MainSlider .Image-Box {
        height: 95vh;
    }
}



@media only screen and (max-width: 1280px) {

    #MainSlider .Image-Box {
        height: 85vh;
    }

    #MainSlider .carousel-caption {
        width: 50% !important;
    }

        #MainSlider .carousel-caption h5 {
            font-size: 1.6em;
        }

        #MainSlider .carousel-caption h2 {
            font-size: 2.7em;
            margin-top: 20px;
        }

        #MainSlider .carousel-caption a {
            font-size: 1em;
            padding: 10px 30px;
            border-radius: 30px;
            margin-top: 30px;
        }
}


@media only screen and (max-width: 1230px) {

    #MainSlider .Image-Box {
        height: 80vh;
    }
}


@media only screen and (max-width: 1170px) {

    #MainSlider .Image-Box {
        height: 75vh;
    }
}




@media only screen and (max-width: 680px) {

    #MainSlider .Image-Box {
        height: 80vh;
    }




    #MainSlider .carousel-caption {
        width: 80% !important;
        top: 52%;
        left: 50%;
    }

        #MainSlider .carousel-caption h5 {
            font-size: 1.2em;
        }

        #MainSlider .carousel-caption h2 {
            font-size: 2.2em;
        }

        #MainSlider .carousel-caption a {
            font-size: 1.1em;
            padding: 10px 30px;
        }
}

@media only screen and (max-width: 376px) {

    #MainSlider .carousel-caption {
        width: 80%;
    }

        #MainSlider .carousel-caption h5 {
            font-size: 1.1em;
        }

        #MainSlider .carousel-caption h2 {
            font-size: 1.7em;
            margin-top: 15px;
        }

        #MainSlider .carousel-caption a {
            font-size: 1.1em;
            padding: 10px 30px;
            margin-top: 15px;
        }
}





/* ================ MAIN ABOUT US SECTION ================ */

#MainAboutUs {
    padding-top: 5%;
    padding-bottom: 5%;
}


    #MainAboutUs .Left h1 {
        font-family: 'Montserrat', sans-serif;
        font-weight:600;
        font-size:2.4em;
    }

    #MainAboutUs .Left .Slogan {
        padding-top: 5%;
    }

        #MainAboutUs .Left .Slogan p {
            font-family: 'Montserrat', sans-serif;
            font-weight: 800;
            font-size: 1.4em;
            font-style: italic;
        }


    #MainAboutUs .Right .Text {
        padding-bottom:5%;
    }

        #MainAboutUs .Right .Text p {
            font-family: 'Montserrat', sans-serif;
            font-weight: 400;
            font-size: 1.1em;
            font-style: italic;
        }


    #MainAboutUs .Right a {
        font-family: 'Montserrat', sans-serif;
        font-weight: 600;
        font-size: 1.1em;
        color: #fff;
        background: #017cba;
        border: 1px solid #017cba;
        border-radius: 8px;
        text-decoration: none;
        padding: 8px 25px;
    }

@media only screen and (max-width: 780px) {

    #MainAboutUs {
        padding: 7% 2.5%;
    }


    #MainAboutUs .Left{
        padding:3% 0;
    }

    #MainAboutUs .Right {
        padding: 3% 0;
    }

        #MainAboutUs .Left h1 {
            font-size: 2.1em;
        }


            #MainAboutUs .Left .Slogan p {
                font-family: 'Montserrat', sans-serif;
                font-weight: 800;
                font-size: 1.2em;
                font-style: italic;
            }
}




    /* ================ MAIN PRODUCT GROUP SECTION ================ */

    #MainProductGroup {
        padding-top: 2%;
        padding-bottom: 2%;
    }


        #MainProductGroup .Title {
            display: flex;
            align-items: center;
            padding-left: 0 !important;
            padding-right: 0 !important;
            padding-bottom: 2%;
        }


            #MainProductGroup .Title .Line {
                width: 85%;
                height: 2.3px;
                background-color: black;
                opacity: 0.7;
                padding-right: 0 !important;
            }


            #MainProductGroup .Title h2 {
                color: black;
                padding-left: 15px;
                font-size: 1.8em;
                font-family: 'Montserrat', sans-serif;
                font-weight: 700;
            }



        #MainProductGroup .Card {
            padding: 3%;
            cursor: pointer;
        }





#MainProductGroup .Card a {
    text-decoration: none;
}

        #MainProductGroup .CardBox {
            box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
            width: 100%;
            height: 200px;
            background: #fff;
            position: relative;
            display: flex;
            justify-content: center;
            align-items: center;
            transition: 0.2s ease all;
        }


        #MainProductGroup .Card:hover .CardBox {
            background: #017cba;
            transition:0.4s ease all;
        }


          

        #MainProductGroup .CardBox .Text {
            text-align: center;
        }

            #MainProductGroup .CardBox .Text h1 {
                font-family: 'Montserrat', sans-serif;
                color: black;
                font-size: 1.4em;
                font-weight: 700;
                width: 80%;
                margin-left: auto;
                margin-right: auto;
                transition: 0.2s ease all;
            }


        #MainProductGroup .Card:hover .CardBox .Text h1 {
            color: #fff;
            transition: 0.4s ease all;
        }

@media only screen and (max-width: 1460px) {

    
}

@media only screen and (max-width: 1200px) {



}


    @media only screen and (max-width: 780px) {

       
    }




    /* ================ MAIN INFORMATİON SECTION ================ */


    #MainInformation {

    }

        #MainInformation .container-fluid {
            height: auto;
            padding:5% 3%;
            width:90%; 
            margin-left:auto;
            margin-right:auto;
        }

        /* -------- Left ------------- */

        #MainInformation .Left .Image {
            width: 100%;
            height: auto;
        }

            #MainInformation .Left .Image img {
                width: 100%;
                height: 100%;
            }

        /* -------- Right ------------- */


        #MainInformation .Right {
            display: flex;
            justify-content:center;
            align-items: start;
        }

            #MainInformation .Right .Card {
                padding-bottom: 4%;
            }

                #MainInformation .Right .Card .Title {
                    display: flex;
                    justify-content: start;
                    align-items: start;
                }

                    #MainInformation .Right .Card .Title img {
                        width: 90px;
                        height: auto;
                        padding-right: 15px;
                    }

                    #MainInformation .Right .Card .Title h2 {
                        width: 45%;
                        color: #181c27;
                        font-size: 1.5em;
                        font-weight: 800;
                        font-family: 'Montserrat', sans-serif;
                        letter-spacing: 1px;
                    }


                #MainInformation .Right .Card .Text {
                    padding-right: 10%;
                    padding-top: 5%;
                }

                    #MainInformation .Right .Card .Text p {
                        color: #181c27;
                        font-size: 1em;
                        font-weight: 500;
                        font-family: 'Montserrat', sans-serif;
                    }

    @media only screen and (max-width: 1700px) {

        #MainInformation .Left {
            display: flex;
            justify-content: center;
            align-items: center;
        }

        #MainInformation .Right {
            padding: 2%;
        }
    }


    @media only screen and (max-width: 1460px) {

        #MainInformation .Right {
            padding: 5% 0;
        }
    }

@media only screen and (max-width: 1200px) {


    #MainInformation .Right .Card .Title img {
        width: 75px;
    }

    #MainInformation .Right .Card .Title h2 {
        width: 65%;
        font-size: 1.3em;
    }


    #MainInformation .Right .Card .Text {
        padding-right: 10%;
        padding-top: 5%;
    }

        #MainInformation .Right .Card .Text p {

            font-size: 0.9em;
        }

}



    @media only screen and (max-width: 780px) {

        #MainInformation {
            padding-top: 7%;
            padding-bottom: 7%;
        }


            #MainInformation .Right {
                padding: 7% 3%;
            }

                #MainInformation .Right .Card {
                    padding: 5% 3%;
                }

                    #MainInformation .Right .Card .Title img {
                        width: 70px;
                        height: auto;
                        padding-right: 10px;
                    }

                    #MainInformation .Right .Card .Title {
                        display: flex;
                        justify-content: center;
                        align-items: center;
                    }

                        #MainInformation .Right .Card .Title h2 {
                            width: 100%;
                            color: #181c27;
                            font-size: 1.4em;
                            font-weight: 800;
                            font-family: 'Montserrat', sans-serif;
                            letter-spacing: 1px;
                        }

                    #MainInformation .Right .Card .Text {
                        padding-right: 1%;
                        padding-left: 1%;
                        padding-top: 5%;
                    }
    }



    /* ================ MAIN VIDEO SECTION ================ */

    #MainVideo {
        padding-top: 5%;
        padding-bottom: 5%;
    }

        #MainVideo .Content {
            background: #181c27;
            position: relative;
            height: 810px;
        }


            #MainVideo .Content .Image {
                width: 100%;
                height: 100%;
            }

                #MainVideo .Content .Image img {
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                    opacity: 0.5;
                }

            #MainVideo .Content .Text {
                position: absolute;
                width: 70%;
                top: 62%;
                left: 30%;
            }

                #MainVideo .Content .Text .Brand {
                    display: flex;
                    justify-content: end;
                    align-items: center;
                }

                    #MainVideo .Content .Text .Brand h1 {
                        color: #fff;
                        font-size: 2em;
                        padding-right: 20px;
                    }

                    #MainVideo .Content .Text .Brand .Line {
                        background: #fff;
                        width: 82%;
                        height: 1px;
                    }

                #MainVideo .Content .Text .VideoName {
                }

                    #MainVideo .Content .Text .VideoName h2 {
                        color: #fff;
                        font-size: 1.5em;
                    }


            #MainVideo .Content .video-btn {
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translate(-50%,-50%);
            }

                #MainVideo .Content .video-btn img {
                    width: 90px;
                    height: auto;
                }

@media only screen and (max-width: 1460px) {

    #MainVideo .Content {
        background: #181c27;
        position: relative;
        height: 650px;
    }
}

@media only screen and (max-width: 1200px) {

    #MainVideo .Content {
        background: #181c27;
        position: relative;
        height: 550px;
    }

        #MainVideo .Content .video-btn img {
            width: 75px;
            height: auto;
        }
}



    @media only screen and (max-width: 780px) {

        #MainVideo .Content {
            height: 410px;
        }

            #MainVideo .Content .Text {
                position: absolute;
                width: 100%;
                top: 62%;
                left: 3%;
            }

                #MainVideo .Content .Text .Brand h1 {
                    color: #fff;
                    font-size: 1.7em;
                    padding-right: 15px;
                }

                #MainVideo .Content .Text .Brand .Line {
                    background: #fff;
                    width: 82%;
                    height: 1px;
                }

                #MainVideo .Content .Text .VideoName {
                }

                    #MainVideo .Content .Text .VideoName h2 {
                        color: #fff;
                        font-size: 1.3em;
                    }



            #MainVideo .Content .video-btn img {
                width: 70px;
                height: auto;
            }
    }



    /* ================ MAIN CONTACT SECTION ================ */


    #MainContact {
        position: relative;
        padding-top: 2%;
        padding-bottom: 5%;
    }


        #MainContact .Form .Left {
            padding: 0 5%;
        }

        #MainContact form input {
            font-family: 'Montserrat', sans-serif !important;
            border: none;
            border-bottom: 1px solid #017cba;
            border-radius: 0px;
            padding-left: 4px;
            padding-bottom: 0px;
            color: #017cba;
            font-weight: 600;
        }

            #MainContact form input::placeholder, textarea::placeholder {
                color: #017cba;
                font-weight: 600;
                opacity: 0.3;
                font-size: 1.1em;
            }

        #MainContact form textarea::placeholder {
            color: #017cba;
            font-weight: 600;
            opacity: 0.3;
            font-size: 1.1em;
        }


        #MainContact form input:focus, textarea:focus {
            box-shadow: none !important;
        }

        #MainContact form textarea {
            font-family: 'Montserrat', sans-serif !important;
            border: 1px solid #017cba;
            border-radius: 10px;
            padding-left: 8px;
            color: #017cba;
            font-weight: 600;
        }

        #MainContact form button {
            background-color: #017cba;
            color: #fff;
            font-family: 'Montserrat', sans-serif !important;
            font-size: 1.1em;
            font-weight: 600;
            border-radius: 5px;
            border-color: #017cba;
        }


        #MainContact .Form .Right {
            padding: 0px 15% 0px 5%;
        }

            #MainContact .Form .Right .Image img {
                height: 90px;
            }

            #MainContact .Form .Right .Content h2 {
                font-family: 'Montserrat', sans-serif !important;
                font-size: 2em;
                font-weight: 600;
                letter-spacing: 1px;
            }

            #MainContact .Form .Right .Content p {
                font-family: 'Montserrat', sans-serif !important;
                font-size: 1em;
                font-weight: 400;
                line-height: 1.2em;
                text-align: justify;
                letter-spacing: 1px;
            }

            #MainContact .Form .Right .Content h5 {
                font-family: 'Montserrat', sans-serif !important;
                font-size: 1em;
                font-weight: 700;
                padding-top: 14%;
            }



        #MainContact .YellowLine {
            position: absolute;
            bottom: 0;
            right: 0;
            background: #017cba;
            width: 40%;
            height: 18px;
            border-radius: 10px 0 0 0;
        }





    @media only screen and (max-width: 780px) {

        #MainContact form button {
            background-color: #045a7f;
            color: #fff;
            font-family: 'Montserrat', sans-serif !important;
            font-size: 1.1em;
            font-weight: 600;
            border-radius: 5px;
            width: 100%;
        }
    }


    /* ================ MAIN POP-UP COMPONENT ================ */

#MainPopup .modal-dialog {
    max-width:36% !important;
}


#MainPopup .modal-body {
   padding:0.5%;
}

#MainPopup .modal-body img {
    width:100%; 
    height:auto;
}

 

@media only screen and (max-width: 780px) {

    #MainPopup .modal-dialog {
        max-width: 95% !important;
    }
}