/*
Theme Name: My Sandy Hook Family Fund
Theme URI: http://MySandyHookFamilyFund.com
Description: A custom template for MySandyHookFamilyFund
Version: 1.0
Author: Marcella Kovac / Jordan Rabidou
Author URI: http://www.TheHeavenlyHash.com
Tags: 
	
Credits and license: Designed by Bananaland Developed by Heavenly Hash

Last update: Feb 4, 2011
*/

/**************************
STANDARD HTML TAGS
**************************/
body { margin:0px; padding:0px; background:#fff; font-family: 'proxima', Verdana, Geneva, sans-serif; font-size:12px;}
body.home{background:#006E3D; color:#fff;}

img{ border:0px;}
h1{font-size:25px; color:#006f3d; font-weight:normal; text-transform:uppercase; font-family:verbblack;}
h2{font-size:16px; color:#747474; text-transform:uppercase;}
a{ text-decoration:none; color:#000;}
a:hover { color:#8dc63f;}

blockquote {border-left: 0.5em solid #ccc; font-size: 0.9em; font-style: normal; padding: 0 0 0 1em;}

p{margin-top:0px; padding-top:0px;}
textarea{width:100%;}

/**************************
CUSTOM CSS CLASSES
**************************/

.alignleft { float: left; display: inline; /* IE6 fix */ padding: 0 1em 0.5em 0; text-align: left;}
.aligncenter {display: block; margin: 1em auto; text-align: center;}
.alignright {float: right; display: inline; /* IE6 fix */ padding: 0 0 0.5em 1em; text-align: right;}
.alignjustify {text-align: justify;}

.center{text-align:center;}
.clear{clear:both; height:0px; line-height:0px;}

.green{ color:#8dc33f;}
.white{color:#fff;}
.tiny{font-size:8px;}

.heavy{font-weight:900;}
.medium{ font-weight:500;}
.strong{font-weight:bold;}

.input input{border:none; font-size:18px; color:#747474; font-family: 'proxima', Verdana, Geneva, sans-serif; width:100%; padding:0px;}
.input textarea{border:none; font-size:18px; color:#747474; font-family: 'proxima', Verdana, Geneva, sans-serif;}

input.checkbox{ width:auto; display:inline-block; margin-bottom:10px;}


html {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}
*, *:before, *:after {
  -moz-box-sizing: inherit;
  -webkit-box-sizing: inherit;
  -ms-box-sizing: inherit;
  box-sizing: inherit;
}

.clearfix:after {
   content: " "; /* Older browser do not support empty content */
   visibility: hidden;
   display: table;
   height: 0;
   clear: both;
}

.cover{
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.vcenter{
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}


.half{width: 50%; float: left; position: relative;}
.half.big_half{ width: 55.8%;}
.half.small_half{ width: 44.2%;}

.col-1-3{width: 33.33%; float: left; position: relative;}
.col-2-3{width: 66.66%; float: left; position: relative;}

.col-1-4{width: 25%; float: left; position: relative;}
.col-2-4{width: 50%; float: left; position: relative;}
.col-3-4{width: 75%; float: left; position: relative;}

.col-1-5{width: 20%; float: left; position: relative;}
.col-2-5{width: 40%; float: left; position: relative;}
.col-3-5{width: 60%; float: left; position: relative;}
.col-4-5{width: 80%; float: left; position: relative;}

.right{float: right; text-align: right;}

.grid_container{margin: 0px -25px}
.grid{padding: 25px;}

.grid_container-small{margin: 0px -3px;}
.grid-small{padding: 3px;}


.table{display: table; table-layout: fixed; width: 100%;}
.table_row{display: table-row;}
.table_cell{display: table-cell; vertical-align: middle;}

/**************************
DOM ELEMENTS
**************************/
#page {border-top:3px solid #8dc63f; overflow: hidden;}
.wrapper{max-width: 988px; padding: 0px 18px; position: relative; margin: 0px auto;}

/**************************
HEADER STYLES
**************************/
#header { border-bottom: 1px solid #f1f1f1; padding: 15px 0px 28px; }
#logo{font-size:25px; font-family: 'harriet_display'; text-align:center; letter-spacing:1px;}
#logo a{color:#006f3d;}
.home #logo a{color:#fff;}
#logo a:hover{color:#8dc63f;}
#logo .heart{margin: 0px 10px;}

#page_header{margin:0px; padding:0px; list-style:none;}
#page_header li{float:left; width:198px; height:198px; margin:0px; padding:0px; border:none; overflow:hidden;}
	
/**************************
SIDEBAR STYLES
**************************/
#sidebar{ }

/**************************
NAVIGATION STYLES
**************************/
#nav { padding:22px 0px; border:1px solid #ececec; border-width:1px 0px; font-family: 'proxima'; text-transform:uppercase; font-size:12px; font-weight:bold; position:relative; margin:0px;}
.home #nav{border-color:#fff;}
#nav ul{ display:table; list-style:none; text-align:center; padding:0px 0px 0px 20px; margin:0px auto; background:url(images/icn-heart.png) center left no-repeat;}
#nav ul li{ display:inline-block; padding:0px 40px 0px 20px; background:url(images/icn-heart.png) center right no-repeat;}
#nav ul li a{ text-decoration:none; color:#000;}
.home #nav ul li a{color:#fff;}
#nav ul li a:hover, #nav ul li.current-menu-item a{ color:#8dc63f;}
	
/**************************
CONTENT STYLES
**************************/
#content {}

#home_callouts{display:table; width:100%; font-size:12px; text-transform:uppercase; margin-top:-30px;}
#home_left{ display:table-cell; vertical-align:bottom; width:145px; text-align:center; padding:0px 40px}
#home_center{ display:table-cell; vertical-align:bottom;}
#home_right{ display:table-cell; vertical-align:bottom; width:145px; text-align:center; padding:0px 40px;}

#column_left{float:left; width:510px;}
#column_right{float:right; width:447px;}

.feature_text{ font-size:24px; color:#006f3d; line-height:30px; margin-bottom:33px;}
.page_content{max-width:425px; padding:0px 15px; font-size:18px; line-height:24px; margin-top:43px;}

.feature_image{margin:0px auto; text-align:center;}
#donate_button{ display:inline-block; height:54px; line-height:54px; padding:0px 52px; margin:30px 0px; text-align:center; background:url(images/btn-bg.png) repeat-x; color:#fff; font-size:24px; letter-spacing:1px; font-family: 'GibsonLight'; text-transform:uppercase;}
#donate_button:hover{color:#000;}

#respond{border:1px solid #8dc33f; margin-bottom:15px;}
	.input{border-bottom:1px solid #8dc33f; padding:20px 15px; position:relative;}
	.input.last{border:none;}

#submit_button, #wp-submit1{ background:#747474 url(images/icn-heart-white.png) 13px center no-repeat; color:#fff; text-align:left; padding:10px 13px 10px 36px; font-weight:900; letter-spacing:1px; width:90px; font-size:12px;}


a.active{color:#8dc63f;}
.comment{ margin-bottom:13px; background:#f7f7f7; padding:24px 20px;}
.comment.media{ background:#FFC;}
	.comment_date{ color:#8dc63f; font-weight:bold; font-size:12px;}
	.comment_author{ text-transform:uppercase; color:#006f3d; font-weight:900; font-size:12px; letter-spacing:1px;}
	.comment_content{}

#contact_wrapper{max-width:525px; margin:0px auto;}
.message{ font-size:18px; text-align:center; margin:30px 0px; color:#747474;}

/**************************
POPUP STYLES
**************************/
.bio_image{ width:18%; float:left;}
.bio_info{width:76%; float:right; color:#fff;}
	.bio_title{font-size:24px; font-weight:bold; letter-spacing:1px;}
	.birthday{font-size:24px; letter-spacing:1px; font-weight:lighter;}
	.bio_content{font-size:14px; line-height:19px; margin-top:50px;}
	
	.links{ font-size:14px; margin-top:10px; letter-spacing:1px; line-height:19px;}
		.link_title{ color:#8dc63f; font-weight:bold;}
		.link{ color:#8dc63f; display:block; text-decoration:underline;}

.sandyhook .fancybox-skin {background:none; /*position:fixed;*/
-webkit-box-shadow:none !important;
   -moz-box-shadow:none !important;
        box-shadow:none !important;
}

/*.fancybox-overlay{top:132px !important;}*/

.sandyhook .fancybox-error{color:#fff;}

.sandyhook .fancybox-nav{width: 10%;}


/**************************
THEME MY LOGIN STYLES
**************************/
.tml-form-table{width: 100%;}
.tml-form-table input{border: 1px solid #8dc33f; padding: 20px 15px;}
input.button-primary{ border:none; padding: 20px 15px 20px 40px; font-weight: 900; text-transform: uppercase; background: #747474 url("images/icn-heart-white.png") no-repeat scroll 13px center; cursor: pointer; margin-top: 40px !important;
    color: #fff;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 1px;display: block; color: #fff;}


input#wp-submit{padding: 20px 15px; color: #fff; background: #747474; text-transform: uppercase; font-weight: 900; border: none; width: 100%; cursor: pointer;}

.tml-action-links{list-style: none; margin: 0px; padding: 0px;}

.tml{max-width: 100% !important;}

.tml-lostpassword input#user_login{border:1px solid #8dc33f !important;}

/**************************
UPDATE STYLES
**************************/
.update_title{font-weight: bold; margin-bottom: 50px;}
.update_title span{color: #8dc63f;}

/**************************
RESOURCE STYLES
**************************/
.resource_title{font-weight: bold; color: #006f3d;}
.resource_content::before{content: ''; max-width: 80px; display: block; height: 1px; background: #006f3d; margin: 50px auto;}


.contact_info_bottom::before{content: ''; max-width: 80px; display: block; height: 1px; background: #8dc63f; margin: 50px auto; }

/**************************
EVENT STYLES
**************************/
.titlebar{ text-align: center; font-size: 16px; text-transform: uppercase; font-weight: 100; border-bottom: 1px solid #f1f1f1; font-family: 'raleway'; color: #969696; padding: 30px 0px; }

.single_content{text-align: center; font-family: 'raleway'; font-size: 18px; line-height: 1.444em; color: #747474;}
.event_title{font-weight: bold; margin-bottom: 50px;}

.event_title::after,
.event_content::before{content: ''; max-width: 80px; display: block; height: 1px; background: #8dc63f; margin: 0px auto; margin-top: 50px;}
.event_content::before{margin-bottom: 50px;}

.location,
.dates{margin-bottom: 30px;}
.location a,
.dates{font-weight: bold; text-transform: uppercase; color: #8dc33f !important;}

.dates span{text-transform: lowercase; font-size: 10px;}

address{font-style:normal;}

.rsvp_info{font-weight: bold;}
.heavy{font-weight:900;}

/**************************
DASHBOARD STYLES
**************************/
.dashboard_title{background:#006f3d; color: #fff; text-transform: uppercase; padding: 18px 25px; font-size: 18px; font-family: 'raleway'; font-weight: 900; letter-spacing: 1px;}
	.dashboard_title a.viewall{float: right; font-size: 12px; color: #8dc63f; line-height: 25px; font-weight: bold;}
	.dashboard_item{padding: 35px 0px; color: #747474; font-size: 18px; font-family: 'raleway'; font-weight: bold; line-height: 1.444em;}
	.dashboard_item span{color:#8dc63f;}

	.resource_wrapper .dashboard_item{ background: #eeeeee; text-align: center; padding: 35px 15px; color: #006f3d;}
	.contact_trigger{text-align: center; font-size: 12px; font-family: 'raleway'; font-weight: bold; color: #8dc63f; border:1px solid #8dc63f; padding: 15px; margin-top: 10px; text-transform: uppercase; cursor: pointer;}


	.event_date{font-size: 12px; color: #8dc63f; text-transform: uppercase; margin-top: 20px;}

	.no_items{text-align: center;}

	.more_link{font-size: 12px; text-transform: uppercase;}
	.more_link a{color: #747474;}
	.more_link::before{content: ''; max-width: 80px; display: block; height: 1px; background: #8dc63f; margin: 20px 0px;}

	.resource_wrapper .more_link::before{margin: 20px auto; background: #006f3d;}



.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
}

/* Modal Content/Box */
.modal-content {
	position: relative;
    background-color: #fff;
    font-family: 'raleway';
    color: #747474;
    font-size: 18px;
    line-height: 1.44em;
    margin: 15% auto; /* 15% from the top and centered */
    padding: 70px;
    width: 80%; /* Could be more or less, depending on screen size */
    max-width: 500px;
}

/* The Close Button */
.close {
    color: #aaa;
    position: absolute;
    top: 10px; right: 10px;
    font-size: 28px;
    font-weight: bold;
}

.close:hover,
.close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}
	.contact_title{ color: #8dc63f; font-family: 'raleway'; font-weight: bold; }
	.contact_name{font-size: 18px;  font-family: 'raleway';  font-weight: bold; margin-bottom: 0px;}
	.contact_address{margin-top: 20px;}


.contact_wrapper{margin-top: 20px;}


.past_event .dashboard_item,
.past_event .event_date,
.past_event .more_link a{color: #d2d2d2 !important;}
.past_event .more_link::before{background: #d2d2d2 !important}

/**************************
DROPDOWN STYLES
**************************/
.dropdown{ max-width: 33%;display: block; position: relative; font-size: 12px; color: #747474; text-transform: uppercase; font-weight: bold; margin-top: 25px;}
  .dropdown .trigger{cursor: pointer; border: 1px solid #000;  padding: 20px 30px; position: relative; margin-right: 27px}
  #cat_select{margin: 0px; padding: 0px; list-style: none; border: 1px solid #000; border-width: 0px 1px 1px 1px; display: none; position: absolute; left: 0px; right: 27px; top: 57px; background: #fff; z-index: 999;}
  #cat_select li{display: block; padding: 20px 30px; border-bottom: 1px solid #000;}
  #cat_select li:last-child{border-bottom: none;}
  .dropdown a{color: #747474;}
  #cat_select li.active a,
  .dropdown a:hover{color:#006F3D; }

  .dropdown .trigger::after{content:'+';  position: absolute; right: 20px; top: 22px; color: #747474;  font-size: 14px; line-height: 14px; }
  .dropdown .trigger.active::after{content:'–';}


/**************************
FOOTER STYLES
**************************/

#footer_callout{text-align:center; border-top:1px solid #fff; font-weight:bold; color:#fff; text-transform:uppercase; letter-spacing:1px; padding:50px 0px; margin:40px 0px -40px;}
#footer_callout a{color:#fff;}

#footer { border-top:1px solid #ececec; padding:23px 0px 35px 0px; margin-top:40px; font-family: 'proxima'; font-weight:400; font-size:9px; letter-spacing:1px;}
.home #footer{border-color:#fff;}
#footer_credits{ text-align:center;}
	#footer_credits a{color:#000;}
	.home #footer_credits a{color:#fff;}
	#footer_credits a:hover, .home #footer_credits a:hover{color:#8dc63f;}
	#footer_right{ float:right;}
	.spread {float:left; margin-right:15px;}
	.fb-like{margin-right:15px;}
	.twitter-share-button.twitter-count-horizontal{width:75px !important;}



/**************************
BURGER STYLES
**************************/
.burger_text{margin-top: 7px; letter-spacing: 2px; text-align: center;}
#nav_wrapper{position: fixed; top: 0px; left: 0px; right: 0px; bottom: 0px; padding-top: 25px; text-align: center; background: #0d0d0d; width: 100%; height: 100%; z-index: 999;
    /* this fixes the buggy scrolling on webkit browsers - mobile devices only - when overflow property is applied */
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-overflow-scrolling: touch;
    -webkit-transform: translateY(-200%);
    -moz-transform: translateY(-200%);
    -ms-transform: translateY(-200%);
    -o-transform: translateY(-200%);
    transform: translateY(-200%);
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    transition-property: transform;
    -webkit-transition-duration: 0.4s;
    -moz-transition-duration: 0.4s;
    transition-duration: 0.4s;
    z-index: 999;
  }
   
#nav_wrapper.is-visible {
  -webkit-transform: translateY(0px);
  -moz-transform: translateY(0px);
  -ms-transform: translateY(0px);
  -o-transform: translateY(0px);
  transform: translateY(0px);
}

.admin-bar #nav_wrapper{padding-top: 57px;}

#sitename{color: #747474; font-family: 'harriet_display'; font-size: 25px; letter-spacing:1px; margin-bottom: 50px;}

#new_nav { background: url('images/icn-heart.png') center bottom no-repeat; padding-bottom: 30px; letter-spacing: 2px; }


#new_nav ul{ margin: 0px; padding: 0px; list-style: none; font-size: 18px; line-height: 1em; text-transform: uppercase; font-weight: bolder;}
#new_nav ul li{ margin: 5px 0px; }
#new_nav ul li a{ color: #fff; }
#new_nav ul li a:hover, 
#new_nav ul li.current-menu-item > a{ color: #8dc63f; }


#new_nav ul li.dashboard{margin-top: 40px; margin-bottom: 40px;}
#new_nav ul li.dashboard a{ color: #8dc63f; }

#new_nav ul ul{ font-weight: normal;}

#new_nav ul li.gray a{color: #747474;}




#burger_wrapper{ position: absolute; top: 30px; left: 18px; z-index: 9999; }
#burger{position: relative;}

.nav-toggle{cursor: pointer; padding: 10px 43px 10px 0px;}
.nav-toggle span, .nav-toggle span:before, .nav-toggle span:after {
  cursor: pointer;
  border-radius: 0px;
  height: 4px;
  width: 43px;
  background: #8dc63f;
  position: absolute;
  display: block;
  content: '';
  left: 0px;
}
.nav-toggle span:before {
  top: -10px; 
}
.nav-toggle span:after {
  bottom: -10px;
}

.nav-toggle span, .nav-toggle span:before, .nav-toggle span:after {
    -webkit-transition: all 500ms ease-in-out;
    -moz-transition: all 500ms ease-in-out;
    -o-transition: all 500ms ease-in-out;
    transition: all 500ms ease-in-out;

}
.nav-toggle.active span {
  background-color: transparent;
}
.nav-toggle.active span:before, .nav-toggle.active span:after {
  top: 0;
}
.nav-toggle.active span:before {
  transform: rotate(45deg);
  -ms-transform:rotate(45deg); /* IE 9 */
  -moz-transform:rotate(45deg); /* Firefox */
  -webkit-transform:rotate(45deg); /* Safari and Chrome */
  -o-transform:rotate(45deg); /* Opera */
}
.nav-toggle.active span:after {
  transform: rotate(-45deg);
  -ms-transform:rotate(-45deg); /* IE 9 */
  -moz-transform:rotate(-45deg); /* Firefox */
  -webkit-transform:rotate(-45deg); /* Safari and Chrome */
  -o-transform:rotate(-45deg); /* Opera */
}



@media all and (max-width: 923px){
	.dashboard_title{padding: 10px 15px;}
	.grid_container{margin: 0px -10px;}
	.grid{padding: 10px;}
}

@media all and (max-width: 767px){
	.grid_container .col-1-3{float: none; width: 100%; padding: 0px 0px 25px 0px;}
	#dasboard_bottom{margin: 0px -10px;}
	
	.dropdown{margin: 25px 0px; max-width: 100%;}
	.dropdown .trigger{margin-right: 0px;}
	#cat_select{right: 0px;}
	#resources_wrapper{padding: 0px 10px;}

	.single_content{font-size: 16px;}

	.modal-content{padding: 20px; font-size: 16px;}

	#column_left, #column_right{width: 100% !important; display: block; float: none; margin: 0px;}
}

@media all and (max-width: 530px){
	#logo .heart{display: none;}
	#logo{font-size: 20px; padding-right: 10px; margin-top: 5px; margin-left: 50px;}
	#sitename{font-size: 20px; text-align: right; margin-top: 10px;} 
	.modal-content{padding: 20px; font-size: 14px;}
}