.hide-loader{display:none;}
.loader{position: relative;top:20%;}
.overlay{position: absolute;left: 0; top: 0; right: 0; bottom: 0;z-index: 2;background-color: rgba(255,255,255,0.8);}
.overlay-content {
    position: absolute;
    transform: translateY(-50%);
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
    top: 50%;
    left: 0;
    right: 0;
    text-align: center;
    color: #555;
}
.loader-backdrop.show {
    opacity: 0;
}
.loader-backdrop.fade {
    opacity: 0;
}
.loader-backdrop {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1040;
    background-color: #fcfafc;
}
div .slide{overflow: hidden;-webkit-transition: max-height 1.5s cubic-bezier(0, 1.05, 0, 1);-moz-transition: max-height 1.5s cubic-bezier(0, 1.05, 0, 1);transition: max-height 1.5s ease cubic-bezier(0, 1.05, 0, 1);}
div .slideop{-webkit-transition: max-height 2s ease;-moz-transition: max-height 2s ease;transition: max-height 2s ease;padding :5px;max-height: 1000px;}

.contact-box {
	    background-color: #fff;
	        border: 1px solid #ddd;
		    padding: 30px 35px;
		        -webkit-transition: all 0.3s ease-out 0s;
			    -moz-transition: all 0.3s ease-out 0s;
			        -ms-transition: all 0.3s ease-out 0s;
				    -o-transition: all 0.3s ease-out 0s;
				        transition: all 0.3s ease-out 0s;
				}
.contact-box .contact-icon i {
	    font-size: 48px;
	        color: #754ef9;
	}
.contact-box .contact-content {
	    margin-top: 15px;
    }
  .contact-box .contact-content .contact-title {
	      font-size: 18px;
	          font-weight: 600;
		      padding-bottom: 15px;
	      }
h4 {
	    font-size: 22px;
    }
i, span, a {
	    display: inline-block;
    }
p {
	    font-size: 16px;
	        font-weight: 400;
		    line-height: 28px;
		        color: #8a8fa3;
			    margin: 0px;
		    }
@media only screen and (min-width: 768px) and (max-width: 991px) { .contact-area { padding-top: 90px; padding-bottom: 100px; } } @media (max-width: 767px) { .contact-area { padding-top: 70px; padding-bottom: 80px; } } .contact-box { background-color: #fff; border: 1px solid #ddd; padding: 30px 35px; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } @media only screen and (min-width: 992px) and (max-width: 1200px) { .contact-box { padding: 30px 25px; } } @media (max-width: 767px) { .contact-box { padding: 30px 25px; } } .contact-box .contact-icon i { font-size: 48px; color: #754ef9; } .contact-box .contact-content { margin-top: 15px; } .contact-box .contact-content .contact-title { font-size: 18px; font-weight: 600; padding-bottom: 15px; } .contact-box:hover { -webkit-box-shadow: 0px 0px 21px 0px rgba(152, 152, 152, 0.23); -moz-box-shadow: 0px 0px 21px 0px rgba(152, 152, 152, 0.23); box-shadow: 0px 0px 21px 0px rgba(152, 152, 152, 0.23); } p.form-message.success, p.form-message.error { font-size: 16px; color: #333; background: #ddd; padding: 10px 15px; margin-top: 15px; } p.form-message.success.form-message.error, p.form-message.error.form-message.error { color: #f00; } .single-form { margin-top: 30px; } .single-form input, .single-form textarea { width: 100%; height: 55px; border-radius: 5px; border: 1px solid #ddd; padding: 0 25px; font-size: 16px; color: #8a8fa3; } .single-form input.placeholder, .single-form textarea.placeholder { opacity: 1; color: #8a8fa3; } .single-form input:-moz-placeholder, .single-form textarea:-moz-placeholder { opacity: 1; color: #8a8fa3; } .single-form input::-moz-placeholder, .single-form textarea::-moz-placeholder { opacity: 1; color: #8a8fa3; } .single-form input::-webkit-input-placeholder, .single-form textarea::-webkit-input-placeholder { opacity: 1; color: #8a8fa3; } .single-form input:focus, .single-form textarea:focus { border-color: #754ef9; } .single-form textarea { height: 135px; padding-top: 10px; resize: none; } .contact-map .gmap_canvas iframe { width: 100%; height: 335px; padding: 10px; border-radius: 5px; background-color: #fff; -webkit-box-shadow: 0px 0px 12px 0px rgba(152, 152, 152, 0.46); -moz-box-shadow: 0px 0px 12px 0px rgba(152, 152, 152, 0.46); box-shadow: 0px 0px 12px 0px rgba(152, 152, 152, 0.46); }

.modal-header{
		padding: 8px !important;
	}
	.modal-title{
			font-weight: 600;
				line-height: normal;
			}
			.modal-footer{
					padding: 5px !important;
						margin-left: auto; margin-right: auto; border: none !important;
					}
		
#about { position: relative; background: #f9f9f9; } #about .box-item { padding: 15px 0; } #about .box-item .icon { float: left; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } #about .box-item .icon i { color: #F97794; display: inline-block; font-size: 36px; margin-bottom: 20px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } #about .box-item .text { margin-left: 64px; } #about .box-item .text h4 { font-weight: 500; font-size: 18px; line-height: 22px; } #about .box-item .text p { font-size: 14px; line-height: 26px; } #about .show-box { margin: 30px 40px; } /* ========================================================================== About Area ========================================================================== */ #about-area .about-thumb { position: relative; z-index: 1; margin-left: 80px; margin-top: 60px; } #about-area .about-thumb img { width: 100%; height: auto; } #about-area .about-thumb-2 { position: absolute; z-index: 5; left: 5%; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }

@media only screen and (min-width: 768px) and (max-width: 991px) { .about-area { padding-top: 90px; padding-bottom: 100px; } } @media (max-width: 767px) { .about-area { padding-top: 70px; padding-bottom: 80px; } } .about-content .about-title { font-size: 18px; font-weight: 500; padding-bottom: 15px; } .about-content ul { padding-top: 15px; } .about-content ul li { width: 50%; float: left; margin-top: 5px; } @media only screen and (min-width: 992px) and (max-width: 1200px) { .about-content ul li { width: 100%; float: none; } } @media (max-width: 767px) { .about-content ul li { width: 100%; float: none; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .about-content ul li { width: 50%; float: left; } } .about-content .single-info .info-icon i { font-size: 16px; color: #754ef9; } .about-content .single-info .info-text { padding-left: 13px; } .about-content .single-info .info-text p span { color: #32333c; } .about-skills .skill-item .skill-header { position: relative; }

.about-skills .skill-item .skill-header .skill-title { font-size: 16px; font-weight: 400; } .about-skills .skill-item .skill-header .skill-percentage { position: absolute; top: 0; right: 0; font-size: 16px; color: #32333c; font-weight: 400; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; } .about-skills .skill-item .skill-header .skill-percentage .count-box { font-size: 16px; color: #32333c; } .about-skills .skill-item .skill-bar { margin-top: 15px; } .about-skills .skill-item .skill-bar .bar-inner { width: 100%; height: 5px; border-radius: 5px; background-color: #d9d9d9; position: relative; } .about-skills .skill-item .skill-bar .bar-inner .progress-line { position: absolute; top: 0; left: 0; height: 5px; border-radius: 5px; background-color: #754ef9; -webkit-transition: all 2s ease-out 0s; -moz-transition: all 2s ease-out 0s; -ms-transition: all 2s ease-out 0s; -o-transition: all 2s ease-out 0s; transition: all 2s ease-out 0s; width: 0; }