/*
----------------------------------------
Abschlussprojekt SAE
WDDF310 - Ionel-Alex Caizer

Copyright © 2007 - 2011
www.ac-computers.de

***** STYLE Website *****


=> Colors <=
html 			#cbcbcb
body bg 		#333


greystripe		#545454


footer bg		#152C3A

-----------------------------------------
*/
@import"reset.css";/* general reset */
@import"menu.css";/* menu styling import */
@import"buttonstyle.css";/* button styling import */
@font-face{font-family:StoneHumanist;src:url(../fonts/StoneHumanistITCStd-Med.otf);}
@font-face{font-family:FedraSans;src:url(../fonts/FedraSans-Book.otf);}
@font-face{font-family:HattoriHanzo;src:url(../fonts/Hattori Hanzo.otf);}
@font-face{font-family:RomanSerif;src:url(../fonts/RomanSerif.ttf);}

/*=== GENERAL ===*/
html{font-family:'Helvetica Neue',Helvetica,Arial,Sans-Serif;font-size:13px;font-size-adjust:0.5;color:#cbcbcb;}/* default style */
body{background:#333 url(../images/texture.jpg);} /* texture as bg */

/* Headlines */
h1{font-family:'FedraSans','StoneHumanist','RomanSerif','Helvetica Neue',Helvetica,Sans-serif;font-size:30px;
padding:25px 0 20px 25px;color:#222;text-shadow:0px 2px 3px #666;text-transform:uppercase;}
.greystripe{background-color:#545454;width:100%;height:78px;position:relative;}/* grey stripe for headlines */

/* headlines in content */
.h3{font-family:'FedraSans','StoneHumanist','RomanSerif','Helvetica Neue',Helvetica,Sans-serif;font-size:22px;font-weight:normal;
color:#35b02b;padding:25px 0 0 0;}
.h4{font-family:'RomanSerif','Helvetica Neue',Helvetica,Sans-serif;font-size:20px;font-variant:normal;color:orange;padding:25px 0 0 0;}

/*=== ANCHORS ===*/
a,a:hover,a:focus,a:visited{text-decoration:none;}

a{color:green;}
a:hover{color:#ffc;}

table#searchresults a.foundsearchresult{font-size:19px;}
/* === END ANCHORS ===*/

/*=== PARAGRAPH STYLES ===*/
p {line-height:1.5em;text-align:left;font-size:13px;}/* general paragraph style */
.center{text-align:center !important;}
.justify{text-align:justify !important;}
p.disclaimer{font-size:10px;line-height:18px;text-align:justify !important;padding:6px 0;}
p.disclaimer span.disclaimer-headline{font-size:12px;font-weight:bold;color:#d5d5d5;}
/*=== END PARAGRAPH STYLES ===*/

.left {float:left;}
.right {float:right;}
.cb {clear:both;width:100%;height:0;display:block;visibility:hidden;overflow:hidden;}
img {border:none;}
.wordwrap{word-wrap:break-word;whitespace:nowrap;}
.acronym{border-bottom:1px dashed #ffc;}


/* SPACER - TRENNER */
.spacer10,.spacer20,.spacer50,.spacer80,.spacer120{clear:both;width:100%;}
.spacer10{height:10px;}
.spacer20{height:20px;}
.spacer50{height:50px;}
.spacer80{height:80px;}
.spacer120{height:120px;}


/* GOOGLE +1 */
#gplusone{margin:15px 0 0 40px;}

/*=== END GENERAL ===*/


/*=== NOSCRIPT ===*/
.noscript-message{height:25px;width:100%;background:#fce9c0 ;font-weight:bold;
border-bottom:2px solid #dbac48;padding:25px 10px 15px 55px;color:#6d6d6d;}
.noscript-message span.jsbold{font-size:13px;font-weight:bold;color:#f00;}
.noscript-message span.jsbold a{color:#902741;}
.noscript-message span.jsbold a:hover{color:#f00;}
/*=== END NOSCRIPT ===*/


/*==== WRAPPER ====*/
#wrapper{width:1000px;margin:0 auto;border-bottom:0;
-moz-box-shadow:0 0 8px #666;
-webkit-box-shadow:0 0 8px #666;
box-shadow:0 0 8px #666;}
/*==== END WRAPPER ====*/


/*==== HEADER ====*/

/* Head */
#head{height:100px;width:960px;padding:20px;position:relative;}
#imgstart{width:1000px;height:210px;}/* teaser-image index */

/*==== SEARCH & SEARCH FEEDBACK MESSAGES ====*/
#search{}


#searchfield{width:140px;font-size:10px;font-weight:bold;background:url(../images/searchfield.png) repeat-x;/* bg searchfield */
position:absolute;right:70px;top:21px;height:auto;color:#ccc;
-moz-border-radius:6px;-webkit-border-radius:6px;padding:4px 6px;border:2px solid #d3d3d3;}
#searchfield:hover,#searchfield:focus{-moz-box-shadow:0 0 3px #fff;-webkit-box-shadow:0 0 3px #fff;color:#fff;}/* hover,focus */

#searchbutton{background:url(../images/searcharrow_off.png)no-repeat;height:26px;width:30px;position:absolute;right:30px;border:none;}
#searchbutton:hover{background:url(../images/searcharrow_on.png)no-repeat;}/* bg searchfield state */

/*==== END SEARCH & SEARCH FEEDBACK MESSAGES ====*/

/* Logo */
#logo{position:absolute;top:20px;left:25px;z-index:10;}
#slogan{position:absolute;top:65px;left:140px;text-shadow:0 0 1px #966;z-index:9;}
/*==== END HEADER ====*/


/*==== NAVI ===*/
#navi{float:right;padding-top:20px;}
/*==== END NAVI ===*/


/*==== CONTENT ====*/
#content-wrapper{min-height:300px;width:1000px;position:relative;}
#content{padding:20px 25px;font-size:16px;line-height:1.5em;min-height:400px;}

.contentleft{width:455px;float:left;padding:0 10px;}

.contentright{width:435px;float:left;padding:0 10px;}

#content p,.contentleft p, .contentright p{text-align:left;color:#cdecde;}

/*=== INDEX PAGE ELEMENTS ===*/
p.index-printdesign,p.index-webdesign,p.index-illustration,p.index-softwarehardware{width:375px;padding:0 0 0 80px;}

.contentleft img{padding-right:10px;}


p.index-aboutmetext{width:375px;padding:20px 30px 0 50px;color:#000;} /* width original 475px */

#banner_start{z-index:10;}

.book{padding:0 0 0 35px;}
.silhouette{padding:0 35px 0 0;position:absolute;top:-44px;left:550px;overflow:visible;}
/*=== END INDEX PAGE ELEMENTS ===*/

/*=== ABOUT PAGE ELEMENTS ===*/
img.profilepicture{height:200px;width:160px;-moz-box-shadow:0 0 4px #ccd;-webkit-box-shadow:0 0 4px #ccd;}

#picbubble{position:relative;} /* relative position - help for wrapping pic & bubble */
#bubble{background:url(../images/bubble.png) no-repeat;width:378px;height:194px;position:absolute;left:180px;top:0;}
#bubblecontent{padding:20px 20px 20px 60px;}
#bubblecontent p.company{color:green;font-size:28px;text-shadow:0 1px 3px darkgreen;}
#bubblecontent p.shortaboutmetext{font-size:15px;font-size-adjust:0.5;}

#aboutcontent{width:50%;}
#watermark{position:absolute;bottom:40px;right:0;width:480px;height:auto;opacity:1;}
/*=== END ABOUT PAGE ELEMENTS ===*/

/* LIST OF SERVICES */
span.listheadline{text-shadow:0 0 2px #555;font-size:18px;font-weight:bold;
line-height:1.2em;font-family:'RomanSerif',Sans-serif;color:orange;}
ul#webdesignlist,ul#printdesignlist,ul#illustrationlist,ul#softwarehardwarelist{padding:10px 0 10px 18px;}
ul#webdesignlist li,ul#printdesignlist li,ul#illustrationlist li,ul#softwarehardwarelist li{
font-size:14px;list-style-type:circle;padding:8px 0 0 20px;}

/*=== WEBDESIGN PAGE ELEMENTS ===*/
.webdesignsmallimage{padding-left:30px;width:350px;}
ul#webdesignlist{}
ul#webdesignlist li{}
/*=== END WEBDESIGN PAGE ELEMENTS ===*/

/*=== PRINTDESIGN PAGE ELEMENTS ===*/
.printdesignsmallimage{padding-left:30px;width:350px;}
ul#printdesignlist{}
ul#printdesignlist li{}
/*=== END PRINTDESIGN PAGE ELEMENTS ===*/

/*=== ILLUSTRATION PAGE ELEMENTS ===*/
.illustrationsmallimage{margin-left:30px;width:350px;
box-shadow:0 0 8px #ffb;-moz-box-shadow:0 0 8px #ffb;-webkit-box-shadow:0 0 8px #ffb;}
ul#illustrationlist{}
ul#illustrationlist li{}
/*=== END ILLUSTRATION PAGE ELEMENTS ===*/

/*=== SOFTWARE HARDWARE PAGE ELEMENTS ===*/
.softwarehardwaresmallimage{padding-left:30px;width:400px;}
ul#softwarehardwarelist{width:480px;}
ul#softwarehardwarelist li{}
/*=== END SOFTWARE HARDWARE PAGE ELEMENTS ===*/


/*=== PROJECTS PAGE ELEMENTS ===*/
#flashprojects{-moz-box-shadow:0 0 5px #fec;-webkit-box-shadow:0 0 5px #fec;border:1px solid #fec;width:900px;margin:0 20px;}
/*=== END PROJECTS PAGE ELEMENTS ===*/

/*=== SERVICE PAGE ELEMENTS ===*/
#randomTilt{text-align:center;}
#randomTilt img{background-color:#152C3A;}
#serviceinfo,#wd_info,#pd_info,#illu_info,#sh_info{position:absolute;right:20px;width:250px;text-align:right;color:#B1C3CD;
text-shadow:#A1BCCA 0px 0px 5px;}
#wd_info img,#pd_info img,#illu_info img,#sh_info img{padding-right:5px;margin-bottom:4px;}
/*=== END PRINTDESIGN ELEMENTS ===*/

/*=== NEWS PAGE ELEMENTS ===*/
.next{margin:-3px;padding:0 4px;}
.prev{margin:-3px;padding:0 4px;}
/*=== END NEWS PAGE ELEMENTS ===*/

/*==== END CONTENT ====*/


/*==== TOOLTIP ====*/
.tinyTip{
width:auto;padding:4px 0 0 2px;line-height:20px;display:block;
background:#340111;
-moz-border-radius:12px;-moz-box-shadow:0 0 2px #ada;
-webkit-border-radius:12px;-webkit-box-shadow:0 0 2px #ada;}
.tinyTip .content{padding:0 10px 0 12px;font-size:10px;font-family:"Lucida Sans Unicode";color:#fff;}
.tinyTip .bottom{height:4px;font: 0/0 sans-serif;}
/*==== END TOOLTIP ====*/



/*==== SCROLLING ====*/
#goTop{background-color:#544;display:inline;padding:8px;-moz-box-shadow:0 0 1px #ddd;-webkit-box-shadow:0 0 1px #ddd;
position:fixed;right:10px;z-index:3;color:#ddd;}
#goTop:hover{color:#fff;}
/*==== END SCROLLING ====*/


/*=================== FORMULARSTYLE ====================*/

/*==== CONTACT FORM ====*/
form#contactform {font-family:"Helvetica Neue",Helvetica;padding-bottom:20px;width:32.5%;position:relative;}
form#contactform label{text-shadow:0 0 1px #ccc;color:#fff;}

input.name_field,input.email_field,input.phone_field{outline:none;width:20em;font-size:15px;color:#000;border:1px solid #ccc;
background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#bcbcbe));
background:-moz-linear-gradient(top,#fff,#bcbcbe);
text-shadow:0 1px 0 #fff;padding:5px;
-webkit-box-shadow:1px 1px 0 #efefef;-moz-box-shadow:1px 1px 0 #efefef;box-shadow:1px 1px 0 #efefef;
-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;
}

.name_field:active,.name_field:hover,.name_field:focus,.email_field:active,.email_field:hover,.email_field:focus,
.phone_field:active,.phone_field:hover,.phone_field:focus,textarea:active,textarea:hover{color:#000;
-moz-box-shadow:0 0 5px #007eff;
-webkit-box-shadow:0 0 5px #007eff;
box-shadow:0 0 5px #007eff;}

textarea{border:1px solid #ccc;padding:6px 5px;font:14px;font-variant:normal;
-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px;
background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#bcbcbe));
background:-moz-linear-gradient(top,#fff,#bcbcbe);}
textarea:hover,textarea:focus{-moz-box-shadow:0 0 5px #007eff;-webkit-box-shadow:0 0 5px #007eff;box-shadow:0 0 5px #007eff;}

.contact_btn{display:inline-block;cursor:pointer;font-size:14px;font-weight:bold;vertical-align:middle;outline:none;
border:none;background-color:#006B54;color:#999;height:33px;padding:5px 10px;
-moz-border-radius:4px;-webkit-border-radius:4px;}
.contact_btn:hover{color:#fff;}

.inputHintOverlay{color:#999 !important;font-size:0.9em;} /* hints @ contactform*/

/* MAIL IMAGE */
#mailimg{position:absolute;left:550px;top:380px;opacity:0;}
/*==== CONTACT FORM END ====*/

/*==== CONTACT FEEDBACK MESSAGES ====*/
#contactfeedback{display:none;position:absolute;top:15em;right:30px;width:auto;max-width:360px;height:auto;color:firebrick;
font-size:12px;background-color:#ffc;padding:15px;
-moz-box-shadow:0 0 8px gold;-moz-border-radius:20px;
-webkit-box-shadow:0 0 8px gold;z-index:999;-webkit-border-radius:20px;}
#contactfeedback h4{font-size:18px;font-weight:bold;}
#contactfeedback h4 span.success{color:green;}
#contactfeedback h4 span.warning{color:red;}
#contactfeedback .warningicon{padding:0 10px 0 0;width:16px;height:16px;}
#contactfeedback ul.success{color:green;}
#contactfeedback ul.warning{color:red;}
#contactfeedback li{line-height:1.8em;list-style:square;margin-left:16px;font-size:13px;font-weight:bold;}
/*==== END CONTACT FEEDBACK MESSAGES ====*/

/*=================== END FORMULARSTYLE ====================*/


/*==== FOOTER ====*/
#footer{background:#152C3A;color:#B1C3CD;padding:40px 10px 40px 20px;width:970px;font-size:11px;text-shadow:#A1BCCA 0px 0px 5px;}
.copyright,.links,.socialmedia{width:320px;}
div.copyright{}
div.links{text-align:center;text-transform:uppercase;}

div.socialmedia span{font-size:12px;padding-left:10px;}

/* FADELINKS */
.fadelinks a{color:#B1C3CD;font-weight:normal;
-moz-transition:font-weight,color,text-shadow 0.5s ease-in;
-webkit-transition:font-weight,color,text-shadow 0.5s ease-in;
-o-transition:font-weight,color,text-shadow 0.5s ease-in;}
.fadelinks a:hover{text-shadow:0 1px 10px #A1BCCA;color:#fff;font-variant:normal;
-moz-transition:color,font-weight,text-shadow 0.5s ease-in;
-webkit-transition:color,font-weight,text-shadow 0.5s ease-in;
-o-transition:font-weight,color,text-shadow 0.5s ease-in;}

/* SOCIAL ICONS - GENERAL */
.social{list-style:none; width:184px;margin:-35px 0 0 80px;}
.social li{display:inline;float:left;background-repeat:no-repeat;}
.social li a{display:block;width:48px;height:48px;padding-right:10px;position:relative;text-decoration:none;}
.social li a strong{font-weight:normal;position:absolute;left:20px;top:-1px; color:#fff;padding:3px;z-index:9999;
text-shadow:1px 1px 0 rgba(0, 0, 0, 0.75);background-color:rgba(0, 0, 0, 0.7);border-radius:3px;box-shadow:0 0 5px rgba(0, 0, 0, 0.5);
-moz-border-radius:3px;-moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
-webkit-border-radius:3px;-webkit-box-shadow:0 0 5px rgba(0, 0, 0, 0.5);
}
li.facebook{background-image:url(../images/icons/facebook.png);}
li.rss{background-image:url(../images/icons/rss.png);}
li.twitter{background-image:url(../images/icons/twitter.png);}

/*==== END FOOTER ====*/