add anfrage modal

master
Gustavo Luigi 2022-08-25 12:11:19 +02:00
parent 071eb4f2fa
commit efa425d78d
5 changed files with 343 additions and 180 deletions

8
.idea/.gitignore vendored
View File

@ -1,8 +0,0 @@
# Default ignored files
/shelf/
/workspace.xml
# Editor-based HTTP Client requests
/httpRequests/
# Datasource local storage ignored files
/dataSources/
/dataSources.local.xml

View File

@ -1,8 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="ProjectModuleManager">
<modules>
<module fileurl="file://$PROJECT_DIR$/.idea/themes-getlumino.iml" filepath="$PROJECT_DIR$/.idea/themes-getlumino.iml" />
</modules>
</component>
</project>

View File

@ -1,8 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<module type="WEB_MODULE" version="4">
<component name="NewModuleRootManager">
<content url="file://$MODULE_DIR$" />
<orderEntry type="inheritedJdk" />
<orderEntry type="sourceFolder" forTests="false" />
</component>
</module>

View File

@ -1,6 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="VcsDirectoryMappings">
<mapping directory="$PROJECT_DIR$" vcs="Git" />
</component>
</project>

View File

@ -1,14 +1,16 @@
@extends('template.'.config('settings.template').'.content.master')
@section('head')
<style type="text/css">
li{
list-style: none;
margin-bottom: 4px;
}
</style>
@stop
@section('content')


<div class="container">

<div class="container">
<section>
<div class="row">



<div class="col-5 offset-1">
<div id="carouselExampleCaptions" class="carousel slide" data-bs-ride="carousel">
<div class="carousel-indicators">
@ -47,25 +49,19 @@
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Next</span>
</button>
</div>

<br>
<br>
<br>
</div>
<br>
<br>
<br>
</div>
<div class="col-5 offset-1">



<h1>Steckersolar Max 600</h1>

<div class="ms-3 mt-3 mb-3">
<span class="fs-4 fw-bold" style="color: #546c8a;">759 €</span>

<span class="text-muted fs-7">Inkl. MwSt.</span>

</div>

<div class="ms-3 mt-3 mb-3 fs-6 fw-bolder" style="color: #79b27f;">
<svg style="fill: currentColor; width: 22px; margin-right: 10px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><path d="M624 352h-16V243.9c0-12.7-5.1-24.9-14.1-33.9L494 110.1c-9-9-21.2-14.1-33.9-14.1H416V48c0-26.5-21.5-48-48-48H112C85.5 0 64 21.5 64 48v48H8c-4.4 0-8 3.6-8 8v16c0 4.4 3.6 8 8 8h272c4.4 0 8 3.6 8 8v16c0 4.4-3.6 8-8 8H40c-4.4 0-8 3.6-8 8v16c0 4.4 3.6 8 8 8h208c4.4 0 8 3.6 8 8v16c0 4.4-3.6 8-8 8H8c-4.4 0-8 3.6-8 8v16c0 4.4 3.6 8 8 8h208c4.4 0 8 3.6 8 8v16c0 4.4-3.6 8-8 8H64v128c0 53 43 96 96 96s96-43 96-96h128c0 53 43 96 96 96s96-43 96-96h48c8.8 0 16-7.2 16-16v-32c0-8.8-7.2-16-16-16zM160 464c-26.5 0-48-21.5-48-48s21.5-48 48-48 48 21.5 48 48-21.5 48-48 48zm320 0c-26.5 0-48-21.5-48-48s21.5-48 48-48 48 21.5 48 48-21.5 48-48 48zm80-208H416V144h44.1l99.9 99.9V256z"/></svg>
Sofort Lieferbar!
@ -74,67 +70,117 @@
Kostenloser Anmeldeservice beim Netzbetreiber inklusive

</div>


<br>
Lieferumfang:
<br>
<br>


<style type="text/css">
li{
list-style: none;
margin-bottom: 4px;
}
</style>
<ul class="fs-5">
<li>2x Longi 375 Watt Monokristaline Module</li>
<li>1x 600 Watt Wechselrichter mit Zertifizierung</li>
<li>1x Kabel für Schuko-Stecker</li>

</ul>



<div class="text-end">
<a href="" class="btn btn-primary rounded-pill mt-5" style="padding-top: 6px; padding-bottom: 6px; padding-right: 20px; padding-left: 20px;">

<div>
<button class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#exampleModal" class="btn btn-primary rounded-pill mt-5" style="padding-top: 6px; padding-bottom: 6px; padding-right: 20px; padding-left: 20px;">
<svg style="fill: white; width: 19px; margin-right: 8px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M352 128C352 57.42 294.579 0 224 0 153.42 0 96 57.42 96 128H0v304c0 44.183 35.817 80 80 80h288c44.183 0 80-35.817 80-80V128h-96zM224 48c44.112 0 80 35.888 80 80H144c0-44.112 35.888-80 80-80zm176 384c0 17.645-14.355 32-32 32H80c-17.645 0-32-14.355-32-32V176h48v40c0 13.255 10.745 24 24 24s24-10.745 24-24v-40h160v40c0 13.255 10.745 24 24 24s24-10.745 24-24v-40h48v256z"/></svg>

Unverbindlich anfragen</a>
Unverbindlich anfragen
</button>
<div class="modal fade" data-backdrop="static" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog modal-fullscreen-lg-down modal-xl modal-dialog-scrollable">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Angebot anfragen</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="row">
<div class="col-12">
<div class="row text-success text-center mt-1">
<div class="col-4">
<svg style="fill: currentColor; height: 30px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><path d="M16 319.8c8.8 0 16-7.2 16-16s-7.2-16-16-16-16 7.2-16 16c0 8.9 7.2 16 16 16zM632 128l-113.5.2-51.2-49.9c-9.1-9.1-21.1-14.1-33.9-14.1h-101c-10.4 0-20.1 3.9-28.3 10-8.4-6.5-18.7-10.3-29.3-10.3h-69.5c-12.7 0-24.9 5.1-33.9 14.1l-50 50H8c-4.4 0-8 3.6-8 8v16c0 4.4 3.6 8 8 8h56v191.9H8c-4.4 0-8 3.6-8 8v16c0 4.4 3.6 8 8 8h56c17.6 0 31.8-14.2 31.9-31.7h33.2l81.5 78c29.8 24.1 71.8 23.4 101-.2l7.2 6.2c9.6 7.8 21.3 11.9 33.5 11.9 16 0 31.1-7 41.4-19.6l21.9-26.9c16.4 8.9 42.9 9 60-12l9.5-11.7c6.2-7.6 9.6-16.6 10.5-25.7h48.6c.1 17.5 14.4 31.7 31.9 31.7h56c4.4 0 8-3.6 8-8v-16c0-4.4-3.6-8-8-8h-56V160.2l56-.2c4.4 0 8-3.6 8-8v-16c-.1-4.5-3.7-8-8.1-8zM460.2 357.6l-9.5 11.7c-5.4 6.6-15.4 8.1-22.5 2.3l-17.8-14.4-41.5 51c-7.5 9.3-21 10.2-29.4 3.4l-30.6-26.1-10.4 12.8c-16.7 20.5-47 23.7-66.6 7.9L142 320.1H96V159.9h38.6l59.3-59.3c3-3 7.1-4.7 11.3-4.7h69.5c.9 2.2.3.7 1.1 2.9l-59 54.2c-28.2 25.9-29.6 69.2-4.2 96.9 14.3 15.6 58.6 39.3 96.9 4.2l22.8-20.9 125.6 101.9c6.8 5.6 7.8 15.7 2.3 22.5zm83.8-37.5h-57.2c-2.5-3.5-5.3-6.9-8.8-9.8l-121.9-99 28.4-26.1c6.5-6 7-16.1 1-22.6s-16.1-6.9-22.6-1l-75.1 68.8c-14.4 13.1-38.6 12-51.7-2.2-13.6-14.8-12.7-38 2.2-51.7l83.1-76.2c3-2.7 6.8-4.2 10.8-4.2h101c4.3 0 8.3 1.7 11.4 4.8l60.7 59.1H544v160.1zm80-32.2c-8.8 0-16 7.2-16 16s7.2 16 16 16 16-7.2 16-16c0-8.9-7.2-16-16-16z"/></svg>
<br>
<br>
Persönliche Beratung
</div>
<div class="col-4">
<svg style="fill: currentColor; width:30px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M502.61 233.32L278.68 9.39C272.42 3.13 264.21 0 256 0s-16.42 3.13-22.68 9.39L9.39 233.32c-12.52 12.53-12.52 32.83 0 45.36l223.93 223.93c6.26 6.26 14.47 9.39 22.68 9.39s16.42-3.13 22.68-9.39l223.93-223.93c12.52-12.53 12.52-32.83 0-45.36zM255.95 479.98L32.02 255.95 255.95 32.01c.01 0 .02-.01.05-.01l.05.02 223.93 224.03-224.03 223.93zM330.89 224H208c-26.51 0-48 21.49-48 48v40c0 4.42 3.58 8 8 8h16c4.42 0 8-3.58 8-8v-40c0-8.84 7.16-16 16-16h122.89l-54.63 50.43c-3.25 3-3.45 8.06-.45 11.3l10.84 11.74c3 3.25 8.06 3.45 11.3.45l78.4-72.36c4.87-4.52 7.66-10.94 7.66-17.58s-2.78-13.06-7.72-17.62l-78.34-72.31c-3.25-3-8.31-2.79-11.3.45l-10.84 11.74c-3 3.25-2.79 8.31.45 11.3L330.89 224z"/></svg>
<br>
<br>
Abholung in Vohenstrauß
</div>
<div class="col-4">
<svg style="fill: currentColor; width:30px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M232 248c0-8.8-7.2-16-16-16h-16c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16h16c8.8 0 16-7.2 16-16v-16zm-96 0c0-8.8-7.2-16-16-16h-16c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16h16c8.8 0 16-7.2 16-16v-16zm32 48h-16c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16h16c8.8 0 16-7.2 16-16v-16c0-8.8-7.2-16-16-16zm96 0h-16c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16h16c8.8 0 16-7.2 16-16v-16c0-8.8-7.2-16-16-16zm64-48c0-8.8-7.2-16-16-16h-16c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16h16c8.8 0 16-7.2 16-16v-16zm183.4 131.5l-25.5-178.3c-3.4-23.6-23.6-41.2-47.5-41.2H192V96h80c8.8 0 16-7.2 16-16V16c0-8.8-7.2-16-16-16H80c-8.8 0-16 7.2-16 16v64c0 8.8 7.2 16 16 16h80v64H73.6c-23.9 0-44.1 17.6-47.5 41.2L.6 379.5c-.4 3-.6 6-.6 9.1V464c0 26.5 21.5 48 48 48h416c26.5 0 48-21.5 48-48v-75.5c0-3-.2-6-.6-9zM96 64V32h160v32H96zM57.8 205.7c1.1-7.8 7.9-13.7 15.8-13.7h364.7c7.9 0 14.7 5.9 15.8 13.7L479.7 384H32.3l25.5-178.3zM480 464c0 8.8-7.2 16-16 16H48c-8.8 0-16-7.2-16-16v-48h448v48zm-72-232h-16c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16h16c8.8 0 16-7.2 16-16v-16c0-8.8-7.2-16-16-16zm-48 64h-16c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16h16c8.8 0 16-7.2 16-16v-16c0-8.8-7.2-16-16-16z"/></svg>
<br>
<br>
Zahlung erst bei Liefertermin
</div>
</div>
<div class="card mt-1" style="background-color: #f7fcf7;">
<div class="card-header">
<h5>
<svg style="width: 22px; margin-right: 5px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 496 512">
<path d="M248 8C111 8 0 119 0 256s111 248 248 248 248-111 248-248S385 8 248 8zm128 421.6c-35.9 26.5-80.1 42.4-128 42.4s-92.1-15.9-128-42.4V416c0-35.3 28.7-64 64-64 11.1 0 27.5 11.4 64 11.4 36.6 0 52.8-11.4 64-11.4 35.3 0 64 28.7 64 64v13.6zm30.6-27.5c-6.8-46.4-46.3-82.1-94.6-82.1-20.5 0-30.4 11.4-64 11.4S204.6 320 184 320c-48.3 0-87.8 35.7-94.6 82.1C53.9 363.6 32 312.4 32 256c0-119.1 96.9-216 216-216s216 96.9 216 216c0 56.4-21.9 107.6-57.4 146.1zM248 120c-48.6 0-88 39.4-88 88s39.4 88 88 88 88-39.4 88-88-39.4-88-88-88zm0 144c-30.9 0-56-25.1-56-56s25.1-56 56-56 56 25.1 56 56-25.1 56-56 56z"/>
</svg>
Persönliche Daten
</h5>
</div>
<div class="card-body">
<form>
<div class="mb-3">
<label for="" class="form-label">Anrede</label>
<select class="form-select" aria-label="Default select example">
<option selected>Herr</option>
<option value="1">Frau</option>
<option value="2">Firma</option>
<option value="3">Herr Dr.</option>
</select>
</div>
<div class="mb-3">
<label for="" class="form-label">Vorname</label>
<input type="text" class="form-control" id="" aria-describedby="" placeholder="Maximilian">
</div>
<div class="mb-3">
<label for="" class="form-label">Nachname</label>
<input type="text" class="form-control" id="" aria-describedby="" placeholder="Meyer">
</div>
<div class="mb-3">
<label for="exampleInputEmail1" class="form-label">E-Mail</label>
<input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="max.mustermann@areya.de">
</div>
<div class="mb-3">
<label for="exampleInputEmail1" class="form-label">Telefon</label>
<input type="text" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="0941467233">
</div>
<div class="mb-3">
<label for="exampleInputPassword1" class="form-label">Adresse</label>
<input type="text" class="form-control" placeholder="Neuenhammerstr. 44, 92714 Pleystein" id="exampleInputPassword1">
</div>
<div class="mb-3 form-check mb-4">
<input type="checkbox" class="form-check-input" id="exampleCheck1">
<label class="form-check-label" for="exampleCheck1">Ich habe die Datenschutzbestimmungen gelesen und akzeptiert.</label>
</div>
<div class="d-block">
<a href="" type="submit" class="btn btn-success d-block mx-auto">
Angebot anfragen
</a>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>


<div class="alert alert-warning" role="alert">
Lieferservice 25km rund um Weiden in der Oberpfalz für 75 €
</div>



</div>

<hr class="mt-5">




</div>

</div>

</a>


</div>

</div>

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


<section style="background-color: wheat;">
<div class="container">
<div class="row">
@ -144,12 +190,159 @@
</div>
</div>
</section>

</div>



</div>
@stop



<!-- <div class="modal fade" data-backdrop="static" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog modal-fullscreen-lg-down modal-xl modal-dialog-scrollable">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Angebot anfragen</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="row">
<div class="col-7">
<div class="row text-success text-center mt-1">
<div class="col-4">
<svg style="fill: currentColor; height: 30px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><path d="M16 319.8c8.8 0 16-7.2 16-16s-7.2-16-16-16-16 7.2-16 16c0 8.9 7.2 16 16 16zM632 128l-113.5.2-51.2-49.9c-9.1-9.1-21.1-14.1-33.9-14.1h-101c-10.4 0-20.1 3.9-28.3 10-8.4-6.5-18.7-10.3-29.3-10.3h-69.5c-12.7 0-24.9 5.1-33.9 14.1l-50 50H8c-4.4 0-8 3.6-8 8v16c0 4.4 3.6 8 8 8h56v191.9H8c-4.4 0-8 3.6-8 8v16c0 4.4 3.6 8 8 8h56c17.6 0 31.8-14.2 31.9-31.7h33.2l81.5 78c29.8 24.1 71.8 23.4 101-.2l7.2 6.2c9.6 7.8 21.3 11.9 33.5 11.9 16 0 31.1-7 41.4-19.6l21.9-26.9c16.4 8.9 42.9 9 60-12l9.5-11.7c6.2-7.6 9.6-16.6 10.5-25.7h48.6c.1 17.5 14.4 31.7 31.9 31.7h56c4.4 0 8-3.6 8-8v-16c0-4.4-3.6-8-8-8h-56V160.2l56-.2c4.4 0 8-3.6 8-8v-16c-.1-4.5-3.7-8-8.1-8zM460.2 357.6l-9.5 11.7c-5.4 6.6-15.4 8.1-22.5 2.3l-17.8-14.4-41.5 51c-7.5 9.3-21 10.2-29.4 3.4l-30.6-26.1-10.4 12.8c-16.7 20.5-47 23.7-66.6 7.9L142 320.1H96V159.9h38.6l59.3-59.3c3-3 7.1-4.7 11.3-4.7h69.5c.9 2.2.3.7 1.1 2.9l-59 54.2c-28.2 25.9-29.6 69.2-4.2 96.9 14.3 15.6 58.6 39.3 96.9 4.2l22.8-20.9 125.6 101.9c6.8 5.6 7.8 15.7 2.3 22.5zm83.8-37.5h-57.2c-2.5-3.5-5.3-6.9-8.8-9.8l-121.9-99 28.4-26.1c6.5-6 7-16.1 1-22.6s-16.1-6.9-22.6-1l-75.1 68.8c-14.4 13.1-38.6 12-51.7-2.2-13.6-14.8-12.7-38 2.2-51.7l83.1-76.2c3-2.7 6.8-4.2 10.8-4.2h101c4.3 0 8.3 1.7 11.4 4.8l60.7 59.1H544v160.1zm80-32.2c-8.8 0-16 7.2-16 16s7.2 16 16 16 16-7.2 16-16c0-8.9-7.2-16-16-16z"/></svg>
<br>
<br>
Persönliche Beratung
</div>
<div class="col-4">
<svg style="fill: currentColor; width:30px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M502.61 233.32L278.68 9.39C272.42 3.13 264.21 0 256 0s-16.42 3.13-22.68 9.39L9.39 233.32c-12.52 12.53-12.52 32.83 0 45.36l223.93 223.93c6.26 6.26 14.47 9.39 22.68 9.39s16.42-3.13 22.68-9.39l223.93-223.93c12.52-12.53 12.52-32.83 0-45.36zM255.95 479.98L32.02 255.95 255.95 32.01c.01 0 .02-.01.05-.01l.05.02 223.93 224.03-224.03 223.93zM330.89 224H208c-26.51 0-48 21.49-48 48v40c0 4.42 3.58 8 8 8h16c4.42 0 8-3.58 8-8v-40c0-8.84 7.16-16 16-16h122.89l-54.63 50.43c-3.25 3-3.45 8.06-.45 11.3l10.84 11.74c3 3.25 8.06 3.45 11.3.45l78.4-72.36c4.87-4.52 7.66-10.94 7.66-17.58s-2.78-13.06-7.72-17.62l-78.34-72.31c-3.25-3-8.31-2.79-11.3.45l-10.84 11.74c-3 3.25-2.79 8.31.45 11.3L330.89 224z"/></svg>
<br>
<br>
Abholung in Vohenstrauß
</div>
<div class="col-4">
<svg style="fill: currentColor; width:30px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M232 248c0-8.8-7.2-16-16-16h-16c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16h16c8.8 0 16-7.2 16-16v-16zm-96 0c0-8.8-7.2-16-16-16h-16c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16h16c8.8 0 16-7.2 16-16v-16zm32 48h-16c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16h16c8.8 0 16-7.2 16-16v-16c0-8.8-7.2-16-16-16zm96 0h-16c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16h16c8.8 0 16-7.2 16-16v-16c0-8.8-7.2-16-16-16zm64-48c0-8.8-7.2-16-16-16h-16c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16h16c8.8 0 16-7.2 16-16v-16zm183.4 131.5l-25.5-178.3c-3.4-23.6-23.6-41.2-47.5-41.2H192V96h80c8.8 0 16-7.2 16-16V16c0-8.8-7.2-16-16-16H80c-8.8 0-16 7.2-16 16v64c0 8.8 7.2 16 16 16h80v64H73.6c-23.9 0-44.1 17.6-47.5 41.2L.6 379.5c-.4 3-.6 6-.6 9.1V464c0 26.5 21.5 48 48 48h416c26.5 0 48-21.5 48-48v-75.5c0-3-.2-6-.6-9zM96 64V32h160v32H96zM57.8 205.7c1.1-7.8 7.9-13.7 15.8-13.7h364.7c7.9 0 14.7 5.9 15.8 13.7L479.7 384H32.3l25.5-178.3zM480 464c0 8.8-7.2 16-16 16H48c-8.8 0-16-7.2-16-16v-48h448v48zm-72-232h-16c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16h16c8.8 0 16-7.2 16-16v-16c0-8.8-7.2-16-16-16zm-48 64h-16c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16h16c8.8 0 16-7.2 16-16v-16c0-8.8-7.2-16-16-16z"/></svg>
<br>
<br>
Zahlung erst bei Liefertermin
</div>
</div>
<div class="card mt-1" style="background-color: #f7fcf7;">
<div class="card-header">
<h5> <svg style="width: 22px; margin-right: 5px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 496 512"><path d="M248 8C111 8 0 119 0 256s111 248 248 248 248-111 248-248S385 8 248 8zm128 421.6c-35.9 26.5-80.1 42.4-128 42.4s-92.1-15.9-128-42.4V416c0-35.3 28.7-64 64-64 11.1 0 27.5 11.4 64 11.4 36.6 0 52.8-11.4 64-11.4 35.3 0 64 28.7 64 64v13.6zm30.6-27.5c-6.8-46.4-46.3-82.1-94.6-82.1-20.5 0-30.4 11.4-64 11.4S204.6 320 184 320c-48.3 0-87.8 35.7-94.6 82.1C53.9 363.6 32 312.4 32 256c0-119.1 96.9-216 216-216s216 96.9 216 216c0 56.4-21.9 107.6-57.4 146.1zM248 120c-48.6 0-88 39.4-88 88s39.4 88 88 88 88-39.4 88-88-39.4-88-88-88zm0 144c-30.9 0-56-25.1-56-56s25.1-56 56-56 56 25.1 56 56-25.1 56-56 56z"/></svg>
Persönliche Daten</h5>
</div>
<div class="card-body">
<form>
<div class="mb-3">
<label for="" class="form-label">Anrede</label>
<select class="form-select" aria-label="Default select example">
<option selected>Herr</option>
<option value="1">Frau</option>
<option value="2">Firma</option>
<option value="3">Herr Dr.</option>
</select>
</div>
<div class="mb-3">
<label for="" class="form-label">Vorname</label>
<input type="text" class="form-control" id="" aria-describedby="" placeholder="Maximilian">
</div>
<div class="mb-3">
<label for="" class="form-label">Nachname</label>
<input type="text" class="form-control" id="" aria-describedby="" placeholder="Meyer">
</div>
<div class="mb-3">
<label for="exampleInputEmail1" class="form-label">E-Mail</label>
<input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="max.mustermann@areya.de">
</div>
<div class="mb-3">
<label for="exampleInputEmail1" class="form-label">Telefon</label>
<input type="text" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="0941467233">
</div>
<div class="mb-3">
<label for="exampleInputPassword1" class="form-label">Adresse</label>
<input type="text" class="form-control" placeholder="Neuenhammerstr. 44, 92714 Pleystein" id="exampleInputPassword1">
</div>
<div class="mb-3 form-check mb-4">
<input type="checkbox" class="form-check-input" id="exampleCheck1">
<label class="form-check-label" for="exampleCheck1">Ich habe die Datenschutzbestimmungen gelesen und akzeptiert.</label>
</div>
<div class="d-block">
<a href="" type="submit" class="btn btn-success d-block mx-auto">
Angebot anfragen
</a>
</div>
</form>
</div>
</div>
</div>
<div class="col-5">
<div class="card" style="background-color: #f7fcf7;">
<div class="card-header">
<h5><svg style="width: 25px; margin-right: 5px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path d="M564 192h-76.875L347.893 37.297c-5.91-6.568-16.027-7.101-22.596-1.189s-7.101 16.028-1.189 22.596L444.075 192h-312.15L251.893 58.703c5.912-6.567 5.379-16.685-1.189-22.596-6.569-5.912-16.686-5.38-22.596 1.189L88.875 192H12c-6.627 0-12 5.373-12 12v8c0 6.627 5.373 12 12 12h16.444L58.25 438.603C61.546 462.334 81.836 480 105.794 480h364.412c23.958 0 44.248-17.666 47.544-41.397L547.556 224H564c6.627 0 12-5.373 12-12v-8c0-6.627-5.373-12-12-12zm-77.946 242.201c-1.093 7.867-7.906 13.799-15.848 13.799H105.794c-7.942 0-14.755-5.932-15.848-13.799L60.752 224h454.497l-29.195 210.201zM304 280v112c0 8.837-7.163 16-16 16-8.836 0-16-7.163-16-16V280c0-8.837 7.164-16 16-16 8.837 0 16 7.163 16 16zm112 0v112c0 8.837-7.163 16-16 16s-16-7.163-16-16V280c0-8.837 7.163-16 16-16s16 7.163 16 16zm-224 0v112c0 8.837-7.164 16-16 16s-16-7.163-16-16V280c0-8.837 7.164-16 16-16s16 7.163 16 16z"/></svg> Warenkorb</h5>
</div>
<div class="card-body">
<table class="table table-striped">
<tbody>
<tr>
<td>
<img class="rounded img-fluid me-2" src="https://picsum.photos/25/25">Balkonkraftwerk 600
<br>
<small class="text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. </small>
</td>
<td class="align-middle text-end">18,00 €</td>
</tr>
<tr>
<td>
<img class="rounded img-fluid me-2" src="https://picsum.photos/25/25">Shelly
<br>
<small>Smarte Einspeisesteckdose</small>
</td>
<td class="align-middle text-end">18,00 €</td>
</tr>
<tr>
<td>
<img class="rounded img-fluid me-2" src="https://picsum.photos/25/25">Longi 375 Modul
<br>
<small>Smarte Einspeisesteckdose</small>
</td>
<td class="align-middle text-end">18,00 €</td>
</tr>
<tr>
<div class="input-group mb-3 input-group-sm">
<span class="input-group-text" id="basic-addon1"><svg style="width: 20px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path d="M544 224h32V112c0-26.51-21.49-48-48-48H48C21.49 64 0 85.49 0 112v112h32c17.673 0 32 14.327 32 32s-14.327 32-32 32H0v112c0 26.51 21.49 48 48 48h480c26.51 0 48-21.49 48-48V288h-32c-17.673 0-32-14.327-32-32s14.327-32 32-32zm0 96v80c0 8.823-7.177 16-16 16H48c-8.823 0-16-7.177-16-16v-80c35.29 0 64-28.71 64-64s-28.71-64-64-64v-80c0-8.823 7.177-16 16-16h480c8.823 0 16 7.177 16 16v80c-35.29 0-64 28.71-64 64s28.71 64 64 64z"/></svg></span>
<input type="text" class="form-control" placeholder="Gutscheincode" aria-label="Username" aria-describedby="basic-addon1">
</div>
</tr>
</tbody>
<tfoot>
<tr>
<th scope="col">Gesammt:</th>
<th colspan="2" class="text-end">2838,00 €
<br>
<small class="text-end fw-light">Preise inkl. 19% Umsatzsteuer</small>
</th>
</tr>
</tfoot>
</table>
<a href="" class="text-muted text-decoration-none">Weitere Produkte hinzufügen</a>
</div>
</div>
<div class="card mt-4" style="background-color: #f7fcf7;">
<div class="card-header">
<h5><svg style="width: 22px; margin-right: 5px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M256 340c-15.464 0-28 12.536-28 28s12.536 28 28 28 28-12.536 28-28-12.536-28-28-28zm7.67-24h-16c-6.627 0-12-5.373-12-12v-.381c0-70.343 77.44-63.619 77.44-107.408 0-20.016-17.761-40.211-57.44-40.211-29.144 0-44.265 9.649-59.211 28.692-3.908 4.98-11.054 5.995-16.248 2.376l-13.134-9.15c-5.625-3.919-6.86-11.771-2.645-17.177C185.658 133.514 210.842 116 255.67 116c52.32 0 97.44 29.751 97.44 80.211 0 67.414-77.44 63.849-77.44 107.408V304c0 6.627-5.373 12-12 12zM256 40c118.621 0 216 96.075 216 216 0 119.291-96.61 216-216 216-119.244 0-216-96.562-216-216 0-119.203 96.602-216 216-216m0-32C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8z"/></svg>
Wie geht es weiter?</h5>
</div>
<div class="card-body">
<ol>
<li class="mb-3">Beratungsgespräch</li>
<li class="mb-3">Persönliches Angebot</li>
<li class="mb-3">Packen & Abholtermin</li>
<li class="mb-3">Rechnung / Barzahlung</li>
<li class="mb-3">Abholung in 92648 Vohenstrauß</li>
</ol>
</div>
</div>
</div>
</div>
</div>
</div>
</div> -->