﻿/******************************************************************
768up.css
-------------------------------------------------------------------
Stylesheet: Tablet & Small Desktop
-------------------------------------------------------------------

Here's where you can start getting into the good stuff.
This size will work on iPads, other tablets, and desktops.
So you can start working with more styles, background images,
and other resources. You'll also notice the grid starts to
come into play. Have fun!

******************************************************************/


/* These styles are applied for viewports 768px and higher */
@media only screen and (min-width: 768px) {

#feature_wrapper {width: 33%;}

#page-wrap{ overflow-y: visible; }

/* 2 column layouts - Moves buttons to opposite side for desktop views */
div#col2Content{
float: right;
}

#header-left {
padding: 0 0 0 8px;
height: 71px;
}

.homepage-element-gradient {min-height: 238px;}
#third_col__wrapper {width: 100%;}
#homepage-slide-news-wrapper {width:65.78%;margin-bottom: 5px;}
#homepage-events-wrapper {width: 32.33333%;}
#homepage-glance-wrapper {width: 33.33333%;}
#homepage-happening-wrapper {width: 33.33333%;}

/* 8-14 */
#homepage-slideshow #galleria{
  height: 446px !important;
  min-height: 446px;
}
/* 8-14 */
section.homepage-element{
  margin: 0px 0 8px 0;
  }

  /* Mod 8-14 */
  #homepage-news a.news-img-link {
  margin: 0 2% 0 0;
}
/* Mod 8-14 */
#homepage-news img.news-img { margin: 0 0 0 0; }

/*------------------------------------------------------------------
--> Main Navigation
------------------------------------------------------------------*/

/* --> Main Navigation Container ---------------------------------*/

section#top-nav .nav-row .columns {
padding: 0px;
}


/* --> Main Navigation Title -------------------------------------*/
h4.nav-item.nav-item-1.section-heading { display: none; }


nav.main-nav .name {
display: none;
}

nav.main-nav ul {
width: 100%;
background: none;
}


.nav-inner {
margin: 5px 0;
height: 40PX;
background: #204327;
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJod…EiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top, #204327 1%, #468a40 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#204327), color-stop(100%,#468a40));
background: -webkit-linear-gradient(top, #204327 1%,#468a40 100%);
background: -o-linear-gradient(top, #204327 1%,#468a40 100%);
background: -ms-linear-gradient(top, #204327 1%,#468a40 100%);
background: linear-gradient(to bottom, #204327 1%,#468a40 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#204327', endColorstr='#468a40',GradientType=0 );
border-radius: 6px;
border-top: 1px solid #2a5f1a;
border-right: 1px solid #2a5f1a;
border-left: 1px solid #2a5f1a;
border-bottom: 2px solid #2A5F1A;
}


nav.main-nav ul li.nav-item a{background: transparent;}

/* --> Main Navigation Item --------------------------------------*/

nav.main-nav ul.nav-list > li.nav-item { width: 13.6%; }
nav.main-nav ul.nav-list > li.nav-item-1 { width: 8.6%; }
nav.main-nav ul.nav-list > li.nav-item-2 { width: 15.6%; }
nav.main-nav ul.nav-list > li.nav-item-3 { width: 18.6%; }
nav.main-nav ul.nav-list > li.nav-item-4 { width: 13.6%; }
nav.main-nav ul.nav-list > li.nav-item-5 { width: 13.6%; }
nav.main-nav ul.nav-list > li.nav-item-6 { width: 12.6%; }
nav.main-nav ul.nav-list > li.nav-item-7 { width: 13.6%; }


nav.main-nav ul.nav-list > li.nav-item > a {
padding-left: 0;
text-align: center;
}

nav.main-nav ul.nav-list > li.nav-item > a:hover {
height: 40px;
text-shadow: 0px 0px 6px #fff;

background: #428603; /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzQyODYwMyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iIzM4NzgwMyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUxJSIgc3RvcC1jb2xvcj0iIzRmOGMxMyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM4YWJkMTAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top,  #428603 0%, #387803 50%, #4f8c13 51%, #8abd10 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#428603), color-stop(50%,#387803), color-stop(51%,#4f8c13), color-stop(100%,#8abd10)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #428603 0%,#387803 50%,#4f8c13 51%,#8abd10 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #428603 0%,#387803 50%,#4f8c13 51%,#8abd10 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #428603 0%,#387803 50%,#4f8c13 51%,#8abd10 100%); /* IE10+ */
background: linear-gradient(to bottom,  #428603 0%,#387803 50%,#4f8c13 51%,#8abd10 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#428603', endColorstr='#8abd10',GradientType=0 ); /* IE6-8 */
}

.top-bar-section li a:not(.button){ line-height: 40px; }

/* --> Main Navigation Item Link ---------------------------------*/

nav.main-nav ul li.nav-item > a {
font-size: 12px;
padding-right: 5px !important;
}

/* Dropdown Item Link */
nav.main-nav .dropdown li.nav-item a {
  background-color: #ffffff;
  color: #004869;
  font-size: .725em;
  line-height: 1em;
  padding: 8px 8px;
}
nav.main-nav .dropdown li.nav-item a:hover{
padding-left:15px;
}


/* --> Main Navigation Dropdown Container ------------------------*/

nav.main-nav .dropdown {
width: 200px;

}

/* Has-Dropdown Arrow */
nav.main-nav .has-dropdown > a:after {
display: none;
}

/* Flyout to Left */
.top-bar li.flyout-left .dropdown li .dropdown {
left: -200px;
width: 200px;
}

/* Flyout to Left Link */
.top-bar li.flyout-left .dropdown li.has-dropdown > a {
padding-left: 40px;
padding-right: 15px !important;
}

.top-bar li.flyout-left .dropdown li.has-dropdown > a:hover {
padding-left: 5px;
}
/* 
Flyout Link 
.top-bar .has-dropdown .dropdown li.has-dropdown > a {
background: #333;
}*/

/* Flyout Icon (text arrows) */
.top-bar .has-dropdown .dropdown li.has-dropdown > a:after {
left: 95%;
top: 50%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
border-color: transparent;
border-left-color: #CCC;
border-width:5px;
margin-top: -5px;
display:block; 
}

/* Hide navigation dividers */
nav.main-nav .top-bar-section > ul > .divider {
display: none;
}


/* Side Navigation */
#side-nav.size1 .sf-menu a{ font-size: 1.4em; }

#dynamic-side-btns a.mm-button-link{
	font-size: 2em;
}

#dynamic-side-btns .mm-button-txt-wrap {
  top: 20px;
}

/*------------------------------------------------------------------
--> BreadCrumbs / System Buttons
------------------------------------------------------------------*/

div#fade-crumbs {
width: 100%;
border-radius: 4px;
height: auto;
display: inline-block;
background: #ded4bf; /* Old browsers */
background: -moz-linear-gradient(top,  #ded4bf 0%, #c3b48f 60%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ded4bf), color-stop(60%,#c3b48f)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #ded4bf 0%,#c3b48f 60%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #ded4bf 0%,#c3b48f 60%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #ded4bf 0%,#c3b48f 60%); /* IE10+ */
background: linear-gradient(to bottom,  #ded4bf 0%,#c3b48f 60%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ded4bf', endColorstr='#c3b48f',GradientType=0 ); /* IE6-9 */
}

/* --> Breadcrumbs ----------------------------------------------*/

/* Breadcrumb List */
ul.bcrumb-list {
font-size: 1.0em;
margin: 0;
}

.section#bcrumbs {
height: 27px;
background: #C3B48F;
padding: 0 6px;
}




/* --> System Buttons ----------------------------------------------*/

/* Column that contains the system buttons */
.columns.system-btns-col { padding: 0 8px; }

/* --> System Buttons ----------------------------------------------*/

/* Email, Edit, Print List Container */
ul.system-btns-list {
float: right;
width: auto;
margin: 0;
}

/* System Button Item */
ul.system-btns-list > li {
width: auto;
margin-bottom: 0;
padding: 0;
}

/* System Button Dropdown Menu */
ul.system-menu {
width: 180px;
}

/* System Button Link Text */
ul.system-btns-list > li a.button {
font-size:13px;
}

/* System Button Style */
.button.system-button { width: auto; }

/* Email */
#btn-email { background-position: 5px 1px; }

/* Edit */
#btn-edit { background-position: 5px 2px; }

/* Print */
#btn-print { background-position: 5px 1px; }


/*------------------------------------------------------------------
--> Home Contents
------------------------------------------------------------------*/

/* --> Home Buttons ----------------------------------------------*/

/* Hide separator that appeared below the buttons on the homepage */
#dynamic-home-btns hr.home-btn-sep { display: none; }


/* --> Most Popular ----------------------------------------------*/

/* Most Popular list */
section#home-mostpop ul.az-list {
width: 92%;
padding-left: 8%;
}

/* Most Popular list item link */
section#home-mostpop ul.az-list li a {
font-size: 1.4em;
}


/* --> Events List -----------------------------------------------*/

/* Description for event */
p.events-description {
font-size: 1.3em;
}


/*------------------------------------------------------------------
--> Page Footer
------------------------------------------------------------------*/
/* Mod 8-14 */
footer#page-footer { height: 80px; }
/* Mod 8-14 */
#footer-wrap #links li a { color: #b0e8b2; }

/* --> Footer Navigation -----------------------------------------*/

/* Navigation list */
nav.foot-nav ul.foot-nav-list {
margin-left: 0;
}

/* Navigation list item link */
nav.foot-nav ul.foot-nav-list li a {
font-size: 1.3em;
}



table#footerContacts {
  text-align: center;
  margin-top: 17px;
}

/* Mod 8-14 */
#footer-wrap #links ul li {
border-right: 1px solid #b0e8b2;
width: 21.666%;
float: left;
padding: 0 10px;
text-align: center;
margin: 0 10px;}
}


/* --> Google Translate ------------------------------------------*/

#google_translate_element {
width: 80%;
margin-top: 12px;
}


/* --> Divider (Mobile only)--------------------------------------*/

/* Hide the divider for desktop */
hr.footer-divider { display: none; }


/* --> Powered by Civica -----------------------------------------*/

/* 'Powered by' text */
span.powered-by-civica { margin-left: 54px; }

/* Civica logo */
#civica-foot-logo { margin-left: 52px; }

/*  Photobook Styles  */

.Photosizer{
overflow: hidden;
max-height: 200px;
max-width:250px;
}

.Photosizer img {
display: block;
height: 190px;
margin-left: auto;
margin-right: auto;
margin-top: 10px;
max-height: 210px;
max-width: 250px;
overflow: hidden;
width: 200px;
}

.PhotoBG {
width: 250px;
height: 210px;
}


/*------------------------------------------------------------------
--> Photo Manager and Photo Book Styles
------------------------------------------------------------------*/

#jqGalleryDiv h2{
margin-left: 25%;
}

#image_wrap img{
cursor: default;
padding-bottom: 10px;
margin-left:10px;
}

#image_wrap_g img{
cursor: default;
padding-bottom: 10px;
margin-left:10px;
}

.img-wrap:hover{
cursor:pointer;
}

.img-wrap {
float: left;
height: 100px;
overflow: hidden;
padding: 10px;
width: 100px;
}

#galBackOuter > div {
margin-left: 10px;
margin-top: 20px;
}

}
