Box ein-/ausblenden

[TwoPlayer]

Guten Tag,

ich habe ein gekauftes Web-Design und wollte dort nun für das Impressum eine eigene Box hinzufügen, welche ich durch einen Klick auf Impressum erscheinen lasse, da ich nciht viel von CSS und Javascript verstehe, nutze ich die CSS-Angaben des Design und habe mir ein JQuery Script zum ein-/ausblenden besorgt, nun passiert aber nichts, wenn ich auf den Link klicke.
Darum hoffe ich jemand kann mir sagen, was ich falsch mache.

Der problematische Teil meiner Index.html

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
			<script type="text/javascript">
			$(document).ready(function(){
			/* Hier der jQuery-Code */
				$('#einausblenden').click(function(){
					$('#Impressum').toggleClass();
				})
			});
			</script>
		<div style="display:none" id="Impressum">
	    <div class="page show">
		    <div>
			    <a href="/" class="close-page">×</a>
				<div class="content">
					<div class="pages" id="about" style="display: block;">
						<div class="about">
						<h1>Impressum</h1>
						<h2>Angaben gemäß § 5 TMG:</h2>
						<p>Nikolas Schätzl<br />
							Taufkirchener Str. 22<br />
							84307 Eggenfelden
						</p>
						<h2>Kontakt:</h2>
						<table>
							<tr>
								<td>Telefon:</td>
								<td>+49-872112 89 12 40</td>
							</tr>
							<tr>
								<td>Telefax:</td>
								<td>+49-872112 89 12 49</td></tr>
							<tr>
								<td>E-Mail:</td>
								<td>admin@tzimon.net</td>
							</tr>
						</table>
						<p>*</p>
						<h1>Haftungsausschluss (Disclaimer)</h1>
						<p><strong>Haftung für Inhalte</strong></p> <p>Als Diensteanbieter sind wir gemäß § 7 Abs.1 TMG für eigene Inhalte auf diesen Seiten nach den allgemeinen Gesetzen verantwortlich. Nach §§ 8 bis 10 TMG sind wir als Diensteanbieter jedoch nicht verpflichtet, übermittelte oder gespeicherte fremde Informationen zu überwachen oder nach Umständen zu forschen, die auf eine rechtswidrige Tätigkeit hinweisen. Verpflichtungen zur Entfernung oder Sperrung der Nutzung von Informationen nach den allgemeinen Gesetzen bleiben hiervon unberührt. Eine diesbezügliche Haftung ist jedoch erst ab dem Zeitpunkt der Kenntnis einer konkreten Rechtsverletzung möglich. Bei Bekanntwerden von entsprechenden Rechtsverletzungen werden wir diese Inhalte umgehend entfernen.</p> <p><strong>Haftung für Links</strong></p> <p>Unser Angebot enthält Links zu externen Webseiten Dritter, auf deren Inhalte wir keinen Einfluss haben. Deshalb können wir für diese fremden Inhalte auch keine Gewähr übernehmen. Für die Inhalte der verlinkten Seiten ist stets der jeweilige Anbieter oder Betreiber der Seiten verantwortlich. Die verlinkten Seiten wurden zum Zeitpunkt der Verlinkung auf mögliche Rechtsverstöße überprüft. Rechtswidrige Inhalte waren zum Zeitpunkt der Verlinkung nicht erkennbar. Eine permanente inhaltliche Kontrolle der verlinkten Seiten ist jedoch ohne konkrete Anhaltspunkte einer Rechtsverletzung nicht zumutbar. Bei Bekanntwerden von Rechtsverletzungen werden wir derartige Links umgehend entfernen.</p> <p><strong>Urheberrecht</strong></p> <p>Die durch die Seitenbetreiber erstellten Inhalte und Werke auf diesen Seiten unterliegen dem deutschen Urheberrecht. Die Vervielfältigung, Bearbeitung, Verbreitung und jede Art der Verwertung außerhalb der Grenzen des Urheberrechtes bedürfen der schriftlichen Zustimmung des jeweiligen Autors bzw. Erstellers. Downloads und Kopien dieser Seite sind nur für den privaten, nicht kommerziellen Gebrauch gestattet. Soweit die Inhalte auf dieser Seite nicht vom Betreiber erstellt wurden, werden die Urheberrechte Dritter beachtet. Insbesondere werden Inhalte Dritter als solche gekennzeichnet. Sollten Sie trotzdem auf eine Urheberrechtsverletzung aufmerksam werden, bitten wir um einen entsprechenden Hinweis. Bei Bekanntwerden von Rechtsverletzungen werden wir derartige Inhalte umgehend entfernen.</p><p>*</p>
						</div>
					</div>
				</div>
			</div>
		</div>
		</div>
            <div style="text-align: center; position: absolute; bottom: 0px; width: 100%; padding: 5px 0;">
                <a href="#" id="einausblenden" style="color: #333; text-decoration: none;">Impressum</a>
            </div>
	    </div

Die main.css meines gekauften Templates:

/*
 * Main Stylesheet
 */

/* Fonts */
@import 'http://fonts.googleapis.com/css?family=Lato:100,300,400,700';
@import 'http://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css';

/* Basic required libraries */
@import 'lib/reset.css';
@import 'lib/swipebox.css';

/* Animations */
@import 'animations/circular/circular.css';
@import 'animations/scaling/scaling.css';

/* Colors */
@import '../colors/cool/cool.css';
@import '../colors/dark/dark.css';
@import '../colors/flat/flat.css';


/* Basic page Styles */
.page {
  position: absolute;
  width: 550px;
  left: 50%;
  margin-left: -275px;
  top: 50%;
  margin-top: -300px;
  max-height: 600px;
  overflow: auto;
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  -webkit-transform: scale(0.3, 0.3);
  -moz-transform: scale(0.3, 0.3);
  -o-transform: scale(0.3, 0.3);
  transform: scale(0.3, 0.3);
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.page.show {
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  -webkit-transform: scale(1, 1);
  -moz-transform: scale(1, 1);
  -o-transform: scale(1, 1);
  transform: scale(1, 1);
}

/* Page on mobile devices */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
  .page {
    width: 100%;
    height: auto;
    max-height: none;
    margin: 0;
    top: 0;
    left: 0;
    position: absolute;
  }
}

/* Close button */
.page .close-page {
  cursor: pointer;
  float: right;
  margin-right: 20px;
  margin-top: 20px;
  font-size: 2.5em;
  font-weight: 100;
  line-height: .5em;
  text-decoration: none;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.page .close-page:hover {
  font-weight: 300;
  -webkit-transform: translate3d(0, 0, 0) rotate(45deg);
  -moz-transform: translate3d(0, 0, 0) rotate(45deg);
  -o-transform: translate3d(0, 0, 0) rotate(45deg);
  transform: translate3d(0, 0, 0) rotate(45deg);
}

/* Page content area */
.page .content {
  padding: 20px;
  line-height: 2;
}

/* Page title */
.page .content h1 {
  font-size: 2em;
  font-weight: 300;
}
.page .content h1:before {
  border-bottom: 2px solid #333;
  content: '';
  position: absolute;
  padding: 25px 20px;
}

.page .content h2 {
  font-size: 1.6em;
  font-weight: 300;
}
.page .content h3 {
  font-size: 1.2em;
  font-weight: 300;
}
.page .content p {
  padding: 10px 0;
}
.page .content label {
  display: block;
}
.page .content input,
.page .content textarea {
  padding: 10px 15px;
  border: 1px solid #ccc;
  width: 100%;
  outline: none;
  font-size: 14px;
  z-index: 1;
  position: relative;
  border-radius: 6px;
  behavior: url(assets/stylesheet/lib/PIE.htc);
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-appearance: none;
  -moz-appearance: none;
  -o-appearance: none;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.page .content textarea {
  width: 100%;
  height: 100px;
  resize: none;
}
.page .content img {
  max-width: 100%;
}
.page .content .confirm {
  display: none;
}

Ich hoffe jemand kann mir helfen,
Gruß,
TwoPlayer

[Ckaos]

Hi,

toggleClass Doku

Du brauchst also ne Klasse die er "toggled".
Am besten du erstellst eine z.B.

.showHide {display:none;}

Dann etwa so

$('#Impressum').toggleClass("showHide");

ungetestet!

MfG

CKaos