/*
Theme Name: Roasty Coffee
Theme URI: http://www.roastycoffee.com
Author: Matt Giovanisci
Version: 2.5
*/


/* GLOBAL */
html{margin: 0; padding: 0; width: 100%; min-height: 100%; height: 100%;}
body{font-family: Arial, Helvetica, sans-serif !important; color: #666; -webkit-font-smoothing: antialiased; text-shadow: 1px 1px 1px rgba(0,0,0,0.004); position: relative; text-rendering: optimizelegibility; -moz-osx-font-smoothing: grayscale; -moz-font-feature-settings: "liga"; min-height: 100%; height: 100%;}
a{color: #4b77b7; outline: none; transition: 0.2s ease;}
a:hover{color: #333;}
blockquote{display: block; padding: 0px 30px 0px 25px; margin: 0 0 40px 25px; color: #999; border-left: 5px solid #ccc; font-style: italic; font-family: georgia, serif;}
h1, .h1, h2, .h2, h3, .h3, h4, .h4, .display-3, .display-4{font-family: 'Lato', sans-serif; color: #333; font-weight: 900;}
input[type="text"], textarea {outline: none; box-shadow:none !important; border:1px solid #ccc !important;}

/* COLORS */
.orange{color: #f89922;}
.green{color: #5fad41;}
.black-bg{background-color: #333;}
.orange-bg{background-color: #f89922;}
.green-bg{background-color: #5fad41;}
.facebook{background-color: #3b5998;}
.twitter{background-color: #1da1f2;}
.pinterest{background-color: #bd081c;}


/* HEADER */
.header{background: #fff; width: 100%; border-bottom: 1px solid #e2e2e2; font-size: 15px; overflow: auto;}
.navigation{font-family: 'Lato', sans-serif; text-align: center;}
.navigation li{list-style: none; display: inline-block; width: 150px; margin: 0 20px; height: 75px; line-height: 75px; vertical-align: middle;}
.navigation .logo{width: 100%; display: block; margin: auto;}
.navigation a{text-decoration: none; color: #666;}
.navigation a:hover{color: #f89922;}
.responsive-navigation{display: none;}
.responsive-navigation .logo{float: left; width: 150px; height: 60px; padding: 10px 0 0 0; margin: 0 0 0 15px; display: block; box-sizing: border-box;}
.responsive-navigation .load-fullscreen{float: right; height: 60px; display: block; line-height: 60px; margin: 0 15px 0 0; box-sizing: border-box;}
.fullscreen{position: fixed; width: 100%; height: 100%; background: #fff; z-index: 5; display: none; padding: 100px 0; overflow: scroll;}
.fullscreen .logo{width: 200px; display: block; margin: auto;}
.fullscreen li{text-align: center; list-style: none;}
.close-fullscreen{position: absolute; top: 20px; right: 20px;}


/* FOOTER */
.footer{color: #ccc;}
.footer a{color: #fff; text-decoration: underline;}
.footer a:hover{color: #ccc;}


/* FORMS */
.btn-custom{font-family: 'Lato', sans-serif; font-weight: 900; font-size: 25px; line-height: 35px; padding: 15px 25px; transition: 0.2s ease; margin: 0 0 5px 0;}
.btn-custom:hover{box-shadow: none; background: #333; color: #fff; transform: translateY(5px);}


/* ARTICLES */
.article{margin: auto; max-width: 800px; font-size: 18px; line-height: 30px;}
.article h2{color: #333; font-size: 40px;}
.article h3{color: #666; font-size: 30px;}
.article p, .article ul, .article ol{margin-bottom: 40px;}
.article a{font-weight: bold;}
.share{position: fixed; left: 0; bottom: 50%; z-index: 1100; box-sizing: border-box; font-size: 0;}
.share li{list-style-type: none; color: #fff; padding: 10px 15px; margin: 0; cursor: pointer; box-sizing: border-box; font-size: 30px; line-height: 40px; text-align: center;}
.share li a{color: #fff;}


/* POPUP */
.pop{position: fixed; top: 0; bottom: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.75); box-sizing: border-box; z-index: 10; display: none; overflow: scroll;}
.pop-box{background: #fff; border: 1px solid #e2e2e2; border-radius: 10px; max-width: 800px; width: 95%; margin: 8% auto 0; box-sizing: border-box; padding: 40px; position: relative;}
.close-pop{position: absolute; top: 7px; right: 10px; color: #999; font-size: 25px;}
.close-pop:hover{color: #999;}


/* POSTS */
.post-card{text-decoration: none;}
.post-card:hover{text-decoration: none; transform: translateY(10px); opacity: 0.9;}


/* WORDPRESS CORE */
.alignnone{display: block; margin: 0 auto 40px; width: 100%; height: auto;}
.aligncenter, div.aligncenter {display:block;margin: 5px auto 5px auto;}
.alignright {float:right; margin: 5px 0 20px 20px;}
.alignleft {float:left;margin: 5px 20px 20px 0;}
.aligncenter {display: block;margin: 5px auto 5px auto;}
a img.alignright {float:right; margin: 5px 0 20px 20px;padding: 5px;}
a img.alignnone {padding: 0px; max-width:100%; width:auto; height:auto;}
a img.alignleft {float:left;margin: 5px 20px 20px 0;padding: 5px;}
a img.aligncenter {display: block;margin-left: auto;margin-right: auto;padding: 5px;}
.wp-caption {background: none; border:none; max-width: 100%; /* Image does not overflow the content area */ padding: 0; text-align: right;}
.wp-caption.alignnone {margin: 0 0 40px 0;}
.wp-caption.alignleft {margin: 5px 20px 20px 0;}
.wp-caption.alignright {margin: 5px 0 20px 20px;}
.wp-caption img {border: 0 none;height: auto; margin:0; max-width: 100%; padding:0; width: auto; border: none;}
.wp-caption p.wp-caption-text{font-size:11px; line-height: 11px; padding:0; color:#999; margin:0px !important;}



/* SHORTCODES */
.video-container {position: relative; padding-bottom: 56.25%;  height: 0; overflow: hidden; max-width: 100%; margin: 0 0 40px 0;}
.video-container iframe, .video-container object, .video-container embed{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.subscribe{width: 100%; padding: 35px; border: 1px solid #e2e2e2; border-radius: 10px; box-sizing: border-box; margin: 0 0 40px 0; overflow: auto;}
.subscribe form{width: 65%; float: left; display: block; text-align: center;}
.subscribe h4{font-size: 25px; line-height: 35px; margin: 0 0 20px 0;}
.subscribe img{width: 30%; float: right; display: block;}
.subscribe p{margin: 20px 0 0 0; font-size: 14px; color: #999;}



/* RESPONSIVE CSS */
@media only screen and (max-width: 1000px){
  .navigation{display: none;}
  .responsive-navigation{display: block;}
  .share{position: fixed; left: 0; bottom: 0; width: 100%;}
  .share li{display: inline-block; width: 25%;  padding: 5px; margin: 0;}
}


@media only screen and (max-width: 600px){
  .hipster{background: none; padding: 40px; text-align: center;}
  .subscribe{padding: 25px;}
  .subscribe form{width: 100%; float: none;}
  .subscribe img{width: 200px; float: none; margin: auto; display: block;}
  .subscribe .subscribe-email-address{height: 90px;}
  .subscribe p{margin: 10px 0 0 0;}
  .subscribe .orange-button{font-size: 25px; line-height: 35px;}
  .pop-box{padding: 25px;}
  .pop-box .right-content{float: none; width: 100%; text-align: center;}
  .pop-box .left-content{display: none;}
  .pop-box h3{font-size: 30px; line-height: 35px;}
  .pop-box p{font-size: 15px; line-height: 25px; margin: 0 0 20px 0;}
  .pop-box .center-content img{display: none;}
}