@charset "utf-8";
/* CSS Document */

@font-face {
 font-family:FontStyle1;
 src:url("../font/Gabriola.ttf"); 
}


@font-face {
 font-family:FontStyle2;
 src:url("../font/Contm___0.ttf"); 
}




/* General Definations */
*{ margin:0px; padding:0px; outline:none; list-style:none; text-decoration:none;}
html,body{ width:100%; height:100%; font:12px Arial, Helvetica, sans-serif; color:#646464; line-height:20px; background-color:#fff;}

h1{color:#3e3e3e; font-weight:normal;  padding:0px 0px 10px 0px;  font:1.7em "FontStyle2";  }

h2{font-size:19px; color:#0080d4;  font-style:normal; font:1.6em "FontStyle4";}
h3{font-size:13px; color:#545454; padding:10px 0 0px 0; text-decoration:none; font-weight:normal;}
p{font-size:16px; font-weight:normal; font-family: Arial, Helvetica, sans-serif; color:#666; text-align:justify; line-height:20px; margin:10px 0 15px 0; }
img{ border:none;}
.clear{clear:both;}
input.chk{border:none;}
a{ color:#fff; text-decoration:none;}
a:hover{color:#ff8838; text-decoration:underline;}


.TableFormat { border:solid 0px #CCCCCC; margin-left:-12px;}
.TableFormat td{ height:10px; width:100px; color:#545454; border:solid 0px #acacac; font-size:12px; }
.TableFormat th{color:#fff; height:15px; padding-left:10px; text-align:left; background:#FF0000; font-size:13px;}
.TableFormat input[type=text]{border:1px solid #a2a2a2; height:16px; width:180px; padding:2px; font-size:14px; color:#000;background:#F7F7F7;
-moz-border-radius:6px;
-webkit-border-radius:6px; border-radius:6px;}

.TableFormat textarea{ padding:2px; border:1px solid #a2a2a2; width:200px; height:80px; font-size:15px; color:#000;background:#F7F7F7;
-moz-border-radius:6px;
-webkit-border-radius:6px; border-radius:6px;}

.Button{background:#0080d4; border:0px;color:#fff;  padding:5px 7px; font-size:12px; text-transform:uppercase; cursor:pointer; -moz-border-radius:5px;
-webkit-border-radius:5px; border-radius:5x;}
.Button:hover{background:#de8300; text-decoration:none; color:#fff;}

.sepline{ width:960px; float:left; border-bottom:1px dotted #de8300; margin:5px 0 15px 0;}



.main{width:100%}
.main-header{width:100%; height:390px; float:left; background:url(../images/body_bg.png) repeat;}
.header{width:1000px; margin:0 auto;}
.header-inner{width:1000px; height:136px; float:left;}
.logo{width:283px; height:102px; float:left; margin:25px 0 0 0px;}
.right-header{width:550px; height:136px; float:right;}

.techie-design{width:171px; height:85px; float:left; margin:50px 0 0 30px;}
.contact-detail{width:340px; float:right; margin:0 0 0 0px;} 
.email{ width:258px; float:right; color:#fff; font-family:"Times New Roman", Times, serif; font-size:17px; margin-top:17px;}
.email span{margin-left:52px; line-height:28px;}

.call-info{width:312px; float:right; margin:11px 0 0 0px;}
.phn-icon{ width:34px; height:34px; float:left; margin-left:8px;}
.phn-icon a img{opacity:.7;}
.phn-icon a:hover img{opacity:1;}

.number{width:270px; float:right; margin-top:5px; margin-right:-14px; color:#fff; font-size:20px; font-family:"Times New Roman", Times, serif;}


.nav{width:1000px; float:left; background:url(../images/nav-background.png); height:41px;}
.nav ul{margin-left:10px; padding:8px;}
.nav ul li{float:left; font:1.4em "FontStyle1"; color:#fff;}
.nav ul li a{text-decoration:none; color:#fff; padding:8px 17px 8px 17px; margin:0 5px 0 5px; font-weight:bold;}
.nav ul li a:hover{text-decoration:none; color:#fff; background:url(../images/nav-hover.png) repeat-x; padding:8px 17px 8px 17px;  margin:0 5px 0 5px;}

.nav .selected{text-decoration:none; color:#fff; background:url(../images/nav-hover.png) repeat-x; padding:8px 17px 8px 17px;  margin:0 5px 0 5px;}

.banner{ float:left; width:1000px; height:388px; margin:10px 0 0 0px;}

.anti-banner{ float:left; width:1000px; height:388px; margin:10px 0 0 0px; background:url(../images/antivirus-banner.png) no-repeat;}
.inner-banner{ float:left; width:470px; height:160px; margin:200px 0 0 45px; color:#646464; text-align:justify;}

.lapy-banner{float:left; width:1000px; height:388px; margin:10px 0 0 0px; background:url(../images/laptop-banner-01.png) no-repeat;}
.lapy-inner-banner{ float:left; width:500px; height:160px; margin:200px 0 0 452px; color:#646464; text-align:justify;}

.printer-banner{float:left; width:1000px; height:388px; margin:10px 0 0 0px; background:url(../images/printer-banner-01.png) no-repeat;}
.printer-inner-banner{ float:left; width:490px; height:160px; margin:200px 0 0 462px; color:#646464; text-align:justify;}

.router-banner{float:left; width:1000px; height:388px; margin:10px 0 0 0px; background:url(../images/router-support-banner.png) no-repeat;}
.router-inner-banner{ float:left; width:490px; height:160px; margin:200px 0 0 462px; color:#646464; text-align:justify;}

.main-services{width:100%; float:left; background:#fff; margin-top:215px;}
.services{width:1000px; margin:0 auto;}
.inner-services{width:960px; margin:0 20px 0 20px;}

.techie-tool{width:960px; float:left; margin-left:-8px;}

.section{width:960px; float:left; margin:38px 0 0 0px;}
.welcome-message{width:620px; float:left;}
.welcome-message span{color:#646464;}   
.welcome-message span:hover{color:#ea5800;}
.welcome-sep{width:620px; height:20px; margin-top:8px;}

.body-right{width:308px; float:right; margin:0 0 0 0px;}

.mission-top{width:308px; height:31px; float:left;}
.mission-middle{width:308px; background:#f9f9f9; float:left;
-webkit-box-shadow: 2px 1px 2px #e6e6e6;
   -moz-box-shadow: 2px 1px 2px #e6e6e6;
   box-shadow: 2px 1px 2px #e6e6e6; }
   
.mission-middle span{color:#646464;}   
.mission-middle span:hover{color:#ea5800;}   

.main-footer{width:100%; float:left; background:url(../images/footer-background.jpg); height:320px; margin-top:46px;}
.inner-footer{width:960px; margin:0 auto;}
.footer-part{width:960px; float:left; margin:24px 0 0 0px;}

.left-footer{width:320px; float:left;}
.quick-link{width:320px; font-size:15px; color:#fff;}

.menu{width:140px; float:left; margin-top:12px;}
.menu ul{ margin:0px; padding:0px;}
.menu ul li{font-size:12px; color:#fff; padding:2px;}
.menu ul li a{font-size:12px; color:#fff;}
.menu ul li a:hover{color:#ff8838; text-decoration:underline;}

.menu-1{width:120px; float:left; margin:15px 0 0 60px;}
.menu-1 ul{ margin:0px; padding:0px;}
.menu-1 ul li{font-size:12px; color:#fff; padding:2px;}
.menu-1 ul li a{font-size:12px; color:#fff;}
.menu-1 ul li a:hover{color:#ff8838; text-decoration:underline;}


.middle-footer{width:100px; float:left; margin-left:120px;}
.social-network{width:100px; font-size:15px; color:#fff;}
.social{width:100px; float:left; margin-top:20px;}
.facebook{width:28px; height:29px; float:left;}
.facebook a img{opacity:.7;}
.facebook a:hover img{opacity:1;}

.twitter{width:28px; height:29px; float:left; margin-left:7px;}
.twitter a img{opacity:.7;}
.twitter a:hover img{opacity:1;}

.linkedin{width:28px; height:29px; float:left; margin-left:7px;}
.linkedin a img{opacity:.7;}
.linkedin a:hover img{opacity:1;}


.right-footer{width:265px; float:right; margin-left:40px;}
.contact-detail{width:265px; font-size:15px; color:#fff;}
.address{width:265px; font-size:12px; color:#fff;  margin-top:15px; float:left;}
.address span{margin-left:40px;}

.disclaimer{width:960px; float:left; color:#fff; margin-top:20px; text-align:justify;}


.main-copyright{width:690px; float:left; margin:25px 0 0 0px;}
.copyright{ width:350px; float:left; font:Arial, Helvetica, sans-serif; color:#fff;}
.expert-detail{ width:280px; margin-right:-300px; float:right; color:#fff;}


/*============pages-css-start===========*/

.main-designing{width:100%; float:left; margin-top:215px;}
.designing{width:1000px; margin:0 auto;}
.designing-inner{width:960px; margin:0 20px 0 20px;}

.main-content{width:960px; float:left; }
.left-contact{width:500px; float:left;}
.right-contact{width:400px; float:right; }
.contact{  background:url(../images/letter_bg.png) repeat; height:180px; margin-top:15px; width:330px;}
.map{width:400px; float:right; margin-top:20px;}

.plan-body{width:960px; float:left; margin-top:20px; }
.left-plan{width:235px; float:left; margin-left:0px; }
.time{width:250px; float:left; text-align:center; font-size:14px;}
.price{width:250px; float:left; text-align:center; font-size:50px; font-family:"Times New Roman", Times, serif; color:#ff8838; margin-top:40px;}
.list{width:250px; float:left; text-align:center; font-size:16px; margin-top:40px;}


.left-about{width:940px; float:left; margin-top:0px;}
.right-about{width:308px; float:right; margin-top:5px;}
.about-top{width:308px; height:31px; float:left;}
.about-middle{width:308px; background:#f9f9f9; float:left;
-webkit-box-shadow: 2px 1px 2px #e6e6e6;
   -moz-box-shadow: 2px 1px 2px #e6e6e6;
   box-shadow: 2px 1px 2px #e6e6e6; }
   
   .about-middle ul{margin:0; padding:0;}
   .about-middle ul li{ margin:15px 0 8px 20px;}   
.mission-middle span{color:#646464;}   
.mission-middle span:hover{color:#ea5800;} 


/*============pages-css-close===========*/


/*=========image-hover-start===============css*/

.view {
   width: 210px;
   height: 202px;
   margin-left:14px;
   float: left;
   border: 8px solid #fff;
   overflow: hidden;
   position: relative;
   text-align: center;
   -webkit-box-shadow: 0px 1px 2px 2px #e6e6e6;
   -moz-box-shadow: 0px 1px 2px 2px #e6e6e6;
   box-shadow: 0px 1px 2px 2px #e6e6e6;
   cursor: default;
   background: #fff url(../images/bgimg.jpg) no-repeat center center;
}
.view .mask,.view .content {
   width: 210px;
   height: 202px;
   position: absolute;
   overflow: hidden;
   top: 0;
   left: 0;
}
.view img {
   display: block;
   position: relative;
}
.view h2 {
   text-transform: uppercase;
   color: #fff;
   text-align: center;
   position: relative;
   font-size: 16px;
   padding:2px;
   background: rgba(0, 0, 0, 0.8);
   margin: 20px 0 0 0;
}
.view p {
   font-family: Georgia, serif;
   font-style: italic;
   font-size: 12px;
   position: relative;
   color: #fff;
   padding:3px 5px 15px;
   text-align: center;
}
.view a.info {
   display: inline-block;
   text-decoration: none;
   padding:2px 14px;
   background: #000;
   color: #fff;
   text-transform: uppercase;
   -webkit-box-shadow: 0 0 1px #000;
   -moz-box-shadow: 0 0 1px #000;
   box-shadow: 0 0 1px #000;
}
.view a.info: hover {
   -webkit-box-shadow: 1 0 5px #000;
   -moz-box-shadow: 1 0 5px #000;
   box-shadow: 1 0 5px #000;
}



.view-tenth img {
   -webkit-transform: scaleY(1);
   -moz-transform: scaleY(1);
   -o-transform: scaleY(1);
   -ms-transform: scaleY(1);
   transform: scaleY(1);
   -webkit-transition: all 0.7s ease-in-out;
   -moz-transition: all 0.7s ease-in-out;
   -o-transition: all 0.7s ease-in-out;
   -ms-transition: all 0.7s ease-in-out;
   transition: all 0.7s ease-in-out;
}
.view-tenth .mask {
   background-color: rgba(255, 231, 179, 0.3);
   -webkit-transition: all 0.5s linear;
   -moz-transition: all 0.5s linear;
   -o-transition: all 0.5s linear;
   -ms-transition: all 0.5s linear;
   transition: all 0.5s linear;
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
}
.view-tenth h2 {
   border-bottom: 1px solid rgba(0, 0, 0, 0.3);
   background: transparent;
   margin: 20px 40px 0px 40px;
   -webkit-transform: scale(0);
   -moz-transform: scale(0);
   -o-transform: scale(0);
   -ms-transform: scale(0);
   transform: scale(0);
   color: #333;
   -webkit-transition: all 0.5s linear;
   -moz-transition: all 0.5s linear;
   -o-transition: all 0.5s linear;
   -ms-transition: all 0.5s linear;
   transition: all 0.5s linear;
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
}
.view-tenth p {
   color: #333;
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transform: scale(0);
   -moz-transform: scale(0);
   -o-transform: scale(0);
   -ms-transform: scale(0);
   transform: scale(0);
   -webkit-transition: all 0.5s linear;
   -moz-transition: all 0.5s linear;
   -o-transition: all 0.5s linear;
   -ms-transition: all 0.5s linear;
   transition: all 0.5s linear;
}
.view-tenth a.info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transform: scale(0);
   -moz-transform: scale(0);
   -o-transform: scale(0);
   -ms-transform: scale(0);
   transform: scale(0);
   -webkit-transition: all 0.5s linear;
   -moz-transition: all 0.5s linear;
   -o-transition: all 0.5s linear;
   -ms-transition: all 0.5s linear;
   transition: all 0.5s linear;
}
.view-tenth:hover img {
   -webkit-transform: scale(10);
   -moz-transform: scale(10);
   -o-transform: scale(10);
   -ms-transform: scale(10);
   transform: scale(10);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
}
.view-tenth:hover .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
}
.view-tenth:hover h2,.view-tenth:hover p,.view-tenth:hover a.info {
   -webkit-transform: scale(1);
   -moz-transform: scale(1);
   -o-transform: scale(1);
   -ms-transform: scale(1);
   transform: scale(1);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
}
				

/*=========image-hover-close===============css*/




/*==========================PRICE-TABLE-START========================*/

#pricing-table {
		margin: 50px auto 50px auto;
		text-align: center;
		width: 892px; /* total computed width = 222 x 3 + 226 */
	}

	#pricing-table .plan {
		font: 12px 'Lucida Sans', 'trebuchet MS', Arial, Helvetica;
		text-shadow: 0 1px rgba(255,255,255,.8);        
		background: #fff;      
		border: 1px solid #ddd;
		color: #333;
		padding: 20px;
		width: 252px; /* plan width = 180 + 20 + 20 + 1 + 1 = 222px */      
		float: left;
		position: relative;
	}
	
	#pricing-table #most-popular {
		z-index: 2;
		top: -13px;
		border-width: 3px;
		padding: 30px 20px;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		border-radius: 5px;
		-moz-box-shadow: 20px 0 10px -10px rgba(0, 0, 0, .15), -20px 0 10px -10px rgba(0, 0, 0, .15);
		-webkit-box-shadow: 20px 0 10px -10px rgba(0, 0, 0, .15), -20px 0 10px -10px rgba(0, 0, 0, .15);
		box-shadow: 20px 0 10px -10px rgba(0, 0, 0, .15), -20px 0 10px -10px rgba(0, 0, 0, .15);    
	}

	#pricing-table .plan:nth-child(1) {
		-moz-border-radius: 5px 0 0 5px;
		-webkit-border-radius: 5px 0 0 5px;
		border-radius: 5px 0 0 5px;        
	}

	#pricing-table .plan:nth-child(4) {
		-moz-border-radius: 0 5px 5px 0;
		-webkit-border-radius: 0 5px 5px 0;
		border-radius: 0 5px 5px 0;        
	}
	
	/* --------------- */	

	#pricing-table h3 {
		font-size: 19px;
		font-weight: normal;
		
		padding: 20px;
		margin: -20px -20px 50px -20px;
		background-color: #eee;
		background-image: -moz-linear-gradient(#fff,#eee);
		background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#eee));    
		background-image: -webkit-linear-gradient(#fff, #eee);
		background-image: -o-linear-gradient(#fff, #eee);
		background-image: -ms-linear-gradient(#fff, #eee);
		background-image: linear-gradient(#fff, #eee);
	}
	
	#pricing-table #most-popular h3 {
		background-color: #ddd;
		background-image: -moz-linear-gradient(#eee,#ddd);
		background-image: -webkit-gradient(linear, left top, left bottom, from(#eee), to(#ddd));    
		background-image: -webkit-linear-gradient(#eee, #ddd);
		background-image: -o-linear-gradient(#eee, #ddd);
		background-image: -ms-linear-gradient(#eee, #ddd);
		background-image: linear-gradient(#eee, #ddd);
		margin-top: -30px;
		padding-top: 30px;
		-moz-border-radius: 5px 5px 0 0;
		-webkit-border-radius: 5px 5px 0 0;
		border-radius: 5px 5px 0 0; 		
	}
	
	#pricing-table .plan:nth-child(1) h3 {
		-moz-border-radius: 5px 0 0 0;
		-webkit-border-radius: 5px 0 0 0;
		border-radius: 5px 0 0 0;       
	}

	#pricing-table .plan:nth-child(4) h3 {
		-moz-border-radius: 0 5px 0 0;
		-webkit-border-radius: 0 5px 0 0;
		border-radius: 0 5px 0 0;       
	}	

	#pricing-table h3 span {
		display: block;
		font: bold 25px/100px Georgia, Serif;
		color: #0080d4;
		background: #fff;
		border: 5px solid #fff;
		height: 112px;
		width: 112px;
		margin: 10px auto -65px;
		-moz-border-radius: 100px;
		-webkit-border-radius: 100px;
		border-radius: 100px;
		-moz-box-shadow: 0 5px 20px #ddd inset, 0 3px 0 #999 inset;
		-webkit-box-shadow: 0 5px 20px #ddd inset, 0 3px 0 #999 inset;
		box-shadow: 0 5px 20px #ddd inset, 0 3px 0 #999 inset;
	}
	
	/* --------------- */

	#pricing-table ul {
		margin: 20px 0 0 0;
		padding: 0;
		list-style: none;
	}

	#pricing-table li {
		border-top: 1px solid #ddd;
		padding: 10px 0;
	}
	
		
	
	.clear:before, .clear:after {
	  content:"";
	  display:table
	}

	.clear:after {
	  clear:both
	}

	.clear	{
	  zoom:1
	}	

.service{
	float:right;  
	margin-top:10px;
	margin-right:30px;}