diff --git a/Modules/CostCalculator/app/Http/Controllers/CostCalculatorController.php b/Modules/CostCalculator/app/Http/Controllers/CostCalculatorController.php index 5518d6d..c139514 100644 --- a/Modules/CostCalculator/app/Http/Controllers/CostCalculatorController.php +++ b/Modules/CostCalculator/app/Http/Controllers/CostCalculatorController.php @@ -25,24 +25,77 @@ class CostCalculatorController extends Controller $this->costCalculatorService = $costCalculatorService; } + public function formatCostForStayType(CostCalculator $cost, string $stayTypeTitle) + { + $living = optional($cost->stayTypeLiving->firstWhere('title', $stayTypeTitle))->pivot; + $accomodation = optional($cost->stayTypeAccomodation->firstWhere('title', $stayTypeTitle))->pivot; + $onetime = optional($cost->stayTypeOnetime->firstWhere('title', $stayTypeTitle))->pivot; + $service = optional($cost->stayTypeService->firstWhere('title', $stayTypeTitle))->pivot; + + $html = "
"; + + if ($living) { + $html .= "
+ Living + {$living->monthly} /mo | {$living->yearly} /yr +
"; + } + if ($accomodation) { + $html .= "
+ Accommodation + {$accomodation->monthly} /mo | {$accomodation->yearly} /yr +
"; + } + if ($onetime) { + $html .= "
+ One-time + Visa: {$onetime->visa}, Bio: {$onetime->biometrics}, + Sevis: {$onetime->sevis}, App: {$onetime->application} +
"; + } + if ($service) { + $html .= "
+ Service + Ticket: {$service->flight_ticket}, Ins: {$service->insurance}, + Extra: {$service->extra} +
"; + } + + $html .= "
"; + + return trim($html) ?: '-'; + } + + public function index(Request $request) { - // $data['title'] = 'Cost Calculator List'; - // $data['costs'] = $this->costCalculatorService->findAll($request); - // $data['countryOptions'] = Country::where('status', 1)->pluck('title', 'id'); - // $data['programLevelOptions'] = ProgramLevel::where('status', 1)->pluck('title', 'id'); - // $data['programOptions'] = Program::where('status', 1)->pluck('title', 'id'); - // $data['livingStatusOptions'] = config('constants.living_status'); + if ($request->ajax()) { + $model = CostCalculator::with([ + 'country', + 'stayTypeLiving', + 'stayTypeAccomodation', + 'stayTypeOnetime', + 'stayTypeService' + ]); - // return view('costcalculator::cost.index', $data); - - if (request()->ajax()) { - $model = CostCalculator::query()->orderBy('order'); return DataTables::eloquent($model) ->addIndexColumn() ->setRowClass('tableRow') - ->editColumn('image', function (CostCalculator $cost) { - return $cost->getRawOriginal('image') ? "{$cost->country->image}" : '-'; + ->editColumn('country', function (CostCalculator $cost) { + return "
+
+

{$cost->country?->title}

+
+
"; + }) + ->editColumn('alone', function (CostCalculator $cost) { + return $this->formatCostForStayType($cost, 'Alone'); + }) + ->editColumn('with_spouse', function (CostCalculator $cost) { + return $this->formatCostForStayType($cost, 'With Spouse'); + }) + ->editColumn('with_spouse_and_child', function (CostCalculator $cost) { + return $this->formatCostForStayType($cost, 'With Spouse and Child'); }) ->editColumn('status', function (CostCalculator $cost) { $status = $cost->status ? 'Published' : 'Draft'; @@ -50,25 +103,23 @@ class CostCalculatorController extends Controller return "

{$status}

"; }) ->addColumn('action', 'costcalculator::cost.datatable.action') - ->rawColumns(['image', 'status', 'action']) + ->rawColumns(['country', 'alone', 'with_spouse', 'with_spouse_and_child', 'status', 'action']) ->toJson(); } - return view('costcalculator::cost.index', [ - 'title' => 'Cost Calculator List', + 'title' => 'Estimated Cost Calculation', ]); } + /** * Show the form for creating a new resource. */ public function create() { - $data['title'] = 'Create Cost Calculator'; + $data['title'] = 'Create Estimated Cost Calculation'; $data['editable'] = false; $data['countryOptions'] = Country::where('status', 1)->where('parent_id', null)->pluck('title', 'id'); - $data['programLevelOptions'] = ProgramLevel::where('status', 1)->pluck('title', 'id'); - $data['programOptions'] = Program::where('status', 1)->pluck('title', 'id'); $data['livingStatusOptions'] = StayType::where('status', 1)->pluck('title', 'id'); return view('costcalculator::cost.create', $data); @@ -81,7 +132,6 @@ class CostCalculatorController extends Controller { $request->validate([ 'country_id' => 'required', - 'programlevel_id' => 'required', ]); $input = $request->except(['living_cost', 'accomodation_cost', 'onetime_cost', 'service_cost']); @@ -110,7 +160,7 @@ class CostCalculatorController extends Controller } foreach ($request->onetime_cost as $item) { - $attachLivingData[$item['stay_type_id']] = [ + $attachOnetimeData[$item['stay_type_id']] = [ 'visa' => $item['visa'], 'biometrics' => $item['biometrics'], 'sevis' => $item['sevis'], @@ -119,7 +169,7 @@ class CostCalculatorController extends Controller } foreach ($request->service_cost as $item) { - $attachLivingData[$item['stay_type_id']] = [ + $attachServiceData[$item['stay_type_id']] = [ 'flight_ticket' => $item['flight_ticket'], 'insurance' => $item['insurance'], 'extra' => $item['extra'], @@ -134,7 +184,7 @@ class CostCalculatorController extends Controller flash()->success('Cost Calculation has been created!'); }); - return redirect()->route('costCalculator.index'); + return redirect()->route('cost.index'); } /** @@ -153,13 +203,11 @@ class CostCalculatorController extends Controller */ public function edit($id) { - $data['title'] = 'Edit Cost Calculator'; + $data['title'] = 'Edit Cost Calculator'; $data['editable'] = true; $data['cost'] = CostCalculator::findOrFail($id); - $data['countryOptions'] = Country::where('status', 1)->pluck('title', 'id'); - $data['programLevelOptions'] = ProgramLevel::where('status', 1)->pluck('title', 'id'); - $data['programOptions'] = Program::where('status', 1)->pluck('title', 'id'); - $data['livingStatusOptions'] = config('constants.living_status'); + $data['countryOptions'] = Country::where('status', 1)->where('parent_id', null)->pluck('title', 'id'); + $data['livingStatusOptions'] = StayType::where('status', 1)->pluck('title', 'id'); return view('costcalculator::cost.edit', $data); } @@ -174,10 +222,10 @@ class CostCalculatorController extends Controller $program = CostCalculator::findOrFail($id); $program->update($input); - flash()->success('Cost Calculation has been updated!'); + flash()->success('Cost Calculation has been updated!'); }); - return redirect()->route('costCalculator.index')->withSuccess('Program has been updated!'); + return redirect()->route('cost.index')->withSuccess('Program has been updated!'); } /** @@ -195,5 +243,4 @@ class CostCalculatorController extends Controller } return response()->json(['status' => 200, 'message' => 'Cost Calculator has been deleted!'], 200); } - } diff --git a/Modules/CostCalculator/app/Models/CostCalculator.php b/Modules/CostCalculator/app/Models/CostCalculator.php index f376af2..34168b4 100644 --- a/Modules/CostCalculator/app/Models/CostCalculator.php +++ b/Modules/CostCalculator/app/Models/CostCalculator.php @@ -8,6 +8,7 @@ use Modules\CCMS\Models\Country; use Modules\CourseFinder\Models\Program; use Modules\CourseFinder\Models\ProgramLevel; use Modules\CostCalculator\Models\StayType; +use Illuminate\Database\Eloquent\Relations\BelongsToMany; // use Modules\CostCalculator\Database\Factories\CostCalculatorFactory; @@ -30,16 +31,6 @@ class CostCalculator extends Model return $this->belongsTo(Country::class, 'country_id'); } - public function programLevel() - { - return $this->belongsTo(ProgramLevel::class, 'programlevel_id'); - } - - public function program() - { - return $this->belongsTo(Program::class, 'program_id'); - } - public function stayTypeLiving(): BelongsToMany { return $this->belongsToMany(StayType::class, 'living_costs', 'cost_calculator_id', 'stay_type_id')->withPivot('id', 'monthly', 'yearly')->withTimestamps(); diff --git a/Modules/CostCalculator/database/migrations/2025_08_13_102211_create_cost_calculators_table.php b/Modules/CostCalculator/database/migrations/2025_08_13_102211_create_cost_calculators_table.php index f36e669..1a0c0b3 100644 --- a/Modules/CostCalculator/database/migrations/2025_08_13_102211_create_cost_calculators_table.php +++ b/Modules/CostCalculator/database/migrations/2025_08_13_102211_create_cost_calculators_table.php @@ -14,8 +14,6 @@ return new class extends Migration Schema::create('cost_calculators', function (Blueprint $table) { $table->id(); $table->unsignedInteger('country_id')->nullable(); - $table->unsignedInteger('programlevel_id')->nullable(); - $table->unsignedInteger('program_id')->nullable(); $table->unsignedInteger('createdby')->nullable(); $table->unsignedInteger('updatedby')->nullable(); $table->boolean('status')->default(1); diff --git a/Modules/CostCalculator/resources/views/cost/datatable/action.blade.php b/Modules/CostCalculator/resources/views/cost/datatable/action.blade.php index 72af1b8..82b1c30 100644 --- a/Modules/CostCalculator/resources/views/cost/datatable/action.blade.php +++ b/Modules/CostCalculator/resources/views/cost/datatable/action.blade.php @@ -2,9 +2,9 @@ - + class="link-info fs-15 toggle-item"> --}} diff --git a/Modules/CostCalculator/resources/views/cost/edit.blade.php b/Modules/CostCalculator/resources/views/cost/edit.blade.php index e69de29..d26e38f 100644 --- a/Modules/CostCalculator/resources/views/cost/edit.blade.php +++ b/Modules/CostCalculator/resources/views/cost/edit.blade.php @@ -0,0 +1,10 @@ +@extends('layouts.app') +@section('content') +
+ + + {{ html()->modelForm($cost, 'PUT')->route('cost.update', $cost->id)->class(['needs-validation'])->attributes(['novalidate', 'enctype' => 'multipart/form-data', 'onkeydown' => "return event.key != 'Enter';"])->open() }} + @include('costcalculator::cost.partials.form') + {{ html()->closeModelForm() }} +
+@endsection diff --git a/Modules/CostCalculator/resources/views/cost/index.blade.php b/Modules/CostCalculator/resources/views/cost/index.blade.php index 0c8c40e..89620e6 100644 --- a/Modules/CostCalculator/resources/views/cost/index.blade.php +++ b/Modules/CostCalculator/resources/views/cost/index.blade.php @@ -12,7 +12,8 @@
{{ $title }}
-
Create + Create
@php @@ -25,9 +26,10 @@ 'searchable' => false, 'sortable' => false, ], - ['title' => 'Image', 'data' => 'image', 'name' => 'image'], - ['title' => 'Program Level', 'data' => 'program_level', 'name' => 'title'], - ['title' => 'Slug', 'data' => 'slug', 'name' => 'slug'], + ['title' => 'Country', 'data' => 'country', 'name' => 'country'], + ['title' => 'Alone', 'data' => 'alone', 'name' => 'alone'], + ['title' => 'With Spouse', 'data' => 'with_spouse', 'name' => 'with_spouse'], + ['title' => 'With Spouse and Child', 'data' => 'with_spouse_and_child', 'name' => 'with_spouse_and_child'], ['title' => 'Status', 'data' => 'status', 'name' => 'status'], [ 'title' => 'Action', @@ -37,7 +39,7 @@ ], ]; @endphp - +
diff --git a/Modules/CostCalculator/resources/views/cost/partials/form.blade.php b/Modules/CostCalculator/resources/views/cost/partials/form.blade.php index 2fc1303..c0569ed 100644 --- a/Modules/CostCalculator/resources/views/cost/partials/form.blade.php +++ b/Modules/CostCalculator/resources/views/cost/partials/form.blade.php @@ -4,7 +4,7 @@
-
Cost Calculator
+
Cost Calculation
    @@ -22,25 +22,12 @@
-
+
{{ html()->label('Country')->class('form-label') }} {{ html()->span('*')->class('text-danger') }} {{ html()->select('country_id', $countryOptions)->placeholder('Select')->class('form-select choices-select')->required() }} {{ html()->div('Please select country')->class('invalid-feedback') }}
- -
- {{ html()->label('Program Level')->class('form-label')->for('programlevel_id') }} - {{ html()->span('*')->class('text-danger') }} - {{ html()->select('programlevel_id', $programLevelOptions)->placeholder('Select')->class('form-select choices-select') }} - {{ html()->div('Please select program level')->class('invalid-feedback') }} -
- -
- {{ html()->label('Program')->class('form-label')->for('program_id') }} - {{ html()->select('program_id', $programOptions)->placeholder('Select')->class('form-select choices-select') }} - {{ html()->div('Please select program')->class('invalid-feedback') }} -
@@ -83,21 +70,16 @@ @if ($editable) - @if ($cost->living_cost) - - @forelse ($program->living_cost as $key => $item) - @include('costcalculator::cost.partials.living-cost', [ - 'numInc' => $key, - 'value' => $item, - ]) - @empty - @endforelse - @else + @forelse ($cost->stayTypeLiving as $key => $item) + @include('costcalculator::cost.partials.living-cost', [ + 'numInc' => $key, + 'value' => $item, + ]) + @empty @include('costcalculator::cost.partials.living-cost', [ 'numInc' => 0, ]) - - @endif + @endforelse @else @include('costcalculator::cost.partials.living-cost', [ 'numInc' => 0, @@ -142,7 +124,7 @@ @if ($editable) - @forelse ($cost->accomodation_cost as $key => $item) + @forelse ($cost->stayTypeAccomodation as $key => $item) @include('costcalculator::cost.partials.accomodation-cost', [ 'numInc' => $key, 'value' => $item, @@ -200,20 +182,17 @@ @if ($editable) - @if ($cost->onetime_cost) - @forelse ($cost->onetime_cost as $key => $item) - @include('costcalculator::cost.partials.onetime-cost', [ - 'numInc' => $key, - 'value' => $item, - ]) - @empty - @endforelse + @forelse ($cost->stayTypeOnetime as $key => $item) + @include('costcalculator::cost.partials.onetime-cost', [ + 'numInc' => $key, + 'value' => $item, + ]) + @empty @else @include('costcalculator::cost.partials.onetime-cost', [ 'numInc' => 0, ]) - - @endif + @endforelse @else @include('costcalculator::cost.partials.onetime-cost', [ 'numInc' => 0, @@ -259,20 +238,16 @@ @if ($editable) - @if ($cost->other_services) - @forelse ($cost->other_services as $key => $item) - @include('costcalculator::cost.partials.service-cost', [ - 'numInc' => $key, - 'value' => $item, - ]) - @empty - @endforelse - @else + @forelse ($cost->stayTypeService as $key => $item) + @include('costcalculator::cost.partials.service-cost', [ + 'numInc' => $key, + 'value' => $item, + ]) + @empty @include('costcalculator::cost.partials.service-cost', [ 'numInc' => 0, ]) - - @endif + @endforelse @else @include('costcalculator::cost.partials.service-cost', [ 'numInc' => 0, diff --git a/app/Helpers/Helper.php b/app/Helpers/Helper.php index e1fba1e..cf897b9 100644 --- a/app/Helpers/Helper.php +++ b/app/Helpers/Helper.php @@ -203,4 +203,5 @@ if (!function_exists('getFormatted')) { return $filePath; } } + } diff --git a/public/raffles/assets/css/style.css b/public/raffles/assets/css/style.css index 6151934..813ab7b 100644 --- a/public/raffles/assets/css/style.css +++ b/public/raffles/assets/css/style.css @@ -1,30 +1,28 @@ + :root { --color-brand: #CE171F; - --color-sec: #1856A6; - --color-ter: #3c3bc3; - --color-four: #121178; - --color-yellow: #FDB913; - --color-sec2: #1F3869; - --color-light-red: #F7EFFF; - --color-light-blue: #FAFAFA; - --color-light-grey: #E1E1E1; - --color-green: #28A745; + --color-sec: #1856A6; + --color-ter: #3c3bc3; + --color-four: #121178; + --color-yellow: #FDB913; + --color-sec2: #1F3869; + --color-light-red: #F7EFFF; + --color-light-blue: #FAFAFA; + --color-light-grey: #E1E1E1; + --color-green: #28A745; + } + @font-face { + font-family: 'Outfit'; + src: url('../fonts/outfit/Outfit-VariableFont_wght.ttf') format('truetype'); + font-weight: 100 900; + font-style: normal; } - -@font-face { - font-family: 'Outfit'; - src: url('../fonts/outfit/Outfit-VariableFont_wght.ttf') format('truetype'); - font-weight: 100 900; - font-style: normal; -} - -.bibhuti { +.bibhuti{ font-family: 'pacifico', cursive; } - -/* @font-face { + /* @font-face { font-family: 'Poppins'; src: url('assets/fonts/Poppins/Poppins-Regular.ttf') format('ttf'), url('assets/fonts/Poppins/Poppins-Regular.ttf') format('wottfff'); @@ -35,199 +33,181 @@ body { /* font-family: 'Poppins', sans-serif !important; */ font-family: 'Outfit', sans-serif; - /* font-weight: normal; */ + /* font-weight: normal; */ } -.text-brand { + .text-brand{ color: var(--color-brand) !important; -} - -.text-sec { + } + .text-sec{ color: var(--color-sec) !important; -} - -.text-sec2 { + } + .text-sec2{ color: var(--color-sec2) !important; -} - -.text-ter { + } + .text-ter{ color: var(--color-ter) !important; -} - -.text-four { + } + .text-four{ color: var(--color-four) !important; -} - -.text-grey { + } + .text-grey{ color: grey !important; -} - -.bg-brand { + } + .bg-brand{ background-color: var(--color-brand) !important; color: white; -} - -.bg-sec { + } + .bg-sec{ background-color: var(--color-sec) !important; -} - -.bg-yellow { + } + .bg-yellow{ background-color: var(--color-yellow) !important; -} - -.bg-ter { + } + .bg-ter{ background-color: var(--color-ter) !important; -} - -.bg-light-red { + } + .bg-light-red{ background-color: var(--color-light-red) !important; -} - -.bg-light-blue { + } + .bg-light-blue{ background-color: var(--color-light-blue) !important; -} - -.bg-green { + } + .bg-green{ background-color: var(--color-green) !important; -} - -.border-light-grey { + } + .border-light-grey{ border: 1px solid var(--color-light-grey) !important; -} - -.button-hover:hover { + } + .button-hover:hover{ box-shadow: 0 5px 10px gray; transform: translateY(-5px); transition: .3s all ease-in-out; -} - -.text-hover:hover { + } + .text-hover:hover{ transform: translateY(-5px); transition: .3s all ease-in-out; -} + } + .order-1{ + order: 1; + } + .order-2{ + order: 2; + } + @media (min-width:768px) { + .md-order-2{ + order: 2; + } + .md-order-1{ + order: 1; + } + } - -/* font size */ -.text-10 { + /* font size */ + .text-10 { font-size: 10px; -} - -.text-12 { + } + .text-12 { font-size: 12px; -} - -.text-14 { + } + .text-14 { font-size: 14px !important; -} - -.text-16 { + } + .text-16 { font-size: 16px; -} - -.text-18 { + } + .text-18 { font-size: 18px; -} - -.text-20 { + } + .text-20 { font-size: 20px; -} - -.text-24 { + } + .text-24 { font-size: 24px; -} - -.text-40 { + } + .text-40 { font-size: 40px; -} + } -.section { + .section{ margin-top: 30px; -} - -.section-heading { + } + .section-heading{ font-size: 42px; color: var(--color-brand); font-weight: 700; text-align: center; -} - -.section-heading-sec { + } + .section-heading-sec{ font-size: 32px; color: var(--color-sec); font-weight: 700; text-align: center; -} - -@media (min-width:540px) { - .section-heading-sec { + } + @media (min-width:540px) { + .section-heading-sec{ font-size: 42px; - } + } -} - -.hover\:bg-white:hover { + } + .hover\:bg-white:hover { background-color: white !important; -} - -.hover\:text-black:hover { + } + .hover\:text-black:hover { color: black !important; + } + .section-break { + margin: 60px 0; + position: relative; + height: 1px; + background-color: #e0e0e0; + } + .section-break::after { + content: ""; + position: absolute; + width: 50px; + height: 5px; + background-color: #e74c3c; + top: -2px; + left: 50%; + transform: translateX(-50%); + border-radius: 2px; + } + + /* Alternative section break - just a line */ + .simple-break { + margin: 40px 0; + height: 1px; + background: linear-gradient(to right, transparent, #d0d0d0, transparent); + } + + /* Alternative section break - dots */ + .dot-break { + margin: 40px 0; + text-align: center; + letter-spacing: 8px; + color: #d0d0d0; + font-size: 20px; + } + + + +.border-right-brand{ + border-right: 1px solid var(--color-sec) !important; } - -.section-break { - margin: 60px 0; - position: relative; - height: 1px; - background-color: #e0e0e0; -} - -.section-break::after { - content: ""; - position: absolute; - width: 50px; - height: 5px; - background-color: #e74c3c; - top: -2px; - left: 50%; - transform: translateX(-50%); - border-radius: 2px; -} - -/* Alternative section break - just a line */ -.simple-break { - margin: 40px 0; - height: 1px; - background: linear-gradient(to right, transparent, #d0d0d0, transparent); -} - -/* Alternative section break - dots */ -.dot-break { - margin: 40px 0; - text-align: center; - letter-spacing: 8px; - color: #d0d0d0; - font-size: 20px; -} - - - -.border-right-brand { - border-right: 1px solid var(--color-sec) !important; -} - -.horz-line { + .horz-line{ height: 150px; width: 1px; background-color: black; position: relative; z-index: -1; -} - -/* .horz-line { + } + /* .horz-line { transition: all 1s ease-in-out; transform: translateY(-90px); opacity: 0; @@ -237,73 +217,63 @@ body { transform: translateY(0); opacity: 1; } */ -.uni-img { + .uni-img { transition: all 1s ease-in-out; transform: translateY(-90px); opacity: 0; width: 60%; } - -.uni-img img { + .uni-img img{ width: 100%; height: 100%; -} + } .uni-img.animate { transform: translateY(0); opacity: 1; } +.uni-video{ + margin: 30px 0; -.uni-video { - margin: 30px 0; - - background-color: #FEFDFD; + background-color: #FEFDFD; } - @media (min-width:540px) { - .uni-video { + .uni-video{ - padding: 30px 0; - - } + padding: 30px 0; } -.dotted { +} + .dotted{ /* width: 50%; */ height: 25px; /* border: 1px solid black; */ border-right: 5px dotted var(--color-sec); -} - -.dotted-b { + } + .dotted-b{ /* width: 50%; */ height: 25px; /* border: 1px solid black; */ border-right: 5px dotted black; -} - -.curve-1::after { + } + .curve-1::after { content: ""; position: absolute; - bottom: 70px; - /* Adjust as needed */ + bottom: 70px; /* Adjust as needed */ left: 9%; - width: 200px; - /* Set width */ - height: 50px; - /* Set height */ + width: 200px; /* Set width */ + height: 50px; /* Set height */ background-image: url('assets/images/demo/start-hub-1/lines.svg'); background-size: contain; background-repeat: no-repeat; } - -.iconbox-icon-wrap .bg-change { - background-color: #f7efff; - color: #fdb100; +.iconbox-icon-wrap .bg-change{ + background-color: #f7efff; + color: #fdb100; } @@ -319,230 +289,209 @@ body { } */ -/* Animated phone icon on top */ -.phone-icon-top { - position: absolute; - top: -25px; - left: 20px; - width: 40px; - height: 40px; - background: #ef4444; - border-radius: 50%; - display: flex; - align-items: center; - justify-content: center; - box-shadow: 0 4px 12px rgba(239, 68, 68, 0.3); - z-index: 10; - animation: phoneRing 2s ease-in-out infinite; -} + /* Animated phone icon on top */ + .phone-icon-top { + position: absolute; + top: -25px; + left: 20px; + width: 40px; + height: 40px; + background: #ef4444; + border-radius: 50%; + display: flex; + align-items: center; + justify-content: center; + box-shadow: 0 4px 12px rgba(239, 68, 68, 0.3); + z-index: 10; + animation: phoneRing 2s ease-in-out infinite; + } -.cta-wrapper { - position: relative; - display: inline-block; + .cta-wrapper { + position: relative; + display: inline-block; - /* bottom: -55px; */ - left: 50%; - translate: -50%; - z-index: 100; -} + /* bottom: -55px; */ + left: 50%; + translate: -50%; +z-index: 100; + } -.phone-icon-top svg { - width: 20px; - height: 20px; - fill: white; -} + .phone-icon-top svg { + width: 20px; + height: 20px; + fill: white; + } -/* Phone ringing animation */ -@keyframes phoneRing { + /* Phone ringing animation */ + @keyframes phoneRing { + 0%, 10%, 20%, 30%, 50%, 100% { + transform: rotate(0deg) scale(1); + } + 5%, 15%, 25% { + transform: rotate(-15deg) scale(1.1); + } + 35% { + transform: rotate(15deg) scale(1.1); + } + } - 0%, - 10%, - 20%, - 30%, - 50%, - 100% { - transform: rotate(0deg) scale(1); - } + .cta-button-call { + background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%); + color: white; + padding: 12px 20px; + border-radius: 50px; + text-decoration: none; + font-size: 16px; + font-weight: 600; + display: inline-flex; + align-items: center; + gap: 12px; + border: none; + cursor: pointer; + box-shadow: 0 4px 15px rgba(59, 130, 246, 0.3); + transition: all 0.2s ease; + animation: jump 1.5s ease-in-out infinite; + position: relative; + padding-left: 50px; /* Extra space for phone icon */ + } - 5%, - 15%, - 25% { - transform: rotate(-15deg) scale(1.1); - } + /* Continuous jumping animation */ + @keyframes jump { + 0%, 60%, 100% { + transform: translateY(0); + } + 30% { + transform: translateY(-8px); + } + } - 35% { - transform: rotate(15deg) scale(1.1); - } -} + .cta-button-call:hover { + transform: translateY(-2px); + box-shadow: 0 6px 20px rgba(59, 130, 246, 0.4); + animation-play-state: paused; + } -.cta-button-call { - background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%); - color: white; - padding: 12px 20px; - border-radius: 50px; - text-decoration: none; - font-size: 16px; - font-weight: 600; - display: inline-flex; - align-items: center; - gap: 12px; - border: none; - cursor: pointer; - box-shadow: 0 4px 15px rgba(59, 130, 246, 0.3); - transition: all 0.2s ease; - animation: jump 1.5s ease-in-out infinite; - position: relative; - padding-left: 50px; - /* Extra space for phone icon */ -} + .cta-button-call:hover .phone-icon-top { + animation-play-state: paused; + transform: scale(1.2); + } -/* Continuous jumping animation */ -@keyframes jump { + .cta-button-call:active { + transform: translateY(0); + } - 0%, - 60%, - 100% { - transform: translateY(0); - } + /* Red accent circle */ + .cta-accent { + width: 20px; + height: 20px; + background: #ef4444; + border-radius: 50%; + position: relative; + flex-shrink: 0; + } - 30% { - transform: translateY(-8px); - } -} + .cta-accent::after { + content: ''; + position: absolute; + top: 50%; + left: 50%; + width: 6px; + height: 6px; + background: white; + border-radius: 50%; + transform: translate(-50%, -50%); + } -.cta-button-call:hover { - transform: translateY(-2px); - box-shadow: 0 6px 20px rgba(59, 130, 246, 0.4); - animation-play-state: paused; -} + /* Text styling */ + .cta-text { + white-space: nowrap; + } -.cta-button-call:hover .phone-icon-top { - animation-play-state: paused; - transform: scale(1.2); -} + @media (max-width: 768px) { + .cta-button { + padding: 16px 30px; + padding-left: 45px; + font-size: 15px; + gap: 10px; + } -.cta-button-call:active { - transform: translateY(0); -} + .phone-icon-top { + width: 35px; + height: 35px; + top: -22px; + left: 15px; + } -/* Red accent circle */ -.cta-accent { - width: 20px; - height: 20px; - background: #ef4444; - border-radius: 50%; - position: relative; - flex-shrink: 0; -} + .phone-icon-top svg { + width: 18px; + height: 18px; + } -.cta-accent::after { - content: ''; - position: absolute; - top: 50%; - left: 50%; - width: 6px; - height: 6px; - background: white; - border-radius: 50%; - transform: translate(-50%, -50%); -} + .cta-accent { + width: 18px; + height: 18px; + } -/* Text styling */ -.cta-text { - white-space: nowrap; -} + .cta-accent::after { + width: 5px; + height: 5px; + } + } -@media (max-width: 768px) { - .cta-button { - padding: 16px 30px; - padding-left: 45px; - font-size: 15px; - gap: 10px; - } + @media (max-width: 480px) { + .cta-button { + padding: 14px 25px; + padding-left: 40px; + font-size: 14px; + gap: 8px; + } - .phone-icon-top { - width: 35px; - height: 35px; - top: -22px; - left: 15px; - } + .phone-icon-top { + width: 32px; + height: 32px; + top: -20px; + left: 12px; + } - .phone-icon-top svg { - width: 18px; - height: 18px; - } + .phone-icon-top svg { + width: 16px; + height: 16px; + } - .cta-accent { - width: 18px; - height: 18px; - } - - .cta-accent::after { - width: 5px; - height: 5px; - } -} - -@media (max-width: 480px) { - .cta-button { - padding: 14px 25px; - padding-left: 40px; - font-size: 14px; - gap: 8px; - } - - .phone-icon-top { - width: 32px; - height: 32px; - top: -20px; - left: 12px; - } - - .phone-icon-top svg { - width: 16px; - height: 16px; - } - - .cta-text { - white-space: normal; - line-height: 1.3; - } -} - -.call-request { - position: fixed; - top: 40%; - left: 0%; - width: 120px; - background-color: var(--color-sec); + .cta-text { + white-space: normal; + line-height: 1.3; + } + } +.call-request{ + position: fixed; + top: 40%; + left: 0%; + width: 120px; + background-color: var(--color-sec); border-radius: 0px 20px 20px 0; - z-index: 10000; - padding: 10px; +z-index: 10000; + padding: 10px; } - -.call-request p { - font-size: 12px; - color: white; - margin: 0; +.call-request p{ + font-size: 12px; + color: white; + margin: 0; } - -.call-request img { - position: absolute; - top: -10px; - right: 5px; - width: 70px; +.call-request img{ + position: absolute; + top: -10px; + right: 5px; + width: 70px; } - -.process-icon { - cursor: pointer; - transition: transform 0.5s ease-in-out; +.process-icon{ + cursor: pointer; + transition: transform 0.5s ease-in-out; } - .process-icon:active { - animation: flick 0.2s ease-in-out; + animation: flick 0.2s ease-in-out; } - /* .iconbox-icon-wrap::after{ content: ""; background: url("../images/icons/curve.png"); @@ -559,485 +508,461 @@ body { } */ -.curve-img, -.curve-img1 { - display: none; +.curve-img, .curve-img1{ + display: none; } -@media (min-width:992px) { - - .curve-img, - .curve-img1 { - display: block; + @media (min-width:992px) { + .curve-img, .curve-img1{ + display: block; } -} - -.icon1 .curve-img { - position: absolute; - left: -103px; - top: 0px; - width: 149px; - height: 154px; - object-fit: cover; -} - -.icon1 .curve-img1 { - position: absolute; - right: -103px; - top: 0px; - width: 149px; - height: 154px; - object-fit: cover; - transform: scaleX(-1); -} + } + .icon1 .curve-img{ + position: absolute; + left: -103px; + top: 0px; + width: 149px; + height: 154px; + object-fit: cover; + } + .icon1 .curve-img1{ + position: absolute; + right: -103px; + top: 0px; + width: 149px; + height: 154px; + object-fit: cover; + transform: scaleX(-1); + } @keyframes flick { - 0% { - transform: scale(1) rotate(0deg); - } - - 50% { - transform: scale(1.2) rotate(100deg); - } - - 100% { - transform: scale(1) rotate(0deg); - } + 0% { transform: scale(1) rotate(0deg); } + 50% { transform: scale(1.2) rotate(100deg); } + 100% { transform: scale(1) rotate(0deg); } } - /* .main-nav li a:hover{ color: var(--color-brand) !important; } */ #plane { - position: absolute; - /* 🔥 KEY CHANGE: absolute instead of fixed */ - width: 80px; - top: 200px; - left: 100px; - transition: transform 0.2s ease; - pointer-events: none; - z-index: 9999; - /* transform: rotateX(90deg); */ -} - -header .main-heading { - padding-right: 10px; - padding-left: 10px; + position: absolute; /* 🔥 KEY CHANGE: absolute instead of fixed */ + width: 80px; + top: 200px; + left: 100px; + transition: transform 0.2s ease; + pointer-events: none; + z-index: 9999; + /* transform: rotateX(90deg); */ } + header .main-heading{ + padding-right: 10px; + padding-left: 10px; + } @media (min-width:1199px) { - header .main-heading { - padding-right: 60px; - padding-left: 60px; - } + header .main-heading{ + padding-right: 60px; + padding-left: 60px; + } } - -.main-header .btn-solid { - font-weight: 700; +.main-header .btn-solid{ + font-weight: 700; } /* why us-uk */ -.bg-dark-before::before { - content: ""; - position: absolute; - left: 0; - right: 0; - height: 100%; - width: 100%; - background-color: rgba(0, 0, 0, 0.26); - border-radius: 30px; +.bg-dark-before::before{ + content: ""; + position: absolute; + left: 0; + right: 0; + height: 100%; + width: 100%; + background-color: rgba(0, 0, 0, 0.26); + border-radius: 30px; } - /* courses */ -.course-section { - padding-bottom: 30px; - background-color: #F5F3FE; -} - -.course-box { - display: flex; - flex-direction: column; - align-items: center; - gap: 30px; - justify-content: center; + .course-section{ + padding-bottom: 30px; + background-color: #F5F3FE; + } +.course-box{ + display: flex; + flex-direction: column; + align-items: center; + gap: 30px; + justify-content: center; transition: .3s all ease-in-out; - padding: 40px 20px; - background-color: #2453da; + padding:40px 20px; + background-color: #2453da ; } - -.course-box:hover { +.course-box:hover{ background-color: white !important; border: .5px solid rgb(173, 171, 171); border-radius: 10px; } - -.course-box:hover i, -.course-box:hover p { +.course-box:hover i, .course-box:hover p{ color: var(--color-sec) !important; } - -.course-finder-box:hover { - box-shadow: 0 5px 15px rgba(128, 128, 128, 0.377); - transition: .3s all ease-in-out; +.course-finder-box:hover{ + box-shadow: 0 5px 15px rgba(128, 128, 128, 0.377); +transition: .3s all ease-in-out; } -.how-it-work input, -.how-it-work textarea { - border: 1px solid #E3E3E3; - /* color: #FAFAFA; */ +.how-it-work input, .how-it-work textarea { + border: 1px solid #E3E3E3; + /* color: #FAFAFA; */ } /* course detail */ -/* Course Header */ -.course-header { - background: white; - padding: 30px; - border-radius: 10px; - box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); - margin-bottom: 20px; -} + /* Course Header */ + .course-header { + background: white; + padding: 30px; + border-radius: 10px; + box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); + margin-bottom: 20px; + } -.university-info { - display: flex; - align-items: center; - gap: 20px; - margin-bottom: 20px; -} + .university-info { + display: flex; + align-items: center; + gap: 20px; + margin-bottom: 20px; + } -.university-logo { - width: 80px; - height: 80px; - background: #2E7D32; - border-radius: 8px; - display: flex; - align-items: center; - justify-content: center; - color: white; - font-size: 32px; - font-weight: bold; -} + .university-logo { + width: 80px; + height: 80px; + background: #2E7D32; + border-radius: 8px; + display: flex; + align-items: center; + justify-content: center; + color: white; + font-size: 32px; + font-weight: bold; + } -.university-details h1 { - font-size: 28px; - color: #2c3e50; - margin-bottom: 5px; -} + .university-details h1 { + font-size: 28px; + color: #2c3e50; + margin-bottom: 5px; + } -.university-name { - color: #4472C4; - font-size: 18px; - font-weight: 600; -} + .university-name { + color: #4472C4; + font-size: 18px; + font-weight: 600; + } -.course-meta { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); - gap: 20px; - margin-top: 20px; - padding: 20px; - background: #f8f9fa; - border-radius: 8px; -} + .course-meta { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); + gap: 20px; + margin-top: 20px; + padding: 20px; + background: #f8f9fa; + border-radius: 8px; + } -.meta-item { - text-align: center; -} + .meta-item { + text-align: center; + } -.meta-label { - font-size: 12px; - color: #666; - text-transform: uppercase; - letter-spacing: 0.5px; - margin-bottom: 5px; -} + .meta-label { + font-size: 12px; + color: #666; + text-transform: uppercase; + letter-spacing: 0.5px; + margin-bottom: 5px; + } -.meta-value { - font-size: 16px; - font-weight: 600; - color: #2c3e50; -} + .meta-value { + font-size: 16px; + font-weight: 600; + color: #2c3e50; + } -/* Course Content */ -.course-content { - display: flex; - flex-direction: column; - gap: 20px; -} + /* Course Content */ + .course-content { + display: flex; + flex-direction: column; + gap: 20px; + } -.content-section { - background: white; - padding: 25px; - border-radius: 10px; - box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); -} + .content-section { + background: white; + padding: 25px; + border-radius: 10px; + box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); + } -.section-title { - font-size: 20px; - color: #2c3e50; - margin-bottom: 15px; - padding-bottom: 10px; - border-bottom: 2px solid #4472C4; -} + .section-title { + font-size: 20px; + color: #2c3e50; + margin-bottom: 15px; + padding-bottom: 10px; + border-bottom: 2px solid #4472C4; + } -.requirements-grid { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); - gap: 20px; -} + .requirements-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); + gap: 20px; + } -.requirement-card { - background: #f8f9fa; - padding: 20px; - border-radius: 8px; - border-left: 4px solid #4472C4; -} + .requirement-card { + background: #f8f9fa; + padding: 20px; + border-radius: 8px; + border-left: 4px solid #4472C4; + } -.requirement-title { - font-weight: 600; - color: #2c3e50; - margin-bottom: 10px; -} + .requirement-title { + font-weight: 600; + color: #2c3e50; + margin-bottom: 10px; + } -.requirement-details { - color: #666; - font-size: 14px; -} + .requirement-details { + color: #666; + font-size: 14px; + } -.score-badge { - background: #4472C4; - color: white; - padding: 4px 12px; - border-radius: 15px; - font-size: 12px; - font-weight: 600; - display: inline-block; - margin: 5px 5px 0 0; -} + .score-badge { + background: #4472C4; + color: white; + padding: 4px 12px; + border-radius: 15px; + font-size: 12px; + font-weight: 600; + display: inline-block; + margin: 5px 5px 0 0; + } -.intake-badges { - display: flex; - gap: 10px; - flex-wrap: wrap; -} + .intake-badges { + display: flex; + gap: 10px; + flex-wrap: wrap; + } -.intake-badge { - background: #4472C4; - color: white; - padding: 8px 16px; - border-radius: 20px; - font-size: 14px; - font-weight: 500; -} + .intake-badge { + background: #4472C4; + color: white; + padding: 8px 16px; + border-radius: 20px; + font-size: 14px; + font-weight: 500; + } -/* Sidebar */ -.sidebar { - display: flex; - flex-direction: column; - gap: 20px; -} + /* Sidebar */ + .sidebar { + display: flex; + flex-direction: column; + gap: 20px; + } -.sidebar-card { - background: #B8CCE4; - padding: 25px; - border-radius: 10px; - text-align: center; -} + .sidebar-card { + background: #B8CCE4; + padding: 25px; + border-radius: 10px; + text-align: center; + } -.sidebar-title { - font-size: 20px; - color: #2c3e50; - margin-bottom: 15px; - font-weight: 600; -} + .sidebar-title { + font-size: 20px; + color: #2c3e50; + margin-bottom: 15px; + font-weight: 600; + } -.form-group { - margin-bottom: 15px; - text-align: left; -} + .form-group { + margin-bottom: 15px; + text-align: left; + } -.form-group input, -.form-group textarea { - width: 100%; - padding: 12px; - border: 1px solid #ddd; - border-radius: 5px; - font-size: 14px; -} + .form-group input, + .form-group textarea { + width: 100%; + padding: 12px; + border: 1px solid #ddd; + border-radius: 5px; + font-size: 14px; + } -.form-group textarea { - height: 80px; - resize: vertical; -} + .form-group textarea { + height: 80px; + resize: vertical; + } -.btn-blue { - background: #4472C4; - color: white; - padding: 12px 30px; - border: none; - border-radius: 25px; - font-weight: 600; - cursor: pointer; - width: 100%; -} + .btn-blue { + background: #4472C4; + color: white; + padding: 12px 30px; + border: none; + border-radius: 25px; + font-weight: 600; + cursor: pointer; + width: 100%; + } -.quick-info { - background: white; - padding: 20px; - border-radius: 10px; - box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); -} + .quick-info { + background: white; + padding: 20px; + border-radius: 10px; + box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); + } -.info-item { - display: flex; - justify-content: space-between; - padding: 10px 0; - border-bottom: 1px solid #eee; -} + .info-item { + display: flex; + justify-content: space-between; + padding: 10px 0; + border-bottom: 1px solid #eee; + } -.info-item:last-child { - border-bottom: none; -} + .info-item:last-child { + border-bottom: none; + } -.info-label { - font-weight: 600; - color: #2c3e50; -} + .info-label { + font-weight: 600; + color: #2c3e50; + } -.info-value { - color: #666; -} + .info-value { + color: #666; + } -/* Course Modules */ -.modules-grid { - display: flex; + /* Course Modules */ + .modules-grid { + display: flex; flex-wrap: wrap; gap: 15px; -} + } -.module-item { - background: #f8f9fa; - padding: 15px; - border-radius: 8px; - border-left: 3px solid #F4B942; - width: 100%; -} + .module-item { + background: #f8f9fa; + padding: 15px; + border-radius: 8px; + border-left: 3px solid #F4B942; + width: 100%; + } -.module-name { - font-weight: 600; - color: #2c3e50; - margin-bottom: 5px; -} + .module-name { + font-weight: 600; + color: #2c3e50; + margin-bottom: 5px; + } -.module-credits { - color: #666; - font-size: 14px; -} + .module-credits { + color: #666; + font-size: 14px; + } -/* Career Prospects */ -.career-list { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); - gap: 15px; -} + /* Career Prospects */ + .career-list { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); + gap: 15px; + } -.career-item { - background: #f8f9fa; - padding: 15px; - border-radius: 8px; - text-align: center; - border: 2px solid transparent; - transition: all 0.3s ease; -} + .career-item { + background: #f8f9fa; + padding: 15px; + border-radius: 8px; + text-align: center; + border: 2px solid transparent; + transition: all 0.3s ease; + } -.career-item:hover { - border-color: #4472C4; - transform: translateY(-2px); -} + .career-item:hover { + border-color: #4472C4; + transform: translateY(-2px); + } -.career-icon { - font-size: 24px; - margin-bottom: 10px; -} + .career-icon { + font-size: 24px; + margin-bottom: 10px; + } -.career-title { - font-weight: 600; - color: #2c3e50; -} + .career-title { + font-weight: 600; + color: #2c3e50; + } -/* Fees Breakdown */ -.fees-table { - width: 100%; - border-collapse: collapse; - margin-top: 15px; -} + /* Fees Breakdown */ + .fees-table { + width: 100%; + border-collapse: collapse; + margin-top: 15px; + } -.fees-table th, -.fees-table td { - padding: 12px; - text-align: left; - border-bottom: 1px solid #eee; -} + .fees-table th, + .fees-table td { + padding: 12px; + text-align: left; + border-bottom: 1px solid #eee; + } -.fees-table th { - background: #f8f9fa; - font-weight: 600; - color: #2c3e50; -} + .fees-table th { + background: #f8f9fa; + font-weight: 600; + color: #2c3e50; + } -.fees-table .total-row { - background: #4472C4; - color: white; - font-weight: 600; -} + .fees-table .total-row { + background: #4472C4; + color: white; + font-weight: 600; + } -/* Responsive */ -@media (max-width: 768px) { + /* Responsive */ + @media (max-width: 768px) { - .university-info { - flex-direction: column; - text-align: center; - } + .university-info { + flex-direction: column; + text-align: center; + } - .course-meta { - grid-template-columns: 1fr; - } + .course-meta { + grid-template-columns: 1fr; + } - .requirements-grid { - grid-template-columns: 1fr; - } + .requirements-grid { + grid-template-columns: 1fr; + } - .modules-grid { - grid-template-columns: 1fr; - } + .modules-grid { + grid-template-columns: 1fr; + } - .career-list { - grid-template-columns: repeat(2, 1fr); - } -} + .career-list { + grid-template-columns: repeat(2, 1fr); + } + } -@media (max-width: 480px) { + @media (max-width: 480px) { - .course-header, - .content-section, - .sidebar-card, - .quick-info { - padding: 20px; - } + .course-header, + .content-section, + .sidebar-card, + .quick-info { + padding: 20px; + } - .career-list { - grid-template-columns: 1fr; - } -} + .career-list { + grid-template-columns: 1fr; + } + } @@ -1055,160 +980,148 @@ header .main-heading { } */ -.universities-slider { - /* background: url(../images/general/uni-banner.png); */ - /* background: url(../images/general/our-partner-img.png); */ - /* background-repeat: no-repeat; + .universities-slider{ + /* background: url(../images/general/uni-banner.png); */ + /* background: url(../images/general/our-partner-img.png); */ + /* background-repeat: no-repeat; background-position: center; */ - /* background-size: cover; */ - /* height: 350px; */ - /* padding-top: 264px; + /* background-size: cover; */ + /* height: 350px; */ + /* padding-top: 264px; margin-bottom: 150px; margin-top: -80px; */ } - -.universities-slider .partner-bg { + .universities-slider .partner-bg { width: 95%; - margin: auto; +margin: auto; - height: 250px; + height: 250px; } - @media (min-width:768px) { - .universities-slider .partner-bg { - width: 95%; - margin: auto; + .universities-slider .partner-bg { + width: 95%; +margin: auto; - height: 350px; - } + height: 350px; } - -.universities-slider .partner-bg img { - width: 100%; - height: 100%; - object-fit: cover; +} + .universities-slider .partner-bg img { + width: 100%; + height: 100%; + object-fit: cover; } -.uni-bg-image { - position: relative; +.uni-bg-image{ + position: relative; } - .uni-bg-image video { - position: absolute; - top: 0%; - left: 0%; - width: 100%; - height: 100%; - /* transform: translate(-50%, -50%); */ - z-index: -1; - /* behind the content */ - object-fit: cover; - opacity: 1; + position: absolute; + top: 0%; + left: 0%; + width: 100%; + height: 100%; + /* transform: translate(-50%, -50%); */ + z-index: -1; /* behind the content */ + object-fit: cover; + opacity: 1; } - .center-image { - width: 200px; - height: 200px; - background: url('https://via.placeholder.com/200') no-repeat center/cover; - border-radius: 50%; - z-index: 2; + width: 200px; + height: 200px; + background: url('https://via.placeholder.com/200') no-repeat center/cover; + border-radius: 50%; + z-index: 2; } +.line-group{ + display: none; + } +.title-line{ + width: 65PX; + height: 3px; + background-color: var(--color-brand); + margin-bottom: 10px; +} + + + + @media (min-width:768px) { .line-group { - display: none; + position: absolute; + top: 40%; + transform: translateY(-50%); + display: flex; + flex-direction: column; + gap: 60px; + z-index: 1; } - -.title-line { - width: 65PX; - height: 3px; - background-color: var(--color-brand); - margin-bottom: 10px; -} - - - -@media (min-width:768px) { - .line-group { - position: absolute; - top: 40%; - transform: translateY(-50%); - display: flex; - flex-direction: column; - gap: 60px; - z-index: 1; - } } .line { - width: 0; - height: 1px; - background: var(--color-brand); - opacity: 0; - transition: width 0.6s ease, opacity 0.6s ease; + width: 0; + height: 1px; + background: var(--color-brand); + opacity: 0; + transition: width 0.6s ease, opacity 0.6s ease; } - -.line-item { - display: flex; - gap: 20px; - align-items: center; +.line-item{ + display: flex; + gap: 20px; + align-items: center; } - .line-text { - opacity: 0; - margin-left: 10px; - font-size: 16px; - transition: opacity 0.6s ease; + opacity: 0; + margin-left: 10px; + font-size: 16px; + transition: opacity 0.6s ease; } - @media (min-width:768px) { - .left-group { - left: 0%; - align-items: flex-end; - } + .left-group { + left: 0%; + align-items: flex-end; + } - .right-group { - right: 0%; - align-items: flex-start; - } + .right-group { + right: 0%; + align-items: flex-start; + } } - @media (min-width:992px) { - .left-group { - left: 00%; - align-items: flex-end; - } + .left-group { + left: 00%; + align-items: flex-end; + } - .right-group { - right: 00%; - align-items: flex-start; - } + .right-group { + right: 00%; + align-items: flex-start; + } } .visible .line { - width: 100px; - opacity: 1; + width: 100px; + opacity: 1; } .visible .line-text { - opacity: 1; + opacity: 1; } /* testimonial */ -.testimonial-boxes .box { - background-color: #0052be; - border-radius: 30px; - box-shadow: 0 -1px 10px rgba(124, 123, 123, 0.61); +.testimonial-boxes .box{ +background-color: #0052be ; +border-radius: 30px; +box-shadow: 0 -1px 10px rgba(124, 123, 123, 0.61); } - /* .testimonial-boxes{ animation: fall 2s ease-in-out forwards; } */ @@ -1216,260 +1129,223 @@ header .main-heading { 0% { transform: translateY(-100px) rotate(0deg); opacity: 0; } 100% { transform: translateY(150px) rotate(10deg); opacity: 1; } } */ -.testimonial-slides { - background-color: #F5F3FE; -} + .testimonial-slides{ + background-color: #F5F3FE; + } + @media (max-width:768px) { + .testimonial-boxes .box{ + width: 40%; + } -@media (max-width:768px) { - .testimonial-boxes .box { - width: 40%; - } + } + @media (min-width:768px) { + .testimonial-boxes .box{ + width: 19%; + } + + + } + + .ui-selectmenu-button{ + display: none; + } + select{ + display: block !important; + } + +.course-finder-top input::placeholder{ + /* color: white; */ + font-size: 14px; } - -@media (min-width:768px) { - .testimonial-boxes .box { - width: 19%; - } - +.course-finder-top input{ +/* background-color: #1856a641; */ +border: 1px solid rgb(196, 194, 194); +border-radius: 10px; } - -.ui-selectmenu-button { - display: none; +.course-finder .answer{ + border: 2px solid var(--color-ter); + border-radius: 30px; +font-weight: bold; + padding: 10px ; } - -select { - display: block !important; +.course-finder-form{ + padding: 20px; + border-radius: 10px; + border: 1px solid rgb(203, 199, 199); } - -.course-finder-top input::placeholder { - /* color: white; */ - font-size: 14px; - +.course-finder-box{ + padding:10px 20px; + border-radius: 10px; + margin-bottom: 20px; + border: 1px solid rgb(203, 199, 199); } - -.course-finder-top input { - /* background-color: #1856a641; */ - border: 1px solid rgb(196, 194, 194); - border-radius: 10px; - +.course-finder .module-title{ + background-color: #1856a638; } - -.course-finder .answer { - border: 2px solid var(--color-ter); - border-radius: 30px; - font-weight: bold; - padding: 10px; -} - -.course-finder-form { - padding: 20px; - border-radius: 10px; - border: 1px solid rgb(203, 199, 199); -} - -.course-finder-box { - padding: 10px 20px; - border-radius: 10px; - margin-bottom: 20px; - border: 1px solid rgb(203, 199, 199); -} - -.course-finder .module-title { - background-color: #1856a638; -} - /* resource */ -.free-resources-content { - padding: 40px 0; +.free-resources-content{ + padding: 40px 0; + +} +.free-resources-content .first-row{ + border: 1px solid #E5E5E5; + display: flex; + padding: 0; + flex-direction: column; + border-radius: 10px; + position: sticky; + top: 100px; +} +ul, ol { + list-style: none; + padding-left: 0; /* Optional: Removes left indentation */ +} + +.free-resources-content .first-row li::marker{ + display: none !important; +} +.free-resources-content .first-row .tab-btn{ + padding: 15px 20px; +} +.free-resources-content .first-row .tab-btn.active{ + background-color: var(--color-brand); +} +.free-resources-content .first-row .tab-btn.active h5{ + color: white; +} + +.free-resources-content .first-row li{ + border-bottom: 1px solid #E5E5E5; + +} +.free-resources-content .first-row li:hover{ + background-color: var(--color-brand); + transition: .3s all ease-in-out; + color: white; + +} +.free-resources-content .first-row li:hover h5{ + transition: .3s all ease-in-out; + color: white; } -.free-resources-content .first-row { - border: 1px solid #E5E5E5; - display: flex; - padding: 0; - flex-direction: column; - border-radius: 10px; - position: sticky; - top: 100px; +.free-resources-content .third-row .divider{ + height: 2px ; + width: 40px; + background-color: var(--color-brand); + margin-top: 10px; } -ul, -ol { - list-style: none; - padding-left: 0; - /* Optional: Removes left indentation */ +.free-resources-content input, .free-resources-content textarea { + border:none ; + border-radius: 0; + border-bottom: 1px solid #2E02494D; } - -.free-resources-content .first-row li::marker { - display: none !important; +.free-resources-content form input::placeholder, .free-resources-content form textarea::placeholder{ + color: #2E02494D; + } +.free-resources-content form input:focus, .free-resources-content form textarea:focus { + outline:none ; + border-bottom: 1px solid var(--color-brand) !important; } - -.free-resources-content .first-row .tab-btn { - padding: 15px 20px; +.free-resources-content form input:focus::placeholder, .free-resources-content form textarea:focus::placeholder{ + color: black; } - -.free-resources-content .first-row .tab-btn.active { - background-color: var(--color-brand); -} - -.free-resources-content .first-row .tab-btn.active h5 { - color: white; -} - -.free-resources-content .first-row li { - border-bottom: 1px solid #E5E5E5; - -} - -.free-resources-content .first-row li:hover { - background-color: var(--color-brand); - transition: .3s all ease-in-out; - color: white; - -} - -.free-resources-content .first-row li:hover h5 { - transition: .3s all ease-in-out; - color: white; - -} - -.free-resources-content .third-row .divider { - height: 2px; - width: 40px; - background-color: var(--color-brand); - margin-top: 10px; -} - -.free-resources-content input, -.free-resources-content textarea { - border: none; - border-radius: 0; - border-bottom: 1px solid #2E02494D; -} - -.free-resources-content form input::placeholder, -.free-resources-content form textarea::placeholder { - color: #2E02494D; -} - -.free-resources-content form input:focus, -.free-resources-content form textarea:focus { - outline: none; - border-bottom: 1px solid var(--color-brand) !important; -} - -.free-resources-content form input:focus::placeholder, -.free-resources-content form textarea:focus::placeholder { - color: black; -} - .free-resources-content table tr { - margin: 10px 0; +margin: 10px 0; } @media (max-width:768px) { - .monkey-img .fa-arrow-left { - display: none; + .monkey-img .fa-arrow-left{ + display: none; - } + } - .monkey-img .fa-arrow-up { - display: block; + .monkey-img .fa-arrow-up{ + display: block; - } + } } - @media (min-width:768px) { - .monkey-img .fa-arrow-left { - display: block; + .monkey-img .fa-arrow-left{ + display: block; - } + } - .monkey-img .fa-arrow-up { - display: none; + .monkey-img .fa-arrow-up{ + display: none; - } + } } - -.second-row { - position: sticky; - top: 60px; +.second-row{ + position: sticky; + top: 60px; } .tab-content { - display: none; + display: none; } .tab-content.active { - display: block; + display: block; } -.banner-size { - width: 100%; - margin: auto; + .banner-size{ + width: 100%; + margin: auto; } - -.banner .animated-text { - color: #56566e; +.banner .animated-text{ + color: #56566e ; } - -.banner .module-btn-sm { - padding: 3px 22px !important; +.banner .module-btn-sm{ + padding: 3px 22px !important; } - -.banner-arrow { - padding: 2px 2px 1px 2px; +.banner-arrow{ + padding: 2px 2px 1px 2px; } - @media (min-width: 576px) { - .banner-sizer { - max-width: var(--lqd-container-width-xs, 540px); - } + .banner-sizer { + max-width: var(--lqd-container-width-xs, 540px); + } } - @media (min-width: 768px) { - .banner-size { - max-width: var(--lqd-container-width-sm, 720px); - } + .banner-size { + max-width: var(--lqd-container-width-sm, 720px); + } } @media (min-width:992px) { - .banner-size { - width: 1170px; - margin: auto; - } + .banner-size{ + width: 1170px; + margin: auto; +} } - -.banner-size .module-content .iconbox { + .banner-size .module-content .iconbox{ padding: 5px 0px; -} - -.banner-size .module-content .iconbox h3 { + } + .banner-size .module-content .iconbox h3{ display: block; -} - -.review-button { + } +.review-button{ background-color: transparent; border: 0; } - -.review-button p { - background: var(--color-sec); +.review-button p{ + background: var(--color-sec); color: white; border-radius: 30px; padding: 0px 20px; @@ -1483,1407 +1359,1265 @@ ol { -/* Continuous jumping animation */ -@keyframes bounce { + /* Continuous jumping animation */ + @keyframes bounce { + 0%, 60%, 100% { + transform: translateY(0); + } + 30% { + transform: translateY(-8px); + } + } - 0%, - 60%, - 100% { - transform: translateY(0); - } - - 30% { - transform: translateY(-8px); - } -} - -/* banners of pages */ + /* banners of pages */ .about-banner { - height: 44vh; + height: 44vh; - width: 100%; - background-image: url("../images/about/about-banner.png") !important; - background-repeat: no-repeat; - background-position: center; - position: relative; - z-index: 10; - background-size: cover; + width: 100%; + background-image: url("../images/about/about-banner.png") !important; + background-repeat: no-repeat; + background-position: center; + position: relative; + z-index: 10; + background-size: cover; } .about-page-banner { - height: auto; + height: auto; - padding-top: 47px; - width: 100%; + padding-top: 47px; + width: 100%; } - @media (min-width:992px) { - .about-page-banner { - /* height: 63vh; */ - padding-top: 0; - } + .about-page-banner { + /* height: 63vh; */ + padding-top: 0; + } } +.study-destinations-banner, .test-preparations-banner, .services-banner { + height: auto; -.study-destinations-banner, -.test-preparations-banner, -.services-banner { - height: auto; - - padding-top: 85px; - width: 100%; + padding-top: 85px; + width: 100%; } - @media (min-width:992px) { - - .study-destinations-banner, - .test-preparations-banner { - /* height: 63vh; */ - padding-top: 0; - } - - .services-banner { - height: 40vh; - padding-top: 0; - } + .study-destinations-banner, .test-preparations-banner { + /* height: 63vh; */ + padding-top: 0; + } + .services-banner{ + height: 40vh; + padding-top: 0; + } } -.study-destinations-banner img, -.test-preparations-banner img, -.about-page-banner img, -.services-banner img { - height: 100%; - width: 100%; - object-fit: cover; +.study-destinations-banner img, .test-preparations-banner img, .about-page-banner img, .services-banner img{ + height: 100%; + width: 100%; + object-fit: cover; } /* about page */ .about-banner::after { - /* content: ""; */ - width: 100%; - height: 100%; - background-color: rgba(126, 123, 123, 0.527); - position: absolute; - top: 0; - left: 0; - z-index: 20; + /* content: ""; */ + width: 100%; + height: 100%; + background-color: rgba(126, 123, 123, 0.527); + position: absolute; + top: 0; + left: 0; + z-index: 20; } - .page-banner { - height: 50vh; - width: 100%; - background-image: url("../images/general/about-banner.png") !important; - background-repeat: no-repeat; - background-position: center; - position: relative; - z-index: 10; - background-size: cover; - /* Ensures it fills the area */ - border-radius: 20px; - /* background-color: red; */ + height: 50vh; + width: 100%; + background-image: url("../images/general/about-banner.png") !important; + background-repeat: no-repeat; + background-position: center; + position: relative; + z-index: 10; + background-size: cover; /* Ensures it fills the area */ + border-radius: 20px; + /* background-color: red; */ } - -.page-banner::after, -.bg-after::after { - /* content: ""; */ - width: 100%; - height: 100%; - background-color: rgba(126, 123, 123, 0.527); - position: absolute; - top: 0; - left: 0; - z-index: 20; - border-radius: 20px; +.page-banner::after, .bg-after::after{ + /* content: ""; */ + width: 100%; + height: 100%; + background-color: rgba(126, 123, 123, 0.527); + position: absolute; + top: 0; + left: 0; + z-index: 20; + border-radius: 20px; } +.about-page .ceo-container, #about-page .ceo-container { + position: relative; + max-width: 1000px; + margin: 0 auto; + background: linear-gradient(135deg, #ffffff 0%, #f0f4ff 100%); + border-radius: 20px; + box-shadow: 0 20px 60px rgba(0, 0, 0, 0.08); + overflow: hidden; -.about-page .ceo-container, -#about-page .ceo-container { - position: relative; - max-width: 1000px; - margin: 0 auto; - background: linear-gradient(135deg, #ffffff 0%, #f0f4ff 100%); - border-radius: 20px; - box-shadow: 0 20px 60px rgba(0, 0, 0, 0.08); - overflow: hidden; + } + + .about-page .design-element { + position: absolute; + width: 300px; + height: 300px; + border-radius: 50%; + background: linear-gradient(45deg, #6e57e0 0%, #9b6dff 100%); + top: -100px; + left: -100px; + z-index: 1; + } + + .about-page .content-wrapper { + display: grid; + grid-template-columns: 1fr 1.5fr; + position: relative; + z-index: 2; + } + + .about-page .image-section { + position: relative; + padding: 40px; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + } + + .about-page .image-frame { + position: relative; + width: 220px; + height: 220px; + border-radius: 20px; + overflow: hidden; + /* transform: rotate(-5deg); */ + box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2); + border: 5px solid white; + } + .career .image-frame { + position: relative; + width: 300px; + height: 240px; + border-radius: 20px; + overflow: hidden; + /* transform: rotate(-5deg); */ + box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2); + border: 5px solid white; + } + + .about-page .ceo-image { + width: 100%; + height: 100%; + object-fit: cover; + } + + .about-page .name-badge { + + + color: black; + padding: 8px; + font-size: 26px; + font-weight: 700; + + + } + + .about-page .message-section { + padding: 60px 40px; + position: relative; + } + + .about-page .accent-line { + position: absolute; + left: 0; + top: 80px; + width: 5px; + height: 100px; + background: linear-gradient(to bottom, #ff7e5f, #feb47b); + } + + .about-page .title { + font-size: 18px; + text-transform: uppercase; + letter-spacing: 3px; + color: #6e57e0; + margin-bottom: 10px; + font-weight: 500; + } + + .about-page .heading { + font-size: 42px; + font-weight: 700; + color: #2d3748; + margin-top: 0; + margin-bottom: 30px; + line-height: 1.2; + } + + .about-page .message { + font-size: 18px; + line-height: 1.8; + color: #4a5568; + position: relative; + padding-left: 20px; + margin-top: 30px; + border-left: 2px dashed #d1d9e6; + } + + .about-page .quote-mark { + position: absolute; + font-size: 120px; + color: rgba(110, 87, 224, 0.1); + top: -40px; + left: -20px; + font-family: Georgia, serif; + } + + @media (max-width: 768px) { + .about-page .content-wrapper { + grid-template-columns: 1fr; + } + + .about-page .image-section { + padding-bottom: 0; + } + + .about-page .message-section { + padding-top: 20px; + } + } + +.blog{ + position: relative; +} +.blog .blog-line{ + width: 40px; + height: 2px; + background-color: var(--color-brand); +} +.blog-filter{ + background-color: #F2F4FF; + border-radius: 30px; + padding: 20px; + + margin-top: 20px; + + /* left: 30px; */ +} + +.blog-post:hover img{ + transform: scale(1.1); /* Horizontal flip */ + transition: transform 0.3s ease; +} +.blog .blog-pagination:hover p{ + box-shadow: 0 5px 10px var(--color-sec); + transform: translate(-5px); + transition: .4s all ease-in-out; } -.about-page .design-element { - position: absolute; - width: 300px; - height: 300px; - border-radius: 50%; - background: linear-gradient(45deg, #6e57e0 0%, #9b6dff 100%); - top: -100px; - left: -100px; - z-index: 1; +.blog .blog-post:hover{ + /* box-shadow: 0 5px 10px grey; */ + /* padding: 20px; */ } -.about-page .content-wrapper { - display: grid; - grid-template-columns: 1fr 1.5fr; - position: relative; - z-index: 2; -} - -.about-page .image-section { - position: relative; - padding: 40px; - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; -} - -.about-page .image-frame { - position: relative; - width: 220px; - height: 220px; - border-radius: 20px; - overflow: hidden; - /* transform: rotate(-5deg); */ - box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2); - border: 5px solid white; -} - -.career .image-frame { - position: relative; - width: 300px; - height: 240px; - border-radius: 20px; - overflow: hidden; - /* transform: rotate(-5deg); */ - box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2); - border: 5px solid white; -} - -.about-page .ceo-image { - width: 100%; - height: 100%; - object-fit: cover; -} - -.about-page .name-badge { - - - color: black; - padding: 8px; - font-size: 26px; - font-weight: 700; - - -} - -.about-page .message-section { - padding: 60px 40px; - position: relative; -} - -.about-page .accent-line { - position: absolute; - left: 0; - top: 80px; - width: 5px; - height: 100px; - background: linear-gradient(to bottom, #ff7e5f, #feb47b); -} - -.about-page .title { - font-size: 18px; - text-transform: uppercase; - letter-spacing: 3px; - color: #6e57e0; - margin-bottom: 10px; - font-weight: 500; -} - -.about-page .heading { - font-size: 42px; - font-weight: 700; - color: #2d3748; - margin-top: 0; - margin-bottom: 30px; - line-height: 1.2; -} - -.about-page .message { - font-size: 18px; - line-height: 1.8; - color: #4a5568; - position: relative; - padding-left: 20px; - margin-top: 30px; - border-left: 2px dashed #d1d9e6; -} - -.about-page .quote-mark { - position: absolute; - font-size: 120px; - color: rgba(110, 87, 224, 0.1); - top: -40px; - left: -20px; - font-family: Georgia, serif; -} - -@media (max-width: 768px) { - .about-page .content-wrapper { - grid-template-columns: 1fr; - } - - .about-page .image-section { - padding-bottom: 0; - } - - .about-page .message-section { - padding-top: 20px; - } -} - -.blog { - position: relative; -} - -.blog .blog-line { - width: 40px; - height: 2px; - background-color: var(--color-brand); -} - -.blog-filter { - background-color: #F2F4FF; - border-radius: 30px; - padding: 20px; - - margin-top: 20px; - - /* left: 30px; */ -} - -.blog-post:hover img { - transform: scale(1.1); - /* Horizontal flip */ - transition: transform 0.3s ease; -} - -.blog .blog-pagination:hover p { - box-shadow: 0 5px 10px var(--color-sec); - transform: translate(-5px); - transition: .4s all ease-in-out; - -} - -.blog .blog-post:hover { - /* box-shadow: 0 5px 10px grey; */ - /* padding: 20px; */ -} - -.reading-time { - position: absolute; - bottom: 10px; - left: 10px; - background-color: white; - color: var(--color-sec); +.reading-time{ + position: absolute; + bottom: 10px; + left: 10px; + background-color: white; + color: var(--color-sec); } /* blog detail */ -.blog-detail-box { - padding: 30px 40px; - margin-bottom: 20px; - background-color: white; - border-radius: 10px; - box-shadow: 0 4px 12px rgba(128, 128, 128, 0.479); +.blog-detail-box{ + padding: 30px 40px; + margin-bottom: 20px; + background-color: white; + border-radius: 10px; + box-shadow: 0 4px 12px rgba(128, 128, 128, 0.479); } - -.blog-detail-box .accent-line { - position: absolute; - left: 0; - top: 0px; - width: 5px; - height: 100%; - background: #F59E0B; + .blog-detail-box .accent-line { + position: absolute; + left: 0; + top: 0px; + width: 5px; + height: 100%; + background: #F59E0B; + } +.blog-quote{ + position: relative; + padding: 20px ; + background-color: #FFF9EB; } + .cta-widget { + background: linear-gradient(135deg, #1e3a8a, #3b82f6); + color: #fff; + text-align: center; + padding: 30px; + } -.blog-quote { - position: relative; - padding: 20px; - background-color: #FFF9EB; -} + .cta-title { + font-size: 22px; + margin-bottom: 15px; + color: #fff; + } -.cta-widget { - background: linear-gradient(135deg, #1e3a8a, #3b82f6); - color: #fff; - text-align: center; - padding: 30px; -} + .cta-text { -.cta-title { - font-size: 22px; - margin-bottom: 15px; - color: #fff; -} + font-size: 15px; + } -.cta-text { - - font-size: 15px; -} - -.cta-button { - display: inline-block; - background-color: #f59e0b; - color: #fff; - padding: 12px 25px; - border-radius: 30px; - font-weight: 500; - transition: all 0.3s ease; - font-size: 14px; -} - -.cta-button:hover { - background-color: #fff; - color: #1e3a8a; - transform: translateY(-3px); - box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1); -} + .cta-button { + display: inline-block; + background-color: #f59e0b; + color: #fff; + padding: 12px 25px; + border-radius: 30px; + font-weight: 500; + transition: all 0.3s ease; + font-size: 14px; + } + .cta-button:hover { + background-color: #fff; + color: #1e3a8a; + transform: translateY(-3px); + box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1); + } .sidebar-widget { - background-color: #fff; - border-radius: 10px; - box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05); - padding: 25px; - margin-bottom: 30px; -} - -.widget-title { - font-size: 20px; - margin-bottom: 20px; - padding-bottom: 10px; - border-bottom: 2px solid #f0f0f0; - color: #1e3a8a; - font-weight: 600; -} + background-color: #fff; + border-radius: 10px; + box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05); + padding: 25px; + margin-bottom: 30px; + } + .widget-title { + font-size: 20px; + margin-bottom: 20px; + padding-bottom: 10px; + border-bottom: 2px solid #f0f0f0; + color: #1e3a8a; + font-weight: 600; + } .popular-posts-list { - list-style: none; -} + list-style: none; + } -.popular-post-item { - display: flex; - margin-bottom: 20px; - padding-bottom: 20px; - border-bottom: 1px solid #f0f0f0; -} + .popular-post-item { + display: flex; + margin-bottom: 20px; + padding-bottom: 20px; + border-bottom: 1px solid #f0f0f0; + } -.popular-post-item:last-child { - margin-bottom: 0; - padding-bottom: 0; - border-bottom: none; -} + .popular-post-item:last-child { + margin-bottom: 0; + padding-bottom: 0; + border-bottom: none; + } -.popular-post-image { - width: 70px; - height: 70px; - border-radius: 5px; - overflow: hidden; - margin-right: 15px; -} + .popular-post-image { + width: 70px; + height: 70px; + border-radius: 5px; + overflow: hidden; + margin-right: 15px; + } -.popular-post-title { - font-size: 15px; - font-weight: 500; - margin-bottom: 5px; -} + .popular-post-title { + font-size: 15px; + font-weight: 500; + margin-bottom: 5px; + } -.popular-post-date { - font-size: 12px; - color: #888; -} + .popular-post-date { + font-size: 12px; + color: #888; + } -/* Hero Section */ -.blog-hero { - position: relative; - height: 400px; - overflow: hidden; - margin-bottom: 40px; - border-radius: 10px; - margin-top: 30px; -} + /* Hero Section */ + .blog-hero { + position: relative; + height: 400px; + overflow: hidden; + margin-bottom: 40px; + border-radius: 10px; + margin-top: 30px; + } -.blog-hero img { - width: 100%; - height: 100%; - object-fit: cover; - transition: transform 0.5s ease; -} + .blog-hero img { + width: 100%; + height: 100%; + object-fit: cover; + transition: transform 0.5s ease; + } -.blog-hero:hover img { - transform: scale(1.03); -} + .blog-hero:hover img { + transform: scale(1.03); + } -.blog-hero-overlay { - position: absolute; - bottom: 0; - left: 0; - right: 0; - background: linear-gradient(to top, rgba(0, 0, 0, 0.8), transparent); - padding: 30px; - color: #fff; -} + .blog-hero-overlay { + position: absolute; + bottom: 0; + left: 0; + right: 0; + background: linear-gradient(to top, rgba(0,0,0,0.8), transparent); + padding: 30px; + color: #fff; + } -.blog-category { - background-color: #f59e0b; - color: #fff; - padding: 5px 15px; - border-radius: 20px; - font-size: 14px; - display: inline-block; - margin-bottom: 15px; - font-weight: 500; -} + .blog-category { + background-color: #f59e0b; + color: #fff; + padding: 5px 15px; + border-radius: 20px; + font-size: 14px; + display: inline-block; + margin-bottom: 15px; + font-weight: 500; + } -.blog-title { - font-family: 'Playfair Display', serif; - font-size: 36px; - margin-bottom: 15px; - line-height: 1.2; -} + .blog-title { + font-family: 'Playfair Display', serif; + font-size: 36px; + margin-bottom: 15px; + line-height: 1.2; + } -.blog-meta { - display: flex; - align-items: center; - font-size: 14px; - color: rgba(255, 255, 255, 0.8); -} + .blog-meta { + display: flex; + align-items: center; + font-size: 14px; + color: rgba(255, 255, 255, 0.8); + } -.blog-meta-divider { - margin: 0 10px; -} + .blog-meta-divider { + margin: 0 10px; + } /* select 2 */ -.select2-container { - width: 200px !important; +.select2-container{ + width: 200px !important; } - -.select2-container--default .select2-selection--single { - height: 35px !important; - background-color: #F2F4FF !important; - border-radius: 30px !important; - border: 1px solid #F2F4FF !important; - padding-left: 10px !important; +.select2-container--default .select2-selection--single{ + height: 35px !important; + background-color: #F2F4FF !important; + border-radius: 30px !important; + border: 1px solid #F2F4FF !important; +padding-left: 10px !important; } - -.select2-container--default .select2-selection--single .select2-selection__rendered { - font-size: 14px !important; +.select2-container--default .select2-selection--single .select2-selection__rendered{ + font-size: 14px !important; } - -.select2-container--default .select2-selection--single .select2-selection__arrow b { - margin-left: -10px !important; - margin-top: 0px !important; +.select2-container--default .select2-selection--single .select2-selection__arrow b{ + margin-left: -10px !important; + margin-top: 0px !important; } /* events */ -@media (min-width:768px) { - .events { - width: 95%; - margin: auto; + @media (min-width:768px) { + .events{ + width: 95%; + margin: auto; - } + } + + } + @media (min-width:992px) { + .events{ + width: 85%; + margin: auto; + + } + + } + @media (min-width:1200px) { + .events{ + width: 75%; + margin: auto; + + } + + } + +.events .carousel-item-content{ + box-shadow: 0 4px 10px rgb(206, 206, 206); + border-radius: 30px; +} +.events .carousel-item-content img{ + + border-radius: 30px 30px 0 0; +} +.events .event-block{ + box-shadow: 0 4px 10px rgb(206, 206, 206); + border-radius: 30px; +} +.events .event-block img{ + + border-radius: 30px 30px 0 0; +} +.events .flickity-viewport{ + height: 450px !important; } -@media (min-width:992px) { - .events { - width: 85%; - margin: auto; - - } +.events button{ + border: 1px solid var(--color-ter); + padding: 10px 30px; + font-weight: bold; } - -@media (min-width:1200px) { - .events { - width: 75%; - margin: auto; - - } - -} - -.events .carousel-item-content { - box-shadow: 0 4px 10px rgb(206, 206, 206); - border-radius: 30px; -} - -.events .carousel-item-content img { - - border-radius: 30px 30px 0 0; -} - -.events .event-block { - box-shadow: 0 4px 10px rgb(206, 206, 206); - border-radius: 30px; -} - -.events .event-block img { - - border-radius: 30px 30px 0 0; -} - -.events .flickity-viewport { - height: 450px !important; - -} - -.events button { - border: 1px solid var(--color-ter); - padding: 10px 30px; - font-weight: bold; - -} - -.events button:hover { - border: 1px solid var(--color-ter); - background-color: var(--color-ter); - color: white !important; - box-shadow: 0 5px 10px var(--color-ter); - transform: translateY(-5px); - transition: .3s all ease-in-out; +.events button:hover{ + border: 1px solid var(--color-ter); + background-color: var(--color-ter); + color: white !important; + box-shadow: 0 5px 10px var(--color-ter); + transform: translateY(-5px); + transition: .3s all ease-in-out; } /* why choose us */ -.why-us { - border-bottom: 2px dotted black; +.why-us{ + border-bottom: 2px dotted black; } +.why-us .become-member{ -.why-us .become-member { - - background-color: #1856A6D4; + background-color: #1856A6D4; } - -.choose.active { - padding: 10px 20px; - background-color: var(--color-brand); - color: white; - font-size: 20px; - border-radius: 10px; - border: 1px solid var(--color-brand); +.choose.active{ + padding: 10px 20px ; + background-color: var(--color-brand); + color: white; + font-size: 20px; + border-radius: 10px; + border: 1px solid var(--color-brand); } - -.choose { - padding: 10px 20px; - background-color: white; - color: #2E02494D; - font-size: 20px; - border-radius: 10px; - border: 1px solid #2E02494D; +.choose{ + padding: 10px 20px ; + background-color: white; + color: #2E02494D; + font-size: 20px; + border-radius: 10px; + border: 1px solid #2E02494D; } - -.why-us form input, -.why-us form textarea { - border: none; - border-radius: 0; - border-bottom: 1px solid #2E02494D; +.why-us form input, .why-us form textarea { + border:none ; + border-radius: 0; + border-bottom: 1px solid #2E02494D; } - -.why-us form input::placeholder, -.why-us form textarea::placeholder { - color: #2E02494D; +.why-us form input::placeholder, .why-us form textarea::placeholder{ + color: #2E02494D; + } +.why-us form input:focus, .why-us form textarea:focus { + outline:none ; + border-bottom: 1px solid var(--color-brand) !important; } - -.why-us form input:focus, -.why-us form textarea:focus { - outline: none; - border-bottom: 1px solid var(--color-brand) !important; +.why-us form input:focus::placeholder, .why-us form textarea:focus::placeholder{ + color: black; } - -.why-us form input:focus::placeholder, -.why-us form textarea:focus::placeholder { - color: black; -} - -.why-us .first-row .img1 { - height: 220px; - width: 220px; - border-radius: 100px 0 0 0; - object-fit: cover; +.why-us .first-row .img1{ + height:220px ; + width: 220px; + border-radius: 100px 0 0 0; + object-fit: cover; } - -.why-us .first-row .img2 { - height: 76px; - width: 76px; - border-radius: 24px; - object-fit: cover; +.why-us .first-row .img2{ + height:76px ; + width: 76px; + border-radius: 24px; + object-fit: cover; } - -.why-us .first-row .img3 { - height: 106px; - width: 106px; - border-radius: 0 50px 0 0; - object-fit: cover; +.why-us .first-row .img3{ + height:106px ; + width: 106px; + border-radius: 0 50px 0 0; + object-fit: cover; } - -.why-us .first-row .img4 { - height: 114px; - width: 114px; - border-radius: 0 0 0 50px; - object-fit: cover; +.why-us .first-row .img4{ + height:114px ; + width: 114px; + border-radius:0 0 0 50px; + object-fit: cover; } - -.why-us .first-row .img5 { - height: 182px; - width: 182px; - border-radius: 0 100px 0 0; - object-fit: cover; +.why-us .first-row .img5{ + height:182px ; + width: 182px; + border-radius:0 100px 0 0; + object-fit: cover; } - -.why-us .first-row .img6 { - height: 142px; - width: 142px; - border-radius: 0 0 0 90px; - object-fit: cover; +.why-us .first-row .img6{ + height:142px ; + width: 142px; + border-radius:0 0 0 90px; + object-fit: cover; } - -.why-us .first-row .img7 { - height: 130px; - width: 130px; - border-radius: 0 0 60px 0; - object-fit: cover; +.why-us .first-row .img7{ + height:130px ; + width: 130px; + border-radius:0 0 60px 0; + object-fit: cover; } - -.why-us .first-row .img8 { - height: 166px; - width: 166px; - border-radius: 0 0 90px 0; - object-fit: cover; +.why-us .first-row .img8{ + height:166px ; + width: 166px; + border-radius:0 0 90px 0; + object-fit: cover; } - @media (max-width:1400px) { - .why-us .first-row .mobile-view { - display: block; - width: 100%; - height: 100%; - } + .why-us .first-row .mobile-view{ + display: block; + width: 100%; + height: 100%; + } + .why-us .first-row .image-part{ + display: none; - .why-us .first-row .image-part { - display: none; - - } + } } @media (min-width:1400px) { - .why-us .first-row .mobile-view { - display: none; - } + .why-us .first-row .mobile-view{ + display: none; + } + .why-us .first-row .image-part{ + display: block; - .why-us .first-row .image-part { - display: block; + } + .why-us .first-row .img1{ + height:167px ; + width: 158px; + border-radius: 100px 0 0 0; + object-fit: cover; + position: absolute; + top: 5px; + left: 0px; - } + } + .why-us .first-row .img2{ + height:76px ; + width: 76px; + border-radius: 24px; + object-fit: cover; + position: absolute; + top: 55px; + left: 220px; - .why-us .first-row .img1 { - height: 167px; - width: 158px; - border-radius: 100px 0 0 0; - object-fit: cover; - position: absolute; - top: 5px; - left: 0px; + } + .why-us .first-row .img3{ + height:106px ; + width: 106px; + border-radius: 0 50px 0 0; + object-fit: cover; + position: absolute; + top: 5px; + left: 390px; - } + } + .why-us .first-row .img4{ + height:114px ; + width: 114px; + border-radius:0 0 0 50px; + object-fit: cover; + position: absolute; + top: 270px; + left: 68px; - .why-us .first-row .img2 { - height: 76px; - width: 76px; - border-radius: 24px; - object-fit: cover; - position: absolute; - top: 55px; - left: 220px; + } + .why-us .first-row .img5{ + height:150px ; + width: 130px; + border-radius:0 100px 0 0; + object-fit: cover; + position: absolute; + top: 156px; + left: 220px; - } + } + .why-us .first-row .img6{ + height:142px ; + width: 142px; + border-radius:0 0 0 90px; + object-fit: cover; + position: absolute; + top: 415px; + left: 0px; - .why-us .first-row .img3 { - height: 106px; - width: 106px; - border-radius: 0 50px 0 0; - object-fit: cover; - position: absolute; - top: 5px; - left: 390px; + } + .why-us .first-row .img7{ + height:102px ; + width: 104px; + border-radius:0 0 60px 0; + object-fit: cover; + position: absolute; + top: 365px; + left: 220px; - } + } + .why-us .first-row .img8{ + height:127px ; + width: 116px; + border-radius:0 0 90px 0; + object-fit: cover; + position: absolute; + top: 300px; + left: 380px; - .why-us .first-row .img4 { - height: 114px; - width: 114px; - border-radius: 0 0 0 50px; - object-fit: cover; - position: absolute; - top: 270px; - left: 68px; - - } - - .why-us .first-row .img5 { - height: 150px; - width: 130px; - border-radius: 0 100px 0 0; - object-fit: cover; - position: absolute; - top: 156px; - left: 220px; - - } - - .why-us .first-row .img6 { - height: 142px; - width: 142px; - border-radius: 0 0 0 90px; - object-fit: cover; - position: absolute; - top: 415px; - left: 0px; - - } - - .why-us .first-row .img7 { - height: 102px; - width: 104px; - border-radius: 0 0 60px 0; - object-fit: cover; - position: absolute; - top: 365px; - left: 220px; - - } - - .why-us .first-row .img8 { - height: 127px; - width: 116px; - border-radius: 0 0 90px 0; - object-fit: cover; - position: absolute; - top: 300px; - left: 380px; - - } + } } - -.why-us .icons:hover { - background-color: var(--color-brand); - color: white; +.why-us .icons:hover{ + background-color: var(--color-brand); + color: white; } .popup-container { - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 100vh; - background-color: #7777775d; - backdrop-filter: blur(10px); - visibility: hidden; - display: flex; - justify-content: center; - align-items: center; - opacity: 0; - pointer-events: none; - transition: opacity 0.1s ease-in-out; - z-index: 100; + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100vh; + background-color: #7777775d; + backdrop-filter: blur(10px); + visibility: hidden; + display: flex; + justify-content: center; + align-items: center; + opacity: 0; + pointer-events: none; + transition: opacity 0.1s ease-in-out; + z-index: 100; + overflow: auto; } - .popup-container.active { - opacity: 1; - visibility: visible; - pointer-events: auto; + opacity: 1; + visibility: visible; + pointer-events: auto; } - -.close-btn { - position: absolute; - top: 10px; - right: 20px; +.close-btn{ + position: absolute; + top: 10px; + right: 20px; } /* get in touch */ -.popup-container-inside { - width: 90%; - /* height: 90vh; */ - margin: auto; - margin-top: 10px; +.popup-container-inside{ + width: 90%; + height: 90vh; + margin: auto; + /* margin-top: 10px; */ + position: relative; + +} +@media (min-width:1400px) { + .popup-container-inside{ + height: 80vh; + } + +} +.popup-container-inside .inside1{ + background-color: white; + height: 90vh; + width: 100%; + border-radius: 30px 0 0 30px; + position: relative; + +} +@media (min-width:1400px) { +.popup-container-inside .inside1{ + height: 80vh; + } + +} +.popup-container-inside .inside2{ + background: linear-gradient(to bottom, #1856A6, #CE171F); + height: 100%; + width: 100%; + border-radius:0 30px 30px 0; position: relative; - +} +.popup-container-inside .inside-content{ + position: absolute; + top: 50%; + left: 50%; + width: 90%; + /* height: 80%; */ + transform: translate(-50%, -50%); +} +.popup-container-inside .inside-content .map{ + height: 380px; } -.popup-container-inside .inside1 { - background-color: white; - height: 100vh; - width: 100%; - border-radius: 30px 0 0 30px; - +.inside-content form input, .inside-content form textarea { + border:none ; + border-radius: 0; + border-bottom: 1px solid #2E02494D; } - -.popup-container-inside .inside2 { - background: linear-gradient(to bottom, #1856A6, #CE171F); - height: 100%; - width: 100%; - border-radius: 0 30px 30px 0; +.inside-content form input::placeholder, .inside-content form textarea::placeholder{ + color: #2E02494D; + } +.inside-content form input:focus, .inside-content form textarea:focus { + outline:none ; + border-bottom: 1px solid var(--color-brand) !important; } - -.popup-container-inside .inside-content { - position: absolute; - top: 20px; - left: 20px; - width: 90%; - height: 100%; +.inside-content form input:focus::placeholder, .inside-content form textarea:focus::placeholder{ + color: black; } - -.popup-container-inside .inside-content .map { - height: 90vh; -} - -.inside-content form input, -.inside-content form textarea { - border: none; - border-radius: 0; - border-bottom: 1px solid #2E02494D; -} - -.inside-content form input::placeholder, -.inside-content form textarea::placeholder { - color: #2E02494D; -} - -.inside-content form input:focus, -.inside-content form textarea:focus { - outline: none; - border-bottom: 1px solid var(--color-brand) !important; -} - -.inside-content form input:focus::placeholder, -.inside-content form textarea:focus::placeholder { - color: black; -} - .popup-container-inside input[type=number]::-webkit-outer-spin-button, -.popup-container-inside input[type=number]::-webkit-inner-spin-button { - -webkit-appearance: none; - margin: 0; -} + .popup-container-inside input[type=number]::-webkit-inner-spin-button { + -webkit-appearance: none; + margin: 0; + } -.popup-container-inside input[type=number] { - -moz-appearance: textfield; - /* Firefox */ -} + .popup-container-inside input[type=number] { + -moz-appearance: textfield; /* Firefox */ + } /* for mobile view */ -.mobile-navbar-collapse .menu-dropdown { - background-color: #8fb6f41e; +.mobile-navbar-collapse .menu-dropdown{ + background-color: #8fb6f41e; } -.menu-dropdown ul { - padding: 0 25px 0; +.menu-dropdown ul{ + padding:0 25px 0; } - .menu-dropdown ul li { - padding: 20px 0; + padding: 20px 0; } +.menu-dropdown ul li a{ -.menu-dropdown ul li a { - - color: black; + color: black; } -.popup-container-inside-mobile { - width: 100%; - margin-top: 30px; - padding: 60px 0; +.popup-container-inside-mobile{ + width: 100%; + margin-top: 30px; + padding: 60px 0; } -.popup-container-inside-mobile .inside-content .inside1 { - background-color: #9cbbe446; +.popup-container-inside-mobile .inside-content .inside1{ + background-color: #9cbbe446; - width: 100%; - /* border-radius: 30px 0 0 30px; */ + width: 100%; + /* border-radius: 30px 0 0 30px; */ } - -.popup-container-inside-mobile .inside-content { +.popup-container-inside-mobile .inside-content{ - width: 100%; + width: 100%; } - -.popup-container-inside-mobile .inside-content .map { - height: 400px; - width: 100%; +.popup-container-inside-mobile .inside-content .map{ + height: 400px; + width: 100%; } /* career */ -.career .career-box { - border: 1px solid rgb(233, 230, 230); - border-radius: 30px; - padding: 30px 20px; +.career .career-box{ + border: 1px solid rgb(233, 230, 230); + border-radius: 30px; + padding: 30px 20px ; } - -.career .career-box:hover { - box-shadow: 0 5px 10px gray; +.career .career-box:hover{ + box-shadow: 0 5px 10px gray; } - -.career .career-box i { - color: #FFA033; +.career .career-box i{ + color:#FFA033 ; } - -.career .career-box button { - display: inline-block !important; - padding: 10px; - border: 2px solid #FFA033; - border-radius: 30px; - background-color: white; - color: #FFA033; - width: 40%; - font-size: 14px; +.career .career-box button{ +display: inline-block !important; +padding: 10px; +border: 2px solid #FFA033; +border-radius: 30px; +background-color: white; +color: #FFA033; +width: 40%; +font-size: 14px; } +.career .career-box button:hover{ -.career .career-box button:hover { +border: 2px solid #FFA033; - border: 2px solid #FFA033; - - background-color: #FFA033; - color: white; - transition: .3s all ease-in-out; +background-color: #FFA033; +color: white; +transition: .3s all ease-in-out; } /* contact us */ -.contact-box { - /* border: 1px solid rgb(206, 201, 201); */ - box-shadow: 0 5px 10px gray; - padding: 60px 0; +.contact-box{ + /* border: 1px solid rgb(206, 201, 201); */ + box-shadow: 0 5px 10px gray; + padding: 20px 0; } +.contact-form{ -.contact-form { - - padding: 50px 40px; - box-shadow: 0 5px 10px gray; + padding: 50px 40px; + box-shadow: 0 5px 10px gray; } - @media (min-width:768px) { - .contact-form { - width: 70%; - margin: auto; - } + .contact-form{ + /* width: 70%; */ + margin: auto; + } } - -.contact-form input, -.contact-form textarea { - border: 1px solid rgb(184, 180, 180); - border-radius: 0; +.contact-form input, .contact-form textarea{ + border: 1px solid rgb(184, 180, 180); + border-radius: 0; } - -.contact-form input:focus, -.contact-form textarea:focus { - outline: none; - border: 1px solid var(--color-brand); +.contact-form input:focus, .contact-form textarea:focus{ + outline: none; + border: 1px solid var(--color-brand); } - -.accordion-heading:hover .accordion-title-txt { - padding-left: 10px; - transition: 0.4s all ease-in-out; +.accordion-heading:hover .accordion-title-txt{ + padding-left: 10px; + transition: 0.4s all ease-in-out; } /* franchise */ -.franchise-form { - width: 90%; - margin: 30px auto 0 auto; - padding: 50px; - border-radius: 30px; +.franchise-form{ + width: 90%; + margin:30px auto 0 auto; + padding: 50px; + border-radius: 30px; } - .franchise-form select { - border: 2px solid var(--color-brand); - /* custom border color */ - font-size: 16px; - /* text size for selected item */ - padding: 8px; - border-radius: 5px; - background-color: white; - color: #333; - outline: none; + border: 2px solid var(--color-brand); /* custom border color */ + font-size: 16px; /* text size for selected item */ + padding: 8px; + border-radius: 5px; + background-color: white; + color: #333; + outline: none; } /* Change arrow icon (optional) */ .franchise-form select::-ms-expand { - display: none; - /* remove default arrow in IE */ + display: none; /* remove default arrow in IE */ } /* Style options (limited support) */ .franchise-form select option { - font-size: 14px; - /* text size inside dropdown */ - color: #333; - background: white; + font-size: 14px; /* text size inside dropdown */ + color: #333; + background: white; } /* Hover effect on options (ONLY works in Firefox) */ .franchise-form select option:hover { - background: var(--color-brand) !important; - color: white; + background: var(--color-brand) !important; + color: white; } -.franchise-form input, -.franchise-form textarea, -.franchise-form select option { - border: 1px solid rgb(226, 224, 224); - border-radius: 0; +.franchise-form input, .franchise-form textarea, .franchise-form select option{ + border: 1px solid rgb(226, 224, 224); + border-radius: 0; +} +.franchise-form .ui-selectmenu-text{ + color: white; } -.franchise-form .ui-selectmenu-text { - color: white; -} - -.franchise-form input:focus, -.franchise-form textarea:focus, -.franchise-form select option:focus { - outline: none; - border: 1px solid var(--color-brand); +.franchise-form input:focus, .franchise-form textarea:focus, .franchise-form select option:focus{ + outline: none; + border: 1px solid var(--color-brand); } -.franchise-form .select2-container { - width: 100% !important; +.franchise-form .select2-container{ + width: 100% !important; } - -.franchise-form .select2-container--default .select2-selection--single { - height: 46px !important; - background-color: #fff !important; - border-radius: 0 !important; - border: 1px solid rgb(226, 224, 224) !important; - padding-left: 10px !important; - padding-top: 10px; +.franchise-form .select2-container--default .select2-selection--single{ + height: 46px !important; + background-color: #fff !important; + border-radius: 0 !important; + border: 1px solid rgb(226, 224, 224) !important; +padding-left: 10px !important; +padding-top: 10px; } - -.franchise-form .select2-container--default .select2-selection--single .select2-selection__rendered { - font-size: 16px !important; +.franchise-form .select2-container--default .select2-selection--single .select2-selection__rendered{ + font-size: 16px !important; } - -.franchise-form .select2-container--default .select2-selection--single .select2-selection__arrow b { - margin-left: -10px !important; - margin-top: 0px !important; +.franchise-form .select2-container--default .select2-selection--single .select2-selection__arrow b{ + margin-left: -10px !important; + margin-top: 0px !important; } - -.franchise-model { - width: 80%; - margin-left: auto; +.franchise-model{ + width: 80%; + margin-left: auto; } -#franchise-invest-button { - display: none !important; +#franchise-invest-button{ + display: none !important; } - -#franchise-timeframe-button { - display: none !important; +#franchise-timeframe-button{ + display: none !important; } /* social-platform */ -.social-platform .iconbox:hover i { - color: white !important; +.social-platform .iconbox:hover i{ + color: white !important; } @media (min-width:768px) { - - .social-platform .social-linkedin, - .social-platform .social-pinterest, - .social-platform .social-youtube { - width: 25%; - } + .social-platform .social-linkedin,.social-platform .social-pinterest,.social-platform .social-youtube +{ + width: 25%; +} } /* cost calculator */ -.total-cost { - padding: 20px 40px; - /* background: url("../images/general/cost-bg.png"); */ - background-position: center; - background-size: cover; - background-repeat: no-repeat; - background-color: #F9F5F2; - border-radius: 30px; - /* z-index: 2; */ +.total-cost{ + padding: 20px 40px; + /* background: url("../images/general/cost-bg.png"); */ + background-position: center; + background-size: cover; + background-repeat: no-repeat; + background-color: #F9F5F2; + border-radius: 30px; + /* z-index: 2; */ } - @media (min-width:992px) and (max-width:1200px) { - .total-cost { - padding: 20px 2px; - } + .total-cost{ + padding: 20px 2px; + } } - -.total-cost table { - /* border: 2px solid white; */ - border-collapse: separate; +.total-cost table{ +/* border: 2px solid white; */ +border-collapse: separate; } - -.total-cost h4 { - color: #A8664E; - font-weight: bold; - font-size: 22px; - text-align: center; - padding-bottom: 10px; +.total-cost h4{ + color: #A8664E; + font-weight: bold; + font-size: 22px; + text-align: center; + padding-bottom: 10px; } - -.total-cost thead tr th { - background-color: #D7E1D5; - font-size: 16px; - /* padding-left: 0.8em; */ - text-align: center; +.total-cost thead tr th{ + background-color: #D7E1D5; + font-size: 16px; + /* padding-left: 0.8em; */ + text-align: center; } - -.total-cost tbody tr td { - font-size: 16px; - text-align: center; - /* background-color: #D2EBE2; */ +.total-cost tbody tr td{ + font-size: 16px; + text-align: center; + /* background-color: #D2EBE2; */ } - .total-cost tbody tr:nth-child(1) { - background-color: #D2EBE2; + background-color: #D2EBE2; } - .total-cost tbody tr:nth-child(2) { - background-color: #D3E8EB; + background-color: #D3E8EB; } - .total-cost tbody tr:nth-child(3) { - background-color: #DEDDE6; + background-color: #DEDDE6; } - .total-cost tbody tr:nth-child(4) { - background-color: #D9CEDB; + background-color: #D9CEDB; } - .total-cost tbody tr:nth-child(5) { - background-color: #F6D0C9; + background-color: #F6D0C9; } -.cost-choosing { - padding: 30px; - border-radius: 30px; - background-color: #F7F0FF; +.cost-choosing{ + padding: 30px; + border-radius: 30px; + background-color: #F7F0FF; } -.cost-choosing .circle1 { - width: 25px; - height: 25px; - border-radius: 100%; - background-color: #23B334; +.cost-choosing .circle1{ + width: 25px; + height: 25px; + border-radius: 100%; + background-color: #23B334; +} +.cost-choosing .circle2{ + width: 25px; + height: 25px; + border-radius: 100%; + background-color: #9A249E; } -.cost-choosing .circle2 { - width: 25px; - height: 25px; - border-radius: 100%; - background-color: #9A249E; +.cost-choosing .tabs:hover{ + box-shadow: 0 5px 10px gray; + transform: translateY(-10px); + transition: .3s all ease-in-out; + cursor: pointer; } -.cost-choosing .tabs:hover { - box-shadow: 0 5px 10px gray; - transform: translateY(-10px); - transition: .3s all ease-in-out; - cursor: pointer; -} - -.cost-choosing .next-btn button { - background-color: #0000002a; +.cost-choosing .next-btn button{ + background-color: #0000002a; } - -.cost-choosing .next-btn button:hover i { - margin-left: 10px; - transition: .3s all ease-in; +.cost-choosing .next-btn button:hover i{ + margin-left: 10px; + transition: .3s all ease-in; } - -.cost-choosing .next-btn i { - color: var(--color-ter); - padding: 5px 8px; - background-color: #FFEFE0; - border-radius: 100%; - /* margin-left: 10px; */ - font-size: 12px; +.cost-choosing .next-btn i{ + color: var(--color-ter); + padding: 5px 8px; + background-color: #FFEFE0; + border-radius: 100%; + /* margin-left: 10px; */ + font-size: 12px; } - -.cost-choosing, -.total-cost { - position: relative; - z-index: 2; +.cost-choosing, .total-cost{ + position: relative; + z-index: 2; } -canvas { - position: absolute; - top: 0; - left: 0; - z-index: 1; - pointer-events: auto; -} +canvas { position: absolute; top: 0; left: 0; z-index: 1; pointer-events: auto; } .section-fall { - /* height: 500px; */ - width: 100vw; - position: relative; - /* display: flex; */ - justify-content: center; - align-items: center; + /* height: 500px; */ + width: 100vw; + position: relative; + /* display: flex; */ + justify-content: center; + align-items: center; } - .progress-line { - position: relative; - height: 80px; - margin-top: 20px; -} - -.progress-track { - position: absolute; - top: 50%; - left: 30px; - right: 30px; - height: 5px; - background: #ccc; - transform: translateY(-50%); -} - -.progress-track span { - position: absolute; - transform: translate(-50%, -50%); - top: 50%; -} - -.banana img { - width: 24px; -} - -.banana { - top: 50%; -} - -#b1 { - left: 0%; -} - -#b2 { - left: 25%; -} - -#b3 { - left: 50%; -} - -#b4 { - left: 75%; -} - -#b5 { - left: 100%; -} - -.monkey { - position: absolute; - bottom: 22px; - transition: 0.5s all ease; - -} - -.monkey img { - width: 60px; - max-width: 80px; -} - -@media (min-width:992px) { - .monkey img { - width: 80px; - max-width: 80px; + position: relative; + height: 80px; + margin-top: 20px; } -} + .progress-track { + position: absolute; + top: 50%; + left: 30px; + right: 30px; + height: 5px; + background: #ccc; + transform: translateY(-50%); + } -#b5 img { - width: 30px; - max-width: 30px; -} + .progress-track span { + position: absolute; + transform: translate(-50%, -50%); + top: 50%; + } +.banana img { + width: 24px; + } -#b5 { - display: block; -} + .banana { + top: 50%; + } -#b5.active { - display: none; -} + #b1 { left: 0%; } + #b2 { left: 25%; } + #b3 { left: 50%; } + #b4 { left: 75%; } + #b5 { left: 100%; } + + .monkey { + position: absolute; + bottom: 22px; + transition: 0.5s all ease; + + } + + .monkey img{ + width: 60px; + max-width: 80px; + } + + @media (min-width:992px) { + .monkey img{ + width: 80px; + max-width: 80px; + } + + } + + #b5 img { + width: 30px; + max-width: 30px; + } + #b5 { + display: block; + } + #b5.active { + display: none; + } /* .monkey { @@ -2893,178 +2627,156 @@ canvas { transition: left 0.4s ease; } */ .cost-choosing .step-content { - display: none; + display: none; } - .cost-choosing .step-content.active { - display: block; + display: block; } /* career details */ -.career-img { - width: 50px; - height: 50px; - border: 1px solid var(--color-brand); - border-radius: 100%; +.career-img{ + width: 50px; + height: 50px; + border: 1px solid var(--color-brand); + border-radius: 100%; } +.career-img img{ + width: 100%; + height: 100%; -.career-img img { - width: 100%; - height: 100%; - - padding: 5px; + padding: 5px; } +.career.details .career-box{ -.career.details .career-box { - - box-shadow: 0 5px 10px var(--color-sec); + box-shadow: 0 5px 10px var(--color-sec); } - -.career-details h3 { - font-size: 20px; - margin-bottom: 0; +.career-details h3{ + font-size: 20px; + margin-bottom: 0; } - -.career-details p { - font-size: 14px; +.career-details p{ + font-size: 14px; } - -.career-details h4 { - font-size: 15px; - font-weight: normal; +.career-details h4{ + font-size: 15px; + font-weight: normal; } - -.career-details .content h6, -.career .content li { - font-size: 12px; +.career-details .content h6, .career .content li{ + font-size: 12px; +} +.career-details ul{ + padding-left: 0 !important; +} +.career-details ul li{ + list-style: none; +font-size: 14px; +} +.career-details .form{ + background-color: white; + box-shadow: 0 5px 10px gray; + padding: 40px; } -.career-details ul { - padding-left: 0 !important; +.career-details form input, .career-details form textarea{ + border: 1px solid rgb(206, 202, 202); } -.career-details ul li { - list-style: none; - font-size: 14px; +.career-details form input:focus, .career-details form textarea:focus{ + outline: 0; + border: 1px solid var(--color-brand); } - -.career-details .form { - background-color: white; - box-shadow: 0 5px 10px gray; - padding: 40px; +.line-through{ + width: 100%; + border-bottom: 1px solid var(--color-sec); } - -.career-details form input, -.career-details form textarea { - border: 1px solid rgb(206, 202, 202); -} - -.career-details form input:focus, -.career-details form textarea:focus { - outline: 0; - border: 1px solid var(--color-brand); -} - -.line-through { - width: 100%; - border-bottom: 1px solid var(--color-sec); -} - -.career-details .position { - padding: 5px; - background-color: white; - position: absolute; - top: -15px; - left: 100px; - font-size: 14px !important; +.career-details .position{ + padding: 5px; + background-color: white; + position: absolute; + top: -15px; + left: 100px; + font-size: 14px !important; } +.career-details .position h4{ -.career-details .position h4 { - - font-size: 16px !important; + font-size: 16px !important; } - @media (min-width:778px) { - .career-details .position { - padding: 5px; - background-color: white; - position: absolute; - top: -20px; - left: 400px; + .career-details .position{ + padding: 5px; + background-color: white; + position: absolute; + top: -20px; + left: 400px; - } - - .career-details .position h4 { - font-size: 22px !important; + } + .career-details .position h4{ + font-size: 22px !important; - } + } } - /* gallery */ .gallery { - column-count: 4; - column-gap: 0px; - height: 100%; - /* padding: 8px; */ + column-count: 4; + column-gap: 0px; + height: 100%; + /* padding: 8px; */ } .gallery img { - width: 100%; - margin-bottom: 8px; - border-radius: 6px; - cursor: pointer; - transition: transform 0.3s ease; + width: 100%; + margin-bottom: 8px; + border-radius: 6px; + cursor: pointer; + transition: transform 0.3s ease; } .gallery img:hover { - transform: scale(1.03); + transform: scale(1.03); } /* Lightbox */ .lightbox { - position: fixed; - top: 70px; - left: 0; - width: 100%; - height: 100%; - background: rgba(0, 0, 0, 0.95); - display: flex; - align-items: center; - justify-content: center; - z-index: 999; - visibility: hidden; - opacity: 0; - transition: opacity 0.3s ease; + position: fixed; + top: 70px; left: 0; + width: 100%; height: 100%; + background: rgba(0,0,0,0.95); + display: flex; + align-items: center; + justify-content: center; + z-index: 999; + visibility: hidden; + opacity: 0; + transition: opacity 0.3s ease; } .lightbox.active { - visibility: visible; - opacity: 1; + visibility: visible; + opacity: 1; } .lightbox img { - width: 50%; - height: 60%; - max-width: 90%; - max-height: 85%; - border-radius: 8px; - object-fit: cover; + width: 50%; + height: 60%; + max-width: 90%; + max-height: 85%; + border-radius: 8px; + object-fit: cover; } .navbar-menu li { - position: relative; + position: relative; } - /* .dropdown:hover .dropdown-menu{ display: flex; gap: 10px; @@ -3114,369 +2826,343 @@ justify-content: space-between; /* Dropdown Styles */ .dropdown { - position: relative; + position: relative; } .dropdown-trigger { - display: flex; - align-items: center; - gap: 0.25rem; - background: none; - border: none; - color: #64748b; - cursor: pointer; - font-size: 1rem; - font-weight: 400; - padding: 0.5rem 0; - transition: color 0.3s ease; + display: flex; + align-items: center; + gap: 0.25rem; + background: none; + border: none; + color: #64748b; + cursor: pointer; + font-size: 1rem; + font-weight: 400; + padding: 0.5rem 0; + transition: color 0.3s ease; } .dropdown-trigger:hover { - color: #1e293b; + color: #1e293b; } .dropdown-icon { - font-size: 0.75rem; - transition: transform 0.3s ease; + font-size: 0.75rem; + transition: transform 0.3s ease; } .dropdown:hover .dropdown-icon { - transform: rotate(180deg); + transform: rotate(180deg); } .dropdown-menu { - position: absolute; - top: 100%; - left: 50%; - transform: translateX(-50%); - margin-top: 0.5rem; - opacity: 0; - visibility: hidden; - transform: translateX(-50%) translateY(-1rem); - transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1); - z-index: 1000; + position: absolute; + top: 100%; + left: 50%; + transform: translateX(-50%); + margin-top: 0.5rem; + opacity: 0; + visibility: hidden; + transform: translateX(-50%) translateY(-1rem); + transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1); + z-index: 1000; } .dropdown:hover .dropdown-menu { - opacity: 1; - visibility: visible; - transform: translateX(-50%) translateY(0); + opacity: 1; + visibility: visible; + transform: translateX(-50%) translateY(0); } .dropdown-content { - background: white; - border-radius: 1.5rem; - box-shadow: 0 25px 50px rgba(0, 0, 0, 0.15); - border: 1px solid #e2e8f0; - padding: 2rem; - width: 800px; - position: relative; - overflow: hidden; + background: white; + border-radius: 1.5rem; + box-shadow: 0 25px 50px rgba(0, 0, 0, 0.15); + border: 1px solid #e2e8f0; + padding: 2rem; + width: 800px; + position: relative; + overflow: hidden; } /* Background Decorations */ .bg-decoration { - position: absolute; - border-radius: 50%; - opacity: 0.5; - pointer-events: none; + position: absolute; + border-radius: 50%; + opacity: 0.5; + pointer-events: none; } .bg-decoration-1 { - top: -8rem; - right: -8rem; - width: 16rem; - height: 16rem; - background: linear-gradient(135deg, #dbeafe 0%, #e0e7ff 100%); + top: -8rem; + right: -8rem; + width: 16rem; + height: 16rem; + background: linear-gradient(135deg, #dbeafe 0%, #e0e7ff 100%); } .bg-decoration-2 { - bottom: -6rem; - left: -6rem; - width: 12rem; - height: 12rem; - background: linear-gradient(45deg, #dcfce7 0%, #dbeafe 100%); + bottom: -6rem; + left: -6rem; + width: 12rem; + height: 12rem; + background: linear-gradient(45deg, #dcfce7 0%, #dbeafe 100%); } /* Services Grid */ .services-grid { - display: grid; - grid-template-columns: repeat(3, 1fr); - gap: 2rem; - position: relative; - z-index: 10; + display: grid; + grid-template-columns: repeat(3, 1fr); + gap: 2rem; + position: relative; + z-index: 10; } .service-category { - display: flex; - flex-direction: column; - gap: 1rem; + display: flex; + flex-direction: column; + gap: 1rem; } .category-title { - font-size: 0.75rem; - font-weight: 600; - color: #64748b; - text-transform: uppercase; - letter-spacing: 0.05em; - border-bottom: 1px solid #e2e8f0; - padding-bottom: 0.5rem; + font-size: 0.75rem; + font-weight: 600; + color: #64748b; + text-transform: uppercase; + letter-spacing: 0.05em; + border-bottom: 1px solid #e2e8f0; + padding-bottom: 0.5rem; } .service-items { - display: flex; - flex-direction: column; - gap: 0.5rem; + display: flex; + flex-direction: column; + gap: 0.5rem; } .service-item { - cursor: pointer; - border-radius: 0.75rem; - padding: 0.75rem; - transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); - position: relative; - display: flex; - align-items: flex-start; - gap: 0.75rem; + cursor: pointer; + border-radius: 0.75rem; + padding: 0.75rem; + transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); + position: relative; + display: flex; + align-items: flex-start; + gap: 0.75rem; } .service-item:hover { - background: #f8fafc; - transform: translateY(-0.25rem) scale(1.05); - box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1); + background: #f8fafc; + transform: translateY(-0.25rem) scale(1.05); + box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1); } .service-icon { - padding: 0.2rem; - border-radius: 0.5rem; - color: white; - font-size: 1rem; - transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); - flex-shrink: 0; - width: 2rem; - height: 2rem; - display: flex; - align-items: center; - justify-content: center; + padding: 0.2rem; + border-radius: 0.5rem; + color: white; + font-size: 1rem; + transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); + flex-shrink: 0; + width: 2rem; + height: 2rem; + display: flex; + align-items: center; + justify-content: center; } .service-item:hover .service-icon { - transform: scale(1.1) rotate(6deg); + transform: scale(1.1) rotate(6deg); } - -.service-icon img { - height: 100%; - width: 100%; - object-fit: cover; - box-shadow: 0 5px 10px gray; - border-radius: 100%; +.service-icon img{ + height: 100%; + width: 100%; + object-fit: cover; + box-shadow: 0 5px 10px gray; + border-radius: 100%; } - .service-content { - flex: 1; - min-width: 0; + flex: 1; + min-width: 0; } .service-name { - font-size: 0.875rem; - font-weight: 500; - color: #1e293b; - margin-bottom: 0.25rem; - transition: color 0.3s ease; + font-size: 0.875rem; + font-weight: 500; + color: #1e293b; + margin-bottom: 0.25rem; + transition: color 0.3s ease; } .service-item:hover .service-name { - color: #0f172a; + color: #0f172a; } .service-description { - font-size: 0.75rem; - color: #64748b; - opacity: 0; - max-height: 0; - overflow: hidden; - transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); - line-height: 1.4; + font-size: 0.75rem; + color: #64748b; + opacity: 0; + max-height: 0; + overflow: hidden; + transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); + line-height: 1.4; } .service-item:hover .service-description { - opacity: 1; - max-height: 5rem; - margin-top: 0.25rem; + opacity: 1; + max-height: 5rem; + margin-top: 0.25rem; } .service-border { - position: absolute; - bottom: 0; - left: 0.75rem; - right: 0.75rem; - height: 2px; - width: 0; - transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1); - border-radius: 1px; + position: absolute; + bottom: 0; + left: 0.75rem; + right: 0.75rem; + height: 2px; + width: 0; + transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1); + border-radius: 1px; } .service-item:hover .service-border { - width: calc(100% - 1.5rem); + width: calc(100% - 1.5rem); } - /* Color Classes */ .blue-bg { - background: #3b82f6; + background: #3b82f6; } - .red-bg { - background: #ef4444; + background: #ef4444; } - .green-bg { - background: #10b981; + background: #10b981; } - .purple-bg { - background: #8b5cf6; + background: #8b5cf6; } - .orange-bg { - background: #f97316; + background: #f97316; } - .indigo-bg { - background: #6366f1; + background: #6366f1; } - .pink-bg { - background: #ec4899; + background: #ec4899; } - .emerald-bg { - background: #059669; + background: #059669; } - .cyan-bg { - background: #06b6d4; + background: #06b6d4; } - .amber-bg { - background: #f59e0b; + background: #f59e0b; } - .rose-bg { - background: #f43f5e; + background: #f43f5e; } - .teal-bg { - background: #14b8a6; + background: #14b8a6; } .blue-gradient { - background: linear-gradient(90deg, #3b82f6, transparent); + background: linear-gradient(90deg, #3b82f6, transparent); } - .red-gradient { - background: linear-gradient(90deg, #ef4444, transparent); + background: linear-gradient(90deg, #ef4444, transparent); } - .green-gradient { - background: linear-gradient(90deg, #10b981, transparent); + background: linear-gradient(90deg, #10b981, transparent); } - .purple-gradient { - background: linear-gradient(90deg, #8b5cf6, transparent); + background: linear-gradient(90deg, #8b5cf6, transparent); } - .orange-gradient { - background: linear-gradient(90deg, #f97316, transparent); + background: linear-gradient(90deg, #f97316, transparent); } - .indigo-gradient { - background: linear-gradient(90deg, #6366f1, transparent); + background: linear-gradient(90deg, #6366f1, transparent); } - .pink-gradient { - background: linear-gradient(90deg, #ec4899, transparent); + background: linear-gradient(90deg, #ec4899, transparent); } - .emerald-gradient { - background: linear-gradient(90deg, #059669, transparent); + background: linear-gradient(90deg, #059669, transparent); } - .cyan-gradient { - background: linear-gradient(90deg, #06b6d4, transparent); + background: linear-gradient(90deg, #06b6d4, transparent); } - .amber-gradient { - background: linear-gradient(90deg, #f59e0b, transparent); + background: linear-gradient(90deg, #f59e0b, transparent); } - .rose-gradient { - background: linear-gradient(90deg, #f43f5e, transparent); + background: linear-gradient(90deg, #f43f5e, transparent); } - .teal-gradient { - background: linear-gradient(90deg, #14b8a6, transparent); + background: linear-gradient(90deg, #14b8a6, transparent); } /* Responsive Design */ @media (max-width: 1024px) { - .dropdown-content { - width: 700px; - } + .dropdown-content { + width: 700px; + } } @media (max-width: 768px) { - .dropdown-content { - width: 90vw; - padding: 1.5rem; - } + .dropdown-content { + width: 90vw; + padding: 1.5rem; + } - .services-grid { - grid-template-columns: 1fr; - gap: 1.5rem; - } + .services-grid { + grid-template-columns: 1fr; + gap: 1.5rem; + } - .cta-content { - flex-direction: column; - gap: 1rem; - text-align: center; - } + .cta-content { + flex-direction: column; + gap: 1rem; + text-align: center; + } } @media (max-width: 480px) { - .dropdown-content { - width: 95vw; - padding: 1rem; - } + .dropdown-content { + width: 95vw; + padding: 1rem; + } - .services-grid { - gap: 1rem; - } + .services-grid { + gap: 1rem; + } } /* Enhanced Animations */ @keyframes fadeInUp { - from { - opacity: 0; - transform: translateY(20px); - } - - to { - opacity: 1; - transform: translateY(0); - } + from { + opacity: 0; + transform: translateY(20px); + } + to { + opacity: 1; + transform: translateY(0); + } } .dropdown:hover .dropdown-content { - animation: fadeInUp 0.5s cubic-bezier(0.4, 0, 0.2, 1); + animation: fadeInUp 0.5s cubic-bezier(0.4, 0, 0.2, 1); } /* Focus States for Accessibility */ @@ -3484,289 +3170,271 @@ justify-content: space-between; .nav-link:focus, .cta-button:focus, .book-call-btn:focus { - outline: 2px solid #3b82f6; - outline-offset: 2px; + outline: 2px solid #3b82f6; + outline-offset: 2px; } .service-item:focus { - outline: 2px solid #3b82f6; - outline-offset: 2px; - border-radius: 0.75rem; + outline: 2px solid #3b82f6; + outline-offset: 2px; + border-radius: 0.75rem; } /* Show on toggle */ .dropdown.open .dropdown-menu { - display: block; + display: block; } - .nav-button { - position: absolute; - top: 50%; - font-size: 1.5em; - background: rgba(255, 255, 255, 0.2); - border: none; - color: #fff; - padding: 5px 20px; - cursor: pointer; - user-select: none; - transform: translateY(-50%); - border-radius: 50%; + position: absolute; + top: 50%; + font-size: 1.5em; + background: rgba(255,255,255,0.2); + border: none; + color: #fff; + padding:5px 20px; + cursor: pointer; + user-select: none; + transform: translateY(-50%); + border-radius: 50%; } .nav-button:hover { - background: rgba(255, 255, 255, 0.4); + background: rgba(255,255,255,0.4); } -.prev { - left: 20px; -} - -.next { - right: 20px; -} +.prev { left: 20px; } +.next { right: 20px; } .close-btn { - position: absolute; - top: 10px; - right: 25px; - font-size: 0.8em; - color: #fff; - cursor: pointer; - background: rgba(255, 255, 255, 0.2); - padding: 6px 12px; - border-radius: 50%; - z-index: 100; - transition: background 0.3s ease; + position: absolute; + top: 10px; + right: 25px; + font-size: 0.8em; + color: #fff; + cursor: pointer; + background: rgba(255,255,255,0.2); + padding: 6px 12px; + border-radius: 50%; + z-index: 100; + transition: background 0.3s ease; } .close-btn:hover { - background: rgba(255, 255, 255, 0.4); + background: rgba(255,255,255,0.4); } @media (max-width: 1024px) { - .gallery { - column-count: 3; - } + .gallery { column-count: 3; } } - @media (max-width: 768px) { - .gallery { - column-count: 2; - } + .gallery { column-count: 2; } } - @media (max-width: 480px) { - .gallery { - column-count: 1; - } + .gallery { column-count: 1; } } /* sitemap */ -.sitemap-grid { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); - gap: 30px; - margin-top: 20px; -} - -.sitemap-category { - background: white; - border-radius: 16px; - padding: 30px; - box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08); - border: 1px solid #e2e8f0; - transition: all 0.3s ease; - position: relative; - overflow: hidden; -} - -.sitemap-category::before { - content: ''; - position: absolute; - top: 0; - left: 0; - right: 0; - height: 4px; - background: linear-gradient(90deg, #dc2626 0%, #1e40af 100%); -} - -.sitemap-category:hover { - transform: translateY(-5px); - box-shadow: 0 20px 40px rgba(0, 0, 0, 0.12); -} - -.sitemap-category h2 { - font-size: 1.5rem; - font-weight: 600; - margin-bottom: 20px; - color: #1e293b; - display: flex; - align-items: center; - gap: 10px; -} - -.category-icon { - width: 40px; - height: 40px; - border-radius: 10px; - display: flex; - align-items: center; - justify-content: center; - font-size: 1.2rem; - color: white; - flex-shrink: 0; - padding: 8px; -} - -.core-pages .category-icon { - background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%); -} - -.study-abroad .category-icon { - background: linear-gradient(135deg, #1e40af 0%, #1e3a8a 100%); -} - -.student-support .category-icon { - background: linear-gradient(135deg, #059669 0%, #047857 100%); -} - -.more-info .category-icon { - background: linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%); -} - -.careers .category-icon { - background: linear-gradient(135deg, #ea580c 0%, #c2410c 100%); -} - -.sitemap-category ul { - list-style: none; - padding: 0; -} - -.sitemap-category li { - margin-bottom: 12px; -} - -.sitemap-category li a { - text-decoration: none; - color: #475569; - font-weight: 500; - padding: 10px 15px; - border-radius: 8px; - display: block; - transition: all 0.3s ease; - border-left: 3px solid transparent; -} - -.sitemap-category li a:hover { - background: #f1f5f9; - color: #dc2626; - border-left-color: #dc2626; - transform: translateX(5px); -} - - - -.stats-section { - background: white; - border-radius: 16px; - padding: 30px; - margin-bottom: 30px; - box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08); - border: 1px solid #e2e8f0; -} - -.stats-grid { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); - gap: 20px; -} - -.stat-item { - text-align: center; - padding: 20px; - border-radius: 12px; - background: #f8fafc; -} - -.stat-number { - font-size: 2rem; - font-weight: 700; - color: #dc2626; - margin-bottom: 5px; -} - -.stat-label { - color: #64748b; - font-size: 0.9rem; -} - -/* Responsive Design */ -@media (max-width: 768px) { - - - - - .sitemap-grid { - grid-template-columns: 1fr; - gap: 20px; + .sitemap-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); + gap: 30px; + margin-top: 20px; } .sitemap-category { - padding: 20px; + background: white; + border-radius: 16px; + padding: 30px; + box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08); + border: 1px solid #e2e8f0; + transition: all 0.3s ease; + position: relative; + overflow: hidden; + } + + .sitemap-category::before { + content: ''; + position: absolute; + top: 0; + left: 0; + right: 0; + height: 4px; + background: linear-gradient(90deg, #dc2626 0%, #1e40af 100%); + } + + .sitemap-category:hover { + transform: translateY(-5px); + box-shadow: 0 20px 40px rgba(0, 0, 0, 0.12); } .sitemap-category h2 { - font-size: 1.3rem; + font-size: 1.5rem; + font-weight: 600; + margin-bottom: 20px; + color: #1e293b; + display: flex; + align-items: center; + gap: 10px; + } + + .category-icon { + width: 40px; + height: 40px; + border-radius: 10px; + display: flex; + align-items: center; + justify-content: center; + font-size: 1.2rem; + color: white; + flex-shrink: 0; + padding: 8px; + } + + .core-pages .category-icon { + background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%); + } + + .study-abroad .category-icon { + background: linear-gradient(135deg, #1e40af 0%, #1e3a8a 100%); + } + + .student-support .category-icon { + background: linear-gradient(135deg, #059669 0%, #047857 100%); + } + + .more-info .category-icon { + background: linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%); + } + + .careers .category-icon { + background: linear-gradient(135deg, #ea580c 0%, #c2410c 100%); + } + + .sitemap-category ul { + list-style: none; + padding: 0; + } + + .sitemap-category li { + margin-bottom: 12px; + } + + .sitemap-category li a { + text-decoration: none; + color: #475569; + font-weight: 500; + padding: 10px 15px; + border-radius: 8px; + display: block; + transition: all 0.3s ease; + border-left: 3px solid transparent; + } + + .sitemap-category li a:hover { + background: #f1f5f9; + color: #dc2626; + border-left-color: #dc2626; + transform: translateX(5px); + } + + + + .stats-section { + background: white; + border-radius: 16px; + padding: 30px; + margin-bottom: 30px; + box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08); + border: 1px solid #e2e8f0; } .stats-grid { - grid-template-columns: repeat(2, 1fr); - } -} - -@media (max-width: 480px) { - - .sitemap-category { - padding: 15px; + display: grid; + grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); + gap: 20px; } - .stats-grid { + .stat-item { + text-align: center; + padding: 20px; + border-radius: 12px; + background: #f8fafc; + } + + .stat-number { + font-size: 2rem; + font-weight: 700; + color: #dc2626; + margin-bottom: 5px; + } + + .stat-label { + color: #64748b; + font-size: 0.9rem; + } + + /* Responsive Design */ + @media (max-width: 768px) { + + + + + .sitemap-grid { grid-template-columns: 1fr; - } -} + gap: 20px; + } + .sitemap-category { + padding: 20px; + } + + .sitemap-category h2 { + font-size: 1.3rem; + } + + .stats-grid { + grid-template-columns: repeat(2, 1fr); + } + } + + @media (max-width: 480px) { + + .sitemap-category { + padding: 15px; + } + + .stats-grid { + grid-template-columns: 1fr; + } + } /* service */ .service-points { - border: .5px solid #1856a61e; + border: .5px solid #1856a61e; } -.service-points:hover { - border: 1px solid #1856A6; - background-color: #1856A6; +.service-points:hover { + border: 1px solid #1856A6; + background-color: #1856A6; transition: 0.3s all ease-in-out; - box-shadow: 0 5px 14px #1856A6; + box-shadow: 0 5px 14px #1856A6; } - -.lqd-tabs-style-9 .lqd-tabs-nav li.active { - border: 1px solid #1856A6; +.lqd-tabs-style-9 .lqd-tabs-nav li.active{ + border: 1px solid #1856A6; } - @media (max-width:479px) { - .lqd-tabs-style-9 .lqd-tabs-nav { - flex-direction: row; - } - - .lqd-tabs-style-9 .lqd-tabs-nav li { - width: 50%; - } + .lqd-tabs-style-9 .lqd-tabs-nav{ + flex-direction: row; + } + .lqd-tabs-style-9 .lqd-tabs-nav li{ + width: 50%; + } } @@ -3775,48 +3443,43 @@ justify-content: space-between; /* footer */ /* footer background image can be useed for other site as well */ -.footer-graphics { - background: url("../images/general/footer-graphics.png"); - background-position: center; - background-size: contain; - background-repeat: no-repeat; - padding: 35px; - margin-bottom: -10px; +.footer-graphics{ + background: url("../images/general/footer-graphics.png"); + background-position: center; + background-size: contain; + background-repeat: no-repeat; + padding: 35px; + margin-bottom: -10px; } +.footer-content{ -.footer-content { - - background-color: var(--color-yellow); + background-color: var(--color-yellow); } - .highlight-tab { - background-color: #e0f2fe; - /* light blue */ - font-weight: bold; - color: #0c4a6e; - /* dark brand color */ + background-color: #e0f2fe; /* light blue */ + font-weight: bold; + color: #0c4a6e; /* dark brand color */ } -.footer-content .footer-inside { +.footer-content .footer-inside{ - padding-top: 30px; + padding-top: 30px; } + @media (min-width:768px ) { + .footer-graphics { + padding: 47px; -@media (min-width:768px) { - .footer-graphics { - padding: 47px; + } - } - -} + } @media (min-width:1200px) { - .footer-graphics { - padding: 67px; + .footer-graphics { + padding: 67px; - } + } } @@ -3825,92 +3488,77 @@ justify-content: space-between; footer input::placeholder { - color: white; - /* Change placeholder text color */ - opacity: 1; - /* Ensures full visibility */ - font-size: 12px; + color: white; /* Change placeholder text color */ + opacity: 1; /* Ensures full visibility */ + font-size: 12px; } - -footer input, -footer button { - border-bottom: 1px solid white; +footer input, footer button { + border-bottom: 1px solid white; } - -.lqd-fancy-menu input::placeholder { - color: gray; +.lqd-fancy-menu input::placeholder{ + color: gray; } - -.lqd-fancy-menu input:focus { - outline: 0; - border: 1px solid var(--color-brand); +.lqd-fancy-menu input:focus{ + outline: 0; + border: 1px solid var(--color-brand); } +footer form{ -footer form { - - border-radius: 4px; - /* border: 0.1px solid white; */ - margin-bottom: 10px; + border-radius: 4px; + /* border: 0.1px solid white; */ + margin-bottom: 10px; } - -footer form input { - background-color: #fff; - margin: 2px 0; +footer form input{ + background-color: #fff; + margin: 2px 0; } - -footer form button { - background-color: #675113; - margin: 2px 0; +footer form button{ + background-color: #675113; + margin: 2px 0; } - -footer form input::placeholder { - color: rgb(37, 36, 36) !important; +footer form input::placeholder{ +color: rgb(37, 36, 36) !important; } +.footer-logos{ + width: 100%; -.footer-logos { - width: 100%; - - /* padding: 10px 0; */ + /* padding: 10px 0; */ } - -.footer-logos .row { - justify-content: center; - align-items: center; - flex-wrap: wrap; - margin: 0 15px; - gap: 7px; +.footer-logos .row{ + justify-content: center; + align-items: center; + flex-wrap: wrap; + margin: 0 15px; + gap: 7px; } +.footer-logos img{ + padding: 5px; -.footer-logos img { - padding: 5px; - - margin: 5px 0; + margin: 5px 0; } - /* .footer-logos img:hover{ transition: .3s all ease-in-out; box-shadow: 0 5px 10px rgb(180, 179, 179); } */ -.footer-bottom { - /* background-color: #731c1c; */ - background-color: var(--color-brand); - padding: 20px 0; +.footer-bottom{ + /* background-color: #731c1c; */ + background-color: var(--color-brand); + padding: 20px 0; +} +.social-icons-footer i{ +color: #3c2c07 ; +font-size: 30px; } - -.social-icons-footer i { - color: #3c2c07; - font-size: 30px; -} \ No newline at end of file