@charset "utf-8";

/* Simple Reset */
*{ padding:0; margin:0; }


/* Sticky Footer Fix */
html, body {height: 100%;}
#wrap, body {min-height: 100%;}
#main {overflow:auto; padding-bottom: 165px;}  /* must be same height as the footer */
#footer {position: relative; margin-top: -125px; /* negative value of footer height */ 
  height: 125px; clear:both;} 
/*Opera Fix*/
body:before { content:""; height:100%; float:left; width:0; margin-top:-32767px;/ }


/* Generic Classes */
.hidden { display:none; }
.wide { width:100%;}
.highlight { background:#25305F; padding:0px 0px 2px 0px; -moz-border-radius: 0.3em; -webkit-border-radius: 0.3em; }
.no_underline, .no_underline:hover { border-bottom:0px dotted #000; }
.section_heading { text-transform:uppercase; border-bottom:2px solid #B3BFC8; color:#444444; font-size:15px; }
.sub { padding-bottom:20px; padding-left:35px; text-transform:capitalize; border-bottom:none; }
.floatright { float:right; }
.floatleft { float:left;  }
.textright { text-align:right; }


a { color:#00365d; text-decoration:none; }
a:hover { border-bottom:1px dotted #00365d; }

body { background:#C9D6E0 url(../images/bg-body.jpg) repeat top left; margin:0px; font-family:"Segoe UI", "Lucida Grande", "Lucida Sans Unicode", sans-serif, Arial; }
/*input[type="text"], textarea, label { font-family:"Segoe UI", "Lucida Grande", "Lucida Sans Unicode", sans-serif, Arial; font-size:13px; line-height:1.5em; color:#444; }*/

#wrap { width:100%; }

#header {   background-color: #151515;  background-image: url(../images/bg-nav.jpg);  background-repeat: repeat-x;  background-position: left top;  width: 100%; }
#header_cont {  width:960px;  margin:0 auto;    height:111px; }
#header_cont .logo { float:left; margin-left:-70px; }

#header_cont ul#nav { float:right; text-transform:uppercase; position:relative; top:0; z-index:999; margin-bottom:-10px; }
#header_cont ul#nav li { display:inline; float:right;   }
#header_cont ul#nav li a { color:#999; display:block; font-family:arial,sans-serif !important; font-size:14px; font-weight:bold; padding-top:40px; text-decoration:none; padding-bottom:46px; padding-left:25px; padding-right:25px; }
#header_cont ul#nav li a span { color:#666 !important; font-family:'Lucida Grande','Lucida Sans Unicode',Tahoma,Arial,san-serif; font-size:11px; font-weight:normal; line-height:16px; text-shadow:none; text-transform:none; }
#header_cont ul#nav li.selected a { color:#FF8F00; background:url(../images/nav-hover.png) no-repeat 45% 100%; border-bottom:0;   }
#header_cont ul#nav li.selected a span#selected { color:#FF8F00;  }
#header_cont ul#nav li a:hover { color:#eee; border:0; }

#teaser { clear:both; position:relative; background-color: #37447B; background-image: url(../images/bg-teaser.jpg); background-repeat: repeat-x; background-position: left top; width: 100%; z-index:9; }
#teaser_art { width:100%; height:415px; background:url(../images/bg-teaser-main-art.jpg) no-repeat top center; }
#teaser_art_pf { width:100%; height:170px; background:url(../images/bg-portfolio-main-art.jpg) no-repeat top center; }
#teaser_art_c { width:100%; height:170px; background:url(../images/bg-contact-main-art.jpg) no-repeat top center; }
#teaser_art_pf #teaser_cont { height:170px; }
#teaser_art_c #teaser_cont { height:170px; }
#teaser_cont { height:415px;   width:960px; margin:0 auto; /* border:1px dotted yellow;*/ } 
#teaser_cont div.wide { float:left; clear:both; } 
#teaser_cont h2 { font-size:22px;  line-height:1.65em; text-shadow:0px -1px 0px #000000; color:#E1E5F5; font-weight:normal; width:438px; padding-bottom:33px; padding-top:184px; }
#teaser_cont h2.subpage { padding-top:92px; }

/* Big Teaser Buttons */
.btnPortfolio {  width:138px; height:42px; background:url(../images/sprite.png) no-repeat -155px 0; border:0; cursor:pointer; }
.btnPortfolio:hover { background-position:-155px -42px; }
.btnPortfolio:active { background-position:-155px -84px; }

.btnContactMe {  width:153px; height:42px; background:url(../images/sprite.png) no-repeat 0 0; border:0; cursor:pointer; }
.btnContactMe:hover { background-position:0 -42px; }
.btnContactMe:active { background-position:0 -84px; }


a.trigger { color: #fff; text-decoration: none; position:relative; top:-20px; margin: 0 auto; }
h2.trigger a:hover { color: #ccc; }
h2.active {background-position: left bottom;} /*--When toggle is triggered, it will shift the image to the bottom to show its "opened" state--*/

#aboutme { clear:both; display:block; width:100%; overflow:hidden; height:197px; }
.toggle_container { position:relative;  background:#1C223C url(../images/bg-aboutme.jpg) repeat top left;   color:#fff; clear: both;  display:block;  width:100%; }
.toggle_container .block { padding: 30px 0; /*--Padding of Container--*/ width:960px; margin:0 auto; padding-left:14px; }
.toggle_container .block div.left { float:left; width:95px; margin-right:25px; border:0px dotted yellow; }
.toggle_container .block h2 { font-size:20px; font-weight:normal; line-height:1em; }
.toggle_container .block p { float:left; width:370px; font-size:14px; color:#acb0bf; line-height:1.7em; margin-top:15px; margin-right:20px; padding-left:15px; border-left:1px dashed #777777; }
.toggle_container .block span.highlight { background:#020A29; padding:0 5px 1px;}
.toggle_container .block div.left a.twitter { float:right; width:13px; height:13px; margin-top:5px; margin-left:5px; background:url(../images/sprite.png) no-repeat -312px -26px; }
.toggle_container .block div.left a.twitter:hover { background-position: -312px -40px;} 
.toggle_container .block div.left a.delicious { float:right; width:13px; height:13px; margin-top:5px; margin-left:5px; background:url(../images/sprite.png) no-repeat -296px -26px; }
.toggle_container .block div.left a.delicious:hover { background-position: -296px -40px;} 
.toggle_container .block div.left a.flickr { float:right; width:13px; height:13px; margin-top:5px; margin-left:5px; background:url(../images/sprite.png) no-repeat -329px -26px; }
.toggle_container .block div.left a.flickr:hover { background-position: -329px -40px;} 


#slider_bot_edge { border-bottom:3px solid #010312; height:0px; }
#slider_bot_edge .wrapper { margin:auto; text-align:left; width:960px; }
#slider_bot_edge .wrapper a { position:relative; z-index:999; }
#slider_tab { position:relative; top:-17px; left:7px; width:0px; height:0px; display:block; padding:27px 0 0 123px; background:transparent url(../images/btn-aboutme.png) no-repeat 0 0; z-index:999; overflow:hidden; }


#main { /*  padding:20px 0; */ position:relative; color:#2a3036; clear:both;  display:block; font-size:13px; line-height:1.5em; text-shadow:0px 1px 0px #fff; }
#main_cont { width:960px; padding-top:40px; padding-bottom:40px; margin:0 auto;    }


#left { width:700px;  float:left;}

#left #slider_wrap { width:100%; border:0px dotted red; clear:both; }

#left #contact_form { clear:both; width:100%; padding-top:10px; }
#left #contact_form h3 { font-size:19px; font-weight:normal; }
#left #contact_form p { padding-top:15px; line-height:1.7em; }

#left #contact_form table { border:0;  margin-top:50px; }
#left #contact_form table td.labels { text-align:right; vertical-align:middle; }
#left #contact_form table td.label_textarea { vertical-align:top; padding-top:15px;}
#left #contact_form label { font-size: 17px;    }
#left #contact_form table td { padding:5px; }
#left #contact_form table input[type="text"], #left #contact_form table textarea { font-size:15px; font-family:Segoe Print,"Comic Sans MS", cursive; color:#666; }

#left #contact_form input[type="text"] { padding-left:11px; padding-right:40px; width:429px; height:48px; line-height:48px; background:url(../images/bg-txt-normal-manadatory.jpg) no-repeat top left; border:0;  }
#left #contact_form textarea { padding-left:11px; padding-right:11px; width:458px; height:185px; padding-bottom:8px; padding-top:8px; background:url(../images/bg-txtarea.jpg) no-repeat top left; border:0; }

#left #contact_form form input.btn-submit { float:left; width:153px; height:42px; background:url(../images/sprite.png) no-repeat -490px 0; border:0; cursor:pointer; }
#left #contact_form form input.btn-submit:hover { background-position:-490px -42px; }
#left #contact_form form input.btn-submit:active { background-position:-490px -84px; }
#left #contact_form form .msg { display:none; padding:0 10px; color:red; width:387px;  font-style:normal; font-weight:bold; -moz-border-radius:5px; border-radius:5px; background:#ffa; opacity:0.55; position:relative; right:-270px; top:-42px; width:183px; line-height:35px; margin-bottom:-35px; }
#left #contact_form form .submit-msg { display:none; float:right; line-height:38px; padding:0 5px 0 13px;  width:175px;  font-style:normal; -moz-border-radius:5px; border-radius:5px; background:#C8D6E0 url(../images/loader.gif) no-repeat 10px 11px; opacity:0.75; border:1px solid #AAB4BA; margin-right:184px; }
#left #contact_form form .submit-msg img {  float:left; margin-right:10px; margin-top:12px; }
#left #contact_form form table td input.btn-submit { float}


#left #services { width:100%; clear:both;  padding:24px 0 0; border:0px dotted red;}
#left #services h3 { float:left; width:100%; clear:both;} 
#left #services .box { float:left; width:134px; height:325px; padding:20px 20px 0; border:0px dotted red; border-right:1px solid #B4BFC9; }
#left #services .box ul { padding:10px 0 10px; }
#left #services .box ul li { list-style-type:square; margin-left:16px; }
#left #services div.lastbox { border-right:0px solid black; padding-right:0; width:154px; }
#left #services div.firstbox { padding-left:0; width:154px; }
#left #services div.box h3.webdesign { background:url(../images/icn-webdesign.png) no-repeat top left; }
#left #services div.box h3.brandidentity { background:url(../images/icn-brandidentity.png) no-repeat top left; padding-left:20px; }
#left #services div.box h3.graphicdesign { background:url(../images/icn-graphicdesign.png) no-repeat top left; padding-left:30px; }
#left #services div.box h3.printdesign { background:url(../images/icn-printdesign.png) no-repeat top left; padding-left:30px; }

#left #accordion-pf { width:699px;  border:0px dotted red;  }
#left #accordion-pf h3.accordion_heading { cursor:pointer; margin-bottom:10px; margin-top:10px; }
#left #accordion-pf div { padding:0 0; }
#left #accordion-pf div img { float:left; margin:10px; }
#left #accordion-pf div img.left { margin-left:0; }
#left #accordion-pf div img.right { margin-right:0; }

#main_cont .slider_top { height:6px; clear:both; background:url(../images/bg-slider-box-top.png) top left no-repeat; border:0px dotted red; }
#main_cont .slider_body { padding:0 6px 0; height:367px; clear:both; background:url(../images/bg-slider-box-body.png) top left repeat-y; border:0px dotted red; }
#main_cont .slider_footer { background:url(../images/bg-slider-controls-footer.png) top left no-repeat; height:37px; width:699px; clear:both; }
#main_cont .slider .slide { background:url(../images/bg-teaser-main-art.jpg) no-repeat top center; width:500px; height:200px; border:1px dotted red; }


#right { float:right; width:246px; /*border:1px dotted red;*/}
#right .tweets { width:100%;  clear:both; background:url(../images/bg-tweet.jpg) no-repeat top right;  /*  height:407px;*/ border:0px dotted red; }
#right h4.twitterlink { clear:both; width:70%; padding-top:5px; font-size:11px; background:url("../images/ic-arrowsmall.png") no-repeat scroll right 81% transparent; padding-right:15px; widht:auto;}
#right .tweets ul { list-style-type:none; width:100%; padding-top:15px; }
#right .tweets ul li { border-bottom:1px dotted #777; margin-bottom:7px; margin-left:0; line-height:1.47em; font-size:12px; padding-bottom:9px; }

#my_freelancing_status { background:url(../images/freelancing-yes.png) no-repeat top left; width:291px; height:192px; position:relative; right:20px; top:-17px; margin-bottom:-17px; }
 
#testi { margin-top:25px; margin-bottom:25px; margin-left:2px; padding:5px 0 5px 13px; border-left:4px solid #B1BFC8; font-family:Georgia, "Times New Roman", Times, serif;  font-size:15px;  line-height:1.45em; color:#424C54; font-style:italic; background:url(../images/bg-testi.jpg) no-repeat top right;  }
#testi h3 { font-size:15px; font-weight:normal; }
#testi h4 { font-size:12px;  font-family:"Segoe UI", "Lucida Grande", "Lucida Sans Unicode", sans-serif, Arial; font-style:normal; padding-top:10px; }

  
#lwys { clear:both; display:block; }
#lwys .top { position:relative; z-index:44; width:245px; height:100px; background:url(../images/lwys-top.png) no-repeat 0 0;  }
#lwys .mid { background:#5A6570 url("../images/lwys-mid-innershadow.jpg") repeat-x scroll 0 0; border-left:1px solid #3F474E; border-right:1px solid #3F474E; left:1px; margin-left:1px; margin-bottom:-17px; overflow:hidden; padding:18px 15px 34px; position:relative; top:-9px; width:209px; z-index:40; color:#D2D5D8; text-shadow:0px -1px 0px #000000; }
#lwys .mid a { color:#ff6600; text-align:center; display:block; background:#3F474E; padding:8px 0; -moz-border-radius: 0.3em; -webkit-border-radius: 0.3em; }
#lwys .mid a:hover { background:#4a545c; }
#lwys .mid ul { margin:8px 0; }
#lwys .mid ul li { margin-left:16px;}
#lwys .bot { background:url("../images/lwys-bot.png") no-repeat scroll 0 0 transparent; height:63px; position:relative; top:-10px; width:245px; z-index:50; cursor:pointer; }

#likewhatyousee { background:url(../images/bg-likewhatyousee.png) no-repeat top left; width:245px; height:171px; }

  
#footer { width:100%;  font-size:12px; color:#70777F; background:url(../images/bg-footer.jpg) repeat-x top left;  }
#footer_cont { padding:20px; width:960px; margin:0 auto; }
#footer_cont div.left { float:left; width:45%; line-height:1.5em; }
#footer_cont span { color:#919BA5; font-size:11px; }
#footer_cont div.right { float:right; text-align:right; width:40%; }

#footer_cont a { color:#70777F; border-bottom:none; }
#footer_cont a:hover { border-bottom:1px dotted #70777F;  }
#footer_cont a:hover img { opacity:1; }
#footer_cont img { float:left;  position:relative; top:-8px; left:0; margin-right:20px; opacity:0.5; filter:alpha(opacity=50); }

/* Clearfix */
.clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } 
.clearfix { display: inline-block; }
 html[xmlns] .clearfix { display: block; }
 * html .clearfix { height: 1%; }