body
{
    background-color:	#ffffff;
    margin:             0;
    padding:		    0;
    font-family:		'calibri', 'arial', 'sans';
    font-size:	    	12pt;
    text-align:		    justify;
    color:			    #000000;
    overflow-y:         scroll;
}
.no_ffon body           {margin: 170px 0 0;}

a:link
{
    color:			    #00a090;
    text-decoration:	none;
}
a:visited	            {color: #008060;}
a:hover
{
    color:              #0090a0;
    text-decoration:	underline;
}
a:active	            {color: #00a090;}

img
{
    margin:             0;
    border:             0;
    padding:            0;
}




/*********************/
/* UPPER PAGE LAYOUT */
/*********************/


.yframe
{
    border:		    	0;
    overflow-x:	    	hidden;
    min-height:	    	500px;
}
.no_ffon .yframe
{
    margin:             20px auto;
    width:              1000px;
}
.is_ffon .yframe
{
    margin:             15px 0 0;
    width:              450px;
}

.yhead
{
    padding:            0;
    margin:             0;
    background-color:   #ffffff;    /* necessary to make the div opaque and hide body elements scrolling underneath it */
    display:            grid;
}
.no_ffon .yhead
{
    position:           fixed;
    top:                0;
    margin-left:		0;
    width:              1000px;
    height:			    170px;
    z-index:            50;
    grid-template-columns:  150px auto;
    grid-template-areas:    'hlogo navig'
                            'hlogo phead';
}
.is_ffon .yhead
{
    width:              450px;
    min-height:         170px;
    grid-template-columns:  225px 225px;
    grid-template-areas:    'hlogo navig'
                            'phead phead';
}

.ylogo
{
    grid-area:          hlogo;
    overflow-x:         hidden;
}
.no_ffon .ylogo         {padding-top: 10px;}
.is_ffon .ylogo         {padding-left: 20px;}

.no_ffon #mobilogo      {display: none;}
.is_ffon #homelogo      {display: none;}

.is_ffon .ybody h2, .is_ffon .ybody h3, .is_ffon .ybody p, .is_ffon .ybody ul  {margin: 10px 15px;}


/* HOME LOGO ANIMATION */

.fadelogo {
  animation:            fade_logo ease 1s;
  -webkit-animation:    fade_logo ease 1s;
  -moz-animation:       fade_logo ease 1s;
  -o-animation:         fade_logo ease 1s;
}

@keyframes fade_logo {
  0% {
    opacity:            0;
  }
  100% {
    opacity:            1;
  }
}

@-moz-keyframes fade_logo {
  0% {
    opacity:            0;
  }
  100% {
    opacity:            1;
  }
}

@-webkit-keyframes fade_logo {
  0% {
    opacity:            0;
  }
  100% {
    opacity:            1;
  }
}

@-o-keyframes fade_logo {
  0% {
    opacity:            0;
  }
  100% {
    opacity:            1;
  }
}




/*****************************/
/* NAVIGATION BAR COMPONENTS */
/*****************************/


/* MAIN NAVBAR ELEMENTS */

.ynavbar
{
    grid-area:          navig;
    margin:             0;
    padding:		    0;
    font-family:        'rockwell', 'slab', 'slab-serif', 'cambria', 'times', 'serif';
}
.no_ffon .ynavbar
{
    position:		    relative;
    margin-top:         30px;
    height:			    50px;
    width:              850px;
    border-bottom:      1px solid #c0c0c0;
}
.is_ffon .ynavbar
{
    position:		    relative;
    top:                -5px;
}

/*div.ynavbar a:link	    {color: #00a090;}
div.ynavbar a:visited	{color: #008060;}*/
div.ynavbar a:hover	    {color: #e8f8ff;}
div.ynavbar a:active	{color: #e8f8ff;}

.ynavtab
{
    
    background-color:	#ffffff;
    color:			    #008060;
}
.no_ffon .ynavtab
{
    position:		    absolute;
    top:			    0;
    height:			    50px;
    text-align:		    left;
    font-size:		    18pt;
}
.is_ffon .ynavtab
{
    width:              210px;
    height:			    40px;
    text-align:         right;
    font-size:		    16pt;
}

.ynavtab p
{
    margin-top:         0;
    display:            block;
}
.no_ffon .ynavtab p     {padding-left: 10px;}
.is_ffon .ynavtab p     {padding-right: 10px;}

.ynavtab p:hover
{
    background-color:   #008060;
    color:              #e8f8ff;
}

.ynavtab a
{
    padding:            10px 0;
    display:            block;
    text-decoration:    none;
}

.knnoncurr:hover, .knnoncurr:focus  {background-color:#2020c0;}


/* INDIVIDUAL TAB DETAILS */

.no_ffon #navtab1	/* About */
{
    left:			-10px;
    width:			120px;
}
.no_ffon #navtab2	/* Meetings */
{
    left:			115px;
    width:			170px;
}
.no_ffon #navtab3	/* Audio */
{
    left:			290px;
    width:			120px;
}
.no_ffon #navtab4	/* Contact */
{
    left:			415px;
    width:			140px;
}
.no_ffon #navtab5	/* Unused */
{
    left:			540px;
    width:			120px;
}


/* DROPDOWN MENUS */

.ynavdrop
{
    display:	    	none;
    position:	    	absolute;
    margin-left:        0;
    margin-top:	    	-22px;
    z-index:            52;
    padding:	    	8px 0;
    min-width:	    	300px;
    background-color:	#00a080;
    box-shadow:		    0 8px 16px 0 rgba(0,0,0,0.2);
}

.ynavdrop a, .ynavdrop a:visited
{
    display:		    block;
    padding:		    10px 12px;
    text-align:		    left;
    font-size:		    14pt;
    font-weight:		normal;
    color:			    #e8fff8;
}

.ynavdrop a:hover, .ynavdrop a:active
{
    background-color:   #008060;
    color:			    #e8f8ff;
    text-decoration:	none;
}

.no_ffon .yndropshow    {display: block;}


/* MAIN PAGE TITLE */

.ypagetoptext
{
    grid-area:          phead;
    font-family:        'rockwell', 'slab', 'slab-serif', 'cambria', 'times', 'serif';
    font-size:		    24pt;
    font-weight:		bold;
    color:			    #007070;
}
.is_ffon .ypagetoptext
{
    border-top:         1px solid #c0c0c0;
    padding:            5px 15px;
    text-align:         left;
}




/*******************************************/
/* POST-NAVIGATION-BAR GENERAL PAGE LAYOUT */
/*******************************************/


.ybody
{
    padding:		    0;
}


/* GENERIC PAGE CONTENT */

.no_ffon .heropicture   {width: 1000px;}
.is_ffon .heropicture   {width: 450px;}

h1, h2
{
    font-family:        'rockwell', 'slab', 'slab-serif', 'cambria', 'times', 'serif';
    color:              #008060;
}

.leaderprofile
{
    padding-left:       10px;
    vertical-align:     top;
}


/* AUDIO PLAYERS */

.sermonplayer_outer
{
    margin:             15px 0;
    border:             1px solid #c0c0c0;
    background-color:   #f8f8f8;
    padding-right:      15px;
    display:            grid;
}
.no_ffon .sermonplayer_outer
{
    width:              983px;
    grid-template-columns:  95px 150px 250px auto;
    grid-template-areas:    'number title title title'
                            'number series series series'
                            'number player player player'
                            'number date prch pass'
                            'number note note note';
}
.is_ffon .sermonplayer_outer
{
    width:              433px;
    grid-template-columns:  95px auto;
    grid-template-areas:    'number title'
                            'number series'
                            'number date'
                            'number prch'
                            'number pass'
                            'player player'
                            'note note';
}

.sermonplayer_number
{
    grid-area:          number;
    vertical-align:     top;
    padding-right:      15px;
    font-weight:        lighter;
    font-size:          28pt;
    text-align:         right;
    color:              #006080;
}

.sermonplayer_title
{
    grid-area:          title;
    font-size:          14pt;
    font-weight:        bold;
    font-style:         italic;
    color:              #007070;
}
.is_ffon .sermonplayer_title    {text-align: left;}

.sermonplayer_series    {grid-area: series;}
.sermonplayer_player    {grid-area: player;}
.is_ffon .sermonplayer_player   {margin-bottom: 10px;}

.no_ffon audio          {width: 890px;}
.is_ffon audio          {width: 420px;}

.audiomissing
{
    background-color:   #805050;
    padding:            10px;
    color:              #ffffff;
}
.no_ffon .audiomissing
{
    width:              872px;  /* less than the width of an audio element to allow for padding */
    height:             18px;
}
.is_ffon .audiomissing
{
    width:              400px;
    min-height:         18px;
    margin-bottom:      10px;
}

.sermonplayer_date
{
    grid-area:          date;
    color:              #808080;
}

.sermonplayer_prch
{
    grid-area:          prch;
    text-align:         left;
    color:              #404040;
}

.sermonplayer_pass
{
    grid-area:          pass;
}

.sermonplayer_notes
{
    grid-area:          note;
    font-style:         italic;
    color:              #006080;
}

.no_ffon .sermonplayer_title, .no_ffon .sermonplayer_series, .no_ffon .sermonplayer_date, .no_ffon .sermonplayer_prch, .no_ffon .sermonplayer_pass, .no_ffon .sermonplayer_notes    {padding: 1px 0;}
.is_ffon .sermonplayer_title, .is_ffon .sermonplayer_series, .is_ffon .sermonplayer_date, .is_ffon .sermonplayer_prch, .is_ffon .sermonplayer_pass, .is_ffon .sermonplayer_notes    {padding: 3px 0;}
.is_ffon .sermonplayer_player, .is_ffon .sermonplayer_notes     {padding-left: 15px;}


/* FOOTER WITH COPYRIGHT LINK */

.yfoot
{
    border-top:         1px solid #c0c0c0;
    text-align:		    right;
    color:			    #008060;
}
.no_ffon .yfoot         {height: 50px;}
.is_ffon .yfoot
{
    margin-top:         30px;
    padding-right:      15px;
}

.legal
{
    font-size:		    9pt;
}




/*******************************/
/* OTHER PARAGRAPHS, SPANS ETC */
/*******************************/


.emph                   {font-weight: bold;}