/*////////// box model reset //////////////*/

*,
*::before,
*::after {
  box-sizing: inherit;
}

html {
  box-sizing: border-box;
}

/* /////////HTML5 Boilerplate ///////// */

/*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */

/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html,
button,
input,
select,
textarea {
    color: #2a2b33;
}

html {
    font-size: .9em;
    line-height: 1.0;
    overflow-x : hidden;
    overflow-y: auto;
}

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #2a2b30;
    margin: 1em 0;
    padding: 0;
}

/*
 * Remove the gap between images, videos, audio and canvas and the bottom of
 * their containers: h5bp.com/i/440
 */

audio,
canvas,
img,
video {
    vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

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

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/* ==========================================================================
   Browse Happy prompt
   ========================================================================== */

.browsehappy {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */
a {
   outline: 0;
   text-decoration: none;
   border-bottom: 0px solid #2a2b33;
   color: #666;
}

a.hamburger {
  text-decoration: none !important;
  border-bottom: 0px solid #fff;
}

a.text-title {
   outline: 0;
   text-decoration: none;
   border-bottom: 0px solid #2a2b33;
   color: #fefefe;
   margin: 0px; 
}

span.text-category a {
   outline: 0;
   text-decoration: none;
   border-bottom: 0px solid #2a2b33;
   color: #fefefe; 
}

span.text-category {
   outline: 0;
   text-decoration: none;
   border-bottom: 0px solid #2a2b33;
   color: #fefefe;
   margin: 0px; 
}

/* FONT FACE ------------------------- */


/* Generated by Font Squirrel (http://www.fontsquirrel.com) on August 15, 2012 11:53:05 PM America/New_York */
/*
@font-face {
  font-family: 'CooperHewitt-Heavy';
  src: url('../fonts/CooperHewitt-Heavy.eot');
    src: url('../fonts/CooperHewitt-Heavy.eot?#iefix') format('embedded-opentype'),
         url('../fonts/CooperHewitt-Heavy.woff') format('woff'),
         url('../fonts/CooperHewitt-Heavy.svg#CooperHewitt-Heavy') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
  font-family: 'CooperHewitt-HeavyItalic';
  src: url('../fonts/CooperHewitt-HeavyItalic.eot');
    src: url('../fonts/CooperHewitt-HeavyItalic.eot?#iefix') format('embedded-opentype'),
         url('../fonts/CooperHewitt-HeavyItalic.woff') format('woff'),
         url('../fonts/CooperHewitt-HeavyItalic.svg#CooperHewitt-HeavyItalic') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
  font-family: 'CooperHewitt-Bold';
  src: url('../fonts/CooperHewitt-Bold.eot');
    src: url('../fonts/CooperHewitt-Bold.eot?#iefix') format('embedded-opentype'),
         url('../fonts/CooperHewitt-Bold.woff') format('woff'),
         url('../fonts/CooperHewitt-Bold.svg#CooperHewitt-Bold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
  font-family: 'CooperHewitt-BoldItalic';
  src: url('../fonts/CooperHewitt-BoldItalic.eot');
    src: url('../fonts/CooperHewitt-BoldItalic.eot?#iefix') format('embedded-opentype'),
         url('../fonts/CooperHewitt-BoldItalic.woff') format('woff'),
         url('../fonts/CooperHewitt-BoldItalic.svg#CooperHewitt-BoldItalic') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
  font-family: 'CooperHewitt-Medium';
  src: url('../fonts/CooperHewitt-Medium.eot');
    src: url('../fonts/CooperHewitt-Medium.eot?#iefix') format('embedded-opentype'),
         url('../fonts/CooperHewitt-Medium.woff') format('woff'),
         url('../fonts/CooperHewitt-Medium.svg#CooperHewitt-Medium') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
  font-family: 'CooperHewitt-MediumItalic';
  src: url('../fonts/CooperHewitt-MediumItalic.eot');
    src: url('../fonts/CooperHewitt-MediumItalic.eot?#iefix') format('embedded-opentype'),
         url('../fonts/CooperHewitt-MediumItalic.woff') format('woff'),
         url('../fonts/CooperHewitt-MediumItalic.svg#CooperHewitt-MediumItalic') format('svg');
    font-weight: normal;
    font-style: normal;
}
*/

/* //////////// NOTO SERIF ////////////// */
/* https://www.google.com/fonts#UsePlace:use/Collection:Noto+Serif:400,700,400italic,700italic */
/*

@font-face {
  font-family: 'Noto Serif';
  font-style: normal;
  font-weight: 400;
  src: local('Noto Serif'), local('NotoSerif'), url(https://fonts.gstatic.com/s/notoserif/v4/eCpfeMZI7q4jLksXVRWPQwzyDMXhdD8sAj6OAJTFsBI.woff2) format('woff2');
}
@font-face {
  font-family: 'Noto Serif';
  font-style: normal;
  font-weight: 700;
  src: local('Noto Serif Bold'), local('NotoSerif-Bold'), url(https://fonts.gstatic.com/s/notoserif/v4/lJAvZoKA5NttpPc9yc6lPWaVI6zN22yiurzcBKxPjFE.woff2) format('woff2');
}
@font-face {
  font-family: 'Noto Serif';
  font-style: italic;
  font-weight: 400;
  src: local('Noto Serif Italic'), local('NotoSerif-Italic'), url(https://fonts.gstatic.com/s/notoserif/v4/HQXBIwLHsOJCNEQeX9kNzxampu5_7CjHW5spxoeN3Vs.woff2) format('woff2');
}
@font-face {
  font-family: 'Noto Serif';
  font-style: italic;
  font-weight: 700;
  src: local('Noto Serif Bold Italic'), local('NotoSerif-BoldItalic'), url(https://fonts.gstatic.com/s/notoserif/v4/Wreg0Be4tcFGM2t6VWytvMhHwsiXhsDb0smKjAA7Bek.woff2) format('woff2');
}

@font-face {
  font-family: 'Noto Serif';
  font-style: normal;
  font-weight: 400;
  src: local('Noto Serif'), local('NotoSerif'), url(https://fonts.gstatic.com/s/notoserif/v4/eCpfeMZI7q4jLksXVRWPQ8DdSZkkecOE1hvV7ZHvhyU.ttf) format('truetype');
}
@font-face {
  font-family: 'Noto Serif';
  font-style: normal;
  font-weight: 700;
  src: local('Noto Serif Bold'), local('NotoSerif-Bold'), url(https://fonts.gstatic.com/s/notoserif/v4/lJAvZoKA5NttpPc9yc6lPcBaWKZ57bY3RXgXH6dOjZ0.ttf) format('truetype');
}
@font-face {
  font-family: 'Noto Serif';
  font-style: italic;
  font-weight: 400;
  src: local('Noto Serif Italic'), local('NotoSerif-Italic'), url(https://fonts.gstatic.com/s/notoserif/v4/HQXBIwLHsOJCNEQeX9kNz5S3E-kSBmtLoNJPDtbj2Pk.ttf) format('truetype');
}
@font-face {
  font-family: 'Noto Serif';
  font-style: italic;
  font-weight: 700;
  src: local('Noto Serif Bold Italic'), local('NotoSerif-BoldItalic'), url(https://fonts.gstatic.com/s/notoserif/v4/Wreg0Be4tcFGM2t6VWytvP83cGrqhiQgWmjXfohD0fc.ttf) format('truetype');
}
*/

/* END FONT FACE --------------------- */
 
/* TYPESETTING ----------------------- */ 


h1 {
    position: relative;
    display: inline-block;
    font-weight: 400;
    font-size: 2em;
    /*margin-top: .5em;
    margin-bottom: .5em;*/
    line-height: normal;
    color: #2a2b30;
}


h2 {
    position:relative;
    display: inline;
    font-weight: 400;
    font-size: 2em;
    /*margin-top: 1em;
    margin-bottom: .5em;*/
    line-height: normal;
    color: #2a2b30;
}

/*
h1.fontface {
    font: 32px/34px 'CooperHewitt-Medium', 'Helvetica', 'Verdana', 'sans-serif';letter-spacing: 0.15px; word-spacing: 0px;
}

h2.fontface {
    font: 25px/30px 'CooperHewitt-Medium', 'Helvetica', 'Verdana', 'sans-serif';letter-spacing: 0px; word-spacing: 1px;
    line-height: 24px;
}

h3.fontface {
    font: 22px 'Noto Serif', Times, 'serif'; letter-spacing: 0px; word-spacing: 1px; font-style: italic; font-weight: 400;
    line-height: 30px;
}
*/

.btn {
  display: inline-block;
  background-color: transparent;
  padding: 10px;
  border: 3px solid #373737;
  cursor: pointer;
}

.btn {
  font: 22px 'CooperHewitt-Medium', 'Helvetica', 'sans-serif'; letter-spacing: 0.8px; word-spacing: 2px; font-style: normal; font-weight: 700;
  line-height: 26px;
  color: #373737; /* #f7f7f7; */ /*rgb(16, 75, 147);*/ /*#2a2b30;*/ /*#fbfbfb;*/
  opacity: 1;
  padding: 10px 20px;
}

.btn:hover {
  border-color: #243763;
  color: #243763;
  background-color: rgba(247,247,247, 0.7); /* #f7f7f7; */
}

.btn:focus {
  border-color: #243763;
}

.btn:active {
  border-color: #D44663;
}



.homepage #hero_title h1 {
    position: absolute;
    background-color: transparent;
    color: #2a2b30;
    display: inline-block;
    font-size: 5.5em;
    line-height: 0.0em;
    margin-top: 0.8em;
    left: 0%;
    margin-left: -5000px;
    z-index: 3;
    clear: left;
}


.alt h2 {
  color: #1f1501;
}

.alt h3{
  margin-top: 5px;
  color: #D44663;
}

p {
    /*font-family: 'Noto Serif', 'Helvetica', serif;*/
    font-family: "nimbus-sans","Helvetica","Verdana","sans-serif";
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #2a2b30;
}

p.coral {
  color: #D44663;
}

.body {
    font-family: 'Noto Serif', 'Helvetica', serif;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #353434; /*#2a2b30;*/
}

.bodyBold {
    font-family: 'Noto Serif', 'Helvetica', serif;
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 24px;
    color:  #353434; /*#2a2b30;*/
}

.bodyItalic {
    font-family: 'Noto Serif', 'Helvetica', serif;
    font-style: italic;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #353434; /*#2a2b30;*/
}


.bodyBoldItalic {
    font-family: 'Noto Serif', 'Helvetica', serif;
    font-style: italic;
    font-weight: 700;
    font-size: 16px;
    line-height: 24px;
    color: #353434; /*#2a2b30;*/
}

.reverse {
  color: #fff;
}

.largeBlock {
  font: 28px "nimbus-sans", 'Helvetica', 'Verdana', 'sans-serif'; letter-spacing: normal; word-spacing: 2px; font-style: normal; font-weight: 400;
  line-height: 150%;
  color: #353434; /* #f7f7f7; /*rgb(16, 75, 147);*/ /*#2a2b30;*/ /*#fbfbfb;*/
  opacity: 1;
  padding: 0px 0px;
}

.largeBlock {
  margin-top: 0px;
}


/* /////////////////////// end Typesetting //////////////////// */


html {
  overflow-y: scroll;
}

body, html { /* set size of body to full page and remove margins */
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0 0 15px 0;
    background-color: #F7F7F7; /* #D3D3D3; */
}

a.active {
    outline: none;
}

#wrapper {
    position: relative;
    margin-left:auto;
    margin-right:auto;
}

/* ////////////// Header /////////// */
header {
    position: relative;
    display: block;
    margin: 0 auto;
}


#hero {
    position: relative;
    width: 100%;
    height: auto;
    background-color: #f7f7f7; /* #f7f7f7 transparent */
    padding: 4% 0 4% 0;
    text-align: center;
    margin-bottom: 1%;
    /*background-image:url(../images/MDG_Pattern_01-01.png);*/
    background-repeat: repeat;
}

#hero.homepage img.JSLogo {
    position:relative;
    max-width: 40%;
    background: transparent;
    margin-left: 0%;
    margin-top: 0px;
    opacity: 1;
}

#hideme {
  opacity:1;
}

#hero.homepage img.JSDez_Logo {
    position:relative;
    max-width: 40%;
    background: transparent;
    margin-left: 0%;
    margin-top: 0px;
    opacity: 1;
    display: none;
}


.hundredPer {
  width: 100%; 
  text-align: left; 
  background-color: transparent; 
  height: auto;
  padding: 2.5%;
  padding-bottom: 4%;
  padding-top: 0px;
}

.hundredPer .homepage{
  width: 100%; 
  text-align: left; 
  background-color: transparent; 
  height: auto;
  padding: 2.5%;
  padding-bottom: 0px;
  padding-top: 0px;
}


#topNav {
  width: 100%;
  font-size: 0;
  height: auto;
  text-align: justify;
  text-justify: distribute;
  background-color: #f7f7f7;
  z-index: 4000;
  position: fixed;
  display: inline-block;
  padding-bottom: 10px;
}

#topNav:after {
  content: '';
  display: inline-block;
  width: 100%;
}


/* *************** styles for responsive overlay hamburger menu ************* */

ul {
	margin:0;
	padding:0;
	text-decoration:none;
	list-style:none;
}
li {
	padding:0;
	margin:0;
}
nav {
	text-align:center;
	width:100%;
	position:relative;
	height:auto;
	overflow:hidden;
	background:none;
}
nav ul {
	text-align:center;
}
nav ul li {
	display:inline-block;
}
nav ul li a {
	color:#333;
	display:inline-block;
	padding:1em 3em;
	text-decoration:none;
	border-bottom:0px solid #fff;
	transition-property:all .2s linear 0s;
	-moz-transition:all .2s linear 0s;
	-webkit-transition:all .2s linear 0s;
	-o-transition:all .2s linear 0s;
	font-size:16px;
}
nav ul li a:hover {
	color: #34B484;
}
/*styling open close button*/
/*
.button{
    cursor: pointer;
    background-image: url('../images/icons/hamburger_Open_Menu_Icon_Gry_thin_72by72.png');
    height: 27px;
    width: 36px;
    background-size: 36px 27px;
    background-color: transparent; 
    display: inline;
    z-index: 999;
    position: fixed; 
    top: 10px;
    right: 10px;
	margin-bottom: 0;
	margin-top: 4%;
	margin-right: 2%;
	background-repeat: no-repeat;
	text-align: right;
    vertical-align: center;
}

.button::before {
  content: "MENU";
}

.close-btn{
    background-image: url('../images/icons/hamburger_Close_Menu_Icon_Gry_thin_72by72.png');
    background-color: transparent; 
    width: 28px;
    z-index: 999;
}
*/

.buttonClose {
    cursor: pointer;
    background-image: url('../images/icons/hamburger_Close_Menu_Icon_Gry_thin_72by72.png');
    height: 21px;
    width: 28px;
    background-size: 28px 21px;
    background-color: transparent; /*rgba(247,247,247, 1);*/
    display: block;
    z-index: 999;
    position: relative;
    top: 20px;
    left: 10px;
    margin-bottom: 4%;
    margin-top: 4%;
    margin-left: 4%;
    background-repeat: no-repeat;
}


.buttonClose::after {
  display: inline-block;
  font: 16px "nimbus-sans", 'Helvetica', 'Verdana', 'sans-serif'; letter-spacing: normal; word-spacing: 2px; font-style: normal; font-weight: 400;
  margin-left: 10px;
  margin-top: 8px;
  content: "CLOSE";
  vertical-align: bottom;
}


.buttonTop {
    cursor: pointer;
    background-image: url('../images/icons/hamburger_Open_Menu_Icon_Gry_thin_72by72.png');
    height: 21px;
    width: 28px;
    background-size: 28px 21px;
    background-color: transparent; /*rgba(247,247,247, 1);*/
    display: inline-block;
    z-index: 999;
    position: relative;
    top: 0px;
    right: 10px;
    margin-bottom: 0;
    margin-top: 4%;
    margin-left: 4%;
    background-repeat: no-repeat;
}

.buttonTop::after {
  display: inline-block;
  font: 16px "nimbus-sans", 'Helvetica', 'Verdana', 'sans-serif'; letter-spacing: normal; word-spacing: 2px; font-style: normal; font-weight: 400;
  margin-left: 40px;
  margin-top: 8px;
  content: "MENU";
  vertical-align: bottom;
}

.logoTop {
  cursor: pointer;
  background-image: url('../images/logos/JSD_icon_logo_thin_213by61.png');
  height: 24px;
  width: 77px;
  background-size: 77px 24px;
  background-color: transparent; /*rgba(247,247,247, 1);*/
  display: inline-block;
  z-index: 999;
  position: relative;
  top: 0px;
  right: 0px;
  margin-bottom: 0;
  margin-top: 4%;
  margin-left: 0%;
  background-repeat: no-repeat;
  opacity: 0;
}

.contactTop {
  cursor: pointer;
  background-image: url('../images/icons/topContact_Envelope_Icon_Thin_Gry_68by41.png');
  height: 24px;
  width: 38px;
  background-size: 38px 24px;
  background-color: transparent; /*rgba(247,247,247, 1);*/
  display: inline-block;
  z-index: 999;
  position: relative;
  left: 10px;
    margin-bottom: 0.7%;
    margin-top: 4%;
    margin-right: 4%;
  background-repeat: no-repeat;
}

.close-btn{
    background-image: url('../../images/icons/hamburger_Close_Menu_Icon_Gry_thin_72by72.png');
    background-color: transparent; /*rgba(247,247,247, 1);*/
    height: 21px;
    width: 28px;
}





/* -----------------------------
*/


.open{
    top: 0;
}

.close {
	top: -1500px;
}


/*
.button {
	display:inline;
	position:absolute;
	right: 0; *//* 50px; */
	/*top: 0; */ /* 6px; */
	/*z-index:999;
	font-size:30px;
	padding: 2rem 2rem 2rem;
	margin-bottom: 0;
}


.open, .close {width:36px;height:auto;}
*/


.button a {
	text-decoration:none;
}

.btn-open {
	background-image: url("../images/icons/hamburger_Menu_Icon_Gry_thick_72by72.png") 
	width: 36px;
}

.btn-close {
	background-image: url ("../images/icons/hamburger_Close_Menu_Icon_Gry_thick_72px.png")
	width: 36px;
}

.btn-open:after {
	background-image: url ("../images/icons/hamburger_Menu_Icon_Gry_thick_72by72.png") 
	width: 36px;
	/*
	color:#333;
	content:"\f0c9";
	font-family:"FontAwesome";
	transition-property:all .2s linear 0s;
	-moz-transition:all .2s linear 0s;
	-webkit-transition:all .2s linear 0s;
	-o-transition:all .2s linear 0s;
	*/
}
.btn-open:hover:after {
	color: #34B484;
}
.btn-close:after {
	background-image: url ("../images/icons/hamburger_Close_Menu_Icon_Gry_thick_72px.png")
	width: 36px;
	/*
	color:#fff;
	content:"\f00d";
	font-family:"FontAwesome";
	*/
	transition-property:all .2s linear 0s;
	-moz-transition:all .2s linear 0s;
	-webkit-transition:all .2s linear 0s;
	-o-transition:all .2s linear 0s;
}
.btn-close:hover:after {
	color: #34B484;
}
/*overlay*/
.overlay {
	display:none;
	position:fixed;
	top:0;
	height:100%;
	width:100%;

	background: rgba(52,52,52,0.8); /* rgba(212,70,99, 0.7); */ /* rgba(15,53,101,0.3); */ /*#5C7A99; blue*/ /* rgba(220,220,220,1); */ /* rgba(247,247,247, 0.9);*/ /* #D44663; */ /* #fefefe;*/ /*#333;*/
	overflow:auto;
	z-index:4000;
	text-align: center;
}

.wrap {
	display:none;
	position: relative;
	color: #353434; /*#e9e9e9;*/
	background: rgb(247,247,247);  /*#f7f7f7; is same as rgb(247,247,247) */ /*#fefefe;*/
	text-align:center;
	max-width:90%;
	max-height: 90%;
	margin:0 auto;
	margin-top: 100px;
	border: 0px solid #353434;
}
.wrap ul.wrap-nav {
	border-bottom:0px solid #575757;
	text-transform:capitalize;
	padding:2em 3em;

	text-align: center;
}

.wrap ul.wrap-nav li {
	display: inline-block;
	vertical-align:top;
	width:24%;
	position:relative;
	text-align: center;
}

.wrap ul.wrap-nav li a {
	font-family: "nimbus-sans", 'Helvetica', 'Verdana', 'sans-serif';
	font-style: normal;
	font-weight: 400;
	font-size: 40px;
	color: #353434;
	letter-spacing: 1px; 
	word-spacing: 2px;
	display:block;
	padding:8px 0;
	text-decoration:none;
  text-transform: uppercase;
	transition-property:all .2s linear 0s;
	-moz-transition:all .2s linear 0s;
	-webkit-transition:all .2s linear 0s;
	-o-transition:all .2s linear 0s;
}
 .wrap ul.wrap-nav li a:hover,
 	.wrap ul.wrap-nav li a:focus {
	color: #D44663; /* rgb(15,53,101); blue */ /*#f0f0f0;*/
}
.wrap ul.wrap-nav ul {
	padding:20px 0;
}
.wrap ul.wrap-nav ul li {
	display:block;
	font-size:20px;
	width:100%;
	color:#353434;
}
.wrap ul.wrap-nav ul li a {
	color:#353434;
}
.wrap ul.wrap-nav ul li a:hover {
	color:#D44663;
}



/* *************** END styles for responsive overlay hamburger menu ************* */



/* /////////////////////////////// TOP MENU FOR PHONE //////////////////// */

/* hide all additions for phone versions */

/*
#midNav {
    display:none;
}

#top-menu-Phone{
    display: none;
}

#hamburger {
    display:none;
}

#right-panel {
    display: none;
}

#right-panel.panel {
    display: none;
}
*/

#hamburger {
    display: block;
    float: right;
    margin-top: -3%;
    margin-right: 4%;
    width: 20%; /* 40px; */
    height: 10%; /*40px; */
    background: transparent; /* rgba(255,255,255, 0.5); */ /* #2b2c33;  #44984D; */
    border: transparent; /* 4px solid rgba(255,255,255, 0.3); */
    z-index: 10000;
    text-align: right;
}

#hamburger-text {

	font-family: "nimbus-sans", 'Helvetica', 'Verdana', 'sans-serif';
	font-style: normal;
	font-weight: 400;
	font-size: 16px;
	color: #353434;
	letter-spacing: 1px; 
	word-spacing: 2px;
	bottom: -7px;


	/* font: 14px 'CooperHewitt-Medium', 'Helvetica', 'Verdana', 'sans-serif';letter-spacing: 2px; word-spacing: 2px; font-style: normal; font-weight: 500; */
/*

	14px 'CooperHewitt-Medium', 'Helvetica', 'sans-serif'; letter-spacing: 0.4px; word-spacing: 2px; font-style: normal; font-weight: 500;

	
	line-height: 26px;*/
	/*color: #666;*/  /*#2a2b30; */ /* #373737; */ /* #f7f7f7; */ /*rgb(16, 75, 147);*/ /*#2a2b30;*/ /*#fbfbfb;*/
	opacity: 1;
	padding: 0 10px 0 0;
}

#hamburger img {
	vertical-align: bottom;
	margin-bottom: 2px;
	width: 36px;
	margin-left: 0px; 
	margin-top: 0px;
}

#hamburgerMenu {
	display: inline-block;
	
}

#right-panel {
    display: none;
}
.panel {
      display: none;
      width: auto;
      padding-right: 0px;
        background:  rgba(255,255,255, 1); /*#44984D; */
        border: 4px solid rgba(255,255,255, 0.3);
      /* background-color: #2a2b33; */ /* #44984D; */
      color: #fff;
      z-index: -9999;
      /*box-shadow: inset 0 0 5px 5px #222;*/
}

#close-panel-bt {
    position: relative;
    top: 0px;
    left: 12px;
    margin-bottom: 20px;
    width: 40px;
    height: 40px;
    text-align: center;
    background:  rgba(255,255,255, 0.5); /*#44984D; */
    border: 4px solid rgba(255,255,255, 0.3);
    z-index: 10000;
}

#close-panel-bt img:hover {
    cursor: pointer;
}

#close-panel-bt img {
   
    padding-right: 4px;
    padding-bottom: 4px; 
}

/* ///////////////////////////////////////////////////////////////////////// */


/* ///////////////////////////////////////////////////////////////////////// */
#top-menu-Phone{
    position: relative;
    display: block;
    top: 10px;
    right: 0;
    z-index: 10100;
    width: 100%;
}

#top-menu-Phone,
#top-menu-Phone ul,
#top-menu-Phone li,
#top-menu-Phone a {
  margin: 0;
  padding: 0;
  border: 0;
  list-style: none;
  font-weight: normal;
  text-decoration: none;
  line-height: 1;
  font-family:'CooperHewitt-Medium','Helvetica', 'sans-serif';
  font-size: 1em;
  position: relative;
}




#top-menu-Phone a {
  line-height: 1.3;
}


#top-menu-Phone > ul > li > a {
  padding-right: 40px;
  font-size: 1em;
  font-weight: bold;
  display: block;
  background: transparent;
  color: #2a2b33; /* #ffffff; */
  border-bottom: 0px solid #fff;
  border-top: 1px solid #fff;
  text-transform: uppercase;
  position: relative;
}

#top-menu-Phone > ul > li:last-child > a {
   border-bottom: 1px solid #fff; 
}

#top-menu-Phone > ul > li > a > span {
  background: transparent;
  padding: 10px;
  display: block;
  font-size: 1em;
  font-weight: 400;
  letter-spacing: 1px;
}

#top-menu-Phone > ul > li > a:hover{
    text-decoration: none;
    background: #E9E9E9; /* #44984D; #2a2b33; #296DC1; #74A3DC;*/
    border-bottom: 4px solid #D44663;
}

#top-menu-Phone > ul > li > a:focus{
    text-decoration: none;
    background: #E9E9E9; /* #44984D; #2a2b33; #296DC1; #74A3DC;*/
    border-bottom: 4px solid #D44663;
}


#top-menu-Phone > ul > li.active {
  /* border-bottom: none; */
    border-bottom: 4px solid #D44663;
  background: #E9E9E9; /* #44984D; #2a2b33; #296DC1; #74A3DC;*/
}


#top-menu-Phone > ul > li.active > a {
  color: #2a2b33; /* #fff; */
  padding-bottom: 5px;
}

#top-menu-Phone > ul > li.active > a:hover {
  border-bottom: none;
}

#top-menu-Phone > ul > li.active > a:focus {
  border-bottom: none;
}

#top-menu-Phone > ul > li.active > a span {
  /*background: #fff;
  color: #104B93;*/
  padding-bottom: 2px;
}

#top-menu-Phone span.cnt {
  position: absolute;
  top: 0px;
  right: 0px;
  padding: 10px;
  margin: 0;
}

#top-menu-Phone ul ul {
  display: none;
}

#top-menu-Phone ul ul li {
  border: 0px solid #e0e0e0;
  border-top: 1px solid #e0e0e0;
  background: #fff;
}


#top-menu-Phone ul ul a {
  padding: 10px;
  margin-left: 20px;
  display: block;
  color: #104B93;
  background:transparent;
  font-size: 0.8em;
}

#top-menu-Phone ul ul a:hover,
#top-menu-Phone ul ul a.active {
  background: transparent;
  color: #104B93;
  font-size: 1em;
}


#top-menu-Phone ul ul li.odd {
  background: #fff;
}

#top-menu-Phone ul ul li.even {
  background: #fff;
}

.sectionHeadline {
	margin: 3% 0;
	text-align: center;
}

h2.sectionHeadline {
	font-family: "nimbus-sans", 'Helvetica', 'Verdana', 'sans-serif';
	font-style: normal;
	font-weight: 400;
	font-size: 26px;
	color: #353434; /* #d44663; */
	letter-spacing: 1px; 
	word-spacing: 2px;
}

h2.sectionHeadline a {
  color: #353434;
}


/* ////////////// Portfolio Grid and Filters ////////////// */

.container { 
	position: relative;
	margin: 10px auto; 
	-webkit-transition: all 1s ease;
  	-moz-transition: all 1s ease;
  	-o-transition: all 1s ease;
  	transition: all 1s ease;	
}


/* ///////////////////////////////////////////////////////// */



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

.container {
    padding: 2rem;
    padding-top: 0.5rem;
    text-align: justify;
    font-size: 16px;
}


.container:after {
    content: '';
    display: inline-block;
    width: 100%;
}

/* Target Elements
---------------------------------------------------------------------- */

.mix,
.gap {
    display: inline-block;
    vertical-align: top;
}

.mix {
    background: transparent; /* #fff; */
    border-top: 0rem solid currentColor;
    border-radius: 2px;
    margin-bottom: 1rem;
    position: relative;
}

/*
.mix:before {
    content: '';
    display: inline-block;
    padding-top: 15%; */ /*56.25%;*/
/*
}

.mix.green {
    color: #91e6c7;
}

.mix.pink {
    color: #d595aa;
}

.mix.blue {
    color: #5ecdde;
}
*/


/* ////////////////  sort menu   ////////////////////////// */



/* *************
nav {
	text-align:center;
	width:100%;
	position:relative;
	height:auto;
	overflow:hidden;
	background:none;
}

nav ul {
	text-align:center;
}

nav ul li {
	display:inline-block;
}
nav ul li a {
	color:#333;
	display:inline-block;
	padding:1em 3em;
	text-decoration:none;
	border-bottom:2px solid #fff;
	transition-property:all .2s linear 0s;
	-moz-transition:all .2s linear 0s;
	-webkit-transition:all .2s linear 0s;
	-o-transition:all .2s linear 0s;
	font-size:16px;
}

******* */

.hundredPerCenterSort {
	width: 100%;
	text-align: center;
	position:relative;
	height:auto;
	overflow:hidden;
}
 
/*
#filters {
	 margin:1%; 
	padding:1rem;
	padding-bottom: 0;
	width: 100%;
	list-style:none;
	text-align:center;
	}
*/

.hundredPerCenterSort ul {
	text-align:center;
}


/*
#filters ul {
	display: inline-block;
    list-style-type: none;
    text-align:center; 
    position: relative;
    
    margin-left: auto;
    margin-right: auto;
    
}
*/

.hundredPerCenterSort ul li {
	display:inline-block;
	cursor: pointer;
	margin-right: 2.5em;
}


/*

#filters li {
	display:inline-block;
	}

#filters li {
	display:inline-block;
	float:left;
	padding: 3px 15px;
	margin-bottom: 15px;
	}
	
#filters li span {
	display: block;
	padding:0; */ /*3px 15px;*/
/*	cursor: pointer;
	
    margin-bottom: 0;
	}
*/

.hundredPerCenterSort ul li a {
	color: #353434;
	display:inline-block;
	padding:1em 1em;
	text-decoration:none;
	font-family: "nimbus-sans", 'Helvetica', 'Verdana', 'sans-serif';
	border-bottom:0px solid #fff;
	font-size:16px;
	transition-property:all .2s linear 0s;
	-moz-transition:all .2s linear 0s;
	-webkit-transition:all .2s linear 0s;
	-o-transition:all .2s linear 0s;
}


/*
.hundredPerCenterSort a:hover {
	border-bottom:  3px solid #D44663;
	padding-bottom: 1px;
}
*/

/*

#filters li span a {
	color:#353434;
	display:inline-block;
	padding:1em 3em;
	text-decoration:none;
	font-family: "nimbus-sans", 'Helvetica', 'Verdana', 'sans-serif';
	border-bottom:0px solid #fff;
	transition-property:all .2s linear 0s;
	-moz-transition:all .2s linear 0s;
	-webkit-transition:all .2s linear 0s;
	-o-transition:all .2s linear 0s;
	font-size:16px;
	}
*/

/*
#filters li span a {
	color:#353434; 		
	text-decoration: none;
	font-family: "nimbus-sans", 'Helvetica', 'Verdana', 'sans-serif';
	font-style: normal;
	font-weight: 400;
	font-size: 16px;
	letter-spacing: 2px; 
	word-spacing: 2px;
*/
	/*
	font: 14px 'CooperHewitt-Medium', 'Helvetica', 'Verdana', 'sans-serif';letter-spacing: 2px; word-spacing: 1px; 
	font-weight: 500;
    line-height: 13px;
    
}*/


.hundredPerCenterSort ul li a:hover {
	color: #D44663;
    /*border-bottom: 2px solid #353434;
    padding-bottom: 2px;*/
    

}


/*	
#filters li span.active {
	background: transparent; 
	color: #353434; 
	border-bottom: 3px solid #D44663;
}


#filters li span.filter:hover {
	background: transparent;
	color: #353434;
	border-bottom: 3px solid #353434;
}
*/



/* #1f1501; */ /*#e95a44; *//* #1f1501;*/ /* #fff; */
/*
.filter a:active{
	color: #353434;
}
*/


.mixitup-control-active {
	background: transparent;
    color: #353434;
    border-bottom: 2px solid #D44663;
    margin-bottom: 2px;
}

/*
.control:hover {
	background: transparent;
    color: #353434;
    border-bottom: 3px solid #353434;
    margin-bottom: -3px;
}
*/
/*
.mixitup-control-active:hover {
	background: transparent;
    color: #353434;
    border-bottom: 3px solid #353434;
    margin-bottom: -3px;
}
*/

/*
.filter:hover {
	background: transparent;
	color: #353434;
	border-bottom: 3px solid #353434;
    margin-bottom: -3px;
}
*/
/*
.filter a:hover {
	background: transparent;
	color: #353434;
	border-bottom: 3px solid #666;
    margin-bottom: 0;
}
*/
/* Controls
---------------------------------------------------------------------- */
/*
.controls {
    padding: 1rem;
    background: #333;
    font-size: 0.1px;
}


.control {
    position: relative;
    display: inline-block;
    width: 2.7rem;
    height: 2.7rem;
    background: #444;
    cursor: pointer;
    font-size: 0.1px;
    color: white;
    transition: background 150ms;
}

.control:hover {
    background: #3f3f3f;
}

.control[data-filter]:after {
    content: '';
    position: absolute;
    width: 10px;
    height: 10px;
    top: calc(50% - 6px);
    left: calc(50% - 6px);
    border: 2px solid currentColor;
    border-radius: 2px;
    background: currentColor;
    transition: background-color 150ms, border-color 150ms;
}

.control[data-sort]:after {
    content: '';
    position: absolute;
    width: 10px;
    height: 10px;
    border-top: 2px solid;
    border-left: 2px solid;
    top: calc(50% - 6px);
    left: calc(50% - 6px);
    transform:  translateY(1px) rotate(45deg);
}

.control[data-sort*=":desc"]:after {
    transform:  translateY(-4px) rotate(-135deg);
}

.mixitup-control-active {
    background: transparent;
    color: #353434;
    border-bottom: 3px solid #D44663;
    margin-bottom: -3px;
}

.mixitup-control-active[data-filter]:after {
    background: transparent;
}

.control:first-of-type {
    border-radius: 3px 0 0 3px;
}

.control:last-of-type {
    border-radius: 0 3px 3px 0;
}

.control[data-filter] + .control[data-sort] {
    margin-left: .75rem;
}

.control[data-filter=".green"] {
    color: #91e6c7;
}

.control[data-filter=".blue"] {
    color: #5ecdde;
}

.control[data-filter=".pink"] {
    color: #d595aa;
}

.control[data-filter="none"] {
    color: #2f2f2f;
}

*/





/* ////////////	*/
#portfoliolist {
	margin-top: 1%;
}

.portfolio .mix {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	width:100%;
	margin:1%;
	display:none;  
	float:left;
	overflow:hidden;
}
/* //////////// 
#portfoliolist .portfolio {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	width:100%;
	margin:1%;
	display:none;
	float:left;
	overflow:hidden;
}
   //////// */

.portfolio-wrapper {
	overflow:hidden;
	position: relative !important;
	background: transparent; /*rgba(0,51,102,1);*/
	cursor:pointer;
	width: 100%;
	}

.portfolio img {
	width:100%;
	position: relative;
	top:0;
    -webkit-transition: all 600ms cubic-bezier(0.645, 0.045, 0.355, 1);
    transition:         all 600ms cubic-bezier(0.645, 0.045, 0.355, 1);		
	}

.portfolio .label {
	position: absolute;
	width: 100%;
	height:100%;
	bottom:-100%;
	padding: 15px;
    -webkit-transition: all 300ms cubic-bezier(0.645, 0.045, 0.355, 1);
    transition:         all 300ms cubic-bezier(0.645, 0.045, 0.355, 1);
}

.portfolio .label-bg {
	background: rgba(0,51,102, 0.6); /*rgba(247,247,247,0.8);*/ /*rgba(35,34,34,0.6);*/ /* rgba(0,51,102, 0.6); *//* #e95a44; */
	width: 100%;
	height:100%;
	position: absolute;
	top:0;
	left:0;
	z-index:500;
	}

.portfolio .label-text {
	color:rgba(247,247,247,1); /*#fefefe;*/
	position: relative;
	z-index:500;
	padding: 0; /*10px;*/ /*10px 5px;*/
	text-decoration: none;
	font-family: "nimbus-sans", 'Helvetica', 'Verdana', 'sans-serif';
	font-style: normal;
	font-weight: 400;
	font-size: 22px;
	/*color: #353434;*/
	letter-spacing: 1px; 
	word-spacing: 2px;
	/*
	font: 16px 'CooperHewitt-Medium', 'Helvetica', 'Verdana', 'sans-serif';letter-spacing: 1.5px; word-spacing: 2px; 
	font-weight: 500;
	*/
    line-height: 100%;
    text-align: left;
	}

.readMoreIcon {
    cursor: pointer;
    background-image: url('../images/icons/readMoreIcon_Wht_72by72.png');
    height: 28px;
    width: 28px;
    background-size: 28px 28px;
    background-color: transparent; /*rgba(247,247,247, 1);*/
    display: block;
    position: absolute;
    bottom: 4%;
    left: 4%;
    z-index: 501;
    background-repeat: no-repeat;
}


.readMoreIcon::after {
  display: inline-block;
  font: 16px "nimbus-sans", 'Helvetica', 'Verdana', 'sans-serif'; letter-spacing: normal; word-spacing: 2px; font-style: normal; font-weight: 400; color: #fefefe;
  margin-left: 35px;
  margin-top: 14px;
  content: "MORE";
  z-index: 510;
  vertical-align: bottom;
}

.caseStudyIcon {
    cursor: pointer;
    background-image: url('../images/icons/readMoreIcon_Wht_72by72.png');
    height: 28px;
    /*width: 28px;*/
    background-size: contain; /*28px 28px;*/
    background-color: transparent; /*rgba(247,247,247, 1);*/
    display: block;
    position: absolute;
    bottom: 4%;
    left: 4%;
    z-index: 501;
    background-repeat: no-repeat;
}

.caseStudyIcon::after {
  display: inline-block;
  font: 16px "nimbus-sans", 'Helvetica', 'Verdana', 'sans-serif'; letter-spacing: normal; word-spacing: 2px; font-style: normal; font-weight: 400; color: #fefefe;
  margin-left: 35px;
  margin-top: 14px;
  content: "CASE STUDY";
  z-index: 510;
  vertical-align: bottom;
}
/*
.label-text {
	padding: 10px 5px;
}
*/
	
.portfolio .text-category {
	color:rgba(247,247,247,1); /*#fefefe;*/
	display: block;
	z-index:500;
	margin-top: 7px;
	text-decoration: none;
	font-family: "nimbus-sans", 'Helvetica', 'Verdana', 'sans-serif';
	font-style: normal;
	font-weight: 400;
	font-size: 15px;
	/*color: #353434;*/
	letter-spacing: 1px; 
	word-spacing: 2px;
	/*
	font-size:12px;
	font-weight: 700;
	*/
	}

.portfolio:hover .label {
	bottom:0px;
	}
	
.portfolio:hover img {
    top:0px; /* -30 px; */
  }



/* feature pages
---------------------------------------------------------------------- */


.main {
  background:transparent;
  color:#353434;
  margin:0 4% ;
  margin-bottom: 25px;
  position: relative;
  display: inline-block;
}

.mainSpacer {
  margin-bottom: 6%;
}

.main .hundredPer {
    max-width: 100%;
    margin:0 auto;
    position: relative;
    display: inline-block;
    margin-bottom: 2%;
}

.main-center-60 {
    width:60%;
    /*max-width: 720px;*/
    position: relative;
    display: block;
    margin-left: 20%;
    margin-bottom: 10%;
    text-align: left;
}

.banner {
    margin-bottom: 4%;
    margin-top: 10%;
}

.banner img {
    margin-bottom: 4%;
}


/* ////////////////////////
.main-right-50 {
    width:47%;
    margin: 0%;
    margin-left: 0%;
    position: relative;
    display: block;
    float: left;
}

.main-left-50 {
    width:47%;
    margin: 0%;
    margin-right: 5%;
    position: relative;
    display: block;
    float: left;
}
.main-left-30 {
    width:30%;
    margin: 0%;
    margin-right: 5%;
    position: relative;
    display: block;
    float: left;
  }

.main-right-65 {
    width:65%;
    margin: 0%;
    margin-left: 0%;
    position: relative;
    display: block;
    float: left;
  }

  .main-right-30 {
    width:30%;
    margin: 0%;
    margin-left: 0%;
    margin-right: 0;
    position: relative;
    display: block;
    float: left;
  }

.main-left-65 {
    width:65%;
    margin: 0%;
    margin-left: 0%;
    margin-right: 5%;
    position: relative;
    display: block;
    float: left;
  }
//////////////////////////// */

  .main-2up {
    width:47%;
    /*max-width: 720px;*/
    margin: 0%;
    margin-right: 6%;
    position: relative;
    display: block;
    float: left;
  }

  .main-2up:last-child {
    margin-right: 0;

  }

  .main-3up {
    width:30%;
    /*max-width: 720px;*/
    margin: 0%;
    margin-right: 5%;
    position: relative;
    display: block;
    float: left;
  }

  .main-3up:last-child {
    margin-right: 0;

  }

  .main img {
    width:100%;
  }


  .blurb {
    padding-left:0; /* 10% */
  }

  .shadow {
    box-shadow: 1px 1px 3px rgba(0,0,0,0.2), inset 0 -1px 1px rgba(0,0,0,0.1);
  }

  .main-right-50 {
      width:45%;
      margin: 0%;
      margin-left: 0%;
      position: relative;
      display: block;
      float: left;
  }

  .main-left-50 {
      width:45%;
      margin: 0%;
      margin-left: 0%;
      position: relative;
      display: block;
      float: left;
  }  

.main-right-50 img,
.main-left-50 img {
  width: 90%;
}

.main-right-50 img {
  margin-left: 5%;
}

.main-left-50 img {
  margin-left: 13%;
}


.main-left-30 {
    width:30%;
    margin: 0%;
    position: relative;
    display: block;
    float: left;
  }

.main-right-65 {
    width:60%;
    margin: 0%;
    margin-left: 5%;
    position: relative;
    display: block;
    float: left;
  }

.main-right-30 {
    width:30%;
    margin: 0%;
    margin-left: 0%;
    margin-right: 0;
    position: relative;
    display: block;
    float: left;
  }

.main-left-65 {
    width:60%;
    margin: 0%;
    margin-left: 0%;
    margin-right: 5%;
    position: relative;
    display: block;
    float: left;
  }
  
  
/* About page
--------------------------------------------------------------------- */
/*
.main-left-65.pullQuote {
  width: 80%;
  margin-top: 0;
}

.pullQuote p {
  margin-left: 0;
  padding-top: 0;
}

.main-left-65.about {
  width: 60%;
  margin-top: 0;
  margin-right: 10%;
}
*/
/* Contact page
--------------------------------------------------------------------- */

.formBG {
  margin: 0 auto;
  max-width: 800px;
}

#contactform {
}

.form-group {
  margin-top: -4%;
  margin-left: 4%;
}

.input-group {
  text-align: left;
}

.input-group-addon {
  visibility: hidden;
}

.description {
  padding: 10px 0px;
  font-size: 0.8em;
  font-family: "nimbus-sans", 'Helvetica', 'Verdana', 'sans-serif';
  line-height: 1em;
  float: left;
  margin-top: -15%;
}

input[type=text], input[type=email], textarea {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  display: flex;
  background-color: #fefefe;
  border: none;
  border-bottom: 1px solid #2a2b33;
  box-shadow: none;
  margin: 0;
  padding: 10px 15px;
  font-size: 1.15em;
  font-family: "nimbus-sans", 'Helvetica', 'Verdana', 'sans-serif';
  line-height: 1.3em;
  border-radius: 0;
   -webkit-border-radius: none;
}

.form-control {
  width: 90%;
  color: #2a2b33;
}

textarea {
  width: 90%;
  min-height: 365px;
  margin: 0;
  margin-bottom: 5%;
  padding: 0;
  resize: vertical;
  border-radius: 0;
  -webkit-border-radius: none;
  }

textarea.form-control {
  width: 90%;
  color: #2a2b33;
  padding: 10px 15px;
  resize: vertical;
  border-radius: 0;
  -webkit-border-radius: none;
}

/* input fields itself if there is placeholder text in place
////////////////////////////////*/

input:placeholder-shown {
  background-color: #fbecec; /*#fee4e4;*/
}

/* text inside input fields
////////////////////////////////*/

input::placeholder {
  color: #ababab;
  opacity: 1;
  letter-spacing: 0.5px;
  font-weight: normal; 
}

textarea:placeholder-shown {
  border-bottom: 1px solid #2a2b33;
  background-color: #fbecec; /*#fee4e4;*/
}

textarea::placeholder {
  color: #ababab;
  opacity: 1;
  letter-spacing: 0.5px;
  font-weight: normal;
}

#sendMessage {
  padding: 10px 15px;
  border-radius: 0;
  -webkit-border-radius: none;
  background-color: #CB1F34; /*#9B172B;*/ /*#bc2e1b;*/ /*#cc3333;*/ /*#D44663;*/
  border: none;
  color: #fefefe;
  font-size: 1.15em;
  font-family: "nimbus-sans", 'Helvetica', 'Verdana', 'sans-serif';
  line-height: 1.3em;
  float: left;
}

#sendMessage:hover {
  padding: 9px 14px;
  margin-bottom: 2px;
  background-color: #9B172B; /*#bc1b1b;*/ /*#fbecec; #fee4e4;*/
  color: #fefefe; /*#983348;*/ /*#cc3333;*/ /*#ff6cb1;*/
}

.pencil {
  width: 100%;
  margin-right: 0;
  margin-left: -6%;
  margin-bottom: 5%;
}



/* Confirmation page
---------------------------------------------------------------------- */

a.backHome {
  padding: 10px 15px;
  margin: 0;
  margin-top: 8%;
  border-radius: 0;
  -webkit-border-radius: none;
  background-color: #CB1F34; /*#cc3333;*/ /*#D44663;*/
  border: none;
  color: #fefefe;
  font-size: 1.15em;
  font-family: "nimbus-sans", 'Helvetica', 'Verdana', 'sans-serif';
  float: left;
}

a.backHome.confirm {
  margin-top: 3%;
}

a.backhome :hover  {
  color: #cc3333;
  background-color: #fefefe; /*#cc3333;*/
  border: 1px solid #cc3333;
} 

.formBG p {
  font-family: "nimbus-sans", 'Helvetica', 'Verdana', 'sans-serif';
  text-align: left;
  float: left;
}

h2.confirm {
  /*font-family: "nimbus-sans", 'Helvetica', 'Verdana', 'sans-serif';*/
  font-size: 1.5em;
  color: #0F3565; font-family: 'Noto Serif', 'Helvetica', serif;
  font-style: italic;
  float: left;
}

.formBG p {
  font-family: "nimbus-sans", 'Helvetica', 'Verdana', 'sans-serif';
  text-align: left;
  line-height: 1.35em;
  float: left;          
}

img.checkmark {
  width: 75%;
  margin-left: 0;
  margin-right: 0%;
  margin-left: -5%;
  margin-right: 5%;
  padding-bottom: 0;
}



/* About page
---------------------------------------------------------------------- */
/*
.pullQuote {
  text-align: left; 
  margin-left: 15%; 
  width: 45%; 
  padding-top: 2.5%;
}
*/

.pullQuote p{
  text-align: left;
  margin-left: 15%; 
  padding-top: 2.5%; 
  font-size: 2.5em; 
  font-weight: 500; 
  line-height: 1.4em; 
  color: #0F3565; 
  font-family: 'Noto Serif', 'Helvetica', serif;
  font-style: italic;
}
 /* @media screen and (min-width: 468px) {font-size: 1.35em; line-height: 1.25em;} */


.main-left-65 img.largeDLquotes {
  margin-top: -15%; 
  margin-left: 1%; 
  padding-right: 2%; 
  width: 15%; 
 /* @media screen and (min-width: 468px) {width: 5%;}*/
}

.main-right-30 img.JSportrait  {
  margin-left: -5%;
  margin-top: -15%;
  width: 100%;
}


/* About page revisit 18/02/27 //////////////////////////// */
/* --------------------------------------------------------------------- */
/*
.main-left-65.pullQuote {
  width: 80%;
  margin-top: 0;
}

.pullQuote p {
  margin-left: 0;
  padding-top: 0;
}

.main-left-65.about {
  width: 60%;
  margin-top: 0;
  margin-right: 10%;
}
*/

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



footer {
  background:transparent;
  color:#353434;
  margin:0;
}

footer .hundredPer {
    /*max-width:1200px;*/
    max-width: 100%;
    margin:0 auto;
    /*display:flex;
    justify-content:space-between;*/

}

footer .footer-logo {
      width:20%;
  }
    
footer img.miniLogo{
        padding:30px 20px 10px 20px;
        max-width:100%;
      }

/* ///////////////// */


footer .footer-contact {
      width:20%%;
    }

footer .footer-navigation {
      width:20%;
  }

footer .footer-links-holder {
    width: 33.33333%;
    position: relative;
    float: left;
    margin: 0;
	}

footer .footer-links-holder h3 {
  	display: none;
  }
        
footer .footer-links {
  margin:0;
  padding:0;
  list-style:none;
  -webkit-transition: max-height .5s;
  transition: max-height .5s;
}

footer .bottom-bar {
    position:relative;:1719
    text-align:center;
    font-size:.8em;
    text-transform:uppercase;
    background:transparent;
    padding:15px 0;
  }

/* Social Icons */
.social {
  text-align: center;
}
.social a {
  display: inline-block;
  padding: 7px;
  width: 35px;
  height: 35px;
  margin: 0 2px;
  background: transparent;
  vertical-align: middle;
}
.social a:hover {
  background: rgba(15,53,101, 0.3);
  fill: #fefefe;
}
.social a.linkedin {
  padding: 4px;
}
.social a svg .facebook, .social a svg .twitter, .social a svg .linkedin {
  fill: rgba(247,247,247,0.5); /*#353434; */
}


/* Typography */
footer a {
  	font-family: "nimbus-sans", 'Helvetica', 'Verdana', 'sans-serif';
	font-style: normal;
	font-weight: 400;
	font-size: 16px;
	color: #353434;
	letter-spacing: 1px; 
	word-spacing: 2px;
	display:block;
	padding:8px 0;
	text-decoration:none;
	transition-property:all .2s linear 0s;
	-moz-transition:all .2s linear 0s;
	-webkit-transition:all .2s linear 0s;
	-o-transition:all .2s linear 0s;
}

footer a:hover,
	footer a:focus {
  	color: #D44663;
}

footer h3 {
	font-family: "nimbus-sans", 'Helvetica', 'Verdana', 'sans-serif';
	font-style: normal;
	font-weight: 400;
	font-size: 16px;
	color: #D44663; /*#353434;*/
	letter-spacing: 1px; 
	word-spacing: 2px;
	margin-bottom: 0;
}



footer p, footer li {
  font-weight: 400;
  text-transform: none; /* lowercase;  uppercase;*/
  letter-spacing: 0.05em;
  margin: 10px 0;
}


/* Misc CSS */
.clearfix {
  &:before,
  &:after {
      content: '\0020';
      display: block;
      overflow: hidden;
      visibility: hidden;
      width: 0;
      height: 0;
      clear: both;
  }
}

* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}



/* //////////////////////////////////////////////////////////////////// */
/* Grid Breakpoints ////////////////////////////////////////////////// */
/* //////////////////////////////////////////////////////////////////// */

.mix,
	.gap {
	    width: calc(100%/1 - (((1 - 1) * 1rem) / 1));
	}


	h2.sectionHeadline {
	    	font-size: 16px;
	    }

	#hero.homepage img.JSLogo {
		max-width: 82%;
		margin-top: 18%;
	}

	#hero.homepage img.JSDez_Logo {
		max-width: 70%;
	}
	
	.wrap {
		width: 60%;
	}

	.wrap ul.wrap-nav li {
		display: block;
		width: 100%;
	}

	.wrap ul.wrap-nav li a  {
		font-size: 20px;
	}

	.hundredPerCenterSort ul li {
		margin-right: 0.25em;
	}

	.hundredPerCenterSort ul li a {
		margin-right: 0px;
	}

	.hundredPerCenterSort ul li a:hover {

	}

  .buttonTop {
    height: 15px;
    width: 20px;
    background-size: 20px 15px;
    margin-left: 8%;
  }

  .buttonTop::after {
    margin-top: 4px;
    font-size: 13px;
    margin-left: 27px;
  }

	.buttonClose {
    height: 15px;
    width: 20px;
    background-size: 20px 15px;
    margin-left: 2%;
    margin-top:2%;
  }

  .buttonClose::after {
    margin-top: 4px;
    font-size: 13px;
    margin-left: 27px;
  }

  .contactTop {
    height: 15px;
    width: 24px;
    background-size: 24px 15px;
    margin-right: 8%;
    margin-bottom: 1.5%;
  }

  .logoTop {
    background-image: url('../images/logos/JSD_icon_logo_thin_213by61.png');
    height: 15px;
    width: 48px;
    background-size: 48px 15px;
    margin-bottom: 1.5%;
    margin-top: 2%;
    margin-left: 0%;
  }

  .close-btn {
    height: 15px;
    width: 20px;
    background-size: 20px 15px;
  }


.main-center-60 {
    width:100%;
    /*max-width: 720px;*/
    position: relative;
    display: block;
    margin-left: 0%;
    margin-bottom: 0%;
    text-align: left;
}

.banner {
    margin-bottom: 0%;
    margin-top: 10%;
}

.banner img {
    margin-bottom: 0%;
}


  .main-right-30.blurb {
    display: none;
  }

/* /////////// removed Feb 22 2018 see below for update
  .main-right-50, .main-left-50, .main-left-30, .main-right-65, .main-right-30, .main-left-65 {
      width: 90%;
      margin: 10% 10%;
      text-align: center;
    }
 */

/* /////////// update Feb 22 2018 /see below for update//// */
 .main-right-50, .main-left-50, .main-left-30, .main-right-65, .main-right-30, .main-left-65 {   
    width: 100%;
    margin: 10% 5%;
    text-align: center;
 }
 
  .hundredPer.confirmed {
    margin-bottom: 0;
  }
  
  .main-left-50.confirmed {
    margin: 0 0 0 3%;
  }
  
  .main-right-50.confirmed {
    margin: 4% 0 10% 6%;
  }
  
.main-right-50 img,
.main-left-50 img {
  width: 100%;
}

/*
.main-left-65 {
  margin-left:0;
}
*/

.pencil img {
  width:90%;
}

.blurb h2 {
  font-size: 1.35em;
  font-weight: 500;
  line-height: 1.35em;
}

.blurb h3 {
  font-size: 1.2em;
  font-weight: 500;
}

.blurb {
    text-align: left;
    margin-left: 0;
  }

  .blurb p {
    font-size: 16px;
  }
  
  .main-right-50 img {
    margin:0;
    margin-left:-10%;
    padding: 0;
  }
  
  .main-left-50 img {
    margin:0;
    margin-left:-10%;
    padding: 0;
  }
  
  .pencil img {
    margin:0;
    margin-left:0;
    padding: 0;
  }
  
  
  img.checkmark {
    width: 60%;
  }
  
  .main-right-30 img {
      width:60%;
      margin-left:15%;
    }

  .main-left-30 img {
    width:60%;
    margin-left:0%;
  }

  .small.main-left-30 {
    margin-left:6%;
  }

  .small.main-right-30 {
    margin-left:0%;
  }

  .main-right-65 img {
    width:100%;
    margin-left:0%;
  }

  .main-left-65 img {
    width:100%;
    margin-left:0%;
  }
  
  
  /* About page
--------------------------------------------------------------------- */
.main-left-50.pullQuote.about,
.main-right-50.about {
  width: 100%;
  margin: 0;
  text-align: left;
}

.pullQuote p {
  margin: 0;
  padding-top: 0;
}

p.about {
  text-align: left;
}

/*
 .main-left-50.about {
  width: 80%;
  margin: 0 0 0 10%;
}
*/



  /* ///// adjustment Feb 22 2018 for full width images on iPhone portrait */
.main.clearfix {
  margin:0 0 0 15%;
  width: 70%;
}

	footer .hundredPer .footer-logo {
	    width: 100%;
	    text-align: center;
  	}

	 footer img.miniLogo {
	 	max-width: 30%;
	 	padding: 20px 0;
	 }

	footer .hundredPer .footer-contact {
	    width: 100%;
	    text-align: center;
	  }

    footer .hundredPer .footer-contact a {
    line-height: 24px;
  }

	  footer .hundredPer .footer-navigation {
	  	width: 100%;
	  }
	  footer .hundredPer .footer-navigation .footer-links-holder {
	    width: 100%;
	    text-align: center;
	    padding: 0;
	    display: inline-block;
	  }
	  footer .hundredPer .footer-navigation .footer-links-holder h3 {
	    display: block;
	    margin: 0;
	    padding: 10px 20px;
	    border-top: #353434 1px solid;
      border-bottom: #353434 1px solid;
	    cursor: pointer;
	    width: 100%;
	    text-align: center;
	    /* Down Arrows */
	  }

    footer .hundredPer .footer-navigation .footer-links-holder.active h3 {
      border-bottom: none;
    }

	  footer .hundredPer .footer-navigation .footer-links-holder h3::after {
	    float: right;
	    margin-right: 10px;
	    content: "";
	    display: inline-block;
	    vertical-align: middle;
	    margin-top: 7px;
	    width: 7px;
	    height: 7px;
	    border-top: 2px solid #353434;
	    border-right: 2px solid #353434;
	    -moz-transform: rotate(135deg);
	    -ms-transform: rotate(135deg);
	    -webkit-transform: rotate(135deg);
	    transform: rotate(135deg);
	    -webkit-transition: transform .5s;
	    transition: transform .5s;
	  }

	  footer .hundredPer .footer-navigation .footer-links-holder .footer-links {
	    max-height: 0;
	    overflow: hidden;
	    padding: 0 0 15px 0px;
	    border-bottom: 1px solid #353434;
      margin-right: 25px;
	  }
	  footer .hundredPer .footer-navigation .footer-links-holder.active h3::after {
	    -moz-transform: rotate(-45deg);
	    -ms-transform: rotate(-45deg);
	    -webkit-transform: rotate(-45deg);
	    transform: rotate(-45deg);
	  }
	  footer .hundredPer .footer-navigation .footer-links-holder.active .footer-links {
	    max-height: 10000px;
      width: 100%;
      border-bottom: 1px solid #353434;
	  }

  footer li {
    margin: 10px 20px 0 0;
  }

  footer .bottom-bar {
  	width: 100%;
  	text-align: center;
  }

  .description {
    padding: 10px 0px;
    font-size: 1em;
    font-family: "nimbus-sans", 'Helvetica', 'Verdana', 'sans-serif';
    line-height: 1.3em;
    margin-left: 15px;
  }

  h2.confirm {
  /*font-family: "nimbus-sans", 'Helvetica', 'Verdana', 'sans-serif';*/
  font-size: 1.15em;
  color: #0F3565; font-family: 'Noto Serif', 'Helvetica', serif;
  font-style: italic;
  }

}

/* 2 Columns for phone landscape */
@media screen and (min-height: 202px) {
    .mix,
	.gap {
	    width: calc(100%/2 - (((2 - 1) * 1rem) / 2));
	}
}



/* 2 Columns for phone landscape addn'l */
@media screen and (min-width: 468px) {
	.mix,
	.gap {
	    width: calc(100%/2 - (((2 - 1) * 1rem) / 2));
	}


	h2.sectionHeadline {
	    	font-size: 18px;
	    }

	#hero.homepage img.JSLogo {
		max-width: 70%;
		margin-top: 10%;
	}

	#hero.homepage img.JSDez_Logo {
		max-width: 70%;
	}

	.buttonTop {
		height: 15px;
    width: 20px;
    background-size: 20px 15px;
    margin-left: 6%;
	}

  .buttonTop::after {
    margin-top: 4px;
    font-size: 13px;
    margin-left: 27px;
  }

  .contactTop {
    height: 15px;
    width: 24px;
    background-size: 24px 15px;
    margin-bottom: 1.25%;
    margin-right: 6%;
  }

  .logoTop {
    background-image: url('../images/logos/JS_logoTop_325x19.png');
    height: 24px;
    width: 250px;
    background-size: 250px 24px;
    margin-bottom: 0%;
    margin-top: 2%;
    margin-left: 0%;
  }


.buttonClose {
    height: 15px;
    width: 20px;
    background-size: 20px 15px;
    margin-left: 2%;
  }

  .buttonClose::after {
    margin-top: 4px;
    font-size: 13px;
    margin-left: 27px;
  }

	.close-btn {
		height: 15px;
    	width: 20px;
    	background-size: 20px 15px;
	}
	
	.wrap {
		width: 60%;
    margin-top: 50px;
	}

	.wrap ul.wrap-nav li {
		display: block;
		width: 100%;
	}

	.wrap ul.wrap-nav li a  {
		font-size: 25px; /* 30px; */
	}

	.hundredPerCenterSort ul li {
		margin-right: 0.25em;
	}

	.hundredPerCenterSort ul li a {
		margin-right: 0px;
	}

  .banner.main-center-60 {
    width: 80%;
    margin: 0 10%;
  }

  .blurb {
    padding-left:10%;
    padding-right: 10%;
  }

  .main-left-65.blurb {
    width: 100%;
  }

  .shadow {
    box-shadow: 1px 1px 3px rgba(0,0,0,0.2), inset 0 -1px 1px rgba(0,0,0,0.1);
  }
  
  /* /////////// update Feb 22 2018  //// */
 .main-right-50, .main-left-50, .main-left-30, .main-right-65, .main-right-30, .main-left-65 {   
    width: 80%;
    margin: 0% 10%;
    text-align: left;
 } 

  .main-right-50 {
      margin-left: 17%;
      margin-bottom: 10%;
      position: relative;
      display: block;
      float: left;
  }
  
  /* 
      width:47%;
      margin: 0%; */

  .main-left-50 {
      margin-left: 17%;
      margin-bottom: 10%;
      position: relative;
      display: block;
      float: left;
  }
 
 /*
 .main-left-50.contact {
      margin-left: 17%;
      margin-bottom: 10%;
      position: relative;
      display: block;
      float: left;
  }
  */
  /* 
      width:47%;
      margin: 0%; */ 

 

  
  
  .form-group .main-left-50,
  .main-right-50 {
    margin-left: 10%;
  }

  .main-left-50.contact {
      width:47%;
      margin: 0%;
      margin-left: 6%;
      position: relative;
      display: block;
      float: left;
  }
  
 /* ////////////////////////////
  */  
 /* ////////////////////////////
  */  
 /* ////////////////////////////
  */
 .main-left-50.confirmed {
      width:47%;
      margin: 0%;
      margin-left: 2%;
      position: relative;
      display: block;
      float: left;
  }
  
  .main-right-50.confirmed {
      width:47%;
      margin: 0%;
      margin-left: 4%;
      position: relative;
      display: block;
      float: left;
}
  
/* ////////////////////////////
  */  
 /* ////////////////////////////
  */  
 /* ////////////////////////////
  */

  .main-left-30 {
      width:30%;
      margin: 0%;
      position: relative;
      display: block;
      float: left;
    }

  .main-right-65 {
      width:60%;
      /*max-width: 1080px;*/
      margin: 0%;
      margin-left: 0%;
      position: relative;
      display: block;
      float: left;
    }

  .main-right-30 {
      width:30%;
      /*max-width: 720px;*/
      margin: 0%;
      margin-left: 0%;
      margin-right: 0;
      position: relative;
      display: block;
      float: left;
    }

  .main-left-65 {
      width:60%;
      /*max-width: 1080px;*/
      margin: 0%;
      margin-left: 0%;
      margin-right: 5%;
      position: relative;
      display: block;
      float: left;
    }


  
  .main-right-30 img {
      width:80%;
      margin-left:5%;
    }

  .main-left-30 img {
    width:80%;
    margin-left:0%;
  }

  .small.main-left-30 {
    margin-left:3%;
  }

  .small.main-right-30 {
    margin-left:5%;
  }

  .main-right-65 img {
    width:100%;
    margin-left:6%;
  }

  .main-left-65 img {
    width:100%;
    margin-left:5%;
  }
  
.main-right-50 img,
.main-left-50 img {
  width: 100%;
}

.main-left-50 img {
  width: 100%;
  margin-top: 4%;
}

.main-right-50 img {
  margin:0;
  margin-left:0;
  padding: 0;
}

img.checkmark {
    width: 90%;
    margin-left: 5%;
    margin-right: 0%;
    /* margin-left: -5%;
    margin-right: 5%; */
    padding-bottom: 0;
}

.pencil img {
  width: 100%;
  margin-left: 6%;
}
  /* CONTACT PAGE SETTINGS ////////////////////////
  */
  
  

.form-control,
.input-group,
textarea.form-control {
  width: 100%;
  color: #2a2b33;
}

  .description {
    display: none;
  }


  h2.confirm {
    font-size: 1.25em;
    margin-right: 4%;
    color: #0F3565; font-family: 'Noto Serif', 'Helvetica', serif;
    font-style: italic;
  }

  p.confirm {
    font-size: 1.15em;
    line-height: 1.3em;
    margin-right: 4%;
  }




	footer .hundredPer .footer-logo {
	    display: inline-block;
	    min-width: 140px;
	    width: 30%; /* 100%; */
	    text-align: left; /*center;*/
	    float: left;
  	}

	footer img.miniLogo {
		margin-left: 6%;
    max-width: 50%;
    padding: 20px 0;

	}

	footer .hundredPer .social{
    display: inline-block;
    width: 100%; /* 100%; */
    text-align: left;
    margin-left: 0;
	}



	footer .hundredPer .footer-contact {
    display: inline-block;
    min-width: 173px;
    width: 37%; /* 100%; */
    text-align: left;
    float: left;
  }

  footer .hundredPer .footer-contact a {
    line-height: 24px;
    padding-top: 0;
  }

  footer .hundredPer .footer-navigation {
    min-width: 140px;
    width: 30%; /* 100%; */
    text-align: left;
    float: left;
    margin-left: 15px;
  }
  
  footer .hundredPer .footer-navigation .footer-links-holder h3 {
    display: none;
    margin: 0;
    padding: 20px 0;
    border-top: none; /* #000 1px solid;*/
    border-bottom: 1px solid #353434;
    cursor: pointer;
    width: 100%;
    text-align: left;
  }

  footer .hundredPer .footer-navigation .footer-links-holder .footer-links {
    display: inline;
    max-height: 0;
    overflow: hidden;
    text-align: center;
    padding: 0 0 5px 0px;
    border-bottom: 1px solid #353434;
    margin-right: 25px;
  }


    footer .hundredPer .footer-navigation .footer-links-holder.active .footer-links {
      max-height: 10000px;
      width: 100%;
      border-bottom: 1px solid #353434;
    }


footer .hundredPer .footer-navigation .footer-links-holder .footer-links li {
    margin: 10px 20px 0 0; /* margin: 4px 0;*/
  }

  footer .hundredPer .footer-navigation .footer-links-holder .footer-links li:first-of-type {
    margin: 10px 20px 0 0; /*margin: 0;*/
  }
}






/* 2 Columns for bad footer */
@media screen and (max-width: 555px) {

  footer .hundredPer .footer-logo {
      width: 100%;
      text-align: center;
    }

   footer img.miniLogo {
    max-width: 30%;
    padding: 20px 0;
    margin-left: 0;
   }

   footer .hundredPer .social{
    display: inline-block;
    width: 100%; /* 100%; */
    text-align: center;
    margin-left: 0;
  }

  footer .hundredPer .footer-contact {
      width: 100%;
      text-align: center;
    }

 /* footer .hundredPer .footer-contact h3 {
      margin-top: 0;
    } */


    footer .hundredPer .footer-navigation {
      width: 100%;
      margin-left: 0;
      margin-right:15px;
    }
    footer .hundredPer .footer-navigation .footer-links-holder {
      width: 100%;
      text-align: center;
      padding: 0;
      display: inline-block;
    }
    footer .hundredPer .footer-navigation .footer-links-holder h3 {
      display: block;
      margin: 0;
      padding: 10px 20px;
      border-top: #000 1px solid;
      cursor: pointer;
      width: 100%;
      text-align: center;
      /* Down Arrows */
    }
    footer .hundredPer .footer-navigation .footer-links-holder h3::after {
      float: right;
      margin-right: 10px;
      content: "";
      display: inline-block;
      vertical-align: middle;
      margin-top: 7px;
      width: 7px;
      height: 7px;
      border-top: 2px solid #353434;
      border-right: 2px solid #353434;
      -moz-transform: rotate(135deg);
      -ms-transform: rotate(135deg);
      -webkit-transform: rotate(135deg);
      transform: rotate(135deg);
      -webkit-transition: transform .5s;
      transition: transform .5s;
    }

    footer .hundredPer .footer-navigation .footer-links-holder.active h3::after {
      -moz-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
      -webkit-transform: rotate(-45deg);
      transform: rotate(-45deg);
    }

    footer .hundredPer .footer-navigation .footer-links-holder .footer-links {
      display: none;
      margin-right: 15px;
      margin-left: 0;
    }

    footer .hundredPer .footer-navigation .footer-links-holder.active .footer-links {
      max-height: 10000px;
      display: inline-block;
    }    

    footer .bottom-bar {
      width: 100%;
      text-align: center;
    }

}







/* 3 Columns for tablet landscape  and portrait */

/*@media screen and (min-width: 541px)*/
 @media screen and (min-width: 750px){
  .mix,
  .gap {
        width: calc(100%/3 - (((3 - 1) * 1rem) / 3));
  }

  h2.sectionHeadline {
        font-size: 24px;
      }
    
  #hero.homepage img.JSLogo {
    margin-top: 5%;
  }

  .buttonTop,
    .close-btn {
    height: 18px;
    width: 24px;
    background-size: 24px 18px;
    margin-left: 4%;
  }

  .buttonTop::after {
    margin-top: 5px;
    font-size: 15px;
    margin-left: 35px;
  }

  .contactTop {
    height: 18px;
    width: 29px;
    background-size: 29px 18px;
    margin-bottom: 0.75%;
    margin-right: 4%;
  }

  .logoTop {
    background-image: url('../images/logos/JS_logoTop_325x19.png');
    height: 28px;
    width: 297px;
    background-size: 297px 28px;
    margin-bottom: 0%;
    margin-top: 2%;
    margin-left: 0%;
  }

  .buttonClose {
    height: 18px;
    width: 24px;
    background-size: 24px 18px;
    margin-left: 2%;
  }

  .buttonClose::after {
    margin-top: 5px;
    font-size: 15px;
    margin-left: 35px;
  }

  .wrap {
    width: 60%;
    margin-top: 130px;
  }

.blurb h2 {
  font-size: 1.35em;
  font-weight: 500;
  text-transform: capitalize;
}

.blurb h3 {
  font-size: 1.2em;
  font-weight: 500;
}

.blurb p {
  font-size: 1.15em;
  line-height: 1.45em;
}

 .blurb {
    padding-left:10%;
  }

  .shadow {
    box-shadow: 1px 1px 3px rgba(0,0,0,0.2), inset 0 -1px 1px rgba(0,0,0,0.1);
  }

  .main-right-50 {
      width:48%;
      margin: 0%;
      margin-left: 4%;
      position: relative;
      display: block;
      float: left;
  }

  .main-left-50 {
      width:48%;
      margin: 0%;
      margin-left: 0;
      margin-right: 0;
      position: relative;
      display: block;
      float: left;
  }


    /* About page
--------------------------------------------------------------------- */
.main-left-50.pullQuote.about,
.main-right-50.about {
  width: 48%;
  margin: 0;
  text-align: left;
}

.main-left-50.pullQuote.about {
  margin-right: 2%;
}

.pullQuote p {
  margin: 0;
  padding-top: 0;
}

p.about {
  text-align: left;
}

/*
 .main-left-50.about {
  width: 80%;
  margin: 0 0 0 10%;
}
*/
  
  .main-left-50.contact {
      width:47%;
      margin: 0%;
      margin-left: 6%;
      position: relative;
      display: block;
      float: left;
  }

.form-group .main-left-50 {
    margin-left: 0;
  }


  .main-left-30 {
      width:30%;
      margin: 0%;
      position: relative;
      display: block;
      float: left;
    }

  .main-right-65 {
      width:60%;
      /*max-width: 1080px;*/
      margin: 0%;
      margin-left: 0%;
      position: relative;
      display: block;
      float: left;
    }

  .main-right-30 {
      width:30%;
      /*max-width: 720px;*/
      margin: 0%;
      margin-left: 0%;
      margin-right: 0;
      position: relative;
      display: block;
      float: left;
    }

  .main-left-65 {
      width:60%;
      /*max-width: 1080px;*/
      margin: 0%;
      margin-left: 0%;
      margin-right: 5%;
      position: relative;
      display: block;
      float: left;
    }

  .main-left-65.blurb {
      width: 80%;
      margin-left: 10%;
    }
  
  .main-right-30 img {
      width:80%;
      margin-left:5%;
    }

  .main-left-30 img {
    width:80%;
    margin-left:0%;
  }

  .small.main-left-30 {
    margin-left:3%;
  }

  .small.main-right-30 {
    margin-left:5%;
  }

  .main-right-65 img {
    width:100%;
    margin-left:7%;
  }

  .main-left-65 img {
    width:100%;
    margin-left:5%;
  }
  
.main-right-50 img,
.main-left-50 img {
  width: 100%;
  margin: 0;
}

/* fix Feb 22 2018 for ipad */


.main.clearfix {
  margin:0 0 0 15%;
  width: 70%;
}


  /* CONTACT PAGE SETTINGS ////////////////////////
  */
  .description {
    display: none;
  }


  h2.confirm {
    font-size: 1.5em;
    color: #0F3565; 
    font-family: 'Noto Serif', 'Helvetica', serif;
    font-style: italic;
  }

.pencil img {
  width: 100%;
  margin-left: 6%;
}


}

/* 4 Columns for monitor  */
 @media screen and (min-width: 1025px){
  .mix,
  .gap {
        width: calc(100%/4 - (((4 - 1) * 1rem) / 4));
  }

  h2.sectionHeadline {
        font-size: 26px;
      }
    
  #hero.homepage img.JSLogo {
    margin-top: 5%;
  }

  .buttonTop,
    .close-btn {
    height: 21px;
    width: 28px;
    background-size: 28px 21px;
  }

  .buttonTop::after {
    margin-top: 7px;
    font-size: 16px;
    margin-left: 40px;
  }

  .contactTop {
    height: 21px;
    width: 34px;
    background-size: 34px 21px;
    margin-bottom: 0.5%;
    margin-right: 4%;
  }

  .logoTop {
    background-image: url('../images/logos/JS_logoTop_325x19.png');
    height: 31px;
    width: 322px;
    background-size: 322px 31px;
    margin-bottom: 0%;
    margin-top: 2%;
    margin-left: 0%;
  }

  .buttonClose {
    height: 21px;
    width: 28px;
    background-size: 28px 21px;
  }

  .buttonClose::after {
    margin-top: 7px;
    font-size: 16px;
    margin-left: 40px;
  }

  
  .wrap {
    width: 60%;
    margin-top: 180px;
  }

  .wrap ul.wrap-nav li {
    display: block;
    width: 100%;
  }

  .wrap ul.wrap-nav li a  {
    font-size: 25px; /* 30px; */
  }



  /* /////////////////////////////////////
  Feature Page settings */
  
.hundredPer {
  margin:0;
  max-width: 100%;
  text-align: center;
}


.main.clearfix {
  margin:0 0 0 15%;
  width: 70%;
}


/* /////////////////////////////////////
.main.hundredPer {
  margin:0 0 0 3%;
}
////////////// */
 
 
.blurb {
  padding-left:10%;
}

.blurb h2 {
font-size: 1.65em;
font-weight: 500;
text-transform: capitalize;
font-family: "nimbus-sans", 'Helvetica', 'Verdana', 'sans-serif';
}

.blurb h3 {
  font-size: 1.5em;
  font-weight: 500;
  font-family: "nimbus-sans", 'Helvetica', 'Verdana', 'sans-serif';
}

.blurb p {
  font-size: 1.35em;
  line-height: 1.6em;
}

.shadow {
    box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.5), inset 0px 0px 1px 0px rgba(254,254,254,1);
    /*
    box-shadow: 1px 1px 3px rgba(0,0,0,0.2), inset 0 -1px 1px rgba(0,0,0,0.1);
    -webkit-box-shadow: -3px 3px 8px 1px rgba(182,183,184,1);
    -moz-box-shadow: -3px 3px 8px 1px rgba(182,183,184,1);
    box-shadow: -3px 3px 8px 1px rgba(182,183,184,1);
    -webkit-box-shadow: inset 0px 0px 2px 0px rgba(254,254,254,1);
    -moz-box-shadow: inset 0px 0px 2px 0px rgba(254,254,254,1);
    box-shadow: inset 0px 0px 2px 0px rgba(254,254,254,1);*/
  }
  
  .banner {
    margin: 0 10% 0 6%;
  }

  .main-right-50 {
      width:47%;
      margin: 0%;
      margin-left: 0%;
      position: relative;
      display: block;
      float: left;
  }

  .main-left-50 {
      width:47%;
      margin: 0%;
      margin-right: 5%;
      position: relative;
      display: block;
      float: left;
  }

  .main-left-30 {
      width:30%;
      margin: 0%;
      position: relative;
      display: block;
      float: left;
    }

  .main-right-65 {
      width:60%;
      /*max-width: 1080px;*/
      margin: 0%;
      margin-left: 0%;
      position: relative;
      display: block;
      float: left;
    }

  .main-right-30 {
      width:30%;
      /*max-width: 720px;*/
      margin: 0%;
      margin-left: 0%;
      margin-right: 0;
      position: relative;
      display: block;
      float: left;
    }

  .main-left-65 {
      width:60%;
      /*max-width: 1080px;*/
      margin: 0%;
      margin-left: 0%;
      margin-right: 5%;
      position: relative;
      display: block;
      float: left;
    }
/*
.main-center-60 {
    width:70%;
}


.banner.main-center-60 {
    width: 100%;
    margin: 0 0 0 auto;
  }
  
.banner.main-center-60 img{
    max-width: 80%;
    margin-left: 12%;
  } 
 */ 
  .main-right-30 img {
      width:80%;
      margin-left:5%;
    }

  .main-left-30 img {
    width:80%;
    margin-left:0%;
  }

  .small.main-left-30 {
    margin-left:0;
  }

  .small.main-right-30 {
    margin-left:5%;
  }

  .main-right-65 img {
    width:100%;
    margin-left:8%;
  }

  .main-left-65 img {
    width:100%;
    margin-left:0;
  }
  

  /* CONTACT PAGE SETTINGS ////////////////////////
  */
  .description {
    display: none;
  }

  h2.confirm {
    font-size: 1.5em;
    color: #0F3565; 
    font-family: 'Noto Serif', 'Helvetica', serif;
    font-style: italic;
  }


   footer img.miniLogo {
    min-width: 20%;
    padding: 20px 0;
    margin-left: 2.3%;
   }

}






.mixitup-control-active {
	background: transparent;
    color: #353434;
    border-bottom: 2px solid #D44663;
    margin-bottom: 2px;
}





/* //////////////// Responsive //////////// */


/* #Tablet (Portrait) */
 /* @media only screen and (min-width: 768px) and (max-width: 959px) {
	.container {
		width:768px; 
	}
} */

/*  #Mobile (Portrait) - Note: Design for a width of 320px */
 /* @media only screen and (max-width: 767px) {
	.container { 
		width: 95%; 
	}
	
	#portfoliolist .portfolio {
		width:48%;
		margin:1%;
	}		
}*/ 

/* #Mobile (Landscape) - Note: Design for a width of 480px */
 /* @media only screen and (min-width: 480px) and (max-width: 767px) {
	.container {
		width: 70%;
	}
} */


/* #Clearing */

/* Self Clearing Goodness */
.container:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }

.clearfix:before,
.clearfix:after,
.row:before,
.row:after {
  content: '\0020';
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0; }
.row:after,
.clearfix:after {
  clear: both; }
.row,
.clearfix {
  zoom: 1; }

.clear {
  clear: both;
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
}