/*!
 * Blendthemes - Seotech v1.0.0 (http://blendthemes.com)
 * Copyright 2016-2017 blendthemes

theme.css is core stylesheet. It is being used to define css styles for
all seotech theme elements. This file contains all css styles for 
this template. Please don't modify this file unless necessary. This will 
make it easy for you to upgrade your website with new template files easily 
when new version of this template will be available.    
--------------------------------------------------------------------------
TABLE OF CONTENT
--------------------------------------------------------------------------

.............................
ALL SEOTECH ELEMENTS STYLE
.............................
  01 GLOGLE STYLES
  02 HELPER CLASSES 
  03 COMMON STYLES
      03.01 Preloder Style
      03.02 Scroll To Top
      03.04 Bbackground Fliters
  04 TPOGRAPHY    
  05 TOP MENU
  06 SECTION TITLES
      06.01 Title Center
      06.02 Title Right
      06.03 Title Sub Text
      06.04 Title Underline Two Colors
      06.05 White Header And Underline
      06.06 Title Large Heading
      06.07 Title Weight And Colors
  07 BUTTONS
  08 FORM ELEMENTS
  09 LIST ITEMS
      09.01 Check List
      09.02 Order List
  10 PAGINATION
  11 TABLES
  12 COUNTERS
  13 PORTFOLIO / CASE-STUDIES  
  14 TESTIMONIALS
      14.01Section Testimonials
      14.02 What Our Cleint Says  
  15 SEARCH TYPES
  16 BLOG
  17 CALL TO ACTION
  18 CHARTS & GRAPHS
  19 SKILLS / PROGRESS BAR
  20 SHOP
  21 PAGE HEADERS
      21.01 Common Header Style
      21.02 Headers With Infographic
      21.03 Headers With Background Images
      21.04 Breadcrumb Nav

.............................
##### PAGE SPECIFIC STYLE ######
.............................
  22 HOME PAGE
      22.01 Section What We Do
      22.02 Section Our Skills
      22.03 Section Our Services
      22.04 Section Tagline Text
      22.05 Section Seo Process
      22.06 Section Recent Case Studies
      22.07 Section Our Pricing  Packages
      22.08 Section What Our Client Says
      22.09 Section Latest Form Blog

  ##SERVICEs PAGES##
  23 LOCAL SEO PAGE
      23.01 Section Local Seo First
      23.02 Section Strategy&Target
      23.03 Section Our Skills
      23.04 Section Request a Free Analysis
  24 E-MAIL MARKETING PAGE
      24.01 Section Compleet Solution
      24.02 Section Grow Your Business
      24.03 Section Free Analysis
  25 SOCIAL MEDIA MARKETING PAGE
      25.01 Section Social Media Marketing Goals
      25.02 Section Professional Tools
      25.03 Section Social Media Promotion
      25.04 Section Maximize Your Social Media Advertising
  26 PAY PER CLICK MANAGEMENT PAGE
  27 SEARCH ENGINE OPTIMIZATION PAGE
  28 PROMOTION SERVICES PAGE 

  ##CASE-STUDIES PAGES##
  29 CASE-STUDIES PAGE
  30 CASE-STUDIES DETAILS-1 PAGE
  31 CASE-STUDIES DETAILS-2 PAGE

  ##PAGES##
  32 ABOUT US PAGE 
      32.01 Section About Text
      32.02 Section Why Chooose
      32.03 Section Core Values
      32.04 Section Meet Our Team
      32.05 Section Our Features   
  33 PARTNERS PAGE 
  34 SEO ANALYSIS PAGE
  35 TESTIMONIALS PAGE
  36 OUR PRICING PAGE
  37 404 PAGE
  38 COMMING SOON PAGE

  ##BLOG PAGES##
  39 STANDERD BLOG PAGE
  40 SINGEL BLOG PAGE

  ##SHOP PAGES
  41 SHOP PAGE
  42 PRODUCT PAGE
  43 CHECKOUT PAGE

  44 CONTACT PAGE
      44.01 Section We Are Here To Help
      44.02 Section Have A Question
      44.03 Section Connect With Us
      44.04 Section Map  

  45 FOOTER
      45.01 Section Common
      45.02 Section Titles
      45.03 Section Social & Contact Info
      45.04 Section News Letter
      45.05 Section Copyright  
  
========================================================================== */



/*
================================= 
01 GLOGLE STYLES
=================================
*/
  html {
    font-size: 14px;
  }

  body {
    overflow-x: hidden;
    font-family: 'Open Sans', sans-serif;
    color: #8c8c8c;
    font-size: 1em;
    line-height: 1.6em;
  }

  h1,h2,
  h3,h4,
  h5,h6 { 
  	color: #000;
    font-weight: bold;
    font-family: 'Roboto', sans-serif;
  }

   h1 {
   	font-size: 34px;
  }

   h2 {
   	font-size: 30px;
  }

   h3 {
   	font-size: 26px;
  }

   h4 {
   	font-size: 22px;
  }

   h5 {
   	font-size: 18px;
  }

   h6 {
   	font-size: 16px;
  }

  a{
    color: #999;
    transition-property: color;
    transition-duration: 0.2s;
    transition-timing-function: linear;
  }

  a:focus, 
  a:hover {
    color: #19b5fe;
  }

  p {
    margin-bottom: 20px;
  }

  #header {
  height: auto;
  display: block;
  background: #fff;  
  width: 100%;
  z-index: 999999999;
  }
  
  #readout {
    background-color: white;
    position: fixed;
    z-index: 100;
    bottom: 0;
    right: 0;
    width: 200px;
    height: 50px;
  }

  #sticky_item{
    z-index: 99999999;
    background-color: #fff;
  } 
/*
================================= 
01 GLOGLE STYLES END 
=================================
*/


/*
================================= 
02 HELPER CLASSES 
=================================
*/
  .justyfied {
    text-align: justify;
  }

  .no-padding {
    padding: 0;
  }

  .no-gutter > [class*='col-'] {
    padding-right: 0;
    padding-left: 0;
  }

  .padding-top-bottom {
    padding: 120px 0;
  }

  .padding-top {
    padding-top: 120px;
  }

  .padding-bottom {
    padding-bottom: 80px;
  }

  .margin-bottom-50 {
    margin-bottom: 50px;
  }

  .margin-bottom-0 {
    margin-bottom: 0 !important;
  }

  .margin-top-20 {
    margin-top: 20px;
  }
/*
================================= 
02 HELPER CLASSES END
=================================
*/


/*
================================= 
03 COMMON STYLES
=================================
*/
/*03.01 Preloder Style*/
  #preloader {
    background-color: #fff;
    bottom: 0;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 1000000;
  }

  #status {
    background-image: url("../img/status.gif");
    background-position: center center;
    background-repeat: no-repeat;
    height: 200px;
    left: 50%;
    margin: -100px 0 0 -100px;
    position: absolute;
    top: 50%;
    width: 200px;
  }
/*03.01 Preloder Style End*/

/*03.02 Scroll To Top*/
  #scrollUp {
    bottom: 40px;
    right: 50px;
    font-size: 18px;
    padding: 15px;
    color: #fff;
    font-size: 18px;
    text-align: center;
    text-transform: uppercase;
    display: block;
    background-color: #19b5fe;
    text-decoration: none;
    -webkit-box-shadow: 0px 0px 10px -6px rgba(0,0,0,0.4);
    -moz-box-shadow: 0px 0px 10px -6px rgba(0,0,0,0.4);
    box-shadow: 0px 0px 10px -6px rgba(0,0,0,0.4);
  }

  #scrollUp i {
    display: block;
    font-size: 24px;
  }

  #scrollUp:hover { 
    background-color: #2e416b;
    color: #fff;
    border-color: #90c695 
  }
/*03.02 Scroll To Top End*/

/*03.04 Bbackground Fliters*/
  .filter {
    background-color: rgba(25,181,254, 0.90);
  }

  .filter-dark {
    background-color: rgba(46,65,107,0.9);
  }
/*03.04 Bbackground Fliters End*/
/*
================================= 
03 COMMON STYLES END
=================================
*/


/*
================================= 
04 TYPOGRAPHY
=================================
*/
/*
================================= 
04 TYPOGRAPHY END
=================================
*/


/*
================================= 
05 TOP MENU
=================================
*/
  .top-nav {
    border-bottom: 1px solid #ececec;
    font-size: 12px;
  }

  .top-nav ul {
    margin: 0;
  }

  .top-nav ul li {
    list-style: none;
    float: left;
    display: inline-block;
  }

  .top-nav ul li:first-child {
    border-left: 1px solid #ececec;
  }

  .top-nav ul li a {
    padding: 10px 18px;
    border-right: 1px solid #ececec;
    display: inline-block;
    text-decoration: none;
  }

  .top-nav ul li a:hover {
    background-color: #e4f1fe;
    color: #000;
  }

  .top-nav .list-inline li {
    padding: 0;
  }

  .top-nav-contact .text {
    padding-left: 10px;
    font-size: 14px;
    line-height: 0;
  }
/*
================================= 
05 TOP MENU END 
=================================
*/


/*
================================
06 SECTION TITLES
================================
*/
  .section-title {
    margin-bottom: 100px;
  } 

  .section-title h1{
    margin-top: 0px;
    margin-bottom: 5px;
  }
/*06.01 Title Center*/
  .title-center {
    text-align: center;
  }

  .title-center .left-right {
    width: 15%;
    margin: 10px auto;
    margin-top: 5px;
    line-height: 0;
  }

  .title-center .title-sub-text {
    width: 55%;
    margin: 0 auto;
  }
/*06.01 Title Center End*/

/*06.02 Title Right*/
  .title-right {
    text-align: right;
  }

  .title-right .left-right {
    margin-top: 0px;
  }

  .title-right .left-right,
  .title-right .title-sub-text {
    float: right;
  }
/*06.02 Title Right End*/

/*06.03 Title Sub Text*/
  .title-sub-text {
    font-family: "Roboto";
    color: #8c8c8c;
  }

  .title-sub-text-1 {
    font-family: "Roboto";
    font-size: 18px;
    font-weight: 300;
    margin-top: 15px;
    margin: 0 auto;
    width: 80%;
  }  
/*06.03 Title Subtext End*/

/*06.04 Title Underline Two Colors*/
  .left, .right {
    width: 50%;
    height: 4px;
    display: inline-block;
  }

  .left {
    background-color: #000;
  }

  .right {
    background-color: #19b5fe;
  }

  .left-right {
    width: 30%;
    margin: 5px 0 10px;
    line-height: 0;
  }
/*06.04 Title Underline Two Colors End*/

/*06.05 White Header And Underline*/ 
  .white, .white p, .white h1 {
    color: #fff;
  }

  .white>.right {
    background-color: #fff;
  }
/*06.05 White Header And Underline End*/ 

/*06.06 Title Large Heading*/
  .lg-light-heading {
    text-transform: uppercase;
    font-weight: 300;
    line-height: 1.2em;
  }
/*06.06 Title Large Heading End*/

/*06.07 Title Weight And Colors */
  .bold {
    font-weight: 800;
  }

  .colored {
    color: #19b5fe;
  }

  .light {
    font-weight: 200;
  }

  .semi-light {
    font-weight: 300;
  }
/*06.07 Title Weight And Colors End*/
/*
================================
06 SECTION TITLES END
================================
*/


/*
=================================
07 BUTTONS
=================================
*/
  .btn {
    border-radius: 0px;
  }

  .btn-theme {
    background-color: #19b5fe;
    border: transparent;
    border-radius: 0;
    color: #fff;
    font-family: 'Roboto', sans-serif;
    transition-property: background-color;
    transition-duration: 0.2s;
    transition-timing-function: linear;
  }

  .btn-theme-lg {   
    padding: 20px 45px;
    font-size: 16px;
  }

  .btn-theme-md {
    font-size: 16px;
    padding: 15px 40px;
  }

  .btn-theme-xs {
    font-size: 12px;
    padding: 5px 10px;
  }

  .btn-theme-sm {
    padding: 10px 20px;
  }

  .btn-dark {
    background-color: #2e416b;
    color: #fff;
  }

  .btn-theme:hover {
    background-color: #0089c9;
    color: #fff;
    transition-property: background-color;
    transition-duration: 0.2s;
    transition-timing-function: linear;
  }

  .btn-dark:hover {
    background-color: #546ea7;
    color: #fff;
    transition-property: background-color;
    transition-duration: 0.2s;
    transition-timing-function: linear;
  }
/*
=================================
07 BUTTONS END
=================================
*/


/*
================================= 
08 FORM ELEMENTS
=================================
*/
/*Forms Groups*/
  .form-group {
    margin-bottom: 40px;
  }

  .form-control {
    border-radius: 0;
    background-color: #fbfbfb;
    border-color: #eaeaea;
    height: 50px;
    box-shadow: none;
  }

  form label {
    color: #2e416b;
    font-weight: 500;
    padding-left: 3px;
  }
/*Forms Groups End*/
/*
================================= 
08 FORM ELEMENTS END
=================================
*/


/*
================================= 
09 LIST ITEMS
=================================
*/
/*09.01 Check List */

  .check-list li i {
    color: #19b5fe;
    margin-right: 10px;
    font-size: 16px;
    float: left;
    line-height: 1.5em;
  }

  .check-list p {
    line-height: 1.5em;
    padding-left: 25px;
  }
/*09.01 Check List  End*/

/*09.02 Order List */
  .list-unstyled li {
    margin-bottom: 10px;
  }

  .order-list li {
    color: #19b5fe;
    font-size: 16px;
    font-weight: bold;
  }

  .order-list li p {
    line-height: 1.5em;
    padding-left: 10px;
    font-size: 14px;
    color: #cecece;
    text-align: left;
    font-weight: normal;
  }
/*09.02 Order List  End*/ 
/*
================================= 
09 LIST ITEMS END
=================================
*/


/*
================================= 
10 PAGINATION
=================================
*/
/*Theme Pagination*/
  .theme-pagination {
    border-radius: 4px;
    display: inline-block;
    margin: 20px 0;
    padding-left: 0;
  }

  .theme-pagination > li {
    display: inline;
  }

  .theme-pagination > li > a, .theme-pagination > li > span {
    color: #000;
    float: left;
    line-height: 1.42857;
    margin-left: -1px;
    padding: 6px 18px;
    position: relative;
    text-decoration: none;
    font-size: 20px;
    font-family: "Roboto";
    font-weight: 300;
  }

  .theme-pagination > li > a:hover,
  .theme-pagination > li > span:hover,
  .theme-pagination > li > a:focus,
  .theme-pagination > li > span:focus {
    z-index: 2;
    color: #fff;
    background-color: #19b5fe;
  }
/*Theme Paginatino End */
/*
================================= 
10 PAGINATION END
=================================
*/


/*
===============================
11 TABLES
===============================
*/
/*Pricing Tabel*/
  #pricing-table {
    margin: -120px auto 50px auto;
    text-align: center;
  }

  #pricing-table .plan {
    background: #fff;
    padding-bottom: 40px;
    -webkit-box-shadow: 0px 0px 6px 2px rgba(0,0,0,0.10);
    -moz-box-shadow: 0px 0px 6px 2px rgba(0,0,0,0.10);
    box-shadow: 0px 0px 6px 2px rgba(0,0,0,0.10);
  }
 
  #pricing-table h3 {
    background-color: #f8f8f8;
    color: #8c8c8c;
    font-weight: 600;
    margin-bottom: -60px;
    padding: 50px 0 70px 0;   
  }  

  #pricing-table .price-tag {
    display: block;
    font: italic 24px/90px "Roboto",sans-serif;
    color: #fff;
    background: #19b5fe;
    border: 5px solid #fff;
    height: 100px;
    width: 100px;
    margin: 10px auto -65px;
    -moz-border-radius: 100px;
    -webkit-border-radius: 100px;
    border-radius: 100px;
  }

  #pricing-table .price-tag .pm {
    font-size: 14px;
    margin-left: -7px;
  }
  
  .tag-text {
    font-weight: 700;
    margin-top: 80px;
  }

  #pricing-table ul {
    margin: 25px 0 0 0;
    padding: 0;
    list-style: none;
  }

  #pricing-table li {
    padding: 10px 0;
  }

  #pricing-table .seo-difficulty {
    padding: 20px;
    background-color: #f8f8f8;
    display: block;
    margin: 60px 0 40px;
  }

  #pricing-table .mark {
    color: #fab905;
  }

  #pricing-table .seo-difficulty strong {
    display: block;
  }  
/*Pricing Table End*/
/*
===============================
11 TABLES END
===============================
*/


/*
===============================
12 COUNTERS
===============================
*/
/*Counter*/
  .counter {
    background-color: #19b5fe;
    color: #fff;
    vertical-align: bottom;
    padding: 60px 0 80px;
  }

  .counter i {
    font-size: 34px;
    float: right;
  }

  .counter .num {
    font-size: 40px;
    font-weight: 700;
    font-family: "Roboto";
    display: block;
    margin: 5px 0;
  }

  .counter p {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 15px 0 0;
    font-family: "Roboto";
  }
/*Counter end*/
/*
===============================
12 COUNTERS END
===============================
*/


/*
===============================
13 PORTFOLIO / CASE-STUDIES
===============================
*/
  .project {
    text-align: center;
    background-color: #e1eefb;
    padding: 24px;
    margin-bottom: 50px;
  }

  .project img {
    margin: 0 auto;
  }

  .project h5 {
    text-transform: uppercase;
    font-weight: 400;
    margin-top: 30px;
  }
/*
===============================
13 PORTFOLIO / CASE-STUDIES END
===============================
*/


/*
===============================
14 TESTIMONIALS
===============================
*/
/*14.01 Section Testimonials */
  .testimonials {
    background-image: url("../img/backgrounds/testimonial-bg.jpg");
    background-size: cover;
    text-align: center;
    background-attachment: fixed;
  }

  .testimonials .filter {
    background-color: rgba(46,65,107,0.9);
    color: #fff;
    padding: 120px 0;
  }

  .testimonials .quote {
    font-family: "Roboto";
    font-style: italic;
    width: 70%;
    line-height: 1.5em;
    font-size: 18px;
    margin: 30px auto;
  }

  .testimonials .client-name {
    text-transform: uppercase;
    color: #fff;
    font-weight: 600;
    font-family: "Roboto";
    font-size: 16px;
    margin-right: 10px;
    display: inline-block;
    margin-top: 30px;
  }

  .testimonials .designation {
    color: #19b5fe;
    font-size: 16px;
  }

  .testimonials .owl-theme .owl-controls {
    padding-left: 0;
    margin-top: 20px;
  }

  .testimonials .left-right {
    margin: 0 auto;
    width: 15%;
  }

  .testimonials .avatar {
    display: block;
    width: 65px;
    height: 65px;
    border-radius: 65px;
    background-color: #000;
    margin: 0 auto;
  }
/*14.01 Section Testimonials End*/

/*14.02 What Our Cleint Says*/
  .client-says .item{  
    padding: 15px 0px;
  }

  .client-says .item .avatar {
    border-radius: 50px;
    display: inline-block;
    height: 70px;
    overflow: hidden;
    width: 70px;
    float: left;
  } 

  .client-says .item h5 {
    text-transform: uppercase;
    margin-bottom: 0;
  }

  .client-says .item .content {
    padding-left: 85px;
  }

  .client-says .item .designation {
    font-style: italic;
    font-size: 12px;
    color: #19b5fe;     
  }

  .client-says .item .quote {
    font-size: 16px;
    font-style: italic;
    letter-spacing: 1px;
    color: #999;
    margin-bottom: 0;
    padding: 25px 0;
  }

  .client-says .owl-theme .owl-nav {
    text-align: left;
    padding-left: 80px;
  }

  .client-says .owl-theme .owl-nav [class*="owl-"] { 
    background: transparent;
    border-radius: 0;
    color: #8c8c8c;
    border: 1px solid #8c8c8c;
    cursor: pointer;
    display: inline-block;
    font-size: 14px;
    margin: 5px;
    padding: 4px 18px;
    transition-property: color, background;
    transition-duration: 0.2s;
    transition-timing-function: linear;
  }

  .client-says .owl-theme .owl-nav [class*="owl-"]:hover {
    background-color: #19b5fe;
    border-color: #19b5fe;
    color: #fff;
    transition-property: color, background;
    transition-duration: 0.2s;
    transition-timing-function: linear;
  }
/*14.02 What Our Cleint Says End*/
/*
===============================
14 TESTIMONIALS END
===============================
*/


/*
===============================
15 SEARCH TYPES
===============================
*/
/*
===============================
15 SEARCH TYPES END
===============================
*/


/*
===============================
16 BLOG
===============================
*/
/*Blog Grid Layout*/

  .blog-post {
    background-color: #f5faff;
    -webkit-box-shadow: 0px 7px 6px 1px rgba(0,0,0,0.14);
    -moz-box-shadow: 0px 7px 6px 1px rgba(0,0,0,0.14);
    box-shadow: 0px 7px 6px 1px rgba(0,0,0,0.14); 
    margin-bottom: 30px;   
  }

  .post-content {
    padding: 20px 20px 10px 20px;
  }

  .post-content h4 {
    font-weight: 400;
    margin: 30px 0;
  }

  .post-content h4 a {
    color: #000;
    text-decoration: none;
    transition-property: color;
    transition-duration: 0.2s;
    transition-timing-function: linear;
  }

  .post-content h4 a:hover {
    color: #19b5fe;
    transition-property: color;
    transition-duration: 0.2s;
    transition-timing-function: linear;
  }

  .post-content a {
    color: #19b5fe;
  }

  .post-content span {
    display: inline-block;
    vertical-align: middle;
    margin-right: 5px;
  }

  .post-content .author {
    color: #000;
  }
/*Blog Grid Layout End*/
/*
===============================
16 BLOG END
===============================
*/


/*
===============================
17 CALL TO ACTION
===============================
*/
/*Call To Action*/
  .call-to-action {
    background-image: url("../img/pattern.png");
    background-size: cover;
    background-color: #fff;
    background-position: center;
  }

  .call-to-action .filter h1 {
    color: #fff;
  }

  .call-to-action .filter {
    color: #fff;
    background-color: rgba(25, 181, 254, 0.9);
    padding: 30px 0;
  }

  .call-to-action h2, .call-to-action p {
    margin: 5px 0;
  }

  .call-to-action .filter button {
    margin-top: 25px;
  }
/*Call To Action End*/ 
/*
===============================
17 CALL TO ACTION END
===============================
*/


/*
===============================
18 CHARTS & GRAPHS
===============================
*/
/*
===============================
18 CHARTS & GRAPHS END
===============================
*/


/*
===============================
19 SKILLS / PROGRESS BAR
===============================
*/
  #skills {
    margin-top: 25px;
  }

  .skillbar-title {
    position:absolute;
    bottom: 15px;
    left:0;
  }

  .skill-bar-percent {
   position:absolute;
   right:0;
   top:-27px;   
  }

  .skillbar-border {
    position:relative;
    color: #000;
    display:block;
    margin-bottom: 60px;
    width:100%;
    border: 1px solid #19b5fe;
    height: 10px;
    -webkit-transition:0.4s linear;
    -moz-transition:0.4s linear;
    -ms-transition:0.4s linear;
    -o-transition:0.4s linear;
    transition:0.4s linear;
    -webkit-transition-property:width, background-color;
    -moz-transition-property:width, background-color;
    -ms-transition-property:width, background-color;
    -o-transition-property:width, background-color;
    transition-property:width, background-color;
  }

  .skillbar-bar {
    width: 0px;
    background: #19b5fe;
    float: left;
    height: 4px;
    margin: 2px 0;
  } 

  .skillbar {
    background-color: #ededed;
    position:relative;
    display:block;
    margin-bottom: 45px;
    width:100%;
    height: 10px;
  }

  .skillbar-bar-1 {
    width: 0px;
    background: #19b5fe;
    border-right: 20px solid #ededed;
    float: left;
    height: 6px;
    margin: 2px;
  }

  .border-box {
    border: 4px solid #19b5fe;
    float: left;
    height: 20px;
    left: -3px;
    margin-left: -20px;
    position: relative;
    top: -5px;
    width: 20px;
  }  
/*
===============================
19 SKILLS / PROGRESS BAR END
===============================
*/


/*
===============================
20 SHOP
===============================
*/
/*
===============================
20 SHOP END
===============================
*/


/*
==================== 
21 PAGE HEADERS 
====================
*/
/*21.01 Common Header Style*/
  .page-header-bg {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    text-align: center;    
  }

    .page-header-bg .filter{
    padding: 70px 0;
    background-color: rgba(25, 181, 254, 0.8);
  }

  .page-header-bg h1 {
    color: #fff;
  }
/*21.01 Common Header Style End*/  

/*21.02 Headers With Infographic*/
  .local-seo-bg {
    background-image: url("../img/page-header-bg/local-seo.png");
  }

  .email-marketing-bg {
    background-image: url("../img/page-header-bg/email-marketing.png");
  }

  .social-media-bg {
    background-image: url("../img/page-header-bg/social-media.png");
  } 

  .case-studies-bg {
    background-image: url("../img/page-header-bg/case-studies.png");
  }

  .about-us-bg {
    background-image: url("../img/page-header-bg/about-us.png");
  }

  .our-clients-bg {
    background-image: url("../img/page-header-bg/our-clients.png");
  } 

  .contact-us-bg {
    background-image: url("../img/page-header-bg/contact-us.png");
  }
/*21.02 Headers With Infographic End*/

/*21.03 Headers With Background Images*/
  .local-seo-bg-img {
    background-image: url("../img/page-header-bg/local-seo.jpg");
  } 
/*21.03 Headers With Background Images End*/

/*21.04 Breadcrumb Nav*/
  .breadcrumb {
    background-color: transparent;
  }

  .breadcrumb li a {
    color: #fff;
    font-weight: 600;
  }

  .breadcrumb .active {
    color: #2e416b;
    text-decoration: underline;
  }

  .breadcrumb > li + li::before {
    content: "";
  }

  .breadcrumb > li > i {
    color: #fff;
    padding-right: 12px;
  }
/*21.04 Breadcrumb Nav End*/  
/*
====================== 
21 PAGE HEADERS END
======================
*/




/*
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
    ======================= PAGE SPECIFIC STYLE =============================
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
*/

/*
========================
22 HOME PAGE
========================
*/
/*22.01 Section What We Do */
  .what-we-do {
    background-color: #19b5fe;
    text-align: center;
    color: #fff;
  }

  .what-we-do .service {
    border-right: 1px dashed #fff;
    width: 20%;
    display: table-cell;
  }

  .what-we-do .service i {
    font-size: 40px;
    margin-bottom: 20px; 
  }

  .what-we-do .service h4 {
    color: #fff;
    font-weight: 400;
    margin: auto 20px;
  }

  .what-we-do .no-border {
    border: transparent;
  }
/*22.01 Section What We Do  End */

/*22.02 Section Our Skills*/
  .our-skils {
    background-color: #e4f1fe;
  }

  .our-skils h4 {
    margin-top: 0px;
    margin-bottom: 15px;
  }
/*22.02 Section Our Skills end*/

/*22.03 Section Our Services*/
  .services {
    text-align: center;
  }

  .services i {
    color: #19b5fe;
    font-size: 40px;
    margin-bottom: 25px;
  }

  .heading {
    font-size: 20px;
  }
/*22.03 Section Our Services End*/

/*22.04 Section Tagline Text*/
  .tag-line{
    text-align: center;
    background-image: url("../img/backgrounds/dedicated-team.jpg");
    background-attachment: fixed;
    background-size: cover;
  }

  .tag-line .filter {
    padding: 80px 0;
  }

  .tag-line h4 {
    color: #fff;
    font-size: 40px;
    font-weight: 400;
    margin-bottom: 10px;
  }

  .tag-line p {
    color: #fff;
    width: 65%;
    margin: 0 auto;
  }
/*22.04 Section Tagline Text End*/

/*22.05 Section Seo Process */
  .our-process {
    text-align: center;
  }

  .seo-process-containt{
    background-color: #f8f8f8;
    padding: 205px 0 120px 0;
    margin-top: -200px;
    text-align: center;
  }

  .seo-process-img, 
  .social-promotion-img {
    margin: 0 auto;
  }

  .border {
    text-align: center;
    border-bottom: 2px dashed #b6b6b6;
    margin: 100px -12px 0 -12px;
  }

  .circle {
    width: 30px;
    height: 30px;
    border: 2px solid #b6b6b6;
    background-color: #fff;
    display: block;
    border-radius: 30px;
    position: relative;
    top: 15px;
    margin: 0 auto;
  }

  .circle-icon {
    display: inline-block;
    background-color: #2e416b;
    color: #fff;
    font-size: 34px;
    vertical-align: middle;
    width: 80px;
    height: 80px;
    border-radius: 80px;
    padding: 22px;
  }

  .seo-headings {
    font-size: 20px;
    font-weight: 500;
    margin-top: 45px;
  }
/*22.05 Section Seo Process End*/

/*22.06 Section Recent Case Studies*/
  .project-list {
    margin-top: -120px;
  }

  .case-studies {
    background-color: #f8f8f8;
    text-align: center;
    padding-bottom: 120px;
  }

  .case-studies .section-title {
    padding-top: 120px;
  }

  .case-studies .bg-img {
    background-image: url("../img/backgrounds/recent-case-studies-bg.jpg");
    background-size: cover;
    background-attachment: fixed;
  }

  .case-studies .filter {
    background-color: rgba(0,0,0, 0.70);
    padding-top: 0;
    padding-bottom: 120px;
  }
/*22.06 Section Recent Case Studies End*/

/*22.07 Section Our Pricing  Packages*/  
  .pricing-packages {
    background-color: #f8f8f8;
    padding-bottom: 120px;
  }

  .pricing-packages .section-background {
    background-color: #fff;
    margin: 0;
    padding: 120px 0 100px;
    -webkit-box-shadow: 0px 7px 6px 1px rgba(0,0,0,0.14);
    -moz-box-shadow: 0px 7px 6px 1px rgba(0,0,0,0.14);
    box-shadow: 0px 7px 6px 1px rgba(0,0,0,0.14);
  }
/*22.07 Section Our Pricing  Packages End*/

/*22.08 Section What Our Client Says*/
  .client-says {
    padding-top: 120px;
  }

  .client-says .section-title{
    margin-bottom: 50px;
    margin-top: 40px;
  }
/*22.08 Section What Our Client Says End*/

/*22.09 Section Latest Form Blog*/
  .our-blog {
    background-color: #f8f8f8;
  }
/*22.09 Section Latest Form Blog End*/
/*
========================
22 HOME PAGE END
========================
*/


/*
============================================
23 LOCLA SEO PAGE CSS
============================================
*/
/*23.01 Section Local Seo First*/
  .local-seo {
    text-align: center;
  }

  .local-seo img {
    margin: 60px auto;
  }

  .local-seo p {
    margin-bottom: 40px;
  }
/*23.01 Section Local Seo First End*/

/*23.02 Section Strategy&Target*/

  .strategy-target {
    border-top: 1px solid #e8e8e8;
    border-bottom: 1px solid #e8e8e8;
  }

  .strategy-target  h1 {
    margin: 80px 0 30px 0;
    float: right;
  }

  .strategy-target h4 {
    font-size: 20px;
  }

  .strategy-target hr {
    border-color: #ccc;
    margin: 30px 0;
  }

  .strategy-target .icon {
    color: #19b5fe;
    font-size: 50px;
    display: block;
    margin-top: 15px;
  }

  .strategy-target .content {
    padding-left: 60px;
  }

  .right-align {
    text-align: right;
  }

  .center {
    margin: 0 auto;
  }

  .center-text {
    text-align: center;
  }
/*23.02 Section Strategy&Target End*/

/*23.03 Section Our Skills*/
  .our-skills-1 #skills {
    margin-top: 120px;
  }

  .our-skills-1 .skillbar {
    margin-bottom: 70px;
  }

  .our-skills-1 {
    background-color: #f8f8f8;
  }

  .our-skills-1 .section-title {
    margin-bottom: 40px;
  }

  .our-skills-1 p {
    margin-bottom: 65px;
  }

  .our-skills-1 .skillbar-title {
    color: #000;
    font-size: 16px;
    bottom: 15px;
    margin-bottom: 5px;
  }

  .our-skills-1  .skill-bar-percent {
    top: -30px;
    color: #000;
    font-size: 16px;
  }
/*23.03 Section Our Skills End*/

/*23.04 Section Request a Free Analysis*/
  .free-analysis-form .section-title {
    margin-bottom: 20px;
  }
/*23.04 Section Request a Free Analysis End*/
/*
============================================
23 LOCLA SEO PAGE CSS
============================================
*/


/*
============================================
24 E-MAIL MARKETING PAGE
============================================
*/
/*24.01 Section Compleet Solution*/
  .compleet-solution {
    background-color: #f8f8f8;
  }

  .compleet-solution .img {
    margin: 0 auto;
  }

  .compleet-solution .icon {
    color: #19b5fe;
    font-size: 40px;
    display: block;
  }

  .compleet-solution .right-align {
    margin-right: 75px;
  }

  .compleet-solution .left-align {
    margin-left: 75px;
  }

  .Solution-heading {
    font-size: 20px;
    font-weight: 400;
    margin-top: 0;
  }

  .left-side, .right-side {
    margin-top: 45px; 
  }
/*24.01 Section Compleet Solution End*/

/*24.02 Section Grow Your Business*/
  .grow-business .section-title h1 {
    margin-top: -7px;
  }

  .grow-business p {
    margin-bottom: 30px;
  }

  .grow-business .section-title {
    margin-bottom: 15px;
  }

  .video {
    width: 100%;
  }

  .wrapper{
    display:table;
    width:auto;
    position:relative;
    width:100%;
  }

  .playpause {
    background-color: rgba(25,181,254,0.7);
    color: #fff;
    text-align: center;
    padding: 20px 4px 0px 8px;
    font-size: 30px;
    width:20%;
    height: 22%;
    position:absolute;
    left:0%;
    right:0%;
    top:0%;
    bottom:0%;
    margin:auto;
    cursor: pointer;
    background-size:contain;
    background-position: center;
  }
/*24.02 Section Grow Your Business End*/

/*24.03 Section Free Analysis*/
  .request-analysis {
    background-image: url("../img/backgrounds/request-analysis-bg.jpg");
    background-size: cover;
    background-position: center;
    text-align: center;
  }

  .request-analysis .filter {
    background-color: rgba(46,65,107,0.9);
    padding: 120px 0;
  }

  .request-analysis .form-group {
    width: 60%;
    margin-bottom: 60px;
  }

  .request-analysis .web-url {
    float: right;
  }

  .request-analysis .form-group input {
    text-align: center;
    color: #bdbdbd;
  }
/*24.03 Section Free Analysis End*/
/*
============================================
24 E-MAIL MARKETING PAGE END
============================================
*/


/*
============================================
25 SOCIAL MEDIA MARKETING PAGE
============================================
*/
/*25.01 Section Social Media Marketing Goals*/
  .social-media-marketing .section-title {
    margin-bottom: 40px;
  }

  .social-media-marketing .check-list {
    margin-bottom: 60px;
  }
/*25.01 Section Social Media Marketing Goals End*/

/*25.02 Section Professional Tools */
  .professional-tools {
    background-color: #f5faff;
    padding-top: 120px;
    text-align: center;
  }

  .professional-tools .section-title {
    margin-bottom: 60px;
  }

  .professional-tools .section-title h1{
    margin-bottom: 15px;
  }

  .professional-tools .section-title .title-sub-text {
    font-size: 18px;
    width: 80%;
    font-family: "Roboto";
    margin-top: 15px;
    font-weight: 300;
  }

  .professional-tools img {
    margin-top: 100px;
  }
/*25.02 Section Professional Tools End*/

/*25.03 Section Social Media Promotion */
  .social-promotions {
    padding-top: 120px;
  }
  
  .social-promotion-content {
    background-color: #f5faff;
    text-align: center;
    margin-top: -53px;
    padding: 140px 0 120px;
  }

  .social-promotion-content i {
    color: #19b5fe;
    font-size: 40px;
    margin-bottom: 20px;
    margin-top: 40px;
  }

  .social-promotion-content .light {
    font-weight: 400;
  }
/*25.03 Section Social Media Promotion End*/

/*25.04 Section Maximize Your Social Media Advertising*/
  .social-advertising {
    background-image: url("../img/backgrounds/social-advertising-bg.jpg"); 
    background-size: cover;
    background-position: center;
  }

  .social-advertising .filter {
    background-color: rgba(255,255,255,0.95);
    padding: 120px 0;
  }

  .social-advertising .section-title {
    margin-bottom: 40px;
  }

  .social-advertising .section-title h2 {
    margin-bottom: 10px;
  }
/*25.04 Section Maximize Your Social Media Advertising End*/
/*
============================================
25 SOCIAL MEDIA MARKETING PAGE END
============================================
*/


/*
============================================
26 PAY PER CLICK MANAGEMENT PAGE
============================================
*/
/*
============================================
26 PAY PER CLICK MANAGEMENT PAGE END
============================================
*/


/*
============================================
27 SEARCH ENGINE OPTIMIZATION PAGE
============================================
*/
/*
============================================
27 SEARCH ENGINE OPTIMIZATION PAGE END
============================================
*/


/*
============================================
28 PROMOTION SERVICES PAGE
============================================
*/
/*
============================================
28 PROMOTION SERVICES PAGE END
============================================
*/


/*
============================================
29 CASE-STUDIES PAGE
============================================
*/
  ul#portfolio-filter {
    padding-bottom: 15px;
    line-height: 1em;
    margin: 120px 0 40px 0;
  }

  ul#portfolio-filter .left-right {
    margin: 5px 0;
    position: absolute;
    width: 3%;
  }

  ul#portfolio-filter .left, ul#portfolio-filter .right {
    height: 2px;
  }

  ul#portfolio-filter li {
    display: inline;
  }

  ul#portfolio-filter a {
    margin: 0 10px;
    padding: 5px 5px;
    display: inline-block;
    color: #000;
    text-decoration: none;
    font-size: 16px;
  }

  ul#portfolio-filter a:hover, ul#portfolio-filter a.current {
    color: #19b5fe;
  }

  #portfolio-filter {
    text-align: center;
  }

  .holderfilter img {
    width: 100%;
  }

  .list-unstyled  .portfolio-item {
    padding: 10px;
  }

  ul.popup-gallery {
    margin-top: 30px;
  }

  ul#portfolio-filter li {
    padding: 0;
  }

  ul#portfolio-filter li.active a {
    color: #19b5fe;
  }

  .portfolio-item .portfolio-link .portfolio-hover {
    background: rgba(144, 198, 149, 0.9) none repeat scroll 0 0;
    height: 84%;
    margin: 5%;
    opacity: 0;
    position: absolute;
    width: 84%;
    transition: all ease 0.5s;
    -webkit-transition: all ease 0.5s;
    -moz-transition: all ease 0.5s;
  }

  .portfolio-item .portfolio-link .portfolio-hover:hover {
    opacity: 1;
  }

  .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content {
    border: 1px solid #fff;
    color: white;
    font-size: 20px;
    margin: 7%;
    padding: 32%;
    position: absolute;
    text-align: center;
    width: 86%;
  }

  .hover_bg:hover {
    text-decoration: none;
  }

  .hover_bg:hover div{
    background-color: #2e416b;
    transition-property: background-color;
    transition-duration: 0.2s;
    transition-timing-function: linear;
  }

  .case-studies-page {
    margin-bottom: 120px;
  }

  .case-studies-pagination {
   text-align: center; 
  }

  .case-studies-page .project {
    margin-bottom: 0;
  }

  .case-studies-page .list-unstyled li {
    margin-bottom: 0;
}
/*
============================================
29 CASE-STUDIES PAGE END
============================================
*/


/*
============================================
30 CASE-STUDIES DETAILS-1 PAGE
============================================
*/
/*
============================================
30 CASE-STUDIES DETAILS-1 PAGE END
============================================
*/


/*
============================================
31 CASE-STUDIES DETAILS-2 PAGE
============================================
*/
/*
============================================
31 CASE-STUDIES DETAILS-2 PAGE END
============================================
*/


/*
============================================
32 ABOUT US PAGE
============================================
*/
/*32.01 Section About Text*/
  .about-us {
    background-image: url("../img/backgrounds/about-us-bg.jpg");
    background-size: cover;
    background-position: center;
    color: #cecece;
  }

  .about-us .filter {
    background-color: rgba(46,65,107,0.9); 
    padding: 120px 0;
  }

  .about-us .section-title {
    margin-bottom: 40px;
  }

  .about-us .section-title .left-right {
    margin: 15px 0;
    width: 100%;
  }

  .about-us .section-title .right {
    background-color: #19b5fe;
  }
/*32.01 Section About Text End*/

/*32.02 Section Why Chooose*/

  .why-choose .icon {
    text-align: center;
    margin-top: 10px;
  }

  .why-choose i {
    color: #000;
    border: 4px solid #19b5fe;
    border-radius: 100px;
    font-size: 50px;
    padding: 30px;
    text-align: center;
    width: 120px;
    height: 120px;
  }

  .border-left {
    width: 4px;
    height: 30px;
    margin-top: 7px;
    display: block;
    float: left;
    background-color:  #19b5fe;
  }

  .why-choose .margin-bottom-20 {
    margin-bottom: 20px;
  }

  .why-choose .content p{
    padding-bottom: 15px;
  }

  .why-choose .content h4, .why-choose .content p {
    padding-left: 40px;
  }
/*32.02 Section Why Choose End */

/*32.03 Section Core Values*/
  .core-values {
    background-image: url("../img/backgrounds/core-values-bg.jpg");
    background-size: cover;
    background-position: center;
  }

  .core-values .filter {
    background-color: rgba(46,65,107,0.9);
    padding: 120px 0 0 0;
  }

  .core-values-img {
    text-align: center;
  }

  .values {
    color: #cecece;
  }

  .values h4 {
    color: #fff;
  }

  .values .number {
    background-color: #19b5fe;
    font-size: 30px;
    color: #fff;
    display: inline-block;
    font-weight: 800;
    height: 70px;
    padding: 24px 18px;
    width: 70px;
    border-radius: 40px;
  }

  .values .number-border {
    border: 1px dashed #fff;
    display: inline-block;
    padding: 5px;
    border-radius: 42px;
  }

  .values-left, .values-right {
    margin-top: 60px;
  }

  .core-values .left-first {
    margin-bottom: 70px;
    margin-right: -70px;
  }

  .values-left .number-border {
    float: right;
  }

  .values-left h4, .values-left p {
    padding-right: 100px;
  }

  .values-right .number-border {
    float: left;
  }

  .values-right h4, .values-right p {
    padding-left: 100px;
  }

   .core-values .right-first {
    margin-bottom: 70px;
    margin-left: -80px;
  }

  .core-values-img img {
    margin: 0 auto;
  }
/*32.03 Section Core Values End*/

/*32.04 Section Meet Our Team */
  .our-team .designatino {
    position: absolute;
    display: block;
    background-color: rgba(25,181,254,0.7);
    color: #fff;
    padding: 15px 30px;
    top: 212px;
    text-transform: uppercase;
    letter-spacing: 1px;
  }

  .our-team .member-name {
    text-transform: uppercase;
    margin: 30px 0 20px 0; 
    letter-spacing: 1px;
  }

  .our-team .social a {
    color: #000;
    margin-right: 2px;
    font-size: 16px;
  }

  .our-team .social a:hover {
    color: #19b5fe;
  }
/*32.04 Section Meet Our Team End*/

/*32.05 Section Our Features*/
  .our-features {
    background-image: url("../img/backgrounds/background.jpg");
    background-size: cover;
    background-position: center;
  }

  .our-features i {
    color: #19b5fe;
    font-size: 40px;
    margin-bottom: 10px;
  }

  .our-features h4 {
    font-weight: 400;
  }
/*32.05 Section Our Features End*/
/*
============================================
32 ABOUT US PAGE END
============================================
*/


/*
========================
33 PARTNERS PAGE
========================
*/
  .partner-logo {
    text-align: center;
    height: 180px;
    line-height: 13em;
    border-left: 1px solid #d5d5d5;
    border-top: 1px solid #d5d5d5;
  }

  .partner-logo img {
    height: auto;
    max-width: 100%;
  }

  .partner-logo:nth-child(1),
  .partner-logo:nth-child(2),
  .partner-logo:nth-child(4) {
    border-top: none;  
  }
/*
========================
33 PARTNERS PAGE END
========================
*/


/*
========================
 34 SEO ANALYSIS PAGE
========================
*/
/*
========================
 34 SEO ANALYSIS PAGE END
========================
*/


/*
========================
35 TESTIMONIALS PAGE
========================
*/
/*
========================
35 TESTIMONIALS PAGE END
========================
*/


/*
========================
36 OUR PRICING PAGE 
========================
*/
/*
========================
36 OUR PRICING PAGE END
========================
*/


/*
========================
37 404 PAGE
========================
*/
/*
========================
37 404 PAGE END
========================
*/


/*
========================
38 COMMING SOON PAGE
========================
*/
/*
========================
38 COMMING SOON PAGE END
========================
*/  
  

/*
========================
39 STANDERD BLOG PAGE
========================
*/
/*
========================
39 STANDERD BLOG PAGE END
========================
*/


/*
========================
40 SINGEL BLOG PAGE
========================
*/
/*
========================
40 SINGEL BLOG PAGE END
========================
*/


/*
========================
41 SHOP PAGE
========================
*/
/*
========================
41 SHOP PAGE END
========================
*/


/*
========================
42 PRODUCT PAGE
========================
*/
/*
========================
42 PRODUCT PAGE END
========================
*/


/*
========================
43 CHECKOUT PAGE
========================
*/
/*
========================
43 CHECKOUT PAGE END
========================
*/


/*
============================================
44 CONTACT US PAGE 
============================================
*/
/*44.01 Section We Are Here To Help*/ 
  .help-text {
    background-color: #e4f1fe;
  }

  .help-text .section-title {
    margin-bottom: 20px;
  }
/*44.01 Section We Are Here To Help End*/ 

/*44.02 Section Have A Question*/ 
  .contact-addres {
    background-color: #f8f8f8;
    padding: 120px 0;
    text-align: center;
  }

  .contact-addres i {
    color: #fff;
    background-color: #19b5fe;
    font-size: 40px;
    border-radius: 40px;
    padding: 21px;
    width: 80px;
    height: 80px;
  }

  .contact-addres h4 {
    font-weight: 400;
    margin-top: 20px;
    margin-bottom: 8px;
  }

  .contact-addres p {
    margin-bottom: 0px;
  }
/*44.02 Section Have A Question End*/

/*44.03 Section Connect With Us*/  
  .connect-us {
    text-align: center;
  }

  .connect-us h1 {
    margin-bottom: 15px;
  }

  .connect-us .social a {
    color: #19b5fe;
    font-size: 34px;
    margin: 50px 20px 0px 20px;
    display: inline-block;
  }

  .connect-us .social a:hover {
    color: #2e416b;
  }

  .sub-text {
    font-family: "Roboto";
    font-size: 18px;
    font-weight: 300;
    margin-top: 15px;
    width: 80%;
    margin: 0 auto;
  }  
/*44.03 Section Connect With Us End*/

/*44.04 Section Map*/
  #map {
    height: 400px;
    width: 100%;
  }
/*44.04 Section Map End*/  
/*
============================================
44 CONTACT US PAGE END 
============================================
*/


/*
================================= 
45 FOOTER
=================================
*/
/*45.01 Section Common*/
  .footer {
    background-color: #2e416b;
    color: #8ca1cf;    
  }

  .footer .left-space {
    padding-left: 60px;
    border-left: 1px solid #4f5e80;
  }
/*45.01 Section Common End*/

/*45.02 Section Titles*/
  .footer .section-title {
    text-align: left;
    padding: 80px 0 20px 0;
    margin: 0;
  }

  .footer .section-title .left-right {
    margin: 0;
    line-height: 0;
    width: 15%;
  }

  .footer .light {
    font-weight: 100;
  }

  .footer h4 {
    color: #fff;
    margin-bottom: 5px;
  }
/*45.02 Section Titles End*/

/*45.03 Section Social & Contact Info*/
  .contact-info .phone, 
  .contact-info .e-mail {
    margin-right: 40px;
  }

  .contact-info .social span {
    padding: 0 8px; 
  }

  .contact-info .social a {    
    color: #8ca1cf;
  }

  .contact-info .social a:hover {    
    color: #19b5fe;
  }
/*45.03 Section Social & Contact Info End*/

/*45.04 Section News Letter*/
  .footer .form-inline {
    margin-bottom: 80px;
  }

  .footer .form-inline .form-control {
    border-radius: 0;
    height: 45px;
    width: 100%;
  }

  .footer .form-inline .btn-theme {
    font-size: 12px;
    padding: 14px 45px;
  }
/*45.04 Section News Letter End*/ 

/*45.05 Section Copyright*/
  .copy-right {
    border-top: 1px solid #4f5e80;
  }

  .copy-right p {
    font-size: 12px;
    color: #cbcbcb;
    margin: 0;
    padding: 30px 0;
  }
/*45.05 Section Copyright End*/
/*
================================= 
45 FOOTER END
=================================
*/





/*
================================= 
TEMP CSS DELET AFTER TEST
=================================
*/
  .TopBorderPanel {
    border-bottom: 3px solid #19b5fe;
    position: relative;
  }    

  .TopBorderPanel:after {
    position: absolute;
    left: 50%;
    right: 0;
    bottom: -3px;
    border-bottom: 3px solid #000;
    content: '';
  }

  .foo {
    width: 30%;
    height: 200px;
    background-color: blue;
    margin: 0 auto;
  }

    .bar {
    width: 30%;
    height: 200px;
    background-color: red;
    margin: 0 auto;
  }


.hero {
  height: 200px;
  background-color: blue;
  display: block;
}


#result h4{
	font-weight: 300;
	font-family: 'Roboto', sans-serif;
}



/*
================================= 
TEMP CSS DELET AFTER TEST END 
=================================
*/

.loginmodal-container {
  padding: 30px;
  max-width: 350px;
  width: 100% !important;
  background-color: #F7F7F7;
  margin: 0 auto;
  border-radius: 2px;
  box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
  overflow: hidden;
  font-family: roboto;
}

.loginmodal-container h1 {
  text-align: center;
  font-size: 1.8em;
  font-family: roboto;
}

.loginmodal-container input[type=submit] {
  width: 100%;
  display: block;
  margin-bottom: 10px;
  position: relative;
}

.loginmodal-container input[type=text], input[type=password] {
  height: 44px;
  font-size: 16px;
  width: 100%;
  margin-bottom: 10px;
  -webkit-appearance: none;
  background: #fff;
  border: 1px solid #d9d9d9;
  border-top: 1px solid #c0c0c0;
  /* border-radius: 2px; */
  padding: 0 8px;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
}

.loginmodal-container input[type=text]:hover, input[type=password]:hover {
  border: 1px solid #b9b9b9;
  border-top: 1px solid #a0a0a0;
  -moz-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
  -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
}

.loginmodal {
  text-align: center;
  font-size: 14px;
  font-family: 'Arial', sans-serif;
  font-weight: 700;
  height: 36px;
  padding: 0 8px;
/* border-radius: 3px; */
/* -webkit-user-select: none;
  user-select: none; */
}

.loginmodal-submit {
  /* border: 1px solid #3079ed; */
  border: 0px;
  color: #fff;
  text-shadow: 0 1px rgba(0,0,0,0.1); 
  background-color: #4d90fe;
  padding: 17px 0px;
  font-family: roboto;
  font-size: 14px;
  /* background-image: -webkit-gradient(linear, 0 0, 0 100%,   from(#4d90fe), to(#4787ed)); */
}

.loginmodal-submit:hover {
  /* border: 1px solid #2f5bb7; */
  border: 0px;
  text-shadow: 0 1px rgba(0,0,0,0.3);
  background-color: #357ae8;
  /* background-image: -webkit-gradient(linear, 0 0, 0 100%,   from(#4d90fe), to(#357ae8)); */
}

.loginmodal-container a {
  text-decoration: none;
  color: #666;
  font-weight: 400;
  text-align: center;
  display: inline-block;
  opacity: 0.6;
  transition: opacity ease 0.5s;
} 

.login-help{
  font-size: 12px;
}

.profile {
  margin: 20px 0;
}

/* Profile sidebar */
.profile-sidebar {
  padding: 0px 0 10px 0;
  background: #fff;
}

.profile-userpic img {
  float: none;
  margin: 0 auto;
  width: 50%;
  height: 50%;
  -webkit-border-radius: 50% !important;
  -moz-border-radius: 50% !important;
  border-radius: 50% !important;
}

.profile-usertitle {
  text-align: center;
  margin-top: 20px;
}

.profile-usertitle-name {
  color: #5a7391;
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 7px;
}

.profile-usertitle-job {
  text-transform: uppercase;
  color: #5b9bd1;
  font-size: 12px;
  font-weight: 600;
  margin-bottom: 15px;
}

.profile-userbuttons {
  text-align: center;
  margin-top: 10px;
}

.profile-userbuttons .btn {
  text-transform: uppercase;
  font-size: 11px;
  font-weight: 600;
  padding: 6px 15px;
  margin-right: 5px;
}

.profile-userbuttons .btn:last-child {
  margin-right: 0px;
}
    
.profile-usermenu {
  /*margin-top: 30px;*/
}

.profile-usermenu ul li {
  border-bottom: 1px solid #f0f4f7;
}

.profile-usermenu ul li:last-child {
  border-bottom: none;
}

.profile-usermenu ul li a {
  color: #93a3b5;
  font-size: 14px;
  font-weight: 400;
}

.profile-usermenu ul li a i {
  margin-right: 8px;
  font-size: 14px;
}

.profile-usermenu ul li a:hover {
  background-color: #fafcfd;
  color: #5b9bd1;
}

.profile-usermenu ul li.active {
  border-bottom: none;
}

.profile-usermenu ul li.active a {
  color: #5b9bd1;
  background-color: #f6f9fb;
  border-left: 2px solid #5b9bd1;
  margin-left: -2px;
}

/* Profile Content */
.profile-content {
  padding: 20px;
  background: #fff;
  min-height: 460px;
}

.profile ul{
	list-style-type:none;
}
.profile ul li{
	margin:5px 0px;
}
a.open{
	color:#19b5fe;
}