/*****************************************************************/
/*****************************************************************/
/********                                               **********/
/******** PROXIMUS WEBDSIGN CSS STYLES by Proximus 2010 **********/
/********                                               **********/
/*****************************************************************/
/*****************************************************************/

body
{
         width: 100%;
         height: 100%;
         margin: 0px;
         padding: 0px;
         text-align: center;
}


/**************************************** SUP HEADER STYLES ***/
div#sup-header
{
        width: 100%;
         height: 65px;
         background-image: url(../images/supheaderbg.jpg);
}

div#sup-header-wrapper
{
        width: 980px;
         height: 65px;
         display: inline-block;
}
div#sup-header-logo
{
        width: 200px;
         height: 65px;
         display: inline-block;
         float: left;
         background-image: url(../images/logobiegung.png);
         background-position: center bottom;
         background-repeat: no-repeat;
}

div#sup-header-navigation
{
        width: 750px;
         height: 65px;
         display: inline-block;
         text-align: right;
         padding-right: 30px;
}

a.sup-link
{
        width: 112px;
         height: 39px;
         display: inline-block;
         color: #fff;
         font-family: Arial, Helvetica, sans serif;
         font-size: 11px;
         line-height: 30px;
        text-decoration: none;
         text-align: center;
         outline: none;
         background-image: url(../images/toplinkbg.png);
         background-repeat: no-repeat;
         background-position: 0px 0px;
}
a.sup-link:hover
{
        background-position: 0px -39px;
}



/**************************************** HEADER STYLES ***/
div#header_container
{
         width: 100%;
         height: 350px;
         background-color: #ffffff;
         background-image: url(../images/contentbg.jpg);
         display: inline-block;
         text-align: center;
}


div#header
{
        width: 980px;
         height: 300px;
         background-color: ;
         display: inline-block;
         text-align: left;
         background-image: url(../images/headerbg.png);
         background-position: left bottom;
         background-repeat: no-repeat;
         margin-bottom: 50px;
}

div#logo
{
        width: 200px;
         height: 90px;
         margin: 0px 300px 0px 10px;
         display: inline-block;
         float: left;
         text-align: center;
}
a.logolink
{
        border: none;
         outline: none;
}
a.logolink img
{
        border: none;
        margin-left: -6px;
}
*+html a.logolink img
{
        margin-left: -5px;
}

div#title
{
        width: 540px;
         height: 70px;
         margin: 40px 0px 0px 50px;
         display: inline-block;
         float: left;
}
*+html div#title
{
        margin-top: 60px;
}

h1.sitetitelh1
{
        text-indent: -9999px;
         background-image: url(../images/title.png);
        height: 50px;
}
*html h1.sitetitelh1
{
         height: 70px;
}
a#nadannmallos-link
{
        float: right;
         width: 150px;
         text-indent: -9999px;
         height: 25px;
         background-image: url(../images/nadannmallosbg.png);
         outline: none;
         border: none;
}

div#header-image
{
        width: 290px;
         height: 285px;
         float: right;
         margin-top: 15px;
         border: none;
}




/************************************************* NAVIGATION STYLES ***/

div#navigation_bar
{
         width: 100%;
         height: 86px;
         background-color: #ede6d3;
         background-image: url(../images/navibg2.jpg);
}

div#navi_container
{
         width: 980px;
         height: 86px;
         display: inline-block;
         text-align: left;
}

a.mainlink
{
        font-family: Georgia, Times New Roman, serif;
         font-size: 16px;
         font-weight: bold;
         padding: 15px 0px 30px 52px;
         width: 190px;
         display: inline-block;
         color: #2e3e4e;
         text-shadow: 1px 1px 0px #a19e9f;
         text-decoration: none;
         outline: none;
         /*** Chrome - Safari - Webkit-Browser ***/
         -webkit-transition-property: color, text-shadow;
         -webkit-transition-duration: 0.2s;
         -webkit-transition-timing-function: linear;
         /*** Opera 10.5 ***/
         -o-transition-property: color, text-shadow;
         -o-transition-duration: 0.2s;
         -o-transition-timing-function: linear;
         /*** Vorbereitung für Firefox 3.7 oder höher ***/
         -moz-transition-property: color, text-shadow;
         -moz-transition-duration: 0.2s;
         -moz-transition-timing-function: linear;
}

a.mainlinkactive
{
        font-family: Georgia, Times New Roman, serif;
         font-size: 16px;
         font-weight: bold;
         padding: 15px 0px 30px 52px;
         width: 190px;
         display: inline-block;
         color: #392e1e;
         text-shadow: 1px 1px 0px #a19e9f;
         text-decoration: none;
         outline: none;
         /*** Chrome - Safari - Webkit-Browser ***/
         -webkit-transition-property: color, text-shadow;
         -webkit-transition-duration: 0.2s;
         -webkit-transition-timing-function: ease-in;
         /*** Opera 10.5 ***/
         -o-transition-property: color, text-shadow;
         -o-transition-duration: 0.2s;
         -o-transition-timing-function: linear;
         /*** Vorbereitung für Firefox 4 oder höher ***/
         -moz-transition-property: color, text-shadow;
         -moz-transition-duration: 0.2s;
         -moz-transition-timing-function: linear;
}

a.mainlink:hover, a.mainlinkactive:hover
{
         color: #efefef;
         text-shadow: 1px 1px 0px #333;
}
a#link1
{
         background-image: url(../images/link1bg.png);
}
a#link2
{
         background-image: url(../images/link2bg.png);
}
a#link3
{
         background-image: url(../images/link3bg.png);
}
a#link4
{
         background-image: url(../images/link4bg.png);

}

/************************************************* CONTENT STYLES ***/
div#content_box
{
         width: 100%;
         height: auto;
         min-height: 100px;
         display: inline-block;
         background-image: url(../images/contentbg.jpg);
}

div#content_container
{
         width: 980px;
         height: auto;
         display: inline-block;
         padding: 40px 0px 30px 0px;
         text-align: left;
}

h3
{
        font-variant: small-caps;
         font-size: 11px;
         font-family: Arial, Helvetica, sans serif;
         letter-spacing: 2px;
         color:  #9c8c82;

}

h1
{
        font-family:  Georgia, Times New Roman, serif;
         font-size: 23px;
         font-weight: 400;
         letter-spacing: 1px;
         color: #3d4c65;
         text-shadow: -1px 0px 0px #2e3a4d, 1px 1px 0px #97a4b9;
         padding-bottom: 20px;
}

strong.h1strong
{
        color: #18202e;
         font-weight: 400;
}

h2
{
        font-family: Arial, Helvetica, sans serif;
         font-size: 16px;
         color: #8c7c62;
         font-weight: 600;
         font-style: italic;
         text-shadow: 1px 1px 0px #fff;
         letter-spacing: 2px;
         padding: 0px 0px 20px 0px;
}

img.content-left-image
{
        float: left;
         display: block;
         margin-right: 20px;
         margin-bottom: 20px;
}
p.spacer
{
        width: 100%;
         height: 2px;
         display: inline-block;
}
p.content
{
        padding: 0px;
         margin-bottom: 15px;
         font-family: Georgia, Times New Roman, serif;
         font-size: 14px;
         color: #524239;
         line-height: 30px;
         letter-spacing: 1px;
         text-shadow: 1px 1px 0px #fff;
         /*-ms-filter:progid:DXImageTransform.Microsoft.DropShadow(color=#ffffff,offX=1,offY=15);*/
         filter: dropshadow(color=#ffffff,offX=1,offY=1);
}
a.content-link
{
        text-decoration: none;
         color: #7f94b3;
         outline: none;
}
a.content-link:hover
{
        color: #273241;
}
strong.important-content
{
        font-weight: 400;
         font-style: italic;
         border-bottom: 1px dashed #524239;
}


/************* CONTENT LEFT COLUMN ***/
div#content-left
{
        width: 500px;
         height: auto;
         min-height: 200px;
         float: left;
         padding: 0px 40px 0px 40px;
}


/************ CONTENT RIGHT COLUMN ***/
div#content-right
{
        width: 360px;
         height: auto;
         min-height: 200px;
         float: left;
         margin-left: 40px;
}

img.recent-project-image
{
        margin-top: 43px;
         margin-bottom: 26px;
}

ul#further-projects-list
{
        margin: 0px 0px 35px 20px;
         padding: 0px;
         list-style-type: none;
         font-family: Arial, Helvetica, sans serif;
         line-height: 30px;
         font-size: 14px;
         font-style: italic;
         letter-spacing: 1px;
         display: inline-block;
}
ul#further-projects-list li a
{
        text-decoration: none;
         color: #6a7890;
}
ul#further-projects-list li a:hover
{
         color: #adbad3;
}

a#writemeamail-link
{
        width: 300px;
         height: 50px;
         line-height: 45px;
         text-align: center;
         display: inline-block;
         background-image: url(../images/writemeamail-bg.png);
         text-align: center;
         text-decoration: none;
         color: #65503b;
         outline: none;
}
a#writemeamail-link:hover
{
        font-weight: bold;
}
ul#content-list
{
         list-style-image: url(../images/listbullet.png);
         font-family: Georgia, Times New Roman, serif;
         color: #524239;
         font-size: 13px;

}

ul#content-list li
{
         line-height: 30px;
         height: 30px;
         padding: 0px;
}

span.light
{
        color: #a79885;
}
span.maillink a
{
        color: #524239;
         text-decoration: none;
         padding-right: 16px;
         background-image: url(../images/maillinkicon.jpg);
         background-repeat: no-repeat;
         background-position: center right;
}

span.maillink a:hover
{
        color: #956041;
}

p.content-left
{
        width: 150px;
         float: left;
         padding-right: 10px;
         border-right: 1px solid silver;
         margin-top: 2px;
         padding-top: 0px;
         font-family: Georgia, Times New Roman, serif;
         font-size: 14px;
         color: #524239;
         line-height: 30px;
         letter-spacing: 1px;
         text-shadow: 1px 1px 0px #fff;

}
p.content-right
{
        width: 140px;
         float: right;
         padding-right: 40px;
         margin-top: 2px;
         padding-top: 0px;
         font-family: Georgia, Times New Roman, serif;
         font-size: 14px;
         color: #524239;
         line-height: 30px;
         letter-spacing: 1px;
         text-shadow: 1px 1px 1px #fff;
}

/******************************************** KONTAKT FORMULAR ***/
div#contact
{
        width: 400px;
         height: auto;
         padding: 20px;
         font-family: Georgia;
         font-size: 14px;
}
div#contact-small
{
        width: 300px;
         height: auto;
         padding: 0px;
         font-family: Georgia;
         font-size: 12px;
}

div.form-zeile
{
        width: 100%;
         height: auto;
         padding: 10px 0px 10px 0px;
         display: inline-block;
         float: left;
}
div.form-zeile input, div.form-zeile textarea
{
        -moz-border-radius: 6px;
        -webkit-border-radius: 6px;
        -khtml-border-radius: 6px;
        border-radius: 6px;
         border: 1px solid #bca98e;
         background-color: #d3cfbd;
         padding: 3px 5px 3px 5px;
         font-size: 12px;
         line-height: 14px;
         color: #8d7e62;
         width: 250px;
}
div.form-zeile input:focus, div.form-zeile textarea:focus
{
        background-color: #efede0;
}
div.form-zeile input:hover, div.form-zeile textarea:hover
{
        border: 1px solid #796b4f;
}
span.form-name
{
        width: 100px;
         display: inline-block;
         float: left;
         color: #524239;
         text-shadow: 1px 1px 0px #fff;
         line-height: 20px;
}

input#sendbutton
{
        float: right;
        width: 120px;
         height: 40px;
         margin-right: 36px;
         display: inline-block;
         background-image: url(../images/sendbutton.png);
         border: none;
         background-color: transparent;
         font-family: Georgia;
         color: #5e503f;
}
input#sendbutton:hover
{
        background-image: url(../images/sendbuttonhover.png);
}

/******************************************** DESIGN SHOWCASE ***/

div#showcase-wrapper
{
        width: 960px;
         height: auto;
         display: inline-block;
         text-align: center;
         margin-left: 10px;
         margin-right: 10px;
}

div.design-showcase
{
         width: 182px;
         height: 210px;
         padding: 25px;
         float: left;
         margin: 10px 34px 10px 35px;
         color: #695c41;
         text-shadow: 1px 1px 0px #dad3bc;
         font-style: italic;
         display: inline-block;
}
#business
{
        background-image: url(../images/businessbg.png);
}
#kreativ
{
        background-image: url(../images/kreativbg.png);
}
#elegant
{
        background-image: url(../images/elegantbg.png);
}

span.showcase-text
{
        text-align: left;
         margin-top: 150px;
         display: inline-block;
         line-height: 12pt;
         font-size: 10pt;
}

/************************************************** PORTFOLIO SHOWCASE ***/
div#portfolio-showcase-wrapper
{
        width: 940px;
         height: auto;
         padding: 10px 0px 10px 0px;
}

div.portfolio-showcase
{
        width: 250px;
         height: 200px;
         border: 1px dashed #ccc;
         padding: 9px;
         float: left;
         margin: 20px 10px 20px 10px;
}
a.lightboxlink
{
        outline: none;
}
a.lightboxlink img
{
        border: none;
         display: block;
}

div.portfolio-caption
{
        text-align: right;
         width: 250px;
         height: auto;
         margin-top: 8px;
         font-size: 11px;
         line-height: 14px;
         color: #5b483b;
}
div.portfolio-caption a
{
        color: #857e70;
         font-size: 12px;
         line-height: 14px;
         text-decoration: none;
         padding-left: 3px;
         padding-right: 3px;
}
div.portfolio-caption a:hover
{
        background-color: #857e70;
         color: #efefef;
}

/************************************************* FOOTER STYLES ***/

div#footer-top-line
{
        width: 100%;
         height: 18px;
         background-image: url(../images/footer-top-line-bg.png);
         display: inline-block;
         z-index: 980;

}
div#footer_box
{
         width: 100%;
         height: 200px;
         background-color: #303b4a;
         background-image: url(../images/footerbg.jpg);
         text-align: center;
}
div#footer-container
{
        width: 100%;
         height: 200px;
         background-image: url(../images/footerimage.jpg);
         background-position: center center;
         background-repeat: no-repeat;
         position: relative;
         display: inline-block;
         z-index: 900;
         clear: both;

}

div#footer-content, div#footer-sub-content
{
         width: 300px;
         height: auto;
         padding: 20px;
         margin-left: 20px;
         display: inline-block;
         font-family: Arial, Helvetica, sans serif;
         font-size: 10px;
         color: silver;
         line-height: 18px;
         clear: both;
}

a.footer-link
{
         text-decoration: none;
         color: #fff;
}

div#footer-sub-content
{
         border-top: 1px solid #4f515c;
         line-height: 55px;
}

a.footer-sub-link
{
         color: #fff;
         text-decoration: none;
         border-bottom: 1px dashed #fff;
}
a.footer-sub-link:hover
{
	border-bottom: 1px dashed #0000ff;
}


div#follow-links
{
	width: 130px;
         height: 55px;
         display: inline-block;
}


a#rss-link
{
	width: 58px;
         height: 55px;
         display: inline-block;
         text-indent: -9999px;
         outline: none;
         border: none;
         background-image: url(../images/rssicon.png);
         background-position: 0px 0px;
         background-repeat: no-repeat;
         float: left;
         margin-right: 10px;
}
a#rss-link:hover
{
	background-position: 0px -55px;
}

a#twitter-link
{
	width: 58px;
         height: 55px;
         display: inline-block;
         text-indent: -9999px;
         outline: none;
         border: none;
         background-image: url(../images/twittericon.png);
         background-position: 0px 0px;
         background-repeat: no-repeat;
         float: left;
}
a#twitter-link:hover
{
	background-position: 0px -55px;
}

div#social-bookmarks
{
	width: 140px;
         height: auto;
         padding-top: 10px;
         float: left;
}