@charset "utf-8";
/* General Page Styling(tags and what not) */
*{margin: 0; padding: 0;}
header, footer, article, section{display: block;}
img{border: none;}
body{background: url(../images/bg.jpg) top repeat-x #fff;font-family: 'Arial', Helvetica, sans-serif;}
h1{color: #828282;font-size: 17px;float: left;font-family: "Arial" , Helvetica, sans-serif;font-weight:normal;width: 100%;}
h2{float: left;width: 100%;height: auto; font-size: 20px;margin: 20px 0 5px 0;padding: 15px 0;color: #828282;}
h4{float: left;color: #828282;width: auto;}
dt, #leftT h4{color: #828282;font-size: 17px;float: left;font-family: "Arial" , Helvetica, sans-serif;font-weight:normal;width: 180px;border-bottom: 1px solid #eee;padding-bottom: 5px;}
*:focus {outline: none;}
/* Link Styling */
a{text-decoration: none;color: #EF0000;-webkit-transition:color .2s ease-in-out;-moz-transition:color .2s ease-in-out;-o-transition:color .2s ease-in-out;transition:color .2s ease-in-out;}
a:hover{color: #12948b;}
a:active, img:active{position: relative;top: 1px;outline: none;}
/* Font Stylings */
.red{color: #EF0000;}
.bold{font-weight:bold;}
.big{font-size: 48px;}
.big2{font-size: 44px;}
.top{padding-top: 5px;float: left;}
.top5{margin-top:7px;}
#top{padding: 30px 0;float: left;}
#top2{padding: 10px 0;float: left;}
.left{float: left;}
.grey{color: #828282;}
.height{font-size: 12px;font-family: "Arial", Helvetica, sans-serif;}
.height2{font-size: 10px;}
.height3{margin: 3px 0 0 0;float: left;font-size: 17px;}
.header{font-size: 24px;}
.italic{font-style: italic;}
/* Header Styling */
header{width: 860px;margin: 50px auto 20px auto;height: 57px;}
#head{width:auto;height: 70px;float: left;}
header p{float: left;width: 200px;margin: 75px 0 0 0;color: #7F7F7F;font-family: "Arial", Helvetica, sans-serif;}
#img{background:url(../images/logo.png) no-repeat top;height: 57px;width: 161px;border: none;}
/* Wrapper styling */
#wrap{width:860px;height: auto !important;margin: 25px auto 15px auto;min-height: 500px;height:500px;}
.right{float: right;}
.left2{float: left;width: 250px;height: 250px;margin: 0 0 0 85px;}
.left2 p{float: left;width: 100%;margin: 10px 0 0 0;font-size: 13px;line-height: 21px;color: #666;}
/* Navigation Bar Styling */
#nav{float: right;width: 320px;height: 20px;margin: 38px 0 0 0;list-style: none;}
#about{background: url(../images/user.png) left no-repeat;background-position: 11% 53%;}
#work{background: url(../images/work.png) left no-repeat;background-position: 14% 53%;}
#contact{background: url(../images/contact.png) left no-repeat;background-position: -1% 53%;}
#blog2{background: url(../images/blog.png) left no-repeat;background-position: 17% 53%;}
#nav li{float: left;width: 80px;text-align: center;height: 20px;display: block;font-size: 15px;}
#nav li a{color: #B6B6B6;font-family:Arial, "Helvetica", sans-serif;-webkit-transition:none;-moz-transition:none;-o-transition:color none;transition: none;}
#nav li a:hover{color: #828282;}
.des{margin: 10px 0 0 4px;float: left;color: #7F7F7F;}
/* Tagline */
#tag{height: 195px;margin: 0 auto;width: 860px;font-family:Arial, 'Helvetic', sans-serif;font-size: 23px;line-height: 54px;border-top: 1px #eee solid;border-bottom: 1px #eee solid;}
#tag>.big{text-align: center;}
#tag p{margin: 0;width:100%;height: auto;}
/* Feature Work */
#feature{width: 860px;height: 300px;float: left;margin: 0 0 30px 0;}
/********************************************
Coin Slider Styles
********************************************/
#coin-slider{float: left;margin: 19px 0 0 80px;width: 333px;height: 209px;}
#coin{float: right; width: 483px;height: 280px;background: url(../images/feature.png);}
#coin img{margin: 19px 0 0 80px;}
.coin-slider { overflow: hidden; zoom: 1; position: relative; float: right; width: 483px;height: 280px;background: url(../images/feature.png);position: relative;}
.coin-slider a{ text-decoration: none; outline: none; border: none; }
.cs-buttons { font-size: 20px; padding: 10px; float: right; width: 30px; height: 30px; background: #000;}
.cs-buttons a { margin-right: 0px; height: 30px; width: 30px; float: right; border: 1px solid #B8C4CF; color: #B8C4CF; background: #000;}
.cs-active { background-color: #B8C4CF; color: #FFFFFF; }
.cs-prev, .cs-next { padding-left:5px;background: #eee; color: #FFFFFF;width:30px;height:30px;font-size:39px;-moz-border-radius:15px;-webkit-border-radius: 15px;border-radius: 15px;}
.cs-next{text-align:right;padding-right:5px;background: #eee; color: #FFFFFF;width:30px;height:30px;font-size:39px;-moz-border-radius: 15px;-webkit-border-radius: 15px;border-radius: 15px;}
.widthy{width:330px;}
.widthy2{width:320px;}
.button {text-align:center;float: left;margin: 20px 15px 0 0;width: 105px;height: 25px;background: #898989;color: #fff;text-align: center;font-size: 15px;-moz-border-radius: 20px;-webkit-border-radius: 20px;display: block;-webkit-transition:background .4s ease-in-out;  -moz-transition:background .4s ease-in-out;  -o-transition:background .4s ease-in-out;  transition:background .4s ease-in-out; }
.button a{color: #fff;}
.button:hover{background: #ed1c26;-moz-box-shadow:0px 0px 10px #333;-webkit-box-shadow:0px 0px 10px #333;box-shadow:0px 0px 10px #333;}
.topfeature{margin: 20px 0 0 0;}
.txt4{margin: 2px 0 0 13px;float: left;}
.txt5{margin: 2px 0 0 22px;float: left;}
.txt6{margin: 2px 0 0 18px;float: left;}
/* Area below feature */
.block{float: left;height: 150px;}
#services{margin: 0 60px 0 0;width: 200px;}
#services2{width: 330px;border: none;margin: 0 60px 0 0;}
.block ul, .block p, #blog p{width: 200px;float: left;font-size: 13px;line-height: 21px;margin: 5px 0 0 0;list-style-image: url(../images/check.png);}
.block p{width: 284px;}
.block #p2{margin: 2px 0;}
.block li{margin: 2px 0 0 0;width: 180px;float: right;color: #666;}
.top{float: left;margin: 0px 0 0 0;}
/* Blog Feed Area */
#blog{width: 210px;float: left;height: 150px;}
#blog h1, #blog P{float: left;width: 100%;}
#blog p{margin: 5px 0 0 0;}
#blog ul{float:left; list-style-type:none; font-size:13px; line-height:21px;margin: 5px 0 0 0;}
#blog ul>li{float: right;list-style-type:none;}
#blog ul>li a{color:  #828282;}
.feed{ float: left; width: 210px;}
.rss-box-feed{ float: left; width: 210px; margin-top:5px;}
.rss-itmes{width:210px;float:left;}
.rss-item{width:195px;;list-style-image:url("../images/paper.png");float:right;}
.f2jnag {display:none;}
/* Footer */
footer {width: 860px;height: 20px; border-top: 1px solid #ccc; margin: 20px 0; font-size:11px;text-align:left;padding-bottom:20px;}
.auto{margin: 0 auto;}
footer p{margin: 7px 0 10px 0;	}
footer a{color: #000;-webkit-transition:color .2s ease-in-out;  -moz-transition:color .2s ease-in-out;  -o-transition:color .2s ease-in-out;  transition:color .2s ease-in-out; }
#p{margin: 7px 0 0 0;word-spacing: 5px;}
/******************************************
CSS Styling for Content Template Pages
******************************************/
/* Content Pages Wrapper */
#wrap2{width:860px;margin: 25px auto 25px auto;height:auto; min-height:500px;padding-bottom:10px;}
section.autosize { display: table; }
section.autosize > article, section.autosize article > div { display: table-cell; }
/* Main two areas of template */
			/* Styline for right side */
#rightT{width: 220px;height: auto;float: left;font-size: 13px;line-height: 21px;}
#rightT2{width: 560px;height: auto;float: right;font-size: 13px;line-height: 21px; min-height:500px;}
#rightT2 h1{font-size: 23px;margin-bottom: 10px;width: 100%;}
#rightT p{width: 100%;float: left;height: auto;}
#rightT2 p{width: 100%;float: left;height: auto;}
#rightT2 h4{font-size: 15px; float:left; width:100%; margin-bottom:4px;}
#leftT{width: 280px;height: auto;float: left;font-size: 13px;line-height: 21px;}
#leftT p{float:left; width: 220px; margin: 3px 0;}
#leftT dl{float: left;width: 100%;height: auto;}
#leftT dd{width: 100%;height: 21px;float: left;margin-top: 3px; width:220px;}
/* Template Tagline */
#tagl2{height: 90px;margin: 0 auto;width: 860px;font-family:Arial, 'Helvetic', sans-serif;font-size: 20px;line-height: 54px;border-top: 1px #eee solid;border-bottom: 1px #eee solid;}
#tagl2>.big2{text-align: left;float: left;}
#tagl2 p{float: left;margin: 0;width:100%;height:46px;}
/*******************************************
Contact Form Page Styline
*******************************************/
.dl{width: 100%;height: auto;float: left;margin: 10px 0 0 0;}
.dl dt{font-size: 20px;float: left;margin: 20px 0 5px 0;width:100%;color: #828282;
}
.dl dd{float: left;width: 100%;margin-top:10px;text-indent: 25px;}
#number{background:url(../images/phone.png) left no-repeat;}
#mail{background: url(../images/email.png) left no-repeat;}
#skype{background: url(../images/skype.png) left no-repeat;}
form{width: 560px;float: right;height: auto;}
 input{width: 480px;float: left;margin: 10px 0;height: 30px;}
 textarea{margin: 10px 0;width: 480px;height: 130px;resize: none;float: left;overflow: auto;}
#submit{width: 60px;float: left;height: 30px;font-weight: bold;color: #fff;background:#666;border: none;margin-top: 20px;margin-left:19px;}
#submit:hover{-moz-box-shadow:0px 0px 10px #333;-webkit-box-shadow:0px 0px 10px #333;box-shadow:0px 0px 10px #333;}
#submit:active{position: relative;top: 1px;outline: none;}
.iwidth{float:left;width: 370px;font-size: 12px;}
/**************************************************
Work Page Styling
**************************************************/
ul.tabs{float: left;list-style-type: none;width: 100%;height: auto;}
ul.tabs  li{float: left;margin-right: 15px;}
.tab_container{width: 100%;float: left;}
.tab_container >div{height: 450px;width: 100%;margin: 13px 0 5px 0;}
.port_entry {width: 410px;height: 270px;font-size: 13px;line-height: 21px;margin: 15px 0 20px 0;}
.lefty12{margin-right: 18px;float: left;}
.port_entry p{margin-top: 5px;float: left;width: 100%;color:#000; height:auto;}
.port_entry img{border: 6px #fff solid;-moz-box-shadow:0px 0px 12px #828282;-webkit-box-shadow:0px 0px 12px #828282;box-shadow:0px 0px 12px #828282;width:390px;height: 190px;float: left;}
.port_entry img:hover{-moz-box-shadow:0px 0px 12px #000;-webkit-box-shadow:0px 0px 12px #000;box-shadow:0px 0px 12px #000;}
/************************************************
Showcase work personal pages
************************************************/
#info_area{float: left;width: 330px;height: 400px;font-size: 13px;line-height: 21px;}
#info_area p{float: left;margin-bottom: 5px;width:100%;}
.bottom_space{padding-bottom: 8px;float:left;}
.state{color: #828282;}
.top6{margin-top: 25px;}
.red em {
width: 500px;
color:#000;
height: auto;
position: absolute;
top: 300px;
left: -120px;
text-align: center;
z-index: 2;
display: none;
font-size:20px;
background:#eee;
-moz-border-radius: 10px;-webkit-border-radius: 10px;border-radius: 10px;
}
.red{position: relative;}