style.css

.text-center{
    text-align:center;
    }
    .text-left{
    text-align:left;
    }
    .text-right{
    text-align:right;
    }
    .clear::after{
    content:"";
    clear:both;
    display:block;
    }
    .left{
    float:left;
    }
    .right{
    float:right;
    }
    img{
    max-width:100%;
    }
    a{
    text-decoration:none;
    }
    .mid-content{
    max-width:900px;
    margin:auto;
    }
    /*css beginning*/
    
    .header-section{
    background-color:white;
    border-bottom:1px solid #ddd;
    position:fixed;
    top:0px;
    left:0px;
    width:100%;
    z-index:9;
    }
    .header-logo{
    width:28%;
    }
    .header-logo img{
    width:50px;
    float:left;
    margin-right:8px;
    margin-top:20px;
    }
    .header-section a{
    color:black;
    }
    .header-logo span{
    display:block;
    margin-top:30px;
    font-size:25px;
    }
    .header-menu{
    width:60%;
    }
    .header-menu ul li{
    display:inline-block;
    position:relative;
    }
    .header-menu ul li a{
    display:block;
    padding:0px 18px;
    line-height:65px;
    font-size:18px;
    
    }
    .header-menu ul li:hover >a{
    background:#ddd;
    }
    /*drop down*/
    .header-menu ul li ul{
    position:absolute;
    left:0;
    top:100%;
    width:180px;
    opacity:0;
    visibility:hidden;
    transition:.5s;
    transform:scaleY(0);
    transform-origin:top center;
    }
    
    .header-menu ul li ul li a{
    display:block;
    }
    .header-menu ul li ul li{
    display:block;
    }
    .header-menu ul li:hover ul{
    opacity:1;
    visibility:visible;
    transform:scaleY(1);
    background:#fff;
    }
    .header-btn{
    width:10%;
    margin-top:35px;
    margin-right:10px;
    text-align:right;
    }
    .header-btn span a{
    border:1px solid #0018f1;
    padding:8px;
    border-radius:3px;
    color:#0018f1;
    }
    /*benner*/
    .benner-section {
    background-image:url("https://www.kaspersky.com/content/en-global/images/repository/isc/2017-images/mobile-img-06.jpg") ;
    padding:200px;
    background-repeat:no-repeat;
    background-size:cover;
    
    position:relative;
    z-index:3;
    margin-top:20px;
    }
    .benner-section::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    height:100%;
    width:100%;
    background:rgba(0,0,0,.4);
    z-index:-4;
    
    }
    .benner-content{
    color:#fff;
    }
    .benner-content h3{
    font-size:30px;
    text-align:center;
    margin-left:-30px;
    }
    .benner-content h1{
    font-size:60px;
    margin:30px 0 ;
    text-align: center;
    }
    .default-btn{
    color:#767676;
    background:#fff;
    display:inline-block;
    padding:15px 30px;
    border-radius:8px;
    margin-right:10px;
    margin-left:10px;
    transition:.5s;
    }
    .default-btn span{
    margin-right:5px;
    }
    .default-btn:hover {
    background:#0018f1;
    border-radius:8px;
    color:#fff;
    }
    .benner-bottom {
    background:#f7f9ff;
    padding:60px 0;
    }
    .vdo{
    width:48%;
    }
    .cnt{
    width:48%;
    }
    .cnt h3{
    font-size:25px;
    font-weight:400;
    margin-bottom:20px;
    }
    .cnt p{
    color:#767676;
    }
    /*service section*/
    .service-section{
    background:#fff;
    padding:70px 0;
    }
    .service-title h1{
    font-size:33px;
    margin-bottom:20px;
    }
    .service-title p{
    color:#767676;
    font-size:20px;
    }
    .service-item{
    padding:50px 0;
    }
    .service-box{
    width:31.3%;
    margin-right:2%;
    box-shadow:4px 4px 20px 0px rgba(0,0,0,.2);
    padding:15px;
    box-sizing:border-box;
    margin-bottom:15px;
    
    }
    .s-icon{
    float:left;
    width:50px;
    font-size:30px;
    line-height:130px;
    color:#0018f1;
    margin-top:-30px;
    }
    .s-content{
    
    }
    .s-content h3{
    font-size:25px;
    margin-bottom:15px;
    margin-top:10px;
    }
    .s-content p{
    color:#767676;
    font-size:18px;
    
    }/*pricing section*/
    .pricing-table-section {
    background:#f7f9ff;
    padding:40px;
    padding:0 0 100px 0 ;
    }
    .pricing-title {
    padding:30px;
    }
    .pricing-title h2{
    font-size:40px;
    margin-bottom:25px;
    }
    .pricing-title p{
    color:#767676;
    font-size:20px;
    margin-bottom:30px;
    }
    .pricing-table{
    
    }
    .pricing-table-item {
    width:31.3%;
    margin-right:2%;
    background:#fff;
    box-shadow:3px 4px 30px 0 rgba(98,120,223,.2);
    }
    .p-heading {
    border-bottom:1px solid #ddd;
    padding:30px;
    transition:.5s;
    }
    .p-heading h4{
    font-size:25px;
    
    }
    .p-heading h1{
    font-size:51px;
    margin:42px 0;
    }
    .p-heading h1 span {
    font-size:20px;
    
    }
    .p-heading h5{
    font-size:21px;
    margin-bottom:25px;
    
    }
    .p-heading p{
    font-size:21px;
    }
    .p-content{
    padding:30px;
    
    }
    .p-content ul{
    list-style:none;
    
    }
    .p-content ul li{
    margin:30px 0;
    font-size:20px;
    color:#767676;
    
    }
    .p-content ul li span {
    color:#0018f1;
    font-size:24px;
    display:inline-block;
    margin-right:15px;
    width:25px;
    
    }
    .p-btn {
    text-align:center;
    padding:25px;
    }
    .p-btn .default-btn {
    box-shadow:3px 4px 30px 0 rgba(0,0,0,.2);
    transition: .5s;
    }
    .pricing-table-item:hover .p-heading{
    background:#0018f1;
    color:#fff;
    }
    .pricing-table-item:hover .p-btn .default-btn{
    background:#0018f1;
    color:#fff;
    }
    
    /*team section*/
    .team-section {
    background:#fff;
    padding:50px;
    }
    .team-title h2{
    font-size:35px;
    margin-bottom:60px;
    }
    .member {
    width:23%;
    margin-right:2%;
    background:#fff;
    box-shadow:3px 4px 30px 0 rgba(98,120,223,.3);
    border-radius:10px 10px 0 0;
    }
    .member img{
    border-radius:10px 10px 0 0;
    width:100%;
    
    }
    .mbr-bio {
    padding:30px;
    }
    .mbr-bio h3{
    font-size:23px;
    margin-bottom:13px;
    }
    .mbr-bio p{
    color:#767676;
    font-size:18px;
    margin-bottom:10px;
    }
    /*newslatter section*/
    .newslatter-section {
    padding:40px 0 60px 0;
    background:#f7f9ff;
    }
    .news-title h2{
    font-size:35px;
    
    }
    .newslatter-from {
    margin-top:50px;
    }
    .defult-input {
    padding:20px 15px;
    border:1px solid transparent;
    border-radius:10px;
    width:350px;
    font-size:20px;
    box-shadow:3px 4px 30px 0 rgba(98,120,223,.2);
    transition:.4s;
    box-sizing:border-box;
    }
    .defult-input:focus {
    box-shadow:3px 4px 30px 0 rgba(98,120,223,.6);
    border:1px solid #0018f1;
    }
    .submit-btn {
    background:#0018f1;
    color:#fff;
    padding:20px 70px;
    font-size:23px;
    border-radius:10px;
    border:none;
    border:2px solid transparent;
    margin-left:20px;
    display:inline-block;
    box-shadow:3px 4px 30px 0 rgba(98,120,223,.2);
    transition:.4s;
    }
    .submit-btn:hover {
    box-shadow:3px 4px 30px 0 rgba(98,120,223,.6);
    border:2px solid #0018f1;
    color:#0018f1;
    background:#fff;
    
    }
    /*blog section*/
    .blog-section {
    padding:10px 0 100px 0;
    }
    .blog-title {
    padding:40 0;
    }
    .bl-heading{
    width:50%;
    }
    .bl-heading h2{
    font-size:35px;
    margin-top:30px;
    }
    .bl-content{
    width:50%;
    }
    .bl-content p{
    color:#767676;
    font-size:18px;
    line-height:1.6em;
    }
    .bl-item {
    
    }
    .bl-post{
    background:#fff;
    width:48%;
    box-shadow:3px 4px 30px 0 rgba(98,120,223,.2);
    
    }
    .bl-post img{
    float:left;
    width:245px;
    margin-right:20px;
    
    }
    .bl-pst-cnt {
    margin-top:18px;
    }
    .bl-pst-cnt h3{
    font-size:25px;
    margin-bottom:15px;
    }
    
    .bl-pst-cnt p{
    color:#767676;
    font-size:15px;
    line-height:1.5em;
    padding-right:8px;
    }
    /*testimonial section*/
    .testimonial-section {
    padding:40px 0 100px 0;
    background: #f7f9ff;
    }
    .testimonial-items{
    
    
    }
    .t-item{
    width:31.3%;
    margin-right:2%;
    }
    .t-item:nth-last-child{
    margin-right:0;
    }
    .t-content {
    background:#fff;
    padding:40px 40px;
    box-sizing:border-box;
    margin-bottom:26px;
    box-shadow:3px 4px 30px 0 rgba(98,120,223,.2);
    position:relative;
    }
    .t-content::after{
    content:"";
    position:absolute;
    bottom:-19px;
    left:0;
    right:0;
    margin:auto;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 20px 21px 0 21px;
    border-color: #ffffff transparent transparent transparent;
    
    }
    .t-content p{
    color:#767676;
    font-size:20px;
    line-height:1.5em;
    position:relative;
    }
    .t-content p::before{
    content:"\f10d";
    font-family:"Font Awesome 5 Free";
    font-weight:800;
    font-size:80px;
    position:absolute;
    opacity:.15;
    left:-17px;
    top:-4px;
    }
    .t-usrs-img {
    width:160px;
    margin:auto;
    }
    .t-usrs-img img{
    border-radius:50%;
    width:80px;
    float:left;
    margin-right:20px;
    }
    .t-usr-nm {
    top:15px;
    position:relative;
    }
    .t-usr-nm h4{
    font-size:18px;
    }
    .t-usr-nm p{
    color:#767676;
    margin-top:10px;
    }
    /*contact section*/
    .contact-section {
    padding-top:50px;
    }
    .contact-row {
    }
    .map-cnt{
    width:48%;
    }
    .from-cnt{
    width:48%;
    margin-top:30px;
    }
    .footer-cnt-from .w100{
    width:100%;
    }
    .w50{
    width:49%;
    }
    .footer-cnt-from .defult-input {
    margin-bottom:20px;
    
    }
    .footer-cnt-from .submit-btn {
    margin-left:0;
    }
    .footer-cnt-from {
    margin-top:40px;
    
    }
    .from-cnt h4 {
    font-size:25px;
    margin-bottom:20px;
    }
    .from-cnt p{
    font-size:18px;
    color:#767676;
    line-height:1.6em;
    }
    .footer-row {
    background: rgb(65, 47, 168);
    color: #fff;
    padding:5px;
    font-size:20px;
    margin-top:20px;
    }