@media( max-width:1023px){
	
	
	::-webkit-scrollbar {
    	-webkit-appearance: none;
	}
	
	::-webkit-scrollbar:vertical {
		width:5px;
	}
	
	::-webkit-scrollbar:horizontal {
		height:5px;
	}
	
	::-webkit-scrollbar-thumb {
		background-color:#0b9c22;
		border-radius: 10px;
		border: 2px solid #0b9c22;
	}
	
	::-webkit-scrollbar-track {
		border-radius: 10px;  
		background-color: #6ec17b; 
	}

	img{ max-width:100%; }
	
	#wrapper{
		width:100%;
		margin:0 auto;
		padding:0 15px;
		 box-sizing:border-box;
	}
	#presentation{ width:100%; box-sizing:border-box; }
	#footer{ width:100%; padding:15px; box-sizing:border-box; }
	#logo{ width:100%; box-sizing:border-box; }
	#search{ width:100%; box-sizing:border-box; }
	
}

@media ( min-width:768px ) and ( max-width:1023px ){
	
	.tabell-container {
		overflow-x:auto;
		border:1px solid #999;
		margin:20px 0;
	}
	#tabell{ padding:10px; margin:0 auto; }
	#presentation.periodictable-description{
		padding:5px 0;
	}
	.mini_info{ padding:10px; width:50%;  box-sizing:border-box; }
	.arrow_box{ height:auto; }
	#header{ height:auto; }
	.bigInfo{ width:408px; }
	.adsbygoogle, .periodictable-description .adsbygoogle{ margin:0;}
	.adsbygoogle, .periodictable-description .adsbygoogle{
		display:block;
		overflow-x: auto;
		width: 100% ;
		height:auto ; 
		min-height:40px;
		text-align:center;
		clear:left;
	}
	
}
/*===== RESPONSIVE DESIGN FOR MOBILE STARTS  =====*/

@media ( max-width:767px ){
	
/*===== HEADER STARTS =====*/
	
	*{
		box-sizing:border-box;
	}
	

	#wrapper{ position:relative; }
	#header{
		height:auto;
		float:none;
		display:block;
	}
	#logo h1{ float:none; }
	.searchbar {
		bottom: -55px;
		left: 0;
		margin: 0;
		position: absolute;
		width: 100%;
	}
	.search-box{
		position:relative;
	}
	.search-box input[type="text"]{
		height:38px;
		width:100%;
		border:1px solid #6ec17b ;
		padding:2px 50px 2px 10px ;
		border-radius:0;
	}
	.search-box input[type="submit"]{
		position:absolute;
		top:8px;
		right:10px;
		font-size:0;
		border:0;
		background:#fff url(bilder/search-button.png) 0 0 no-repeat;
		height:20px;
		width:30px;
		border-left:1px solid #6ec17b;
		border-radius:0;
	}
	#search{
		width:100%;
		margin:90px auto 0;
	}
	.cc_container{ position:static ; }
	.cc_container .cc_message{ font-size:15px ; }
	.cc_banner-wrapper{ height:auto ; }

/*===== HEADER STARTS =====*/
	
	.show-table{
		clear:left;
		padding:10px;
		color:#fff;
		font-size:18px;
		cursor:pointer;
		margin:20px 0 0;
		font-family:"Oswald",sans-serif;
		box-shadow:0 0 5px #ccc;
	}
	#tabell { margin-bottom:0; }
	.tabell-container{ 
		border: 1px solid #cccccc;
		display: none;
		margin: 10px 0 0;
		overflow-x: auto;
		width: 100%;
		position:relative;
		padding-top:180px;
	}
	.bigInfo{
		height: auto;
		left: 0;
		margin-left: 0;
		margin-top: 0;
		padding: 5px;
		position: absolute;
		top: 0;
		width: 100%;
	}
	.periodic-detail{ display:none; }
	#presentation.presentation{ margin:70px 0 0; padding:15px; float:none; display:block; }
	#presentation i{ font-size:13px; }
	.mini_info{ width:100%; float:none; }
	.fb_iframe_widget{ margin:20px 0 0; }
	.fb_iframe_widget{ width:100% ; display:block ; overflow:auto; text-align:center; }
	/*.fb_iframe_widget iframe{ left:50%; margin-left:-146px; width:293px ; }*/
	.fb_iframe_widget iframe div{ width:100% ; height:auto ; }
	/*.dpn{ display:none; }*/
	.dpn.adsbygoogle{ display:none; }
	
	/*===== PERIODIC TABLE DESC STARTS ======*/
	
	.fakta.dbr br{
		display:block;
	}
	.arrow_box.arrow_box-title{ display:none; }
	.arrow_box.menu-open.minus{
		display:block;
	}
	#presentation.periodictable-description{
		padding:10px 15px 15px
	}
	.arrow_box{ 
		-webkit-tap-highlight-color: rgba(0,0,0,0);
    	-webkit-touch-callout: none; 
		margin:10px 0 0; 
		height:auto; 
		cursor:pointer;
		width:100%;
		padding-right:18px;
		padding-left:10px;
		font-size:18px;
		text-align:left;
		box-shadow:0 0 5px #ccc;
	}
	.mini_info + .mini_info > div:first-child .arrow_box.menu-open{
		color:#6ec17b;
		position:relative;
	}
	.mini_info + .mini_info > div:first-child .arrow_box.menu-open:before{
		border: 0 none;
		color: #ffffff ;
		content: "Grundämnen";
		left: 26px;
		position: absolute;
		top: 0;
	}
	.arrow_box::before, .arrow_box::after  {
		border-color: #fff rgba(194, 225, 245, 0) rgba(194, 225, 245, 0);
		border-width: 5px;
		right:2px;
		left:auto;
		top:40%;
	}
	.periodic-detail {
		background-color:#fbfbfb;
		border-top: 1px solid #fff;
		margin: 0 0 5px;
		padding: 10px;
		max-height:220px;
		overflow:auto;
	}
	.periodictable-description .mini_info a{
		font-size:15px;
		color:#4a4a4a;
		padding:2px 0;
	}
	.adsbygoogle, .periodictable-description .adsbygoogle{ margin:20px 0 0; }
	
	/*===== PERIODIC TABLE DESC ENDS ======*/
	
	#presentation h1{ margin:0; font-size:20px; }
	p.fakta br{ display:none; }
	p.fakta img{
		display: inline-block;
    	vertical-align: middle;
	}
	#periodic-detail-1 img, #periodic-detail-3 img {
		float:left;
		margin-right:7px;
		clear:left;
	}
	#periodic-detail-1 img{ margin-top:2px; }
	#periodic-detail-3 img { margin-top:5px; }
	#periodic-detail-3 a{ clear:both; }
	#periodic-detail-1  span{ display:inline-block; width:87%; }
	 #periodic-detail-3 span{ display:inline-block; width:75%; }
	
	.fakta.dpb a{ display:block; }
	center.dpn br{ display:none; }
	p.note2{ margin-top:20px; }
	.adsbygoogle{ display:none ; }
	.adsbygoogle.pre-add{
		display:block ;
		overflow-x: auto;
		width: 100% ;
		height:auto ; 
		min-height:40px;
		text-align:center;
		clear:left;
	}
	
	
}

@media ( min-width:640px ) and ( max-width:767px ){
	
	.myButton{ font-size:15px; }
	
}

@media ( max-width:639px ){
	
	.myButton{
		display:block;
		width:100%;
		clear:left;
	}
	.myButton span{ float:right; }
	.element-img{ float:none; margin:10px 0;  }
	
}

@media ( min-width:480px ) and ( max-width:767px ){
	
	.adsbygoogle, .periodictable-description .adsbygoogle{ padding:20px; }
	
}


/*===== RESPONSIVE DESIGN FOR MOBILE ENDS  =====*/