body {
font-family : Arial, Helvetica, "Times New Roman", "Courier New",
Verdana, sans-serif;font-style : normal;margin : 0;padding : 0;line-height : 1.5;
width :100%;font-weight : 500;}

body {color : white;background-color : red;background-image : linear-gradient(to bottom right, #408ec6, #7a2048, #1e2761);}

* {box-sizing: border-box;} 






 h2{line-height: 1.5; font-size: 1.1em}
  p{line-height: 1.5; font-size: 0.9em}
  h1 {font-size : 1.3em;}

header {background-image : url(header1.jpg);background-repeat : no-repeat;
background-size :100% 100%;color : white;font-size : 1.5em;text-align : center;
margin-bottom : 0; padding-bottom : 3em;}

@media screen and (max-width: 600px) {
header {width : 100%;font-size: 100%;display : block;margin-bottom : 20px;
margin : 0 0.5em;}}



#header {
background-image : url(header.jpg);
background-repeat : no-repeat;
background-size : 100% 100%;
color : white;
font-size : 1.5em;
text-align : center;
margin-bottom : 0;
padding-bottom : 3em;
}

#header p, .header p {
padding-bottom : 3em;
}



@media screen and (max-width: 600px) {
#header {
font-size: 100%;
}
}

@media screen and (max-width: 600px) {
#header p {
padding-bottom : 2em;
}
}

header { position:relative; background-color: black;
min-height: 400px;width: 100%;overflow: hidden;}


/*Footer*/
.column {float: left;width: 25%;padding: 0 10px;}
.row {margin: 0 -5px;}
.row:after {content: "";display: table;clear: both;}
footer .card4 {box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);padding: 0.5em;font-size:0.9em; background-color: darkblue;}
footer .card4 ul li a{padding-left: 0; color:white; font-size:0.9em; }
footer .card4 li {list-style: none; font-size:0.9em;}
footer {padding: 2em;color: white;background-color: darkblue;}
footer .card4 h2 {font-size: 1.2em;padding: 1em; text-align: center;}

@media screen and (max-width: 600px) {.column {width: 100%;display: block; margin-bottom: 20px;}}
/*Footer ende*/




/*card Profil 4 Ankauf datenschutz index*/
.card {padding : 1em; height : auto; width : auto; text-align : left;
margin-bottom : 1.5em; background-color : black;}
.card img {display: block; margin-left: auto; margin-right: auto;max-width : 80%;padding : 1.5em 0;}
.card h2 {text-align : center;padding-bottom : 1em;font-size: 1.1em;}
.card p {text-align : left;font-size: 1em;color : white;font-size : 0.9em;}
.card ul li {text-align : left;font-size : 1em;color : white;padding-top : 1em;font-size : 0.9em;}
@media screen and (max-width: 600px) {
  .card { width: 100%; display: block; margin-bottom: 20px; }}
@media screen and (max-width: 800px) {.card p {font-size: 100%;}}
.card1 {padding : 1em; height : auto; width : 25em; text-align : left;
margin-bottom : 1.5em;background-color : black;}
.card5 {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
padding : 1em; height : auto; width : 30em;
margin-left :auto; margin-right: auto;
  text-align:left;
  font-family: arial;
  font-size : 0.9em; 
background:rgb(66, 33, 142, 1)color: white; margin-top: 2em;}
.card6 {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
padding : 1em; height : auto; width : 60em;
margin-left :auto; margin-right: auto;
  text-align:left;
  font-family: arial;
  font-size : 0.9em; 
background:rgb(66, 33, 142, 1)color: white; margin-top: 2em;}
@media screen and (max-width: 800px) {
	.card6 {width: 100%;margin-left:0.5em;}}
/* Responsive columns krypto kosten*/
@media screen and (max-width: 600px) {
  .card h2{font-size: 100%;}}
.title  {font-size:0.9em;}

  
/*card Ende*/

/*flex-container profil kryptocankauf datenschutz Index */
.flex-container {display : flex;justify-content : center;}


@media (max-width: 600px) {
  .flex-container {flex-direction: column; padding: 0em 2em;
  }
}
@media (max-width: 600px) { .flex-container {flex-direction: column;width : 100%; }
}







  
  
  
.col-75 {float: left;width: 50%;margin-top: 6px;
color:white}



#container {padding: 2em 0em 2em 3em;margin-bottom: 5em;
 margin-left: 5em;margin-right: 5em;}
section .container {color : black;padding : 2em 0em;}
#container p {color : white;padding: 0em;text-align: left;}
#container h2 {text-align : center; padding : 1em 0em;color : white;}
#container img {float:right; width: 450px;}
@media (max-width: 600px) {#container {padding:0.5em; margin: 0;}}
@media (max-width: 600px) {#container h2  {font-size:100%;}}
@media (max-width: 600px) {#container p {font-size:100%;padding-left: 0.5em;padding-right: 0.5em;}}


#container img {
  width: 100%;
  max-width: 400px;
  height: auto; padding-left:0.5em;
}











.logo {padding-top : 2em;display : block;margin-right : auto;margin-left : auto;}

img {
display : block;
height : auto;
max-width : 80%;
padding : 1.5em 0;
}

.topleft {
  position: absolute;
  top: 8px;
  left: 16px;
  font-size: 18px;
}






@media only screen and (max-width: 1000px) {
header .container{width:100%; font-size:100%;margin:0 0.5em;}

@media screen and (max-width: 600px) {
header {width : 100%;font-size: 100%;display : block;
margin : 0 0.5em;}}

.logo { display: block; margin-left: auto; margin-right: auto;}


/*container profil container ankauf Verk 3 Index*/
.container {color : black;padding : 1em 3em;width:auto;margin-left:}
.container img {float:right;padding : 1em;}
.container p {color : white;padding: 0em;text-align: left;}
.container h2 {text-align : center; padding : 1em 0em;color : white;}
.container1 {font-size : 1.2em;color : black;}


@media (max-width: 600px) {.container {padding:0.5em;}}
@media (max-width: 600px) {.container h2  {font-size:100%;}}
@media (max-width: 600px) {.container p {font-size:100%;padding-left: 0.5em;padding-right: 0.5em;}}
@media (max-width: 600px) {.container img { float:none;}}
/*container ende*/



.container5 {color: white;}
.container5 p {color : white;}
.container5 h2 {text-align : center; padding : 1em 0em;color : white;}




/*container ende*/


*, *:before, *:after {box-sizing: border-box;}

   .box { height: auto;max-width: 30em;
  padding: 15px;
  background-color: rgba(66,33,142,1);
  box-shadow: 10px 10px 5px 12px black;
   margin-left:auto;
  margin-right: auto;margin-bottom: 3em;
color: white; text-align: center;}



.box img {
  display: block;
  margin-left: auto;
  margin-right: auto;
}







#box3 {
  border: 1px solid;
  padding: 10px;
  box-shadow: 5px 10px red;
  background-color:rgba(66,33,142,1); max-width: 30em;
}




.flex-container {flex-direction: column; padding: 0em 2em;}}
.flex-container {display : flex;justify-content : center;}
.flex-container ul li {font-size : 0.9em;}
.flex-container > div {background-color : black;width : 25em; margin : 10px;text-align : center;font-size : 0.9em;}
 

@media (max-width: 800px) { .flex-container {flex-direction: column;}}
















 












/* Responsive columns krypto kosten*/
@media screen and (max-width: 600px) {
  .center{font-size: 100%;}}
  
.topright {
  position: absolute;
  top: 1em;
  right: 1.2em;
  font-size: 18px;
}
video {
  max-width: 100%;
  height: auto;
}
.centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);color:white;
}




.button {

  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
}
a {
  text-decoration: none;
  font-size: 22px;
  color: black;
}

button:hover, a:hover {
  opacity: 0.7;
}

p.one {word-spacing: 10px;}

.immo {
width : 100%;
background-color : rgb(66, 33, 142, 1);
color : white;
padding : 2em;
text-align : center;
margin: 2em auto 2em auto;
font-size: 1.3em;
}

@media only screen and (max-width: 800px) {
.immo {
width : 100%;

font-size: 100%;
text-align: left;
}

.main {
float : left;
width : 60%;
padding : 0 20px;
overflow : hidden;
}
.right {
background-color : lightblue;
float : left;
width : 20%;
padding : 10px 15px;
margin-top : 7px;
}
@media only screen and (max-width: 800px) {
.main {
width : 80%;
padding : 0;
}
.right {
width : 100%;
}
}







#container {
 

  padding: 2em 0em 2em 3em;
  margin-bottom: 5em;
 margin-left: 5em;margin-right: 5em;
}




#container p {color : white;padding: 0em;text-align: left;}
#container h2 {text-align : center; padding : 1em 0em;color : white;}

@media (max-width: 600px) {#container {padding:0.5em; margin: 0;}}
@media (max-width: 600px) {#container h2  {font-size:100%;}}
@media (max-width: 600px) {#container p {font-size:100%;padding-left: 0.5em;padding-right: 0.5em;}}
















