@charset "utf-8";
/* CSS Document */

body, html {
  height: 100%;
  margin: 0;
  font-family: Arial, Helvetica, sans-serif;
  /*background-color:#999;*/
  scroll-behavior: smooth;
 /* background-image:url(../stammordner-oliver-s/Rastergrafik2b.png);
  background-attachment:fixed;*/
  background-color:white;
 
  
}

.aboutsection  {
	
	
	padding:60px;
	font-size:36px;
	color:rgba(255,255,255,0.61);
	background-image:linear-gradient(rgba(204,204,204,0.1), rgba(111,122,153,1)), url(../stammordner-oliver-s/camera_tripod.png); background-repeat:no-repeat;
	 background-size: cover;
	  background-attachment: fixed; 
	  overflow:hidden;
	   height:auto; 
	   text-align:center;
	  
	}
	
.aboutsection h1  {

font-family: "Courier New", Courier, monospace;
		color: rgba(166,184,255,1);
		font-variant:normal;
}



	
 @media screen and (max-width: 600px) {
	 
	 .aboutsection  {
	padding:11px;
	 }
 }

.triangle {
	width: 0;
	height: 0;
	border-top: 250px solid transparent;
	border-right: 500px solid rgba(202,224,255,1);
	border-bottom: 250px solid transparent;
	position:fixed;
	bottom:10px;
	z-index:100;
}
  
 /*++++++++++++++image overlay+++++*/
 .overlay-container {
  position: relative;
  width:auto;
 
}

.image {
  display: block;
  width: 100%;
  height: auto;
 
}

.overlay {
  position: absolute; 
  bottom: 0; 
  background: rgb(0, 0, 0);
  background: rgba(0, 0, 0, 0.4); /* Black see-through */
  color: white; 
  width: auto;
  transition: .5s ease;
  opacity:0;
  color: white;
  font-size: 14px;
  padding: 20px;
  text-align: center;
  height:60%;
 
}

.overlay-container:hover .overlay {
  opacity: 1;
} 
  
  
  /*++++++++++++++++++++++++++++++++++++overlay ende*/
  
  
  
  /*+++++++tooltip++++++++++++++++++++++*/
  

.tooltip {
  position: relative;
  display: inline-block;
 /* border-bottom: 1px dotted black;*/
  
  
}

.tooltip .tooltiptext {
  visibility: hidden;
  width: 180px;
  background-color: #555;
 
 /* color:white;*/
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;
  position: absolute;
  z-index: 1;
  top:50%;
  left: 50%;
  margin-left: -90px;
  opacity: 0;
  transition: opacity 0.3s;
  /*font-size:16px;*/
  font-size:16px;
  font-weight:normal;
  font-variant: small-caps; /*makes the letters nice*/
}

.tooltip:hover .tooltiptext {
  visibility: visible;
  opacity: 1;
}
/*+++++++++++++++++++++tooltip ende*/
 
  /*navi*/
  @media screen and (max-width: 600px) {
	  
  
  ul#breadcrumb li {
  
  font-size: 24px!important;
  line-height:1.5;
 
    }
  
  .fafacaca {
				color: #CCC;
    }
	
	
  }
  
  ul#breadcrumb {
  padding: 10px 16px;
  list-style: none;
  background-color: rgba(0,0,0,0.61);
  margin:0;
text-shadow:7px 7px 7px black;
  position:fixed;
  z-index:100;
  width:100%;
  font-variant:small-caps;
  
  
  
  
}

ul#breadcrumb li {
  display: inline;
  font-size: 24px;
}
ul#breadcrumb li+li:before {
  padding: 8px;
  color: black;
  content: "/\00a0";
}
ul#breadcrumb li a {
  color: white;
  text-decoration: none;
}
ul#breadcrumb li a:hover {
  color:#A0CBFE;/*lightblue*/
  text-decoration: underline;
}

	
	.fafacaca {
		
		color:grey; 
			
		}
		
		.fafacaca:hover {
			color:#A0CBFE; /*lightblue*/
		}

/*ende navi*/
  

h1, h2, h3, p {
	
	font-variant: small-caps;
	color: white;
	text-shadow: 7px 7px 7px rgba(0,0,0,0.71);
	padding:10px;
	
	
		
		}


p {
	
	font-size:24px;
	padding:7px;
	margin: 0px 80px;
	text-align:center;
	
	
	}


  a {
	 color: #7BA3FF;
	 text-decoration:none; 
	  
	  }


.color-inherit {
	
	color: inherit;
	
	}	  
	
 
 a:hover{ 
 
 color:#738EFF;
 
 }

a:visited {
	
	
	
	}



@media screen and (max-width: 600px) {
	
	h1, h2, h3 {
		
		text-align:center;
		
		}
	
		
		p {
	font-size:24px;
	padding:10px;
	margin: 0px 20px;
	
	}
	
}



.center {
  text-align: center;
  position: relative;
  top: 30%;
  left: 50%;
  transform: translate(-50%, -50%);
  
}


.center50 {
  text-align: center;
  position: relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
    
}

.center-x {
  display:block;
  margin-left:auto;
  margin-right:auto;
  width:60%;
  
}



@media only screen and (max-width: 600px) {
.center-x
{
		width:95%;
	}
	
	
	}

.border {
	
	border:1px solid grey;
	padding:7px;
	box-shadow:10px 10px 10px 10px rgba(0,0,0,0.71);
	background-color: rgba(255,255,255,0.61);
	border-radius:8px;
	
	}

/*INTRO/////////////////////////////////////////////--*/


.you-only-live-once {
  background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.1)), url(../stammordner-oliver-s/phooto-oliver//DSCF9875-2.jpg);
  height: 100%;

 
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
 
}

.olitext {
	
	font-size:26px;
	letter-spacing:5px;
	font-weight:bold;
	 color:rgba(255,255,255,0.81);
	 text-shadow:20px 20px 20px #000000;
	 opacity:0.5;
	word-break:break:keep-all;
	 font-variant: small-caps;
	
	 max-width:800px;
	
	 transform:rotate(0deg);
	text-align:center;

	}
	
@media screen and (max-width: 600px) {
	.olitext {
	
	font-size:18px;
	word-break:keep-all;
	
	}
	
}

	
	.phototext {
		
		font-size:20px;
	letter-spacing:15px;
	 color:rgba(255,255,255,0.81);
	 text-shadow:20px 20px #000000;
		
		
		}
	
	
.traveller {
	
	color: rgba(255,153,153,1);
	letter-spacing:14px;
	filter: blur(1.1px);
	font-size:24px;
	
	transform: rotate(3deg);
  
	

	
	}	
	
.i-am {
  text-align: center;
  
  
  position: absolute;
  top: 20%; /*herotext position on smaller screens varies with cover motive*/
  left: 50%;
  transform: translate(-50%, -50%);
  /*color:rgba(255,255,255,0.41);*/
  
}
/* intro ende ----------------------------------------------------*/


.filmstrip {
	
	background-image:url(../stammordner-oliver-s/filmstrip_b.png);
	 background-attachment:fixed; 
	background-color:white;
	 background-position:-20px 250px;
	
	 overflow:hidden;
	
	
	}


.bg-nyc {
	
   /*background-image: linear-gradient(to bottom, red,orange,yellow ,green,blue,indigo,violet); 
    background-attachment:fixed;overflow:hidden;*/
	
	background-image: conic-gradient(red 0deg, red 90deg, yellow 90deg, yellow 180deg, green 180deg, green 270deg, blue 270deg);
  border-radius:none;
  background-repeat:repeat;
  background-attachment:fixed;
  overflow:hidden;
  padding-top:30px;
  border-top:3px solid grey;

	
	}




.bg-lisb {
	
	
	border-top: 2px solid #666;
	background-color:yellow;
    overflow:hidden;
	background-image:url(../stammordner-oliver-s/Rastergrafik2b.png);
	background-attachment:fixed;
	/*background-size:contain;
	background-repeat:no-repeat;
	background-position:200px 100px;
	padding-bottom:35px;*/
	}

.bg-paris {
	
  height:auto;
   overflow:hidden;
   background-attachment:fixed;
   padding-top:30px; 
  
  /* background-image:linear-gradient(to bottom, rgba(255,0,0,0), rgba(100,10,50,0.71)10%, rgba(109,171,254,0.81));
	background-image:linear-gradient(to bottom, rgba(255,0,0,0), rgba(100,10,50,0.71));*//*
	
background-image:linear-gradient(to bottom,rgba(204,204,230,0.81), rgba(100,10,50,0.71));	


background-image:linear-gradient(to bottom, rgba(255,255,204,0.31), rgba(204,204,204,0.31), rgba(204,204,230,0.81), rgba(155,221,230,1), rgba(155,101,230,1));
	}*/
	
	background-image:url(../stammordner-oliver-s/hundrad2shilouete.png);
	background-repeat:no-repeat;
	background-position:40% 10%;
	background-size:80%; /* for mobiles sake*/
	
	}


/*@media screen and (max-width: 600px) {
	
	.bg-paris {
	background-image:linear-gradient(to bottom, rgba(204,204,204,0.31), rgba(204,204,230,0.81), rgba(155,221,230,1)20%, rgba(155,101,230,1));	
		

	}
	
}*/



.drypoint {
    height:3000px; 
    background-position:center top; 
     background-size:cover;
 background-repeat:no-repeat; 
 background-color:#999; 
 background-image:linear-gradient(rgba(255,0,0,0), rgba(100,0,0,0.40)),    url(../stammordner-oliver-s/logo_BLUE_large_b5.png); 
 background-attachment:fixed;
 overflow:hidden;

}

.drypoint h1 {
	color:white;
	
	}
.drypoint a {
	
	color:#98A7FE; /*light blue*/
	}
	.drypoint a:hover {
	
	opacity:0.9;
	}

/*div beneath+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/


.site-drypoint {
	
	background-image:url(../stammordner-oliver-s/phooto-oliver/DSCF0846backgrd.jpg);
	height:auto;
	overflow:hidden;
	background-attachment:fixed;
	border-top:5px solid grey;
	
	
	
	}



  .site-drypoint p, .site-drypoint h1, .site-drypoint h2, .site-drypoint h3, .site-drypoint ul, .site-drypoint li {
	
	 font-family:"Courier New", Courier, monospace, Arial, Helvetica, sans-serif;
	
	}


.site-drypoint a {
	
	color:#FFB9B9; /*rosa*/
	text-decoration:none;
	
	
	}
	
	
 .site-drypoint a:hover{
	
	
	color:#98A7FE; /*light blue*/
	
	
	}	




.yellow-love{ 
padding:15px;

}

	
.site-drypoint h1, h2, h3 {
	
	text-transform: lowercase;
	
	}
	
/*h2, h3  {
	
	text-transform: capitalize;
	
	} */


	
.site-drypoint p, ul, li {
	
	
	font-size:24px;
	
	
	
	}
	
	
.site-drypoint	h1 {
		margin-top: 8px;
			}



.site-drypoint img {
  float: left;
   width: auto;
  height: 500px; 
  border: 1px solid black;
  box-shadow: 15px 15px 15px rgba(51,51,51,0.81);
  padding:7px;
  border-radius: 5%; 
  margin:10px 40px 10px 0px;
}



@media only screen and (max-width: 700px) {
	
	.site-drypoint img {
	width:100%;
	height:auto;
	}
	
	.vid {
		
		width:100%;
		}	
	}


.site-drypoint img:hover {
	 
	 opacity: 0.9;
     cursor: pointer;
	 transition:0.3s;
  
}




.site-drypoint ul li {
	
	color: white;
	/*font-size: 2em;*/
	
	
	}
	
	
	
.imagetext {
	
	color: white;
	/*font-size: 1.8em;*/
	
	
		
	
	}
	
	 /*HINTERGRUND für text*/
.behindlist {
		 
		 
		 background-color: rgba(0,0,0,0.31);
		 padding:7px;
		border-radius: 6px;
		height:auto;
	}




/*.vid {
  float: left;
   width: 700px;
  height: auto; 
  border: 1px solid black;
  box-shadow: 5px 5px 10px rgba(51,51,51,0.81);
  padding:7px;
  border-radius: 7px;
  cursor:pointer;

  margin:5px 40px 10px 0px;
}
	*/ 
	
.vidcontainer  {
		 
		 
		 background-color: rgba(255,255,0,0.81);
		 background-image:linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.5)), url(../stammordner-oliver-s/logo_26.png);
		 background-attachment:fixed;
		 background-size:contain;
		 background-repeat:no-repeat;
		 padding:15px;
				
		
		 
	}
	 	
	


/*slidepanel*/

#panel, #flip {
  padding: 5px;
  text-align: center;

}
#panel p, h1, #flip p, h1, h2, a{
	color: black;
	text-shadow: 5px 5px 5px rgba(0,0,0,0.31);
	font-weight: bold;
	letter-spacing:-1px;
	
}

#flip {
	
	cursor:pointer;
	
	}

#panel {
  padding: 5px;
  display: block;
}


#nonne {
	display:none;
	
	}

#nonne a {
	color:black;
	font-weight:bold;
	
	}


.pdf-link {
	
	color:black;
	opacity:1;
	}	
	

a.pdf-link:hover  {
	opacity:0.71;
	color:black;
	
	
	}



/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/


#lino37th:hover {
		opacity: 0.8;
	transition: ease 0.5s; /*see responsive gall*/
		}

#lino37th {
	float:left;
	 margin: 15px;
	 
	
	
		 }

.bg-lino {

   height:auto; 
   border-top: 5px solid;  
   background-image:linear-gradient(to bottom right, rgba(204,204,204,0.1), rgba(111,122,153,1)), url(../stammordner-oliver-s/DSCF4326.jpg);
 
background-repeat:no-repeat; 
background-attachment:fixed; 
background-size:cover; 
background-position:bottom right;
	overflow:hidden;
}
	
	
	

	
.lino-p {	
font-size:38px; 
opacity:0.3;
display:block;
position:relative;
text-align:justify;
}

@media screen and (max-width: 600px) {
	.lino-p {	
font-size:24px;
text-align:center;
 
}
#lino37th {
	float:none!important;
	 margin-left: auto;
	 margin-right:auto;
	 width:100%;
	 height:auto;
	
	
	 
	 }
	 
#not-edt {
		left:0px!important;
	 top:-340px!important;
		}	
}

/*holy sh_t*/
#not-edt {
	
	width:auto; 
	position:relative;
	overflow:hidden; 
	transform:rotate(-45deg); 
	left:180px;
	 top:-540px;
	
	}	
	

	
	





.spinner {
	font-size:36px!important;
	/*border:1px solid black; 
	padding:30px; 
	background-image:url(stammordner-oliver-s/Rastergrafik2b.png); background-color:rgba(255,255,255,0.41); 
	border-radius:9px; 
	background-position:bottom right;
	 box-shadow:7px 7px 7px 7px rgba(0,0,0,0.41); 
	 color:black;*/
	 color:rgba(255,255,255,0.61);
	
	}	
	
	
	
.colorstrip {
	
	background-image: linear-gradient(to bottom, rgba(0,0,51,0.6),rgba(255,0,0,0.5), rgba(255,255,0,0.71)), url(../stammordner-oliver-s/filmstrip_b.png);
	background-repeat:repeat;
	background-attachment:local;
	background-position:bottom;
	height:390px;
    
	
	margin:0;
	overflow:hidden;
	
	
	
	}	


.img-deco {
  width: auto;
  height: 600px;
  padding:7px; /*frame width*/
/* background-color:#666; /*frame effekt*/
/*background-image:url(../stammordner-oliver-s/Rastergrafik2b.png);/*frame effekt*/
border:1px solid grey;
 box-shadow: 7px 7px 7px 7px rgba(51,51,51,1);
}
	
/* RESPONSIVE GALLERY *************************************+++++++**/	


div.gallery {
  /*border: 1px solid black;*/
  margin:10px 5px;

  
 
}

@media screen and (max-width: 600px) {
	div.gallery {
    margin:5px 5px;
	}
	
	div.gallery:hover {

  opacity:0.9;
  
	}
}


div.gallery:hover {

 opacity:0.9;
  transition: ease 0.5s;
 filter: grayscale(.9);
 cursor:pointer;
		
}

div.gallery img {
  width: 100%;
  height: 600px;
  padding:10px; /*frame width*/
 background-color:#666; /*frame effekt*/
background-image:url(../stammordner-oliver-s/Rastergrafik2b.png);/*frame effekt*/
 object-fit: cover;
 box-shadow: 5px 5px 3px rgba(51,51,51,0.51);
/* border-radius: 2em 7.2em 0.4em 71em; 
 border-radius: 2em 7.2em 0.4em / 21em 4em;
 border-radius: 2em 9.2em 0.4em / 21em 14em; /*CRAZY BORDER-RADIUS troubling android*/
}
/* 77++++++++++++++second option ++++++++++++++++++++++++++++++++++++++++++++*/
/*
.br-1 {
	border-radius: 13em 7.2em / 8em 3em;
	}
.br-2 {
	border-radius: 12em 1.2em  8.4em/  2.5em 14em;
	}
	/*nice shape bottom left 2nd 5th:*/
.br-3 {
	border-radius: 24.2em 9.2em / 0.4em  21em 14em;
	}
	
.br-4 {
	border-radius:1.7em 14em 19em /7.91em 9em;
	}



div.gallery2 img {
 
 
 
  object-fit:cover;
  
  
  width:200px; 
  height:auto; 
  border: 1px solid black;
   box-shadow:10px 10px 10px 10px rgba(51,51,51,0.71);
    padding:7px 

 box-shadow: 5px 5px 3px rgba(51,51,51,0.51);
 border: 1px solid black;
}



/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/


* {
  box-sizing: border-box;
}

.responsive {
  padding: 0 6px;
  float: left;
  width: 24.99999%;

  
}

@media only screen and (max-width: 700px) {
  .responsive {
    width: 49.99999%;
    margin: 6px 0;
  }
}

/*@media only screen and (max-width: 500px) {
  .responsive {
    width: 100%;
  }
}*/

.clearfix:after {
  content: "";
  display: table;
  clear: both;
}


	
	
	
 .social-btns {
            display: flex;
            gap: 10px;
			padding:20px 0px;
			position:relative;
			height:80px;
			width:auto;
			margin-left:40%; /* at least40% wegen visit ollies...*/
			margin-right:auto;
			right:120px; /*NECESSARY FOR MOBILE DEVICES POSITION..NO IDEA WHY*/
		
			
        }


 .social-btns a {
	color: red;
	font-size: 40px;
	text-decoration: none;
	border: 1px solid black;
	border-radius:4px;
	padding: 3px;
	height:40px;
	width:40px;
	margin: 0px 5px;
	box-shadow: 10px 10px 10px rgba(0,0,0,0.81);
	
	
        }

        .social-btns a:hover {
            transform: none;
        }
.social-btns a:hover  {
           opacity:0.7;
		   transition: ease 0.5s;
        }



/*
.mythumbnail {
	
	position: relative; 
	right:0px; 
	bottom:15px;
	
	
	
	}*/
	
/*so in photography*/
.mythumbnail {
	
	position: relative; 
	left:3px;
	bottom:7px;
	
	
	
	}	
	
	
/*
.mythumbnail:hover {
	
	cursor:pointer;

	
	}

*/
#nover:hover {
	
	cursor:default!important;
	opacity:1;
	}	
	
	
	
/* Modals+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/	


#myImg #myImg2p #myImg3p #myImg4p #myImg5p #myImg6p #myImg7p #myImg8p #myImg9p #myImg9p2 #myImg9p3 #myImg9p4 #myImg10p #myImg10p2 #myImg11p #myImg11p2 #myImg12p #myImg13p #myImg13p2 #myImg14p 
#myImg15p #myImg16p  #myImg17p  #lino37th #pasarel #arch #rivoli #j-j-as #ny-night

{
 
  cursor: pointer;
  transition: 0.3s;
}




/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1000; /* Sit on top */      /*DOESNT WORK WITH NAVI; WHY?*/
  padding-top: 7%; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background: rgba(0, 0, 0, 0.92); /* Fallback color */
  background: rgba(0, 0, 0, 0.92);  /* Black w/ opacity */
  
}

/* Modal Content (image) */
.modal-content {
  margin:auto;

  display: block;
  width: 70%; /*goes with caption*/
  max-width: 450px;
  
  height:auto;
  float:none;
  cursor:pointer; /*IF IMAGE IS THE CLOSEBUTTON*/
  opacity:1!important;
  border: 1px solid rgba(255,255,255,0.81);
  /*padding:7px;*/
  filter: none!important;   /*see filter on -desktop-- image*/
  
  z-index: 100;
  
  
  padding:10px; /*frame width*/
 background-color:#464646; /*frame effekt*/
background-image:url(../stammordner-oliver-s/Rastergrafik2b.png);/*frame effekt*/
 }

@media only screen and (max-width: 500px){
#caption {
	font-size:50px;
	color: rgba(255,255,255,0.21)!important;
	
}


	
}


/* Caption Design of Modal Image */
#caption {
  margin: auto;
  display: block;
  width: 70%;
 *max-width: 450px;
  text-align: center;
 font-variant: small-caps; /*makes the letters nice*/
 /*background-image:  url(../stammordner-oliver-s/Rastergrafik2b.png), linear-gradient(rgba(255,255,255,0.1), rgba(255,255,255,0.01));*/
    
line-height: 1.3;
/*border: 1px solid grey;*/
 /* text-decoration: underline;
  text-decoration-thickness: 50%;    */
border-radius:7px;
  color: #ccc;
  padding: 10px;
  margin-top:15px;
  margin-top:5px;
  height: auto;
}

/* Add Animation */
.modal-content, #caption {  
  -webkit-animation-name: zoom;
  -webkit-animation-duration: 0.7s;
  animation-name: zoom;
  animation-duration: 0.8s;
}

@-webkit-keyframes zoom {
  from {-webkit-transform:scale(0.5)} 
  to {-webkit-transform:scale(1)}
}

@keyframes zoom {
  from {transform:scale(0.5)} 
  to {transform:scale(1)}
}




/* The Close Button */
.close {
  position: absolute;
 top: 45px;
  right:35px;
  color: rgba(255,214,213,1);
  font-size: 50px;
  font-weight: normal;
  transition: 0.3s;
}

.close:hover,
.close:focus {
  color:  rgba(255,255,255,0.61);
  text-decoration: none;
  cursor: pointer;
}







/* 100% Image Width on Smaller Screens */
@media only screen and (max-width: 700px){
  

  
  
  .modal-content, #caption {
    width: 100%;
  }
  
 
.footer {		
		font-size:10px; 
		}

}

.footer {
	
	
		
		text-align:center; 
		padding:7px;
		font-size:16px; 
		letter-spacing:normal;
		
		height:100px; 
		text-align:center; 
		padding:30px; 
		
		font-variant: small-caps;
		
		color:grey;
		
	
	
   
	}

@media only screen and (max-width: 480px)

{
	
.close {	
color: #FD725E; /*STRONGER RED*/

 
}





}


/* MMMOOOODDAAALL EEEENDNDDEEEEEEEEEEEEEEEEEEEE*/



/*drypoint egyptian modal+++++++++++++++++++++++++++*/





#myImgeg #myImg2 #myImg3 #myImg4 #myImg5 #myImg6  {
 
  cursor: pointer;
  transition: 0.3s;
}









 

/*the egyptian close button*/

.close-e {
	/*position: absolute;
  top: 15px;
  right: 35px;*/
	color: rgba(255,214,213,1);
	font-size: 70px;
	margin-left: -50px; 
 /* font-weight: normal;
  transition: 0.3s;*/
}
/*
.close-e:hover,
.close-e:focus {
  color:  rgba(255,255,255,0.61);
  text-decoration: none;
  cursor: pointer;
}
*/



/* drypoint egyptian modal ende++++++++++++++++++++++*/












/*COOKIECOOKIECOOKIECOOKIECOOKIECOOKIECOOKIECOOKIECOOKIE*/	
	
.cookies {
  position: fixed;
  bottom: 0px;
  left:0;
  /*left: 20px;*/
 /* margin: 0px 0px -15px 0px;*/
  padding:10px 50px;
  /*width: 300px;*/
  width:500px;
 color:white;
 line-height:1.6;
text-shadow:3px 3px 7px black;
  z-index:10000;
  background-color: rgba(0,0,128,0.91);
  opacity:0.81;
 
  /*background-image:linear-gradient(to right, red,orange,yellow,green,blue,indigo,violet),url(../stammordner-oliver-s/Rastergrafik2b.png);*/
 
 
/*background-image:url(../stammordner-oliver-s/Rastergrafik11.png);

 background-size:120%;
 background-repeat:no-repeat;
 background-position:50% 20%;*/
  text-align:center;
 


 /* border-radius:8px;*/
 border:3px solid yellow;
 border-style:dotted;
 /* text-align:center;
 /* font-size:14px;
 font-weight:bold;
 
 /*box-shadow: 10px 15px 10px rgba(0,0,0,0.3);*/
 

}
 
 
 
  


	
.closebtn {
  
  cursor: pointer;
  color:rgba(255,0,0,1);
  text-align:center;
  font-weight:bold;
  
}

.closebtn:hover {
  opacity:0.6;
}



@media only screen and (max-width: 700px) {
	     .cookies {
		width:100%;
		
}

}