/*  
Theme Name:    Vidolio
Theme URI:     http://www.alpen-themes.com/
Description:   Designed by Alpen Themes & Developed by Zeljan Topic.
Version:       1.0
Author:        BizzArtic & Alpen Themes
Author URI:    http://bizzartic.com/
*/

/*=== Setup ===*/

/* Import RESET styling for grid framework*/
@import url('library/css/reset.css');

/* Import TEXT styling for grid framework*/
@import url('library/css/text.css');

/* Import GRID styling for grid framework*/
@import url('library/css/960.css');

/*---------GENERAL STYLING--------- */
body{ font-family:Arial; background:#F8F8F8 }
a{ color:#000000; text-decoration: none; }
  a:hover{ text-decoration:underline }
input,select,textarea{ border: #e6e6e6 1px solid; font-size: 12px; padding: 2px }
.fix{ clear: both; height: 1px; margin: -1px 0 0; overflow: hidden }
.fl{ float: left }
.fr{ float: right }
.ac{ text-align: center }
.ar{ text-align: right }
img.centered{ display: block; margin-left: auto; margin-right: auto }
img.alignright{ padding:0; margin: 3px 0 2px 10px; display: inline }
img.alignleft{ padding:0; margin: 3px 10px 2px 0; display: inline }
.alignleft{ float: left }
.alignright{ float: right }
.button { padding:10px 0 0 0 }
.button a { background:#959595; color:#ffffff; text-transform:uppercase; padding:8px 30px; font:bold 12px Arial }
.wp-caption{ background:#f6f6ed; border:6px solid #f6f6ed }
.wp-caption img{ border:5px solid #f6f6ed }
.wp-caption a{ border:none }
.wp-caption a:hover{ background:none }
.wp-caption p{ color:#777777; background:#f6f6ed; font:normal 11px Georgia; text-align:center; line-height:17px; padding:0 10px 10px 10px; margin:0 }

	
/*--------- HEADER --------- */
.header-bgr{ background:#242424 url(images/bg-tile-black.png) no-repeat top center; padding:10px 0 }

.header-bgr #logo-spot{ padding:0; margin:10px 0 0 10px }
.header-bgr h1.logo { padding:0; margin:0; line-height:10px }
.header-bgr h1.logo a:hover{ background:none }

.header-bgr #login { position:relative; margin:0 0 0 10px }
.header-bgr #login .login-slogan { float:right; color:#ffffff; font:normal 20px Tahoma; padding:30px 0 0 0; margin:0; width:385px; height:20px }
.header-bgr form#collaboroo_login { float:right; padding:0 25px 0 0; _padding:0 5px 0 0 }
.header-bgr #login .block{ padding-top:5px; margin:0 0 0 20px; _margin:0 0 0 10px }
.header-bgr #login .block label{ color:#999999; font:bold 10px Arial; padding:0 0 0 3px; line-height:20px; text-transform:uppercase }
.header-bgr #login .block input{ background:#3D3D3D; border:2px solid #3D3D3D; color:#d4d4d4; padding:4px 5px 5px 5px; margin:0; width:135px }
.header-bgr #login .block input:focus{ background:#ffffff; border:2px solid #ffffff; color:#444}
.header-bgr #login .block span.helper{ padding:0 0 0 1px; margin:0 }
.header-bgr #login .block span.helper a{ font:bold 9px Arial; text-transform:uppercase; border:0; color:#1E93DB }
.header-bgr .buttons { margin:25px 0 0 10px; width:50px; display:inline; float:left }
.header-bgr .buttons button { float:none; background:transparent url(images/login-button.png) no-repeat top center; border:none; color:#ffffff; font:bold 12px Arial; text-transform:uppercase; padding:6px 10px; margin:0 0 0 10px; _margin:0; width:61px  }


/*---------TOP NAVIGATION --------- */
.menu-bgr{ background:#E1E1E1 url(images/nav-bgr.png) repeat-x top left; border-top:1px solid #908888; border-bottom:1px solid #5E5D5D; padding:0; margin:0 }
#nav-menu a{ display:block; letter-spacing:0.01em }
#nav-menu li{ float:left; line-height:35px; padding:0; margin:0; background:url(images/nav_sepretor.png) no-repeat right top }
#nav-menu li a{ color:#99CCFF; display:block; margin:0 2px 0 0; padding:9px 11px; font:bold 12px Arial; text-transform:uppercase }
#nav-menu li a:hover{ text-decoration:none }
#nav-menu li a:hover, #nav-menu li.active a{ background: url(images/nav-active.png) repeat-x }
#nav-menu li.category-home a{ border-left:0 }
#nav-menu li.selected-cat a, #nav-menu li.current-cat a,  #nav-menu li.current-cat-parent
#nav-menu li.current_page_item, #nav-menu li.current_page_item a{ background: url(images/nav-active.png) repeat-x }

/*---------TOP DROPDOWN NAVIGATION --------- */
#nav { list-style:none; position:relative; padding:0 0 0 2px; margin:0; background:url(images/nav_sepretor.png) no-repeat left top }
#nav li ul li a{ font-size:11px; padding-top:0 }
#nav li ul li a:hover{ text-decoration:underline }
#nav li ul{ list-style:none; position:absolute; width:15em; left:-999em; margin:0; border:1px solid #5E5D5D }
#nav li:hover ul, #nav li.sfhover ul{ left:auto; z-index:1000 }
#nav li ul li{ background:#272526; line-height:35px; padding:0; width:15em; font-weight:normal }
#nav li ul li a { padding:8px 11px; margin:0 }
#nav li ul li a:hover{ background:#5E5E5E }
#nav li:hover, #nav li.hover{ position:static }
#nav li ul ul{ margin:-31px 0 0 15em }
#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul{ left:-999em; padding:0 }
#nav li:hover, #nav li.sfhover{  }
#nav li ul li ul li, #nav li ul li ul li ul li, #nav li ul li ul li ul li ul li{ margin-top:0 }
#nav li ul li ul, #nav li ul li ul li ul, #nav li ul li ul li ul li ul{  }
#nav li:hover ul ul, #nav li.sfhover ul ul, #nav li:hover ul ul, #nav li:hover ul ul ul, #nav li:hover ul ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul, #nav li.sfhover ul ul ul ul{ left:-999em }
#nav li:hover ul, #nav li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul, #nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul, #nav li li li li.sfhover ul{ left:auto }
select { padding:0 }

/*--------- Featured --------- */
.featured-bgr{ background:#104A73 url(images/bgtile.png) repeat-x top center; border-bottom:1px solid #4E7778; margin-bottom:20px }
.featured-glow-bgr { background:transparent url(images/bg-top-trans.png) no-repeat top center; padding:20px 0 0 0; text-align:left; color:#ffffff; }
.featured img.featured-image { margin: 5px 0px 0 20px; float:right; position:relative }
.featured span.video_button_l { position:absolute; right:20%; top:35%; background:url(images/play-trans.png) no-repeat; width:98px; height:98px }
.featured span.video_button_l:hover { position:absolute; right:20%; top:35%; background:url(images/play-active-trans.png) no-repeat; width:98px; height:98px }
.featured .f_title { font:bold 36px Arial }
.featured .f_description { font:normal 30px Arial; padding:5px 0 0 0; color:#216696 }
.featured .f_buttons { padding:30px 0 0 0 }
.featured .f_buttons a { color:#ffffff }
.featured .f_buttons a.f_button { padding:15px 40px 10px 40px; background:#285B7F }
.featured .f_buttons a.f_button:hover { background:#416F91; text-decoration:none }
.featured .f_buttons span.f_button_t { font:normal 21px Arial }

/*--------- Frontpage --------- */
.fr_page { }
.fr_page .fr_page_t { font:bold 22px Arial; margin:0 0 10px 0; padding:0 }
.fr_page .fr_page_t a { color:#666666 }
.fr_page .fr_page_c { font:normal 14px Arial; color:#666666; line-height:23px }
.fr_page .fr_page_c ul{ margin:20px 0 30px 0 }
.fr_page .fr_page_c li{ font:bold 18px Arial; color:#285b7f; list-style-image:url(images/bullet.png) }

.fr_videos {  }
.fr_videos h3 { font:bold 11px Arial; color:#295b7f; text-transform:uppercase; margin:0 0 10px 0 }
.fr_videos .tut-image { position:relative; float:left; margin:5px 16px 8px 0 }
.fr_videos .last-img { margin:5px 0 8px 0 }
.fr_videos .tut-image img { border:1px solid #285C7F }
.fr_videos .tut-image span.video_button_s { position:absolute; right:30%; top:27%; background:url(images/play-s-trans.png) no-repeat; width:54px; height:54px }
.fr_videos .tut-image span.video_button_s:hover { position:absolute; right:30%; top:27%; background:url(images/play-s-active-trans.png) no-repeat; width:54px; height:54px }
.fr_videos .bvideo-name { font:normal 16px Arial; color:#56b1e8; margin:10px 0; padding:0 10px }

/*--------- Frontpage bacground text --------- */
.fr_bgtext { background:#56B1E8; padding:15px 35px 3px 35px; margin:20px 0 0 0 }
.fr_bgtext .fr_bgtext_t { font:bold 18px Arial; margin:0 0 5px 0; padding:0 }
.fr_bgtext .fr_bgtext_t a { color:#ffffff; text-transform:uppercase }
.fr_bgtext .fr_bgtext_c { font:normal 14px Arial; color:#285b7f; line-height:20px }

.fcontent2 { border-top:1px solid #999999; padding:10px 0; margin-top:30px }
.testimonial {  }
.testimonial blockquote { height:auto; margin:0 0 20px 0; display:block; color:#777777; font:italic 18px "Times New Roman" }
.testimonial span { text-align:right; color:#7C7C7C; text-transform:uppercase; font:bold 14px Arial; display:block; margin:10px 0 0 0; }
.testimonial span a { color:#476F8A }

.fcontent3 { border-top:1px solid #999999; padding:20px 0 0 0 }
.fr_blog { display:inline; float:left }
.fr_blog .fr_blog_t { font:bold 14px Arial; margin:0 0 2px 0 }
.fr_blog .fr_blog_t a { color:#295b7f }
.fr_blog .fr_blog_d { margin:0 0 10px 0; color:#959595; font:normal 14px Arial; }
.fr_blog .fr_blog_e { color:#295b7f; font:normal 14px Arial; line-height:20px }
.fr_blog .fr_blog_m { text-align:right; color:#295b7f; font:normal 14px Arial; line-height:20px }
.fr_blog .fr_blog_m a { color:#295b7f }
.fr_block { display:inline; float:left; margin:0 45px 0 0; width:200px }
.fr_twitter { display:inline; float:left }
.fr_twitter .fr_block{ margin:0; width:200px }
.fr_twitter .fr_block #twitter .twitter-top { background: url(images/twitter-background.png) left top no-repeat; padding:5px 0 0 0 }
.fr_twitter .fr_block #twitter_update_list { background: transparent url(images/twitter-background.png) no-repeat left bottom; padding:5px 0 60px 0; margin:0 }
.fr_twitter .fr_block #twitter_update_list li{ font:bold oblique 14px "Times New Roman"; line-height:23px; list-style:none; margin:0 15px 0 15px; color:#ffffff }
.fr_twitter .fr_block #twitter_update_list li a{ font:normal 12px Arial; text-align:right; display:block; color:#ffffff }
.fr_twitter .fr_block #twitter_update_list li span a{ font:bold oblique 14px "Times New Roman"; display:inline; color:#ffffff }
.fr_twitter .fr_block #twitter .website{ margin:0 0 0 70px; padding:10px 0 40px 0; background: url(images/twitter-icon.png) left top no-repeat; position:relative }
.fr_twitter .fr_block #twitter .follow-text{ position:absolute; left:-70px; top:-25px; padding:5px }
.fr_twitter .fr_block #twitter .follow-text a { color:#56b1e8; font:bold 12px Arial }

h3.fr_title { font:bold 14px Arial; color:#666666 }

/*--------- Content wrap --------- */
.browsing-archive{ padding:0; margin:0; text-align:left }
.archive-spot { padding:5px 0 20px 0 }
.archive-spot h2.top-title { font:bold 24px Arial; padding:0; margin:5px 0 0 0; color:#4496d2 }
.archive-spot .post { display:block; padding:10px 0 15px 0; border-bottom:1px solid #CCCCCC; color:#666666; font:normal 14px Arial; line-height:20px }
.archive-spot .feat { border-bottom:1px solid #989898 }
.archive-spot .post h2 { padding:5px 0 0 0; margin:0 }
.archive-spot .post h2 a{ font:bold 14px Arial; color:#4496d2 }
.archive-spot .post h2 .m-date, .archive-spot .entry h2 .m-date { font:normal 14px Arial; padding:10px 0; color:#4496d2 }
.archive-spot .post h2 .m-date a , .archive-spot .entry h2 .m-date a { color:#4496d2 }
.archive-spot .post a img{ float:right; border:3px solid #676767; margin:0 0 20px 20px }
.archive-spot .post .m-more { text-align:right; color:#4496d2; font:normal 14px Arial; line-height:20px }
.archive-spot .post .m-more a { color:#216696 }

/*=== Entry Content ===*/
.entry { color:#666666 }
.entry h1, .entry h2, .entry h3, .entry h4, .entry h5, .entry h6 { font-weight:bold; padding:10px 0 15px 0; margin:0; color:#4496d2 }
.entry h1 a, .entry h2 a, .entry h3 a, .entry h4 a, .entry h5 a, .entry h6 a { color:#4496d2 }
.entry ul, .entry ol{ padding:5px 0 20px 20px; margin:0 }
.entry ul li{ color: #555555; margin:0 0 0 30px; padding:0 0 5px 0; line-height:24px; list-style-image:url(images/entry-bullet.png) }
.entry ul li ul, .entry ol li ol{ padding:0; margin:10px 0 0 0 }
.entry ol li{ color: #555555; list-style-type:decimal; margin: 0 0 0 30px; line-height: 24px }	
  
.entry blockquote { background:transparent url(images/ico-quote-trans.png) no-repeat 10px 15px; width:80%; height:auto; font-style:italic; margin:0 0 15px 0; padding:15px 25px 1px 55px; display:block }
.entry code{ background:#e9e9e9 }
.entry fieldset { border: 1px solid #cccccc; padding:10px }
.entry p{ line-height:24px }
	  
/*=== Single ===*/
.single-spot{ margin-bottom:20px }
.single-spot .post{ padding:0; margin:0 0 10px 0 }
.single-spot .post img{ float:left }
.single-spot .post h2.feat-t{ display:block; width:100%; padding:20px 0; margin:0 }
.single-spot .post h2.feat-t a{ color:#000000; font:normal 21px Tahoma }

/*=== Page ===*/
.p-featured { position:relative; padding:20px 0 0 0 }
.p-feat-text { position:absolute; left:0; bottom:0; width:40% }
.featured .p_title { font:bold 36px Arial; color:#ffffff; padding:0; margin:0 }
.featured .p_description { font:normal 30px Arial; padding:0; margin:0; color:#216696 }
	  
/*---------PAGE NAVIGATION - pagination --------- */
.pagination { width: 100%; font-size: 12px; font-weight: bold; padding:0 }
.Navi { float: right; padding:25px 0 }
.Navi .on { color:#fff; display: block; float: left; font-size: 12px; padding: 4px 9px; margin-left: 4px; background: #56B1E8 !important }
.Navi a { text-decoration: none !important; border:1px solid #D8D8D8; color:#296388; display: block; float: left; padding: 3px 7px; margin-left: 4px }
.Navi a:hover { color:#296388; background: #e9e9df }
	
/*---------COMMENTS --------- */
#comments h3{ font:normal 17px Arial; padding:0 0 20px 0; margin:0 }
#comments .commentlist { padding:0; margin:0 }
#comments ol{ padding:20px 0; list-style:none }
#comments .comment { margin: 10px 0 0 0; width: 100%;}
#comments .comment a{ text-decoration:none; border-bottom:1px dotted; padding:1px 0 }
#comments .comment a:hover{ color:#000000 }
#comments .comment .meta-left { width: 90px; float:left; color:#aaaaaa }
#comments .comment .meta-left p{ padding:10px 0 0 0; margin:0 }
#comments .comment .meta-left .meta-wrap {width: 90px; overflow: hidden; padding-right: 7px; min-height:70px }
#comments .comment small {font-size: 11px }
* html #comments .comment .text-right { height:70px }
#comments .comment .text-right { min-height:70px; margin:0; background:#ffffff; border:1px dotted #aaaaaa; padding: 12px; margin-left:100px; float:none }
#comments .comment .text-right p { line-height: 18px; padding: 0 0 8px 0 }
#comments ul.children { margin:10px 0 0 20px; padding:0 }
#comments .comment .authcomment{ background:#F7F7F7; border:1px dotted #aaaaaa }
p.commpadd{ padding:0; margin:0 0 10px 0 }
span.comm-reply{ float:right; color:#aaa; padding:5px 0 0 0 }
span.comm-reply a{ font-size:13px; color:#aaa }
.cancel-comment-reply{ padding:0 0 10px 0 }
#respond { padding:10px 0 0 0; margin:0; width:565px }
#respond p{ padding:5px 0; margin:0 }
#respond textarea, .commpadd input{ background:#ffffff; border:1px dotted #aaaaaa }
#respond textarea { margin:0; padding:5px }
p.commpadd input{ line-height:25px; height:25px; padding:5px 0 0 5px }
p.commpadd label{ padding:0 0 0 5px }
input#submit{ font:bold 12px Arial; color:#FFFfff; text-align:center; padding: 5px; background:#56B1E8; border:1px dotted #aaaaaa; margin:0 }

/*---------SIDEBAR --------- */
.sidebar { padding:10px 0 0 0; margin:0 }
.sidebar ul, .sidebar ol{ padding:5px 0; margin:0; color:#336699 }
.sidebar ul a, .sidebar ol a{ font:normal 14px Arial; color:#336699 }
.sidebar ul li{ margin:0; padding:8px 0; list-style:none; line-height:15px }
.sidebar ol li{ list-style-type:decimal; margin: 0 0 0 50px; }	
.sidebar ul li ul{ margin: 0; padding:10px 0 0 0; border:none }
.sidebar ul li ul li{ border:none }

 /*=== Widget styling ===*/
.sidebar .widget { margin:0 0 15px 20px; padding:0 0 15px 0; border-bottom:1px solid #989898 }
.sidebar .widget h3{ color:#333333; padding:5px 10px 5px 0; margin:0 0 10px 0; font:bold 14px Arial; overflow: hidden }
.sidebar .widget h3 a{ color:#333333; padding:5px 10px; margin:0 0 10px 0; font:bold 14px Arial }
.sidebar .widget h3 a.rsswidget{ padding:5px 10px 5px 0 }
.sidebar .widget span.rss-date{ display:block; color:#aaaaaa }
	
.sidebar .widget #searchform label{ visibility:hidden; display:none }
.sidebar .widget #searchform input#s{ border:1px solid #000000; width:120px }
.sidebar .widget #searchform input#searchsubmit{ background:#000000; color:#ffffff; font:bold 12px Arial; }

.sidebar #feedburner a { color:#56b1e8; font:bold 12px Arial; line-height:50px }
.sidebar #feedburner a:hover { text-decoration:none }
.sidebar #feedburner span.text{ margin:-10px 0 0 10px }
	
.sidebar .widget #twitter .twitter-top { background: url(images/twitter-background.png) left top no-repeat; padding:5px 0 0 0 }
.sidebar .widget #twitter_update_list { background: url(images/twitter-background.png) left bottom no-repeat; padding:5px 0 60px 0; margin:0 }
.sidebar .widget #twitter_update_list li{ font:bold oblique 14px "Times New Roman"; line-height:23px; list-style:none; margin:0 15px 0 15px; color:#ffffff }
.sidebar .widget #twitter_update_list li a{ font:normal 12px Arial; text-align:right; display:block; color:#ffffff }
.sidebar .widget #twitter_update_list li span a{ font:bold oblique 14px "Times New Roman"; display:inline; color:#ffffff }
.sidebar .widget #twitter .website{ margin:0 0 0 70px; padding:10px 0 50px 0; background: url(images/twitter-icon.png) left top no-repeat; position:relative }
.sidebar .widget #twitter .follow-text{ position:absolute; left:-70px; top:-25px; padding:5px }
.sidebar .widget #twitter .follow-text a { color:#56b1e8; font:bold 12px Arial }

.sidebar .widget .signup { background:#56B1E8; padding:10px 35px 10px 35px; margin:0 }
.sidebar .widget .signup a { color:#ffffff; font:bold 18px Arial }

.subscribe img{ vertical-align:middle; margin:6px 0 8px }
  
/*=== Footer ===*/  
.foot-intro { background:#285B7F; text-align:center }
.foot-intro .f_buttons { margin:0 0 0 20px; padding:10px 20px; text-align:center; font:normal 18px Arial; color:#ffffff }
.foot-intro .f_buttons a { font:bold 18px Arial; text-transform:uppercase }
.foot-intro .f_buttons a:hover { text-decoration:underline }
.foot-intro .f_buttons a.left { color:#c5e6ff }
.foot-intro .f_buttons a.right { color:#cccccc }

.footer-bgr{ background:#151515 url(images/bgtile.png) repeat-x top center; border-top:1px solid #285B7F; color:#1b4968; padding:15px 0; margin-top:20px }
.footer-bgr a { color:#1b4968 }

.footinfo .block { display:inline; float:left; margin:0 45px 0 0; width:200px }
.footinfo .block a{ color:#1b4968 }
.footinfo .last { margin:0 }
.footinfo .last img{ margin:0 0 10px -7px }
.footinfo .block h3 { font:bold 14px Arial; padding:5px 0; margin:0 0 10px 0; color:#333333 }
.footinfo .block li { margin:0 0 10px 2px; font:normal 11px Arial; color:#1b4968; list-style:none }
.footinfo .block li ul { margin:10px 0 0 10px }

.credentials-bgr{ background:#303132; border-top:1px solid #264F6C; color:#CCCCCC; padding:5px 0 }
.credentials-bgr a { color:#cccccc; font-weight:bold }
.credentials { padding:0 10px; font:normal 11px Arial; }