/*
Theme Name: 	Azad Singh Fitness 1.0
Theme URI: 		http://www.azadsinghfitness.com
Description: 	Azad Singh Fitness
Version: 		1.0
Author: 		Manjit Sohal @ ForwardSlash Designs
Author URI: 	http://www.forwardslashdesigns.com
*/

/* Table of contents
––––––––––––––––––––––––––––––––––––––––––––––––––
- Grid
- Base Styles
- Typography
- Links
- Buttons
- Forms
- Lists
- Code
- Tables
- Spacing
- Utilities
- Clearing
- Media Queries
- General website styles
*/

/* 
COLOURS
#1f2329
#fad008 
#d04b3a
#e0e0e0

*/

/* Larger than mobile */
@media (min-width: 400px) {}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {}

/* Larger than tablet */
@media (min-width: 750px) {}

/* Larger than desktop */
@media (min-width: 1000px) {}

/* Larger than Desktop HD */
@media (min-width: 1200px) {}

/* 01 Sensible defaults */

@import "css/reset.css";

div,
article,
section,
header,
footer,
nav,
li					{ position:relative; /* For absolutely positioning elements within containers (add more to the list if need be) */ }
.group:after 		{ display:block; height:0; clear:both; content:"."; visibility:hidden; /* For clearing */ }
body 				{ background:#fff; /* Don't forget to style your body to avoid user overrides */ }
::-moz-selection 	{ background:#ff0; color:#333; }
::selection 		{ background:#ff0; color:#333; }

/* 02 Typography */

/*

14 / 16	= 		0.875em 		(14px equivalent)
16 / 16	= 		1em 			(16px equivalent)
18 / 16 = 		1.125em 		(18px equivalent)
21 / 16 = 		1.3125em 		(21px equivalent)
24 / 16 = 		1.5em 			(24px equivalent)
30 / 16 = 		1.875em 		(30px equivalent)

*/



/* Grid
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.section {
    padding: 30px 0;
}
.section.background {
    background-image: url(images/pt-background1.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}
    .section.background p {
        color: #FFF;
    }

.section.colour {}

.cta-strip {
    text-align: center;
    padding: 20px 0 25px 0;
}
.cta-strip p {
    margin: 0;
    font-size: 25px;
    font-weight: 700;
    color: #FFF;
    line-height: 40px;
}
.cta-strip a {
    margin: 0 0 0 30px;
}

.container, .dslc-modules-section-wrapper {
  position: relative;
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
  padding: 0 20px;
  box-sizing: border-box;}
.column,
.columns {
  width: 100%;
  float: left;
  box-sizing: border-box;}

/* For devices larger than 400px */
@media (min-width: 400px) {
  .container {
    width: 85%;
    padding: 0; }
}

/* For devices larger than 550px */
@media (min-width: 550px) {
  .container {
    width: 100%; }
  .column,
  .columns {
    margin-left: 2%; margin-right: 2%; }
/*
  six.column:first-child,
  six.columns:first-child {
    margin-left: 0; }
*/

  .one.column,
  .one.columns                    { width: 5.094%; }
  .two.columns                    { width: 12.67%; }
  .three.columns                  { width: 21%; }
  .four.columns                   { width: 29.33%; }
  .five.columns                   { width: 37.66%; }
  .six.columns                    { width: 46%; }
  .seven.columns                  { width: 54.34%; }
  .eight.columns                  { width: 62.67%; }
  .nine.columns                   { width: 71.0%; }
  .ten.columns                    { width: 79.33%; }
  .eleven.columns                 { width: 86.9%; }
  .twelve.columns, .dslc-12-col                 { width: 96%; }

  .one-third.column               { width: 29.33%; }
  .two-thirds.column              { width: 71%; }

  .one-half.column                { width: 46%; }

  /* Offsets */
  .offset-by-one.column,
  .offset-by-one.columns          { margin-left: 8.66666666667%; }
  .offset-by-two.column,
  .offset-by-two.columns          { margin-left: 17.3333333333%; }
  .offset-by-three.column,
  .offset-by-three.columns        { margin-left: 26%;            }
  .offset-by-four.column,
  .offset-by-four.columns         { margin-left: 34.6666666667%; }
  .offset-by-five.column,
  .offset-by-five.columns         { margin-left: 43.3333333333%; }
  .offset-by-six.column,
  .offset-by-six.columns          { margin-left: 52%;            }
  .offset-by-seven.column,
  .offset-by-seven.columns        { margin-left: 60.6666666667%; }
  .offset-by-eight.column,
  .offset-by-eight.columns        { margin-left: 69.3333333333%; }
  .offset-by-nine.column,
  .offset-by-nine.columns         { margin-left: 78.0%;          }
  .offset-by-ten.column,
  .offset-by-ten.columns          { margin-left: 86.6666666667%; }
  .offset-by-eleven.column,
  .offset-by-eleven.columns       { margin-left: 95.3333333333%; }

  .offset-by-one-third.column,
  .offset-by-one-third.columns    { margin-left: 34.6666666667%; }
  .offset-by-two-thirds.column,
  .offset-by-two-thirds.columns   { margin-left: 69.3333333333%; }

  .offset-by-one-half.column,
  .offset-by-one-half.columns     { margin-left: 52%; }

}


/* Base Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/* NOTE
html is set to 62.5% so that all the REM measurements throughout Skeleton
are based on 10px sizing. So basically 1.5rem = 15px :) */
html {
  font-size: 62.5%; }
body {
  font-size: 1.5em; /* currently ems cause chrome bug misinterpreting rems on body element */
  line-height: 1.6;
  font-weight: 300;
  font-family: "Roboto", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #222;}


/* Typography
–––––––––––––––––––––––––––––––––––––––––––––––––– */
h1, h2, h3, h4, h5, h6 {
    font-family: 'Roboto Condensed', sans-serif;
    margin-top: 0;
  margin-bottom: 2rem;
  font-weight: 300; 
    color: #d04b3a;}
h1 { font-size: 4.0rem; line-height: 1.2;  letter-spacing: -.1rem; text-transform: uppercase;}
h2 { font-size: 3.6rem; line-height: 1.25; letter-spacing: -.1rem; text-transform: uppercase;}
h3 { font-size: 3.0rem; line-height: 1.3;  letter-spacing: -.1rem; font-weight: 700;}
h4 { font-size: 2.4rem; line-height: 1.35; letter-spacing: -.08rem; font-weight: 700;}

/* Larger than phablet */
@media (min-width: 550px) {
  h1 { font-size: 3.6rem; }
  h2 { font-size: 3.0rem; }
  h3 { font-size: 2.4rem; }
  h4 { font-size: 2.0rem; }
}

p {
  margin-top: 0; }
p.intro {
    font-size: 50px;
    font-weight: 500;
    color: #666;
    line-height: 1.4;
    letter-spacing: -.1rem;
}
p.yellow { color: #fad008; }
p.red { color: #d04b3a; }
.centered { text-align: center; }

strong { font-weight: 700; }

/* Links
–––––––––––––––––––––––––––––––––––––––––––––––––– */
a {
  color: #d04b3a; }
a:hover {
  color: #1f2329; }


/* Buttons
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
  display: inline-block;
  height: 38px;
  padding: 0 30px;
  color: #555;
  text-align: center;
  font-size: 11px;
  font-weight: 600;
  line-height: 38px;
  text-decoration: none;
  white-space: nowrap;
  background-color: transparent;
  border-radius: 4px;
  border: 1px solid #bbb;
  cursor: pointer;
  box-sizing: border-box;
text-transform: uppercase;
background-color: #fad008;
    border: none 0px;
    color: #1f2329;
    font-size: 16px;
    -webkit-box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.5);
    -moz-box-shadow:    1px 1px 1px 0px rgba(0, 0, 0, 0.5);
    box-shadow:         1px 1px 1px 0px rgba(0, 0, 0, 0.5); }
.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover,
.button:focus,
button:focus,
input[type="submit"]:focus,
input[type="reset"]:focus,
input[type="button"]:focus {
  color: #333;
  background-color: #bd4131;
  outline: 0; }
.button.button-primary,
button.button-primary,
input[type="submit"].button-primary,
input[type="reset"].button-primary,
input[type="button"].button-primary {
  color: #FFF;
  background-color: #33C3F0;
  border-color: #33C3F0; }
.button.button-primary:hover,
button.button-primary:hover,
input[type="submit"].button-primary:hover,
input[type="reset"].button-primary:hover,
input[type="button"].button-primary:hover,
.button.button-primary:focus,
button.button-primary:focus,
input[type="submit"].button-primary:focus,
input[type="reset"].button-primary:focus,
input[type="button"].button-primary:focus {
  color: #FFF;
  background-color: #1EAEDB;
  border-color: #1EAEDB; }

.button.yellow {
    background-color: #fad008 !important;
    border: none 0px;
    color: #1f2329;
    font-size: 16px;
    -webkit-box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.5);
    -moz-box-shadow:    1px 1px 1px 0px rgba(0, 0, 0, 0.5);
    box-shadow:         1px 1px 1px 0px rgba(0, 0, 0, 0.5);   
}
.button.yellow:hover {
    background-color: #ddb701 !important;
}
.button.red {
    background-color: #d04b3a;
    border: none 0px;
    color: #1f2329;
    font-size: 16px;
    -webkit-box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.5);
    -moz-box-shadow:    1px 1px 1px 0px rgba(0, 0, 0, 0.5);
    box-shadow:         1px 1px 1px 0px rgba(0, 0, 0, 0.5);   
}
.button.red:hover {
    background-color: #bd4131;
}


/* Forms
–––––––––––––––––––––––––––––––––––––––––––––––––– */
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea,
select {
  height: 42px;
  padding: 10px 10px; /* The 6px vertically centers text on FF, ignored by Webkit */
  background-color: #fff;
  border: 1px solid #D1D1D1;
  border-radius: 4px;
  box-shadow: none;
  box-sizing: border-box;
  font-family: "Roboto", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;}
/* Removes awkward default styles on some inputs for iOS */
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none; }
textarea {
  min-height: 65px;
  padding-top: 6px;
  padding-bottom: 6px;
}
input[type="email"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="text"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus {
  border: 1px solid #33C3F0;
  outline: 0; }
label,
legend {
  display: block;
  margin-bottom: .5rem;
  font-weight: 600; }
fieldset {
  padding: 0;
  border-width: 0; }
input[type="checkbox"],
input[type="radio"] {
  display: inline; }
label > .label-body {
  display: inline-block;
  margin-left: .5rem;
  font-weight: normal; }


/* CONTACT FORM 7 VALIDATION */
.wpcf7-response-output {
    clear: both;
    padding: 15px !important;
    border: none !important;
    font-size: 17px;
    text-align: center;
    color: #FFF;
}
.wpcf7-mail-sent-ok {
    background-color: rgb(57, 143, 20);
}
.wpcf7-validation-errors {
    background-color: #d80c0c;
}
.wpcf7-not-valid-tip {
    clear: both;
    font-size: 14px !important;
    background-color: rgb(255, 242, 242);
    padding: 5px 10px;
    color: #D80C0C;
    margin: 0 !important;
}
.wpcf7-mail-sent-ng {
    background-color: #FAD008;
}

/* contact form on homepage */

.home.page .wpcf7 {
    position: relative;
    background-color: #f0f0f0;
    padding: 5px 10px 5px 150px;
}
.home.page .wpcf7 #formpart { 
}
.home.page .wpcf7 #formpart input[type="text"],
.home.page .wpcf7 #formpart input[type="email"],
.home.page .wpcf7 #formpart textarea{
    max-width: 290px;
    margin-bottom: 10px;
    width: 100%;
    font-size: 14px;
}
img#cartoonazad {
    float: left;
    width: 40%;
    max-width: 130px;
    height: auto;
    display: block;
    position: absolute;
    top: -10px;
    left: 0;
}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {
  
}

/* Larger than tablet */
@media (min-width: 750px) {}


.wpcf7 input[type="submit"] {
    background-color: #d04b3a;
    border: none 0px;
    color: #FFF;
    font-size: 16px;
    -webkit-box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.5);
    -moz-box-shadow:    1px 1px 1px 0px rgba(0, 0, 0, 0.5);
    box-shadow:         1px 1px 1px 0px rgba(0, 0, 0, 0.5);
    float: right;
    margin-right: 0px;
}
span.wpcf7-not-valid-tip {
    font-size: 13px;
    margin-bottom: 10px;
}

/* questionnaire form  */

#qform{}

#qform fieldset {
    clear: both;
}
#qform h2 {
    margin-top: 30px;
}
#qform input, #qform select, #qform textarea, 
#contactform input, #contactform select, #contactform textarea {
    width: 100%;
}
#qform input .at-below-post {
    display: none !important;
    visibility: none !important;
}
#qform span.wpcf7-list-item {
    float: left;
    margin: 0 20px 0 0 !important;
}
    #qform .wpcf7-list-item input[type="checkbox"] {
        float: left;
        width: auto !important;
    }

#contactform .wpcf7-captchar {
    width: auto !important;
}
#contactform img.wpcf7-captchac {
    border: 1px solid #CCC;
    margin-right: 20px;
    height: 30px;
    float: left;
    width: auto;
    padding: 5px;
}

/* Lists
–––––––––––––––––––––––––––––––––––––––––––––––––– */
ul {
  list-style: circle outside inherit;}
ol {
  list-style: decimal inside; }
ol, ul {
  padding-left: 0;
  margin-top: 0; margin-left: 15px; }
ul ul,
ul ol,
ol ol,
ol ul {
  margin: 1.5rem 0 1.5rem 3rem;
  font-size: 90%; }
/*
li {
  margin-bottom: 1rem; color: #FCDC3B; }
*/



/* Code
–––––––––––––––––––––––––––––––––––––––––––––––––– */
code {
  padding: .2rem .5rem;
  margin: 0 .2rem;
  font-size: 90%;
  white-space: nowrap;
  background: #F1F1F1;
  border: 1px solid #E1E1E1;
  border-radius: 4px; }
pre > code {
  display: block;
  padding: 1rem 1.5rem;
  white-space: pre; }


/* Tables
–––––––––––––––––––––––––––––––––––––––––––––––––– */
th,
td {
  padding: 12px 15px;
  text-align: left;
  border-bottom: 1px solid #E1E1E1; }
th:first-child,
td:first-child {
  padding-left: 0; }
th:last-child,
td:last-child {
  padding-right: 0; }


/* Spacing
–––––––––––––––––––––––––––––––––––––––––––––––––– */
button,
.button {
  margin-bottom: 1rem; }
input,
textarea,
select,
fieldset {
  margin-bottom: 1.5rem; }
pre,
blockquote,
dl,
figure,
table,
p,
ul,
ol,
form {
  margin-bottom: 2.5rem; }


/* Utilities
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.u-full-width {
  width: 100%;
  box-sizing: border-box; }
.u-max-full-width {
  max-width: 100%;
  box-sizing: border-box; }
.u-pull-right {
  float: right; }
.u-pull-left {
  float: left; }


/* Misc
–––––––––––––––––––––––––––––––––––––––––––––––––– */
hr {
  margin-top: 3rem;
  margin-bottom: 3.5rem;
  border-width: 0;
  border-top: 1px solid #E1E1E1; }

img.scale-img, img.scale, img.scaleimg {
    width: 100%;
    height: auto;
}

img.alignleft {
    float: left;
    margin-right: 15px;
}
img.alignright {
    float: right;
    margin-left: 15px;
}

/* Clearing
–––––––––––––––––––––––––––––––––––––––––––––––––– */

/* Self Clearing Goodness */
.container:after,
.row:after,
.u-cf {
  content: "";
  display: table;
  clear: both; }

br.clear, br.clearfix {
    clear: both;
}


/* Media Queries
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/*
Note: The best way to structure the use of media queries is to create the queries
near the relevant code. For example, if you wanted to change the styles for buttons
on small devices, paste the mobile query code up in the buttons section and style it
there.
*/


/* Larger than mobile */
@media (min-width: 400px) {}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {}

/* Larger than tablet */
@media (min-width: 750px) {}

/* Larger than desktop */
@media (min-width: 1000px) {}

/* Larger than Desktop HD */
@media (min-width: 1200px) {}


/* General webite styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */

#header {background-color: #1f2329; padding: 15px 0;}
    #header #mainlogo {float: left;display: block;width: 150px;}
    #header #mainlogo a {border: none 0px;}
    
/* MAIN MENU */

#header ul#mainmenu { 
    display: none;
}
#header .sb-toggle-right {
    float: right;
    display: block;
    background-image: url(images/mobilemenuicon.png);
    height: 32px;
    width: 32px;
    margin-top: 10px;
    text-indent: -99999px;
    overflow: hidden;
    margin-right: 30px;
}
.sb-slidebar {
    color: #FFF;
    padding: 50px;
    z-index: 999;
}
    img#mobilemenulogo {
        margin-top: 15px;
        display: block;
        width: 160px;
        margin-left: auto;
        margin-right: auto;
    }
    #mobilemenu {
        list-style: none;
        padding: 0px;
        margin: 40px 0 0 0;
    }
    #mobilemenu li {}
    ul#mobilemenu li a {
        font-family: 'Roboto Condensed', sans-serif;
        font-weight: 500;color: #FFF;
        padding: 15px 0 15px 20px;
        clear: both;
        display: block;
        margin: -11px 0 0 0;
        border-bottom: solid 1px #666;
        text-decoration: none;
        font-size: 18px;
        text-transform: uppercase;
    }
    ul#mobilemenu li a:hover {
        background-color: #333;
        border-right: solid 4px #d04b3a;
    }

#mobilesocial ul#socialsnav {
    margin: 50px 0px 0px 10px;
}
#mobilesocial ul#socialsnav li {
    float: left;
    margin-left: 10px;
    border-radius: 2px;
    opacity: 0.7;
    filter: alpha(opacity=70); /* For IE8 and earlier */
}
#mobilesocial ul#socialsnav li a {
    text-decoration: none;
    color: #FFF;
    font-size: 30px;
    width: 76px;
    height: 72px;
    text-align: center;
    padding: 14px 4px 0 4px;
    display: block; 
}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 750px) {

    #header .sb-toggle-right {
        display: none;
    }
    #header ul#mainmenu {
    float: right;
    margin: 0;
    padding: 0;
    list-style: none;
    text-align: right;
        display: block;
}
    ul#mainmenu li {
        display: inline-block;
        margin: 15px 8px 0 0;
        padding: 0 0px 0;
    }
    ul#mainmenu li a:after {
        content: "";
        border-right: solid 1px #666;
        margin-left: 8px;
    }
    ul#mainmenu li:last-child a:after {
        content: "";
        border-right: none 0px #666;
    }
        ul#mainmenu li a {
            font-family: 'Roboto Condensed', sans-serif;
            font-weight: 500;
            font-size: 18px;
            text-decoration: none;
            color: #FFF;
            text-transform: uppercase;
        }
        ul#mainmenu li a:hover {
            color: #fad008;
        }

}
/* Larger than desktop */
@media (min-width: 1000px) {

    #header #mainlogo {
        float: left;
        display: block;
        width: 190px;
    }
    #header ul#mainmenu { 
        margin-top: 10px;
    }
    ul#mainmenu li {
        margin: 15px 10px 0 0;
    }
    ul#mainmenu li a:after {
        margin-left: 10px;
    }
    ul#mainmenu li a {
            font-size: 21px;
        }
}

#banner img {
    width: 100%;
    height: auto;
}
.section {
    padding-top: 30px;
}


/* MASTER SLIDER */

.master-slider {}
.master-slider .ms-layer h1 {
    font-size: 55px;
    line-height: auto;
    letter-spacing: -0.4;
}

/* FOOTER */
#footer {
    background-color: #1f2329;
    padding: 30px 0;
    color: #FFF;
    text-align: center;
    margin-top: 30px;
    clear: both;
}
.footermenu {
    display: none;
}
#footer #footerlogo {
    margin-bottom: 30px;
}

#footer #terms {
    font-size: 0.85em;
    color: #999;
    margin: 20px 0 0 0;
    padding: 0;
}

ul#footermenu { 
    margin: 0px;
    list-style: none;
}
ul#footermenu li {
    width: 50%;
    float: left;
    margin-bottom: 5px;
}
ul#footermenu li a {
    color: rgb(255, 255, 255);
    text-decoration: none;
    text-transform: uppercase;
    font-size: 18px;
    font-family: roboto condensed;
    font-weight: 500;
}
ul#footermenu li a:hover {  
    color: #fad008;
}

ul#termsnav {  
    margin: 0 0 5px 0;
}
    ul#termsnav li {  
        margin: 0px;
        display: inline;
    }
    ul#termsnav li a, #terms p a {  
        color: #999;
    }
    ul#termsnav li a:hover, #terms p a:hover {
        color: #FFF;
    }
    ul#termsnav li:after {
        content: "|";
        padding: 0 5px;
        color: #666;
    }
    ul#termsnav li:last-child:after {
        content: "";
    }
#terms p {
    margin-bottom: 0;
}
#footersocial {
    display: table;
    margin: 0 auto;
}
ul#socialsnav {
    margin-left: -10px;
}
ul#socialsnav li {
    float: left;
    margin: 0 0 10px 10px;
    border-radius: 2px;
    opacity: 0.7;
    filter: alpha(opacity=70); /* For IE8 and earlier */
    display: inline;
}
ul#socialsnav li a {
    text-decoration: none;
    color: #FFF;
    font-size: 12px;
    width: 26px;
    height: 26px;
    text-align: center;
    padding: 4px;
    display: block; 
}
ul#socialsnav li:hover {
    opacity: 1;
    filter: alpha(opacity=100); /* For IE8 and earlier */
}
ul#socialsnav li.facebook  {background-color: #3b5998;}
ul#socialsnav li.twitter {background-color: #00aced;}
ul#socialsnav li.youtube {background-color: #bb0000;}
ul#socialsnav li.instagram {background-color: #517fa4;}
ul#socialsnav li.google-plus {background-color: #dd4b39;}
ul#socialsnav li.linkedin {background-color: #007bb6;}



/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {
    .footermenu {
        display: block;
    }
    #footer {
        text-align: left;
    }
    #footer #footerlogo {
        width: 100%;
    }
    #footer #terms {
        text-align: center;
    }
}


#intpagehead {
    background-color: #e0e0e0;
    padding: 30px 0;
    margin-bottom: 0px;
}
#intpagehead h1 {
    font-size: 34px;
    margin-bottom: 0;
    color: #67707f;  
}

/* Larger than tablet */
@media (min-width: 750px) {
    #intpagehead {
        margin-bottom: 30px;
        }
    #intpagehead h1 {
        font-size: 56px;
    }
}


.gridcontainer {
    max-width: 980px;
    margin-right: auto;
    margin-left: auto;
    position: static;
}
.og-grid {
	list-style: none;
	padding: 20px 0;
	margin: 0 auto;
	text-align: center;
	width: 100%;
}
.og-grid li {
	display: inline-block;
	margin: 10px 5px 0 5px;
	vertical-align: top;
	width: 23%;
text-align: center;
    position: static;
    color: #222;
}

.og-grid li > a,
.og-grid li > a img {
	border: none;
	outline: none;
	display: inline-block;
	position: relative;
    text-decoration: none;
}
.og-grid li > a img {
    width: 100%;
    height: auto;
    max-width: 110px;
}
.og-grid li.og-expanded > a::after {
	top: auto;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-bottom-color: #ddd;
	border-width: 15px;
	left: 50%;
	margin: -20px 0 0 -15px;
}
.og-grid li.og-grid-item h3 {
    color: #1f2329;
    font-size: 16px;  
    font-weight: 300;
    margin-top: 10px;
}
    /* Larger than phablet (also point when grid becomes active) */
    @media (min-width: 550px) {
        .og-grid li.og-grid-item h3 {
            font-size: 20px; 
        }
    }
    /* Larger than desktop */
    @media (min-width: 1000px) {
        .og-grid li.og-grid-item h3 {
            font-size: 22px; 
        }
    }

.og-grid li.og-grid-item h3 a {
    color: #d04b3a;
}
.og-grid li.og-grid-item h3 a:hover {
    text-decoration: none !important;
}
    
.og-expander {
	position: absolute;
	background: #ddd;
	top: auto;
	left: 0;
	width: 100%;
	margin-top: 10px;
	text-align: left;
	height: 0;
	overflow: hidden;
}

.og-expander-inner {
	padding: 50px 30px;
	height: 100%;
}

.og-close {
	position: absolute;
	width: 40px;
	height: 40px;
	top: 20px;
	right: 20px;
	cursor: pointer;
}

.og-close::before,
.og-close::after {
	content: '';
	position: absolute;
	width: 100%;
	top: 50%;
	height: 1px;
	background: #888;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	transform: rotate(45deg);
}

.og-close::after {
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

.og-close:hover::before,
.og-close:hover::after {
	background: #333;
}

/*
.og-fullimg,
.og-details {
	width: 50%;
	float: left;
	height: 100%;
	overflow: hidden;
	position: relative;
}

.og-details {
	padding: 0 40px 0 20px;
}

.og-fullimg {
	text-align: center;
}

.og-fullimg img {
	display: inline-block;
	max-height: 100%;
	max-width: 100%;
}
*/

.og-details p {
	font-size: 16px;
	line-height: 24px;
}

.og-details a {
	font-weight: 700;
	font-size: 16px;
	color: #333;
	text-transform: uppercase;
	letter-spacing: 2px;
	padding: 10px 20px;
	border: 3px solid #333;
	display: inline-block;
	margin: 30px 0 0;
	outline: none;
}

.og-details a::before {
	content: '\2192';
	display: inline-block;
	margin-right: 10px;
}

.og-details a:hover {
	border-color: #999;
	color: #999;
}

.og-loading {
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: #ddd;
	box-shadow: 0 0 1px #ccc, 15px 30px 1px #ccc, -15px 30px 1px #ccc;
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -25px 0 0 -25px;
	-webkit-animation: loader 0.5s infinite ease-in-out both;
	-moz-animation: loader 0.5s infinite ease-in-out both;
	animation: loader 0.5s infinite ease-in-out both;
}

@-webkit-keyframes loader {
	0% { background: #ddd; }
	33% { background: #ccc; box-shadow: 0 0 1px #ccc, 15px 30px 1px #ccc, -15px 30px 1px #ddd; }
	66% { background: #ccc; box-shadow: 0 0 1px #ccc, 15px 30px 1px #ddd, -15px 30px 1px #ccc; }
}

@-moz-keyframes loader {
	0% { background: #ddd; }
	33% { background: #ccc; box-shadow: 0 0 1px #ccc, 15px 30px 1px #ccc, -15px 30px 1px #ddd; }
	66% { background: #ccc; box-shadow: 0 0 1px #ccc, 15px 30px 1px #ddd, -15px 30px 1px #ccc; }
}

@keyframes loader {
	0% { background: #ddd; }
	33% { background: #ccc; box-shadow: 0 0 1px #ccc, 15px 30px 1px #ccc, -15px 30px 1px #ddd; }
	66% { background: #ccc; box-shadow: 0 0 1px #ccc, 15px 30px 1px #ddd, -15px 30px 1px #ccc; }
}

@media screen and (max-width: 830px) {

	.og-expander h3 { font-size: 32px; }
	.og-expander p { font-size: 13px; }
	.og-expander a { font-size: 12px; }

}

@media screen and (max-width: 650px) {

	.og-fullimg { display: none; }
	.og-details { float: none; width: 100%; }
	
}


/* PRICING TABLE CUSTOM CSS */



/* Larger than mobile */
@media (min-width: 400px) {

.rpt_style_basic .rpt_plan .rpt_head .rpt_price {
    font-size: 18px !important;
    line-height: 30px !important;
}

}


.rpt_plan_0,
.rpt_plan_2 {
    background-color: #d04b3a;
    padding-bottom: 35px;
    border-radius: 8px;
}
.rpt_recommended_plan {
    background-color: #a91805;
    padding-bottom: 35px;
    border-radius: 8px;
    top: 0 !important;
}
.rpt_style_basic .rpt_plan .rpt_head .rpt_price {
    font-size: 18px !important;
    line-height: 30px !important;
}
.rpt_style_basic .rpt_plan .rpt_title {
    font-family: 'Roboto', sans-serif;
    font-size: 40px !important;
    font-weight: 100 !important;
    text-align: center;
}
.rpt_style_basic .rpt_plan .rpt_features .rpt_feature {
    border-bottom: none 0px !important;
    color: #FFF !important;
    font-weight: 400;
    font-size: 16px !important;
    text-align: left;
    background-image: url("images/packages-list-tick-green.png");
    background-repeat: no-repeat;
    background-position: 0 11px;
    text-align: left;
    margin: 0px;
    padding: 4px 0 4px 25px !important;
}
.rpt_plan_0 .rpt_title, 
.rpt_plan_2 .rpt_title,
.rpt_plan_0 .rpt_features,
.rpt_plan_2 .rpt_features,
.rpt_recommended_plan .rpt_title,
.rpt_recommended_plan .rpt_features{
    background-color: none !important;
    background: none !important;
}

.rpt_style_basic .rpt_plan .rpt_foot {
    background-color: #fad008 !important;
    color: #1f2329 !important;
    text-transform: uppercase;
    font-weight: 700 !important;
    font-size: 16px !important;
    margin: 0 20px;
    border-top: none 0 !important;
    border-radius: 4px !important;
    letter-spacing: -0.5px;
    padding: 12px 0 !important;
}
.rpt_style_basic .rpt_plan .rpt_title img {
    position: absolute !important;
    top: -7px;
    right: -16px;
}

/*  HOME (front-page.php)  */

.footercta li {list-style: none;}

.rpwe-block ul{
list-style: none !important;
margin-left: 0 !important;
padding-left: 0 !important;
}

.rpwe-block li{
border-bottom: 1px solid #eee;
margin-bottom: 10px;
padding-bottom: 10px;
list-style-type: none;
}

.rpwe-block a{
display: inline !important;
text-decoration: none;
}

.rpwe-block h3{
background: none !important;
clear: none;
margin-bottom: 0 !important;
margin-top: 0 !important;
font-weight: 400;
font-size: 18px;
line-height: 1.2em;
}

.rpwe-thumb{
margin-right: 15px;
}

.rpwe-time{
color: #888;
font-size: 13px;
}

.rpwe-alignleft{
display: inline;
float: left;
}

.rpwe-clearfix:before,
.rpwe-clearfix:after{
content: "";
display: table !important;
}

.rpwe-clearfix:after{
clear: both;
}

.rpwe-clearfix{
zoom: 1;
}



/* FAQ CUSTOM STYLES */

.hs-faq-container input[type="radio"] {
    display: none;
}
.hs-faq-container article.ac-small p {
    font-style: normal !important;
    color: #333;
    line-height: 23px;
    font-size: 16px !important;
    padding: 20px;
    text-shadow: none;
    margin-bottom: 0;
}
.hs-faq-container div {
    margin-bottom: 20px;
}

/* 
Make the Facebook Like box responsive (fluid width)
https://developers.facebook.com/docs/reference/plugins/like-box/ 
This element holds injected scripts inside iframes that in 
some cases may stretch layouts. So, we're just hiding it. 
*/
#fb-root {
    display: none;
}
/* To fill the container and nothing else */
.fb_iframe_widget, .fb_iframe_widget span, .fb_iframe_widget span iframe[style] {
    width: 100% !important;
}



/*  BLOG (home.php)  */

#blogpage {}

#blogpage ol.post-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

ol.post-list li.post-item {
    background-color: #f4f4f4;
/*    margin-bottom: 15px;*/
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
}

.post-item {
    position: relative;
    margin-bottom: 50px;
    background-color: #f4f4f4;
}
    body.blog .post-item .post-thumb-img {
        max-height: 200px;
        overflow: hidden;
  
    }
    body.blog .post-item article .post-thumb-img img {
        width: 100%;
        height: auto;
  
    }
    .post-item h2 a {
        color: #d04b3a;
        text-decoration: none;
        text-transform: none;
    }
    .post-item .info-area {
        padding: 15px;
    }
.featured-post .post-thumb-img {
    max-height: 730px !important;
    margin-left: -4%;
    background-color: blue;
    height: 355px;
}
.featured-post .post-thumb-img img {
    height: 100%;
    width: auto;
}
.stats-area .post-comments-time{
    float: left;
    margin-right: 10px;
    color: #999;
    font-size: 14px;
}
.stats-area .post-comments-link,
.stats-area .social-links {
    float: right;
    margin-right: 10px;
    color: #999;
    font-size: 14px;
}
.stats-area .post-comments-link a {
    text-decoration: none;
    color: #333;
}
    .stats-area .post-comments-link a span.fa.fa-comment,
    .stats-area .social-links span.fa-plus-square{
        color: #999;
    }
    .stats-area .post-comments-link a span.fa.fa-comment:hover,
    .stats-area .social-links span.fa-plus-square:hover {
         color: #d04b3a;
    }
.stats-area {
    padding: 5px 0;
    border-top: solid 1px #e1e1e1;
    border-bottom: solid 1px #e1e1e1;
    margin-bottom: 15px;
}
.stats-area .social-links span.fa-plus-square {
    font-size: 20px;
}


/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {

    .four.columns.post-item {
        width: 46%;
    }
    
}

/* Larger than tablet */
@media (min-width: 750px) {

.four.columns.post-item {
        width: 29.337%;
    }
    
}

/*  BLOG POST (single.php)  */

.single .post-thumb-img img {
    width: 100%;
    height: auto;
}
.single .post-thumb-img {
    margin-top: -90px;
}

.section #postbackground {
    width: 100%;
    height: 500px;
    background-size: cover !important;
    background-repeat: no-repeat;
    margin-top: -90px;
/*    margin-bottom: 50px;*/
    background-position: top center;
}
body.single-post .stats-area {
    margin-bottom: 50px;
}
body.single-post .sidebar {
}
body.single-post .sidebar > li {
    list-style: none;
    margin-bottom: 15px;
    background-color: #e0e0e0;
    padding: 15px;
    box-sizing: border-box;
}

#comments {
}

li.widget_image .jetpack-image-container img {
    width: 100% !important;
    height: auto;
}

.at-below-post.addthis-toolbox {
    margin: 60px 0 60px 0;
}


#comments > ol > li {
    list-style: none;
    border: solid 1px #e0e0e0;
    padding: 20px 20px 1px 20px;
}
#comments ol li article img.avatar {
    float: left;
    margin: 0 15px 15px 0px;
    width: 60px;
    height: auto;
}

#respond .form-submit #comment-submit {
    
}


/* Make Youtube videos responsive */
.iframe-flexible-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
}
.iframe-flexible-container iframe,   
.iframe-flexible-container object,  
.iframe-flexible-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100%;
}


/* WOOCOMMERCE - CART */

.woocommerce a.button.alt,
.woocommerce input.button.alt {
    background-color: #d04b3a;
    border: none 0px;
    color: #FFF;
    font-size: 16px;
    -webkit-box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.5);
    -moz-box-shadow:    1px 1px 1px 0px rgba(0, 0, 0, 0.5);
    box-shadow:         1px 1px 1px 0px rgba(0, 0, 0, 0.5);   
}
/*.woocommerce a.button:hover,*/
.woocommerce input.button.alt:hover {
    background-color: #bd4131 !important;
}

.woocommerce .cart-collaterals .cart_totals, .woocommerce-page .cart-collaterals .cart_totals {
    float: right;
    width: 30%;
    background-color: #e0e0e0;
    box-sizing: border-box;
    padding: 20px;
}
.cart_totals table {
    width: 100%;
}
.cart-collaterals .cart_totals table tr th {
    width: 40% !important;
}

/* WOOCOMMERCE - CHECKOUT */

input#payment_method_paypal {
   display: none;
}
.woocommerce #payment .terms, .woocommerce-page #payment .terms {
    clear: both;
text-align: left;
padding: 0px;
font-size: 15px;
line-height: 18px;
    margin-bottom: 15px;
}
.woocommerce #payment #place_order, .woocommerce-page #payment #place_order {
    float: none;
    width: 100%;
}

/* WOOCOMMERCE - THANK YOU PAGE */
   
#questionnairelink {
    text-align: center;
    padding: 15px;
    margin-top: 0px;
    background-color: #f4f4f4;
    margin-bottom: 15px;
}

/*  TESTIMONIALS (PLUGIN)  */

.tslider blockquote p {
    color: #333 !important;
    font-size: 1.3em !important;
}
.tslider blockquote footer, .tslider blockquote footer a {
    color: #d04b3a !important;
    font-size: 1.5em !important;
    margin-bottom: 15px;
}
.tslider blockquote footer:before {
	content: '' !important;
}