﻿@charset "utf-8";
/*  CSS Document for Buzz Productions */
/*
******************************************************************************************************

Title:			main.css
Browser(s): 	All

Author: 		Marko Prljić (http://www.markoprljic.iz.hr)
Created: 		01.01.2009

******************************************************************************************************
*/


/*-------------------------------DEFINE BODY PROPERTIES----------------------------------------*/



* {
	margin: 0 auto 0 auto; /* GLOBAL RESET */
	padding: 0;
}

div, p, ul, h2, h3, h4, img{
	padding:0px; margin:0px; border:none;
}
ul{
	list-style-type:none;
}
.spacer{
	clear:both; 
	font-size:0px; 
	line-height:0px;
}

a { outline:none; /* Remove Firefox's dotted borders */ text-decoration:none; color:#333; padding:0; margin:0;}
a img { border:none;} /* Remove IE's blue borders */

h1 {font-size: 2em; line-height:1.2em; border:none; margin:10px 0 0 0; padding:0;}/*logo*/
h2 {font-size: 2em; line-height:1.2em; font-weight:normal; border:none; margin:0; padding:20px 0 40px 0;}/*main headings / images */
h3 {font-size: 2em; line-height:1.2em; font-weight:normal; border:none; margin:0; padding:10px 0 0 20px;}/*sub headings / unorderd list */
h4 {font-size: 2em; line-height:1.2em; font-weight:normal; border:none; margin:0; padding:0;}/*box headings*/
h5 {font-size: 1.8em; line-height:1.2em; border:none; margin:0; padding:0; font-weight:normal;}
h6 {font-size: 2.6em; line-height:1em; font-weight:normal; border:none; width:320px; margin:0 0 20px 0; padding:0; float:right;}
p  {font-size: 1.2em; padding:20px 0 20px 0; margin:0; line-height:1.4em;}
p.switch  {font-size: 1.2em; padding:0 10px 0 0; margin:0; line-height:1.4em;}

.small  {font-size: 1.1em; padding:0; line-height:1.4em;}
.big {font-size: 1.4em; padding:0; line-height:1.4em; font-weight:bold; color:#333;}
.white {font-size: 1.2em; padding:0 10px 0 0; line-height:1.4em; color:#fff;}
.fat{ font-weight:bold;}
.cursiv{ font-style:italic;}
.cursiv_big{ font-size:1.4em; font-style:italic; font-weight:bold;}
.green{color:#009933;}
.heading {font-size: 1.4em; font-weight:normal; border:none; margin:0; padding:0;}
.hr{ width:960px; height:74px; margin:40px 0 20px 0; padding:0; background:transparent url(../images/hr.png) top center no-repeat; }

.left{ float:left;}
.left_margin_right{ float:left; margin:0 10px 0 0; font-size:1.2em;}
.left_margin_top{ float:left; margin:50px 0 0 0; font-size:1.2em;}
.left_margin_top_1{ float:left; margin:10px 0 0 0; font-size:1.2em;}
.left_margin_right_top{ float:left; margin:10px 10px 0 0;}
.left_margin_top_right_bot{ float:left; margin:10px 10px 10px 0;}
.left_margin_top_left_bot{ float:left; margin:10px 0 10px 10px;}
.left_margin_top_bot{ float:left; margin:45px 0 10px 0;}
.right{ float:right;}
.right_margin_top{ float:right; margin:-100px 0 0 0;}
.right_margin_right{ float:right; margin:0 20px 0 0;}

/*-------------------------------END----------DEFINE BODY PROPERTIES----------------------------------------*/

.center{width:960px; height:100%; padding:0; margin:0 auto; overflow:hidden;}

.left_side{float:left; width:700px; padding:10px;}
.right_side{ float:left; width:220px; padding:10px;}
.right_side_margin_top{ float:left; width:220px; padding:10px; margin:220px 0 0 0;}
.image_border{float:left; width:98px; height:73px; padding:1px; margin:0 10px 10px 0; background:#fff;}
.image_padding{ padding:2px;}

/*------------------------------CONTENT--------------------------------*/

/*HEADER*/

#header{ width:100%; height:700px;}

/*NAVIGATION*/

.nav ul {margin:50px 0 0 0; padding: 0 0 0 10px; list-style: none; float:left; border-bottom:none; border-left:5px solid #fff; border-right:none; border-top:none;}
.nav ul li{float: left; display: block; margin: 0 10px 0 10px; padding: 0;}
.nav ul li a.button {
/* Sliding right image */
display: block;
float: left;
height: 25px; /* CHANGE THIS VALUE ACCORDING TO IMAGE HEIGHT */
margin-right: 6px;
padding-right: 15px; /* CHENGE THIS VALUE ACCORDING TO RIGHT IMAGE WIDTH */
/* FONT PROPERTIES */
text-decoration: none;
color: #fff;
font-family: Arial, Helvetica, sans-serif;
font-size:14px;
font-weight:normal;
}
.nav ul li a.button span {
/* Background left image */ 

display: block;
line-height: 25px; /* CHANGE THIS VALUE ACCORDING TO BUTTONG HEIGHT */
padding:0 0 0 15px;
} 

.nav ul li a.button:hover {
/* Sliding right image */
background: transparent url(../images/button_right.png) no-repeat scroll top right; 
display: block;
float: left;
height: 25px; /* CHANGE THIS VALUE ACCORDING TO IMAGE HEIGHT */
margin-right: 6px;
padding-right: 15px; /* CHENGE THIS VALUE ACCORDING TO RIGHT IMAGE WIDTH */
/* FONT PROPERTIES */
text-decoration: none;
color: #333;
font-family: Arial, Helvetica, sans-serif;
font-size:14px;
font-weight:normal;
}
.nav ul li a.button:hover span {
/* Background left image */ 
background: transparent url(../images/button_left.png) no-repeat; 
display: block;
line-height: 25px; /* CHANGE THIS VALUE ACCORDING TO BUTTONG HEIGHT */
padding:0 0 0 15px;
}

.nav ul li.selected a {
/* Sliding right image */
background: transparent url(../images/button_right.png) no-repeat scroll top right; 
display: block;
float: left;
height: 25px; /* CHANGE THIS VALUE ACCORDING TO IMAGE HEIGHT */
margin-right: 6px;
padding-right: 15px; /* CHENGE THIS VALUE ACCORDING TO RIGHT IMAGE WIDTH */
/* FONT PROPERTIES */
text-decoration: none;
color: #333;
font-family: Arial, Helvetica, sans-serif;
font-size:14px;
font-weight:normal;
}
.nav ul li.selected a span {
/* Background left image */ 
background: transparent url(../images/button_left.png) no-repeat; 
display: block;
line-height: 25px; /* CHANGE THIS VALUE ACCORDING TO BUTTONG HEIGHT */
padding:0 0 0 15px;
} 

.contact_info{ float:right; width:259px; height:28px; padding:10px; margin:4px 0 0 0; background:transparent url(../images/bg_info.png) top center no-repeat; color:#ccc; text-align:center;}
.contact_info p{ margin:0; padding:0; font-size:1em;}

/*3D CAROUSEL CSS*/
#holder_images, #carouselText { display: none; }
#carousel{ margin:0 150px 0 0;}
#carousel img{border: 1px solid #fff;}
#carousel img.link:hover{border: none;}
.frame{ width:179px; height:133px; background:transparent url(../images/bg_carousel.png) top left no-repeat;}

/*************************************/

/*MAIN CONTENT*/
#wrapper{width:960px; height:100%; padding:0; margin:0 auto; background:transparent url(../images/bg_div.png) top center repeat-y;}
.img_hld{float:right; width:274px; padding:3px; margin:20px 0 20px 20px; background-color:#fff;}
.abcd_images{   bottom:0; padding:0 0 20px 0;}
/*GRAY BOXES*/
.box {width: 220px; padding:0; margin:0 10px 20px 0; color: #333; float:left; position:relative;}
.box_top{width: 220px; height:14px; background:transparent url(../images/b_top.png) top center no-repeat;}
.box_mid{width: 180px; height:480px; padding:10px 20px 0 20px; background:transparent url(../images/b_mid.png) top center repeat-y;}
.box_mid p{ padding:20px 0 0 0; margin:0;}
.box_bot{width: 220px; height:14px; background:transparent url(../images/b_bot.png) bottom center no-repeat;}

/*GREEN BOXES*/
.box_2 {width: 220px; padding:0; margin:20px 10px 20px 0; color: #333; float:left;}
.box_2_top{width: 220px; height:14px; background:transparent url(../images/b_2_top.png) top center no-repeat;}
.box_2_mid{width: 180px; height:470px; padding:10px 20px 0 20px; background:transparent url(../images/b_2_mid.png) top center repeat-y; position:relative;}
.box_2_mid p{ padding:20px 0 0 0; margin:0;}
.box_2_bot{width: 220px; height:14px; background:transparent url(../images/b_2_bot.png) bottom center no-repeat;}

/*BOXES ICONS*/
.icon{ width:54px; height:59px; position:absolute; bottom:20px; left:80px; margin:0; padding: 0;}
.icon_1{ width:54px; height:59px; margin:0; padding:86px 73px 20px 63px;}
.icon_2{ width:54px; height:59px; margin:0; padding:183px 73px 20px 63px;}
.icon_3{ width:54px; height:59px; margin:0; padding:87px 73px 20px 63px;}

.back_top{display:block; overflow:hidden; width:150px; text-align:center; font-size:1.2em; padding:0.5em; margin:20px 0 20px 0; color:#999; background-color:#ddd;}

/*javascript tooltip css*/
#preview{position:absolute;border:1px solid #b6b6b6;background:#fff;padding:5px;display:none;color:#333; font-size:1.1em;}
#tooltip{position:absolute;border:none;background:#000; padding:2px 5px;color:#fff;display:none;}	

ul.listing{ padding:20px; margin:0;}
ul.listing li{ list-style-image: none; background-image:url(../images/bullet.png); background-repeat: no-repeat; background-position: left top; padding:0 0 2px 25px; margin:0 0 10px 0; font-size:1.2em; line-height:1.6em;}

ul.listing_cs{ padding:20px; margin:0;}
ul.listing_cs li{ list-style-image: none; background-image:url(../images/bullet.png); background-repeat: no-repeat; background-position: left top; padding:0 0 2px 25px; margin:0 0 10px 0; font-size:1.4em; line-height:1.4em; font-weight:bold;}

ul.box_listing{ padding:20px 0 0 0; margin:0;}
ul.box_listing li{ list-style-image: none; background-image:url(../images/bullet.png); background-repeat: no-repeat; background-position: left top; padding:0 0 2px 25px; margin:0 0 10px 0; font-size:1.2em;}

ol{padding:20px; margin:0 0 0 20px;}
ol li{padding:0 0 2px 10px; margin:0 0 5px 0; font-size:1.2em;}

#footer { width:100%; height:401px; margin:0; padding:0; background:url(../images/bg_footer.jpg) bottom center no-repeat;}
#footer p{ font-size:1.1em;}

/*------------------------------MAIL FORM--------------------------------*/

form#two { float:left;width:350px;padding:20px 0 0 0;margin:0;}
form#two fieldset {width:100%;padding:0;font-family:Arial, sans-serif;margin:0;border: 0;font-size: 11px;}
form#two input {border:1px solid #a7a7a7; padding:0.5em 0 0 0.5em;margin:5px 0 5px 0; width:220px; height:20px; font-family:Arial,  sans-serif; font-size:1em; color:#666; background:#dfdfdf;}
form#two label{font-family:Arial, sans-serif; color:#333; padding:0;}
form#two textarea {width:300px;height:15em;border:1px solid #a7a7a7;padding:0.5em; margin:10px 0 0 0;overflow:auto; font-family:Arial, sans-serif; font-size:1em; color:#666; background:#dfdfdf;}
form#two #button1 { float:left; color:#666;padding:0;cursor:pointer;width:50px;margin:10px 0 20px 0;border:1px solid #a7a7a7;font-family: Arial, sans-serif;font-size: 11px;}
form#two #button1:hover{margin:10px 0 20px 0;color:#000;font-family: Arial, sans-serif;font-size: 11px;border:1px solid #a7a7a7; background:#dfdfdf; width:50px;}

#details{ float:left; width:220px; padding:0 40px 0 40px;}
#directions{ float:left; width:220px; padding:0 40px 0 40px;}

/*DOWNLAOD BOXES*/
.box_3 {width: 220px; padding:0; margin:20px 10px 20px 0; color: #333; float:left;}
.box_top_3{width: 220px; height:14px; background:transparent url(../images/b_top.png) top center no-repeat;}
.box_mid_3{width: 180px; height:50px; padding:10px 20px 0 20px; background:transparent url(../images/b_mid.png) top center repeat-y;}
.box_mid_3 p{ padding:15px 0 0 20px; margin:0;}
.box_bot_3{width: 220px; height:14px; background:transparent url(../images/b_bot.png) bottom center no-repeat;}