/*

font-family:'CircularStd-Book', sans-serif;
font-family:'CircularStd-BookItalic', sans-serif;
font-family:'CircularStd-Medium', sans-serif;
font-family:'CircularStd-MediumItalic', sans-serif;
font-family:'CircularStd-Bold', sans-serif;
font-family:'CircularStd-BoldItalic', sans-serif;
font-family:'CircularStd-Black', sans-serif;
font-family:'CircularStd-BlackItalic', sans-serif;

*/


/* Page Styles */
body.trends_subpage {
  --mainColor:#86D199;
  --secondColor:#F2FAF4;
}

body.frameworks_subpage {
  --mainColor:#9BD47C;
  --secondColor:#F1F9EC;
}

#nav_bar {background:var(--mainColor);}
#page_footer {background:var(--secondColor);}
#footer_link strong {color:var(--mainColor); margin: 0 0 3px 0;}
#footer_link:after {color:var(--mainColor);}

#page_body {position:relative; z-index:1; background:#fff; max-width:980px; padding:117px 50px 150px 30px; font-family:'CircularStd-Book', sans-serif; font-weight:400; color:#000;}

#page_body h1 {margin:0 0 32px 0; padding:0; font-family:'CircularStd-Bold', sans-serif; font-weight:400; font-size:15px; color:#7D94A1; text-transform:uppercase;}
#page_body h1 a {display:block; color:#7D94A1; text-decoration:none;}
#page_body h1 a:hover {color:#000; text-decoration:none;}
#page_body h1 strong {display:block; color:var(--mainColor); font-family:'CircularStd-Bold', sans-serif; font-weight:400; font-size:30px; margin:50px 0 0 0;}

#page_social {position:absolute; top:77px; right:8px;}
#page_social ul {list-style:none; margin:0; padding:0;}
#page_social ul li {margin:0 0 0 2px; padding:0; display:inline-block;}
#page_social ul li a {display:block; color:#fff;}
#page_social ul li a i {padding:9px 7px; background:#7D94A1; border-radius:100%; width:30px; height:30px; text-align:center; vertical-align:middle;}
#page_social ul li a:hover i {background:#002C40; color:#47C7EE;}

#page_body .page_content {padding:0 0 0 20px; font-size:15px; line-height:18px;}
#page_body .page_content .prelist {margin: 0 0 16px 0;}
#page_body .page_content .postlist  {margin: 0 0 90px 0;}

#page_body .page_content ul {padding: 0; margin: 0 0 26px 0; list-style: none;max-width: 727px;}
#page_body .page_content ul li {list-style:none; margin:0 0 13px 0; padding:0 0 0 15px; position:relative;}
#page_body .page_content ul li a {color:var(--mainColor);}
#page_body .page_content ul li a:hover {color:#000;}
#page_body .page_content ul li:before {
    content:"• ";
    font-size:20px;
    position:absolute;
    left:0;
    top: -1px;
    line-height:20px;
    margin: 0 5px 0 0;
}

#page_body .page_content #urban_list {font-size: 15px;margin: 0 0 8px 0;line-height: 18px;}

#page_body .page_content #page_intro h2 {position: relative; color:var(--mainColor); font-family:'CircularStd-Medium', sans-serif; font-weight:400; font-size:16px; line-height:20px; margin:0 0 20px 0; padding:0;letter-spacing: -.2px;}
#page_body .page_content #page_intro h2 strong {font-family:'CircularStd-Bold', sans-serif; font-weight:700;}

#page_body .page_content p {margin:0 0 20px 0; padding:0; font-family:'CircularStd-Book', sans-serif; font-weight:400; color:#000; font-size:15px; line-height:18px;}
#page_body .page_content p a {color:var(--mainColor);}
#page_body .page_content p a:hover {color:#000;}

#page_body .page_content p strong {font-family:'CircularStd-Bold', sans-serif; font-weight:400;}
#page_body .page_content p strong.bold_green {color:var(--mainColor);}
#page_body .page_content p em {font-family:'CircularStd-BookItalic', sans-serif; font-style:normal;}

#page_body .page_content #page_intro h2 sub { vertical-align: text-bottom; position: relative; top: 8px; } 
#page_body .page_content #page_intro h2 a {color:var(--mainColor);}
#page_body .page_content #page_intro h2 a:hover {color:#000;}

#page_body .page_content p sub { vertical-align: text-bottom; position: relative; top: 8px; } 

#page_body .page_outdent {margin: 0 0 20px 0;}
#page_body .page_outdent_header {margin: 53px 0 30px 0;}
#page_body .page_outdent h2 {color:var(--mainColor); font-family:'CircularStd-Medium', sans-serif; font-weight:400; font-size:20px; margin:0; padding:0;}
#page_body .page_outdent h2 span {display: block; color: #909090; text-transform: uppercase; font-size: 24px;margin: 0 0 47px 0;}

.page_image {max-width: 727px;margin: 46px 0 46px 0 !important;}
.page_image img {width:100%; height:auto; display:block; margin:0 auto;}

#page_footnotes {padding:25px 0 0 20px; font-family:'CircularStd-Book', sans-serif; font-weight:400; font-size:12px; color:#7D94A1; margin:30px 0 50px 0; position:relative;}
#page_footnotes:before {content:" "; display:block; height:1px; width:calc(100% - 20px); max-width:730px; position:absolute; top:0; left:20px; border-top:1px solid #D7E1E7; }
#page_footnotes a {text-decoration:underline; color:#7D94A1;
 overflow-wrap: break-word;
  word-wrap: break-word;
}
#page_footnotes a:hover {text-decoration:underline; color:#7D94A1;}

#trigger_section {display:block; position:absolute; bottom:10px; left:0;}

#modal_dismiss-bg {display:none; width:100%; height:100%; position:fixed; top:0; left:0; right:0; bottom:0;}

#noscroll_bg {background:#fff;}

#modal_section {display:block; z-index:99; max-width:1080px; width:calc(100% - 38px); position:fixed; top:calc(100vh - 70px); left:0; background:var(--secondColor); height:calc(100vh - 200px); overflow:hidden;}

#modal_section::-webkit-scrollbar {
  width:8px;
}
#modal_section {
  scrollbar-width:thin;
  scrollbar-color:#000 #eee;
}
#modal_section::-webkit-scrollbar-track {
  background:#eee;
}
#modal_section::-webkit-scrollbar-thumb {
  background-color:#000 ;
  border-radius:4px;
  border:2px solid #eee;
}


#modal_header {position:relative;}
#modal_header h2 {display:block; padding:45px 30px 30px 30px; margin:0; font-size:15px; font-family:'CircularStd-Black', sans-serif; font-weight:400; color:var(--mainColor);}
#modal_header h2 strong {font-family:'CircularStd-Bold', sans-serif; font-weight:400; color:var(--mainColor);}
#modal_header a {display:block; position:absolute; left:0; right:0; top:0; bottom:0;}
#modal_header:after {content:" "; display:none; width:30px; height:30px; background:url("../images/case_close.png") 0 0 no-repeat; background-size:30px 30px; position:absolute; top:18px; right:18px;}

#modal_body {max-width:980px; padding:18px 30px 30px 30px; font-family:'CircularStd-Book', sans-serif; font-weight:400; color:#000; font-size:15px; line-height:18px;}

.modal_intro h3 {font-family:'CircularStd-Bold', sans-serif; font-weight:400; font-size:30px; line-height:30px; margin:0 0 48px 0; padding:0; color:var(--mainColor);}

#modal_body .modal_content {}
#modal_body .modal_content p {font-family:'CircularStd-Book', sans-serif; font-weight:400; color:#000; margin:0 0 27px 0; padding:0 0 0 20px; font-size:15px; line-height:18px;}
#modal_body .modal_content p strong {font-family:'CircularStd-Bold', sans-serif; font-weight:400;}
#modal_body .modal_content p em {font-family:'CircularStd-BookItalic', sans-serif; font-style:normal;}
#modal_body .modal_content p sub { vertical-align: text-bottom; position: relative; top: 4px; line-height: 20px;} 
#modal_body .modal_content h4 {font-family:'CircularStd-Bold', sans-serif; font-size:25px; font-weight: 400; line-height:27px; margin:0 0 30px 0;}

.modal_outdent {margin: 0 0 20px 0;}
#modal_body .modal_outdent h4 {font-family:'CircularStd-Bold', sans-serif; font-weight:400; font-size:15px; line-height:17px; margin:0 0 20px 0; padding:0; color:var(--mainColor); text-transform:uppercase;}

.modal_image {padding: 0 0 55px 0;max-width: 727px;}
.modal_image img {width:100%; height:auto; display:block; margin:0 auto;}

#modal_body .modal_quote {background:#fff; padding:20px; margin: 0 0 20px 0;}
#modal_body .modal_quote p {margin: 0 0 13px 0; padding:0; font-family:'CircularStd-Black', sans-serif; font-weight:400; color:var(--mainColor); font-size:14px; line-height:18px;}
#modal_body .modal_quote span.modal_quote-author {display:block; margin:0 0 0 auto; padding:0 0 0 14px; font-family:'CircularStd-Book', sans-serif; font-weight:400; color:#557382; font-size:12px; line-height:15px; position:relative;}
#modal_body .modal_quote span.modal_quote-author:before {content:"\2014"; display:inline-block; position:relative;margin-left: -14px;}

#modal_body hr {border: 0; height: 1.5px; background: var(--mainColor);margin: 65px 0 98px 0;}

#modal_body .modal_content .last_paragraph {margin: 0 0 59px 0;}

.modal_icons {padding: 0 0 0 20px;}
.modal_icons span {display:inline-block; margin:0 10px 10px 0; width:70px;}
.modal_icons span:last-child {margin-right:0;}
.modal_icons span img {width:100%; height:auto;}

body.modal_show {overflow:hidden;}
body.modal_show #modal_section {overflow:auto;}
body.modal_show #modal_header:after {display:block;}
body.modal_show #modal_body {}
body.modal_show #modal_dismiss-bg {display:block; z-index:9}

#modal_section.stop_scroll {position:relative; top:-120px; height:auto; z-index:1;}

#modal_section.stop_scroll #modal_header a {display:none;}


/* Media Queries */
@media only screen and (min-width: 370px) {

#page_body {padding:97px 50px 150px 30px;}

#page_social {position:absolute; top:74px; right:8px;}

}

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

}

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

}

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

}

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

}

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

#page_body {padding:56px 50px 190px 85px;}

#page_body h1 {margin:0 0 144px 0; padding:0; font-size:24px;}
#page_body h1 strong {font-size:60px; line-height:55px; margin:35px 0 0 0;text-transform: uppercase;}

#page_social {top:56px;}

#page_social ul li {margin:0 0 0 20px;}

#page_body .page_content {font-size:20px; line-height:27px; max-width:780px; padding:0 0 0 50px;}
#page_body .page_content #page_intro h2 {font-size:35px; line-height:37.8px; margin:0 0 44px 0;}
#page_body .page_content p {font-size:21px; line-height:27px; margin:0 0 26px 0;}

#page_body .page_outdent {margin:0 0 42px 0;}
#page_body .page_outdent_header {margin:0 0 46px 0;}
#page_body .page_outdent h2 {font-size:36px;}

#page_body .page_content #urban_list {font-size: 21px;margin: 0 0 8px 0;line-height: 25px;}  

#page_body .page_content ul li:before {top:1px;}
  
#page_footnotes {padding:23px 0 0 50px; margin:93px 0 96px 0;}
#page_footnotes:before {width:calc(100% - 50px); left:50px;}


#noscroll_bg {width:calc(100% - 104px);}

#modal_section {width:calc(100% - 104px); top:calc(100vh - 120px);}

#modal_header {}
#modal_header h2 {font-size:24px; padding:50px 30px 30px 85px;}
#modal_section.stop_scroll #modal_header h2 {padding-top:66px;}
#modal_header a {}
#modal_body {padding:23px 50px 50px 85px;}

.modal_intro h3 {font-size:54px; line-height:57px;margin: 0 0 50px 0; max-width: 800px;}

#modal_body .modal_content {font-size:20px; line-height:27px; max-width:780px; padding:0 0 0 50px;}
#modal_body .modal_content p {font-size:21px; line-height:27px; margin:0 0 33px 0;padding: 0;}
#modal_body .modal_content h4 {font-size:35px; line-height:37px; margin:0 0 52px 0;}

#modal_body .modal_outdent {margin:0 0 40px 0;}

#modal_body .modal_outdent h4 {font-size:21px; line-height:25px; margin:0 0 63px 0;}

#modal_body .modal_quote {max-width:704px; padding:30px 25px; margin:1px 0 63px 50px;}

#modal_body .modal_quote p {font-size:21px; line-height:27px;}
#modal_body .modal_quote span.modal_quote-author {font-size:18px; line-height:21px; width:80%; max-width:550px; float:left;margin: 0 0 0 50px;}
#modal_body .modal_quote span.modal_quote-author:before {display:block; position:absolute; top:0; left:-9px;margin-left: 0;}


.modal_icons {padding: 0 0 14px 0;}
.modal_icons span {width:122px;}

body.modal_show #modal_header:after {display:none;}

#modal_body .modal_content .last_para {margin: 0 0 13px 0;}
#modal_body .modal_content .icon_hdr {margin: 0px 0 9px 0;}
  
}

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

}

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

}

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

}

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