<!DOCTYPE html>
<html>

<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="images/fav.png" rel="icon" />
    <title>Sesp</title>
    <link rel="stylesheet" href="css/icons.css">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css"
        integrity="sha384-xOolHFLEh07PJGoPkLv1IbcEPTNtaed2xpHsD9ESMhqIYd0nLMwNLD69Npy4HI+N" crossorigin="anonymous">
    <link rel="stylesheet" type="text/css" href="css/style.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/magnific-popup.css" />
    <link rel="stylesheet" href="css/rtl.css">
</head>

<body class="rtl">
    <?php include 'include-ar.php';?>
    <section class="inner-banner d-flex align-items-center">
        <div class="container-fluid">
            <h1>تسجيل الاهتمام</h1>
        </div>
    </section>



    <section class="section-sesp pt-80 margin-responsive">
        <div class="container-fluid">
            <div class="row">
                <div class="col-lg-12 ">
                    <div class="course-apply">
                    <div class="step1">
                        <!-- <h6>STEP 1 OF 3 </h6>
                        <div class="progress progress-striped active">
                            <div role="progressbar " style="width: 30%;" class="progress-bar "><span>30%</span></div>
                        </div> -->
                        <div class="longcrs-form">
                            <h3>معلومات شخصية</h3>
                            <div class="row">
                                <div class="col-md-4">
                                    <div class="form-grp mb-25">
                                        <label for="name">الاسم الأول</label>
                                        <input type="text" class="form-control" id="name" autocomplete="off"
                                            required="">

                                    </div>
                                </div>
                                <div class="col-md-4">
                                    <div class="form-grp mb-25">
                                        <label for="name">الاسم الأوسط</label>
                                        <input type="text" class="form-control" id="name" autocomplete="off"
                                            required="">

                                    </div>
                                </div>
                                <div class="col-md-4">
                                    <div class="form-grp mb-25">
                                        <label for="name">اسم العائلة</label>
                                        <input type="text" class="form-control" id="name" autocomplete="off"
                                            required="">

                                    </div>
                                </div>
                                <div class="col-md-3">
                                    <div class="mb-25 form-grp">
                                        <label for="name">الهوية الوطنية</label>
                                        <input type="text" class="form-control" id="name" autocomplete="off"
                                            required="">

                                    </div>
                                </div>
                                <div class="col-md-3">
                                    <div class="mb-25 form-grp">
                                        <label for="name">بريد إلكتروني</label>
                                        <input type="text" class="form-control" id="name" autocomplete="off"
                                            required="">

                                    </div>
                                </div>

                                <div class="col-md-3">
                                    <div class="mb-25 form-grp">
                                        <label for="name">تاريخ الميلاد</label>
                                        <input type="date" class="form-control" id="name" autocomplete="off"
                                            required="">

                                    </div>
                                </div>

                                <div class="col-md-3">
                                    <div class="form-grp">
                                        <label for="name">رقم التليفون</label>
                                        <input type="text" class="form-control" id="name" autocomplete="off"
                                            required="">

                                    </div>
                                </div>

                                <div class="col-md-3">
                                    <div class="form-grp">
                                        <label for="name">رقم الهاتف المحمول</label>
                                        <input type="text" class="form-control" id="name" autocomplete="off"
                                            required="">

                                    </div>
                                </div>


                                <div class="col-md-3">
                                    <div class="mb-25 form-grp">
                                        <label for="main-location-type">موقع</label>
                                        <select class="form-control" id="main-location-type" onchange="changeFuncloc();">
                                            <option style="display: none;">اختر المقاطعات</option>
                                            <option value="1">الرياض</option>
                                            <option value="2">مكه</option>
                                            <option value="3">المدينة المنورة</option>
                                            <option value="4">الشرقية</option>
                                            <option value="5">القصيم</option>
                                            <option value="6">عسير</option>
                                            <option value="7">تبوك</option>
                                            <option value="8">يشيد</option>
                                            <option value="9">الحدود الشمالية</option>
                                            <option value="10">جازان</option>
                                            <option value="11">نجران</option>
                                            <option value="12">الباحة</option>
                                            <option value="13">الجوف</option>
                                        </select>
                                    </div>
                                </div>

                                <div class="col-md-3" style="display: none;" id="riyadh-main">
                                    <div class="mb-25 form-grp">
                                        <label for="riyadh-main-city">الرياض</label>
                                        <select class="form-control" id="riyadh-main-city">
                                            <option style="display: none;">مدن أساسيه</option>
                                            <option value="1">الخرج</option>
                                            <option value="2">الدرعية</option>
                                            <option value="3">الدوادمي</option>
                                            <option value="4">المجمعة</option>
                                            <option value="5">القويعية</option>
                                            <option value="6">الدوادمي، عفيف</option>
                                        </select>
                                    </div>
                                </div>

                                <div class="col-md-3" style="display: none;" id="makkah-main">
                                    <div class="mb-25 form-grp">
                                        <label for="makkah-main-city">مكه</label>
                                        <select class="form-control" id="makkah-main-city">
                                            <option style="display: none;">مدن أساسيه</option>
                                            <option value="1">جدة</option>
                                            <option value="2">الطائف</option>
                                            <option value="3">القنفذة</option>
                                            <option value="4">الليث</option>
                                            <option value="5">جوموم</option>
                                            <option value="6">رابغ</option>
                                        </select>
                                    </div>
                                </div>

                                <div class="col-md-3" style="display: none;" id="medina-main">
                                    <div class="mb-25 form-grp">
                                        <label for="medina-main-city">المدينة المنورة</label>
                                        <select class="form-control" id="medina-main-city">
                                            <option style="display: none;">مدن أساسيه</option>
                                            <option value="1">ينبع</option>
                                            <option value="2">الحبار</option>
                                            <option value="3">محمد الذهب</option>
                                            <option value="4">بدر</option>
                                            <option value="5">خيبة</option>
                                        </select>
                                    </div>
                                </div>

                                <div class="col-md-3" style="display: none;" id="eastern-main">
                                    <div class="mb-25 form-grp">
                                        <label for="eastern-main-city">الشرقية</label>
                                        <select class="form-control" id="eastern-main-city">
                                            <option style="display: none;">مدن أساسيه</option>
                                            <option value="1">مدينه الخبر</option>
                                            <option value="2">الظهران</option>
                                            <option value="3">الجبيل</option>
                                            <option value="4">الهفوف، الأحساء</option>
                                            <option value="5">القطيف</option>
                                        </select>
                                    </div>
                                </div>

                                <div class="col-md-3" style="display: none;" id="qassim-main">
                                    <div class="mb-25 form-grp">
                                        <label for="qassim-main-city">القصيم</label>
                                        <select class="form-control" id="qassim-main-city">
                                            <option style="display: none;">مدن أساسيه</option>
                                            <option value="1">عنيزة</option>
                                            <option value="2">الرس</option>
                                            <option value="3">البكيرية</option>
                                            <option value="4">المذنب</option>
                                        </select>
                                    </div>
                                </div>

                                <div class="col-md-3" style="display: none;" id="asir-main">
                                    <div class="mb-25 form-grp">
                                        <label for="asir-main-city">عسير</label>
                                        <select class="form-control" id="asir-main-city">
                                            <option style="display: none;">مدن أساسيه</option>
                                            <option value="1">خميس مشيط</option>
                                            <option value="2">بيشة، ظهران الجنوب </option>
                                            <option value="3">تثليث </option>
                                            <option value="4">سراة عبيدة </option>
                                        </select>
                                    </div>
                                </div>

                                <div class="col-md-3" style="display: none;" id="tabuk-main">
                                    <div class="mb-25 form-grp">
                                        <label for="tabuk-main-city">تبوك</label>
                                        <select class="form-control" id="tabuk-main-city">
                                            <option style="display: none;">مدن أساسيه</option>
                                            <option value="1">تيماء</option>
                                            <option value="2">حقل</option>
                                            <option value="3">ضباء</option>
                                            <option value="4">الوجه</option>
                                        </select>
                                    </div>
                                </div>

                                <div class="col-md-3" style="display: none;" id="hail-main">
                                    <div class="mb-25 form-grp">
                                        <label for="hail-main-city">يشيد</label>
                                        <select class="form-control" id="hail-main-city">
                                            <option style="display: none;">مدن أساسيه</option>
                                            <option value="1">البقعة</option>
                                            <option value="2">طريف، العويقلة</option>
                                        </select>
                                    </div>
                                </div>

                                <div class="col-md-3" style="display: none;" id="northern-main">
                                    <div class="mb-25 form-grp">
                                        <label for="northern-main-city">الحدود الشمالية</label>
                                        <select class="form-control" id="northern-main-city">
                                            <option style="display: none;">مدن أساسيه</option>
                                            <option value="1">رفحاء</option>
                                            <option value="2">طريف</option>
                                            <option value="3">العويقيلة</option>
                                        </select>
                                    </div>
                                </div>

                                <div class="col-md-3" style="display: none;" id="jizan-main">
                                    <div class="mb-25 form-grp">
                                        <label for="jizan-main-city">جازان</label>
                                        <select class="form-control" id="jizan-main-city">
                                            <option style="display: none;">مدن أساسيه</option>
                                            <option value="1">صبيا</option>
                                            <option value="2">ابو عريش</option>
                                            <option value="3">صامطة </option>
                                            <option value="4">جزيرة فرسان</option>
                                        </select>
                                    </div>
                                </div>

                                <div class="col-md-3" style="display: none;" id="najran-main">
                                    <div class="mb-25 form-grp">
                                        <label for="najran-main-city">نجران</label>
                                        <select class="form-control" id="najran-main-city">
                                            <option style="display: none;">مدن أساسيه</option>
                                            <option value="1">شرورة </option>
                                            <option value="2">هابونا</option>
                                            <option value="3">بدر الجنوب</option>
                                        </select>
                                    </div>
                                </div>

                                <div class="col-md-3" style="display: none;" id="bahah-main">
                                    <div class="mb-25 form-grp">
                                        <label for="bahah-main-city">الباحة</label>
                                        <select class="form-control" id="bahah-main-city">
                                            <option style="display: none;">مدن أساسيه</option>
                                            <option value="1">بلجرشي </option>
                                            <option value="2">المندق</option>
                                            <option value="3">العقيق</option>
                                        </select>
                                    </div>
                                </div>
                                
                                <div class="col-md-3" style="display: none;" id="bahah-main">
                                    <div class="mb-25 form-grp">
                                        <label for="bahah-main-city">الجوف</label>
                                        <select class="form-control" id="bahah-main-city">
                                            <option style="display: none;">مدن أساسيه</option>
                                            <option value="1">القريات</option>
                                            <option value="2">دومة الجندل</option>
                                            <option value="3">طبرجل</option>
                                        </select>
                                    </div>
                                </div>

                                <div class="col-md-3" style="display: none;" id="jawf-main">
                                    <div class="mb-25 form-grp">
                                        <label for="jawf-main-city">الجوف</label>
                                        <select class="form-control" id="jawf-main-city">
                                            <option style="display: none;">مدن أساسيه</option>
                                            <option value="1">القريات</option>
                                            <option value="2">دومة الجندل</option>
                                            <option value="3">طبرجل</option>
                                        </select>
                                    </div>
                                </div>

                                
                                <div class="col-md-3">
                                    <div class="mb-25 form-grp">
                                        <label for="main-school-type">مؤهل</label>
                                        <select class="form-control" id="main-school-type" onchange="changeFunc();">
                                            <option style="display: none;">يختار مؤهل</option>
                                            <option value="1">المدرسة الثانوية</option>
                                            <option value="2">شهادة دبلوم</option>
                                            <option value="3">درجة البكالريوس</option>
                                        </select>
                                    </div>
                                </div>

                                <div class="col-md-3" style="display: none;" id="highschool">
                                    <div class="mb-25 form-grp">
                                        <label for="high-school-type">المدرسة الثانوية</label>
                                        <select class="form-control" id="high-school-type" onchange="changeFunchigh();">                                            
                                            <option value="1">عام المدرسة الثانوية</option>
                                            <option value="2">مهني المدرسة الثانوية</option>
                                        </select>
                                    </div>
                                </div>


                               

                                <!-- Diploma -->

                                <div class="col-md-3" style="display: none;" id="main-diploma">
                                    <div class=" form-grp">
                                        <label for="diploma-type">شهادة دبلوم</label>
                                        <select class="form-control" id="diploma-type" onchange="changeFuncdiploma();">
                                            <option style="display: none;" selected>اختر الدبلومة</option>
                                            <option value="1">دبلوم مشارك</option>
                                            <option value="2">الدبلوم المتوسط</option>
                                        </select>
                                    </div>
                                </div>

                                


                                <!-- Bachelors Degree -->

                                <div class="col-md-3" style="display: none;" id="Bachelors-degree">
                                    <div class="form-grp">
                                        <label for="bachlor-type">درجة البكالريوس</label>
                                        <select class="form-control" id="bachlor-type" onchange="changeFuncbachlor();">                                            
                                            <option value="1">علمي</option>
                                            <option value="2">نظري </option>
                                        </select>
                                    </div>
                                </div>



                                <div class="col-md-3" style="display: none;" id="Bachelors-degree1">
                                    <div class="form-grp">
                                        <label for="bachlor-sub-degree">رجاء حدد</label>
                                        <div id="bachlor-sub-degree">
                                            <input type="text" class="form-control" id="name" autocomplete="off"
                                            required="">
                                        </div>                                          
                                            

                                        </select>
                                    </div>
                                </div>

                                <!-- major high -->
                                <div class="col-md-3" style="display: none;" id="high-school-major">
                                    <div class="form-grp">
                                        <label for="high-school-major-type">التخصصات</label>
                                        <select class="form-control" id="high-school-major-type">
                                            <option style="display: none;">حدد التخصص</option>
                                            <option value="11">الكهرباء</option>
                                            <option value="12">ميكانيكي</option>
                                            <option value="13">بناء</option>
                                            <option value="14">صناعي</option>
                                            <option value="15">أعمال/تجارية</option>
                                            <option value="16">علوم الحاسوب</option>
                                            <option value="17">آخر</option>
                                        </select>
                                    </div>
                                </div>

                                <!-- major diploma -->
                                <div class="col-md-3" style="display: none;" id="diploma-major">
                                    <div class=" form-grp">
                                        <label for="diploma-type-major">التخصصات</label>
                                        <select class="form-control" id="diploma-type-major">
                                            <option style="display: none;">حدد التخصص</option>
                                            <option value="1">الكهرباء</option>
                                            <option value="2">ميكانيكي</option>
                                            <option value="4">بناء</option>
                                            <option value="5">صناعي</option>
                                            <option value="6">أعمال/تجارية</option>
                                            <option value="7">علوم الحاسوب</option>
                                            <option value="8">آخر</option>
                                        </select>
                                    </div>
                                </div>

                                <!-- search -->
                        

                                <div class="col-md-3" style="display: none;" id="other-search">
                                    <div class="form-grp">
                                        <label for="name">رجاء حدد</label>
                                        <input type="text" class="form-control" id="name" autocomplete="off"
                                            required="">

                                    </div>
                                </div>

                                <!-- <div class="col-md-12 mt-4 d-flex justify-content-center">
                                    <a href="#" class="next-btn nxt" id="nxt">Next</a>
                                </div> -->
                            </div>
                        </div>
                    </div>

                    <div class="step2">
                        <!-- <h6>STEP 2 OF 3</h6>
                        <div class="progress progress-striped active">
                            <div role="progressbar " style="width: 60%;" class="progress-bar "><span>60%</span></div>
                        </div> -->
                        <div class="longcrs-form last-frm">
                            <h3>الاهتمام بـ SESP</h3>
                            <div class="row">
                                <div class="col-md-3">
                                    <div class="mb-25 form-grp">
                                        <label for="diploma-type">نوع الدبلوم</label>
                                        <select class="form-control" id="diploma-type">
                                            <option>دورات سيسب </option>
                                            <option>دورات قصيرة</option>
                                            <option>أي دبلوم جديد</option>

                                        </select>

                                    </div>
                                </div>
                                <div class="col-md-2">
                                    <div class="mb-25 form-grp">
                                        <label for="diploma-type">الفصل الدراسي/السنة</label>
                                        <select class="form-control" id="diploma-type">
                                            <option>يسقط </option>
                                            <option>ربيع</option>


                                        </select>

                                    </div>
                                </div>
                                <div class="col-md-7">
                                    <div class="mb-25 form-grp">
                                        <label for="diploma-type">برنامج </label>
                                        <select class="form-control" id="diploma-type">
                                            <option>دبلوم مشارك في الصحة والسلامة والبيئة</option>
                                            <option>الدبلوم المشارك في هندسة التشغيل والصيانة (ADOME)</option>
                                            <option>الدبلوم المشارك في التكنولوجيا (ADT)</option>

                                        </select>

                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="mb-25 form-grp">
                                        <label for="diploma-type">عنوان الدورة </label>
                                        <select class="form-control" id="diploma-type">
                                            <option>تكنولوجيا الصحة والسلامة والبيئة (HSET)</option>
                                            <option>تكنولوجيا الصحة والسلامة والبيئة (HSET)</option>
                                            <option>تكنولوجيا الصحة والسلامة والبيئة (HSET)</option>

                                        </select>

                                    </div>
                                </div>
                            </div>
                            <div class="checkbox-form mb-40">
                                <input type="checkbox" class="form-control arabic-radio-btns" id="check1" autocomplete="off" required="">
                                <label for="check1">أدرك أنه من خلال إكمال هذا النموذج وإرساله، ستكون معلوماتي متاحة لـ SESP.</label>

                            </div>
                            <div class="row">
                                <div class="col-md-12 mt-3">

                                    <a class="next-btn nxt" data-toggle="modal" href="#ignismyModal" id="SUBMIT">يُقدِّم </a>
                                </div>
                            </div>
                        </div>
                    </div>
                    </div>
                </div>
            </div>

        </div>

    </section>

    <div class="modal fade" id="ignismyModal" role="dialog">
        <div class="modal-dialog modal-dialog-centered">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label=""><span>×</span></button>
                </div>

                <div class="modal-body">

                    <div class="thank-you-pop">
                        <!-- <img src="http://goactionstations.co.uk/wp-content/uploads/2017/03/Green-Round-Tick.png" alt=""> -->
                        <i class="far fa-check-circle"></i>
                        <h1>شكرًا لك !</h1>
                        <p>المعلومات الواردة. تحقق من البريد الإلكتروني المرسل إلى صندوق الوارد الخاص بك للتحقق من البريد الإلكتروني.</p>
                        <a class="next-btn" href="register-interest-ar.php">نعم</a>

                    </div>

                </div>

            </div>
        </div>
    </div>





    <div class="sec-pad">
        <?php include("footer-ar.php")?>
    </div>

    <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"
        integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous">
    </script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.min.js"
        integrity="sha384-+sLIOodYLS7CIrQpBjl+C7nPvqq+FbNUBDunl/OZv93DB7Ln/533i8e/mZXLi/P+" crossorigin="anonymous">
    </script>
    <script src="https://www.google.com/recaptcha/api.js?onload=onloadCallback"></script>
    <script>
        $(document).ready(function () {
            $('#diploma-type-major').change(function () {
                if ($(this).val() == '8') {
                    $('#other-search').show();
                } else {
                    $('#other-search').hide();
                }
            });
            $('#high-school-major-type').change(function () {
                if ($(this).val() == '17') {
                    $('#other-search').show();
                } else {
                    $('#other-search').hide();
                }
            });
        });
    </script>
    <script type="text/javascript">
        function changeFunc() {
            var selectBox = document.getElementById("main-school-type");
            var selectedValue = selectBox.options[selectBox.selectedIndex].value;

            //  highschool
            // v_school
            if (selectedValue == '1') {
                $("#highschool").show()
                $("#main-diploma").hide()
                $("#associate-diploma").hide()
                $("#Bachelors-degree").hide()
                $("#high-school-major").hide()
                $("#Bachelors-degree1").hide()
                $('#other-search').hide();


            } else if (selectedValue == '2') {
                $("#main-diploma").show()
                $("#highschool").hide()
                $("#associate-diploma").show()
                $("#high-school-major").hide()
                $("#associate-diploma").hide()
                $("#Bachelors-degree").hide()
                $("#diploma-major").hide()
                $("#Bachelors-degree1").hide()
                $('#other-search').hide();

            } else if (selectedValue == '3') {
                $("#Bachelors-degree").show()
                $("#highschool").hide()
                $("#high-school-major").hide()
                $("#main-diploma").hide()
                $("#associate-diploma").hide()
                $("#associate-diploma").hide()
                $("#diploma-major").hide()
                $('#other-search').hide();
            }
           

            else {
               $("#Bachelors-degree").show()
                $("#highschool").hide()
                $("#high-school-major").hide()
                $("#main-diploma").hide()
                $("#associate-diploma").hide()
            }
        }
        function changeFunchigh() {
            var selectBox = document.getElementById("high-school-type");
            var selectedValue = selectBox.options[selectBox.selectedIndex].value;
            if (selectedValue == '2') {            

                $("#high-school-major").show()
                $("#main-diploma").hide()
                $("#associate-diploma").hide()
                $("#Bachelors-degree").hide()
            } 
            if (selectedValue == '1') {            

                $("#high-school-major").hide()
                $("#main-diploma").hide()
                $("#associate-diploma").hide()
                $("#Bachelors-degree").hide()
            } 
        }

        function changeFuncdiploma() {
            var selectBox = document.getElementById("diploma-type");
            var selectedValue = selectBox.options[selectBox.selectedIndex].value;
            if (selectedValue) {            

                $("#diploma-major").show()
                $("#associate-diploma").hide()
                $("#Bachelors-degree").hide()
                
            } 
            
        }
        
        function changeFuncloc() {
            var selectBox = document.getElementById("main-location-type");
            var selectedValue = selectBox.options[selectBox.selectedIndex].value;
            if (selectedValue=="1") {            
                $("#riyadh-main").show()
                $("#makkah-main").hide()
                $("#medina-main").hide()
                $("#eastern-main").hide()
                $("#qassim-main").hide()
                $("#asir-main").hide()
                $("#tabuk-main").hide()
                $("#hail-main").hide()
                $("#northern-main").hide()
                $("#jizan-main").hide()
                $("#najran-main").hide()
                $("#bahah-main").hide()
                $("#jawf-main").hide()
            }
            else if (selectedValue=="2") {            
                $("#makkah-main").show()
                $("#riyadh-main").hide()
                $("#medina-main").hide()
                $("#eastern-main").hide()
                $("#qassim-main").hide()
                $("#asir-main").hide()
                $("#tabuk-main").hide()
                $("#hail-main").hide()
                $("#northern-main").hide()
                $("#jizan-main").hide()
                $("#najran-main").hide()
                $("#bahah-main").hide()
                $("#jawf-main").hide()
            }
            else if (selectedValue=="3") {            
                $("#medina-main").show()
                $("#makkah-main").hide()
                $("#riyadh-main").hide()
                $("#eastern-main").hide()
                $("#qassim-main").hide()
                $("#asir-main").hide()
                $("#tabuk-main").hide()
                $("#hail-main").hide()
                $("#northern-main").hide()
                $("#jizan-main").hide()
                $("#najran-main").hide()
                $("#bahah-main").hide()
                $("#jawf-main").hide()
            }
            else if (selectedValue=="4") {            
                $("#eastern-main").show()
                $("#makkah-main").hide()
                $("#medina-main").hide()
                $("#riyadh-main").hide()
                $("#qassim-main").hide()
                $("#asir-main").hide()
                $("#tabuk-main").hide()
                $("#hail-main").hide()
                $("#northern-main").hide()
                $("#jizan-main").hide()
                $("#najran-main").hide()
                $("#bahah-main").hide()
                $("#jawf-main").hide()
            }
            else if (selectedValue=="5") {            
                $("#qassim-main").show()
                $("#riyadh-main").hide()
                $("#makkah-main").hide()
                $("#medina-main").hide()
                $("#eastern-main").hide()
                $("#asir-main").hide()
                $("#tabuk-main").hide()
                $("#hail-main").hide()
                $("#northern-main").hide()
                $("#jizan-main").hide()
                $("#najran-main").hide()
                $("#bahah-main").hide()
                $("#jawf-main").hide()
            }
            else if (selectedValue=="6") {            
                $("#asir-main").show()
                $("#riyadh-main").hide()
                $("#makkah-main").hide()
                $("#medina-main").hide()
                $("#eastern-main").hide()
                $("#qassim-main").hide()
                $("#tabuk-main").hide()
                $("#hail-main").hide()
                $("#northern-main").hide()
                $("#jizan-main").hide()
                $("#najran-main").hide()
                $("#bahah-main").hide()
                $("#jawf-main").hide()
            }
            else if (selectedValue=="7") {            
                $("#tabuk-main").show()
                $("#riyadh-main").hide()
                $("#makkah-main").hide()
                $("#medina-main").hide()
                $("#eastern-main").hide()
                $("#qassim-main").hide()
                $("#asir-main").hide()
                $("#hail-main").hide()
                $("#northern-main").hide()
                $("#jizan-main").hide()
                $("#najran-main").hide()
                $("#bahah-main").hide()
                $("#jawf-main").hide()
            }
            else if (selectedValue=="8") {            
                $("#hail-main").show()
                $("#riyadh-main").hide()
                $("#makkah-main").hide()
                $("#medina-main").hide()
                $("#eastern-main").hide()
                $("#qassim-main").hide()
                $("#asir-main").hide()
                $("#tabuk-main").hide()
                $("#northern-main").hide()
                $("#jizan-main").hide()
                $("#najran-main").hide()
                $("#bahah-main").hide()
                $("#jawf-main").hide()
            }
            else if (selectedValue=="9") {            
                $("#northern-main").show()
                $("#riyadh-main").hide()
                $("#makkah-main").hide()
                $("#medina-main").hide()
                $("#eastern-main").hide()
                $("#qassim-main").hide()
                $("#asir-main").hide()
                $("#tabuk-main").hide()
                $("#hail-main").hide()
                $("#jizan-main").hide()
                $("#najran-main").hide()
                $("#bahah-main").hide()
                $("#jawf-main").hide()
            }
            else if (selectedValue=="10") {            
                $("#jizan-main").show()
                $("#riyadh-main").hide()
                $("#makkah-main").hide()
                $("#medina-main").hide()
                $("#eastern-main").hide()
                $("#qassim-main").hide()
                $("#asir-main").hide()
                $("#tabuk-main").hide()
                $("#hail-main").hide()
                $("#northern-main").hide()
                $("#najran-main").hide()
                $("#bahah-main").hide()
                $("#jawf-main").hide()
            }
            else if (selectedValue=="11") {            
                $("#najran-main").show()
                $("#riyadh-main").hide()
                $("#makkah-main").hide()
                $("#medina-main").hide()
                $("#eastern-main").hide()
                $("#qassim-main").hide()
                $("#asir-main").hide()
                $("#tabuk-main").hide()
                $("#hail-main").hide()
                $("#northern-main").hide()
                $("#jizan-main").hide()
                $("#bahah-main").hide()
                $("#jawf-main").hide()
            }
            else if (selectedValue=="12") {            
                $("#bahah-main").show()
                $("#riyadh-main").hide()
                $("#makkah-main").hide()
                $("#medina-main").hide()
                $("#eastern-main").hide()
                $("#qassim-main").hide()
                $("#asir-main").hide()
                $("#tabuk-main").hide()
                $("#hail-main").hide()
                $("#northern-main").hide()
                $("#jizan-main").hide()
                $("#najran-main").hide()
                $("#jawf-main").hide()
            }
            else if (selectedValue=="13") {            
                $("#jawf-main").show()
                $("#riyadh-main").hide()
                $("#makkah-main").hide()
                $("#medina-main").hide()
                $("#eastern-main").hide()
                $("#qassim-main").hide()
                $("#asir-main").hide()
                $("#tabuk-main").hide()
                $("#hail-main").hide()
                $("#northern-main").hide()
                $("#jizan-main").hide()
                $("#najran-main").hide()
                $("#bahah-main").hide()
            }
            
        }

        

        function changeFuncbachlor() {
            var selectBox = document.getElementById("bachlor-type");
            var selectedValue = selectBox.options[selectBox.selectedIndex].value;
            if (selectedValue) {            

                $("#Bachelors-degree1").show()
                $("#diploma-major").hide()
            } 
            
        }
      
    </script>
</body>

</html>