/*
  Template Name: BOOT Expert
  Description: HTML5 / BOOTSTRAP / CSS3 One Page
  Version: 1.0
  Author: Reza
*/
/*=======================================================================
[Table of contents]
=========================================================================
1. Home One
    i. Header
    ii. Menu
    iii. Slider
    iv. Services
    v. Latest Project
    vi. Meet our Team
    vii. Gross Section
    viii. Gross Section
    ix. Pricing table
    x. News Blog
    xi. Contact information
    xii. footer
*/
@media (min-width: 992px) and (max-width: 1199px){
	 /* --------------main menu----------- */
	/*.header-area {
		height: 145px;
	}*/
    .mainMenu > ul > li { margin-right: 20px; }
    .mainMenu > ul > li > a {
	color: #ffffff;
	font-size: 12px;
}
	.mainmenu-area{ min-height: 70px; }
	.mainMenu{ top: -7px; }
	.sb-search{ top: 8px; }
	.header-logo {
		top: 0;
		position: relative;
	}
	.header-logo h2 {
		position: relative;
		width: 236px;
		font-size: 35px;
	}
	/* ----------Slider-area-------------- */
	.section-padding {
		/*top: 41px;*/
		position: relative;
	}
	/* -------------- Feature-area ----------- */
	.envelope {
		width: 40.333333%;
		left: 10%;
	}
	.feature-box-style2 { margin: 0 0 40px; }
	#features { top: 0px; }
	/* -------------- Graphic-area ----------- */
	.graphic-content {
		top: -20px;
		position: relative;
		width: 935px;
		left: -77px;
	}
	/* -------------- services-area ----------- */
	#services{ padding-bottom: 60px; }
	.icon_list_connector {
		left: 10.5%;
	}
	/* -------------- Portfolio-area ----------- */
	.container-less {
		margin-left: 0px;
		margin-right: 0px;
	}
	/*.nav-tabs{ width: 612px; }*/
	span.hs-bdr{ padding: 1px 50px; }
	.project-filter {
		left: 20%;
		position: relative;
		padding-bottom: 30px;
	}
	.project-list {
		left: 44px;
		width: 888px;
		position: relative;
		text-align: center;
	}
	/* -------------- About-us-area ----------- */
	#about-us{
		top: 0px;
		bottom: 50px;
	}
	.circular {
		width: 450px;
		height: 450px;
	}
	.more-about { margin: 40px 0px; }
	/* -------------- Team-area ----------- */
	.envelopes {
		width: 40.333333%;
		left: 15%;
	}
	.team-member { padding-bottom: 40px; }
	.our-skil { width: 40%; }
	.history-area { margin-left: 2px; }
	.price-area { padding-bottom: 40px; }
	/* -------------- Blog-area ----------- */
	.news-box {
		width: 650px;
		left: calc(50% - 329px);
	}
	/* -------------- Footer-Top-area ----------- */
	.footer-top-area h4 { width: 58%; }
	.quick-link h4:after, .right-side h4:after {
		top: 31px;
		left: 15px;
	}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
	/* --------------Header area----------- */
	#info {
		margin-top: 28%;
		width: 139px;
	}
	.language-box {
		margin-top: 2%;
		position: relative;
		width: 52%;
		left: 20%;
		text-align: center;
	}
	.ui-dropdown-list ul { right: 0px; }
	.social-icons ul { margin-top: 7%; }
	.social-icons ul li { margin-left: 5px; }
	.header-logo h2 {
		width: 234px;
		font-size: 35px;
	}
	/* --------------main menu----------- */
	.sb-search { display: none; }
	.mainMenu {
		position: relative;
		width: 95%;
	}
	.mainMenu ul {
		float: none;
		display: none;
		margin-bottom: 20px;
		background: #555555;
	}
	.mainMenu ul li {
		float: none;
		margin-right: 0;
		padding: 22px 0 21px;
		text-align: center;
	}
	.menuButton { top: -40px; }
	.header-logo {
		top: 6px;
		position: relative;
	}
	.slider-area {
		z-index: -1;
		position: relative;
	}
	/* --------------Service Area----------- */
	.service-content {
		width: 280px;
		position: relative;
	}
	.service-list {
		width: 360px !important;
	}
	.icon_list_connector {
		left: 50px;
	}
	/* --------------Graphic Area----------- */
	.graphic-content {
		top: -40px;
		position: relative;
	}
	/* -------------- Portfolio-area ----------- */
	.project-filter { left: 60px; }
	.envelopes {
		width: 40%;
		left: 80px;
	}
	/* -------------- About-us-area ----------- */
	#about-us{
		top: 0px;
		bottom: 50px;
	}
	.circular {
		width: 400px;
		height: 400px;
		display: inline-block;
	}
	.more-about { margin: 40px 0px; }
	.features-list {
		width: 480px;
		display: inline-block;
		left: calc(50% - 217px);
		position: relative;
	}
	/* -------------- Team-area ----------- */
	.team-member { padding-bottom: 30px; }
	.project-list{ text-align: center; }
	.container-less {
		margin-left: 0px;
		margin-right: 0px;
	}
	.envelopes2 {
		top: -50px;
		left: -110px;
	}
	.our-histry { width: 25%; }
	.counter-area { padding-bottom: 30px; }
	.gross-area { padding-bottom: 60px; }
	.price-area { padding-bottom: 30px; }
	.pricing-table-area { padding: 65px 0px 0px; }
	/* -------------- Blog-area ----------- */
	.news-area { padding: 60px 0px 0px; }
	.news-box {
		margin: 0px 0px 50px 0px;
	}
	.news-text {
		width: 54%;
	}
	/* -------------- Footer-area ----------- */
	.footer-top-area h4 { width: 77%; }
	.footer-social ul { margin-top: 6% !important; }
}
@media (min-width: 481px) and (max-width: 767px){
	/* -------------- Header-area ----------- */
	#info {
		margin-top: 24px;
		position: absolute;
	}
	.language-box { display: none; }
	.social-icons ul { margin-top: 6%; }
	.social-icons ul li { margin-left: 5px; }
	/* -------------- Menu-area ----------- */
	.header-logo h2 {
		width: 234px;
		font-size: 35px;
	}
	.sb-search {
		display: none;
		position: absolute;
	 }
	.mainMenu {
		position: relative;
		padding-bottom: 15px;
	}
	.mainMenu ul {
		float: none;
		display: none;
		background: #555555;
	}
	.mainMenu ul li {
		float: none;
		margin-right: 0;
		padding: 22px 0 21px;
		text-align: center;
	}
	.menuButton { top: -40px; }
	.header-logo {
		top: 6px;
		position: relative;
	}
	nav.mainMenu { width: 95%; }
	/* -------------- Slider-area ----------- */
	.slider-area {
		z-index: -1;
		position: relative;
	}
	.carousel-captions h1 { font-size: 40px; }
	/* -------------- Feature-area ----------- */
	.section-padding { padding: 50px 0px 0px; }
	.feature-box-style2 .feature-box-containt { width: 90%; }
	.feature-box-containt p {
		max-width: none;
		width: 90%;
	}
	.feature-box-style2:hover span { display: none; }
	/* -------------- Graphic-area ----------- */
	.graphic-content h2{ font-size: 30px; }
	.graphic-content{
		position: relative;
		top: -35px;
	}
	/* -------------- Services-area ----------- */
	.service-content {
		text-align: right;
		margin-right: 30px;
		width: 334px;
		position: relative;
		left: calc(50% - 190px);
		padding-bottom: 150px;
	}
	.icon_list_connector {
		left: 11%;
	}
	/* -------------- About-us-area ----------- */
	#about-us{
		top: 0px;
		bottom: 50px;
	}
	.circular {
		width: 400px;
		height: 400px;
		display: inline-block;
	}
	.more-about { margin: 40px 0px; }
	.features-list {
		width: 440px;
		display: inline-block;
		left: calc(50% - 217px);
		position: relative;
	}
	/* -------------- Team-area ----------- */
	a#prev, a#next{ display: none; }
	.project-filter {
		width: 100%;
		left: -10px;
	}
	.project-filter ul.project-menu {
		width: 99%;
		text-align: center;
		margin: 0px;
		padding: 0px;
		background-color: #252525;
	}
	.project-filter ul.project-menu li {
		background-color: #ffffff;
		text-align: center;
		margin: 0px -4px 25px 0px;
	}
	li.filter.item.pro-active { background-color: #d24d57; }
	.project-list{ text-align: center; }
	.container-less {
		margin-left: 0px;
		margin-right: 0px;
	}
	.history-area { margin: 0px 0px 60px 0px; }
	.our-histry { width: 34%; }
	.nav-tabs {
		width: 100%;
		text-align: center;
		background-color: #252525;
	}
	.nav-tabs>li {
		float: none;
		background-color: #b7b7b7;
		margin-bottom: 25px;
		margin-right: 0px;
		display: inline-block;
	}
	span.hs-bdr {
		border-left: none;
		border-right: none;
	}
	.team-member {
		padding-bottom: 0px;
		left: calc(50% - 130px);
		position: relative;
		margin: 20px 0px; 
	}
	.price-tb {
		margin: 20px 0px;
		padding-bottom: 0px;
		left: calc(50% - 130px);
		position: relative;
	}
	.counter-area { margin: 20px 0px; }
	.counter-area h6 { font-size: 13px; }
		/* -------------- Blog-area ----------- */
	.news-box {
		height: initial;
		width: 270px;
		left: calc(50% - 135px);
	}
	.news-text {
		padding: 25px 20px;
		z-index: 0;
		float: left;
		width: 100%;
	}
	.news-box > .news-image {
		position: relative;
		z-index: 0;
		width: 100%;
	}
	.news-box > .news-image:before {
		display: none;
	}
	.news-box > .news-image:before {
		width: 120%;
		height: 122px;
		margin-top: -93px;
		margin-left: -65px;
		display: block;
		content: '';
		background-color: #fff;
		z-index: 10;
		position: absolute;
		top: 0;
		left: 0;
		transform: rotate(-25deg);
		-moz-transform: rotate(-25deg);
		-webkit-transform: rotate(-25deg);
		-ms-transform: rotate(-25deg);
	}
	/* -------------- Footer-area ----------- */
	.copyright-boot {
		padding: 50px 0px 0px 0px;
		width: 100%;
		position: relative;
		text-align: center;
	}
	.footer-social {
		float: left;
		position: relative;
		text-align: center;
		width: 100%;
	}
	.footer-social ul {
		margin-top: 0%;
		margin: 0px;
		padding: 0px;
	}
	.footer-social ul li {
		margin-left: 0px;
		float: none;
	}
	.footer-social ul li a i { font-size: 20px; }
	.footer-social { padding: 0px 0px 12px 0px; }
}
@media (min-width: 320px) and (max-width: 480px) {
	/* -------------- Header-area ----------- */
	/*.header-area { height: 80px; }*/
	#info {
		margin: 10px 0px 5px 0px;
		position: relative;
		width: 100%;
		text-align: center;
	}
	.language-box { display: none; }
	.social-icons ul { margin-top: 6%; }
	.social-icons ul li { margin-left: 5px; }
	/* -------------- Menu-area ----------- */
	.header-logo h2 {
		width: 234px;
		font-size: 30px;
	}
	.sb-search {
		display: none;
		position: absolute;
	 }
	.mainMenu {
		position: relative;
		padding-bottom: 15px;
	}
	.mainMenu ul {
		float: left;
		display: none;
		background: #555555;
		width: 90%;
		position: relative;
		padding: 25px 0px;
	}
	.mainMenu ul li {
		float: none;
		margin-right: 0;
		padding: 22px 0 21px;
		text-align: center;
	}
	.menuButton { top: -40px; }
	.header-logo {
		top: 6px;
		position: relative;
	}
	/* -------------- Slider-area ----------- */
	.slider-area {
		z-index: -1;
		position: relative;
	}
	.carousel-captions h1 { font-size: 40px; }
	.carousel-captions {
		top: calc(50% - 350px/2);
	}
	/* -------------- Feature-area ----------- */
	.section-padding { padding: 50px 0px 0px; }
	.feature-box-style2 .feature-box-containt {
		width: 80%;
		left: 5% !important;
		position: relative;
	}
	.feature-box-containt p {
		max-width: none;
		width: 90%;
	}
	.feature-box-style2:hover span { display: none; }
	.graphic-content h2{ font-size: 30px; }
	.graphic-content{
		position: relative;
		top: -75px;
	}
	/* -------------- Services-area ----------- */
	.service-content {
		text-align: right;
		margin-right: 30px;
		width: 260px;
		position: relative;
		left: calc(50% - 140px);
		padding-bottom: 150px;
	}
	.icon_list_connector {
		left: 12%;
		top: 90px;
	}
	/* -------------- About-us-area ----------- */
	#about-us{
		top: 0px;
		bottom: 50px;
	}
	.circular {
		width: 260px;
		height: 260px;
		display: inline-block;
	}
	.more-about {
		margin: 40px 0px;
		display: inline;
}
	.features-list {
		width: 291px;
		display: inline-block;
		left: calc(50% - 140px);
		position: relative;
	}
	/* -------------- Team-area ----------- */
	a#prev, a#next{ display: none; }
	.project-filter {
		width: 100%;
		left: -10px;
	}
	.project-filter ul.project-menu {
		width: 99%;
		text-align: center;
		margin: 0px;
		padding: 0px;
		background-color: #252525;
	}
	.project-filter ul.project-menu li {
		background-color: #ffffff;
		text-align: center;
		margin: 0px -4px 25px 0px;
	}
	li.filter.item.pro-active { background-color: #d24d57; }
	.project-list{ text-align: center; }
	.container-less {
		margin-left: 0px;
		margin-right: 0px;
	}
	.container-less img { padding: 0px 0px 6px 0px; }
	.history-area { margin: 0px 0px 60px 0px; }
	.our-histry { width: 50%; }
	.our-skil { width: 50%; }
	.nav-tabs {
		width: 100%;
		text-align: center;
		background-color: #252525;
	}
	.nav-tabs>li {
		float: none;
		background-color: #b7b7b7;
		margin-bottom: 25px;
		margin-right: 0px;
		display: inline-block;
	}
	span.hs-bdr {
		border-left: none;
		border-right: none;
	}
	.team-member {
		padding-bottom: 0px;
		left: calc(50% - 130px);
		position: relative;
		margin: 20px 0px; 
	}
	.price-tb {
		margin: 20px 0px;
		padding-bottom: 0px;
		left: calc(50% - 130px);
		position: relative;
		
	}
	.counter-area { margin: 20px 0px; }
	/* -------------- Blog-area ----------- */
	.news-box {
		height: initial;
		width: 270px;
		left: calc(50% - 135px);
	}
	.news-text {
		padding: 25px 20px;
		z-index: 0;
		float: left;
		width: 100%;
	}
	.news-box > .news-image {
		position: relative;
		z-index: 0;
		width: 100%;
	}
	.news-box > .news-image:before {
		display: none;
	}
	.news-box > .news-image:before {
		width: 120%;
		height: 122px;
		margin-top: -93px;
		margin-left: -65px;
		display: block;
		content: '';
		background-color: #fff;
		z-index: 10;
		position: absolute;
		top: 0;
		left: 0;
		transform: rotate(-25deg);
		-moz-transform: rotate(-25deg);
		-webkit-transform: rotate(-25deg);
		-ms-transform: rotate(-25deg);
	}
	/* -------------- Contact-area ----------- */
	#contact {
		padding: 0px 0px 0px 15px;
		position: relative;
		top: 5%;
	}
	.contact-form {
		width: 90%;
		height: 500px;
		position: relative;
		top: -2px;
		left: 1%;
	}
	/* -------------- Footer-area ----------- */
	.footer-top-area h4 { width: 62%; }
	.copyright-boot {
		padding: 50px 0px 0px 0px;
		width: 100%;
		position: relative;
		text-align: center;
	}
	.social-icons {
		float: left;
		position: relative;
		text-align: center;
		width: 100%;
	}
	.social-icons ul {
		margin-top: 0%;
		margin: 0px;
		padding: 0px;
	}
	.social-icons ul li {
		margin-left: 0px;
		float: none;
	}
	.social-icons ul li a i { font-size: 20px; }
	.footer-social { padding: 0px 0px 12px 0px; }

}






        /* Loading */
        #loading {
            background-color: rgb(255, 255, 255);
            height: 100%;
            width: 100%;
            position: fixed;
            z-index: 9999999;
            margin-top: 0px;
            top: 0px;
            left: 0;
        }
        #loading-center {
            width: 100%;
            height: 100%;
            position: relative;
            z-index: 99;
        }
        #loading-center-absolute, .box svg.box__icon {
            position: absolute;
            left: 50%;
            top: 50%;
            height: 150px;
            width: 150px;
            margin-top: -75px;
            margin-left: -75px; 
            -ms-transform: rotate(45deg); 
            -webkit-transform: rotate(45deg);
            transform: rotate(45deg); 
            z-index: 9999;
        }
        /* Loading Logo */
        #loading-center-absolute.logo-animated {
            -ms-transform: translate(-50%, -50%);
            -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
            width: auto;
            height: auto;
            margin: auto;
            resize: both;
            text-align: center;
        }
        .loader-logo {
            color: #9d141e;
            font-family: TimesNewRoman,Times New Roman,Times,Baskerville,Georgia,serif;
            /*font-size: 4.3vw;*/
            margin: auto;
            letter-spacing: 0;
            font-weight: bold;
            text-transform: none;
        }
        #ajax-loader .loader-logo {
            font-size: 1.8vw;
            letter-spacing: -4px;
        }
        .letter {
            position: relative;
            top: -webkit-calc(50% - 60px);
            top: calc(50% - 60px);
            /* text-shadow: 0px 0px 3px white; */
            display: inline-block;
            padding: 0;
            color: #cc1f86;
            font-size: 14px;
            letter-spacing: 0;
        }
        .letter:nth-child(1) {
            -webkit-animation: fade 4s infinite 200ms;
            animation: fade 4s infinite 200ms;
        }
        .letter:nth-child(2) {
            -webkit-animation: fade 4s infinite 400ms;
            animation: fade 4s infinite 400ms;
        }
        .letter:nth-child(3) {
            -webkit-animation: fade 4s infinite 600ms;
            animation: fade 4s infinite 600ms;
        }
        .letter:nth-child(4) {
            -webkit-animation: fade 4s infinite 800ms;
            animation: fade 4s infinite 800ms;
        }
        .letter:nth-child(5) {
            -webkit-animation: fade 4s infinite 1000ms;
            animation: fade 4s infinite 1000ms;
        }

        .letter:nth-child(6) {
            -webkit-animation: fade 4s infinite 1000ms;
            animation: fade 4s infinite 1000ms;
        }
        .letter:nth-child(7) {
            -webkit-animation: fade 4s infinite 800ms;
            animation: fade 4s infinite 800ms;
        }
        .letter:nth-child(8) {
            -webkit-animation: fade 4s infinite 600ms;
            animation: fade 4s infinite 600ms;
        }
        .letter:nth-child(9) {
            -webkit-animation: fade 4s infinite 400ms;
            animation: fade 4s infinite 400ms;
        }
        .letter:nth-child(10) {
            -webkit-animation: fade 4s infinite 200ms;
            animation: fade 4s infinite 200ms;
        }
        .letter:nth-child(11) {
            -webkit-animation: fade 4s infinite 200ms;
            animation: fade 4s infinite 200ms;
        }
        .letter:nth-child(12) {
            -webkit-animation: fade 4s infinite 200ms;
            animation: fade 4s infinite 200ms;
        }
        .letter:nth-child(13) {
            -webkit-animation: fade 4s infinite 200ms;
            animation: fade 4s infinite 200ms;
        }
        .letter:nth-child(14) {
            -webkit-animation: fade 4s infinite 200ms;
            animation: fade 4s infinite 200ms;
        }
        .letter:nth-child(15) {
            -webkit-animation: fade 4s infinite 200ms;
            animation: fade 4s infinite 200ms;
        }
        .letter:nth-child(16) {
            -webkit-animation: fade 4s infinite 200ms;
            animation: fade 4s infinite 200ms;
        }
        .letter:nth-child(17) {
            -webkit-animation: fade 4s infinite 200ms;
            animation: fade 4s infinite 200ms;
        }
        .letter:nth-child(18) {
            -webkit-animation: fade 4s infinite 200ms;
            animation: fade 4s infinite 200ms;
        }
        .letter:nth-child(19) {
            -webkit-animation: fade 4s infinite 200ms;
            animation: fade 4s infinite 200ms;
        }
        .letter:nth-child(20) {
            -webkit-animation: fade 4s infinite 200ms;
            animation: fade 4s infinite 200ms;
        }
        .letter:nth-child(21) {
            -webkit-animation: fade 4s infinite 200ms;
            animation: fade 4s infinite 200ms;
        }
        .letter:nth-child(22) {
            -webkit-animation: fade 4s infinite 200ms;
            animation: fade 4s infinite 200ms;
        }
        .letter:nth-child(23) {
            -webkit-animation: fade 4s infinite 200ms;
            animation: fade 4s infinite 200ms;
        }
        .letter:nth-child(24) {
            -webkit-animation: fade 4s infinite 200ms;
            animation: fade 4s infinite 200ms;
        }
        .letter:nth-child(25) {
            -webkit-animation: fade 4s infinite 200ms;
            animation: fade 4s infinite 200ms;
        }
        @-webkit-keyframes fade {
            50% {
                opacity: 0.02;
            }
        }
        @keyframes fade {
            50% {
                opacity: 0.02;
            }
        }
        #loading-center-absolute.logo-animated img { max-width: 100%; }



/*Responsive fix*/
#info {
    position: relative;
    margin-top: 0;
    width: auto;
}
#services .icon_list_connector {
    left: 5%;
}
.mb-15 {
	margin-bottom: 15px;
}

@media (max-width:991px) {

	nav.mainMenu {
	    display: none;
	}
	.features-list {
	    max-width: 100%;
	    width: 100% !important;
	    left: auto;
	}
	#services .sided-content {
	    width: 100%;
	}
	.service-content {
	    width: 100%;
	    text-align: left;
	    left: auto;
	    padding: 0;
	}
	.hr-border {
		float: none;
	}
	.book-btn {
	    position: relative;
	    padding: 15px;
	    text-align: center;
	}
	.book-btn .service-btn {
	    float: none;
	    margin: auto;
	    max-width: 220px;
	}
	.envelopes2 {
	    top: auto;
	    left: auto;
    	position: relative;
	}
	.envelopes2 .history-area {
	    margin: auto;
	    display: inline-block;
	}
	.envelopes2 .history-area .nav-tabs>li {
	    float: none;
	    margin: -2px 0px;
	    width: 100%;
	    text-align: center;
	}
	.envelopes {
	    width: 100%;
	    left: auto;
	}

}


@media (max-width: 480px) {
	.header-logo img {
	    max-width: 150px;
	}
}



@media (max-width: 480px) {

	#hamburger {
	    top: 56px;
	}
	section#contacts .contact-form {
	    width: 100%;
	    text-align: center;
	    left: auto;
	    border: none;
	    height: auto;
	}
	section#contacts .contact-form form#contact {
	    position: relative;
	    top: 0;
	    padding: initial;
	}
	.about-icon {
	    text-align: center;
	}
	.about-icon i {
	    float: none;
	    margin: auto;
	}
	.about-content h4 {
	    text-align: center;
	}
	#services .icon_list_connector {
	    display: none;
	}

}