/* ================================================= 01 - Global Style ====================================================*/ html,body { height: 100%; margin: 0; } body { font-family: 'Roboto', sans-serif; font-weight: 300; font-size: 15px; line-height: 26px; letter-spacing: 1px; color:#252525; background:#fff; position:relative; } h1,h2,h3,h4,h5,h6 { font-family: 'Roboto', sans-serif; text-transform: capitalize; margin:0 0 10px; font-weight:700; } p { margin:0; color:#555; } a { text-decoration: none; transition: all 0.4s ease; } img{ max-width: 100%; display:block; } a:hover, a:focus { color: #fff; outline: none; text-decoration: none; background:none; } ul, ul li { margin: 0; padding: 0; list-style:none; } .nav li a:focus{ background:none; outline:none; } .section { padding:70px 0; } .section-title { margin-bottom: 20px; text-align: center; } .section-title span{ font-weight:700; } .section-title h2 { font-size: 30px; text-transform: uppercase; margin: 0 0 15px; position:relative; color:#252525; font-weight:500; } .section-title p { font-weight: 400; } .button{ display: inline-block; background: #252525; color: #fff; padding: 12px 25px; text-transform: uppercase; font-size: 14px; border-radius: 5px; font-weight:500; -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1); -moz-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1); box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1); position:relative; } .button:hover{ -webkit-box-shadow: 1px 1px 6px RGBA(105, 91, 91, 0.61); -moz-box-shadow: 1px 1px 6px RGBA(105, 91, 91, 0.61); box-shadow: 1px 1px 6px RGBA(105, 91, 91, 0.61); color:#fff; } .button:hover i{ -webkit-animation-name: hvr-icon-wobble-horizontal; animation-name: hvr-icon-wobble-horizontal; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-iteration-count: 1; animation-iteration-count: 1; } .button:after { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(246, 238, 238, 0.25); content: ""; border-radius: 5px; opacity:0; visibility:hidden; transition:all 0.4s ease; } .button:hover:after { opacity:0.4; visibility:visible; } .clearfix:before, .clearfix:after { content: " "; /* 1 */ display: table; /* 2 */ } .clearfix:after { clear: both; } #breadcrumbs { text-align: center; padding: 55px 0; background: url('../images/skill-bg.jpg'); position:relative; background-repeat:no-repeat; background-attachment:fixed; color:white; } #breadcrumbs:before{ content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:#000; opacity:0.8; } #breadcrumbs h2{ color:#fff; text-transform:uppercase; } #breadcrumbs ul{} #breadcrumbs ul li{ display:inline-block; } #breadcrumbs ul li a{ color:#eee; font-size:18px; text-transform:capitalize; } #breadcrumbs li + li::before { color: #b9b9b9; content: "/ "; padding: 0px; } .slicknav_nav .slicknav_item a:hover, .slicknav_nav .slicknav_item a{ background:none; } .typed-cursor { opacity: 1; -webkit-animation: blink 1s infinite; -moz-animation: blink 1s infinite; animation: blink 1s infinite; font-size: 35px; } .margin-30{ margin-top:30px; } .table { display: table; width: 100%; height: 100%; } .table-cell { display: table-cell; vertical-align: middle; } @keyframes blink{ 0% { opacity:1; } 50% { opacity:0; } 100% { opacity:1; } } @-webkit-keyframes blink{ 0% { opacity:1; } 50% { opacity:0; } 100% { opacity:1; } } @-moz-keyframes blink{ 0% { opacity:1; } 50% { opacity:0; } 100% { opacity:1; } } #header.personal .header-inner,#header.personal .header-inner,#header.personal.sticky,.button,#header .nav li .sub-menu,#header .search-form,#j-slider .owl-dots .owl-dot span,#testimonial .owl-dots .owl-dot span,#statics .static-single span,#service .single-service,#service .single-service .number p,#about-us .single-video:before,#about-us .single-video::after,#about-us .single-video i,#team .team-head::before,#team .team-social,#project .project-head::before,#blog .blog-head:before,#blog .blog-head span,#clients .owl-nav div,#header .social a i,#contact .form-group input,#contact .form-group textarea,#pricing .single-table .table-title,img,#blog .owl-dot span,#header.sticky .header-inner,#blog .blog-head img{ -webkit-transition:all 0.4s ease; -moz-transition:all 0.4s ease; transition:all 0.4s ease; } #about-us .about-video,#about-us .about-main,#my-skill .single-skill,#service .single-service,#team .single-team,#testimonial .single-testimonial,#pricing .single-table,#blog .single-blog,#contact .form,.map{ margin-top:30px; } .no-margin{ margin:0; } #scrollUp { bottom: 20px; right: 20px; background: #252525; color: #fff; font-size: 30px; opacity: 0.5; padding: 4px 10px; } #scrollUp:hover { opacity:1; } .page .map, .page #particles-js{ display:none; } .loader{ position:fixed; top:0; left:0; bottom:0; right:0; background:rgba(37, 37, 37, 0.9); z-index:4444; } .loader-inner{ position:absolute; left:50%; top:50%; margin-left:-40px; } .k-line { display: inline-block; width: 15px; height: 15px; border-radius: 15px; } .k-line11-1 { animation: k-loadingP 2s infinite; } .k-line11-2 { animation: k-loadingP 2s infinite; animation-delay: .15s; } .k-line11-3 { animation: k-loadingP 2s infinite; animation-delay: .30s; } .k-line11-4 { animation: k-loadingP 2s infinite; animation-delay: .45s; } .k-line11-5 { animation: k-loadingP 2s infinite; animation-delay: .60s; } @keyframes k-loadingP { 0% { transform:translateY(0) } 35% { transform:translateY(0); opacity:.3 } 50% { transform:translateY(-20px); opacity:.8 } 70% { transform:translateY(3px); opacity:.8 } 85% { transform:translateY(-3px) } } #footer-top table{ color:white; } #footer-top th, #footer-top td{ padding-left:10px; } #footer-top cite{ color:white; } #footer-top span.rss-date{ color:white; } #footer-top .rssSummary{ color:white; } #footer-top { } .comments-area { margin-top: 30px; } .comments-area h2 { margin-bottom: 15px; } .comments-area ol { margin: 0; list-style: none; } .comments-area ol.comment-list { padding: 0; } .comments-area ol.comment-list article { margin-bottom: 15px; background: #fff; padding: 15px; border-radius: 5px; } .comments-area footer { background: none; padding: 0; text-align: left; } .comments-area .comment-form label, .comments-area .comment-form input { display: block; font-weight: 300; } .comments-area .comment-form input, .comments-area .comment-form textarea { border: 1px solid #ddd; border-radius: 0; box-shadow: none; padding: 10px; width: 100%; } .comments-area .comment-form .form-submit input { color: #fff; text-transform: uppercase; letter-spacing: 3px; border: none; margin-top:15px; } /* Blog Comments */ #blog .blog-comments { margin-top: 30px; background: #fff; padding: 20px; } #blog .blog-comments h2{ text-align:center; text-transform:capitalize; font-size:20px; } #blog .single-comments { overflow: hidden; border-bottom: 1px solid #e2e2e2; padding-bottom: 30px; margin-bottom: 30px; } #blog .single-comments:last-child{ border-bottom:0px solid; padding:0px; margin:0; } #blog .single-comments .main { overflow: hidden; padding-bottom: 15px; } #blog .single-comments .head { float: left; margin-right: 20px; text-align: center; width: 12%; } #blog .single-comments .head img { border-radius: 100%; width: 80px; height: 80px; line-height: 80px; } #blog .single-comments .body { float: left; width: 80%; } #blog .single-comments .comment-list { margin-top: 30px; padding-top: 30px; border-top: 1px solid #e2e2e2; } #blog .single-comments h4 { margin: 0 0 3px; font-size: 18px; text-align: left; font-weight: 600; } #blog .single-comments .meta { font-size: 13px; margin: 0; color: #666; font-weight: 400; } #blog .single-comments p { font-size: 13px; } #blog .single-comments a { text-transform: uppercase; font-size: 13px; font-weight: 600; } #blog .single-comments a i{ margin-right:5px; } #blog .comment-list { padding-left:50px; } #blog .single-comments.login{ text-align:center; } #blog .single-comments.login i{ font-size:20px; } #blog .single-comments.login a{ text-align:center; } #blog .single-comments.login a:hover{ color:#353535; } #blog .comment-author.vcard img{ float:left; }