html, body{ margin:0; padding:0; border:0; outline:0; vertical-align:baseline; background:transparent; font-size:100%; background:transparent; } body{ background: #fff; font-family: Agenda-Light, Agenda Light, Agenda, Arial Narrow, sans-serif; } .bg{ width: 100%; height: 800px; position: relative; background: url('../Images/bg.jpg') no-repeat bottom center; background-size: cover; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; } .bg .caption{ width: 100%; position: absolute; text-align: center; top: 50%; margin-top: -105px; z-index: 10; } .bg .caption h2{ color: #ffa500; font-family: "Matura MT Script Capitals"; font-size: 60px; font-weight: lighter; margin: 0; position: relative; display: block; } .bg .caption p{color:#000;font-family:"courier";font-size:40px;margin-left:350px;;text-align:center;white-space:nowrap;overflow-x:hidden; width:15em;animation:type 4s steps(60,end);} .bg .caption p:nth-child(2){animation:type2 8s steps(60,end);} @keyframes type{ from{width:0;} } @keyframes type2{ 0%{width:0;} 20%{width:0;} 50%{width:100;}} .title-small span { position: relative;} .title-small span:after { content: ""; position: absolute; bottom: -20px; height: 3px; background: #DEDEDE; width: 28px; left: 0; } .title-small-center span {position: relative;} .title-small-center span:after { content: ""; display: block; margin: 0 auto; margin-top: 20px; height: 3px; background: #DEDEDE; width: 28px; left: 0; } .sk-spinner-pulse { width: 40px; height: 40px; margin: 40px auto; background-color: #333; border-radius: 100%; -webkit-animation: sk-pulseScaleOut 1s infinite ease-in-out; animation: sk-pulseScaleOut 1s infinite ease-in-out; } @-webkit-keyframes sk-pulseScaleOut { 0% { -webkit-transform: scale(0); transform: scale(0); } 100% { -webkit-transform: scale(1); transform: scale(1); opacity: 0; } } @keyframes sk-pulseScaleOut { 0% { -webkit-transform: scale(0); transform: scale(0); } 100% { -webkit-transform: scale(1); transform: scale(1); opacity: 0; } } #about{ min-height: 650px; display: inline-block; width: 100%; } .bg-about { background: url('../Images/Ajay.jpg'); -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-repeat: no-repeat; position: relative; padding: 0; margin: 0; min-height: 660px; width: 100%; height: 100%; float: left; } .wrap-about { height: 100%; width: 100%; position: relative; display: block; min-height: 480px; } .wrap-about .w-content{ position: absolute; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%); } .wrap-about .w-content td{ font-size: 13px; font-weight: 300; } .wrap-about .w-content td.title{ padding-right: 10px; font-weight: 500; } .wrap-about .w-content td.break{ padding-right: 15px; } .wrap-about .w-content tr{ height: 35px; } .wrap-about .head-about { font-size: 13px; line-height: 34px; letter-spacing: 0.5px; font-weight: 300; } .wrap-about .name { margin: 40px 0 20px 0; font-size: 14px; } .white-bg { background: #ffffff; padding: 120px 0; display: block; } .grey-bg { background: #f6f6f6; padding: 120px 0; display: block; } #testimonial { background-image: url('../Images/testimonial-bg.jpg'); -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-repeat: no-repeat; position: relative; padding: 0; margin: 0; width: 100%; height: 550px; } .list-testimonial { display: block; width: 100%; } .list-testimonial .content-testimonial { text-align: center; color: #ffffff; } .list-testimonial .content-testimonial .testi { font-size: 14px; line-height: 36px; letter-spacing: 2px; } .list-testimonial .content-testimonial .heading{ font-size: 20px; margin-top: 30px; letter-spacing: 2px; color: #B7B7B7; font-weight: 800; text-decoration:underline; } .mask-testimonial{ background-color: rgba(47, 47, 47, 0.7); height: 100%; left: 0; position: absolute; top: 0; width: 100%; } .wrap-testimonial{ z-index: 1; position: relative; } #contact {padding: 120px 0 200px 0;} .skillst {margin-top: 30px;} .skillst .skillbar { width: 100%; height: 10px; background-color: #f6f6f6; position: relative; margin-bottom: 60px; padding: 2px; box-sizing: border-box; } .skillst .count-bar { width: 100%; height: 5px; width: 0px; position: relative; } .skillst .count-bar {background-color: #818181;} .skillst .count-bar span{ font-size: 12px;} .skillst .title { position: absolute; line-height: 25px; top: -35px; left: 0; padding-left: 10px; font-size: 12px !important; } .skillst .count-bar .count { position: absolute; line-height: 18px; top: -28px; right: -20px; width: 40px; height: 18px; color: #fff; text-align: center; background-color: #2f2f2f; } .skillst .count-bar .count span { position: relative; display: block; } .skillst .count-bar .count span:after { position: absolute; left: 50%; margin-left: -4px; top: 18px; content: ""; border-left: 4px solid transparent; border-right: 4px solid transparent; } .skillst .count-bar .count { background-color: #818181;} .skillst .count-bar .count span:after { border-top: 4px solid #818181;} .footer{ width:100%; background-color:#e89980; color:#fff; } .social { margin:0; padding: 0; } .social ul{ margin:0; padding: 5px; } .social ul li{ margin:5px; list-style: none outside none; display: inline-block; } .social i{ width: 40px; height: 40px; color: #fff; background-color: #909aa0; font-size: 22px; text-align: center; padding-top: 12px; border-radius:50%; -moz-border-radius:50%; -webkit-border-radius:50%; -o-border-radius:50%; trasition:all ease 0.3s; -moz-trasition:all ease 0.3s; -webkit-trasition:all ease 0.3s; -o-trasition:all ease 0.3s; -ms-trasition:all ease 0.3s; } .social i:hover{ color: #fff; text-decoration: none; trasition:all ease 0.3s; -moz-trasition:all ease 0.3s; -webkit-trasition:all ease 0.3s; -o-trasition:all ease 0.3s; -ms-trasition:all ease 0.3s; } .fa-facebook:hover{ background: #3B5998; } .fa-google-plus:hover{ background: #DD4B39; } .fa-linkedin:hover{ background: #007BB6; }