/**********************************************************************************
* 
* � 2020 Ecliptic Technologies, Inc. - All Rights Reserved
* Unauthorized use or reproduction of this product is strictly prohibited by law.
* Website: www.ecliptictech.com
* Email: info@ecliptictech.com
*
* Name: desktop.css
* Description: Additional desktop styles for www.aplaceforhope.center
*
***********************************************************************************/

/* Body
----------------------------------------------------------------------------------*/

body
	{
	}

html, body, form
	{
    height:100%;
    }

#caution-container
	{
    font-size:0.75em;
    }

object, iframe
	{
    margin:0.3125rem 0 1.3125rem;
    }

*:first-child+html embed
	{
    margin:0.3125rem 0 1.3125rem;
    }

* html embed
	{
    margin:0.3125rem 0 1.3125rem;
    }


/* Base text
----------------------------------------------------------------------------------*/

.xtarget:target
	{
    margin-top:-154px;
    padding-top:154px;
    }

h1
	{
	font-size:2.375em;
	}

/*#container-intro h1, #container-intro #content p:first-of-type
	{
    width:54%;
    }*/

.container-intro h1
	{
	font-size:2.5em;
	}

.container-intro #content p:first-of-type
	{
    width:86%;
    margin-left:7%;
    }

blockquote
	{
	margin:0 1.5rem;
	}

pre
	{
    margin-bottom:1.5em;
    }

@media screen and (min-width:1188px)
	{
	body
		{
		line-height:1.5em;
		}
	
	h1
		{
		font-size:2.625em;
		}
	
	/*#container-intro h1, #container-intro #content p:first-of-type
		{
        width:48%;
        }*/

    .container-intro h1
		{
        font-size:3em;
        }

	h2
		{
		font-size:2.125em;
		}

	h3
		{
		font-size:1.375em;
		}

	h4
		{
		font-size:1.25em;
		}
	
	h5
		{
		font-size:1.125em;
		}
	
	h6
		{
		font-size:1.0625em;
		}

	p, ul, ol, time, pre
		{
		font-size:1em;
		}
	
	.container-intro #content p:first-of-type
		{
		width:80%;
        margin-left:10%;
        font-size:1.125em;
        line-height:1.5em;
        }
	}


/* Tables 
----------------------------------------------------------------------------------*/

@media screen and (min-width:1188px)
	{
	table
		{
        margin:0.5rem 0 1.5rem;
        }
	
	table th, table td
		{
		font-size:1em;
		}
	
	table th p, table td p, table td ul, table td ol, table td time
		{
		line-height:1.5em;
		}
	}


/* Images 
----------------------------------------------------------------------------------*/

@media screen and (min-width:1188px)
    {
    img
		{
	    margin-bottom:1.5rem;
        }

    .imageleft, .imagesticky
		{
        margin-right:1.5rem;
        }

    .imageright
		{
        margin-left:1.5rem;
        }

    .imagecenter
		{
	    margin-bottom:1.5rem;
	    }
	
	figcaption
		{
        font-size:1em !important;
        }
    }


/* Container
----------------------------------------------------------------------------------*/

.container-intro, #container
	{
	min-height:100%;
	background-position:center 112px;
	}
	
.container-intro
	{
    background-image:url(/sitegraphics/aplaceforhope-banner.jpg);
    background-size:1946px 380px;
    }

@media screen and (min-width:1188px)
    {
    .container-intro, #container
		{
        background-position:center 134px;
        background-size:auto;
	    }
    }


/* Header
----------------------------------------------------------------------------------*/

#header
	{
	width:100%;
    height:82px/*104px*/;
	margin:0;
	padding:0;
    -moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
    }

#header, #header-supplemental
	{
	padding-left:-moz-calc((100% - 950px) / 2);
    padding-left:-webkit-calc((100% - 950px) / 2);
    padding-left:calc((100% - 950px) / 2);
    padding-right:-moz-calc((100% - 950px) / 2);
    padding-right:-webkit-calc((100% - 950px) / 2);
    padding-right:calc((100% - 950px) / 2);
	}

#organization
	{
    width:auto;
    }

#organization p
	{
	margin:10px 0 0;
	}

/*#organization a
	{
    width:272px;
    height:80px;
	background-image:url(/sitegraphics/aplaceforhope-logo02.png);
    }*/

#header-supplemental
	{
    }

#header-supplemental ul, #phone
	{
    }

#phone
	{
    }

#phone a
	{
    }

#phone a:hover, #phone a:active, #phone a:focus
	{
    }

@media screen and (min-width:1188px)
	{
    #header, #header-supplemental
		{
		padding-left:-moz-calc((100% - 1140px) / 2);
		padding-left:-webkit-calc((100% - 1140px) / 2);
		padding-left:calc((100% - 1140px) / 2);
		padding-right:-moz-calc((100% - 1140px) / 2);
		padding-right:-webkit-calc((100% - 1140px) / 2);
		padding-right:calc((100% - 1140px) / 2);
		}

    #header
        {
        height:104px;
        }

    #organization p
	    {
	    margin:10px 0 0;
	    }

    #organization a
	    {
        width:272px;
        height:80px;
	    background-image:url(/sitegraphics/aplaceforhope-logo02.png);
        }
	}


/* Navigation
----------------------------------------------------------------------------------*/

#nav
	{
	display:block !important;
	position:relative;
	top:auto;
	right:unset;
	left:auto;
	float:right;
	width:auto;
	max-height:unset;
	margin-top:16px/*24px*/;
	border:none;
	overflow:unset;
	z-index:1;
	}

#nav ul
	{
    width:auto;
    font-size:0.875em/*1em*/;
    }

#nav li
	{
    width:auto;
	margin-left:0.6875em/*0.75em*/;
    border-width:0;
    }

#nav li:first-child
	{
    margin-left:0;
    }

@keyframes nav-animation-in
    {
    from
        {
        background-position:center -28px;
        }
    to
        {
        background-position:center top;
        }
    }

@keyframes nav-animation-out
    {
    from
        {
        background-position:center top;
        }
    to
        {
        background-position:center -28px;
        }
    }

#nav a
	{
    display:block;
    padding:32px 0.125rem 0;
    color:#30592d;
    color:var(--primary-color);
	background-image:url(/sitegraphics/aplaceforhope-nav.png);
    background-position:center -28px;
    background-repeat:no-repeat;
	background-size:28px;
    border:none;
    }

#nav a:hover, #nav a:focus
	{
    color:#000;
    background-color:transparent;
	background-position:center top;
	animation:nav-animation-in 0.2s ease alternate;
    }

#nav a:active
	{
    }

#nav-menu-link, #nav-mobile
	{
    display:none;
    }

@media screen and (min-width:1188px)
    {
    #nav
        {
        margin-top:26px/*24px*/;
        }
    
    #nav ul
		{
		font-size:1em/*1.125em*/;
		}
    }


/* Second-level lists 
----------------------------------------------------------------------------------*/

#nav li ul
	{
	display:none;
	width:auto;
	position:absolute;
	left:-999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
	margin:-24px 0 0 120px;
	padding:0 0 0 0;
	list-style:none;
	background:#9fcee6;
	/*background:rgba(77,122,153,0.7);*/
	/*border:2px solid #91d0eb;*/
	/*border-right:1px solid #334d66;
	border-bottom:1px solid #334d66;
	border-left:1px solid #334d66;*/
	z-index:10;
	/*filter:alpha(opacity=90);
	-moz-opacity:0.9;
	-khtml-opacity:0.9;
	opacity:0.9;*/
	}

#nav li ul ul
	{
	margin:-20px 0 0 80%;
	}

#nav li ul li
	{
	float:none;
	margin:0;
	padding:0;
	border:none;
	}
	
#nav li ul li a
	{
	/*background:none;*/
	/*padding:0.4375rem 0.8125rem;
	background:#4d7a99;
	background:rgba(77,122,153,0.9);*/
	/*border:none;*/
	}
	
#nav li ul li a:hover
	{
	/*background:#7999af;
	background:rgba(121,153,175,0.9);*/
	}

#nav li ul li a:active
	{
	}

#nav li:hover, #nav li.sfhover
	{
    position:static;
    /*background:#7999af;
    background:rgba(121,153,175,0.9);*/
    }

#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul
	{
    left:-999em;
    }

#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul /* lists nested under hovered list items */
	{
	left:auto;
	}


/* Sub Navigation
----------------------------------------------------------------------------------*/

#nav-sub
	{
	display:block;
	position:fixed;
	float:left;
	width:100%;
	height:34px;
	margin-top:114px;
	/*background-color:#0c0c0c;*/
	z-index:2;
	}

#nav-sub ul
	{
    /*width:950px;
    margin:0 auto;
    padding:0;
	font-size:0.875em;
    text-transform:uppercase;
    list-style:none;*/
	height:34px;
    padding:0;
    padding-left:-moz-calc((100% - 950px) / 2);
    padding-left:-webkit-calc((100% - 950px) / 2);
    padding-left:calc((100% - 950px) / 2);
    padding-right:-moz-calc((100% - 950px) / 2);
    padding-right:-webkit-calc((100% - 950px) / 2);
    padding-right:calc((100% - 950px) / 2);
    font:400 1em "Montserrat", Arial, Helvetica, sans-serif;
    text-transform:uppercase;
    list-style:none;
    background-color:#c0c0c0;
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
    box-sizing:border-box;
    }

#nav-sub ul::after
	{
	display:block;
	position:absolute;
	left:0;
	content:"";
	width:100%;
	height:8px;
	margin-top:26px;
	z-index:-1;
	-moz-box-shadow:0 0 8px #202020;
	-webkit-box-shadow:0 0 8px #202020;
	box-shadow:0 0 8px #202020;
    }

#nav-sub li
	{
    float:left;
    }

#nav-sub li:first-child
	{
    }

#nav-sub a
	{
    display:block;
    height:28px;
    padding:0.375rem 0.8125rem 0;
    color:#c0c0c0;
	/*background-image:url(/sitegraphics/aplaceforhope-nav.gif);
    background-position:right top;
    background-repeat:no-repeat;*/
    background-color:#0c0c0c;
    border:none;
    }

#nav-sub a:hover, #nav-sub a:focus
	{
    color:#202020;
	background-color:#01669a;
    }

#nav-sub a:active
	{
    }

@media screen and (min-width:1188px)
    {
    #nav-sub ul
		{
        /*width:1200px;
        font-size:1em;*/
		padding-left:-moz-calc((100% - 1100px) / 2);
		padding-left:-webkit-calc((100% - 1100px) / 2);
		padding-left:calc((100% - 1100px) / 2);
		padding-right:-moz-calc((100% - 1100px) / 2);
		padding-right:-webkit-calc((100% - 1100px) / 2);
		padding-right:calc((100% - 1100px) / 2);
        }
    
    #nav-sub a
		{
        height:29px;
        padding-top:0.3125rem;
        }
    }


/* Main background
----------------------------------------------------------------------------------*/

#main
	{
    width:100%;
	margin-top:112px;
    margin-bottom:54px;
    padding-top:2rem;
	padding-bottom:1.5rem;
	padding-left:-moz-calc((100% - 950px) / 2);
    padding-left:-webkit-calc((100% - 950px) / 2);
    padding-left:calc((100% - 950px) / 2);
    padding-right:-moz-calc((100% - 950px) / 2);
    padding-right:-webkit-calc((100% - 950px) / 2);
    padding-right:calc((100% - 950px) / 2);
    }

.container-intro #main
	{
	height:380px;
    margin-bottom:0;
	padding-top:11.5rem/*13rem*/;
	}

#nav-sub + #main
	{
    margin-top:164px;
    }

/* clearfix hack to keep floats from overlapping footer */

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

/* Hides from IE-mac \*/
    
* html .clearfix
	{
    height:1%;
    }

.clearfix
	{
    display:block;
    }

/* End hide from IE-mac */

@media screen and (min-width:1188px)
    {
    #main
		{
        margin-top:134px;
		padding-top:2.5rem;
	    padding-bottom:2rem;
		padding-left:-moz-calc((100% - 1140px) / 2);
		padding-left:-webkit-calc((100% - 1140px) / 2);
		padding-left:calc((100% - 1140px) / 2);
		padding-right:-moz-calc((100% - 1140px) / 2);
		padding-right:-webkit-calc((100% - 1140px) / 2);
		padding-right:calc((100% - 1140px) / 2);
		}
	
	.container-intro #main
		{
		height:500px;
		padding-top:13.5rem/*19rem*/;
		}
    }


/* Content
----------------------------------------------------------------------------------*/

#content
	{
	min-height:180px;
	padding:0.625rem 0 0;
	}

#transitionwelcome .modal-content
	{
    width:auto;
    top:40%;
    max-width:60%;
    }

.video-container
	{
	margin-bottom:1.3125rem;
	}

.content-blocks-3x > li, .content-blocks-3x > li:nth-child(odd), .content-blocks-3x > li:nth-child(even), .content-blocks-4x > li, .content-blocks-4x > li:nth-child(odd), .content-blocks-4x > li:nth-child(even)
	{
    float:left;
    margin-left:2%;
    clear:none;
    }

.content-blocks-3x > li
	{
    width:32%;
    }

.content-blocks-4x > li
	{
    width:23.5%;
    }

.content-blocks-3x > li:nth-child(3n+1), .content-blocks-4x > li:nth-child(4n+1)
	{
    margin-left:0;
    clear:left;
    }

@media screen and (min-width:1188px)
    {
    #content
		{
		/*width:880px;*/
		}
	
	#transitionwelcome .modal-content
        {
        max-width:46%/*40%*/;
        }
	
	.video-container
	    {
        max-width:550px/*880px*/;
        padding-bottom:309px !important/*495px*/; /* 16/9 ratio */
	    }
	
	.video-container iframe, .video-container object, .video-container embed
	    {
        max-height:309px/*495px*/;
	    }
	
	.content-blocks-2x ol, .content-blocks-2x ul, .content-blocks-rows ol, .content-blocks-rows ul, .content-blocks-reversed ol, .content-blocks-reversed ul, .content-blocks-3x ol, .content-blocks-3x ul, .content-blocks-4x ol, .content-blocks-4x ul, .btn-callout, .btn-return
        {
	    font-size:1em;
	    }

    .btn-callout a, .btn-callout-alt a
	    {
        margin-right:1.75rem;
        }

    .btn-return a
	    {
	    margin-left:1.75rem;
        }
	
    .btn-callout span, .btn-callout-alt span
	    {
	    right:-1.75rem;
        }

    .btn-return span
	    {
	    left:-1.75rem;
        }
    }


/* Summary/Item list
--------------------------------------------------------------------------------*/

ul.itemlist, ol.itemlist
	{
    margin:0.3125rem 0 1.3125rem;
    }

/*.itemlist li
	{
    width:30.25%;
    margin:0 2.25% 1.3125rem 0;
    }

.itemlist li a.iteminfo
	{
    height:260px;
    }*/

.itemlist li a.iteminfo span
	{
    width:100%;
    padding:0;
    }

.itemlist li a.iteminfo img
	{
    float:none !important;
    margin:0 auto 0.5rem;
    }

.itemlist strong
	{
    font-size:1em;
    }

.itemlist em
	{
    padding-bottom:1em;
    font-size:0.875em;
    }


/* Lightbox galleries
----------------------------------------------------------------------------------*/

@media screen and (min-width:1188px)
	{
	.gallery-lb
		{
		margin-bottom:1.5rem;
		}
	}


/* Paired galleries
----------------------------------------------------------------------------------*/

@media screen and (min-width:1188px)
	{
    .pairedlist strong
		{
        font-size:1.125em;
        }

    .pairedlist em
		{
        font-size:1em;
        }
	}


/* Events list
----------------------------------------------------------------------------------*/

.nav-events label, .nav-events select
	{
    font-size:0.875em;
    }

.events-list img
	{
    max-width:100px;
    }


/* Google map
----------------------------------------------------------------------------------*/

.map
	{
	float:right;
	width:64%;
	margin:0 0 1.5rem 1.5rem;
	}

/*@media screen and (min-width:1188px)
	{
	}*/


/* Supplemental
----------------------------------------------------------------------------------*/

.supplemental
	{
	width:100%;
    padding-top:3rem;
    padding-bottom:2rem;
    padding-left:-moz-calc((100% - 950px) / 2);
    padding-left:-webkit-calc((100% - 950px) / 2);
    padding-left:calc((100% - 950px) / 2);
    padding-right:-moz-calc((100% - 950px) / 2);
    padding-right:-webkit-calc((100% - 950px) / 2);
    padding-right:calc((100% - 950px) / 2);
	}

.supplemental h2
	{
	font-size:2.375em;
    }

#supplemental-wellness
    {
    background-repeat:no-repeat;
    background-position:center top;
    background-image:url(/sitegraphics/aplaceforhope-intro-wellness.png);
    background-size:648px 280px;
    }

#supplemental-news
	{
    margin-bottom:54px;
    }

@media screen and (min-width:1188px)
    {
    .supplemental
		{
		padding-left:-moz-calc((100% - 1140px) / 2);
		padding-left:-webkit-calc((100% - 1140px) / 2);
		padding-left:calc((100% - 1140px) / 2);
		padding-right:-moz-calc((100% - 1140px) / 2);
		padding-right:-webkit-calc((100% - 1140px) / 2);
		padding-right:calc((100% - 1140px) / 2);
		}
	
	.supplemental h2
		{
		font-size:2.5em;
		}

    #supplemental-wellness
        {
        background-size:auto;
        }
    }


/* Footer
----------------------------------------------------------------------------------*/

#footer
	{
    position:absolute;
	left:0;
	bottom:0;
	width:100%;
	height:54px;
    padding-top:0.75rem;
	padding-left:-moz-calc((100% - 950px) / 2);
    padding-left:-webkit-calc((100% - 950px) / 2);
    padding-left:calc((100% - 950px) / 2);
    padding-right:-moz-calc((100% - 950px) / 2);
    padding-right:-webkit-calc((100% - 950px) / 2);
    padding-right:calc((100% - 950px) / 2);
    -moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
    }

@media screen and (min-width:1188px)
    {
    #footer
		{
		padding-left:-moz-calc((100% - 1140px) / 2);
		padding-left:-webkit-calc((100% - 1140px) / 2);
		padding-left:calc((100% - 1140px) / 2);
		padding-right:-moz-calc((100% - 1140px) / 2);
		padding-right:-webkit-calc((100% - 1140px) / 2);
		padding-right:calc((100% - 1140px) / 2);
		}
    }


/* Forms 
----------------------------------------------------------------------------------*/

.basicform
    {
    width:69%;
    margin:0 0 54px;
    }
	
.simpleform select
	{
	font-size:0.875em;
	}

@media screen and (min-width:1188px)
	{
	.basicform fieldset legend, .basicform-bs fieldset legend
		{
		font-size:2.125em;
		}

	.basicform fieldset ol ol li.noinput, .basicform fieldset ol ul li.noinput
		{
		line-height:1.5em;
		}
		
	.basicform fieldset ol ol li.noinput, .basicform fieldset ol ul li.noinput, .basicform fieldset label, .basicform fieldset .text-nofield, .basicform fieldset .textbox, .basicform fieldset .mediumtextbox, .basicform fieldset .shorttextbox, .basicform fieldset select, .basicform fieldset textarea, .basicform fieldset fieldset legend, .basicform fieldset fieldset.subtextboxes legend, .basicform fieldset fieldset label, .basicform fieldset fieldset.subtextboxes label, .basicform fieldset fieldset.longlist label, .basicform fieldset fieldset.longlist span.checkbox, .basicform fieldset fieldset.longlist span.checkbox label, .basicform fieldset .btn-form, .simpleform label, .simpleform .textbox, .simpleform select, .simpleform textarea, .simpleform .fileupload, .simpleform .btn-form, .basicform-bs fieldset ol ol li.noinput, .basicform-bs fieldset ol ul li.noinput, .basicform-bs fieldset label, .basicform-bs fieldset .form-control, .basicform-bs fieldset fieldset legend, .basicform-bs fieldset fieldset.subtextboxes legend, .basicform-bs fieldset fieldset.longlist label, .basicform-bs fieldset fieldset.longlist span.checkbox, .basicform-bs fieldset fieldset.longlist span.checkbox label, .basicform-bs fieldset .btn-form
		{
		font-size:1em;
		}
	}


/* Horizontal rules
----------------------------------------------------------------------------------*/

.hr
	{
	margin-bottom:1.3125rem;
	}

@media screen and (min-width:1188px)
	{
	.hr
		{
		margin-bottom:1.5rem;
		}
	}