1. /* clean */
  2.  
  3. * {
  4.         margin: 0;
  5.         padding: 0;
  6.         font-family: Arial, FreeSans, Helvetica, sans-serif;
  7.         font-size: 1em;
  8. }
  9.  
  10. /* elements */
  11.  
  12. a {
  13.         color: #102a5f;
  14. }
  15.         a:hover {
  16.                 color: #3274cf;
  17.         }
  18.         .image_replace {
  19.                 display: block;
  20.                 outline: none;
  21.                 background: transparent;
  22.                 text-indent: -5000px;
  23.         }
  24.  
  25. p {
  26.         font-size: .8em;
  27. }
  28.  
  29. h2 {
  30.         color: #102755;
  31.         font-size: 1.2em;
  32.         margin: 0 0 10px 0;
  33.         font-family: "Trebuchet MS", Arial, Verdana, Freesans, sans-serif;
  34. }
  35.  
  36. /* body & site wrapper */
  37.  
  38. body {
  39.         background: #fff url("images/background.png") repeat-x center top;
  40.         color: #666;
  41. }
  42.  
  43. #site {
  44.         overflow: auto;
  45.         width: 995px;
  46.         margin: 0 auto;
  47. }
  48.  
  49. /* header */
  50.  
  51. #header {
  52.         background: transparent url("images/header.jpg") no-repeat center top;
  53.         overflow: auto;
  54.         width: 100%;
  55. }
  56.         #header h1 {
  57.                 padding: 20px 0px 0px 0px;
  58.         }
  59.                 #header h1 a {
  60.                         width: 170px;
  61.                         height: 40px;
  62.                         margin: 0px 0 0 30px;
  63.                 }      
  64.         #header ul {
  65.                 display: inline;
  66.                 float: left;
  67.                 margin: 42px 0 1px 27px;
  68.                 border-right: 2px solid #fff;
  69.         }
  70.                 #header ul li {
  71.                         display: inline;
  72.                 }      
  73.                         #header ul li a {
  74.                                 background: #eaeaea url("images/menu_top.png") repeat-x center top;
  75.                                 display: block;
  76.                                 float: left;
  77.                                 padding: 7px 20px;
  78.                                 height: 14px;
  79.                                 border-left: 2px solid #fff;
  80.                                 font-family: "Tahoma", "Arial";
  81.                                 font-size: .7em;
  82.                                 text-decoration: none;
  83.                         }
  84.                                 #header ul li a:hover {
  85.                                         background: #253b66 url("images/menu_hover_top.png") repeat-x center top;
  86.                                         display: block;
  87.                                         color: #fff;
  88.                                         border-left: 2px solid #fff;
  89.                                 }
  90.                                 #header ul li a.tab {
  91.                                         background: #253b66 url("images/menu_hover_top.png") repeat-x center top;
  92.                                         display: block;
  93.                                         color: #fff;
  94.                                         border-left: 2px solid #fff;
  95.                                 }
  96.                                
  97.         #loggedin {
  98.                 margin: 42px 27px 1px 0;
  99.                 float: right;
  100.         }
  101.         #loggedin p {
  102.                 margin: 6px 10px 0 0;
  103.                 /*font-size: .8em;*/
  104.                 font-weight: bold;
  105.                 float: left;
  106.         }
  107.         #loggedin ul {
  108.                 float: left;
  109.                 margin: 0;
  110.                 border-right: 2px solid #fff;
  111.         }
  112.                                        
  113. /* main */
  114.  
  115. #main {
  116.         margin: 30px;
  117.         overflow: auto;
  118. }
  119.  
  120.         .input_box {   
  121.                 background-color: #5178b8;
  122.                 width: 290px;
  123.                 color: #fff;
  124.         }
  125.                 .input_box a {
  126.                         color: #fff;
  127.                 }
  128.                         .input_box a:hover {
  129.                                
  130.                         }
  131.                 .input_box h3 {
  132.                         padding: 0;
  133.                         width: 290px;
  134.                         height: 100px;
  135.                         text-indent: -5000px;
  136.                 }
  137.                 .input_box p.upute {
  138.                         font-size: .7em;
  139.                         padding: 0 20px;
  140.                         margin: 0;
  141.                 }
  142.                 .input_box form {
  143.                         width: 250px;
  144.                         padding: 20px;
  145.                         margin: 0;
  146.                         background: transparent url("images/box_bottom.png") no-repeat center bottom;
  147.                         color: #fff;
  148.                 }
  149.                         .input_box form p {
  150.                                 text-align: center;
  151.                                 margin: 0 0 10px 0;
  152.                         }
  153.                 .input_box input {
  154.                         font-size: 1.3em;
  155.                         padding: 5px;
  156.                         color: #000;
  157.                         background: #fff url("images/input_back.png") no-repeat top left;
  158.                         width: 200px;
  159.                         height: 20px;
  160.                         border: none;
  161.                 }
  162.                 .input_box label {
  163.                         font-size: .9em;
  164.                         font-weight: bold;
  165.                         text-align: left;
  166.                 }      
  167.                 .input_box button {
  168.                         border: 0;
  169.                         text-indent: -5000px;
  170.                         cursor: pointer;
  171.                 }
  172.                
  173.  
  174.         #about_part {
  175.                 margin: 0 0 20px 0;
  176.         }
  177.                
  178.         #scientist_part {
  179.                 width: 268px;
  180.                 margin-top: 30px;
  181.                 float: left;
  182.         }
  183.                
  184.         #search_browse_part {
  185.                 width: 290px;
  186.                 float: left;
  187.                 margin-right: 20px;
  188.         }
  189.                 #search h3 {
  190.                         background: #5178b8 url("images/box_top_search.png") no-repeat center top;
  191.                 }
  192.                 #search button {
  193.                         margin: 0 auto;
  194.                         display: block;
  195.                         background: transparent url("images/pretrazi.png") top left;
  196.                         width: 96px;
  197.                         height: 39px;
  198.                 }
  199.                 #browse h3 {
  200.                         background: #5178b8 url("images/box_top_browse.png") no-repeat center top;
  201.                 }
  202.                
  203.         #login_part {
  204.                 width: 290px;
  205.                 float: left;
  206.         }
  207.                 #login h3 {
  208.                         background: #5178b8 url("images/box_top_login.png") no-repeat center top;
  209.                 }
  210.                 #login button {
  211.                         background: transparent url("images/login.png") top left;
  212.                         width: 79px;
  213.                         height: 39px;
  214.                 }      
  215.                
  216.         /* kontakt */
  217.        
  218.         #kontakt_part, #preporuka_part {       
  219.                 background-color: #5178b8;
  220.                 width: 376px;
  221.                 margin: 0 20px 0 0;
  222.                 float: left;
  223.                 color: #fff;
  224.         }
  225.        
  226.         #kontakt_part h3 {
  227.                 padding: 60px 20px 0 20px;
  228.                 width: 336px;
  229.                 text-indent: -5000px;
  230.                 height: 44px;
  231.                 background: #5178b8 url("images/kontakt_box_top.png") no-repeat center top;
  232.         }
  233.        
  234.         #kontakt_part form, #preporuka_part form {
  235.                 width: 336px;
  236.                 padding: 0 20px 20px 20px;
  237.                 margin: 10px 0 0 0;
  238.                 background: #5178b8 url("images/kontakt_box_bottom.png") no-repeat center bottom;
  239.                 color: #fff;
  240.         }
  241.        
  242.         #kontakt_part button, #preporuka_part button {
  243.                 margin: 0 auto;
  244.                 display: block;
  245.                 background: transparent url("images/posalji.png") top left;
  246.                 width: 86px;
  247.                 height: 38px;
  248.                 border: 0;
  249.                 text-indent: -5000px;
  250.                 cursor: pointer;
  251.         }
  252.        
  253.         #kontakt_part form p, #preporuka_part form p {
  254.                 text-align: center;
  255.                 margin: 0 0 10px 0;
  256.         }
  257.        
  258.         #kontakt_part label, #preporuka_part label {
  259.                 font-size: .9em;
  260.                 font-weight: bold;
  261.         }
  262.        
  263.         #kontakt_part input, #preporuka_part input {
  264.                 width: 285px;
  265.                 height: 20px;
  266.                 font-size: 1.3em;
  267.                 padding: 5px;
  268.                 color: #000;
  269.                 background: #fff url("images/input_back.png") no-repeat top left;
  270.                 border: none;
  271.         }
  272.        
  273.         #kontakt_part textarea, #preporuka_part textarea {
  274.                 font-size: 1.3em;
  275.                 width: 285px;
  276.                 padding: 5px;
  277.                 color: #000;
  278.                 background: #fff url("images/textarea_back.png") no-repeat top left;
  279.                 border: none;
  280.         }
  281.        
  282.         #kontakt_info_part {
  283.                 float: left;
  284.                 width: 220px;
  285.                 margin: 43px 0 0 35px;
  286.                 color: #0B1836;
  287.                 font-size: .9em;
  288.                 line-height: 1.4em;
  289.                 border-top: 2px solid #CEC5C6;
  290.                 border-left: 1px solid #CEC5C6;
  291.         }
  292.  
  293.         #kontakt_info_part h4 {
  294.                 color: #89211B;
  295.                 font-size: 1.4em;
  296.                 line-height: 1.6em;
  297.                 margin: 0 0 10px 0px;
  298.                 padding-left: 20px;
  299.         }
  300.        
  301.         #kontakt_info_part p {
  302.                 padding-left: 20px;
  303.                 margin: 5px 0 10px 0;
  304.         }
  305.        
  306.         #knjiznica-logo {
  307.                 margin: 30px 0 0 15px;
  308.                 background: #fff url("images/rudjer.png") no-repeat top left;
  309.                 height: 168px;
  310.                 width: 210px;
  311.         }
  312.        
  313. /*      #image.scientist4 {
  314.                 background: #fff url("images/scientist13.jpg") no-repeat center center;
  315.                 margin-top: 15px;
  316.                 width: 233px;
  317.                
  318.                 float: left;
  319.         }*/
  320.        
  321.         #error_message {
  322.                 background: #ccc;
  323.                 color:#89211B;
  324.                 font-size:0.8em;
  325.                 text-align: left;
  326.                 margin: 10px 20px 10px 20px;
  327.                 padding: 10px 15px;
  328.                 border-top: 5px solid #89211B;
  329.                 border-bottom: 5px solid #89211B;
  330.                 font-weight: bold;
  331.         }
  332.        
  333.         #message {     
  334.                 width: 376px;
  335.                 margin: 40px 20px 0 0px;
  336.                 float: left;
  337.         }
  338.        
  339.         #kontakt_info_part li {
  340.                 height: 16px;
  341.                 display: block;
  342.                 padding-left: 35px;
  343.                 margin: 0 0 5px 20px;
  344.                 font-size: .8em;
  345.                 font-weight: bold;
  346.         }
  347.        
  348.         li.phone {
  349.                 background: transparent url("images/phone.gif") no-repeat left 1px;
  350.                
  351.         }
  352.        
  353.         li.mail {
  354.                 background: transparent url("images/mail.gif") no-repeat left 1px;
  355.         }
  356.                        
  357. /* footer */
  358.  
  359. #footer {
  360.         text-align: center;
  361.         margin: 100px 27px 0 27px;
  362.         padding: 15px;
  363.         border-top: 1px solid #efefef;
  364.         font-size: .85em;
  365.         clear: both;
  366. }