@charset 'utf-8';

/* html5reset.css - minified! */
* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}
a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}
ins{color:#000;text-decoration:none}
mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold}
del{text-decoration:line-through}
abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}
table{border-collapse:collapse;border-spacing:0}
hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}
input,select{vertical-align:middle}

/*img[src*="/images/content/"] { display: block; }*/

.clearfix::after { content:"."; display:block; height:0px; clear:both; visibility:hidden; }

#dbv { margin-top: 1em; margin-bottom: 1em; }

/*
    Primary Blue:   #0678BE
*/
/* body { font-family: 'Open Sans', sans-serif; border-top: 5px solid #b8d6fb; color:#333; background:#fff; background-image: url('/images/background.gif'); overflow-x: hidden;-webkit-font-smoothing: antialiased; } */
body { font-family: 'Open Sans', sans-serif; border-top: 5px solid #2860A2; color:#333; background:#efefef; overflow-x: hidden; -webkit-font-smoothing: antialiased; }

h1 { font-size: 2em; color: #333; letter-spacing: 1px; margin-bottom: 1em; } /* TODO: Why can't I just set 0em? margin-top: -30px; */
h2 { font-size: 1.5em; font-weight: normal; color: #0678BE; margin-top: 0; margin-bottom: 1em; }
h2.fun { border-bottom: 1px solid #e2e2e2; }
h3 { color: #0678BE; margin-bottom: 1em; }
h4 { color: #0678BE; margin-top: 5px; margin-bottom: .5em; line-height: 1em; }

p { margin-bottom: 1em; }
sub, sup { font-size: 85%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.25em; }
sub { bottom: -0.25em; }

a { color: #000; }

img { max-width: 100%; height: auto; }

header { background-color: #fff; border-bottom: 10px solid #594A41; }

.mainstay { margin: 0 auto; max-width: 1000px; }

.mast {
    margin: 0 auto;
    max-width: 1000px;
    background: white;
}

.canvas {
    margin: 0em auto; /* TODO: .05em is retarded, without it, hline is covered */
    max-width: 1000px;
    background: white;
    border-left: 1px dotted #0678BE;
    border-right: 1px dotted #0678BE;
}

.canvas.last { border-bottom: 1px dotted #0678BE; }

footer {
    margin: .05em auto; /* TODO: .05em is retarded, without it, hline is covered */
    max-width: 1000px;
    font-size: .75em;
    padding: 1em 0;
}
footer .right { text-align: center; }
footer #fnav { width: 100%; }
footer #fright { width: 100%; }
footer #fsocial { width: 100%; }
footer #fcopy { width: 100%; }

.logo { width: 75%; max-width: 300px; }

.content_parent { position: relative; }

.bottom-row { position: relative; bottom: 0px; }

.listcol { float: left; }
.listcol a { display: block; margin: 4px 10px; }

/* ~~~~~ Modifiers ~~~~~ */
.bold { font-weight: bold; }
.italic { font-style: italic; }

.light { color: gray; }

.bg-light { background-color: #f2f2f2; }

.center { text-align: center; }
.right { text-align: right; }
.center-div { display: table; margin: 0 auto; }
.vmiddle { vertical-align: middle; }

.font-med { font-size: 1.25em; }
.small { font-size: .85em; }
.smaller { font-size: .75em; }

.indent { margin-left: 10px; }

.bottom_solid { border-bottom: 1px solid #e2e2e2; }

.indent { margin-left: 10px; }
.pad-0 { padding: 0; }
.pad-1 { padding: 1em; }

.marg-1 { margin: 1em; }
.marg-b-1 { margin-bottom: 1em; }
.marg-b-2 { margin-bottom: 2em; }

.min-250 { min-width: 250px; }

.marg-norm { margin: 1em; } /* media 2em */
.pad-norm { padding: 1em; } /* media 2em */
.pad-larg { padding: 2em; }
.pad-xlarg { padding: 3em; }
.w100 { width: calc(100% - 30px); }

.pad-t-small { padding-top: .5em; }
.pad-r-small { padding-right: .5em; }
.pad-b-small { padding-bottom: .5em; }
.pad-l-small { padding-left: .5em; }
.pad-l-norm { padding-left: 1em; }
.pad-r-norm { padding-right: 1em; }
.pad-t-norm { padding-top: 1em; }
.pad-b-norm { padding-bottom: 1em; }
.pad-t-larg { padding-top: 2em; }
.pad-r-larg { padding-right: 2em; }
.pad-b-larg { padding-bottom: 2em; }
.pad-l-larg { padding-left: 2em; }
.pad-t-xlarg { padding-top: 3em; }
.pad-r-xlarg { padding-right: 3em; }
.pad-b-xlarg { padding-bottom: 3em; }
.pad-l-xlarg { padding-left: 3em; }

.marg-t-small { margin-top: .5em; }
.marg-l-small { margin-left: .5em; }
.marg-r-small { margin-right: .5em; }
.marg-t-norm { margin-top: 1em; }
.marg-r-norm { margin-right: 1em; }
.marg-b-norm { margin-bottom: 1em; }
.marg-l-norm { margin-left: 1em; }
.marg-t-large { margin-top: 1.5em; }
.marg-b-large { margin-bottom: 1.5em; }

.hspace { height: 1em; }

.fleft { float: none; }
.fright { float: none; }

.ellipsis { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.block-ellipsis { display: block; display: -webkit-box; max-width: 100%; height: 43px; margin: 0 auto; font-size: 14px; line-height: 1; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }
/* ~~~~~~~~~~~~~~~~~~~~~ */

/* ~~~~~ Controls ~~~~~ */
.hline { display:block; float:left; background:#c8c8c8; width:100%; height:1px; }
.content { margin-left: 0; }

.table { display: table; width: 100%; }
.table .cell { display: table-cell; }

ul.nomarker {  list-style-type: none; }

.scripture_panel {
    width: 100%;
    background-color: #eff5fd; 
    border: 1px solid #b8d6fb;
    border-radius: 15px;
    -moz-border-radius: 15px;
    padding: 1.5em; }

.scripture_panel h2 { border-bottom: none; }

.navIcon { display: block; float:right; cursor:pointer; position:absolute; top:20px; right:1em; height:46px; font-size:20px; line-height:20px; padding:10px; -webkit-transition: all .2s; transition: all .2s; }
.navIcon .bar { display:block; float:left; background:#0678BE; width:24px; height:3px; margin:3px 0; clear:both; -webkit-transition: margin .2s; transition: margin .2s; border-radius:8px; }

nav { }
nav ul { overflow: auto; list-style-type: none; }
nav li { float: left; padding: 0 20px; }
nav li a { text-decoration: none; color: #0678BE; letter-spacing: 3px; }
nav li a:hover { color: #333; }

#rmenu { display: none; width: 100%; }
#rmenu .container { padding: 1.5em 0 1em 0; }
#rmenu ul { list-style-type: none; padding: 0; margin: 0; background-color: transparent; border: 1px solid #aaaaaa; border-radius: 3px; -moz-border-radius: 3px; }
#rmenu li {  display: inline; white-space: nowrap; }
#rmenu li a { display: block; padding: 10px 15px; background-color: transparent;  border-bottom: 1px dotted #aaaaaa; color: black; text-decoration: none; }
#rmenu li:last-child a { border-bottom: 1px transparent; }
#rmenu li a:hover { background-color: #eeeeee; }

.menu { float: left; display: none; width: 100%; margin: 20px 0 0 0; padding: 0; background-color: transparent; border: 1px solid #aaaaaa; border-radius: 3px; -moz-border-radius: 3px; }
.menu ul { list-style-type: none; padding: 0; margin: 0; }
.menu li {  display: block; white-space: nowrap; }
.menu li a { display: block; padding: 10px 15px; background-color: transparent;  border-bottom: 1px dotted #aaaaaa; color: black; text-decoration: none; }
.menu li:last-child a { border-bottom: 1px transparent; }
.menu li a:hover { background-color: #eeeeee; }

#topnav			    { float:right;  margin:8px 0 0px 0; width:auto; }
#topnav li 		    { list-style-type: none; float:left; display:block;  }
#topnav li a 		{ font-size:0.9em; color:#000; padding:8px 10px;  font-weight:400; text-decoration:none; }
#topnav li a:hover  { text-decoration:none; color:#2fb9e7;   }

.calendar_day { background: #fff; border: 1px solid #808080; border-radius: 2px; display: inline-block; width: 50px; height: 50px; }
.calendar_day .month { background-color: #89c7ff; text-align: center; line-height: 18px; font-size: .8em; color: #ffffff; }
.calendar_day .day { text-align: center; font-size: 1.5em; font-weight: bold; margin-top: -2px; }

/* ~~~~~ Tables Yay! ~~~~~ */
.mtable { display: table; }
.mrow { display: table-row; }
.mcell { display: table-cell; }
.mcell img { display: block; }

/* ~~~~~ Other ~~~~~ */
.inline-list li { display: inline; }

.text_panel { border-bottom: 1px dotted #0678BE; }
.row_alt_odd { background-color: lightblue; }
.row_alt_even { background-color: white; }
/* ~~~~~~~~~~~~~~~~~ */

/* ~~~~~ Mast Heads ~~~~~ */
section .home { background-position: bottom; }
.script_head { max-width: 700px; padding: 2em; background-color: rgba(0, 0, 0, .8); color: white; font-weight: 600; font-size: 1.1em; letter-spacing: 1px; } /*  border-radius: 15px; -moz-border-radius: 15px; */
.script_head h2 { font-size: 1.5em; color: white; margin-bottom: 0; }
.script_head h3 { color: #aaaaaa; font-size: .5em; margin-bottom: 20px; }
.script_head a { color: white; }
/* ~~~~~~~~~~~~~~~~~~~~~~ */

/* ~~~~~ */
#sect-scripture { background-image: url('/images/sky2.jpg'); background-position: bottom; }
#scripture { position: relative; background: rgba(255, 255, 255, .75); min-height: 250px;  }
#scripture-text { font-size: 1em; letter-spacing: .05em; max-height: 200px; padding-right: 1em; overflow-y: scroll; }
#script-nav-btns { display: table; margin: 0 auto; }

/* ~~~~~ Facebook Comments Adjustment ~~~~~ */
#fbcomments, .fb-comments, .fb-comments iframe[style], .fb-comments span { width: 100% !important; }

/* ~~~~~ Blog Cards ~~~~~ */
.card { background-color: #ffffff; margin-bottom: 1.5em; height: 290px; box-shadow: 1px 1px 4px rgba(150,150,150,.5); overflow: hidden!important; border-radius: 3px; }
.card-image { height: 170px; background-position: center; width: 100%; display: inline-block; text-decoration: none; }
.card-head { font-size: 20px; font-weight: bold; text-decoration: none; line-height: 27px; max-height: 54px; display: block; overflow: hidden; }
.card-head:hover { text-decoration: underline; }
.card-footer-fleft { float: left; }
.card-footer-fright { float: right; }
/* ~~~~~~~~~~~~~~~~~~~~~~ */

/* ~~~~~ Blog ~~~~~ */
.blog-head-image { height: 200px; background-position: center; background-size: 100%; background-repeat: no-repeat; }
.bp_row { width: 100%; float: left; }
.bp_col { width: 100%; float: left; }
/* ~~~~~~~~~~~~~~~~ */

.article_scripture { margin: 25px 0 25px 10px; padding: 0 0 2px 20px; border-left: 2px solid #87C7FB; color: #383838; }
.article_scripture .head { font-size: 14px; font-weight: 600; color: #0678BE; margin-bottom: .25em; }
.article_scripture .verse { font-size: 13px; margin-bottom: .5em; }
.article_scripture .verse sup { font-weight: 600; }

.blog figure { display: inline-block; position: relative; padding: .5em; background-color: #f5f5f5; border: 1px solid #DCDCDC; border-radius: 1px; -moz-border-radius: 1px; border-radius: 5px; -moz-border-radius: 5px; margin-bottom: 1em; }
.blog figure img { width: 100%; height: auto; border: 1px solid #9E9E9E; border-radius: 1px; -moz-border-radius: 1px; }
.blog figure .label { position: absolute; background-color: gray; color: white; padding: 2px 7px 2px 7px; font-size: 12px; top: 20px; border-color: #717171; border-style: solid; border-width: 1px 1px 1px 0; }
.blog figcaption { text-align: left; font-size: 13px; font-weight: 600; margin-top: 5px; }
.blog figcaption .foot { display: block; font-size: 12px; font-weight: normal; }

blockquote { font-family: Georgia, serif; font-size: 18px; font-style: italic; margin: 25px; padding: 0.25em 55px; line-height: 1.45; border-left: 4px solid #0678BE; position: relative; color: #383838; }
blockquote:before { display: block; content: "\201C"; font-size: 80px; position: absolute; left: 5px; top: -14px; color: #7a7a7a; }

.author_pic { display: block; margin-bottom: 10px; }
.author_pic img { margin-top: 7px; }
.author_pic img { width: 80px; height: 80px; border-radius: 40px; -webkit-border-radius: 40px; -moz-border-radius: 40px; border: 1px solid #9E9E9E; }
.author_info { display: block; vertical-align: top; }
.author .name { font-size: 14px; font-weight: 600; margin-bottom: 5px; }
.author .short_bio { font-size: 12px; }

/*.icon_link { padding-left: 41px; width: 16px; height: 41px; overflow: hidden; background-size: 21px; background-repeat: no-repeat; background-position: 50% 50%; display: inline-block; margin-bottom: 10px; }*/
.icon_link { padding: 5px 10px 5px 22px; width: inherit; height: inherit; overflow: initial; background-size: 16px; background-repeat: no-repeat; background-position: 0px 50%; display: inline-block; }
.social_share { padding-left: 41px; width: 16px; height: 41px; overflow: hidden; background-size: 21px; background-repeat: no-repeat; background-position: 50% 50%; border-radius: 5px; -moz-border-radius: 4px; border: 1px solid rgba(0, 0, 0, .1); display: inline-block; margin-bottom: 10px; font-size: 12px; font-weight:500; color: #ffffff; text-decoration: none; }

.validation-summary-valid { display: none; }
.validation-summary-errors { padding: 1em; border: 1px solid rgb(255, 73, 73); background-color: rgb(255, 153, 153); color: rgb(190, 5, 5); }
.validation-summary-success { padding: 1em; border: 1px solid rgb(3, 109, 224); background-color: #a8ddfe; color: rgb(4, 9, 217); }

/*#___plusone_0 iframe { margin-top: 5px !important; }*/
/*
234x60 | 320x50 | 320x100 | 468x60 | 728x90
200X200 | 300X250 | 250X250
*/
.adslot_01 { width: 200px; height: 200px; }

.store-badge { padding: 10px; display: inline-block; }

#get_app { display: none; position: fixed; bottom: 0px; width: 100%; background-color: #fff; border-top: 1px solid #808080; }
#get_app h3 { font-size: 21pt; }
#get_app_buttons { position: relative; text-align: center; padding: 40px; padding-bottom: 0; }
#get_app_devices { position: relative; text-align: center; padding: 40px; }
#get_app_devices img { width: 100%; max-width: 300px; margin: 0 auto; }
a.boxclose { float: right; margin-top: -30px; margin-right: -30px; cursor: pointer; color: #fff; border: 1px solid #AEAEAE; border-radius: 30px; background: #605F61; font-size: 31px; font-weight: bold; display: inline-block; line-height: 0px; padding: 11px 3px; }
.boxclose:before { content: "×"; }

.x { position: absolute; right: 0; margin: 10px; width: 25px; height: 25px; border: 2px solid #eef5df; background-color: #ff5248; border-radius: 50%; z-index: 9999; }
.x::before, .x::after { position: absolute; top: 9px; left: 5px; width: 11px; height: 2px; content: ""; background-color: #eef5df; display: block; }
.x::before { -ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }
.x::after { -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); }
.x:hover { cursor: pointer; }
.x:hover::before, .x:hover::after { display: block; }

/*  MEDIA QUERIES ============================================================================= */

@media only screen and (min-width: 360px) {
    .adslot_01 { width: 300px; height: 250px; }
}

@media only screen and (min-width: 500px) {

	.script_head .hspace { display: none; }
    .script_head .fleft { float: left; }
    .script_head .fright { float: right; }

    .content { margin-left: 50px; }
}

@media only screen and (min-width: 520px) {
    .adslot_01 { width: 468px; height: 60px; }
}

@media only screen and (min-width: 550px) {
    footer #fnav { width: 40%; float: left; }
    footer #fright { width: 60%; float: right; }
    /*.icon_link { padding: 5px 10px 5px 22px; width: inherit; height: inherit; overflow: initial; background-size: 16px; background-position: 0px 50%; }*/
    .social_share { padding: 5px 10px 5px 35px; width: inherit; height: inherit; overflow: initial; background-size: 16px; background-position: 10px 50%; }
    #get_app_buttons { float: left; width: 50%; padding: 40px; }
    #get_app_devices { float: right; width: 50%; }
}

@media only screen and (min-width: 700px) {

    .home .mainstay { padding: 2em; }
    .script_head { border-radius: 15px; -moz-border-radius: 15px; }

}

@media only screen and (min-width: 750px) {

    .navIcon { display: none; }

    #rmenu { display: block !important; width: inherit; border: 0; float: right; }
    #rmenu .container { padding: 0; }
    #rmenu ul { border: 0; }
    #rmenu li { display: inline; float: left; }
    #rmenu li a { float: left; border: 1px solid transparent;border-radius: 5px; -moz-border-radius: 5px; }


    .adslot_01 { width: 250px; height: 250px; }

}

@media only screen and (min-width: 880px) {
    
    footer #fnav { width: 30%; }
    footer #fright { width: 70%; }
    footer #fsocial { width: 50%; float: left; }
    footer #fcopy { width: 50%; float: right; }

}


@media only screen and (min-width: 640px) {
	footer .right { text-align: right; }
}

/* e.g. iPad Portrait */
@media screen and (max-width: 1190px) {
    
}

@media screen and (max-width: 320px) {
    .right_content { display: none; }
}

@media screen and (min-width: 600px ) { /* At least this size */
    .left_content { margin-right: 270px; }
    .right_content { position: absolute; top: 1em; right: 1em; width: 250px; } /* TODO: Dumb, absolute causes parent div not to expand vertically,; top and right: 1em is retarded too */
}

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

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

}

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

/* e.g. Smaller tablets and Larger Smartphones */
@media screen and (max-width: 940px) {

    /* header { margin-bottom: -1em; } */
    a#logo { margin:1.2em 0 0.1em 0; background-size:250px; }
    
    /*.navIcon { float:right; display:block; cursor:pointer; position:absolute; top:20px; right:1em; height:46px; font-size:20px; line-height:20px; padding:10px; -webkit-transition: all .2s; transition: all .2s; }
    .navIcon .bar { display:block; float:left; background:#0678BE; width:24px; height:3px; margin:3px 0; clear:both; -webkit-transition: margin .2s; transition: margin .2s; border-radius:8px; }
    */
    .navIconOpen  { /*background:#2fb9e7; color:#fff;*/  }
    .navIconOpen .bar { margin:0; }
    .navIconOpen .bar:first-child { margin:0 0 9px 0; }
    .navIconOpen .bar:last-child { margin:9px 0 0 0; }
		
	#topnav { display:none; float:left; clear:left; width:100%; margin:0; padding:0; }
	#topnav li { width:33%; text-align:center;   }
	#topnav li a { padding: 0em; }
	
}

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

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

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

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

}

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

}

@media screen and (max-width: 760px) {
	#home_intro h1, #home_intro h2 { padding:0 1em; }
}

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

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

}

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

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

/* e.g. Mobiles/iPhone/etc */
@media screen and (max-width: 480px) {	
	
	a#logo	{ width:42px; height:42px; background:url(/images/logo-edward-robertson-small.gif) no-repeat; background-size:100%; margin:1.2em 0; }
}

@media (min-width: 0px) and (max-width: 430px) {
	.h_services a { float:left; margin:0 0 1em 60px; clear:both; font-size:.9em; }
    .s320 {
        display: none;
    }
}

/* e.g. Smaller smartphones */
@media screen and (max-width: 320px) {

}

/* Force Nav and TopNav to show past 931px; */
@media only screen and (min-width: 941px) {
	#show_menu,
	#topnav { display:block !important; }
}