/*
Theme Name: Calvin and Hobbes
Theme URI:
Author: Andrews McMeel Universal
Author URI: https://amuniversal.com
Description:
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags:
Text Domain: calvinandhobbes

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

/* @font-face kit by Fonts2u (http://www.fonts2u.com) */ 
@font-face {font-family:"Calvin and Hobbes Normal";src:url("css/CALVINN.eot?") format("eot"),url("css/CALVINN.woff") format("woff"),url("css/CALVINN.ttf") format("truetype"),url("css/CALVINN.svg#CalvinAndHobbesNormal") format("svg");font-weight:normal;font-style:normal;}

body { background: url('/wp-content/uploads/2016/09/background_pattern.jpg'); margin: 20px 0px; }

#home-menu a { color: #000; font-family: "Calvin and Hobbes Normal"; font-size: 2.1em; }

#home-menu li { padding-left: 15px; padding-right: 15px; }
#social em { display: none; }
#social-gocomics { display: block; width: 127px; height: 28px; background: url('/wp-content/uploads/2016/09/social_icons.png') 0px 0px; }
#social-facebook {display: block; float: right; margin:3px; }
#social-twitter { display: block; float: right; margin:3px;}
#social-comicsDiv {display: block; float: right;margin-right:3px;margin-bottom:3px}

.calvin-font { font-family: "Calvin and Hobbes Normal"; }
.calvin-font-big { font-family: "Calvin and Hobbes Normal; font-size:large;" }
.nuecha-font { font-family: 'Neucha', cursive; }

.character-p { font-family: 'Neucha', cursive; font-size: 1.3em; }

#home-menu a:hover { color: #ee0e25; text-decoration: none; }

#main-menu .col-md-4 { width: 28%; }
#main-menu .col-md-6 { width: 55.3333%; }
#menu a { color: #000; font-family: "Calvin and Hobbes Normal"; font-size: 1.4em; }
#menu a:hover { color: #ee0e25; font-family: "Calvin and Hobbes Normal"; font-size: 1.4em; text-decoration: none; }
#menu a.selected { color: #ee0e25; font-family: "Calvin and Hobbes Normal"; font-size: 1.4em; }
#menu li { padding-left: 10px; padding-right: 10px; }
.modal-header{padding:20px;}
.modal-header .close {
    margin-top: -10px;
}
.carousel-control .glyphicon,
.carousel-control .icon-prev,
.carousel-control .icon-next {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 5;
  display: inline-block;
  width: 40px;
  height: 40px;
  margin-top: -10px;
  margin-left: -10px;
  font-family: serif;
}
.carousel-control {
    position: absolute;
    top: 40%;
    
    left: 0;
    width: 12%;
    font-size: 70px;
    color: #fff;
    text-align: center;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .6);
    filter: alpha(opacity=50);
    opacity: .5;
}
.carousel-control.left:before {
  content: '\2039';
   width:30px;
   height:30px;
}

.carousel-control.right:before {
  content: '\203a';
width:30px;
   height:30px;
}
.btn-orange { font-family: 'Varela Round', sans-serif; padding: 15px 50px; color: #fff; background: #f25443; font-size: 1.1em; }
.btn-orange:hover { color: #fff; background: #ed2914; text-decoration: none; }

.btn-checkout{
    margin: 120px 0 0 80px;
	background-color: #fff;
    border-style: solid;
    border-color: #363636;
    border-radius: 8px;
    color: #363636;
    padding: 20px 72px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 30px;
    letter-spacing: 2px;
    cursor: pointer;
    @include media-breakpoint-down(md){
       font-size:12px;
    }
}
.btn-checkout-grad{
    margin: 70px 0 0 80px;
	background-color: #fff;
    border-style: solid;
    border-color: #363636;
    border-radius: 8px;
    color: #363636;
    padding: 20px 72px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 30px;
    letter-spacing: 2px;
}
.btn-checkout-top{
    margin: 10px 0 0 200px;
	background-color: #363636;
    border-style: solid;
    border-color: #363636;
    border-radius: 8px;
    color: #fff;
    padding: 12px 42px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 22px;
    letter-spacing: 2px;
    cursor: pointer;
}
.btn-checkout-top:hover{border-color:#fff; color:#fff;text-decoration: none;}
.btn-checkout:hover, .btn-checkout-grad:hover {
	background-color:#363636;
	border-color:#363636;
	color: #fff;
        text-decoration: none;
}
.btn-search{
margin: 0px 0 0 10px;
    letter-spacing: 1px;
    border: #999 solid 2px;
    border-radius: 8px;
    color: #999;
    padding: 15px 135px;
    text-align: center;
    text-decoration: none;
    display: inline-block; 
    font-size: 14px;
    font-weight:500;
}
.btn-search-home{
margin: 0px 0 0 10px;
    letter-spacing: 1px;
    border: #999 solid 2px;
    border-radius: 8px;
    color: #999;
    padding: 15px 105px;
    text-align: center;
    text-decoration: none;
    display: inline-block; 
    font-size: 14px;
    font-weight:500;
}
.btn-collection{
margin: 0px 0 0 10px;
    letter-spacing: 1px;
    border: #999 solid 2px;
    border-radius: 8px;
    color: #999;
    padding: 18px 80px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 12px;
    font-weight:500;
}
.btn-calvin{
margin: 0px 0 0 10px;
    letter-spacing: 1px;
    border: #999 solid 2px;
    border-radius: 8px;
    color: #999;
    padding: 18px 50px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 12px;
    font-weight:500;
}
.btn-collection:hover, .btn-calvin:hover{
	background-color:#363636;
	color: #fff;
        text-decoration: none;
	border: #363636 solid 2px;
}
.btn-moms{
    margin: 0px 0 0 10px;
    letter-spacing: 1px;
    border: #999 solid 2px;
    border-radius: 8px;
    color: #999;
    padding: 10px 74px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 20px;
    font-weight:500;
}
.btn-moms-main{
    margin: 0px 0 0 10px;
    letter-spacing: 1px;
    border: #999 solid 2px;
    border-radius: 8px;
    color: #999;
    padding: 10px 40px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 20px;
    font-weight:500;
}
.btn-grads-main{
    margin: 0px 0 0 10px;
    letter-spacing: 1px;
    border: #999 solid 2px;
    border-radius: 8px;
    color: #999;
    padding: 10px 35px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 20px;
    font-weight:500;
}
.btn-dinosaurs-main{
    margin: 0px 0 0 6px;
    letter-spacing: 1px;
    border: #999 solid 2px;
    border-radius: 8px;
    color: #999;
    padding: 10px 25px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 15px;
    font-weight:500;
}
.btn-exploring-main{
    margin: 0px 0 0 10px;
    letter-spacing: 1px;
    border: #999 solid 2px;
    border-radius: 8px;
    color: #999;
    padding: 10px 25px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 15px;
    font-weight:500;
}
.btn-spaceman-main{
    margin: 0px 0 0 6px;
    letter-spacing: 1px;
    border: #999 solid 2px;
    border-radius: 8px;
    color: #999;
    padding: 10px 25px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 15px;
    font-weight:500;
}
.btn-grads{
    margin: 0px 0 0 15px;
    letter-spacing: 1px;
    border: #999 solid 2px;
    border-radius: 8px;
    color: #999;
    padding: 10px 74px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 20px;
    font-weight:500;
}
.btn-exploring{
    margin: 0px 0 0 15px;
    letter-spacing: 1px;
    border: #999 solid 2px;
    border-radius: 8px;
    color: #999;
    padding: 10px 25px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 18px;
    font-weight:500;
}
.btn-spaceman{
    margin: 0px 0 0 10px;
    letter-spacing: 1px;
    border: #999 solid 2px;
    border-radius: 8px;
    color: #999;
    padding: 10px 25px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 18px;
    font-weight:500;
}
.btn-essentials{
    margin: 0px 0 0 10px;
    letter-spacing: 1px;
    border: #999 solid 2px;
    border-radius: 8px;
    color: #999;
    padding: 10px 25px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 18px;
    font-weight:500;
}
.btn-dinosaurs{
    margin: 0px 0 0 10px;
    letter-spacing: 1px;
    border: #999 solid 2px;
    border-radius: 8px;
    color: #999;
    padding: 10px 25px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 18px;
    font-weight:500;
}
.btn-dinosaurs2{
    margin: 0px 0 0 10px;
    border: #999 solid 2px;
    border-radius: 8px;
    color: #999;
    padding: 10px 44px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 18px;
    font-weight:500;
}
.btn-exploring2{
    margin: 0px 0 0 10px;
    letter-spacing: 1px;
    border: #999 solid 2px;
    border-radius: 8px;
    color: #999;
    padding: 10px 44px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 18px;
    font-weight:500;
}
.btn-moms:hover, .btn-grads:hover, .btn-search:hover, .btn-moms-main:hover, .btn-grads-main:hover, .btn-spaceman-main:hover, .btn-spaceman:hover,.btn-exploring:hover,.btn-exploring2:hover,.btn-dinosaurs2:hover,.btn-dinosaurs:hover, .btn-dinosaurs-main:hover, .btn-exploring-main:hover, .btn-essentials:hover{
	background-color:#363636;
	color: #fff;
        text-decoration: none;
	border: #363636 solid 2px;
}
.p-checkout{
	font-size:13px;
	margin-top:20px;
	color: #666;
	font-weight: 500;
        letter-spacing: .7px;
}
.p-shop-prints{
	font-size:12px;
	margin: 20px 0 10px 12px;
	color: #666;
	font-weight: 500;
        letter-spacing: 1px;
}
.container-checkout{
	//width:510px;
	height:360px;
	background-color:#f7f7f7;
}
.container-checkout-grad{
	width:510px;
	height:230px;
	background-color:#f7f7f7;
}
.header-prints{
	font-size:20px;
	font-weight:600;
	letter-spacing: 1px;
}
.subhead-prints{
	font-size: 16px;
	letter-spacing: 1px;
}	
.newbook-header { font-family: Helvetica, Arial; font-size: 2em; font-weight: bolder; line-height: 1em; }
.newbook-margin { font-size: .7em;  font-weight: normal; }
.newbook-text { font-size: 1em; font-family: Helvetica, Arial; line-height: 2em; margin-top: 15px; }

.books { margin-top: 20px; }
.books a { color: #000; font-size: .9em; font-family: Helvetica, Arial; }

.order a { color: #ee0e25 }

.comicStripText { font-family: 'Varela Round', sans-serif; margin-top: 20px; font-size: 1.3em; }
.comicStripText2 { font-family: 'Varela Round', sans-serif; margin-top: 5px; font-size: 1.1em; }

.radioPadding{padding-right:70px;}
 /**** end desktop query ****/



@media screen and (max-width: 565px) {
  #home-menu.list-inline li { display: block; }
  #menu.list-inline li { display: block; }
  #social-facebook, #social-twitter,#social-comicsDiv {float: none;} 
}
area { 
    display: none;
}
@media only screen and (min-device-width: 320px) and (max-device-width: 1024px) {
	.radioPadding{padding-right:10px;}
	.comicStripText, .comicStripText2{
	  padding: 5px 15px;
	  margin-top:0;
	  font-size:1.1em;
	}
	img {
    	  max-width: 100%;
    	  height: auto;
	}
	.container{
	  padding:0px;
	}
	.container-checkout{
	  width:100%;
	  height:auto;
	  padding:0 10px 10px 10px;
	  margin:0;
	}
	.btn-checkout-top{
	margin: 20px 0 0 10px;
	}
	.header-prints, .subhead-prints{
	  margin-left:10px;
	}
	.btn-checkout{
	  margin: 10px 0 0 0px;
	  width:100%;
	  padding:20px 0;
	  text-align:center;
	}
	.btn-btm-checkout{
	  padding:0;
	}
	.btn-calvin,
	.btn-dinosaurs, 
	.btn-spaceman, 
	.btn-exploring, 
	.btn-dinosaurs-main, 
	.btn-spaceman-main, 
	.btn-exploring-main, 
        .btn-essentials,
	.btn-exploring2, 
	.btn-dinosaurs2, 
	.btn-collection, 
	.btn-search{
	  width:100%;
	  margin: 5px 0;
	}
	.btn-search{
	  padding:15px 50px;
	}
	.footer-checkout{
	  padding:10px;
	}
	.p-checkout{
	  padding-top:20px;
	}
	
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
	#home-menu.list-inline li { display: block; }
 	#menu.list-inline li { display: block; }
  	#social-facebook, #social-twitter,#social-comicsDiv {float: none;} 
	.btn-checkout{
	  margin: 10px 0 0 0px;
	  width:50%;
	  padding:20px 0;
	  text-align:center;
	}
	.btn-checkout-top{
	  margin: 20px 0;
	}
	.btn-dinosaurs-main, btn-spaceman-main{
	  padding:10px 20px;
	}
	.btn-btm-checkout{
	  margin-top:40px;
	  text-align:center;
	}
	.container-checkout{
	  text-align:center;
	}
	.container-fluid{
	padding:0;
	}
	.p-checkout{
	  padding-top:20px;
	}
}