// Prefix: at-

// SASS Variables
$at-basetypo-family: 'Open Sans', sans-serif; //default
$at-basetypo-color: #424242;
$at-basetypo-size: 15px;
$at-basetypo-lineheight: 23px;

$at-heading-family: '#66B7AF', sans-serif; //default
$at-heading-color: #1a1a1a;

$at-vertspace: 25px;
$at-main-color: #666099; 
$at-secondary-color: #666099; //#ecf0f2;
$input-placeholder-color: #b3b3b3;

$at-margin-block-titles: 12.5px 0 37.5px;
$at-margin-block: 50px 0;
$at-padding-block: 50px 0;

// SASS Extends

// Clearfix
// Use @extend %at-clearfix; in element you want cleared
%at-clearfix {
	*zoom:1;
	&:before,
	&:after {
		content: "";
	    display: table;
	}
  	&:after {	    
	    clear: both;
	}
}

//
/////////// CSS Output ///////////


// Load CSS Normalize
@import "partials/libs/normalize";

// apply a natural box layout model to all elements
* {
  box-sizing: border-box;
}

// Body
html {
	overflow-x: hidden;
  height: 100%;
}
body {
	min-height: 100%;
	background: #fff;
	color: $at-basetypo-color;
  font-family: $at-basetypo-family;
  font-size: $at-basetypo-size;
  line-height: $at-basetypo-lineheight;
	-webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;

}
// Headings
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: $at-heading-family;
	font-weight: 600;
  color: $at-heading-color;
}

h1 {
  font-size: 3em;
  line-height: 1.3em;
}

h2 {
  font-size: 2.5em;
  line-height: 1.3em;
}
h3 {
  font-size: 2em;
  line-height: 1.3em;
}
h4 {
  font-size: 1.5em;
  line-height: 1.3em;
}
h5 {
  font-size: 1.3em;
  line-height: 1.3em;
}
h6 {
  font-size: 1em;
  line-height: 1.3em;
}
// Links
a {
  color: $at-main-color;
	text-decoration: none;
	&:hover {
    color: $at-main-color;
		text-decoration: none;
	}
}

// img
img {
  max-width: 100%;
  height: auto;
  vertical-align: middle;
}

// Container
.at-sitecontainer {
  background: #fff;

  &.at-sitecontainer--boxed {
    margin-left: auto;
    margin-right: auto;
  }
}

.at-container {
	max-width: 1100px;
	margin-left: auto;
	margin-right: auto;
  padding: 0 3%;
  //overflow: hidden;
}

@import "partials/forms";

@import "partials/header";

@import "partials/footer";

@import "partials/nav-site-header";

@import "partials/posts";
.at-post__content,
.at-page__content {
  @import "partials/entry-content";
}
.at-page__content {
  margin: 0 0 ($at-vertspace * 2);
}
@import "partials/posts-related";

@import "partials/widgets";

@import "partials/socialshare";

@import "partials/comments";

@import "partials/homepage";

@import "partials/socialfooter";

@import "partials/testimonials2";

@import "partials/leadpage";

@import "partials/popup";

@import "partials/wpgallery";




.at-pagewrapper {
  @extend %at-clearfix;
  margin: 0 0 ($at-vertspace * 2);
    &.at-pagewrapper--sboff {
      .at-page {
        //max-width: 742px;
        margin-left: auto;
        margin-right: auto;
      }
    }
    &.at-pagewrapper--archive, &.at-pagewrapper--single  {
     margin-top: 50px;
     }
  
  @media screen and (max-width: 767px) {
    .at-page {
      margin: 0 0 ($at-vertspace * 2);
    }
  }
  @media screen and (min-width: 768px) {
    &.at-pagewrapper--sbleft,
    &.at-pagewrapper--sbright {
      .at-page {
        width: 70%;
      }
      .at-sidebar {
        width: 30%;
      }
    }
    &.at-pagewrapper--sbleft {
      .at-page {
        float: right;
      }
      .at-sidebar {
        float: left;        
        padding-top: 10px;
        padding-right: 15px;
        @media screen and (min-width: 940px) {
          padding-right: ($at-vertspace * 1.5);
        }
      }
    }
    &.at-pagewrapper--sbright {
      .at-page {
        float: left;
      }
      .at-sidebar {
        float: right;        
        padding-top: 10px;
        padding-left: 15px;
        @media screen and (min-width: 940px) {
          padding-left: ($at-vertspace * 1.5);
        }
      }
    }
  }
}

.at-sidebar {
  font-size: ($at-basetypo-size - 2);
  line-height: ($at-basetypo-lineheight - 4);
}

// Required WP Classes

// Assitive Text
.screen-reader-text {
  clip: rect(1px, 1px, 1px, 1px);
  overflow: hidden;
  position: absolute !important;
  height: 1px;
  width: 1px;
  &:focus {
    background-color: #f1f1f1;
    border-radius: 3px;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
    clip: auto;
    color: #21759b;
    display: block;
    font-size: 14px;
    font-weight: bold;
    height: auto;
    line-height: normal;
    padding: 15px 23px 14px;
    position: absolute;
    left: 5px;
    top: 5px;
    text-decoration: none;
    text-transform: none;
    width: auto;
    z-index: 100000; /* Above WP toolbar */
  }
}







// Tag Cloud
// TODO: sort
.tagcloud,
.at-post__tags {
  a {
    display: inline-block;
    border: 1px solid #ebebeb;
    line-height: 1;
    color: #a1a1a1;
    padding: 8px 10px;
    margin: 0 3px 6px 0;
    transition: all .2s ease-in-out;
    &:hover {
      border: 1px solid #424242;
      color: #424242;
    }
  }
}

// Single Post Nav
.at-postnav {
  @extend %at-clearfix;
  margin: 0 0 ($at-vertspace);
  font-size: 15px;
  .at-postnav__links {
    a {
      display: inline-block;
      padding: ($at-vertspace / 2) ($at-vertspace);
      border: 1px solid #1a1a1a;
      font-size: 13px;
      text-transform: uppercase;
      line-height: 1;
      color: #1a1a1a;
      text-decoration: none;
      border-radius: 1px;

      &[rel="prev"] {
        float: left;
      }

      &[rel="next"] {
        float: right;
      }
    }
  }
}

// Posts Nav
.posts-navigation {
  @extend %at-clearfix;
  .nav-previous a,
  .nav-next a {
    display: inline-block;
    padding: ($at-vertspace / 2) ($at-vertspace * 2);
    border: 1px solid #1a1a1a;
    font-size: 14px;
    text-transform: uppercase;
    line-height: 1;
    color: #1a1a1a;
    text-decoration: none;
    border-radius: 1px;
  }
  .nav-previous {
    float: right;
    margin-bottom: $at-vertspace;
  }
  .nav-next {
    float: left;
    margin-bottom: $at-vertspace;
  }
}


.at-postheader {
  height: 100vh;
  max-width: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  //> img {
  //  width: 100%;
  //  max-width: 100%;
  //  height: auto;
  //  vertical-align: middle;
  //}
  
}


.at-pageheader {
  background: #f2f2f2;
  //margin-top: -25px;
  margin-bottom: 30px;
  padding: 0px;
  text-align: center;
  .at-pageheader__title {
    display: inline-block;
  }
}


// WP Required Classes
// Placeholders
.wp-caption {
  color: inherit;
}

.wp-caption-text {
  color: inherit;
}

.sticky {
  color: inherit;
}

.gallery-caption {
  color: inherit;
}

.bypostauthor {
  color: inherit;
}

// Contact Form 7 Compat
.wpcf7-form {
  .wpcf7-form-control-wrap {
    display: block;
    margin-top: 10px;
  }
}

