/*-----------------------------------------------------------------------------------

    Template Name: Adsunt - One Page Portfolio Template
    Template URI: https://devitems.com/html/redleaf-preview
    Description: This is raptas One Page Portfolio Template
    Author: HasTech
    Author URI: https://devitems.com

-----------------------------------------------------------------------------------
    
    CSS INDEX
    ===================
	
    1. Template default css
    2. Header area
    3. About area
    4. Service
    5. Portfolio
    6. Counter
    7. Team
    8. Blog
    9. Blog details
    10. Testimonial
    11. Contact
    12. Footer
    13. Breadcrumb style
    
-----------------------------------------------------------------------------------*/
/*----------------------------------------*/
/*  1. Template default css
/*----------------------------------------*/



table.table_oc {
    width: 100%!important;
    border: 1px #E3E3E3 solid!important;
    border-collapse: collapse!important;
    border-spacing: 0!important;
}

table.table_oc th {
    font-size: 90%!important;
    width: 30%!important;
    padding: 5px!important;
    border: #E3E3E3 solid!important;
    border-width: 0 0 1px 1px!important;
    background: #e1dfe0!important;
    line-height: 120%!important;
    text-align: center!important;
}

table.table_oc td {
    font-size: 90%!important;
    width: 70%!important;
    padding:  5px 8px 5px 20px!important;
    border: 1px #E3E3E3 solid!important;
    border-width: 0 0 1px 1px!important;
    display:table-cell!important;
    text-align: left!important;
    background: #F5F5F5!important;
}

.youtube {
  width: 100%;
  aspect-ratio: 16 / 9;
}
.youtube iframe {
  width: 100%;
  height: 100%;
}





.btn-flat-border {
  display: inline-block;
  padding: 0.3em 1em;
  margin-left: 20px;
  margin-bottom: 10px;
  text-decoration: none;
  color: #333;
  border: solid 2px #333;
  border-radius: 3px;
  transition: .4s;
}

.btn-flat-border:hover {
  background: #333;
  color: white;
}


.pt20pb40{
padding-top: 20px!important;
  padding-bottom: 40px!important;
}

.pb40{
  padding-bottom: 40px!important;
}

.flex_pro{display: flex;}
.pro_img{width: 50%;}

.pro_img70{width: 75%}
.pro_img30{width: 25%}

@media only screen and (max-width: 767px) {
.flex_pro{display:block;}
.pro_img{width: 100%;}
.pro_img70{width: 100%}
.pro_img30{width: 100%}
}




.padding20px{
  padding: 20px!important;
}

@import url('https://fonts.googleapis.com/css?family=Lato:300,400,700');
html,
body {
    height: 100%;
}
.float-left {
    float: left
}
.float-right {
    float: right
}
.alignleft {
    float: left;
    margin-right: 15px;
    margin-bottom: 15px
}
.alignright {
    float: right;
    margin-left: 15px;
    margin-bottom: 15px
}
.aligncenter {
    display: block;
    margin: 0 auto 15px
}
a:focus {
    outline: 0px solid
}
img {
    max-width: 100%;
    height: auto
}
.fix {
    overflow: hidden
}
p {
    margin: 0 0 15px;
    font-family: 'Lato', sans-serif;
    line-height: 24px;
    font-size: 14px;
    color: #666666;
}
p:last-child {
    margin-bottom: 0;
}
.resizeimage22 img { width: 100vw; }


a:focus,
a:hover {
    text-decoration: none;
}
h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0 0 10px;
    font-family: 'Montserrat';
    color: #444;
}
a {
    transition: all 0.3s ease 0s;
    text-decoration: none;
}
a:hover {
    text-decoration: none;
    color: #1879fd;
}
a:active,
a:hover {
    outline: 0 none;
}
ul {
    list-style: outside none none;
    margin: 0;
    padding: 0
}
.clear {
    clear: both
}
body {
    font-family: 'Montserrat';
    background: #fff none repeat scroll 0 0;
    color: #444;
}
.height-100vh {
    height: 100vh;
}

.youtube {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

.pcv{display:block !important;}
.spv{display:none !important;}

/* Mobile :750px. */
@media only screen and (max-width: 1000px) {
.pcv{display:none !important;}
.spv{display:block !important;}	
}




.table,
.table-cell {
    display: table;
    height: 100%;
}
.table-cell {
    display: table-cell;
    vertical-align: middle;
}
.table {
    margin-bottom: 0;
}


table#table_responsive {
    width: 100%;
    border: 1px #E3E3E3 solid;
    border-collapse: collapse;
    border-spacing: 0;
}

table#table_responsive th {
    font-size: 90%;
    width: 30%;
    padding: 5px;
    border: #fff solid;
    border-width: 0 0 1px 1px;
    background: #e1dfe0;
    line-height: 150%;
    text-align: center;
}

table#table_responsive td {
    font-size: 90%;
    width: 70%;
    padding:  5px 8px 5px 20px;
    border: 1px #E3E3E3 solid;
    border-width: 0 0 1px 1px;
    display:table-cell;
    text-align: left;
    background: #F5F5F5;
    line-height: 200%;
}



.example {
  position: relative;
  }

.example a {/*aタグを画像の真ん中に*/
  position: absolute;
  top: 53%;
  left: 80%;
  -ms-transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  /*以下装飾*/
  margin:0;/*余計な隙間を除く*/
  font-size: 1px;/*文字サイズ*/
  /*border: solid white 2px; 線で囲う*/
  padding: 145px;/*文字と線の間の余白*/
  color: white;/*文字色*/
  text-decoration: none;/*下線を表示させない*/
  }

@media screen and (max-width: 991px) {
	/* 991px以下に適用されるCSS（タブレット用） */
.example a {/*aタグを画像の真ん中に*/
  position: absolute;
  top: 53%;
  left: 80%;
  -ms-transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  /*以下装飾*/
  margin:0;/*余計な隙間を除く*/
  font-size: 1px;/*文字サイズ*/

  padding: 110px;/*文字と線の間の余白*/
  color: white;/*文字色*/
  text-decoration: none;/*下線を表示させない*/
  }  
}


@media screen and (max-width: 767px) {
	/* 767px以下に適用されるCSS（タブレット用） */
.example a {/*aタグを画像の真ん中に*/
  position: absolute;
  top: 53%;
  left: 80%;
  -ms-transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  /*以下装飾*/
  margin:0;/*余計な隙間を除く*/
  font-size: 1px;/*文字サイズ*/

  padding: 65px;/*文字と線の間の余白*/
  color: white;/*文字色*/
  text-decoration: none;/*下線を表示させない*/
  }  
}


@media screen and (max-width: 414px) {
	/* 414px以下に適用されるCSS（タブレット用） */
.example a {/*aタグを画像の真ん中に*/
  position: absolute;
  top: 53%;
  left: 80%;
  -ms-transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  /*以下装飾*/
  margin:0;/*余計な隙間を除く*/
  font-size: 1px;/*文字サイズ*/

  padding: 40px;/*文字と線の間の余白*/
  color: white;/*文字色*/
  text-decoration: none;/*下線を表示させない*/
  }  
}






.relative {
    position: relative
}
/*colored background*/

.white-bg {
    background: #fff;
}
.gray-bg {
    background: #f1f1f1;
}
.black-bg {
    background: #111111;
}
/*colored text*/

.white-text {
    color: #fff;
}
.gray-text {
    color: #7a7a7a
}
.dp-gray-text {
    color: #535353
}
i {
    transition: all .3s ease 0s;
}
/*************************
    Margin top
*************************/

.mt-0 {
    margin-top: 0
}

.mt-20 {
    margin-top: 20px;
}

.mt-40 {
    margin-top: 40px;
}

.mt-100 {
    margin-top: 100px;
}




.mb-52 {
    margin-bottom: 52px
}
.mb-60 {
    margin-bottom: 60px;
}
.mb-100 {
    margin-bottom: 100px;
}

.mtb-60 {
    margin: 60px 0;
}
/*************************
    Padding top
*************************/

.pt-60 {
    padding-top: 60px
}
.pt-90 {
    padding-top: 90px
}
.pt-100 {
    padding-top: 100px
}
.pb-120 {
    padding-bottom: 120px
}
.pt-120 {
    padding-top: 120px
}
.ptb-220 {
    padding: 220px 0
}
.ptb-200 {
    padding: 200px 0
}
.ptb-150 {
    padding: 150px 0
}
.ptb-120 {
    padding: 120px 0;
}
.ptb-100 {
    padding: 100px 0;
}
.ptb-110 {
    padding: 110px 0;
}
.pt-120 {
    padding-top: 120px
}
.pb-80 {
    padding-bottom: 80px;
}
.pb-70 {
    padding-bottom: 70px;
}
.pb-90 {
    padding-bottom: 90px;
}
.pb-100 {
    padding-bottom: 100px;
}
.pb-40 {
    padding-bottom: 40px;
}
.pb-150 {
    padding-bottom: 150px;
}
.pt-200 {
    padding-top: 200px;
}
/*************************
tag-padding
*************************/

.ht-pt {
    padding: 8px 0 14px;
}
/*----------------------
	2. Header area
------------------------*/

.navbar-brand.logo,
.footer-logo > a {
    color: #fff;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.navbar-brand.logo img {
    width: 129px;
}



.main-menu {
    padding-top: 5px;
}
.header-area {
    left: 0;
    padding: 30px 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 999;
}
.header-area.stick {
    background: rgba(0, 0, 0, 0.8) none repeat scroll 0 0;
    position: fixed;
    top: 0;
    animation: 300ms ease-in-out 0s normal none 1 running fadeInDown;
}
.main-menu li {
    display: inline-block;
    padding-left: 30px;
}
.main-menu li a {
    color: #ffffff;
    font-size: 14px;
    font-weight: normal;
    position: relative;
    text-transform: uppercase;
}
.header-area .navbar-brand {
    float: left;
    font-size: non;
    height: -15px;
    line-height: 0;
}
.main-menu.float-right li:first-child {
    padding-left: 0;
}
.main-menu nav ul li a::after {
    background: #ffffff none repeat scroll 0 0;
    content: "";
    height: 1px;
    left: 0;
    position: absolute;
    top: -5px;
    transform: scale(0);
    transition: all 0.3s ease 0s;
    width: 15px;
}
.main-menu nav ul li a::before {
    background: #ffffff none repeat scroll 0 0;
    bottom: -5px;
    content: "";
    height: 1px;
    position: absolute;
    right: 0;
    transform: scale(0);
    transition: all 0.3s ease 0s;
    width: 15px;
}
.main-menu nav ul li.active a::before,
.main-menu nav ul li a:hover::before {
    transform: scale(1);
}
.main-menu nav ul li.active a::after,
.main-menu nav ul li a:hover::after {
    transform: scale(1);
}
.bg-img-1 {
    background: url("img/bg-img/bg_top/001.jpg") no-repeat scroll center bottom / cover;
}
.bg-oapcity-40 {
    position: relative;
}
.bg-oapcity-40::before {
    background: #000 none repeat scroll 0 0;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0.7;
    position: absolute;
    top: 0;
    width: 100%;
}
.top-text {} .slider-img {} .home-slider {} .slider-text h1 {
    color: #ffffff;
    font-size: 72px;
    font-weight: 800;
    margin-bottom: 2px;
    text-transform: uppercase;
}
.single-slider {} .slide-bg {
    background-position: center center;
    background-size: cover;
}
.slider-title {
    color: #fff;
    position: absolute;
    text-align: center;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    z-index: 3;
}
.slider-title h2 {
    color: #fff;
    font-size: 90px;
    font-weight: bold;
    margin-bottom: 0;
    text-transform: capitalize;
}
.slider-title p {
  color: #fff;
  font-size: 20px;
  font-weight: 300;
  letter-spacing: 3px;
  margin: 10px 0 30px;
  text-transform: capitalize;
}
.slider-title > a {
    border: 1px solid #fff;
    color: #fff;
    display: inline-block;
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 1px;
    padding: 14px 30px;
    text-transform: uppercase;
    transition: all 0.3s ease 0s;
}
.slider-title > a:hover {
    border: 1px solid #444;
    background-color: #444;
}
.slider-area .owl-dots {
    bottom: 50px;
    z-index: 9999;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}
/*............. 3. About area ................*/

.about-rightsidebar > h2 {
    font-size: 30px;
    font-weight: 500;
    margin-bottom: 32px;
    text-transform: capitalize;
}
.about-rightsidebar span {
    display: block;
    font-size: 20px;
    font-weight: 300;
    margin-top: 15px;
}
.progress-bar > span {
    background: #444 none repeat scroll 0 0;
    float: right;
    font-size: 11px;
    margin-top: -26px;
    padding: 0 5px;
    position: relative;
}
.progress-bar > span::before {
    border: medium solid transparent;
    content: " ";
    height: 0;
    pointer-events: none;
    position: absolute;
    top: 100%;
    width: 0;
}
.progress-bar > span::before {
    border-top-color: #444;
    border-width: 5px;
    left: 50%;
    margin-left: -5px;
}
.progress {
    background-color: #f0f0f0;
    border-radius: 0;
    box-shadow: none;
    height: 5px;
    margin-bottom: 60px;
    overflow: visible;
    position: relative;
}
.progress .lead {
    color: #666;
    font-size: 13px;
    font-weight: 500;
    left: 0;
    position: absolute;
    top: -23px;
    z-index: 99;
}
.progress-bar {
    background-color: #444;
    box-shadow: color: #fff;
    float: left;
    font-size: 12px;
    height: 100%;
    line-height: 20px;
    transition: width 0.6s ease 0s;
    width: 0;
}
.progress:last-child {
    margin-bottom: 0;
}
.about-bottom {
    overflow: hidden;
    padding-top: 30px;
    margin-top: 30px;
}
/*............. 4. Service ................*/

.single-service {
    margin-bottom: 30px;
    padding: 60px 30px;
    transition: all 0.3s ease 0s;
}
.single-service i {
    font-size: 35px;
    margin-bottom: 15px;
}
.single-service > h3 {
    font-size: 24px;
    font-weight: 300;
    transition: all 0.3s ease 0s;
}
.single-service > p,
.single-service > i {
    transition: all 0.3s ease 0s;
}
.section-title > h2 {
  font-size: 36px;
  font-weight: 700;
  line-height: 56px;
  margin-bottom: 25px;
  padding-bottom: 15px;
  position: relative;
  text-transform: capitalize;
}
.section-title {
  margin: auto auto 55px;
  width: 65%;
}
.section-title > p {
    transition: all 0.3s ease 0s;
}
.section-title > h2::before {
  background: #666666 none repeat scroll 0 0;
  bottom: 0;
  content: "";
  height: 2px;
  left: 0;
  margin: 0 auto;
  position: absolute;
  right: 0;
  transition: all 0.4s ease 0s;
  width: 75px;
}
.single-service:hover {
    box-shadow: 0 25px 45px rgba(0, 0, 0, 0.15);
}
/*............. 5. Portfolio ................*/

.portfolio-menu {
    margin-bottom: 50px;
}
.portfolio-menu button {
    background-color: transparent;
    border: 1px solid #c4c4c4;
    border-radius: 3px;
    color: #666666;
    font-family: "Oxygen", sans-serif;
    font-size: 12px;
    font-weight: 700;
    height: 35px;
    line-height: 20px;
    margin-right: 18px;
    padding: 0 20px;
    text-transform: capitalize;
    transition: all 0.3s ease 0s;
}
.portfolio-menu button:hover,
.portfolio-menu button.active {
    background-color: #444;
    border: 1px solid #444;
    color: #fff;
}
.portfolio {
    margin-bottom: 30px;
    position: relative;
}
.hover-style::before {
    background: #000 none repeat scroll 0 0;
    content: "";
    height: 100%;
    position: absolute;
    transition: all 0.3s ease-in-out 0s;
    width: 100%;
    bottom: 0;
    left: 0;
    opacity: 0;
    right: 0;
    top: 0;
}
.hover-style:hover::before {
    opacity: 0.8;
}
.hover-style {
    display: block;
    position: relative;
}
.portfolio-img > img {
    width: 100%;
}
.portfolio-view {
    left: 0;
    position: absolute;
    right: 0;
    text-align: center;
    top: 50%;
    transform: translateY(-50%);
}
.hover-style .img-poppu::before,
.hover-style .img-poppu::after {
    background: #fff none repeat scroll 0 0;
    bottom: 0;
    content: "";
    height: 30px;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0;
    transition: all 0.3s ease 0s;
    width: 1px;
}
.hover-style .img-poppu::after {
    height: 1px;
    width: 30px;
}
.hover-style .img-poppu {
    border: 1px solid #fff;
    color: #fff;
    display: inline-block;
    height: 60px;
    opacity: 0;
    padding: 5px 25px;
    position: relative;
    text-align: center;
    text-transform: uppercase;
    transform: translateY(20px);
    width: 60px;
    z-index: 99;
}
.portfolio:hover .img-poppu {
    opacity: 1;
    transform: translateY(0px);
}
.portfolio-title {
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    transition: all 0.3s ease-in-out 0s;
    z-index: 2;
}
.title-style-1 {
    bottom: 0;
    padding: 0 20px;
    top: inherit;
}
.portfolio:hover .portfolio-title {
    opacity: 1;
}
.portfolio-title h3 {
    font-size: 19px;
    font-weight: 500;
    transform: translateY(-10px);
    transition: all 0.4s ease-in-out 0s;
}
.title-style-1 h3 a,
.title-style-1 span {
    color: #fff;
}
.title-style-1 h3 a:hover {
    color: #666;
}
.portfolio-title span {
    display: inline-block;
    font-size: 15px;
    line-height: 16px;
    transform: translateY(10px);
    transition: all 0.4s ease-in-out 0s;
}
.portfolio:hover .portfolio-title h3,
.portfolio:hover .portfolio-title span {
    transform: translateY(0px);
}
.hover-style .img-poppu:hover::before,
.hover-style .img-poppu:hover::after {
    background: #000 none repeat scroll 0 0;
}
.hover-style .img-poppu:hover {
    background: #fff none repeat scroll 0 0;
}
/*............. 6. Counter ................*/

.single-count {
    text-align: center;
}
.count-icon span {
    font-size: 35px;
}
.count-title h2 {
    color: #666;
    font-size: 40px;
    font-weight: 300;
    margin: 15px 0;
}
.count-title span {
    font-size: 16px;
    letter-spacing: 1px;
    margin: 0;
    text-transform: capitalize;
}
/*............. 7. Team ................*/

.team-wrapper {
    border: 1px solid #e7e7e7;
    margin-bottom: 30px;
}
.team-member {
    position: relative;
    overflow: hidden;
}
.team-member::before {
    background: transparent none repeat scroll 0 0;
    content: " ";
    display: block;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    transition: all 0.27s cubic-bezier(0, 0, 0.58, 1) 0s;
    width: 100%;
    z-index: 1;
}
.team-member > img {

    width: 100%;
}
.team-icon {
    background: rgba(0, 0, 0, 0.8) none repeat scroll 0 0;
    bottom: -40px;
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    text-align: center;
    transition: all 0.3s ease 0s;
    z-index: 99;
    padding: 10px 0;
}
.team-icon {} .team-wrapper:hover .team-icon {
    opacity: 1;
    bottom: 0px;
}
.team-icon > a {
    border: 1px solid transparent;
    color: #fff;
    display: inline-block;
    font-size: 15px;
    height: 30px;
    line-height: 30px;
    margin: 0 5px;
    opacity: 0;
    text-align: center;
    visibility: hidden;
    width: 30px;
}
.team-wrapper:hover .team-icon > a {
    opacity: 1;
    visibility: visible;
}
.team-icon > a:hover {
    border: 1px solid #fff;
}
.team-wrapper:hover .team-member::before {
    background: rgba(33, 40, 45, 0.55) none repeat scroll 0 0;
}
.team-info {
    padding: 15px 0;
}
.team-info h3 {
    font-size: 20px;
    text-transform: uppercase;
}
/*............. 8. Blog ................*/

.blog-meta {
    margin: 0 0 10px;
}
.blog-info {
    background-color: #fff;
    padding: 20px 25px;
}
.blog-meta > span {
    font-size: 12px;
    font-weight: normal;
    margin-right: 15px;
}
.blog-info > h3 {
    font-size: 18px;
    font-weight: 300;
}
.blog-info > h3 a {
    color: #666;
    transition: all 0.3s ease 0s;
    text-transform: capitalize;
}
.blog-info > h3 a:hover {
    color: #444;
}
.blog-meta > span i {
    margin-right: 10px;
    font-size: 14px;
}
.blog-meta {
    margin: 0 0 10px;
}
.blog-active .col-md-4 {
    width: 100%;
}
.owl-theme .owl-controls .owl-nav div {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 1px solid #666;
    font-size: 30px;
    font-weight: 900;
    height: 50px;
    right: -50px;
    line-height: 48px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    transition: all 0.8s ease 0s;
    width: 50px;
    border-radius: 50%;
    text-align: center;
    color: #666;
    opacity: 0;
}
.owl-theme .owl-controls .owl-nav div:hover {
    background: #fff;
    border: 1px solid #fff;
    color: #666;
}
.owl-theme .owl-controls .owl-nav div.owl-prev {
    left: -50px;
    right: auto;
}
.blog-active:hover .owl-controls .owl-nav div {
    opacity: 1;
}
.blog-info > a {
    border: 1px solid #464646;
    color: #464646;
    display: inline-block;
    font-size: 12px;
    font-weight: 400;
    padding: 8px 30px;
    text-transform: uppercase;
    transition: all 0.3s ease 0s;
}
.blog-info > a:hover {
    background-color: #444;
    color: #fff;
}
/*----- 9. Blog details ------*/

.blog-3-column .blog-meta > span {
    padding-right: 15px;
}
.news-allreply {
    display: inline-block;
    float: left;
    text-align: center;
}
blockquote {
    background-color: #f6f6f6;
    border-left: 2px solid #464646;
    color: #666666;
    font-size: 14px;
    line-height: 26px;
    margin: 23px 0;
    padding: 14px 50px;
    font-family: "Oxygen", sans-serif;
}
.blog-info > p {
    color: #666;
}
h3.leave-comment-text {
    border-bottom: 1px solid #5b5b5b;
    display: inline-block;
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 30px;
    padding-bottom: 10px;
}
.nes-icon > a i {
    color: #666666;
    font-size: 14px;
    margin-top: 10px;
}
.news-allreply img {
    border-radius: 100%;
    width: 100%;
}
.blog-img-details {
    padding-left: 90px;
}
.blog-title > h3 {
    font-size: 16px;
    font-weight: 300;
    margin-bottom: 6px;
    text-transform: capitalize;
}
.blog-title > span {
    color: #666666;
    display: block;
    margin-bottom: 7px;
}
.blog-middle-mrg {
    margin: 32px 0 33px 90px;
}
.leave-form input {
    background: transparent none repeat scroll 0 0;
    border: 1px solid #c1c1c1;
    color: #666666;
    font-size: 14px;
    height: 35px;
    margin-bottom: 30px;
    padding: 0 20px;
    width: 100%;
    transition: all .3s ease 0s;
    font-weight: 200;
}
.leave-form input::-webkit-input-placeholder,
.text-leave textarea::-webkit-input-placeholder,
.main-input input::-webkit-input-placeholder,
.text-leave2 textarea::-webkit-input-placeholder {
    /* Chrome */
    
    color: #666666;
    opacity: 1;
}
.leave-form input::-moz-placeholder,
.text-leave textarea::-moz-placeholder,
.main-input input::-moz-placeholder,
.text-leave2 textarea::-moz-placeholder {
    /* Firefox 19+ */
    
    color: #666666;
    opacity: 1;
}
.leave-form input:focus,
.text-leave textarea:focus {
    border: 1px solid #464646;
}
.text-leave textarea {
    background: transparent none repeat scroll 0 0;
    border: 1px solid #c1c1c1;
    color: #666666;
    height: 165px;
    margin-bottom: 30px;
    padding: 20px;
    font-size: 14px;
    width: 100%;
    transition: all .3s ease 0s;
    font-weight: 200;
}
button.submit {
    background-color: #666;
    border: 1px solid #666;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    padding: 10px 30px;
    text-transform: uppercase;
    transition: all 0.3s ease 0s;
}
button.submit:hover {
    background-color: transparent;
    color: #666;
}
.blog-right-sidebar-top a {
    color: #666666;
    font-size: 14px;
    font-weight: 300;
}
.blog-right-sidebar-top a:hover {
    color: #888;
}
.blog-right-sidebar-top li {
    margin-bottom: 12px;
}
.blog-right-sidebar-top li:last-child {
    margin-bottom: 0px;
}
.blog-right-sidebar-bottom li {
    display: inline-block;
    margin-bottom: 20px;
    margin-right: 14px;
}
.blog-right-sidebar-bottom a {
    border: 1px solid #c1c1c1;
    color: #666;
    display: inline-block;
    padding: 9px 24px;
    transition: all .4s ease 0s;
    font-weight: 300;
}
.blog-right-sidebar-bottom a:hover {
    border: 1px solid #666;
    background-color: #666;
    color: #fff;
}
.blog-img > img {
    width: 100%;
}
.blog-search > form {
    position: relative;
}
.blog-search input[type="text"] {
    background-color: #fff;
    border: 1px solid #666;
    color: #666666;
    font-weight: 300;
    height: 40px;
    line-height: 28.8px;
    margin: 0;
    outline: medium none;
    padding: 5px 15px;
    position: relative;
    transition: all 0.4s ease 0s;
    width: 100%;
}
.blog-search > form > input[type="submit"] {
    background: #666 none repeat scroll 0 0;
    border: 1px solid #666;
    color: #ffffff;
    height: 40px;
    padding-left: 0;
    position: absolute;
    right: 0;
    text-transform: uppercase;
    top: 0;
    width: 80px;
}
.blog-search input[type="text"]:focus {
    border-color: #555;
}
.leave-form input::-webkit-input-placeholder {
    /* Chrome */
    
    color: #666666;
    opacity: 1;
}
.blog-search input::-moz-placeholder {
    /* Firefox 19+ */
    
    color: #666666;
    opacity: 1;
}
.blog-search button.submit {
    background-color: #666;
    border: 1px solid #666;
    color: #fff;
    font-size: 13px;
    height: 40px;
    padding: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 45px;
}
.blog-meta a {
    color: #666666;
    text-transform: capitalize;
    transition: all 0.3s ease 0s;
}
.blog-meta a:hover {
    color: #333;
}
/*............. 10. Testimonial ................*/

.bg-2 {
    background: rgba(0, 0, 0, 0) url("img/bg-img/2.jpg") no-repeat scroll center bottom / cover;
    position: relative
}
.bg-2::before {
    background: #000 none repeat scroll 0 0;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0.82;
    position: absolute;
    top: 0;
    width: 100%;
}
.single-testimonial > img {
    border-radius: 50%;
}
.single-testimonial > h3 {
    color: #fff;
    font-size: 18px;
    font-weight: 400;
    margin: 26px 0 20px;
}
.single-testimonial > p {
    color: #fff;
}
.single-testimonial > img {
    border-radius: 50%;
    margin: 0 auto;
    width: 97px !important;
}
.testimonial-area {
    position: relative;
}
.owl-dots {
    margin-top: 20px;
}
.owl-carousel .owl-controls .owl-dots .owl-dot {
    background-color: transparent;
    border: 1px solid #fff;
    display: inline-block;
    height: 10px;
    width: 36px;
    z-index: 999;
    margin-right: 12px;
}
.owl-carousel .owl-controls .owl-dots .owl-dot.active {
    background-color: #fff;
    border: 1px solid #fff;
}
/*............. 11. Contact ................*/

.single-contact-option i {
    border: 3px solid transparent;
    border-radius: 50%;
    color: #fff;
    font-size: 36px;
    height: 95px;
    line-height: 90px;
    transition: all 0.3s ease 0s;
    width: 95px;
    background: #3e3e3e none repeat scroll 0 0;
    margin-bottom: 50px;
}
.single-contact-option:hover i {
    border: 3px solid #fff;
    box-shadow: 0 0 0 4px #444;
}
.single-contact-option h4 {
    color: #3e3e3e;
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 20px;
    text-transform: uppercase;
}
.single-contact-option p,
.single-contact-option a {
    color: #666;
    font-size: 13px;
    line-height: 26px;
    margin: 0;
    display: block;
}
.single-contact-option a:hover {
    color: #999;
}
.di-na input,
.tnm-textarea textarea {
    background-color: #e7e7e7;
    border: inherit;
    border-radius: 0;
    box-shadow: inherit;
    color: #666;
    font-size: 13px;
    height: 50px;
    outline: medium none;
    padding: 0 20px;
    transition: all 0.3s ease 0s;
    width: 100%;
}
.di-na {
    margin-bottom: 15px;
}
.tnm-textarea textarea {
    height: 250px;
    padding: 15px 20px;
}
.submit input {
    background-color: transparent;
    color: #444;
    display: inline-block;
    font-size: 13px;
    font-weight: normal;
    padding: 10px 40px;
    text-transform: uppercase;
    margin-top: 35px;
    border: 1px solid #03a9f4;
    transition: all 0.3s ease 0s;
    border: 1px solid #444;
}
.submit input:hover {
    background-color: #444;
    color: #fff;
}
.form-control:focus {
    box-shadow: none;
    outline: 0 none;
}
.di-na input::-webkit-input-placeholder,
.tnm-textarea textarea::-webkit-input-placeholder {
    /* Chrome */
    
    color: #666666;
    opacity: 1;
}
.di-na input::-moz-placeholder,
.tnm-textarea textarea::-moz-placeholder {
    /* Firefox 19+ */
    
    color: #666666;
    opacity: 1;
}
#hastech {
    height: 360px;
    width: 100%;
}
.submit {
    text-align: center;
}
/*............. 12. Footer ................*/

.footer-text .social-icon a {
    border: 1px solid #fff;
    border-radius: 50%;
    display: inline-block;
    height: 30px;
    line-height: 27px;
    margin: 0 5px;
    width: 30px;
    color: #fff;
}
.footer-text .social-icon a i {
    display: block;
    line-height: 28px;
    font-size: 14px;
}
.footer-text .social-icon a:hover {
    background-color: #fff;
    color: #666;
}
.footer-text > p {
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    font-family: "Roboto Condensed", sans-serif;
}
.footer-text > p a {
    color: #fff;
}
.footer-text > p a:hover {
    text-decoration: underline;
}
.social-icon.mt-20 {
    margin-bottom: 23px;
}
.footer-top-info ul li {
    color: #fff;
    display: inline-block;
    padding-right: 35px;
}
.footer-top-info ul li i {
    color: #fff;
    padding-right: 10px;
}
.footer-top-info ul li a {
    color: #fff;
    transition: all .3s ease 0s;
}
.footer-top-info ul li a:hover {
    color: #ccc;
}
.footer-address {
    border-bottom: 1px solid #333;
    padding: 30px 0 50px;
}
.footer-text {
    padding-top: 50px;
}
/*--------  13. Breadcrumb style  -----------*/

h2.page-title {
    color: #fff;
    font-size: 30px;
    font-weight: bold;
    letter-spacing: 2px;
    text-transform: uppercase;
}
.breadcrumbs li {
    display: inline-block;
}
.breadcrumbs > ul li {
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
}
.breadcrumbs > ul li a {
    color: #fff;
    padding-right: 17px;
    position: relative;
}
.breadcrumbs > ul li a:hover {
    color: #888888;
}
.breadcrumbs ul li a.active::after {
    color: #888888;
}
.breadcrumbs ul li a::after {
    background-color: #fff;
    content: "";
    font-size: 8px;
    height: 2px;
    margin-left: 11px;
    position: absolute;
    right: 3px;
    top: 7px;
    width: 7px;
}
.ptrn-3 {
    background: rgba(0, 0, 0, 0) url("../../img/pattern/3.jpg") repeat scroll 0 0;
}
.pattern-bread h2.page-title {
    display: inline-block;
    float: left;
    margin-bottom: 0;
}
.pattern-bread .breadcrumbs > ul {
    display: inline-block;
    float: right;
    margin-top: 5px;
}
.border-bread {
    border-bottom: 1px solid #f1f1f1;
    border-top: 1px solid #f1f1f1;
}
.bg-2.bread-bg {
    background-attachment: fixed;
    background-position: center center;
}

.navbar-toggle .icon-bar {
    background-color: #fff;
}

a#scrollUp {
  background: #666 none repeat scroll 0 0;
  bottom: 54px;
  color: #fff;
  font-size: 23px;
  height: 40px;
  line-height: 34px;
  position: absolute;
  right: 32px;
  text-align: center;
  width: 40px;
}