SitePoint Sponsor

User Tag List

Results 1 to 9 of 9

Thread: Layout Help

  1. #1
    SitePoint Addict avstu's Avatar
    Join Date
    May 2005
    Posts
    297
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Layout Help

    A couple of things..

    Here is the layout: http://avillafan.com/site1/

    • The white gap between the main navigation and the banner - how can i get rid of it?
    • Is it possible for me to centralize the actual links in the blue navigation area?
    • And finally either side of the top menu where i have shortened it the white area appears to be missing - anyway this can be added?


    Here is my CSS:

    Code:
    /*
    
    Theme Name: Megazine
    
    Theme URI: -
    
    Description: Megazine Wordpress Theme
    
    Version: 1.07
    
    Author: Goodlayers
    
    Author URI: http://goodlayers.com
    
    License:
    
    License URI:
    
    */
    
    
    
    /* #Style Reset
    
    ================================================== */
    
    html, body, div, span, applet, object, iframe,
    
    h1, h2, h3, h4, h5, h6, p, blockquote, pre,
    
    a, abbr, acronym, address, big, cite, code,
    
    del, dfn, em, img, ins, kbd, q, s, samp,
    
    small, strike, strong, sub, sup, tt, var,
    
    b, u, i, center,
    
    dl, dt, dd, ol, ul, li,
    
    fieldset, form, label, legend,
    
    table, caption, tbody, tfoot, thead, tr, th, td,
    
    article, aside, canvas, details, embed, 
    
    figure, figcaption, footer, header, hgroup, 
    
    menu, nav, output, ruby, section, summary,
    
    time, mark, audio, video {
    
    	margin: 0; padding: 0; border: 0;
    
    	font-size: 100%; font-family:Verdana, Geneva, sans-serif; vertical-align: baseline; }
    
    article, aside, details, figcaption, figure, 
    
    footer, header, hgroup, menu, nav, section { display: block; }
    
    body { line-height: 1; }
    
    a{ text-decoration: none; }
    
    ol, ul { list-style: none; }
    
    blockquote, q { quotes: none; } 
    
    blockquote:before, blockquote:after,
    
    q:before, q:after { content: ''; content: none; }
    
    table { border-collapse: collapse; border-spacing: 0; }
    
    
    
    /* #Basic Styles
    
    ================================================== */
    
    body {
    
    	line-height: 160%; line-height:1.60; 
    
    	-webkit-text-size-adjust: 100%;
    
    	font-family: HelveticaNeue, "Helvetica Neue", Arial, Helvetica, sans-serif; }
    
    h1, h2, h3, h4, h5, h6 {
    
    	font-weight: normal; line-height: 1; margin-bottom: 15px;
    
    	font-family: HelveticaNeue, "Helvetica Neue", Arial, Helvetica, sans-serif; }	
    
    /*--- web safe font ---* 
    
    	HelveticaNeue, "Helvetica Neue", Arial, Helvetica, sans-serif
    
    	Georgia, "Times New Roman", Times, serif
    
     *--- web safe font ---*/
    
     
    
    p{ margin-bottom: 20px; }
    
    p:last-child{ margin-bottom: 0px;}
    
    
    
    table { border-width: 1px; border-style: solid; width: 100%; }
    
    tr th{ border-bottom-width: 1px; border-bottom-style: solid; text-align: left; }
    
    tr th, tr td{ padding: 9px 20px; border-right: 1px solid; }
    
    tr th:last-child, tr td:last-child{ border-right: 0px; }
    
    table th{ font-weight: bold; }
    
    	
    
    em {  }
    
    strong { font-weight: bold; }
    
    small { font-size: 80%; }	
    
    sup { height: 0; line-height: 1; position: relative; top: -0.6em; 
    
    	vertical-align: baseline !important; vertical-align: bottom; font-size: 10px;}
    
    sub { height: 0; line-height: 1; position: relative; top: +0.2em; 
    
    	vertical-align: baseline !important; vertical-align: bottom; font-size: 10px;}
    
    
    
    ul,ol{ margin-left: 30px; }
    
    ul{ list-style: disc; }	
    
    ol{ list-style: decimal; }
    
    	
    
    blockquote{ margin: 10px 10px 10px 20px; padding: 15px 20px 15px 25px; border-left-width: 3px; border-left-style: solid;
    
    	font-style: oblique; font-size: 17px; font-family: Georgia,"Times New Roman",Times,serif; }
    
    
    
    form, fieldset{ margin-bottom: 20px; }	
    
    
    
    button, input[type="submit"], input[type="reset"], input[type="button"] { 
    
    	margin: 0px; padding: 7px 13px; display: inline-block; font-size: 12px; 
    
    	font-weight: bold; cursor: pointer; border-width: 0px; border-style: solid;
    
    	-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
    
    	
    
    /*	
    
    button, input[type="submit"], input[type="reset"], input[type="button"] { 
    
    	margin: 0px; padding: 6px 12px; display: inline-block; 
    
    	background: url('images/button-gradient.png') repeat-x; font-weight: bold; cursor: pointer; 
    
    	border-width: 1px; border-style: solid;
    
    	-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
    
    button:hover, input[type="submit"]:hover, input[type="reset"]:hover, input[type="button"]:hover {
    
    	background-image: url('images/button-gradient-hover.png'); }
    
    */
    
    	
    
    input[type="text"], input[type="password"], input[type="email"],
    
    textarea, select {  padding: 4px 4px; margin: 0; outline: none; max-width: 100%; margin-bottom: 10px; border-width: 1px; border-style: solid;
    
    	-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; }
    
    input[type="checkbox"], input[type="radio"] { display: inline; margin-bottom: 10px; }	
    
    select { padding: 0; }	
    
    
    
    /* #Wordpress Style
    
    ================================================== */
    
    .alignleft, img.alignleft { float:left; margin: 5px 20px 20px 0px; }
    
    .alignright, img.alignright { float:right; margin: 5px 0px 20px 20px; }
    
    .aligncenter, img.aligncenter { display:block; margin: 5px auto; }
    
    .alignnone, img.alignnone { margin: 5px 20px 20px 0; }
    
    .wp-caption { text-align: center; padding: 8px 3px 5px;
    
    	border-width: 1px; border-style: solid; background: #ffffff;  }
    
    .wp-caption img { border: 0 none; padding: 0; margin: 0; max-width: 98.5%; width: auto; }
    
    .wp-caption p.wp-caption-text { line-height: 1.5; font-size: 10px; margin: 0; }
    
    .wp-smiley { margin: 0 !important; max-height: 1em; }
    
    
    
    .gallery dl {}
    
    .gallery dt {}
    
    .gallery dd {}
    
    .gallery dl a {}
    
    .gallery dl img {}
    
    .gallery-caption {}
    
    
    
    .size-full {}
    
    .size-large {}
    
    .size-medium {}
    
    .size-thumbnail {}
    
    
    
    .sticky{}
    
    .bypostauthor{}
    
    
    
    /* #Custom Style
    
    ================================================== */
    
    .clear { clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; }
    
    
    
    .mb0{ margin-bottom: 0px !important; }
    
    .mb10{ margin-bottom: 10px !important; }
    
    .mb15{ margin-bottom: 15px !important; }
    
    .mb20{ margin-bottom: 20px !important; }
    
    .mb40{ margin-bottom: 40px !important; }
    
    
    
    /*--- color animation ---*/
    
    a{
    
    	transition: color 300ms, background-color 300ms;
    
    	-moz-transition: color 300ms, background-color 300ms;    /* FF3.7+ */
    
    	-o-transition: color 300ms, background-color 300ms;      /* Opera 10.5 */
    
    	-webkit-transition: color 300ms, background-color 300ms; /* Saf3.2+, Chrome */ }
    
    
    
    /* #Theme Style
    
    ================================================== */
    
    
    
    /*--- custom full background ---*/
    
    div.gdl-custom-full-background{ position: fixed; top: -50%; left: -50%; width: 200%; height: 200%; z-index: -1; }
    
    div.gdl-custom-full-background img{ 
    
    	position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto;
    
    	min-width: 50%; min-height: 50%; z-index: -1; }
    
    	
    
    /*--- button ---*/
    
    a.gdl-button{ display: inline-block; font-weight: bold; cursor: pointer; 
    
    	padding: 1px 15px; height: 28px; line-height: 27px; margin-bottom: 20px;
    
    	-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; margin-right: 10px; }
    
    a.gdl-button.small{ padding: 1px 12px; height: 26px; line-height: 26px; font-size: 11px; }
    
    a.gdl-button.large{ padding: 2px 20px; height: 33px; line-height: 34px; font-size: 14px; }
    
    
    
    /*
    
    a.gdl-button{ display: inline-block; font-weight: bold; cursor: pointer; 
    
    	padding: 1px 15px; height: 28px; line-height: 28px;
    
    	border-width: 1px; border-style: solid;  
    
    	background: url('images/button-gradient.png') repeat-x; 
    
    	-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
    
    a.gdl-button:hover{ background-image: url('images/button-gradient-hover.png'); }
    
    */
    
    
    
    /*--- preloader ---*/
    
    .preloader { display: block; background:url(images/loading.gif) center center no-repeat; }
    
    
    
    /*--- logo ---*/
    
    div.logo-wrapper{ text-align: center; margin: 0px 10px; } 
    
    div.logo-wrapper h1{ margin: 0px; visibility: visible !important; } 
    
    div.logo-right-text{ margin: 0px 10px; }
    
    
    /*--- top navigation ---*/
    
    div.top-navigation-wrapper.container{ position: relative; z-index: 20; margin-left: 20px; margin-right: 20px; }
    
    div.top-navigation{ text-align: center; font-size: 11px; line-height: 100%; font-family: Verdana;}
    
    div.top-navigation-left{ float: left; line-height: 17px; margin-left: 10px; margin-top: 0px; }
    
    div.top-navigation-left ul{ margin-left: 0px; list-style: none; }
    
    div.top-navigation-left ul li{ float: left; }
    
    div.top-navigation-left ul li a{ border-right-width: 0px; padding: 0px 9px; }
    
    div.top-navigation-left ul li:last-child a{ border-right: 0px; }
    
    div.top-navigation-right{ float: right; margin-right: 20px; }
    
    div.top-navigation-wrapper-gimmick{ height: 3px; }
    
    
    
    /*--- header top marquee ---*/
    
    div.container-wrapper{ background: url('images/container-wrapper.png'); }
    
    
    
    div.header-wrapper{ position: relative; }
    
    div.header-top-marquee{ position: absolute; right: 20px; top: 0px; width: 45%; }
    
    div.header-top-marquee .marquee-icon { width: 32px; height: 26px; float: left; margin-right: 1px;
    
    	background-position: center center; background-repeat: no-repeat; }
    
    div.header-top-marquee .marquee-wrapper{ overflow: hidden; height: 26px; }
    
    div.header-top-marquee .marquee-wrapper .marquee{ width: 9999px; font-size: 11px; padding: 4px 0px; overflow: hidden; }
    
    div.header-top-marquee .marquee-wrapper .marquee div{ padding: 0px 16px 0px 15px; float: left; 
    
    	background-position: 0 center; background-repeat: no-repeat; }
    
    
    
    /*--- top search ---*/
    
    div.top-search-form{ float: left; }
    
    div.search-wrapper .gdl-search-form form{ margin-bottom: 0px; position: relative; }
    
    div.search-wrapper .search-text{ float: left; }
    
    div.search-wrapper input[type="text"]{ margin: 0px; border: 0px; padding: 6px 26px 6px 10px; 
    
    	height: 14px; line-height: 14px; font-size: 11px; width: 160px; display: block; 
    
    	-webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px;  }
    
    div.search-wrapper input[type="text"]:focus { 
    
    	border: 0px; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; }
    
    div.search-wrapper input[type="submit"]{ width: 10px; height: 10px; padding: 0px; text-indent: -999px; 
    
    	position: absolute; right: 8px; top: 8px; }
    
    
    
    /*--- social icon ---*/
    
    div.social-wrapper { float: left; margin-top: 5px; margin-right: 15px; }
    
    div.social-icon { float: left; margin-right: 10px; cursor: pointer; }
    
    div.social-icon:last-child { margin-right: 0px; }
    
    
    
    /*--- navigation ---*/
    
    div.gdl-navigation-wrapper{ position: relative; }
    
    div.navigation-wrapper{ margin: 0px 10px; }
    
    
    
    div.responsive-menu-wrapper{ margin: 0px 10px; }
    
    div.responsive-menu-wrapper select{ width: 100%; height: 20px; }
    
    
    
    /*--- page title ---*/
    
    div.gdl-header-wrapper{ position: relative; margin: 15px 10px 25px; text-align: left; }
    
    div.row div.gdl-header-wrapper{ margin: 5px 0px 25px 0px; }
    
    h1.gdl-header-title{ font-weight: bold;  margin: 0px; display: inline-block; 
    
    	padding: 3px 15px 3px 0px; margin: 0px 5px 0px 0px; display: block; float: left; }
    
    h3.gdl-header-title{ font-weight: 600; 
    
    	padding: 7px 12px; margin: 0px 5px 0px 0px; display: block; float: left; }
    
    div.gdl-header-gimmick.right{ overflow: hidden; }
    
    
    
    /*--- page content ---*/
    
    div.content-wrapper.container{ padding-top: 25px; overflow: hidden; }
    
    
    
    /*--- sidebar ---*/
    
    div.gdl-page-item.columns{ float: right; }
    
    div.gdl-left-sidebar.columns{ float: left; }
    
    
    
    div.custom-sidebar{ margin-bottom: 45px; position: relative; }
    
    div.row div.custom-sidebar div.gdl-header-wrapper{ margin-bottom: 13px; }
    
    
    
    /*--- footer ---*/
    
    div.footer-wrapper .custom-sidebar-title{ padding-bottom: 8px; font-weight: bold; border-bottom-style: solid; border-bottom-width: 1px;  }
    
    div.footer-top-bar{ height: 3px; }
    
    
    
    /*--- copyright ---*/
    
    div.copyright-wrapper{ margin: 0px 10px; padding: 11px 0px; font-size: 11px; }
    
    div.copyright-left{ float: left; line-height: 1.9; }
    
    div.copyright-right{ float: right; line-height: 1.9; }
    
    
    
    /*-- about author (blog) ---*/
    
    div.about-author-wrapper{ margin-top: 30px; margin-bottom: 30px; padding: 18px; }
    
    div.about-author-avartar{ float: left; margin-right: 20px; }
    
    div.about-author-info{ overflow: hidden; }
    
    h5.about-author-title{ font-size: 18px; margin-top: 3px; margin-bottom: 10px; }
    
    
    
    /*--- rating ---*/
    
    div.gdl-rating{ float: right; margin-top: 15px; }
    
    div.gdl-rating .star{ display: inline-block; width: 14px; height: 13px; margin-right: 5px; background: url('images/star.png'); }
    
    div.gdl-rating .star.half{ background: url('images/star-half.png'); }
    
    div.gdl-rating .star.none{ background: url('images/star-none.png'); }
    
    
    
    /*--- single blog ---*/
    
    div.single-blog{ padding-top: 0px; }
    
    div.single-blog .blog-title{ font-size: 23px; font-weight: bold;  margin-bottom: 5px; margin-top: 5px; }
    
    div.single-blog .blog-info-wrapper{ font-size: 12px;  margin-bottom: 15px; }
    
    div.single-blog .blog-content-wrapper{ overflow: hidden; }	
    
    div.single-blog .blog-content{ padding-top: 10px; }	
    
    div.single-blog .blog-media-wrapper{ margin-bottom: 10px; overflow: hidden; }
    
    div.single-blog .blog-media-wrapper img{ display: block; }
    
    div.single-blog .blog-media-wrapper.gdl-slider .flex-control-nav{ display: none; }
    
    div.single-blog .blog-tag,
    
    div.single-blog .blog-author,
    
    div.single-blog .blog-comment,
    
    div.single-blog .blog-date-wrapper{ float: left; margin-right: 15px; padding-left: 20px; 
    
    	background-position: 0 center; background-repeat: no-repeat; } 
    
    	
    
    div.single-blog .gdl-rating { float: none; margin-bottom: 2px; margin-top: 0; padding-top: 10px; }
    
    
    
    /*--- single portfolio ---*/
    
    div.gdl-single-portfolio{ margin-bottom: 25px; }
    
    div.single-portfolio .port-media-wrapper{ max-width: 68%; width: 68%; float: left; margin-right: 20px; overflow: hidden; }
    
    div.single-portfolio .port-media-wrapper.gdl-slider .flex-control-nav{ display: none; }
    
    div.single-portfolio .port-info-wrapper{ padding-bottom: 25px; margin-bottom: 25px;
    
    	border-bottom-width: 1px; border-bottom-style: solid; }
    
    div.single-portfolio .port-info{ margin-bottom: 6px; }
    
    div.single-portfolio .port-info .head{ font-weight: bold; }
    
    div.single-portfolio .port-nav .port-prev-nav,
    
    div.single-portfolio .port-nav .port-next-nav{ margin-bottom: 25px; float: left; }
    
    div.single-portfolio .port-nav a{ width: 35px; height: 35px; display: block; text-indent: -9999px; margin-right: 5px; }
    
    div.single-portfolio .port-nav .port-next-nav a{ background-position: -35px 0px;}
    
    div.single-portfolio .port-content-wrapper{ overflow: hidden; }
    
    
    
    div.single-portfolio .gdl-related-portfolio{ padding-top: 30px; }
    
    div.row div.gdl-related-portfolio div.gdl-header-wrapper{ margin-bottom: 30px; }
    
    
    
    div.single-portfolio.single-sidebar .port-media-wrapper,
    
    div.single-portfolio.both-sidebar .port-media-wrapper{ max-width: 100%; margin-right: 0px; float: none; margin-bottom: 20px; 
    
     width: auto; }
    
    div.single-portfolio.single-sidebar .port-content-wrapper,
    
    div.single-portfolio.both-sidebar .port-content-wrapper{ overflow: visible; }
    
    div.single-portfolio.single-sidebar .port-nav .port-prev-nav, 
    
    div.single-portfolio.single-sidebar .port-nav .port-next-nav, 
    
    div.single-portfolio.both-sidebar .port-nav .port-prev-nav,
    
    div.single-portfolio.both-sidebar .port-nav .port-next-nav { margin-bottom: 15px; }
    
    
    
    /*--- Leave Reply ---*/
    
    h3.social-share-title{ font-size: 18px; }
    
    div.social-shares ul{ list-style: none; margin-left: 0px; }
    
    div.social-shares ul li{ float: left; margin-right: 8px; margin-bottom: 8px; }
    
    div.social-shares ul li img{ display: block; }
    
    
    
    /*--- Comments ---*/
    
    div.comment-wrapper{  margin-top: 40px; }
    
    div.comment-wrapper .comment-title{  font-size: 18px; }
    
    div.comment-wrapper .comment-form-comment{  margin-right: 40px; }
    
    div.comment-wrapper #reply-title{ font-size: 18px; margin-bottom: 15px; }
    
    
    
    div.comment-wrapper input[type="text"], input[type="password"] {
    
    	width: 320px; height: 20px; max-width: 70%; line-height: 20px; padding: 5px; margin: 5px 5px 25px; float: left; }
    
    div.comment-wrapper textarea{
    
    	height: 165px; width: 590px; max-width: 100%; line-height: 20px; padding: 5px; margin: 5px 5px 25px; }
    
    
    
    div.comment-wrapper input { float: left; }
    
    div.comment-wrapper label { float: left; line-height: 32px; margin: 5px 0px 0px 10px; }
    
    div.comment-wrapper span { line-height: 24px; margin-right: 2px; }
    
    
    
    div.comment-wrapper .comment-form-captcha img { float: left; margin-right: 20px; margin-top: 1px; }
    
    div.comment-wrapper .comment-form-captcha input { float: left; width: 205px; max-width: 40%; }
    
    
    
    ol.comment-list{ margin: 0px; list-style: none; }
    
    ol.comment-list .comment-body{ border-bottom-width: 1px; border-bottom-style: solid; margin-top: 22px; padding-bottom: 22px; }
    
    ol.comment-list ul{ margin: 0px 0px 0px 30px; list-style: none; }
    
    div.comment-avartar{ float: left; }
    
    div.comment-context{ margin-left: 80px; }
    
    span.comment-author{  margin-right: 5px; font-size: 16px; }
    
    span.comment-date{  margin-right: 5px;  font-family: 'Droid Serif'; font-size: 11px;}
    
    span.comment-time{ margin-right: 5px;  }
    
    div.comment-content{ margin-top: 7px; }
    
    
    
    div.comment-wrapper #respond{ margin-top: 30px; }
    
    
    
    /*--- footer ---*/
    
    div.footer-wrapper{ overflow: hidden; }
    
    div.footer-wrapper .custom-sidebar{ margin-bottom: 40px; }
    
    div.footer-container{ margin-top: 40px; }
    
    
    
    /*--- Site map ---*/
    
    .page-wrapper.sitemap-page .custom-sidebar-title{ border: 0; padding-bottom: 0; }
    
    
    
    /* #Page Item
    
    ================================================== */
    
    
    
    /*--- top post slider ---*/
    
    div.top-post-slider .flexslider{ overflow: hidden; }
    
    div.top-post-slider .flexslider ul.slides img{ display: block; float: left; width: 66%; }
    
    div.top-post-slider .flexslider ul.slides .flex-caption{ width: 34%; z-index: 100; padding-right: 1px;
    
    	display: block; position: absolute; top: 0px; right: 0px; bottom: 0px; }
    
    div.top-post-slider .flexslider ul.slides .flex-caption .gdl-slider-title{ background: transparent;
    
    	float: none; margin: 25px 20px 15px 20px; padding: 0px; font-size: 25px; }
    
    div.top-post-slider .flexslider ul.slides .flex-caption .gdl-slider-caption{ background: transparent;
    
    	float: none; margin: 0px 20px 15px 20px; padding: 0px; }
    
    div.top-post-slider .flexslider ul.slides .flex-caption .gdl-slider-read-more{ display: block; margin-top: 10px;  }
    
    
    
    div.top-post-slider .flexslider ul.slides .flex-caption,
    
    div.top-post-slider .flexslider ul.slides .gdl-slider-info,
    
    div.top-post-slider .flex-carousel.carousel-included,
    
    div.top-post-slider .flex-control-nav{ background: #3d001f; }	
    
    	
    
    div.top-post-slider .flex-control-nav{ margin-top: 0px; left: auto; right: 34%; bottom: 0px; padding: 9px 12px; }	
    
    div.top-post-slider .flex-control-nav li { float: left; display: block; margin-right: 8px; }	
    
    div.top-post-slider .flex-control-nav li:last-child { margin-right: 0px; }	
    
    div.top-post-slider .flex-control-nav li a{ width: 9px; height: 9px; 
    
    	background-image: url('images/top-slider-bullet.png'); background-repeat: no-repeat; background-color: #fff; }	
    
    div.top-post-slider .flex-control-nav li a:hover,
    
    div.top-post-slider .flex-control-nav li a.flex-active{ background-image: url('images/top-slider-bullet.png'); 	
    
    	background-position: 0px 0px; } 
    
    
    
    div.top-post-slider .flexslider .flex-direction-nav{ z-index: 99; }	
    
    div.top-post-slider .flexslider .flex-direction-nav li .flex-prev { left: 0px; margin-left: -36px; opacity: 0; }
    
    div.top-post-slider .flexslider .flex-direction-nav li .flex-next { right: 34%; margin-right: -36px; opacity: 0; }
    
    div.top-post-slider .flexslider:hover .flex-direction-nav li .flex-prev { left: 0px; margin-left: 20px; opacity: 1; }
    
    div.top-post-slider .flexslider:hover .flex-direction-nav li .flex-next { right: 34%; margin-right: 20px; opacity: 1; }
    
    
    
    div.top-post-slider .gdl-slider-info{ bottom: 0px; left: 0px; right: 0px; position: absolute; padding: 5px 0px; margin: 0px 20px;
    
    	border-top-style: solid; border-top-width: 1px; font-size: 12px;   }
    
    div.top-post-slider .blog-author,
    
    div.top-post-slider .blog-comment,
    
    div.top-post-slider .blog-date-wrapper{ float: left; margin-right: 15px; padding-left: 20px; 
    
    	background-position: -1 center; background-repeat: no-repeat; } 
    
    	
    
    div.top-post-slider .flex-carousel.carousel-included{ position: absolute; bottom: 0px; right: 34%; width: 250px; }
    
    
    
    /*--- accordion ---*/
    
    ul.gdl-accordion{ list-style: none; margin-left: 0px; }
    
    ul.gdl-accordion li{ position: relative; margin-bottom: 15px; overflow: hidden; } 
    
    ul.gdl-accordion li:last-child{ margin-bottom: 0px; } 
    
    ul.gdl-accordion li .accordion-title{ margin: 0px; padding: 12px 20px 12px 40px;
    
    	cursor: pointer; background-position: 16px center; background-repeat: no-repeat; }
    
    ul.gdl-accordion li .accordion-content{ margin: 0px 20px 20px 40px; }
    
    ul.gdl-accordion li.active .accordion-title{ font-weight: bold; }
    
    
    
    ul.gdl-accordion li ul{ margin-left: 30px; list-style: disc; }
    
    ul.gdl-accordion li li{ background: none; margin: 0px; overflow: visible; }
    
    
    
    /*--- blog ---*/
    
    div.gdl-blog-grid .blog-content-wrapper{ overflow: hidden; }	
    
    div.gdl-blog-grid .blog-media-wrapper{ margin-bottom: 20px; border-bottom-width: 3px; border-bottom-style: solid; overflow: hidden; }
    
    div.gdl-blog-grid .blog-media-wrapper img{ display: block; }
    
    div.gdl-blog-grid .blog-media-wrapper.gdl-slider .flex-control-nav{ display: none; }
    
    div.gdl-blog-grid .blog-title{ font-size: 19px; font-weight: bold;  margin-bottom: 5px; margin-top: 5px; }
    
    div.gdl-blog-grid .blog-content{ padding-bottom: 20px; }
    
    div.gdl-blog-grid .blog-continue-reading{ display: block; padding: 4px 11px; margin: 15px 0px 0px 0px; float: left; }
    
    div.gdl-blog-grid .blog-info-wrapper{ font-size: 12px;  margin-bottom: 10px; }
    
    div.gdl-blog-grid .blog-tag,
    
    div.gdl-blog-grid .blog-author,
    
    div.gdl-blog-grid .blog-comment,
    
    div.gdl-blog-grid .blog-date-wrapper{ float: left; margin-right: 15px; padding-left: 20px; 
    
    	background-position: -1 center; background-repeat: no-repeat; } 
    
    	
    
    div.blog-item-holder{ margin-bottom: 40px; }
    
    div.blog-item-holder .gdl-blog-list{ margin-bottom: 20px; }	
    
    div.gdl-blog-list .blog-media-wrapper{ width: 80px; height: 50px; float: left; margin-right: 15px; overflow: hidden; }
    
    div.gdl-blog-list .blog-media-wrapper img{ display: block; }
    
    div.gdl-blog-list .blog-media-wrapper.gdl-slider .flex-control-nav{ display: none; }
    
    div.gdl-blog-list .blog-media-wrapper.gdl-slider .flex-direction-nav{ display: none; }
    
    div.gdl-blog-list .blog-comment,
    
    div.gdl-blog-list .blog-date-wrapper{ float: left; margin-right: 15px; padding-left: 20px; 
    
    	background-position: -1 center; background-repeat: no-repeat; } 
    
    div.gdl-blog-list .blog-title{ font-size: 13px; font-weight: bold;  margin-bottom: 5px; margin-top: 0px; }	
    
    div.gdl-blog-list .blog-info-wrapper{ font-size: 12px;  margin-bottom: 10px; }
    
    div.gdl-blog-list .blog-context-wrapper{ overflow: hidden; }
    
    div.gdl-blog-list .gdl-rating { float: left; margin-top: 5px; }		
    
    
    
    div.blog-item-holder .gdl-blog-medium{ margin-bottom: 10px; } 
    
    div.gdl-blog-medium .blog-content-wrapper{ overflow: hidden; }	
    
    div.gdl-blog-medium .blog-media-wrapper{ margin-bottom: 20px; margin-right: 20px; float: left; width: 48%; overflow: hidden; }
    
    div.gdl-blog-medium .blog-media-wrapper img{ display: block; }
    
    div.gdl-blog-medium .blog-media-wrapper.gdl-slider .flex-control-nav{ display: none; }
    
    div.gdl-blog-medium .blog-context-wrapper{ overflow: hidden; }
    
    div.gdl-blog-medium .blog-title{ font-size: 19px; font-weight: bold;  margin-bottom: 8px; margin-top: 5px; }
    
    div.gdl-blog-medium .blog-content{ padding-bottom: 20px; }
    
    div.gdl-blog-medium .blog-continue-reading{ display: block; padding: 2px 10px; margin: 10px 0px 0px 0px; float: left; }
    
    div.gdl-blog-medium .blog-info-wrapper{ font-size: 12px;  margin-bottom: 10px; }
    
    div.gdl-blog-medium .blog-tag,
    
    div.gdl-blog-medium .blog-author,
    
    div.gdl-blog-medium .blog-comment,
    
    div.gdl-blog-medium .blog-date-wrapper{ float: left; margin-right: 15px; padding-left: 20px; 
    
    	background-position: -1 center; background-repeat: no-repeat; } 
    
    	
    
    div.blog-item-holder .gdl-blog-medium.blog-bullet{ margin-bottom: 0px; } 
    
    div.blog-bullet-wrapper{ margin-bottom: 20px; }	
    
    div.blog-bullet-wrapper .blog-bullet-title{ font-size: 13px; margin-bottom: 5px; width: 50%; float: left; }
    
    div.blog-bullet-wrapper .blog-bullet-title a{ padding-left: 20px; margin-right: 15px; 
    
    	background-repeat: no-repeat; background-position: 0px center; }
    
    
    
    /*--- blog/port pagination ---*/
    
    div.gdl-pagination{ float: right; margin-top: 0px; }
    
    div.gdl-pagination a,
    
    div.gdl-pagination span{ display: block; padding: 5px 9px; margin-left: 5px; float: left; font-size: 12px; } 
    
    
    
    div.portfolio-pagination .gdl-pagination{ margin-top: 0px; }
    
    
    
    /*--- column service ---*/
    
    div.column-service-wrapper.style-1{ text-align: center; margin-bottom: 20px; } 
    
    div.column-service-wrapper.style-1 .column-service-image{ margin-bottom: 15px; }
    
    div.column-service-wrapper.style-1 h2.column-service-title{ font-size: 25px; font-weight: bold; margin-bottom: 5px; }
    
    div.column-service-wrapper.style-1 div.column-service-caption{ font-size: 14px; font-weight: bold; margin-bottom: 5px; } 
    
    div.column-service-wrapper.style-1 div.column-service-content{ padding-top: 10px; } 
    
    
    
    div.column-service-wrapper.style-2{ text-align: left; } 
    
    div.column-service-wrapper.style-2 .column-service-image{ margin-bottom: 6px; margin-right: 15px; float: left; }
    
    div.column-service-wrapper.style-2 div.column-service-title-wrapper{ overflow: hidden; padding-top: 12px; }
    
    div.column-service-wrapper.style-2 h2.column-service-title{ font-size: 20px; font-weight: bold; margin-bottom: 5px; }
    
    div.column-service-wrapper.style-2 div.column-service-caption{ font-size: 15px; font-weight: bold; margin-bottom: 5px; } 
    
    
    
    /*--- contact form ---*/
    
    div.contact-form-wrapper{ padding-top: 20px; }
    
    div.footer-wrapper div.contact-form-wrapper{ padding-top: 5px; }
    
    div.contact-form-wrapper ol{ margin: 0px; list-style: none; }
    
    div.contact-form-wrapper ol li{ margin-bottom: 20px; }
    
    div.contact-form-wrapper ol li.form-textarea,
    
    div.contact-form-wrapper ol li.form-input{ margin-right: 22px;  }
    
    div.contact-form-wrapper ol li.sending-result{ max-width: 622px; display: none; }
    
    div.contact-form-wrapper ol li.sending-result .message-box-wrapper{ padding: 10px 15px 10px 15px; }
    
    div.contact-form-wrapper ol li div.error{ display: none; }
    
    
    
    div.contact-form-wrapper  input[type="text"], input[type="password"] {
    
    	width: 320px; height: 20px; line-height: 20px; padding: 5px; margin: 10px 5px 5px;
    
    	line-height: 20px; max-width: 100%; display: block; }
    
    div.contact-form-wrapper textarea{
    
    	height: 165px; width: 600px; margin: 10px 5px 5px; padding: 5px; max-width: 100%;
    
    	line-height: 20px; display: block; }
    
    	
    
    div.contact-form-wrapper .contact-submit{ float: left; padding: 7px 13px; }
    
    div.contact-form-wrapper .contact-loading{
    
    	width: 16px; height: 16px; float: left; margin: 7px 0px 0px 15px; display:none;
    
    	background: url('images/loading.gif'); }
    
    
    
    
    
    /*--- divider ---*/
    
    div.gdl-divider{ border-bottom-width: 1px; border-style: solid; text-align: right; font-size: 11px;}
    
    div.gdl-divider .scroll-top{ cursor: pointer; }
    
    
    
    /*--- gallery ---*/
    
    div.gdl-gallery-image img{ display: block; }
    
    
    
    /*--- Message Box ---*/
    
    div.message-box-wrapper{ border:1px solid; padding: 20px; margin-bottom: 20px; }
    
    div.message-box-title{ font-weight: bold; font-size: 14px; margin-top: 2px; }
    
    div.message-box-content{ margin-top: 12px; }
    
    
    
    div.message-box-wrapper.red{ background-color: #ffdcdd; border-color: #e9b9bb; color: #713a3c;}
    
    div.message-box-wrapper.red .message-box-title{ color: #8d4345;}
    
    div.message-box-wrapper.yellow{ background-color: #ffffe0; border-color: #e1db8b; color: #4d4d39;}
    
    div.message-box-wrapper.yellow .message-box-title{ color: #737357;}
    
    div.message-box-wrapper.blue{ background-color: #c2e1ee; border-color: #8ec3d9; color: #3d5058;}
    
    div.message-box-wrapper.blue .message-box-title{ color: #475d66;}
    
    div.message-box-wrapper.green{ background-color: #e1ffd9; border-color: #badeb1; color: #435b3d;}
    
    div.message-box-wrapper.green .message-box-title{ color: #526d4b;}
    
    
    
    /*--- personnal ---*/
    
    div.personnal-item .personnal-position{ text-align: center;  font-weight: bold; font-size: 17px; 
    
    	margin-bottom: 10px; padding: 5px 10px; }
    
    div.personnal-item .personnal-thumbnail{ margin: 0px 10px 15px; }
    
    div.personnal-item .personnal-thumbnail img{ display: block; }
    
    div.personnal-item .personnal-title{ margin: 0px 15px 10px; font-size: 18px; line-height: 1; font-weight: bold;  }
    
    div.personnal-item .personnal-content{ margin: 0px 15px; padding-bottom: 15px; }
    
    
    
    /*--- portfolio item ---*/
    
    div.portfolio-item .portfolio-media-wrapper{ overflow: hidden; position: relative; border-bottom-width: 3px; border-bottom-style: solid; }
    
    div.portfolio-item .portfolio-media-wrapper img{ display: block; }
    
    div.portfolio-item .portfolio-media-wrapper.gdl-slider .flex-control-nav{ display: none; }
    
    div.portfolio-item .portfolio-context{ margin-top: 18px; text-align: center; }
    
    div.portfolio-item .portfolio-title{ font-size: 16px; font-weight: bold; margin-bottom: 5px; }
    
    div.portfolio-item .portfolio-tag{  font-size: 12px; }
    
    
    
    div.portfolio-carousel-wrapper{ overflow: hidden; text-align: center; }
    
    div.portfolio-carousel-wrapper .portfolio-item{ float: left; margin-bottom: 20px !important; }
    
    div.portfolio-carousel-wrapper .port-nav{ width: 35px; height: 35px; cursor: pointer; display: inline-block; margin: 0px 3px; }
    
    div.portfolio-carousel-wrapper .port-nav.right{ background-position: -35px 0px; }
    
    
    
    ul.portfolio-item-filter{ list-style: none; margin: 0px 0px 6px 0px; overflow: hidden; }
    
    ul.portfolio-item-filter li{ float: left; margin-right: 5px; }
    
    
    
    span.portfolio-thumbnail-image-hover{
    
    	opacity: 0; filter: alpha(opacity=0); position: absolute; width: 100%; height: 100%; 
    
    	background: url('images/portfolio-overlay.png'); display: block; }
    
    span.portfolio-thumbnail-image-hover span{ 
    
    	top: 50%; left: 50%; margin-left: -23px; margin-top: -23px; width: 46px; height: 46px; 
    
    	position: absolute; display: block; }
    
    span.portfolio-thumbnail-image-hover span.hover-link{ background: url('images/image-overlay-link.png') no-repeat; }
    
    span.portfolio-thumbnail-image-hover span.hover-video{ background: url('images/image-overlay-video.png') no-repeat; }
    
    span.portfolio-thumbnail-image-hover span.hover-zoom{ background: url('images/image-overlay.png') no-repeat; }
    
    
    
    /*--- price item ---*/
    
    div.price-item{ border-bottom-style: solid; border-bottom-width: 1px; text-align: center; }
    
    div.price-item .price-title{ font-size: 20px; font-weight: bold;  padding: 6px 20px;
    
    	border-bottom-style: solid; border-bottom-width: 1px; 
    
    	
    
    	-webkit-border-radius: 3px 3px 0px 0px; 
    
    	-moz-border-radius: 3px 3px 0px 0px; 
    
    	border-radius: 3px 3px 0px 0px; }
    
    div.price-item .price-tag{ font-size: 37px; font-weight: bold; line-height: 1; padding: 25px 20px;
    
    	border-bottom-width: 1px; border-bottom-style: solid; } 
    
    div.price-item .price-tag .price-suffix{ font-weight: normal;  font-size: 21px; margin-left: 5px; } 
    
    div.price-item .price-content{ font-size: 16px; padding: 25px 20px 25px; text-align: center; line-height: 1.9;}
    
    div.price-item .price-content ul li { text-align: left; }
    
    div.price-item .price-button-wrapper{ margin-bottom: 30px; }
    
    div.price-item .price-button{  font-size: 15px; display: inline-block; cursor: pointer; 
    
    	padding: 4px 15px; border-width: 0px; border-style: solid; 
    
    	
    
    	-webkit-border-radius: 3px; -moz-border-radius: 3px;  border-radius: 3px;	}
    
    
    
    /*--- slider ---*/
    
    div.gdl-slider-wrapper{ position: relative; text-align: center; overflow: hidden; }
    
    h2.gdl-slider-title{ font-size: 24px; font-weight: bold; 
    
    	display: block; padding: 8px 22px; margin-bottom: 6px; float: right; }
    
    div.gdl-slider-caption{ font-size: 13px; display: inline-block; padding: 7px 15px; float: right; text-align: left; }
    
    
    
    /*--- stunning text ---*/
    
    h1.stunning-text-title{ font-weight: bold; font-size: 24px;  }
    
    div.stunning-text-wrapper{ padding: 25px 30px; text-align: center; margin: 20px 0px; }
    
    a.stunning-text-button{ padding: 6px 16px; margin: 18px 5px 0px; display: inline-block; font-weight: bold; }
    
    
    
    /*--- tab ---*/
    
    div.gdl-tab ul.gdl-tab-title,
    
    div.gdl-tab ul.gdl-tab-content{ margin: 0px; list-style: none; }
    
    div.gdl-tab ul.gdl-tab-title li{ float: left; margin-right: 3px; }
    
    div.gdl-tab ul.gdl-tab-title li a{ padding: 6px 20px 6px; cursor: pointer; display: block; font-weight: bold;  }
    
    div.gdl-tab ul.gdl-tab-content{ padding: 20px; }
    
    div.gdl-tab ul.gdl-tab-content li{ display: none; }
    
    div.gdl-tab ul.gdl-tab-content li.active{ display: block; }
    
    
    
    /*--- testimonial ---*/
    
    div.gdl-static-testimonial .testimonial-content{ padding: 5px 0px 5px 20px; font-size: 17px;  }
    
    div.gdl-static-testimonial .testimonial-info{ text-align: left; margin-left: 25px; margin-top: 10px;}
    
    div.gdl-static-testimonial .testimonial-author{ font-weight: bold; }
    
    div.gdl-static-testimonial .testimonial-item{  border-left-width: 3px; border-left-style: solid; margin-bottom: 10px; padding-bottom: 10px; }
    
    
    
    div.gdl-carousel-testimonial{ -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
    
    div.gdl-carousel-testimonial { position: relative; }
    
    div.gdl-carousel-testimonial .testimonial-item{ display: none; }
    
    div.gdl-carousel-testimonial .testimonial-item:first-child{ display: block; }
    
    div.gdl-carousel-testimonial .testimonial-content{ padding: 30px 20px 0px 75px; font-size: 22px;  
    
    	background-position: 35px 35px; background-repeat: no-repeat; }
    
    div.gdl-carousel-testimonial .testimonial-info{ text-align: right; padding: 0px 20px 15px 0px; }
    
    div.gdl-carousel-testimonial .testimonial-navigation{ position: absolute; right: 20px; top: 15px; z-index: 100; }
    
    div.gdl-carousel-testimonial .testimonial-prev,
    
    div.gdl-carousel-testimonial .testimonial-next{ width: 4px; height: 7px; padding: 3px 3px; margin-left: 1px; float: left;
    
    	background-repeat: no-repeat; background-position: center center; cursor: pointer; }
    
    
    
    /*--- toggle box ---*/
    
    ul.gdl-toggle-box{ list-style: none; margin-left: 0px; }
    
    ul.gdl-toggle-box li{ position: relative; margin-bottom: 15px; overflow: hidden; } 
    
    ul.gdl-toggle-box li:last-child{ margin-bottom: 0px; } 
    
    ul.gdl-toggle-box li .toggle-box-title{ margin: 0px; padding: 12px 20px 12px 40px;
    
    	cursor: pointer; background-position: 16px center; background-repeat: no-repeat; }
    
    ul.gdl-toggle-box li .toggle-box-content{ margin: 0px 20px 20px 40px; }
    
    ul.gdl-toggle-box li.active .toggle-box-title{ font-weight: bold; }	
    
    
    
    ul.gdl-toggle-box li ul{ margin-left: 30px; list-style: disc; }
    
    ul.gdl-toggle-box li li{ background: none; margin: 0px; overflow: visible; }
    
    	
    
    /* #Shortcode
    
    ================================================== */
    
    
    
    /*--- block quote ---*/
    
    blockquote.left{ width: 33%; float: left;  }
    
    blockquote.right{  width: 33%; float: right; }
    
    blockquote.center{ text-align: center; margin: 10px 10px 20px 20px; }
    
    
    
    /*--- code ---*/
    
    .gdl-code{
    
    	overflow: hidden; padding: 15px; border: 1px #e5e5e5 solid; clear: both; background: #ffffff; color: #777;
    
    	margin-bottom: 20px; color: #555; font-size: 13px;
    
    	font-family: "Consolas", "Bitstream Vera Sans Mono", "Courier New", Courier, monospace !important; }
    
    
    
    /*--- column ---*/
    
    .shortcode1-4{ margin-right: 2%; float: left; margin-bottom: 20px; width: 23%;    }
    
    .shortcode1-3{ margin-right: 2%; float: left; margin-bottom: 20px; width: 31.33%; }
    
    .shortcode1-2{ margin-right: 2%; float: left; margin-bottom: 20px; width: 48%;    }
    
    .shortcode2-3{ margin-right: 2%; float: left; margin-bottom: 20px; width: 64.66%; }
    
    .shortcode3-4{ margin-right: 2%; float: left; margin-bottom: 20px; width: 73%;    }
    
    
    
    .shortcode1-5{ margin-right: 2%; float: left; margin-bottom: 20px; width: 18%; }
    
    .shortcode2-5{ margin-right: 2%; float: left; margin-bottom: 20px; width: 38%; }
    
    .shortcode3-5{ margin-right: 2%; float: left; margin-bottom: 20px; width: 58%; }
    
    .shortcode4-5{ margin-right: 2%; float: left; margin-bottom: 20px; width: 78%; }
    
    
    
    .shortcode1-4.last{ margin-right: 0; width: 25%;    }
    
    .shortcode1-3.last{ margin-right: 0; width: 33.33%; }
    
    .shortcode1-2.last{ margin-right: 0; width: 50%;    }
    
    .shortcode2-3.last{ margin-right: 0; width: 66.66%; }	
    
    .shortcode3-4.last{ margin-right: 0; width: 75%;    }
    
    
    
    .shortcode1-5.last{ margin-right: 0; width: 20%; }
    
    .shortcode2-5.last{ margin-right: 0; width: 40%; }
    
    .shortcode3-5.last{ margin-right: 0; width: 60%; }
    
    .shortcode4-5.last{ margin-right: 0; width: 80%; }
    
    
    
    .shortcode1-1{ width: 100%; }
    
    	
    
    /*--- drop cap ---*/
    
    div.shortcode-dropcap{ margin-top: 2px; margin-bottom: 0px; margin-right: 7px; margin-left: 2px; float: left; font-size: 25px; font-size: 29px; 
    
    	width: 32px; height: 32px; line-height: 32px; text-align: center; float: left; }
    
    div.shortcode-dropcap.circle{ -moz-border-radius: 16px; -webkit-border-radius: 16px; border-radius: 16px; font-size: 18px; margin-right: 10px; }
    
    
    
    /*--- gallery ---*/
    
    div.gdl-gallery-image.shortcode{ margin-right: 20px; margin-bottom: 20px; float: left; }
    
    
    
    /*--- list ---*/
    
    div.shortcode-list ul{ list-style: none !important; margin-left: 0px !important; }	
    
    div.shortcode-list li{ padding:2px 0px 2px 25px !important; border: none !important; margin-bottom: 0px !important;
    
    
    
    	-moz-box-shadow: none !important; 
    
    	-webkit-box-shadow: none !important; 
    
    	box-shadow: none !important; } 
    
    div.shortcode-list.arrow li{ background: url('images/icon/list/arrow.png') no-repeat 0px 4px !important; }
    
    div.shortcode-list.arrow2 li{ background: url('images/icon/list/arrow2.png') no-repeat 0px 4px !important; }
    
    div.shortcode-list.arrow3 li{ background: url('images/icon/list/arrow3.png') no-repeat 0px 5px !important;  }
    
    div.shortcode-list.bullet li{ background: url('images/icon/list/bullet.png') no-repeat 0px 4px !important; }
    
    div.shortcode-list.bullet2 li{ background: url('images/icon/list/bullet2.png') no-repeat 0px 4px !important; }
    
    div.shortcode-list.bullet3 li{ background: url('images/icon/list/bullet3.png') no-repeat 0px 9px !important; }
    
    div.shortcode-list.check li{ background: url('images/icon/list/check.png') no-repeat 0px 4px !important; }
    
    div.shortcode-list.check2 li{ background: url('images/icon/list/check2.png') no-repeat 0px 4px !important; }
    
    div.shortcode-list.check3 li{ background: url('images/icon/list/check3.png') no-repeat 0px 4px !important; }
    
    div.shortcode-list.delete li{ background: url('images/icon/list/delete.png') no-repeat 0px 4px !important; }
    
    div.shortcode-list.delete2 li{ background: url('images/icon/list/delete2.png') no-repeat 0px 4px !important; }
    
    div.shortcode-list.delete3 li{ background: url('images/icon/list/delete3.png') no-repeat 0px 4px !important; }
    
    
    
    /* #Sidebar Widget 
    
    ================================================== */
    
    
    
    /*--- recent post/port widget ---*/
    
    div.gdl-recent-post-widget, div.gdl-recent-port-widget{ padding-top: 7px; }
    
    div.recent-post-widget{ margin-bottom: 20px; }
    
    div.recent-post-widget:last-child{ margin-bottom: 0px; }
    
    div.recent-post-widget .recent-post-widget-thumbnail{ float: left; margin-right: 13px;}
    
    div.recent-post-widget .recent-post-widget-thumbnail img{ display: block; }
    
    div.recent-post-widget .recent-post-widget-context{ overflow: hidden; }
    
    div.recent-post-widget .recent-post-widget-title{ font-size: 13px; font-weight: 600; padding-top: 2px; margin-bottom: 10px; line-height: 1.1; }
    
    div.recent-post-widget .recent-post-widget-info{ font-size: 12px;  }
    
    div.recent-post-widget .recent-post-widget-date,
    
    div.recent-post-widget .recent-post-widget-comment{ padding-left: 18px; float: left; margin-right: 15px; 
    
    	background-position: -1 center; background-repeat: no-repeat;} 
    
    
    
    div.recent-port-widget .recent-port-widget-thumbnail{ float: left; margin-right: 15px; margin-bottom: 15px; }
    
    div.recent-port-widget .recent-port-widget-thumbnail img{ display: block; }
    
    
    
    /*--- flickr widget ---*/
    
    div.flickr-widget .flickr_badge_image{ float: left; margin-right: 10px; margin-bottom: 10px; }
    
    div.flickr-widget .flickr_badge_image img{ display: block; }
    
    
    
    /*--- twitter widget ---*/
    
    ul#twitter_update_list{ font-family: 'Droid Serif';  list-style: none; margin-left: 0px;  }
    
    ul#twitter_update_list li{ padding-left: 0px; background: none; padding-bottom: 8px; border-bottom-width: 1px; border-bottom-style: solid; }
    
    ul#twitter_update_list li:last-child{ border-bottom-width: 0px; }
    
    ul#twitter_update_list li a { display: block; margin-top: 8px; }
    
    ul#twitter_update_list li span a { display: inline-block; margin-top: 0px; margin-right: 6px; padding-left: 2px; }
    
    
    
    /*--- rss widget ---*/
    
    h3.custom-sidebar-title .rsswidget img{ margin-bottom: -1px; margin-right: 3px; }
    
    
    
    /*--- personnal widget ---*/
    
    div.gdl-personnal-widget{ display: inline-block; margin-top: 8px; }
    
    div.personnal-widget-item{ display: none; }
    
    div.personnal-widget-item:first-child{ display: block; }
    
    div.personnal-widget-item .personnal-widget-thumbnail{ margin-bottom: 15px; }
    
    div.personnal-widget-item .personnal-widget-thumbnail img{ display: block; }
    
    div.personnal-widget-item .personnal-widget-info{ font-size: 12px; font-weight: bold; margin-bottom: 10px; }
    
    
    
    div.personnal-widget-navigation{ position: absolute; right: 0px; top: 50%; margin-top: -7px; margin-right: 8px; z-index: 100; }
    
    div.personnal-widget-navigation .personnal-widget-prev,
    
    div.personnal-widget-navigation .personnal-widget-next{ width: 4px; height: 7px; padding: 3px 3px; margin-left: 1px; float: left;
    
    	background-repeat: no-repeat; background-position: center center; cursor: pointer; }
    
    
    
    /*--- search widget ---*/	
    
    div.custom-sidebar .gdl-search-form{ padding-top: 8px; }
    
    div.custom-sidebar #search-text{ margin-right: 22px; }
    
    div.custom-sidebar #searchform{ position: relative; margin-bottom: 0; }
    
    div.custom-sidebar #search-text input[type="text"]{ padding: 6px 5px; margin: 5px 5px; width: 100%; height: 18px; line-height: 18px; }
    
    div.custom-sidebar #searchform br.clear{ display: none; }	
    
    div.custom-sidebar #searchsubmit{ background-color: transparent;
    
    	border: none; position: absolute; top: 6px; right: 9px; }
    
    
    
    div.footer-wrapper #search-text input[type="text"]{ margin: 0px; }
    
    div.footer-wrapper #searchsubmit{ top: 2px; right: 15px; }
    
    	
    
    /*--- contact form ---*/	
    
    div.sidebar-wrapper .contact-form-wrapper{ padding-top: 7px; }
    
    div.sidebar-wrapper .contact-form-wrapper input{ height: 18px; line-height: 18px; }
    
    div.sidebar-wrapper .contact-form-wrapper textarea{ height: 65px; }
    
    
    
    div.footer-wrapper .contact-form-wrapper input{ margin: 5px 0px 0px; height: 18px; line-height: 18px;
    
    	-webkit-box-shadow: none !important; box-shadow: none !important; } 
    
    div.footer-wrapper .contact-form-wrapper textarea{ margin: 5px 0px 0px; height: 65px;
    
    	-webkit-box-shadow: none !important; box-shadow: none !important; } 
    
    div.footer-wrapper .contact-form-wrapper button{ background-image: none; }	
    
    
    
    /*--- tag cloud ---*/
    
    .tagcloud{ display: inline-block; margin-bottom: 13px; margin-top: 8px; }
    
    .tagcloud a{
    
    	font-size: 12px !important; display: block; float: left; padding: 3px 9px 3px 9px; margin-right: 10px;
    
    	margin-bottom: 10px; }
    
    
    
    /*--- sidebar list style ---*/
    
    div.custom-sidebar ul{ list-style: none; margin-left: 0px; }
    
    div.custom-sidebar ul li{ padding: 8px 0px 8px 15px; background-position: 0px 4px; 
    
    border-bottom-style: solid;
    
    border-bottom-width: 1px; }
    
    div.custom-sidebar ul li:last-child{ border-bottom: 0; } 
    
    div.custom-sidebar ul ul{ margin-top: 8px; border-top-width: 1px; border-top-style: solid; }
    
    div.custom-sidebar ul ul li:last-child{ padding-bottom: 0px; }
    
    
    
    /*--- Calendar ---*/
    
    #calendar_wrap{ border-color: inherit; padding-bottom: 10px;}
    
    #wp-calendar{ width: 100%; border-color: inherit; border-width: 0px; }
    
    #wp-calendar caption{ font-size: 13px; font-weight: bold; margin: -1px auto 15px; padding-bottom: 6px; border-bottom: 1px solid; border-color: inherit; }
    
    #wp-calendar td{ padding: 4px; text-align: center; border-right: 0px; }
    
    #wp-calendar th{ padding: 0px; text-align: center; border-right: 0px; border-bottom: 0px; background: transparent;  }
    
    
    
    /*--- flickr widget ---*/
    
    div.custom-sidebar .flickr-widget{ display: block; padding-bottom: 18px; padding-top: 10px; }
    
    div.custom-sidebar .flickr-widget img{ width: 56px; height: 56px; }
    
    div.custom-sidebar .flickr_badge_image{	margin: 0px 15px 15px 0px; float: left;}
    
    
    
    /*--- Text Widget ---*/
    
    div.textwidget{ padding-top: 2px; font-size:10px; font-family:Verdana; }
    
    
    
    /*--- Banner Widget ---*/
    
    div.banner-widget1-2{ width: 50%; float: left; margin-bottom: 0px; margin-top: 11px; }
    
    div.banner-widget1-2 .left{ margin-right: 10px; text-align: right; }
    
    div.banner-widget1-2 .right{ margin-left: 10px; }
    
    div.under-banner-title{ height: 5px; }
    
    
    
    div.banner-widget1-2-outer-wrapper .custom-sidebar{ margin-bottom: 0px; }
    
    div.banner-widget1-2-outer-wrapper.without-title .custom-sidebar{ margin-bottom: 45px; }
    
    
    
    /*--- Tab Widget ---*/
    
    div.gdl-tab-widget-header-wrapper{ margin-bottom: 13px; }
    
    h4.gdl-tab-widget-header-item{ float: left; margin-bottom: 0px; margin-right: 5px; display: block; }
    
    h4.gdl-tab-widget-header-item a{ padding: 8px 14px; cursor: pointer; 
    
    	display: block; font-weight: 600;  font-size: 13px;}
    
    div.both-sidebar h4.gdl-tab-widget-header-item a{ padding: 8px 8px; }
    
    
    
    
    
    div.gdl-tab-widget-content-item{ display: none; }
    
    div.gdl-tab-widget-content-item.active{ display: block; }
    
    
    
    div.gdl-recent-comment-widget{ padding-top: 7px; }
    
    div.recent-comment-widget{ margin-bottom: 20px; }
    
    div.recent-comment-widget:last-child{ margin-bottom: 0px; }
    
    div.recent-comment-widget .recent-comment-widget-thumbnail{ float: left; margin-right: 13px; }
    
    div.recent-comment-widget .recent-comment-widget-thumbnail img{ display: block; }
    
    div.recent-comment-widget .recent-comment-widget-context{ overflow: hidden; }
    
    div.recent-comment-widget .recent-comment-widget-title{ font-size: 13px; font-weight: 600; padding-top: 2px; margin-bottom: 7px; line-height: 1.1;  }
    
    div.recent-comment-widget .recent-comment-widget-info{ font-size: 12px;  }
    
    div.recent-comment-widget .recent-comment-widget-date{ padding-left: 18px; float: left; margin-right: 15px; 
    
    	background-position: 0 center; background-repeat: no-repeat;} 
    
    	
    
    /*--- Social Widget ---*/
    
    div.gdl-social-counter-widget{ padding-bottom: 10px; }
    
    div.social-counter-widget-wrapper{ padding: 22px 14px 20px; }
    
    a.social-counter-widget{ width: 33.33%; float: left; text-align: center; }
    
    a.social-counter-widget span{ display: block; margin: 0px 10px;  font-weight: bold; line-height: 1.3; }
    
    a.social-counter-widget span.icon{ margin-bottom: 6px; }
    
    a.social-counter-widget span.count{ font-size: 16px; }
    
    
    
    div.gdl-social-counter-widget-wrapper .custom-sidebar{ margin-bottom: 20px; }
    
     
    
    /*--- Recent Post Slider Widget ---*/
    
    div.gdl-recent-post-slider-widget-wrapper{ position: relative; }
    
    div.gdl-recent-post-slider-widget .recent-post-slider-widget{ display: none; position: relative; overflow: hidden; }
    
    div.gdl-recent-post-slider-widget .recent-post-slider-widget:first-child{ display: block; }
    
    div.gdl-recent-post-slider-widget .recent-post-slider-thumbnail img{ display: block; }
    
    div.gdl-recent-post-slider-widget .recent-post-slider-caption{ background-color: #000000; position: absolute; 
    
    	bottom: 0px; right: 0px; left: 0px; padding: 10px 20px; text-align: center; opacity: 0.8; filter: alpha(opacity=80); }
    
    div.gdl-recent-post-slider-widget .recent-post-slider-title{ color: #ffffff; margin-bottom: 0px; 
    
    	font-size: 13px; font-weight: bold;  }
    
    div.gdl-recent-post-slider-widget .recent-post-slider-title a{ color: #ffffff; }
    
    
    
    div.recent-post-slider-nav a{ width: 29px; height: 29px; position: absolute; top: 50%; margin-top: -20px; z-index: 10;
    
    	display: block; background: url('images/post_slider_nav.png') no-repeat 0 0; cursor: pointer; }
    
    div.recent-post-slider-nav a.prev{ left: 10px; }
    
    div.recent-post-slider-nav a.next{ right: 10px; background-position: -29px 0px; }
    
     
    
     
    
    /* #Plugin
    
    ================================================== */	
    
    
    
    /*--- Wp socializer ---*/
    
    .wp-socializer-buttons br { display: none; }
    
    
    
    /*--- Isotope ---*/
    
    .isotope-item { z-index: 2; }
    
    .isotope-hidden.isotope-item { pointer-events: none; z-index: 1; }
    
    .isotope,
    
    .isotope .isotope-item {
    
    	-webkit-transition-duration: 0.8s;
    
    	-moz-transition-duration: 0.8s;
    
    	-ms-transition-duration: 0.8s;
    
    	-o-transition-duration: 0.8s;
    
    	transition-duration: 0.8s; }
    
    .isotope {
    
    	-webkit-transition-property: height, width;
    
    	-moz-transition-property: height, width;
    
    	-ms-transition-property: height, width;
    
    	-o-transition-property: height, width;
    
    	transition-property: height, width; }
    
    .isotope .isotope-item {
    
    	-webkit-transition-property: -webkit-transform, opacity;
    
    	-moz-transition-property:    -moz-transform, opacity;
    
    	-ms-transition-property:     -ms-transform, opacity;
    
    	-o-transition-property:         top, left, opacity;
    
    	transition-property:         transform, opacity; }
    
    .isotope.no-transition,
    
    .isotope.no-transition .isotope-item,
    
    .isotope .isotope-item.no-transition {
    
    	-webkit-transition-duration: 0s;
    
    	-moz-transition-duration: 0s;
    
    	-ms-transition-duration: 0s;
    
    	-o-transition-duration: 0s;
    
    	transition-duration: 0s; }
    
    
    
    .navigation-wrapper .cufon[alt=" "] {
    
    display: none !important;
    
    }

  2. #2
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    39,821
    Mentioned
    158 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by avstu View Post
    [*]The white gap between the main navigation and the banner - how can i get rid of it?
    The gap is caused by the image sitting on the baseline (just like text). Set the image to display:block to cure it:

    Code:
    h1 img{display:block}
    [*] Is it possible for me to centralize the actual links in the blue navigation area?
    Try this:

    Code:
    ul.sf-menu,
    #main-superfish-wrapper{
    text-align:center;
    }

  3. #3
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    39,821
    Mentioned
    158 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by avstu View Post
    [*] And finally either side of the top menu where i have shortened it the white area appears to be missing - anyway this can be added?
    You could change the margin to padding on that top section and then set the background to white and then the inner elements to the light blue.

    e.g.
    Code:
    
    div.top-navigation-wrapper.container {
    background:#fff;
    padding:0 20px;
    margin:0;
    position: relative;
    z-index: 20;
    }
    .top-navigation,
    div.top-navigation-wrapper-gimmick {background:#9BBAD9}

  4. #4
    SitePoint Addict avstu's Avatar
    Join Date
    May 2005
    Posts
    297
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you - just the navigation area that didnt work.

    [*] Is it possible for me to centralize the actual links in the blue navigation area?
    I added the code you suggested but it made no impact what so ever.

  5. #5
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    39,821
    Mentioned
    158 Post(s)
    Tagged
    4 Thread(s)
    You placed the code I gave you before a similar rule and therefore the rule was over-ridden.

    This rule wins out:
    Code:
    #main-superfish-wrapper {
        text-align: left;
    }
    Add !important to the rule I gave you if you can't find the other rule.

    e.g.

    Code:
    ul.sf-menu,
    #main-superfish-wrapper{
    text-align:center!important;
    }

  6. #6
    SitePoint Addict avstu's Avatar
    Join Date
    May 2005
    Posts
    297
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Fantastic mate - Youve helped loads!!

    Cant thank you enough - dont know how long i have been messing with that.

    Now all i need to do is try and transfer that exact look to my main /site haha

  7. #7
    SitePoint Addict avstu's Avatar
    Join Date
    May 2005
    Posts
    297
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I have just noticed that the gap I had in between the main banner and the navigation only seems to dissapear on the actual homepage but not all over pages.

    Homepage: http://avillafan.com/site/

    Other page example: http://avillafan.com/site/6752/why-not-westwood-woy/

    Any ideas anyone?

  8. #8
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    39,821
    Mentioned
    158 Post(s)
    Tagged
    4 Thread(s)
    HI,

    You have a different structure on those other pages so you miss the target.

    Try this:

    Code:
    .logo-wrapper img{display:block}

  9. #9
    SitePoint Addict avstu's Avatar
    Join Date
    May 2005
    Posts
    297
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Paul O'B View Post
    HI,

    You have a different structure on those other pages so you miss the target.

    Try this:

    Code:
    .logo-wrapper img{display:block}
    Thank you - it works. Much appreciated!


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •