/* CSS Document */
@import "reset.css";

body{
  font-family: Arial, Helvetica, san-serif;
  font-size: 10pt;
  color: #333;
  background: #1b9de7;
  text-align: center;
}

#page{
  background: white url(../design/bg.png) 0 0 repeat-x;
}

/* CONTENT ***********************************************************************/
#header{
  position: relative;
  clear:both;
  width: 800px;
  margin: auto;
  height: 90px;
}

#shield{
  position: absolute;
  top: 25px;
  left: -30px;
  width: 90px;
  height: 104px;
  background: transparent url("../design/shield_onwhite.png") 0 0 no-repeat;
}

#hungarian, #slovak{
  display: block;
  width: 27px;
  height: 18px;
  position: absolute;
  top: 32px;
  left: 765px;
  text-indent: -9999px;
  background: url("../design/flag_hu.png") 0 0 no-repeat;
}

#slovak{
  background: url("../design/flag_sk.png") 0 0 no-repeat;
}

#title{
  position: absolute;
  top: 20px;
  left: 70px;
  display: block;
  text-indent: -9999px;
  width: 610px;
  height: 40px;
  background: url("../design/title.png") 0 0 no-repeat;
}

#content_wrapper{
  width: 800px;
  margin: auto;
  background: red;
  background: url("../design/content_center.png") 0 0 repeat-y;
}

#content_wrapper_in{
  background: url("../design/content_top.png") 0 0 no-repeat;
}

#content{
  padding: 12px 18px 0 12px;
  text-align: justify;
}

#footer{
  text-align: center;
  height: 75px;
  color: #0f4e73;
  background: #1b9de7 url("../design/footer_bg.png") 0 0 repeat-x; 
}

#content_bottom{
  width: 800px;
  height: 25px;
  margin: auto;
  background: url("../design/content_bottom.png") 0 0 no-repeat;
}

#left_wrapper{
  float: left;
  width: 520px;
}

#right_wrapper{
  float: right;
  width: 250px;
}

#right{
  padding-left: 5px;
}

.cleaner{
  clear: both;
}

.welcome_wrapper{
  min-height:190px;
}

.welcome_container{
  background: url(../design/school_bg_center.png) 0 0 repeat-y;
}

.welcome_container_in{
  background: url(../design/school_bg.png) 0 0 repeat-x;
}

.welcome_container_in2{

  padding: 0 10px 0 0;
  background: url(../design/school_bg_bottom.png) left bottom no-repeat;
}

img.welcome{
  float: left;
  margin-right: 10px;
}

p.welcome{
  text-indent: 15px;
  padding-left: 10px;
  padding-bottom: 16px;
}

p.welcome2{
  text-indent: 15px;
  padding-left: 10px;
  padding-bottom: 2px;
}

h2{
  text-align: left;
  font-size: 120%;
  font-weight: bold;
  color: #f01e1e;
  padding: 5px 0 5px 0; 
}

h3{
  text-align: left;
  font-size: 120%;
  color: #fd7c14; /*kinda orange*/
}

a.more, a.morespan{
  display: block;
  color: #f01e1e;
  padding-bottom: 5px;
  padding-left: 5px;
}

a.morespan{
  display: inline;
}

#image_nav_drawing, #image_nav_dance, #image_nav_music, #image_nav_drama{
  margin-right: 3px;
  margin-bottom: 3px;
  float: left;
  display: block;
  width: 190px;
  height: 190px;
}

#image_nav_drawing{
  background: url("../design/art_main.png") 0 0 no-repeat;
}

#image_nav_dance{
  background: url("../design/dance_main.png") 0 0 no-repeat;
}

#image_nav_music{
  background: url("../design/music_main.png") 0 0 no-repeat;
}

#image_nav_drama{
  margin-right: 0;
  background: url("../design/drama_main.png") 0 0 no-repeat;
}

div.news{
  text-align: left;
  padding: 0 0 0 5px;
}

div.news .date{
  text-align: left;
  margin-bottom: 5px;
}

p.news, p.lastnews{
  text-indent: 15px;
  padding-bottom: 10px;
}

p.lastnews{
  padding-bottom: 0px; 
}

div.news img{
  float: left;
  margin: 0 3px 0 0;
  width: 100px;
}

#galery_left_wrapper{
  float: left;
  width: 240px;
}

#galery_right_wrapper{
  float: right;
  width: 280px;
}

ul.galery{
  margin-top: 10px;
  list-style-type: none;
}

ul.galery a{
  color: #333;
  text-decoration: none;
}

ul.galery a:hover{
  text-decoration: underline;  
}

ul.galery li{
  text-align: left;
  background: url("../design/galery_li.png") 0 0 repeat-y;
  padding: 3px;
  margin: 4px 0;
  margin-left: 4px;
}