<!DOCTYPE html>
<html lang="en">
<head>
<title>Squaremagie source code html & css of photocollection</title>
<meta name="keywords" content="squaremagie source code html & css.
photocollection, sportmagie,
modern quantum mechanics" />
<meta name="description" content="html & css code. photocollection, sportmagie, modern quantum mechanics introduction" />
<meta http-equiv="author" content="mikael hermansson" />
<meta name="viewport" content="width=device-width,
initial-scale=1" />
<meta charset="utf-8" />
</head>
<style type="text/css">
body{
font-family: Arial, Helvetica, sans-serif;
background: linear-gradient(rgba(0, 0, 0, 0.164), rgba(0, 0, 0, 0.164)), url("images/mh.jpg");
background-repeat: no-repeat;
background-size: 100% 100%;
margin: 0;
}
/* coding menu dropdown with micke */
/* Style The Dropdown Button */
.dropbtn {
font-family: 'montserrat', sans-serif;
background-color: blueviolet;
color: white;
padding: 9px 17px;
font-size: 16px;
border: none;
cursor: pointer;
margin-top: 5px;
}
/* The container <div> - needed
to position the dropdown content */
.dropdown {
position: relative;
display: inline-block;
}
/* Dropdown Content (Hidden by
Default) */
.dropdown-content {
display: none;
position: absolute;
background-color: #f9f9f9;
min-width: 128px;
box-shadow: 0px 8px 10px 0px rgba(0,0,0,0.2);
padding: 5px 10px;
border: none;
text-align: left;
font-size: 14px;
z-index: 1;
}
/* Links inside the dropdown */
.dropdown-content a {
color: black;
padding: 10px 14px;
text-decoration: none;
display: block;
}
/* Change color of dropdown links on
hover */
.dropdown-content a:hover {background-color: #eee}
.dropdown-content a:hover {color: red}
/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
display: block;
}
/* Change the background color of the
dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {
background-color: greenyellow;
color: black;
}
/* coding menu dropdown with micke */
/* coding layout with micke */
body {
display: grid;
grid-template-areas:
"header header
header"
"nav article ads"
"footer footer
footer";
grid-template-rows: 5% 1fr 5%;
grid-template-columns: 0% 1fr 0%;
grid-gap: 0px; /* --pixel will give space between layout section-- */
height: 100vh;
margin: 0;
}
/* Stack the layout on small
devices/viewports. */
@media all and (max-width: 575px) {
body {
grid-template-areas:
"header"
"article"
"ads"
"nav"
"footer";
grid-template-rows: 70px 1fr 70px 1fr 70px;
grid-template-columns: 1fr;
}
}
#pageHeader {
grid-area: header;
}
#pageFooter {
grid-area: footer;
}
#mainArticle {
grid-area: article;
}
#mainNav {
grid-area: nav;
}
#siteAds {
grid-area: ads;
}
header, div {
background: none;
font-size: 17px;
font-family: 'montserrat', sans-serif;
color: white;
padding: 15px 0px;
text-align: center;
}
article, div {
padding: 0px 0px;
background: none;
font-size: 17px;
font-family: 'montserrat', sans-serif;
color: black;
text-align: center;
margin-top: 0px;
}
nav, div {
padding: 0px 0px;
background: none;
font-size: 16px;
text-align: center;
margin-top: 0px;
}
ads, div {
padding: 0px 0px;
background: none;
font-size: 0px;
color: black;
text-align: center;
margin-top: 0px;
}
footer div {
padding: 0px 0px;
background: none;
font-size: 15px;
margin-top: 0px;
}
/* coding layout with micke */
/* coding gallery and text section
with micke */
.firstsection{
background-color: none;
height: 42%; /* coding the top margin of center column first section
article div */
}
.firsthalf{
width: 100%;
display: flex;
flex-direction: column;
justify-content: center;
}
.secondsection{
background-color: none;
height: 8%; /* coding the top margin of center column second section
article div */
}
.secondhalf{
width: 100%;
display: flex;
flex-direction: column;
justify-content: center;
}
.thirdsection{
background-color: none;
height: 26%; /* coding the top margin of button therd
section article div */
}
.thirdhalf{
width: 100%;
display: flex;
flex-direction: column;
justify-content: center;
}
.box-main{
display: flex;
justify-content: center;
align-items: center;
color: black;
font-size: 16px;
max-width: 80%;
margin: auto;
height: 100%;
margin-top: 0%;
}
/* coding gallery and text section
with micke */
/* coding button with micke */
.btn {
background-color: rgba(255,255,255, 0.25);
color: white;
font-family: 'montserrat', sans-serif ;
border: none;
position: autofixed;
font-size: 0px;
font-weight: bold;
text-transform: uppercase;
line-height: 5px;
height: 134px;
width: auto;
margin-top: 5px;
border: 3px solid white;
cursor: pointer;
}
.btn:hover{
background-color: white;
color: black;
}
.button {
background-color: rgba(255,255,255, 0.0);
font-family: 'montserrat', sans-serif ;
border: 0px solid none;
color: white;
padding: 0px 0px;
text-align: center;
text-decoration: none;
display: inline-table;
line-height: 0px;
width: auto;
font-weight: none;
font-size: 15px;
margin: 0px 0px;
cursor: pointer;
margin-top: 25%;
justify-content: center;
align-items: center;
border-style: none;
}
.button:hover{
background-color: none;
color: red;
}
p.button_1 {
background-color: none;
color: none;
padding: 1px, 1px;
text-align: left;
text-decoration: none;
display: inline-block;
font-size: 0px;
margin-top: 0px;
height: 110px;
width: 165px;
border: 4px;
border-style: outset;
}
p.button_1:hover {
background-color: white;
color: black;
}
p.button_2 {
background-color: none;
font-family: 'montserrat', sans-serif;
color: lightskyblue;
padding: 0px, 0px;
text-align: left;
text-decoration: none;
margin-top: 0%;
display: inline-block;
font-size: 15px;
width: 1265px;
height: 224px;
border-style: inset;
}
p.button_2:hover {
background-color: white;
color: black;
}
/* coding button with micke */
/* coding text with micke */
.text{
width: 100%;
margin-top: 0%;
text-transform: uppercase;
color: white;
}
.text h1{
font-size: 36px;
font-family: 'montserrat', sans-serif;
font-weight: 700px;
margin: 9px 0px;
text-align: center;
}
.text h2{
font-size: 18px;
font-family: 'montserrat', sans-serif;
font-weight: 500px;
}
h1{
text-align: left;
}
h2{
text-align: left;
margin: 0px 0px;
}
.text-medium{
font-family: 'piazzolla', serif;
font-weight: bold;
font-size: 18px;
color: greenyellow;
margin-top: 1%;
}
.text-small{
font-size: 12px;
}
p{
text-align: center;
}
/* coding text with micke */
/* coding gallery with micke */
div.gallery {
margin: 4px 5px;
border: 1px solid none;
float: left;
height: 160px;
width: auto;
}
div.gallery:hover {
border: 1px solid none;
padding: 0px 0px;
width: auto;
}
div.desc {
padding: 5px;
font-size: 12px;
color: white;
text-align: center;
}
/* coding gallery with micke */
/* coding table with micke */
table {
border-collapse: collapse;
width: auto;
margin-top: 10%; /* coding the top margin
of center column article div */
}
th, td {
font-family: 'montserrat', sans-serif;
border: 1px solid none; /* --color will give
border line on table section - here none color-- */
padding: 0px 0px;
height: auto;
width: auto;
font-size: 0px;
text-align: center;
}
/* coding table with micke */
/* coding dropdown in header with micke */
.leftmenu {
width: 13%;
float: left;
margin-top: 1%;
}
.rightmenu {
width: 13%;
float: right;
margin-top: 1%;
}
/* coding dropdown in header with micke */
/* coding footer with micke */
:root {
box-sizing: border-box;
margin: 0px;
padding: 0px;
font-family: sans-serif;
}
body {
height: 100vh;
overflow: hidden;
}
.footer {
position: absolute;
bottom: 0;
left: 0;
right: 0;
padding: 1rem;
background: none;
color: purple;
font-weight: 500;
display: flex;
justify-content: center;
align-items: center;
margin-top: 0;
gap: 0.2rem;
}
/* coding footer with micke */
/* coding JS footer with micke */
let year = document.querySelector("#year");
$(document).ready(function () {
year.innerText = new Date().getFullYear();
});
/* coding JS footer with micke */
/* coding text scroll with micke */
.scroll {
border: 1px;
padding: 1px
width: auto;
height: 224px;
overflow-x: hidden;
overflow-y: auto;
text-align: left;
}
/* coding text scroll with micke */
</style>
<body>
<!-- /* ---------New Layout Section1---------- */ -->
<header id="pageHeader">Squaremagie Photocollection 1
<div class="leftmenu">
<div class="dropdown">
<button class="dropbtn">Welcome Home</button>
<div class="dropdown-content">
<a href="index.html">Home</a>
<a href="special1.html">Special 1</a>
<a href="special2.html">Special 2</a>
<a href="special3.html">Special 3</a>
<a href="special4.html">Special 4</a>
<a href="special5.html">Special 5</a>
<a href="special6.html">Special 6</a>
</div></div>
</div>
<div class="rightmenu">
<div class="dropdown">
<button class="dropbtn">Welcome Home</button>
<div class="dropdown-content">
<a href="index.html">Home</a>
<a href="special1.html">Special 1</a>
<a href="special2.html">Special 2</a>
<a href="special3.html">Special 3</a>
<a href="special4.html">Special 4</a>
<a href="special5.html">Special 5</a>
<a href="special6.html">Special 6</a>
</div></div>
</div>
</header>
<!-- /* ---------New Layout Section1---------- */ -->
<!-- /* ---------New Layout Section2---------- */ -->
<article id="mainArticle">
<section class="firstsection">
<div class="box-main">
<div class="firstHalf">
<table>
<tr>
<td>
<div class="gallery">
<abbr title="Click on photo,
new style about 100%."><button class="btn"><p class=button_1>
<a href="images/photo.jpg" style="max-width:100%" alt="name photo" target="_blank">
<img src="images/photo.jpg" width="165" height="110" alt="name photo"></a>
</p></button></abbr>
<div class="desc">name photo</div>
</div>
</td>
<td>
<div class="gallery">
<abbr title="Click on photo,
new style about 100%."><button class="btn"><p class=button_1>
<a href="images/photo.jpg" style="max-width:100%" alt="name photo" target="_blank">
<img src="images/photo.jpg" width="165" height="110" alt="name photo"></a>
</p></button></abbr>
<div class="desc">name photo</div>
</div>
</td>
<td>
<div class="gallery">
<abbr title="Click on photo,
new style about 100%."><button class="btn"><p class=button_1>
<a href="images/photo.jpg" style="max-width:100%" alt="name photo" target="_blank">
<img src="images/photo.jpg" width="165" height="110" alt="name photo"></a>
</p></button></abbr>
<div class="desc">name photo</div>
</div>
</td>
<td>
<div class="gallery">
<abbr title="Click on photo,
new style about 100%."><button class="btn"><p class=button_1>
<a href="images/photo.jpg" style="max-width:100%" alt="name photo" target="_blank">
<img src="images/photo.jpg" width="165" height="110" alt="name photo"></a>
</p></button></abbr>
<div class="desc">name photo</div>
</div>
</td>
<td>
<div class="gallery">
<abbr title="Click on photo,
new style about 100%."><button class="btn"><p class=button_1>
<a href="images/photo.jpg" style="max-width:100%" alt="name photo" target="_blank">
<img src="images/photo.jpg" width="165" height="110" alt="name photo"></a>
</p></button></abbr>
<div class="desc">name photo</div>
</div>
</td>
<td>
<div class="gallery">
<abbr title="Click on photo,
new style about 100%."><button class="btn"><p class=button_1>
<a href="images/photo.jpg" style="max-width:100%" alt="name photo" target="_blank">
<img src="images/photo.jpg" width="165" height="110" alt="name photo"></a>
</p></button></abbr>
<div class="desc">name photo</div>
</div>
</td>
<td>
<div class="gallery">
<abbr title="Click on photo,
new style about 100%."><button class="btn"><p class=button_1>
<a href="images/photo.jpg" style="max-width:100%" alt="name photo" target="_blank">
<img src="images/photo.jpg" width="165" height="110" alt="name photo"></a>
</p></button></abbr>
<div class="desc">name photo</div>
</div>
</td>
</tr>
<tr>
<td>
<div class="gallery">
<abbr title="Click on photo,
new style about 100%."><button class="btn"><p class=button_1>
<a href="images/photo.jpg" style="max-width:100%" alt="name photo" target="_blank">
<img src="images/photo.jpg" width="165" height="110" alt="name photo"></a>
</p></button></abbr>
<div class="desc">name photo</div>
</div>
</td>
<td>
<div class="gallery">
<abbr title="Click on photo,
new style about 100%."><button class="btn"><p class=button_1>
<a href="images/photo.jpg" style="max-width:100%" alt="name photo" target="_blank">
<img src="images/photo.jpg" width="165" height="110" alt="name photo"></a>
</p></button></abbr>
<div class="desc">name photo</div>
</div>
</td>
<td>
<div class="gallery">
<abbr title="Click on photo,
new style about 100%."><button class="btn"><p class=button_1>
<a href="images/photo.jpg" style="max-width:100%" alt="name photo" target="_blank">
<img src="images/photo.jpg" width="165" height="110" alt="name photo"></a>
</p></button></abbr>
<div class="desc">name photo</div>
</div>
</td>
<td>
<div class="gallery">
<abbr title="Click on photo,
new style about 100%."><button class="btn"><p class=button_1>
<a href="images/photo.jpg" style="max-width:100%" alt="name photo" target="_blank">
<img src="images/photo.jpg" width="165" height="110" alt="name photo"></a>
</p></button></abbr>
<div class="desc">name photo</div>
</div>
</td>
<td>
<div class="gallery">
<abbr title="Click on photo,
new style about 100%."><button class="btn"><p class=button_1>
<a href="images/photo.jpg" style="max-width:100%" alt="name photo" target="_blank">
<img src="images/photo.jpg" width="165" height="110" alt="name photo"></a>
</p></button></abbr>
<div class="desc">name photo</div>
</div>
</td>
<td>
<div class="gallery">
<abbr title="Click on photo,
new style about 100%."><button class="btn"><p class=button_1>
<a href="images/photo.jpg" style="max-width:100%" alt="name photo" target="_blank">
<img src="images/photo.jpg" width="165" height="110" alt="name photo"></a>
</p></button></abbr>
<div class="desc">name photo</div>
</div>
</td>
<td>
<div class="gallery">
<abbr title="Click on photo,
new style about 100%."><button class="btn"><p class=button_1>
<a href="images/photo.jpg" style="max-width:100%" alt="name photo" target="_blank">
<img src="images/photo.jpg" width="165" height="110" alt="name photo"></a>
</p></button></abbr>
<div class="desc">name photo</div>
</div>
</td>
</tr>
<tr>
<td>
<div class="gallery">
<abbr title="Click on photo,
new style about 100%."><button class="btn"><p class=button_1>
<a href="images/photo.jpg" style="max-width:100%" alt="name photo" target="_blank">
<img src="images/photo.jpg" width="165" height="110" alt="name photo"></a>
</p></button></abbr>
<div class="desc">name photo</div>
</div>
</td>
<td>
<div class="gallery">
<abbr title="Click on photo,
new style about 100%."><button class="btn"><p class=button_1>
<a href="images/photo.jpg" style="max-width:100%" alt="name photo" target="_blank">
<img src="images/photo.jpg" width="165" height="110" alt="name photo"></a>
</p></button></abbr>
<div class="desc">name photo</div>
</div>
</td>
<td>
<div class="gallery">
<abbr title="Click on photo,
new style about 100%."><button class="btn"><p class=button_1>
<a href="images/photo.jpg" style="max-width:100%" alt="name photo" target="_blank">
<img src="images/photo.jpg" width="165" height="110" alt="name photo"></a>
</p></button></abbr>
<div class="desc">name photo</div>
</div>
</td>
<td>
<div class="gallery">
<abbr title="Click on photo,
new style about 100%."><button class="btn"><p class=button_1>
<a href="images/photo.jpg" style="max-width:100%" alt="name photo" target="_blank">
<img src="images/photo.jpg" width="165" height="110" alt="name photo"></a>
</p></button></abbr>
<div class="desc">name photo</div>
</div>
</td>
<td>
<div class="gallery">
<abbr title="Click on photo,
new style about 100%."><button class="btn"><p class=button_1>
<a href="images/photo.jpg" style="max-width:100%" alt="name photo" target="_blank">
<img src="images/photo.jpg" width="165" height="110" alt="name photo"></a>
</p></button></abbr>
<div class="desc">name photo</div>
</div>
</td>
<td>
<div class="gallery">
<abbr title="Click on photo,
new style about 100%."><button class="btn"><p class=button_1>
<a href="images/photo.jpg" style="max-width:100%" alt="name photo" target="_blank">
<img src="images/photo.jpg" width="165" height="110" alt="name photo"></a>
</p></button></abbr>
<div class="desc">name photo</div>
</div>
</td>
<td>
<div class="gallery">
<abbr title="Click on photo,
new style about 100%."><button class="btn"><p class=button_1>
<a href="images/photo.jpg" style="max-width:100%" alt="name photo" target="_blank">
<img src="images/photo.jpg" width="165" height="110" alt="name photo"></a>
</p></button></abbr>
<div class="desc">name photo</div>
</div>
</td>
</tr>
</table>
</div>
</div>
</section>
<section class="thirdsection">
<div class="box-main">
<div class="thirdHalf">
<table>
<tr>
<td>
<abbr title="Mickes Download
3"><a href="../../Download/driveorder3.html" class="button">Mikael Hermansson</a></abbr>
</td>
</tr>
</table>
</div>
</div>
</section>
<section class="secondsection">
<div class="box-main">
<div class="secondHalf">
<h2 class="text-medium" id="program">The speed of light</h2>
<div class="scroll"><p class="button_2">
<B>Modern Quantum Mechanics</B> are written in one way to find the speed of light
corresponding what the light speed is in nature. This know how is important for
the future of nature science, hightech development
and human nature resource. Through this work of investigation I can confirm
that there are no photons going up in the S-orbital in <ins>Hydrogen</ins> and that there exists
one another speed of light on Hydrogen atoms surface, then whatīs known today.
Self I hope through this paper to become a doctor in medicine and/or medical
physiology. Max Planck (1858-1947). M. Planck received 1919 the Noble Prize in
Physics for year 1918 <cite>"in recognition of the service he rendered to the
advancement of physics by his descovery of the enery quanta"</cite> [13]. He also proposed that light energy travels in
discrete packed called quanta. Before M. Planck`s work with blackbody
radiation, light energy was from classical ideas throught
to be continuous, but this left many nature phenomena unexplained. While
working out the mathematic to the blackbody radiation he discovered the energy
quantum <cite>h</cite> (wirkungquantum)
in the year 1900. These where later verified by other scientist and it where
the basis of an entirely new field of modern physics, known as Quantum
Mechanics, which could explain the atomic structure of matter in all atoms and
molecules. The constant <cite>h</cite> takes the energy pro Js of one
revolution or frequency Hz, and itīs the smallest unbreakable energy of light
quanta. M. Planckīs conclusion gives us the quantum hypothesis, which stated a
discontinuities and precision with the all nature
processes. This conclusion has developed through Nils Bohr (1885-1962) modern
quantum theory, which includes also the old classical mechanics and old
principles of electrodynamics. M. Planck was honorary member of the science
academy (1922). Today Max Planck honors the institute of Modern Physics in
Berlin. The speed of light and the behavior of the electron is the central
dogma in atomic theory and the description of nature. This essay will take up
modern theoretical studies of the Hydrogen atom through this understand the
difference when the electron has relativistic action at first orbital and when
itīs on rest or donīt do any work at Hydrogen surface. The design and
development of photonspeed at Hydrogen surface is the
only true lightspeed for hightech and the scientific.
Download Modern Quantum Mechanics, Hydrogen 2024.</p>
</div>
</div>
</div>
</section>
</article>
<nav id="mainNav"></nav>
<!-- /* ---------New Layout Section2---------- */ -->
<!-- /* ---------New Layout Section3---------- */ -->
<footer id="pageFooter">
<div class="footer">©<span id="year">2025</span><span> Squaremagie
Space. All rights reserved.</span></div>
</footer>
<!-- /* ---------New Layout Section3---------- */ -->
</body>
</html>