/*
    Template Name: Guy Thorold - Cognitive Behavioural Hypnotherapist
    Author: Rosie Sturman
    Author URI: logicbyte.co.uk
    Description: 
    Version: 1.0
*/


/* Table of Content
==================================================
1.  Global Styles
2.  Typography
3.  Common styles
4.  Navigation
5.  Header area
6.  Section about
7.  Section service
8.  Section portfolio
9.  Section blog
10. Section testimonial
11. Section contact
12. Section footer


*/


/*---==================================================================== 
1 - Google Font
======================================================================---*/
@import url('https://fonts.googleapis.com/css?family=Raleway:300,400,600,700|Roboto+Condensed:300,400,700');

@import url('https://fonts.googleapis.com/css?family=Ubuntu');


/*--============================================ 
2 - General styles
============================================----*/


/*---=========================================
 input palceholder text style
 ==========================================---*/

:-moz-placeholder {
    color: #FFF;
    font-size: 12px;
    text-transform: uppercase;
}

::-moz-placeholder {
    /* Firefox 19+ */
    color: #FFF;
    font-size: 12px;
    text-transform: uppercase;
}

:-ms-input-placeholder {
    color: #FFF;
    font-size: 12px;
    text-transform: uppercase;
}

::-webkit-input-placeholder {
    color: #FFF;
    font-size: 12px;
    text-transform: uppercase;
}


.ccm-page {height: 100%;}

body {
    width: 100%;
    height: 100%;
    line-height: 24px;
    color: #6a6a6a;
    font-size: 14px;
    font-family: "Roboto Condensed", sans-serif;
    font-weight: normal;
}

.bg-purple {
	background: #d0d3e8!important;
}


html {
    width: 100%;
    height: 100%;
}

a,
a:focus,
a:active,
a:link,
img {
    outline: none;
}

a {
    color: #555;
    -webkit-transition: color .2s ease;
    -moz-transition: color .2s ease;
    -ms-transition: color .2s ease;
    -o-transition: color .2s ease;
    transition: color .2s ease;
}

a {
    cursor: pointer;
    text-decoration: none;
    color: #606060;
    transition: all 0.25s ease 0s;
    -moz-transition: all 0.25s ease 0s;
    -webkit-transition: all 0.25s ease 0s;
    -o-transition: all 0.25s ease 0s;
}

a:hover {
    color: #606060;
    text-decoration: none;
    transition: all 0.25s ease 0s;
    -moz-transition: all 0.25s ease 0s;
    -webkit-transition: all 0.25s ease 0s;
    -o-transition: all 0.25s ease 0s;
}

a:focus {
    outline: none;
    outline-offset: 0;
}

a:link,
a:visited {
    text-decoration: none;
}

p {
    line-height: 26px;
    font-size: 16px;
    font-weight: 300;
    color: #666;
}

img {
    height: auto;
    max-width: 100%;
    border: none;
    outline: none;
    transition: all 0.2s ease 0s;
    -moz-transition: all 0.2s ease 0s;
    -webkit-transition: all 0.2s ease 0s;
    -o-transition: all 0.2s ease 0s;
}

ul,
li {
    list-style-type: none;
    margin: 0px;
    padding: 0px;
}



/*======================================================
     Heading style
==========================================================*/


h1 {
    font-size: 43px;
    line-height: 40px;
}

h2 {
    font-size: 27px;
    line-height: 37px;
    margin-bottom: 20px;
    padding-top: 10px;
}

h3 {
    font-size: 21px;
    line-height: 32px;
}

h4 {
    font-size: 20px;
    line-height: 31px;
    font-weight: 700;
}

h5 {
    font-size: 15px;
    line-height: 23px;
    font-weight: 600;
}

h6 {
    font-size: 13px;
    line-height: 18px;
    font-weight: 600;
}

h1,h2,h3,h4,h5,h6 {
    color: #323232;
    font-family: "Roboto Condensed", sans-serif;
    font-weight: 700;
    margin-top: 0px;
    margin-bottom: 10px;
    color: #333;
    text-transform: uppercase;
}

/*======================================================
     Button Style
==========================================================*/

.btn {
    padding: 14px 40px;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
}

.btn-primary {
    border: 2px solid transparent;
    border-color: #FF7E60;
    background: #FF7E60;
    color: #fff;
    -webkit-transition: all .3s ease 0s;
    -o-transition: all .3s ease 0s;
    transition: all .3s ease 0s;
}

.btn-primary:hover {
    background: #fff;
    border: 2px solid #777777;
    color: #2A2A2A;
}

.btn-primary.active, 
.btn-primary:active, 
.open>.dropdown-toggle.btn-primary,
.btn-primary.focus, 
.btn-primary:focus,
.btn-primary.active.focus, 
.btn-primary.active:focus, 
.btn-primary.active:hover, 
.btn-primary:active.focus, 
.btn-primary:active:focus, 
.btn-primary:active:hover, 
.open>.dropdown-toggle.btn-primary.focus, 
.open>.dropdown-toggle.btn-primary:focus, 
.open>.dropdown-toggle.btn-primary:hover {
    color: #fff;
    background-color: #FFC52E;
    border-color: #FFC52E;
}


.btn-black {
    background: transparent;
    border: 2px solid #ccc;
    color: #2A2A2A;
    -webkit-transition: all .3s ease 0s;
    -o-transition: all .3s ease 0s;
    transition: all .3s ease 0s;
}

.btn-black:hover {
    border-color: #2A2A2A;
    background: #2A2A2A;
    color: #fff;
}

.btn-grey {
    border-color: #eee;
    background: #FAFAFA;
    color: #2A2A2A;
    padding: 12px 40px;
    margin-top: 20px;
    -webkit-transition: all .3s ease 0s;
    -o-transition: all .3s ease 0s;
    transition: all .3s ease 0s;
}

.btn-grey:hover {
    background: #2A2A2A;
    color: #fff;
    border-color: #2A2A2A;
}

.btn-feature {
    background: #2A2A2A;
    border: 1px solid#2A2A2A;
    color: #fff;
    -webkit-transition: all .3s ease 0s;
    -o-transition: all .3s ease 0s;
    transition: all .3s ease 0s;
}

.btn-feature:hover {
    background: #fff;
    color: #2A2A2A;
    border-color: #999;
}

/*======================================================
     navigation 
==========================================================*/

.navbar-henry {
    border-bottom: 1px solid rgba(255, 255, 255, .3);
    text-transform: uppercase;
    font-family: "Roboto Condensed", sans-serif;
}


.navbar-henry .navbar-brand .navbar-toggle {
    padding: 4px 6px;
    font-size: 16px;
    color: #fff;
}

.navbar-henry a {
    color: #fff;
    font-size: 16px;
    font-weight: 600;
}

.navbar-henry .nav li a {
    -webkit-transition: background .3s ease-in-out;
    -moz-transition: background .3s ease-in-out;
    transition: background .3s ease-in-out;
}

.navbar-henry .nav li a:hover {
    outline: 0;
    color: rgba(255, 255, 255, .8);
    background-color: transparent;
}

.navbar-henry .nav li a:focus,
.navbar-henry .nav li a:active {
    outline: 0;
    background-color: transparent;
}

.navbar-henry .nav li.active {
    outline: 0;
}

@media(min-width:768px) {
    .navbar-henry {
        padding: 20px 0;
        border-bottom: 0;
        background: 0 0;
        -webkit-transition: background .5s ease-in-out, padding .5s ease-in-out;
        -moz-transition: background .5s ease-in-out, padding .5s ease-in-out;
        transition: background .5s ease-in-out, padding .5s ease-in-out;
    }
    .navbar-henry.top-nav-collapse {
        -webkit-box-shadow: 0px 0px 2px #777;
        box-shadow: 0px 0px 2px #777;
        background: #FFC52E none repeat scroll 0 0;
        box-shadow: -5px 10px 12px -10px rgba(201, 201, 201, 0.67);

    }
    .navbar-henry.top-nav-collapse .nav li a {
        color: #ffffff;
        font-weight: bold;

    }
    .navbar-henry.top-nav-collapse .nav li.active a {
        background-color: transparent;
        color: #606060!important;

    }
    .navbar-henry.top-nav-collapse .navbar-brand {
        color: #FFC52E;
        background: #fff;
        border-radius: 3px;
    }
}


/*---=========================
Top Header
===========================---*/

#section-home {
    height: 100%;
    padding: 0px;
    position: relative;
    overflow: hidden;
}

.home-title {
    padding-top: 300px;
}
.home-title h2{
    color: #fff;
}

.home-title > h1 {
  color: #fff;
  font-size: 55px;
}

.header-social-icon .social-fb {
    background: #fff;
    color: #FFC52E;
    font-size: 16px;
    border-radius: 3px;
}
.header-social-icon .social-tweet {
    background: #fff;
    color: #FFC52E;
    font-size: 16px;
    border-radius: 3px;
}
.header-social-icon .social-plus {
    background: #fff;
    color: #FFC52E;
    font-size: 16px;
    border-radius: 3px;
}
.header-social-icon .social-in {
    background: #fff;
    color: #FFC52E;
    font-size: 16px;
    border-radius: 3px;
}

#section-home * {text-shadow: 0px 0px 2px rgba(0, 0, 0, .7);}

/*---=========================
Section about
===========================---*/

.pre-about {
    padding-top: 50px;

}
.section-about {
    padding: 40px 0 120px 0;

}

.section-headline h2 {
    margin-bottom: 80px;
    padding-top: 0;
}

.nav-pills > li.active > a, .nav-pills > li.active > a:focus, .nav-pills > li.active > a:hover {
  background-color: #FFC52E;
  color: #fff;
}

.about-nav li{
    font-family: "Roboto Condensed", sans-serif;
    background: #eee;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 14px;
}

.nav > li > a:focus, .nav > li > a:hover {
    
    background: #FFC52E;
    color: #fff;
}

.about-nav li a{
    
    border-radius: 0;
    color: #777;
    letter-spacing: 1px;
}

.about-wrap h4 {
    text-transform: capitalize;
    font-weight: 400;
    font-size: 22px;
    line-height: 34px;
    margin: 0px 0px 30px;
    width: 80%;
}

.about-wrap h2 {
  margin-bottom: 10px;
}

.about-wrap h4 span {
    font-weight: 700;
}

.about-wrap a {}


.single-about-education {
    background-color: #eee;
    margin-top: 30px;
    padding: 15px 5px 40px 10px;

}

.education-icon{
   display: inline-block;
    margin-bottom: 40px;
    width: 12%;
}

.education-icon i {
  border: 2px solid #FFC52E;
  border-radius: 5%;
  color: #FFC52E;
  font-size: 16px;
  height: 40px;
  line-height: 40px;
  position: relative;
  text-align: center;
  transition: all 0.4s ease 0s;
  width: 40px;
}

.education-icon i:hover {
    background: #FFC52E;
    color: #fff;
    border: 2px solid #FFC52E;
}

.education-text {
  float: right;
  width: 88%;
}

.education-text h4 {
    margin: 0;
    font-size: 22px;
    font-weight: 400;
}

/*---=========================
Skills
===========================---*/


.section-title {
    border-bottom: 2px solid #eee;
    color: #333;
    margin-bottom: 30px;
    margin-top: 30px;
    padding-bottom: 10px;
    text-transform: uppercase;
}

.section-item-title-2 {
    border-bottom: 1px solid #eee;
    color: #333;
    line-height: 24px;
    margin: 0 0 10px;
    padding-bottom: 5px;
}

.skills-list {
    list-style: outside none none;
    margin-bottom: 40px;
}

.skills-list {
    margin-left: 0;
    padding-left: 0;
}

.progress {
    height: 30px;
    margin-bottom: 10px;
    position: relative;
    border-radius: 0;
    box-shadow: 0 0 0 rgba(0, 0, 0, 0.1) inset;
}

.progress-bar {
  background: #3498db none repeat scroll 0 0;
  width: 20%;
}

.progress > .progress-type {
    background-color: rgba(50, 50, 50, 0.5);
    color: #ffffff;
    font-size: 14px;
    font-weight: 500;
    left: 0;
    padding: 3px 20px 5px 10px;
    position: absolute;
}

.progress > .progress-completed {
    color: #777;
    font-size: 14px;
    font-weight: 600;
    padding: 0 5px 5px;
    }

.progress-bar-2 {
  background: #9b59b6 none repeat scroll 0 0;
}

.progress-bar-3 {
  background: #e74c3c none repeat scroll 0 0;
}

.progress-bar-4 {
  background: #c0392b none repeat scroll 0 0;
}


/*---=========================
Section service
===========================---*/

.section-service {
    padding: 120px 0;
    background: #d0d3e8;

}

.section-service h2 {
    margin-bottom: 80px;
    padding-top: 0;
    color: #fff;
}
  
.section-service h4 {
    padding: 20px 0 0;
    color: #fff;
}

.service-content p {
}

.service{
    border: 2px solid #fff;
    border-radius: 0 0 3px 3px;
    padding: 20px;
}

.service-icon {
    background-color: #fff;
    border-left: 2px solid #fff;
    border-radius: 3px 3px 0 0;
    border-right: 2px solid #fff;
    border-top: 2px solid #fff;
    color: #FFC52E;
    font-size: 30px;
    text-align: center;
    }

.fa-code, .fa-user-plus, .fa-medkit, .fa-cogs {
    background-color: white;
    border: 2px solid #d0d3e8;
    border-radius: 50px;
    height: 90px;
    padding: 28px;
    position: relative;
    text-align: center;
    top: 32px;
    width: 90px;
}

.fa-facebook, .fa-twitter, .fa-linkedin, .fa-google-plus, .fa-dribbble{
  background: #d0d3e8 none repeat scroll 0 0;
  color: #fff;
  height: 40px;
  padding: 12px;
  text-align: center;
  width: 40px;
}



/*============================================
   SECTION PORTFOLIO 
===============================================*/

#section-portfolio {
    padding: 120px 0;
}

.section-heading h2 {
    margin: 0 0 80px;
    font-size: 36px;
}

.project-heading {
    margin: 120px 0px;
}

.portfolio {
    background: #fff;
}

.work-inner {
    margin-top: 60px;
}

.portfolio-inner .mix {
   padding: 10px;
}

ul.portfolio {
    padding: 0;
    list-style: none;
    margin-left: 8px;
    text-align: center;
    margin-bottom: 60px;
}

ul.portfolio li {
    border: 2px solid #ccc;
    color: #777;
    cursor: pointer;
    display: inline-block;
    font-size: 14px;
    font-weight: bold;
    padding: 7px 15px;
    text-transform: uppercase;
    font-family: "Roboto Condensed", sans-serif;
    letter-spacing: 1px;
}

ul.portfolio li:hover {
    background: #FFC52E;
    color: #fff;
    border: 2px solid #FFC52E;
}


.portfolio .item {
    position: relative;
}

.portfolio .item img {
    width: 100%;
    z-index: 99999;
}

.portfolio-caption {
    color: #333333;
}

.portfolio-caption {
    position: absolute;
    left: 0;
    top: 0;
    text-align: center;
    height: 100%;
    width: 100%;
    background: rgba(0, 0, 0, 0.8) none repeat scroll 0 0;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    -webkit-transition: all 0.4s ease-out;
    transition: all 0.4s ease-out;
}

.portfolio-caption h4 {
    font-size: 12px;
    text-transform: uppercase;
    font-weight: 900;
    color: #fff;
    -webkit-transition: .3s;
    transition: .3s;
    border: 1px solid #fff;
    padding: 10px 10px;
    display: inline-block;
}

.portfolio .item:hover .portfolio-caption {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    -webkit-transition: all 0.4s ease-out;
    transition: all 0.4s ease-out;
}

.portfolio .item:hover .portfolio-caption h4 {
    margin-top: 150px;
    -webkit-transition: .3s;
    transition: .3s;
}


/* ======================================
 Section Blog
/* ====================================== */

.section-blog {
    padding: 120px 0;
    background: #f9f9f9;
}

.blog-item {
    background: #fff none repeat scroll 0 0;
    border: 1px solid #ebebeb;
    border-radius: 5px;
    box-shadow: 0 2px 6px 0 rgba(0, 1, 1, 0.05);
}

.blog-headline {
    margin-bottom: 0;
    padding: 0 15px;
}

.blog-headline h3 {
  margin-bottom: 0;
  padding: 15px 0 10px;
}

.blog-comment {
  padding: 0 15px;
}

.blog-comment a {
    font-size: 14px;
    color: #777;
    font-weight: 600;
}

.blog-comment p {
    margin-bottom: 0;
}

.blog-content {
    margin-top: 20px;
    padding: 0 15px;
}

.blog-category {
    background: #FFC52E none repeat scroll 0 0;
    color: #fff;
    padding: 15px;
    margin-top: 20px;
}

.fa-heart {
    color: red;
}

.blog-list .blog-item {margin-bottom: 30px;}

/*====================================================
   SECTION SINGLE BLOG POST
==========================================================*/

#single-post {
    padding: 90px  0;
}

#section-blog {
    padding: 90px 0;
    background: #fff;
}

#single-section-intro {
    height: 25%;
    padding: 0px;
    position: relative;
    overflow: hidden;
}

.single-intro-caption {
    width: 100%;
    text-align: center;
    position: absolute;
    color: #fff;
    padding-top: 100px;
}

.single-post-area h4 {
  margin: 0px 0 5px;
}

.latest-b-image img {
  margin: 30px 0;
}

.blog-image img {
  padding: 30px 0;
}

.media-object {
  border-radius: 70px;
}

.single-intro-caption h4 {
    font-size: 30px;
    color: #fff;
    line-height: 50px;
    margin: 65px 0px;
    text-transform: inherit;
}
.widget {
    border: 1px solid #f0f0f0;
    margin-top: 30px;
    padding: 30px;
}

.widget-title {
    text-align: center;
}

.socials {
    text-align: center;
}

.socials a {
    color: #fff;
    padding: 5px;
}

.about-widget {
    text-align: center;
}

.widget > h4 {
  background: #777 none repeat scroll 0 0;
  color: #fff;
  margin-bottom: 0;
  padding: 7px;
  text-align: center;
}

.about-widget  h4 {
    margin-top: 30px;
}

.instagram img {
    margin-right: -5px;
    width: 33.3%;
}

.signup p{
    text-align: center; 
}

#comments {
    padding: 60px;
}

.comment-form{
    padding: 60px 0;
}


.signup form input {
  background: #f6f6f6 none repeat scroll 0 0;
  border: 1px solid #ccc;
  color: #9f9f9f;
  margin-bottom: 10px;
  padding: 12px 16px;
  width: 100%;
}

.signup form button {
  background: #777 none repeat scroll 0 0;
  border: 0 none;
  color: #fff;
  font-weight: 600;
  letter-spacing: 1px;
  padding: 12px 20px;
  text-transform: uppercase;
  width: 100%;
}

.widget:first-child{
    margin-top: 0;
}

.widget > ul {
  margin-bottom: -12px;
  margin-top: -12px;
  width: 100%;
}

.widget li {
  border-bottom: 1px solid #f0f0f0;
  color: #353535;
  padding: 12px 0;
  width: 100%;
}
.widget ul li a{
    color: #777;
}

.widget > ul li:last-child {
  border: 0 none;
}

.widget li span {
  color: #b4b4b4;
  float: right;
}


.tags > a {
  border: 1px solid #777;
  color: #777;
  line-height: 44px;
  margin: 0;
  padding: 10px;
}

.blog-info {
  color: #777;
  font-size: 14px;
  font-weight: 600;
}


/* ======================================
 Testimonial section
/* ====================================== */

.section-testimonial {
    padding: 120px 0;
}

.testimonial-overlay {
    position: absolute;
    content: "";
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    height: 100%;
}

.testimonial-overlay.black {
    position: absolute;
    background: rgba(0, 0, 0, 0.5) none repeat scroll 0 0;
    
}

.testimonial-overlay.grey {
    position: absolute;
}

.testimonial img {
  margin: 0 auto;
  border-radius: 70px;
  margin-bottom: 30px;
}

#section-testimonial {
    -webkit-background-size: cover;
    background-size: cover;
    position: relative;
}

#testimonial-carousel .item {
    
    color: #fff;
    margin: 0 auto;
    text-align: center;

}

#testimonial-carousel .item p,
#testimonial-carousel .item h4,
#testimonial-carousel .item h5 {
    color: #fff;
    margin: 0;
}

#testimonial-carousel .item p {
    color: #ccc;
    margin: 20px auto;
    width: 70%;
}

#testimonial-carousel .item i {
    font-size: 45px;
    text-align: center;
    line-height: 45px;
    width: 100%;
    margin: 0px auto 30px;
    border: 1px solid #ffffff;
    width: 65px;
    height: 65px;
    border-radius: 50px;
}

#testimonial-carousel .carousel-indicators {
    bottom: -45px;
}

#testimonial-carousel .carousel-indicators li {
    margin: 5px;
    cursor: pointer;
    opacity: 0.4;
    transition: all 0.4s;
    border-color: #fff;
}

#testimonial-carousel .carousel-indicators .active {
    opacity: 1;
    background: #FFC52E;
}

/* ======================================
 Contact section
/* ====================================== */


#section-contact {}

.section-contact {
     padding: 120px 0;
}

.henry-contact-form {
  background: #f9f9f9 none repeat scroll 0 0;
  padding-left: 0;
  padding-right: 0;
}

.section-heading.contact-heading h2 {
  color: #fff;
}

.col-md-6.henry-form {

    padding: 20px 30px;
}

.col-md-6.henry-address {
  background: #d0d3e8 none repeat scroll 0 0;
  padding: 20px 30px 90px 20px;
}

.form-control {
    border-radius: 0;
    box-shadow: none;
    height: 46px;
    border: 1px solid #ddd;
}

.btn-primary {
    background: #FFC52E;
    color: #fff;
    font-weight: bold;
    border: 2px solid #FFC52E;
    border-radius: 0;
}


.input-group-addon {
    border-radius: 0;
}


.input-group-addon {
    background: #FFC52E;
    color: #fff;
}

.form-padding {
    padding: 20px 0;
}

.list-inline {
    margin-left: 0;
}

.henry-address > h2,
.henry-address > h4 {
  color: #fff;
}

.henry-phone {
    background: #FFC52E none repeat scroll 0 0;
    border-radius: 18px;
    color: #FFC52E;
    height: 35px;
    margin-right: 10px;
    margin-top: 10px;
    padding: 10px;
    text-align: center;
    width: 35px;
}

.calling-address {
    color: #fff;
}

.henry-phone {
    background: #fff none repeat scroll 0 0;
    border-radius: 18px;
    color: #FFC52E;
    height: 35px;
    margin-right: 10px;
    margin-top: 10px;
    padding: 10px;
    text-align: center;
    width: 35px;
}

/* ======================================
 Footer section
/* ====================================== */

.section-footer {
     padding: 80px 0;
}


.footer-social-icon .social-fb {
    color: #fff;
    font-size: 16px;
    border-radius: 3px;
}
.footer-social-icon .social-tweet {
    color: #fff;
    font-size: 16px;
    border-radius: 3px;
}
.footer-social-icon .social-plus {
    color: #fff;
    font-size: 16px;
    border-radius: 3px;
}
.footer-social-icon .social-in {
    color: #fff;
    font-size: 16px;
    border-radius: 3px;
}

.copy {
  font-family: roboto condensed;
  font-size: 18px;
  letter-spacing: 1px;
  padding: 15px;
}



/* ======================================
 section-help
/* ====================================== */
.section-help {
    padding: 120px 0;
    background: #ececec;
}

#section-help {
    -webkit-background-size: cover;
    background-size: cover;
    position: relative;
}

.section-help h2,
.section-help a,
.section-help p {
	color: #fff;
}

/* ======================================
Margin
/* ====================================== */
.mt {margin-top: 30px!important;}
.mb {margin-bottom: 30px!important;}