/*low resolution, 480px and below */
@media only screen and (max-width: 480px ) { 

body { background: rgb(244,244,244); font-family: "Trebuchet MS", Helvetica, sans-serif; } 

#master { width: 95%; margin: 0 auto;  background: rgb(255,255,255); } 

header { height: 150px; background: rgb(200,200,200); text-align: center; }
	
    #logo { float: left; }
     #lang { float: left; }
    #lang img { opacity: 1; filter: alpha(opacity=50); /* For IE8 and earlier */ }
    #lang img:hover {  opacity: 0.5 ; filter: alpha(opacity=100); /* For IE8 and earlier */}
    
    
nav {  padding: 1px 20px 0px 20px;  text-align: right; }
	nav ul { -webkit-padding-start: 0; }
	nav li { display: inline; color: rgb(255,255,255); font-weight: bold; }
	nav li a { color: rgb(100,100,100); text-decoration: none; font-weight: bold; font-size: 25px; line-height: 225%; }
        a:hover { color: rgb(128,189,0); }

    
#slideshow { width: 100%;  background: rgb(200,200,200); }
	#slideshow img { width: 100%; }

    #drustmreze { float: left; width: 100%; height: 50px; background: rgb(200,200,200); } 
    #drustmreze img { float: left;  padding: 10px 0px 10px 10px; opacity: 1; filter: alpha(opacity=50); /* For IE8 and earlier */ }
    #drustmreze img:hover {  opacity: 0.5 ; filter: alpha(opacity=100); /* For IE8 and earlier */}
    
    .contentbox {  background: rgb(255,255,255); padding: 0px; margin-bottom: 10px;  }
	.contentbox img { margin-top: 10px;}
	.contentbox p { color: rgb(0,0,0); font-size: 100%; line-height: 180%; text-align: left; }
	.contentbox h2 { color: rgb(238,49,56); }
    .contentbox h3 {color: rgb(100,100,100); font-size: 80%;}
    
    
    
    article { width: 95%; margin-left: 10px; }
	.news { margin-bottom: 20px; }
	.news h2 { font-family: Times; margin-bottom: -20px; font-size: 200%; }
	.news p { line-height: 180%; }
	
    

footer {background-color: rgb(238,49,56);  width: 100%;  float: left;}
    
    footer p { color: rgb(255,255,255); text-align: center; }

}



/*medium resoultion, 481px to 1023px */
@media only screen and (min-width: 481px) { 

body { background: rgb(244,244,244); font-family: "Trebuchet MS", Helvetica, sans-serif; } 

#master { width: 95%; margin: 0 auto;  background: rgb(255,255,255); }

header { height: 50px; background: rgb(200,200,200); }
	
    #logo { float: left; }
     #lang { float: left; }
    #lang img { opacity: 1; filter: alpha(opacity=50); /* For IE8 and earlier */ }
    #lang img:hover {  opacity: 0.5 ; filter: alpha(opacity=100); /* For IE8 and earlier */}
    
    
nav {  padding: 1px 20px 0px 20px;  text-align: right; }
	nav ul { -webkit-padding-start: 0; }
	nav li { display: inline; color: rgb(255,255,255); font-weight: bold; }
	nav li a { color: rgb(100,100,100); text-decoration: none; font-weight: bold; font-size: 15px; line-height: 200%; }
        a:hover { color: rgb(238,49,56); }

    
#slideshow { width: 100%; margin: 0px auto; background: rgb(200,200,200); }
	#slideshow img { width: 100%; }

    #drustmreze { float: left; width: 100%; height: 50px; background: rgb(200,200,200); } 
    #drustmreze img { float: left;  padding: 10px 0px 10px 10px; opacity: 1; filter: alpha(opacity=50); /* For IE8 and earlier */ }
    #drustmreze img:hover {  opacity: 0.5 ; filter: alpha(opacity=100); /* For IE8 and earlier */}

 
    .contentbox { background: rgb(230,230,230); padding: 20px 20px 0 20px; margin: 20px 0 20px 0; float: left;  }

	.contentbox img { float: left; margin-right: 10px; }
	.contentbox p { color: rgb(0,0,0); font-size: 90%; line-height: 140%;  }
    .contentbox h2 { color: rgb(238,49,56); font-size: 120%; }
    .contentbox h3 {color: rgb(100,100,100); font-size: 80%;}
    
article { width: 95%; margin-left: 10px; }
	.news { margin-bottom: 20px; }
	.news h2 { font-family: Times; margin-bottom: -20px; font-size: 200%; }
	.news p { line-height: 180%; }

footer {background-color: rgb(238,49,56);   width: 100%;  float: left; }
    
    footer p { color: rgb(255,255,255); text-align: center; }

    #map {  width: 400px; height: 400px; box-shadow: 2px 2px 5px #acacac;
}
    
    
}



/*high resolution, 1024px and above */
@media only screen and (min-width: 1024px) { 

body { background: rgb(244,244,244); font-family: "Trebuchet MS", Helvetica, sans-serif; } 

#master { width: 95%; margin: 0 auto;  background: rgb(255,255,255); }

header { width: 100%; height: 50px; background: rgb(200,200,200);  }
	
    #logo { float: left; }
    #logo img { opacity: 1; filter: alpha(opacity=50); /* For IE8 and earlier */ }
    #logo img:hover {  opacity: 0.5 ; filter: alpha(opacity=100); /* For IE8 and earlier */}
    
    
    #lang { float: left; }
    #lang img { opacity: 1; filter: alpha(opacity=50); /* For IE8 and earlier */ }
    #lang img:hover {  opacity: 0.5 ; filter: alpha(opacity=100); /* For IE8 and earlier */}
    
nav {  padding: 1px 20px 0px 20px;  text-align: right;  }
	
    nav ul { -webkit-padding-start: 0; }
	nav li { display: inline; color: rgb(255,255,255); font-weight: bold;  }
	nav li a { color: rgb(100,100,100); text-decoration: none; font-weight: bold; font-size: 15px; }
    a:hover { color: rgb(238,49,56); }
    
    
    #slideshow {  width: 100%; margin: 0px auto; background: rgb(200,200,200)); }

    #slideshow img { width: 100%; height: auto;}
   
#drustmreze { float: left;  width: 100%; height: 50px; background: rgb(200,200,200); } 
    #drustmreze img { float: left;  padding: 10px 0px 10px 10px; opacity: 1; filter: alpha(opacity=50); /* For IE8 and earlier */ }
    #drustmreze img:hover {  opacity: 0.5 ; filter: alpha(opacity=100); /* For IE8 and earlier */}

    
    
    
    
.contentbox {  background: rgb(230,230,230); padding: 20px 20px 0 20px; margin: 20px 0 20px 0; float: left; width: 97%; }
	.contentbox img { padding: 10px 10px 0px 0;}
	.contentbox p { color: rgb(0,0,0); font-size: 90%; line-height: 140%;  }
    .contentbox h2 { color: rgb(238,49,56); font-size: 120%; }
    .contentbox h3 {color: rgb(100,100,100); font-size: 80%;}

    footer {background-color: rgb(238,49,56);  width: 100%;  float: left; }
    
    footer p { color: rgb(255,255,255); text-align: center; }
        
        
  
        
#map {  width: 800px; height: 400px; box-shadow: 2px 2px 5px #acacac;
}