+
AGS IT Solutions
-
+
Ginsterweg 5, 26605 Aurich
@@ -40,12 +43,10 @@ export default function Home() {
title="Google Maps"
width="100%"
height="100%"
- id="gmap_canvas"
- src="https://maps.google.com/maps?q=Ginsterweg%205,%2026605%20Aurich&t=&z=14&ie=UTF8&iwloc=&output=embed"
- frameBorder={0}
- scrolling="no"
- marginHeight={0}
- marginWidth={0}
+ loading="lazy"
+ allowFullScreen
+ style={{ border: "none" }}
+ src="https://www.google.com/maps/embed/v1/place?q=place_id:ChIJRZO72VVDtkcRVMv3jSCSOag&key=AIzaSyAmGPvuzpg0nC-oBlAf3-3uJED1lLihDz4"
>
diff --git a/styles/Kontakt.module.css b/styles/Kontakt.module.css
index 54bd2ca..927edcb 100644
--- a/styles/Kontakt.module.css
+++ b/styles/Kontakt.module.css
@@ -1 +1,160 @@
-.SocialMediaContainer{width:80%;height:100%;display:flex;justify-content:space-around;align-items:center;flex-wrap:wrap}.SocialMediaContainer div a>span{transition:all .5s}.SocialMediaContainer div a :hover{transform:scale(1.05)}.TwoColumnLayout{display:flex;flex-direction:row;justify-content:space-around;align-items:center;flex-wrap:wrap;width:90vw;height:100%;padding:0;margin:0}.TwoColumnLayout .columnChild{height:40vh;width:40vw;min-width:600px;margin:1rem;display:flex;align-items:center;justify-content:center;flex-direction:row;box-shadow:rgba(0,0,0,.24) 0px 3px 15px;border-radius:.5rem}.mapouter{position:relative;text-align:right;height:100%;width:60%;border-radius:0 .5rem .5rem 0}.gmap_canvas{overflow:hidden;background:none !important;height:100%;width:100%;border-radius:0 .5rem .5rem 0}.contactInfo{width:40%;height:100%;display:flex;justify-content:center;align-items:center;flex-direction:column}.contactInfo p{transition:all .25s ease-in-out}.contactInfo p:hover{transform:scale(1.05)}@media(max-width: 768px){.TwoColumnLayout{flex-direction:column}.TwoColumnLayout .columnChild{width:90vw;height:40vh;min-width:0}.TwoColumnLayout .columnChild .mapouter{display:none}.contactInfo{width:100%}.SocialMediaContainer{justify-content:center}.SocialMediaContainer div{flex-basis:50%;text-align:center}}
\ No newline at end of file
+.SocialMediaContainer {
+ width: 80%;
+ height: 100%;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-pack: distribute;
+ justify-content: space-around;
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
+}
+
+.SocialMediaContainer div a > span {
+ -webkit-transition: all 0.5s;
+ transition: all 0.5s;
+}
+
+.SocialMediaContainer div a :hover {
+ -webkit-transform: scale(1.05);
+ transform: scale(1.05);
+}
+
+.TwoColumnLayout {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-orient: horizontal;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: row;
+ flex-direction: row;
+ -ms-flex-pack: distribute;
+ justify-content: space-around;
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
+ width: 90vw;
+ height: 100%;
+ padding: 0;
+ margin: 0;
+}
+
+.TwoColumnLayout .columnChild {
+ height: 40vh;
+ width: 40vw;
+ min-width: 600px;
+ margin: 1rem;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ -webkit-box-orient: horizontal;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: row;
+ flex-direction: row;
+ -webkit-box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 15px;
+ box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 15px;
+ border-radius: 0.5rem;
+}
+
+.mapouter {
+ position: relative;
+ text-align: right;
+ height: 100%;
+ width: 60%;
+ border-radius: 0 0.5rem 0.5rem 0;
+}
+
+.gmap_canvas {
+ overflow: hidden;
+ background: none !important;
+ height: 100%;
+ width: 100%;
+ border-radius: 0 0.5rem 0.5rem 0;
+ border: none;
+}
+
+.contactInfo {
+ width: 40%;
+ height: 100%;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ -webkit-box-orient: vertical;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: column;
+ flex-direction: column;
+}
+
+.contactInfo p {
+ -webkit-transition: all 0.25s ease-in-out;
+ transition: all 0.25s ease-in-out;
+}
+
+.contactInfo p:hover {
+ -webkit-transform: scale(1.05);
+ transform: scale(1.05);
+}
+
+.infoContainer {
+ -webkit-box-orient: horizontal;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: row;
+ flex-direction: row;
+}
+
+@media (max-width: 768px) {
+ .TwoColumnLayout {
+ -webkit-box-orient: vertical;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ width: 95vw;
+ }
+ .TwoColumnLayout .columnChild {
+ width: 90vw;
+ height: 40vh;
+ min-width: 0;
+ }
+ .TwoColumnLayout .columnChild .mapouter {
+ height: 100%;
+ width: 100%;
+ }
+ .TwoColumnLayout .infoContainer {
+ -webkit-box-orient: vertical;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ height: 55vh;
+ }
+ .contactInfo {
+ width: 100%;
+ }
+ .SocialMediaContainer {
+ -webkit-box-pack: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+ }
+ .SocialMediaContainer div {
+ -ms-flex-preferred-size: 50%;
+ flex-basis: 50%;
+ text-align: center;
+ }
+}
+/*# sourceMappingURL=Kontakt.module.css.map */
\ No newline at end of file
diff --git a/styles/Kontakt.module.css.map b/styles/Kontakt.module.css.map
new file mode 100644
index 0000000..542c77b
--- /dev/null
+++ b/styles/Kontakt.module.css.map
@@ -0,0 +1,9 @@
+{
+ "version": 3,
+ "mappings": "AAAA,AAAA,qBAAqB,CAAC;EACrB,KAAK,EAAE,GAAG;EACV,MAAM,EAAE,IAAI;EACZ,OAAO,EAAE,IAAI;EACb,eAAe,EAAE,YAAY;EAC7B,WAAW,EAAE,MAAM;EACnB,SAAS,EAAE,IAAI;CAYf;;AAlBD,AAUG,qBAVkB,CAQpB,GAAG,CACF,CAAC,GACE,IAAI,CAAC;EACN,UAAU,EAAE,QAAQ;CACpB;;AAZJ,AAaG,qBAbkB,CAQpB,GAAG,CACF,CAAC,CAIA,MAAM,CAAC;EACN,SAAS,EAAE,WAAW;CACtB;;AAKJ,AAAA,gBAAgB,CAAC;EAChB,OAAO,EAAE,IAAI;EACb,cAAc,EAAE,GAAG;EACnB,eAAe,EAAE,YAAY;EAC7B,WAAW,EAAE,MAAM;EACnB,SAAS,EAAE,IAAI;EACf,KAAK,EAAE,IAAI;EACX,MAAM,EAAE,IAAI;EACZ,OAAO,EAAE,CAAC;EACV,MAAM,EAAE,CAAC;CAaT;;AAtBD,AAUC,gBAVe,CAUf,YAAY,CAAC;EACZ,MAAM,EAAE,IAAI;EACZ,KAAK,EAAE,IAAI;EACX,SAAS,EAAE,KAAK;EAChB,MAAM,EAAE,IAAI;EACZ,OAAO,EAAE,IAAI;EACb,WAAW,EAAE,MAAM;EACnB,eAAe,EAAE,MAAM;EACvB,cAAc,EAAE,GAAG;EACnB,UAAU,EAAE,mBAAmB,CAAC,GAAG,CAAC,GAAG,CAAC,IAAI;EAC5C,aAAa,EAAE,MAAM;CACrB;;AAGF,AAAA,SAAS,CAAC;EACT,QAAQ,EAAE,QAAQ;EAClB,UAAU,EAAE,KAAK;EACjB,MAAM,EAAE,IAAI;EACZ,KAAK,EAAE,GAAG;EACV,aAAa,EAAE,iBAAiB;CAChC;;AAED,AAAA,YAAY,CAAC;EACZ,QAAQ,EAAE,MAAM;EAChB,UAAU,EAAE,eAAe;EAC3B,MAAM,EAAE,IAAI;EACZ,KAAK,EAAE,IAAI;EACX,aAAa,EAAE,iBAAiB;EAChC,MAAM,EAAE,IAAI;CACZ;;AAED,AAAA,YAAY,CAAC;EACZ,KAAK,EAAE,GAAG;EACV,MAAM,EAAE,IAAI;EACZ,OAAO,EAAE,IAAI;EACb,eAAe,EAAE,MAAM;EACvB,WAAW,EAAE,MAAM;EACnB,cAAc,EAAE,MAAM;CAOtB;;AAbD,AAOC,YAPW,CAOX,CAAC,CAAC;EACD,UAAU,EAAE,qBAAqB;CAIjC;;AAZF,AASE,YATU,CAOX,CAAC,AAEC,MAAM,CAAC;EACP,SAAS,EAAE,WAAW;CACtB;;AAIH,AAAA,cAAc,CAAC;EACd,cAAc,EAAE,GAAG;CACnB;;AAED,MAAM,EAAE,SAAS,EAAE,KAAK;EACvB,AAAA,gBAAgB,CAAC;IAChB,cAAc,EAAE,MAAM;IACtB,KAAK,EAAE,IAAI;GAeX;EAjBD,AAGC,gBAHe,CAGf,YAAY,CAAC;IACZ,KAAK,EAAE,IAAI;IACX,MAAM,EAAE,IAAI;IACZ,SAAS,EAAE,CAAC;GAMZ;EAZF,AAOE,gBAPc,CAGf,YAAY,CAIX,SAAS,CAAC;IAET,MAAM,EAAE,IAAI;IACZ,KAAK,EAAE,IAAI;GACX;EAXH,AAaC,gBAbe,CAaf,cAAc,CAAC;IACd,cAAc,EAAE,MAAM;IACtB,MAAM,EAAE,IAAI;GACZ;EAEF,AAAA,YAAY,CAAC;IACZ,KAAK,EAAE,IAAI;GACX;EACD,AAAA,qBAAqB,CAAC;IACrB,eAAe,EAAE,MAAM;GAKvB;EAND,AAEC,qBAFoB,CAEpB,GAAG,CAAC;IACH,UAAU,EAAE,GAAG;IACf,UAAU,EAAE,MAAM;GAClB",
+ "sources": [
+ "Kontakt.module.scss"
+ ],
+ "names": [],
+ "file": "Kontakt.module.css"
+}
\ No newline at end of file
diff --git a/styles/Kontakt.module.scss b/styles/Kontakt.module.scss
index a94bca3..9659cb9 100644
--- a/styles/Kontakt.module.scss
+++ b/styles/Kontakt.module.scss
@@ -56,6 +56,7 @@
height: 100%;
width: 100%;
border-radius: 0 0.5rem 0.5rem 0;
+ border: none;
}
.contactInfo {
@@ -73,17 +74,28 @@
}
}
+.infoContainer {
+ flex-direction: row;
+}
+
@media (max-width: 768px) {
.TwoColumnLayout {
flex-direction: column;
+ width: 95vw;
.columnChild {
width: 90vw;
height: 40vh;
min-width: 0;
.mapouter {
- display: none;
+ // display: none;
+ height: 100%;
+ width: 100%;
}
}
+ .infoContainer {
+ flex-direction: column;
+ height: 55vh;
+ }
}
.contactInfo {
width: 100%;