html, ul, ol, li, div, span, p, h1, h2, h3, h5, h4, h3, h2, h1{
	margin:0 auto;
	padding:0;
	list-style:none;
	line-height:auto;
}

body {
		margin:0 auto;
	padding:0;
}
a {text-decoration: none;}
img {border: none; margin: 0; position: 0; vertical-align: middle;}

.clear {clear: both;}
.fl {float: left;}
.fr {float: right;}

@font-face {
    font-family: 'CorbelRegular';
    src: url('../fonts/corbel_5.eot');
    src: url('../fonts/corbel_5.eot') format('embedded-opentype'),
         url('../fonts/corbel_5.woff') format('woff'),
         url('../fonts/corbel_5.ttf') format('truetype'),
         url('../fonts/corbel_5.svg#CorbelRegular') format('svg');
}


@font-face {
    font-family: 'CorbelBold';
    src: url('../fonts/corbelb_5.eot');
    src: url('../fonts/corbelb_5.eot') format('embedded-opentype'),
         url('../fonts/corbelb_5.woff') format('woff'),
         url('../fonts/corbelb_5.ttf') format('truetype'),
         url('../fonts/corbelb_5.svg#CorbelBold') format('svg');
}


@font-face {
    font-family: 'UbuntuLight';
    src: url('../fonts/ubuntu-l.eot');
    src: url('../fonts/ubuntu-l.eot') format('embedded-opentype'),
         url('../fonts/ubuntu-l.woff') format('woff'),
         url('../fonts/ubuntu-l.ttf') format('truetype'),
         url('../fonts/ubuntu-l.svg#UbuntuLight') format('svg');
}

@font-face {
    font-family: 'UbuntuMedium';
    src: url('../fonts/ubuntu-m.eot');
    src: url('../fonts/ubuntu-m.eot') format('embedded-opentype'),
         url('../fonts/ubuntu-m.woff') format('woff'),
         url('../fonts/ubuntu-m.ttf') format('truetype'),
         url('../fonts/ubuntu-m.svg#UbuntuMedium') format('svg');
}


@font-face {
    font-family: 'UbuntuMonoBold';
    src: url('../fonts/ubuntumono-b.eot');
    src: url('../fonts/ubuntumono-b.eot') format('embedded-opentype'),
         url('../fonts/ubuntumono-b.woff') format('woff'),
         url('../fonts/ubuntumono-b.ttf') format('truetype'),
         url('../fonts/ubuntumono-b.svg#UbuntuMonoBold') format('svg');
}

#header_bg #log_in li button,#header_bg  h2 ,#contain_1 h1, #contain_4 h1{font-family: 'CorbelRegular';}

{font-family: 'CorbelBold';}

input,.submit, textarea, .logo_bg nav li a,#contain_1 p, #contain_2 h1, #contain_3 h1,#contain_2 p,#contain_2 .dev h2 ,#contain_2 .Lang h2, #contain_4 p, .contact_me h3, .contact_me h2 ,#contain_2 .desg h2,.quick_contact a, .quick_contact h3 ,.quick_contact h4, button , #copyright p, .left_banner h2, .right_banner h2   {font-family: 'UbuntuLight';}

#header_bg .logo_bg nav li a,#header_bg #log_in li input , .quick_contact h2 , .intant_quote h2, .submanu li a{font-family: 'UbuntuMedium';}

#header_bg  h1{ font-family: 'UbuntuMonoBold';}
/*----------------- Header Part ---------------------------*/

.container{width: 951px; margin: 0 auto; padding: 0;}

#header_bg {width: 100%; display: block; 
	}
#header_bg { background: none;   width: 100%; 	}
#header_bg .logo_bg {
padding:5px 0;
background: #fff; width:100%; position: fixed;  margin: 0 auto;  z-index: 1000; 
-webkit-box-shadow: 0 2px 2px rgba(0,0,0,0.4);	
	-moz-box-shadow: 0 2px 2px rgba(0,0,0,0.4);	
	-o-box-shadow: 0 0 2px rgba(0,0,0,0.4);	
	box-shadow: 0 2px 2px rgba(0,0,0,0.4);
}
#header_bg .logo_bg a.logo1 {	background-image: url(../img/logo.jpg); background-repeat:no-repeat; height: 70px; width: 300px; float: left;transition:width 2s;-webkit-transition:width 2s; /* Safari */}
#header_bg .logo_bg a:hover.logo1 { width: 300px;}
#header_bg .logo_bg nav { float: right;padding: 45px 10px 0 0;}
#header_bg .logo_bg nav li {display: inline; margin-right: 20px;}
#header_bg .logo_bg nav li a {font-size:16px; color: #303030;/*#026ec1*/;}
#header_bg .logo_bg nav li a:hover{color: #026ec1;}
#header_bg .logo_bg nav li a.active{color: #026ec1;}

.logo {background: url(../img/lion.png); width:348px; height:332px; padding:200px auto; }
.logo
{ animation:rotate1 11s linear infinite;
    -webkit-animation:rotate1 11s linear infinite;
    -moz-animation:rotate1 11s linear infinite;
}

@keyframes rotate1
{
0%{transform:rotate(-30deg); -webkit-transform:rotate(-30deg); -moz-transform:rotate(-30deg);}
25%{transform:rotate(0deg); -webkit-transform:rotate(0deg); -moz-transform:rotate(0deg);}
50%{transform:rotate(30deg); -webkit-transform:rotate(30deg); -moz-transform:rotate(30deg);}
100%{transform:rotate(-30deg); -webkit-transform:rotate(-30deg); -moz-transform:rotate(-30deg);}
}

@-webkit-keyframes rotate1
{
0%{transform:rotate(-30deg); -webkit-transform:rotate(-30deg); -moz-transform:rotate(-30deg);}
25%{transform:rotate(0deg); -webkit-transform:rotate(0deg); -moz-transform:rotate(0deg);}
50%{transform:rotate(30deg); -webkit-transform:rotate(30deg); -moz-transform:rotate(30deg);}
100%{transform:rotate(-30deg); -webkit-transform:rotate(-30deg); -moz-transform:rotate(-30deg);}
}

@-moz-keyframes rotate1{

0%{transform:rotate(-30deg); -webkit-transform:rotate(-30deg); -moz-transform:rotate(-30deg);}
25%{transform:rotate(0deg); -webkit-transform:rotate(0deg); -moz-transform:rotate(0deg);}
50%{transform:rotate(30deg); -webkit-transform:rotate(30deg); -moz-transform:rotate(30deg);}
100%{transform:rotate(-30deg); -webkit-transform:rotate(-30deg); -moz-transform:rotate(-30deg);}
}	


#header_bg  h1 { font-size: 60px; color: white; text-align: center; margin-top: -80px;}
#header_bg  h2 { font-size: 40px; color: white; text-align: center; margin-top: 119px;}
#header_bg  h2 a {color: #4B75F6;}


#contain_1{ padding:20px 0 50px; top:20px;  background-color: white;   z-index: -1;}
#contain_1 h1{	font-size: 40px; color: #606060; text-align: center; font-weight: lighter; margin-top: 20px;}
#contain_1 h1 span{ color:#026ec1; }
#contain_1 h1 a {color: #4B75F6;font-weight: bold;	}
#contain_1 p{ color: #6c6c6c; font-size: 20px; text-align: center; margin: 30px 0 20px;}
#contain_1 p span {color:#026ec1; font-weight:bold;}
#contain_1 p a {color: #4B75F6; font-weight: bold;}
#contain_1 .all { background-image: url(../img/all.png); width:355px; height: 145px; margin: 20px auto;}

/*----------------- Service Part ---------------------------*/
#contain_2 {width: 100%; position: relative;  overflow: hidden; height:680px; }
#service_bg {background: url(../img/bg1.jpg) no-repeat center 0; width: 100%; height: 800px; position:absolute;z-index:-1;}
#contain_2 h1 {font-size: 48px; color: #026ec1; text-align: center; padding-top: 115px;}
#contain_2 p{color: white; font-size: 22px; text-align: center; margin: 40px 0;}

#contain_2 #ser {margin: 20px auto 0;width: 680px;}
#contain_2 #ser .dev { width:310px; float: left;padding-top:20px;}
#contain_2 #ser .dev h2{ color: #026ec1; font-size: 25px; }
#contain_2 #ser .dev p{ font-size: 18px; color: white; text-align: left; line-height: 30px;margin-top: 15px;}
#contain_2 #ser .dev p span { font-size: 16px; color: #c3c3c3;}

#contain_2 #ser .desg {width:350px; float: right; }
#contain_2 #ser .desg h2{ color: #4B75F6; font-size: 25px; }
#contain_2 #ser .desg p{ font-size: 18px; color: white; text-align: left; line-height: 30px;margin-top: 15px;}

/*----------------- Porfolio Part ---------------------------*/
#contain_3 {width: 100%; position: relative;  overflow: hidden; height: 660px; margin-top: 0px; }
#portfolio_bg { background-image: url(../img/circles.jpg); width: 100%; height: 880px; position:absolute;z-index:-1;}
#contain_3 h1 {font-size: 48px; color: #026EC1; text-align: center; padding: 115px 0 40px;}
#contain_3 .left_banner { width: 100%; float: left; margin-left: 30px;}
#contain_3 .left_banner a .img1 { background-image: url(../img/banner-1.png); height: 199px; width: 366px;  }
#contain_3 .left_banner a .img3 { background-image: url(../img/banner3.png); height: 199px; width: 366px; margin-top: 40px}
#contain_3 .left_banner h2 {color: #4B75F6; font-size: 20px; text-align: center; margin-top: -10px;}

/*----------------- Contact Part ---------------------------*/
#contain_4 {width: 100%; position: relative;  overflow: hidden; height:700px; }
#footer_bg {background: url(../img/contact.gif) repeat; width: 100%; height:820px; position:absolute;z-index:-1;}
#contain_4 h1 {font-size: 48px; color: #026ec1; text-align: center; padding-top: 45px; margin-bottom: 20px;}
#contain_4 p{color: white; font-size: 22px; text-align: center; margin: 20px 0;}

#contain_4 #con { width: 900px; margin: 0 auto;
}
#contain_4 #con .quick_contact { float: left; width: 400px; margin-left: 20px; }
#contain_4 #con .quick_contact h2 {font-size:24px; color: #026ec1; text-align: left; font-weight: lighter; margin-top: 40px;margin-bottom: 25px;}
#contain_4 #con .quick_contact h3 {font-size:22px; color:white; text-align: left; margin: 20px 0 0px !important;}
#contain_4 #con .quick_contact a {    color: white;
    font-size: 23px;
    font-weight: bolder;
    line-height: 41px;
    margin: 11px 2px;
    text-align: left;}
#contain_4 #con .quick_contact a span { color:white; font-weight: bolder;}
#contain_4 #con .quick_contact a:hover{
	color: #026ec1;
}
#contain_4 #con .quick_contact h4 {font-size:24px; color:white; text-align: left; margin: 20px 0 5px !important;}
#contain_4 #con .quick_contact .link { float:left; width:105px; }

#contain_4 #con .quick_contact .link a.tw {background-image:url(../img/tw.png); height:45px; width:45px; float:left; margin-left:5px;display: block;opacity:1.0;
filter:alpha(opacity=100)}
#contain_4 #con .quick_contact .link a:hover.tw {background-image:url(../img/tw.png); height:45px; width:45px; float:left; margin-left:5px;display: block;opacity:0.4;
filter:alpha(opacity=40)}

#contain_4 #con .quick_contact .link a.fb {background-image:url(../img/fb.png); height:45px; width:45px; float:left; display: block;opacity:1.0;
filter:alpha(opacity=100)}
#contain_4 #con .quick_contact .link a:hover.fb {background-image:url(../img/fb.png); height:45px; width:45px; float:left; display: block;opacity:0.4;
filter:alpha(opacity=40)}


#contain_4 #con .intant_quote { float: right; width: 450px;  margin-right: 20px;}
#contain_4 #con .intant_quote h2 {font-size:24px; color: #026ec1; text-align: left; font-weight: lighter; margin-top: 40px; margin-bottom: 30px;}

#contain_4 #con .intant_quote input.error,#contain_4 #con .intant_quote textarea.error, #contain_4 #con .intant_quote select.error {
 border:none;
}

#contain_4 #con .intant_quote input{
width: 210px;
padding:12px 0 12px 10px;
color: #666;
background: #f5f5f5;
border: 1px solid #ccc;
margin: 5px 0;
outline: none;
border-radius: 3px;
transition: all 0.25s ease-in-out;
-webkit-transition: all 0.25s ease-in-out;
-moz-transition: all 0.25s ease-in-out;
box-shadow: 0 0 5px rgba(81, 203, 238, 0);
-webkit-box-shadow: 0 0 5px rgba(81, 203, 238, 0);
-moz-box-shadow: 0 0 5px rgba(81, 203, 238, 0);
}

#contain_4 #con .intant_quote textarea {
height: 90px;
width: 438px;
padding: 12px 0 12px 10px;
color: #666;
background: #f5f5f5;
border: 1px solid #ccc;
margin: 5px 0;
outline: none;
border-radius: 3px;
transition: all 0.25s ease-in-out;
-webkit-transition: all 0.25s ease-in-out;
-moz-transition: all 0.25s ease-in-out;
box-shadow: 0 0 5px rgba(81, 203, 238, 0);
-webkit-box-shadow: 0 0 5px rgba(81, 203, 238, 0);
-moz-box-shadow: 0 0 5px rgba(81, 203, 238, 0);
}
#contain_4 #con .intant_quote input:focus, #contain_4 #con .intant_quote textarea:focus {
border: 1px solid #ddd;
background-color: #fff;
color: #333;
outline: none;
position: relative;
z-index: 5;
box-shadow: 0 0 5px rgba(81, 203, 238, 1);
-webkit-box-shadow: 0 0 5px rgba(81, 203, 238, 1);
-moz-box-shadow: 0 0 5px rgba(81, 203, 238, 1);
-webkit-transform: scale(1.05);
-moz-transform: scale(1.05);
transition: all 0.25s ease-in-out;
-webkit-transition: all 0.25s ease-in-out;
-moz-transition: all 0.25s ease-in-out;
}
#contain_4 #con .intant_quote input.error, #contain_4 #con .intant_quote textarea.error, #contain_4 #con .intant_quote select.error {
box-shadow: 0 0 5px rgba(204, 0, 0, 0.5);
-webkit-box-shadow: 0 0 5px rgba(204, 0, 0, 0.5);
-moz-box-shadow: 0 0 5px rgba(204, 0, 0, 0.5);
border: 1px solid #faabab;
background: #fef3f3;
}
#contain_4 #con .intant_quotet input.submit {
 width: 150px !important;
cursor: pointer;
position: relative;
border: 1px solid #282828;
color: #fff;
padding: 6px 16px;
text-decoration: none;
font-size:16px;
background: #555;
background: -webkit-gradient( linear, left bottom, left top, color-stop(0.12, rgb(60,60,60)), color-stop(1, rgb(85,85,85)) );
background: -moz-linear-gradient( center bottom, rgb(60,60,60) 12%, rgb(85,85,85) 100% );
box-shadow: 0 2px 3px rgba(0,0,0,0.25);
-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.25);
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.25);
text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
}
#contain_4 #con .intant_quote input.submit:hover {
background: #4A72F5 !important;
transition: none;
-webkit-transition: none;
-moz-transition: none;
color: white;
}
#message {
font-size:12px;
margin: 1em 0;
padding: 10px;
display: block;
background: green;
border-radius: 10px;
color: #fff;
text-align: center;
}


/*----------------- footer Part ---------------------------*/
#copyright { background-color:#000000; padding:30px 0; margin-top:-40px} 
#copyright p { color: #FFFEFE;font-size: 12px;text-align: center;}
#copyright p span {color:#026ec1; font-weight:bold;}


.tophide {
	position:absolute;
	top:0;
	right:15%;
}
.box1 {
	margin:10px;
	float:left;
}

.message-error1{ padding: 5px; color:red; background: #FFCC33;color:#333333;margin-bottom:10px;width:100%;-moz-border-radius: 7px;
    -webkit-border-radius: 7px;
    border-radius: 7px;float:left; }
.message-error1 img { float:left;vertical-align:middle;margin-top:3px;margin-left:3px;}
.message-error1 div{ float:left;width:80%;margin-left:10px;}
.message-success{ padding: 5px; background: #0099FF;color:#333333;margin-bottom:10px;width:100%; -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
    border-radius: 7px; float:left;}
.message-success img {float:left;vertical-align:middle;margin-top:3px;margin-left:3px;}
.message-success div{ float:left;width:80%;margin-left:10px;}