@charset "utf-8";
/******************************************************************
Project: Olivebytes.com
Code by: Milos Zekovic from Etik.Web | etik.rs - miloszekovic.com
******************************************************************/

@import url('font.css');

/* global css */
html, body, div, span, section, article, header, footer, nav, aside, hgroup, h1, h2, h3, h4, h5, h6, p, a, em, font, img, strong, b, u, i, ol, ul, li, fieldset, form, label, select, option, input, textarea, table, tr, td, th { margin:0; padding:0; border:0; outline:none; }
body { background:#f9f9f9; color:#555; text-shadow:0 1px 0 #fff; font-size:13px; }
body, input, textarea { font-family:Arial, Helvetica, sans-serif; }
div, span, section, article, header, footer, nav, aside, hgroup { float:left; }
ul, ol, li { list-style:none; float:left; }
h2, h3, h4, h5 { width:100%; font-weight:normal; color:#1966ab; float:left; font-size:58px; font-family:"CabinRegular", Arial, Helvetica, sans-serif; }
a { color:#5c891a; text-decoration: none; }
a:hover { color:#307cc0; }
a:active { color:#999; }
img { float:left; font-size:13px; }
p { float:left; font-size:13px; line-height:22px; }
a, p a, a img { transition: all 0.2s ease; -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -ms-transition: all 0.2s ease; -o-transition: all 0.2s ease; }

#wrapper { width:100%; }
header, footer, .header, .footer, .home, .marketing, .sepa, .booking, .who, .contact { width:100%; }
.container { width:960px; margin:0 auto 0 auto; float:none; }
.sepa { height:90px; }

/* header */
header { padding-bottom:6px; background:url(../pagefiles/images/ui/shadow.png) bottom repeat-x; position:fixed; z-index:8888; }
.header { height:81px; border-bottom:1px solid #fff; background:url(../pagefiles/images/ui/header_bg.png) repeat-x #589ae6; }
.header h1 { float:left; margin-left:-35px; }
.header ul { width:630px; }
.header ul li { float:right; margin:21px 0 0 5px; }
.header ul li a { display:block; text-transform:uppercase; font-family:"CabinRegular", Arial, Helvetica, sans-serif; font-size:16px; color:#fff; text-shadow:none; background:#3277cb; padding:7px 10px 7px 10px; border:3px solid #69a9f2; border-radius:9px; -webkit-border-radius:9px; }
.header ul li a.active { color:#256cc2; background:#cce2fc; border:3px solid #cce2fc; }

/* footer */
footer { padding-top:6px; background:url(../pagefiles/images/ui/shadow-b.png) top repeat-x; }
.footer { height:81px; border-top:1px solid #fff; background:url(../pagefiles/images/ui/footer_bg.png) repeat-x #589ae6; }
.footer span { width:960px; padding:0 45px 0 62px; height:81px; background:url(../pagefiles/images/ui/foo_line.png) center no-repeat; margin:0 -67px 0 -40px; }
.footer span p { width:400px; margin-top:29px; }
.footer span p a { color:#777; border-bottom:1px solid #fff; }
.footer span ul { width:538px; margin-top:26px; }
.footer span ul li { float:right; margin-left:20px; }

/* home */
.home { background:url(../pagefiles/images/ui/bg_home.png) bottom repeat-x #eefef5; border-bottom:1px solid #fff; padding:100px 0 25px 0; }
.home h2 { width:520px; color:#3277cb; background:url(../pagefiles/images/ui/ob_logo_a.png) right top no-repeat; height:58px; margin-left:215px; }
.home h3, .who h3 { text-align:center; font-size:22px; color:#589ae7; margin-top:10px; }
.home .video { width:650px; height:366px; background:#fff; border:6px solid #fff; border-radius:9px; -webkit-border-radius:9px; margin:20px 0 0 146px; -webkit-box-shadow:0 0 3px 3px #d0d0d0; box-shadow:0 0 3px 3px #d0d0d0; z-index:666; position:relative; }
.home .frame-box { width:958px; padding:70px 0 10px 0; border:1px solid #e0e0e0; background:#f9f9f9; border-radius:9px; -webkit-border-radius:9px; -webkit-box-shadow:inset 0 0 2px 2px #eee; box-shadow:inset 0 0 2px 2px #eee; margin-top:-50px; z-index:555; position:relative; }
.home .frame-box p { width:900px; padding:0 0 10px 29px; text-align:center; font-size:14px; color:#2a6ab4; }
.home .frame-box p a { font-weight:bold; border-bottom:1px solid #5c891a; }

/* marketing */
.marketing { padding-bottom:60px; background:url(../pagefiles/images/ui/shadow.png) top repeat-x, url(../pagefiles/images/ui/bg_mar.png) bottom repeat-x #e9f2fe; }
.marketing h2, .booking h2 { color:#1966ab; background:url(../pagefiles/images/ui/ob_logo_a.png) left top no-repeat; height:58px; padding-left:225px; width:470px; margin-left:245px; }
.marketing .mark-cont, .booking .book-cont { width:960px; height:260px; margin-top:60px; background:url(../pagefiles/images/content/marketing.png) no-repeat; }
.marketing .mark-cont p, .booking .book-cont p { width:436px; padding:18px 22px 0 22px; text-align:justify; clear:both; }
.marketing .mark-cont b, .booking .book-cont b { width:427px; text-align:right; clear:both; float:left; margin-top:27px; }
.marketing .mark-cont b a, .booking .book-cont b a { font-size:16px; font-weight:bold; color:#1966ab; border-bottom:1px solid #1966ab; }
.marketing .mark-cont b a:hover, .booking .book-cont b a:hover { color:#307cc0; }
.marketing .mark-cont b a:active, .booking .book-cont b a:active { color:#999; }

/* booking */
.booking { padding-bottom:60px; background:url(../pagefiles/images/ui/shadow.png) top repeat-x, url(../pagefiles/images/ui/bg_boo.png) bottom repeat-x #ecfde2; border-top:1px solid #fff; }
.booking .book-cont { background:url(../pagefiles/images/content/booking.png) no-repeat; }
.booking .book-cont b a { color:#57ab29; border-bottom:1px solid #57ab29; }

/* who are we */
.who { padding-bottom:60px; background:url(../pagefiles/images/ui/shadow.png) top repeat-x; border-top:1px solid #fff; }
.who h2, .contact h2 { text-align:center; color:#2677d4; }
.who h3 { color:#999; }
.who-text { width:480px; margin:40px 20px 0 0; }
.who-text p { width:436px; padding:0 22px 0 22px; text-align:justify; line-height:20px; margin-top:12px; font-size:12px; }
.team { width:460px; margin-top:43px; }
.team h4 { width:400px; padding-left:22px; font-size:24px; color:#2677d4; }
ul.bjqs { position:relative; overflow:hidden; display:none; }
li.bjqs-slide { display:none; position:absolute; width:460px; }
p.bjqs-caption { display:block; width:460px; position:absolute; bottom:0; }
#slider { margin-top:18px; height:268px; width:460px; position:relative; background:url(../pagefiles/images/content/slider-bg.png) no-repeat; }
#slider ul { height:268px; width:460px; }
#slider ul li { height:254px; width:432px; padding:14px 14px 0 14px; }
ol.bjqs-markers { z-index:7777; position:absolute; bottom:12px; }
ol.bjqs-markers li { width:16px; margin:0 5px 0 5px; }
ol.bjqs-markers li a {  display:block; height:16px; width:16px; overflow:hidden; text-indent:-9999px; background:#9bcbfd; -moz-border-radius:100px; -webkit-border-radius:100px; border-radius:100px; border-bottom:1px solid #fff; }
ol.bjqs-markers li.active-marker a { background:#5cc653; }
.prev, .next { display:none; }
#slider ul li span { margin:0 0 0 22px; width:220px; }
#slider ul li span h4 { font-size:24px; color:#212121; padding:0; width:220px; margin-top:6px; }
#slider ul li span h5 { font-size:14px; color:#888; }
#slider ul li span p { font-size:12px; color:#222; line-height:20px; margin-top:15px; width:205px; }
.separator { width:960px; height:100px; background:url(../pagefiles/images/ui/double-line.png) bottom repeat-x; }

/* contact */
.contact { padding-bottom:90px; }
.contact-text { margin-top:50px; height:276px; background:url(../pagefiles/images/content/cont-left.png) no-repeat; width:436px; padding:15px 41px 0 22px; }
.contact-text p { margin-bottom:20px; width:436px; font-size:18px; line-height:30px; color:#2677d4; }
.contact-text p b { font-size:16px; color:#777; font-weight:normal; }
.contact-text ul { width:436px; }
.contact-text ul li { margin-right:6px; }
.contact-form { width:439px; height:322px; padding:16px 0 0 22px; margin-top:50px; background:url(../pagefiles/images/content/content-right.png) top no-repeat; }
.contact-form h3 { font-size:22px; text-shadow:none; color:#fff; margin-bottom:15px; }

/* hovers and actives */
a img:hover, .header ul li a:hover, .footer span p a:hover { opacity:.80; -moz-opacity:.80; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80); -MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; transition: all 0.2s ease; -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -ms-transition: all 0.2s ease; -o-transition: all 0.2s ease; }
a img:active, .header ul li a:active, .footer span p a:active { opacity:.60; -moz-opacity:.60; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=60); -MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; transition: all 0.2s ease; -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -ms-transition: all 0.2s ease; -o-transition: all 0.2s ease; }