/* CSS Document */
/************************** generic class *****************************/
.header1-l {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-size: 40px;
font-weight: bold;
line-height: 48px;
}
.header1 {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-size: 30px;
font-weight: bold;
line-height: 36px;
}
.header2 {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-size: 25px;
font-weight: bold;
line-height: 30px;
}
.header3 {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-size: 20px;
font-weight: bold;
line-height: 24px;
}
.subheader1 {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-size: 20px;
font-weight: bold;
line-height: 24px;
}
.subheader2 {
font-size: 16px;
font-weight: bold;
line-height: 20px;
}
.body_copyL {
font-size: 14px;
line-height: 19px;
}
.body_copy1 {
font-size: 12px;
line-height: 17px;
}
.body_copy2 {
font-size: 11px;
line-height: 15px;
}
.bodycopyL {
font-size: 14px;
line-height: 19px;
}
.bodycopy1 {
font-size: 12px;
line-height: 17px;
}
.bodycopy2 {
font-size: 11px;
line-height: 15px;
}
.red {
color: #fc1921;
}
.green {
color: #4fad26;
}
.grey {
color: #a3a3a3;
}
.link4 {
color: #0041c0;
font-weight: bold;
}
.style-dark .link4 {
color: #00a0c6;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.bodycopyL2 {
font-size: 16px;
line-height: 22px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
/************************** generic class *****************************/
.header1-l {
font-size: 1.5rem;
line-height: 1.2;
}
.header1 {
font-size: 1.125rem;
line-height: 1.25rem;
}
.header2 {
font-size: 1rem;
line-height: 1.125rem;
}
.header3 {
font-size: 1rem;
line-height: 1.125rem;
}
.subheader1 {
font-size: 0.938rem;
line-height: 1.063rem;
}
.subheader2 {
font-size: 0.75rem;
line-height: 0.875rem;
}
.subheader3 {
font-size: 0.75rem;
line-height: 0.875rem;
}
.subheader4 {
font-size: 0.625rem;
line-height: 0.75rem;
}
.bodycopyL,
.body_copyL {
font-size: 0.688rem;
line-height: 0.813rem;
}
.bodycopyL2 {
font-size: 14px;
line-height: 20px;
}
.bodycopy1,
.body_copy1 {
font-size: 0.625rem;
line-height: 0.75rem;
}
.bodycopy2,
.body_copy2 {
font-size: 0.563rem;
line-height: 0.688rem;
}
.bodycopy5 {
font-size: 0.75rem;
line-height: 0.875rem;
}
.mobile_fontsizeup.header1 {
font-size: 24px;
line-height: 29px;
}
.mobile_fontsizeup.bodycopy1, .mobile_fontsizeup.body_copy1, .mobile_fontsizeup.link4 {
font-size: 14px;
line-height: 20px;
}
}
/*slider*/
.slider-wrapper {
position: relative;
page-break-inside: avoid;
}
.slider-wrapper .slider > .slide-block {
float: left;
position: relative;
overflow: hidden;
}
.slider-wrapper .slider-slide-controller {
position: relative;
}
.slider-wrapper .slide-controller {
position: absolute;
width: 100%;
height: 0;
}
.slider-wrapper .slide-controller .first-child {
float: left;
}
.slider-wrapper .slide-controller .last-child {
float: right;
}
.slider-wrapper .slide-controller .first-child a,
.slider-wrapper .slide-controller .last-child a {
display: block;
width: 37px;
height: 47px;
background-repeat: no-repeat;
}
.slider-wrapper .paginator-thumb-control {
position: relative;
width: 976px;
/*height:75px;*/
margin: 30px auto 0;
overflow: hidden;
}
.slider-wrapper .paginator-thumb-control a.paginator-thumb-prev,
.slider-wrapper .paginator-thumb-control a.paginator-thumb-next {
display: block;
position: absolute;
width: 11px;
height: 17px;
top: 50%;
margin-top: -9px;
}
.slider-wrapper .paginator-thumb-control a.paginator-thumb-prev {
left: 80px;
}
.slider-wrapper .paginator-thumb-control a.paginator-thumb-next {
right: 80px;
}
.slider-wrapper .paginator-thumb-control a.hid {
opacity: 0.3;
filter: alpah(opacity=30);
cursor: default;
}
.slider-wrapper .paginator-wrapper {
position: relative;
width: 715px;
/*height:75px;*/
margin: 0 auto;
overflow: hidden;
}
.slider-wrapper .paginator-wrapper .paginator {
text-align: center;
/* scsk modified start */
/*position:absolute;*/
position:relative;
/* scsk modified end */
left: 0px;
}
.slider-wrapper .paginator-wrapper .paginator:before {
content: "";
display: inline-block;
/*height:75px;*/
vertical-align: middle;
}
.slider-wrapper .paginator-wrapper .paginator a {
display: inline-block;
position: relative;
width: 75px;
height: auto;
margin-right: 5px;
background: none;
vertical-align: middle;
text-align: center;
}
.slider-wrapper .paginator-wrapper .paginator a > img {
width: 75px;
filter: url("data:image/svg+xml;utf8,#grayscale");
/* Firefox 10+ */
filter: gray;
-webkit-filter: grayscale(100%);
}
.slider-wrapper .paginator-wrapper .paginator a.selected > img,
.slider-wrapper .paginator-wrapper .paginator a:hover > img {
filter: url("data:image/svg+xml;utf8,#grayscale");
-webkit-filter: grayscale(0%);
}
.slider-wrapper .paginator-wrapper .paginator a:last-child {
margin-right: 0;
}
/*.slider-wrapper .paginator-wrapper .paginator a svg {
position:absolute;
top:0;
left:0;
}
.slider-wrapper .paginator-wrapper .paginator a.selected svg image,
.slider-wrapper .paginator-wrapper .paginator a:hover svg image {
opacity:0;
}
.slider-wrapper .paginator-wrapper .paginator a > img.ie10 {
opacity:0;
}
.slider-wrapper .paginator-wrapper .paginator a.selected img.ie10,
.slider-wrapper .paginator-wrapper .paginator a:hover img.ie10 {
opacity:1;
}
*/
/************************** browsebar *****************************/
#browsebar-name .name {
text-transform: none;
}
/************************** learncontent-header *****************************/
#learncontent-header {
background-color: #fff;
color: #1f1f1f;
}
.style-dark #learncontent-header {
background-color: #1f1f1f;
color: #fff;
}
#learncontent-header .breadcrumbs {
padding-top: 10px;
padding-bottom: 5px;
overflow: hidden;
font-size: 11px;
}
#learncontent-header .breadcrumbs li {
float: left;
margin-right: 10px;
}
#learncontent-header .breadcrumbs li a {
display: inline-block;
padding-left: 14px;
background-position: 0 50%;
background-repeat: no-repeat;
background-image: url(common-clientlibs/images/icn-arrow-darkgrey-right.png);
color: #404040;
}
#learncontent-header .breadcrumbs li a:hover {
color: #1f1f1f;
}
.style-dark #learncontent-header .breadcrumbs li a {
background-image: url(common-clientlibs/images/icn-arrow-lightgrey-right.gif);
color: #9b9b9b;
}
.style-dark #learncontent-header .breadcrumbs li a:hover {
color: #fff;
}
#learncontent-header .pagetitle {
margin-top: 50px;
}
#learncontent-header .pagetitle p {
margin-top: 5px;
}
#learncontent-header .pagetitle strong,
#learncontent-header .pagetitle b {
font-weight: bold;
}
#learncontent-header .pagetitle img {
vertical-align: bottom;
}
#learncontent-header .pagetitle a {
color: #0041c0;
font-weight: bold;
}
.style-dark #learncontent-header .pagetitle a {
color: #00a0c6;
}
/************************** learncontent-contents *****************************/
#learncontent-contents {
background-color: #fff;
color: #1f1f1f;
}
#learncontent-contents:not(.noPaddingBottom) {
padding-bottom: 60px;
}
.style-dark #learncontent-contents {
background-color: #1f1f1f;
color: #fff;
}
#learncontent-contents strong,
#learncontent-contents b {
font-weight: bold;
}
#learncontent-contents i {
font-style: italic;
}
#learncontent-contents img {
vertical-align: bottom;
}
#learncontent-contents a {
color: #0041c0;
font-weight: bold;
}
.style-dark #learncontent-contents a {
color: #00a0c6;
}
#learncontent-contents .articlesection > section, #learncontent-contents .freeimage > section {
padding-top: 45px;
}
#learncontent-contents .sparateline {
max-width: 976px;
margin: 60px auto 10px;
border-bottom: 1px solid #c9c9c9;
}
#learncontent-contents .spacer {
height: 5px;
}
/* mouse over*/
#learncontent-contents .mouseover.opacity:hover img {
opacity: 0.7;
filter: alpha(opacity=70);
}
/*parsys_column*/
#learncontent-contents .parsys_column {
margin-right: -20px;
}
#learncontent-contents .parsys_column:after {
content: "";
display: block;
height: 0;
overflow: hidden;
clear: both;
}
#learncontent-contents .parsys_column .col {
margin-right: 20px;
}
#learncontent-contents .parsys_column.cols2 .col {
width: 478px;
float: left;
}
#learncontent-contents .parsys_column.cols3 .col {
width: 312px;
float: left;
}
#learncontent-contents .parsys_column.cols4 .col {
width: 229px;
float: left;
}
#learncontent-contents .parsys_column .col > .textimage > .image {
text-align: center;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#learncontent-contents .articlesection .container.narrow {
width: 640px;
}
}
/*rich text*/
#learncontent-contents .text.parbase.section,
#learncontent-contents .richtext.section {
font-size: 12px;
line-height: 17px;
}
#learncontent-contents .text.parbase.section a,
#learncontent-contents .richtext.section a {
color: #0041c0;
font-weight: bold;
}
.style-dark #learncontent-contents .text.parbase.section a, .style-dark #learncontent-contents .richtext.section a {
color: #00a0c6;
}
#learncontent-contents .text.parbase.section b,
#learncontent-contents .richtext.section b {
font-weight: bold;
}
#learncontent-contents .text.parbase.section i,
#learncontent-contents .richtext.section i {
font-style: italic;
}
#learncontent-contents .text.parbase.section p,
#learncontent-contents .text.parbase.section ul,
#learncontent-contents .text.parbase.section ol,
#learncontent-contents .text.parbase.section > div,
#learncontent-contents .richtext.section p,
#learncontent-contents .richtext.section ul,
#learncontent-contents .richtext.section ol,
#learncontent-contents .richtext.section > div {
margin-top: 15px;
}
#learncontent-contents .text.parbase.section:first-child > :first-child,
#learncontent-contents .richtext.section:first-child > :first-child {
margin-top: 0;
}
#learncontent-contents .text.parbase.section ul,
#learncontent-contents .richtext.section ul {
list-style: outside disc;
margin-left: 1.5em;
}
#learncontent-contents .text.parbase.section ol,
#learncontent-contents .richtext.section ol {
list-style: outside decimal;
margin-left: 1.5em;
}
#learncontent-contents .text.parbase.section .notice, #learncontent-contents .richtext.section .notice {
display: block;
background-color: #EFEFEF;
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
text-align: center;
}
#learncontent-contents .blogText .text.parbase.section ul, #learncontent-contents .blogText .richtext.section ul {
list-style: outside square;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#learncontent-contents .text.parbase.section .notice, #learncontent-contents .richtext.section .notice {
padding: 15px 10px;
font-size: 24px;
line-height: 31px;
}
#learncontent-contents .blogText .text.parbase.section p, #learncontent-contents .blogText .text.parbase.section ul, #learncontent-contents .blogText .text.parbase.section ol, #learncontent-contents .blogText .text.parbase.section > div, #learncontent-contents .blogText .text.parbase.section ul li:not(:first-child), #learncontent-contents .blogText .richtext.section p, #learncontent-contents .blogText .richtext.section ul, #learncontent-contents .blogText .richtext.section ol, #learncontent-contents .blogText .richtext.section > div, #learncontent-contents .blogText .richtext.section ul li:not(:first-child) {
margin-top: 20px;
}
#learncontent-contents .blogText .text.parbase.section ul, #learncontent-contents .blogText .richtext.section ul {
font-size: 16px;
line-height: 22px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#learncontent-contents .text.parbase.section,
#learncontent-contents .richtext.section {
font-size: 0.625rem;
line-height: 0.75rem;
}
#learncontent-contents .text.parbase.section p,
#learncontent-contents .text.parbase.section ul,
#learncontent-contents .text.parbase.section ol,
#learncontent-contents .richtext.section p,
#learncontent-contents .richtext.section ul,
#learncontent-contents .richtext.section ol {
margin-top: 10px;
}
#learncontent-contents .text.parbase.section .notice, #learncontent-contents .richtext.section .notice {
padding: 10px 5px;
font-size: 20px;
line-height: 26px;
}
#learncontent-contents .blogText .text.parbase.section p, #learncontent-contents .blogText .text.parbase.section ul, #learncontent-contents .blogText .text.parbase.section ol, #learncontent-contents .blogText .text.parbase.section > div, #learncontent-contents .blogText .text.parbase.section ul li:not(:first-child), #learncontent-contents .blogText .richtext.section p, #learncontent-contents .blogText .richtext.section ul, #learncontent-contents .blogText .richtext.section ol, #learncontent-contents .blogText .richtext.section > div, #learncontent-contents .blogText .richtext.section ul li:not(:first-child) {
margin-top: 15px;
}
#learncontent-contents .blogText .text.parbase.section ul, #learncontent-contents .blogText .richtext.section ul {
font-size: 14px;
line-height: 20px;
}
}
/*layoutframe*/
#learncontent-contents .layoutframe:after {
content: "";
display: block;
height: 0;
overflow: hidden;
clear: both;
}
#learncontent-contents .layoutframe .l {
float: left;
}
#learncontent-contents .layoutframe .r {
float: right;
}
/*imagetext_column*/
#learncontent-contents .imagetext_column .l,
#learncontent-contents .imagetext_column .r {
width: 478px;
}
#learncontent-contents .imagetext_column .l.image {
text-align: left;
}
#learncontent-contents .imagetext_column .r.image {
text-align: right;
}
#learncontent-contents .parsys_column.cols2 .col .imagetext_column .l,
#learncontent-contents .parsys_column.cols2 .col .imagetext_column .r {
width: 229px;
}
/* image640 video640 video */
#learncontent-contents .videotext > div {
margin-top: 15px;
}
#learncontent-contents .videotext > :first-child {
margin-top: 0;
}
#learncontent-contents .videotext > div,
#learncontent-contents .youtube-placeholder {
height: 100%;
}
#learncontent-contents .videotext .youtube-placeholder iframe {
display: block;
}
#learncontent-contents .layoutframe.image640 .copy,
#learncontent-contents .layoutframe.video640 .copy {
width: 270px;
}
#learncontent-contents .layoutframe.image640 .image,
#learncontent-contents .layoutframe.video640 .video {
width: 640px;
}
#learncontent-contents .layoutframe.image640 .image:after,
#learncontent-contents .layoutframe.video640 .video:after {
content: "";
display: block;
position: absolute;
height: 14px;
width: 640px;
background: url(learncontent-clientlibs/images/spr-hub-article-db.png) no-repeat;
background-position: left -50px;
}
#learncontent-contents .layoutframe.video640 .video {
font-size: 0;
height: 360px;
}
#learncontent-contents .layoutframe.video640.aligncenter .video {
float: none;
margin: 0 auto;
}
#learncontent-contents .layoutframe.video640.aligncenter .copy {
display: none;
}
#learncontent-contents .layoutframe.video640 .video .youtube-placeholder {
height: 100%;
}
/* title */
#learncontent-contents .title h3 {
margin-top: 20px;
}
#learncontent-contents .title p {
margin-top: 5px;
}
/* free-image */
#learncontent-contents .free-image {
text-align: center;
}
#learncontent-contents .free-image.no-padding-top {
padding-top: 0px;
}
#learncontent-contents .free-image span {
width: 1200px;
margin-left: -112px;
display: block;
}
/* biopicture */
#learncontent-contents .layoutframe table.biopicture {
border-collapse: collapse;
border-spacing: 0;
padding: 0;
margin: 40px 0 0;
width: 421px;
table-layout: fixed;
float: right;
}
#learncontent-contents .layoutframe table.biopicture td {
text-align: center;
vertical-align: middle;
border: 1px solid #c9c9c9;
}
#learncontent-contents .layoutframe table.biopicture td.pic {
width: 196px;
}
#learncontent-contents .layoutframe table.biopicture td.text {
padding: 10px;
}
/* vote */
#learncontent-contents .vote dl {
display: inline-block;
background-color: #ebebeb;
padding: 9px 15px;
border-radius: 3px;
behavior: url(/etc/designs/panasonic/common-clientlibs/css/PIE.htc);
-pie-border-radius: 3px;
position: relative\9;
}
#learncontent-contents .vote dt,
#learncontent-contents .vote dd {
display: inline-block;
vertical-align: middle;
}
#learncontent-contents .vote dt {
font-size: 12px;
margin-right: 20px;
}
#learncontent-contents .vote dd {
height: 28px;
font-size: 12px;
}
#learncontent-contents .vote dd:before {
content: "";
display: inline-block;
height: 28px;
width: 15px;
margin-right: 5px;
background-image: url(learncontent-clientlibs/images/spr-hub-article-db.png);
background-repeat: no-repeat;
vertical-align: middle;
}
#learncontent-contents .vote dd {
margin-left: 10px;
}
#learncontent-contents .vote dd:first-child {
margin-left: 0;
}
#learncontent-contents .vote dd.thumbdown a {
color: #000;
}
#learncontent-contents .vote dd.thumbup:before {
background-position: -919px -50px;
}
#learncontent-contents .vote dd.thumbdown:before {
background-position: -940px -50px;
}
/* gallery-sizeL */
.gallery-sizeL .slider-wrapper .slide-controller {
top: 167px;
}
.gallery-sizeL .gallery-image:after {
content: "";
display: block;
position: absolute;
height: 14px;
width: 100%;
background: url(learncontent-clientlibs/images/spr-hub-article-db.png) no-repeat;
background-position: left -30px;
}
.gallery-sizeL .gallery-cap {
margin-top: 10px;
text-align: center;
}
/* gallery-sizeSM */
.gallery-sizeSM .slider-wrapper .slide-controller {
top: 50%;
margin-top: -37px;
}
.gallery-sizeSM .gallery-image {
text-align: center;
}
.gallery-sizeSM .gallery-cap {
margin-top: 10px;
text-align: center;
}
.gallery-sizeSM .gallery-video > div {
position: relative;
padding-top: 56.25%;
height: auto !important;
}
.gallery-sizeSM .gallery-video > div > .youtube-placeholder {
position: absolute;
top: 0;
width: 100%;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.gallery-sizeSM .gallery-video {
max-width: 640px;
margin: 0 auto;
}
}
/* gallery-size16-9 */
.gallery-size16-9 {
background: url(learncontent-clientlibs/images/bg-gallery.png) no-repeat 50% 60px;
}
.gallery-size16-9 .slider-wrapper .slide-controller {
top: 35%;
}
.gallery-size16-9 .gallery-image {
text-align: center;
}
.gallery-size16-9 .gallery-cap {
margin-top: 10px;
text-align: center;
}
/* gallery-size4-3 */
.gallery-size4-3 {
background: url(learncontent-clientlibs/images/bg-gallery.png) no-repeat 50% 60px;
}
.gallery-size4-3 .slider-wrapper .slide-controller {
top: 35%;
}
.gallery-size4-3 .gallery-image {
text-align: center;
}
.gallery-size4-3 .gallery-cap {
margin-top: 10px;
text-align: center;
}
/* image-sizeL */
.image-sizeL .image-image:after {
content: "";
display: block;
position: absolute;
height: 14px;
width: 100%;
background: url(learncontent-clientlibs/images/spr-hub-article-db.png) no-repeat;
background-position: left -30px;
}
/************************** more-expl *****************************/
#more-expl {
padding: 50px 0 65px;
background-color: #434343;
background-image: url(learncontent-clientlibs/images/img-more-expl-shadow.png);
background-repeat: no-repeat;
background-position: 50% 0;
color: #fff;
}
#more-expl h3 {
text-align: center;
margin-bottom: 45px;
}
#more-expl .more-expl-block:after {
content: "";
display: block;
height: 0;
overflow: hidden;
clear: both;
}
#more-expl .more-expl-block .more-expl-box {
float: left;
margin-left: 20px;
width: 229px;
}
#more-expl .more-expl-block .more-expl-box:first-child {
margin-left: 0;
}
#more-expl .more-expl-block .more-expl-box:before,
#more-expl .more-expl-block .more-expl-box:after {
content: "";
display: block;
width: 229px;
background-image: url(learncontent-clientlibs/images/spr-hub-article-db.png);
background-repeat: no-repeat;
}
#more-expl .more-expl-block .more-expl-box:before {
height: 2px;
background-position: -470px -65px;
}
#more-expl .more-expl-block .more-expl-box:after {
height: 14px;
background-position: -470px -85px;
}
#more-expl .more-expl-block .more-expl-box-in {
background: url(learncontent-clientlibs/images/img-more-expl-box-1px.png) repeat-y;
padding: 0 2px;
}
#more-expl .more-expl-block .more-expl-box a {
color: #fff;
}
#more-expl .more-expl-block .more-expl-box .more-expl-copy {
padding: 20px 20px 0;
height: 140px;
}
#more-expl .more-expl-block .more-expl-box .more-expl-copy .title {
font-weight: bold;
margin-bottom: 15px;
}
#more-expl .more-expl-block .more-expl-box .more-expl-type {
padding: 0 20px;
font-size: 12px;
font-weight: bold;
}
@media only screen and (min-width: 641px) {
#learncontent-contents .layoutframe.video640 .video {
font-size: 0;
height: 360px !important;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.mobileHide {
display: none;
}
/*slider*/
.slider-wrapper {
height: auto;
}
.slider-wrapper .slider > .slide-block {
height: auto;
}
.slider-wrapper .slide-controller {
display: none;
}
.slider-wrapper .paginator-thumb-control {
position: relative;
width: auto;
height: auto;
margin: 10px auto 0;
padding: 0 10px;
overflow: hidden;
}
.slider-wrapper .paginator-thumb-control a.paginator-thumb-prev,
.slider-wrapper .paginator-thumb-control a.paginator-thumb-next {
display: none;
}
.slider-wrapper .paginator-wrapper {
width: auto;
height: auto !important;
}
.slider-wrapper .paginator-wrapper .paginator {
text-align: left;
position: static;
width: auto !important;
}
.slider-wrapper .paginator-wrapper .paginator a {
width: 13%;
height: auto;
margin-top: 7px;
margin-right: 1.5%;
font-size: 0;
}
.slider-wrapper .paginator-wrapper .paginator a:nth-child(7n) {
margin-right: 0;
}
.slider-wrapper .paginator-wrapper .paginator a img {
height: auto;
}
/************************** browsebar *****************************/
/************************** learncontent-header *****************************/
#learncontent-header {
padding: 15px 10px 0;
background: url(learncontent-clientlibs/images/img-header-shadow-1px-m.png) repeat-x #fff;
background-size: 100% 15px;
}
#learncontent-header .breadcrumbs {
display: none;
}
#learncontent-header .pagetitle {
margin-top: 20px;
}
#learncontent-header .pagetitle p {
margin-top: 10px;
}
/************************** learncontent-contents *****************************/
#learncontent-contents:not(.noPaddingBottom) {
padding-bottom: 20px;
}
#learncontent-contents .articlesection > section, #learncontent-contents .freeimage > section {
padding-top: 30px;
}
#learncontent-contents .sparateline {
width: auto;
margin: 20px 0 0;
}
#learncontent-contents .container {
padding: 0 10px;
}
/*parsys_column*/
#learncontent-contents .parsys_column {
margin-right: 0;
}
#learncontent-contents .parsys_column .col {
margin-right: 0;
margin-bottom: 20px;
}
#learncontent-contents .parsys_column.cols2 .col {
width: auto;
float: none;
}
#learncontent-contents .parsys_column.cols3 .col {
width: 47%;
float: left;
}
#learncontent-contents .parsys_column.cols4 .col {
width: 47%;
float: left;
}
#learncontent-contents .parsys_column.cols3 .col:nth-child(odd),
#learncontent-contents .parsys_column.cols4 .col:nth-child(odd) {
margin-right: 6%;
clear: both;
}
/*layoutframe*/
#learncontent-contents .layoutframe p.image img {
width: 100%;
}
/*imagetext_column*/
#learncontent-contents .imagetext_column .l,
#learncontent-contents .imagetext_column .r {
margin-right: 0;
float: none;
width: auto;
}
#learncontent-contents .imagetext_column .image {
margin-top: 20px;
}
#learncontent-contents .imagetext_column .l.image,
#learncontent-contents .imagetext_column .r.image {
text-align: center;
}
#learncontent-contents .parsys_column.cols2 .col .imagetext_column .l,
#learncontent-contents .parsys_column.cols2 .col .imagetext_column .r {
width: 47%;
}
#learncontent-contents .parsys_column.cols2 .col .imagetext_column .l {
float: left;
}
#learncontent-contents .parsys_column.cols2 .col .imagetext_column .r {
float: right;
}
#learncontent-contents .parsys_column.cols2 .col .imagetext_column .image {
margin-top: 0;
}
#learncontent-contents .parsys_column.cols2 .col .imagetext_column .l.image {
text-align: left;
}
#learncontent-contents .parsys_column.cols2 .col .imagetext_column .r.image {
text-align: right;
}
/* image640 video640 */
#learncontent-contents .layoutframe.image640 .l,
#learncontent-contents .layoutframe.video640 .l,
#learncontent-contents .layoutframe.image640 .r,
#learncontent-contents .layoutframe.video640 .r {
margin-right: 0;
float: none;
}
#learncontent-contents .layoutframe.image640 .copy,
#learncontent-contents .layoutframe.video640 .copy {
width: auto;
}
#learncontent-contents .layoutframe.image640 .image,
#learncontent-contents .layoutframe.video640 .video {
width: auto;
margin-top: 20px;
}
#learncontent-contents .layoutframe.image640 .image.l,
#learncontent-contents .layoutframe.video640 .video.l {
margin-top: 0;
}
#learncontent-contents .layoutframe.image640 .image:after,
#learncontent-contents .layoutframe.video640 .video:after {
height: 7px;
width: 100%;
position: static;
background: url(learncontent-clientlibs/images/img-gallery-shadow-m.png) no-repeat 50% 0;
background-size: 100% 7px;
}
#learncontent-contents .layoutframe.video640 .video {
font-size: 0;
height: auto;
}
/* title */
#learncontent-contents .title h3 {
margin-top: 10px;
}
#learncontent-contents .title h3:first-child {
margin-top: 0;
}
#learncontent-contents .title p {
margin-top: 10px;
}
/* free-image */
#learncontent-contents .free-image span {
width: auto;
margin-left: 0;
}
#learncontent-contents .free-image.no-padding-top {
margin-top: -15px;
}
#learncontent-contents .free-image.no-padding-top span {
margin: 0 -10px;
}
/* biopicture */
#learncontent-contents .layoutframe table.biopicture {
margin: 20px 0 0;
width: 100%;
float: none;
}
#learncontent-contents .layoutframe table.biopicture td {
text-align: center;
vertical-align: middle;
border: 1px solid #c9c9c9;
}
#learncontent-contents .layoutframe table.biopicture td.pic {
width: 40%;
}
#learncontent-contents .layoutframe table.biopicture td.text {
padding: 10px;
}
/* vote */
#learncontent-contents .vote dl {
display: block;
}
#learncontent-contents .vote dt,
#learncontent-contents .vote dd {
display: inline-block;
vertical-align: middle;
}
#learncontent-contents .vote dt {
font-size: 0.625rem;
margin-right: 0;
width: 50%;
}
#learncontent-contents .vote dd {
font-size: 0.625rem;
}
/* gallery-sizeL */
.gallery-sizeL .gallery-image:after {
height: 7px;
position: static;
background: url(learncontent-clientlibs/images/img-gallery-shadow-m.png) no-repeat 50% 0;
background-size: 100% 7px;
}
.gallery-sizeL .gallery-cap {
margin-top: 5px;
text-align: left;
}
/* gallery-sizeSM */
.gallery-sizeSM {
background: none;
}
.gallery-sizeSM .gallery-image:after {
content: "";
display: block;
height: 7px;
background: url(learncontent-clientlibs/images/img-gallery-shadow-m.png) no-repeat 50% 0;
background-size: 100% 7px;
}
.gallery-sizeSM .gallery-cap {
margin-top: 5px;
text-align: left;
}
/* gallery-size16-9 */
.gallery-size16-9 {
background: none;
}
.gallery-size16-9 .gallery-image:after {
content: "";
display: block;
height: 7px;
background: url(learncontent-clientlibs/images/img-gallery-shadow-m.png) no-repeat 50% 0;
background-size: 100% 7px;
}
.gallery-size16-9 .gallery-cap {
margin-top: 5px;
text-align: left;
}
/* gallery-size4-3 */
.gallery-size4-3 {
background: none;
}
.gallery-size4-3 .gallery-image:after {
content: "";
display: block;
height: 7px;
background: url(learncontent-clientlibs/images/img-gallery-shadow-m.png) no-repeat 50% 0;
background-size: 100% 7px;
}
.gallery-size4-3 .gallery-cap {
margin-top: 5px;
text-align: left;
}
/* image-sizeL */
.image-sizeL .image-image:after {
position: static;
height: 7px;
background: url(learncontent-clientlibs/images/img-gallery-shadow-m.png) no-repeat 50% 0;
background-size: 100% 7px;
}
/************************** more-expl *****************************/
#more-expl {
padding: 18px 10px 20px;
background-size: contain;
}
#more-expl h3 {
margin-bottom: 0;
}
#more-expl .more-expl-block .more-expl-box {
margin-left: 0;
margin-top: 20px;
width: 48%;
}
#more-expl .more-expl-block .more-expl-box:nth-child(even) {
float: right;
}
#more-expl .more-expl-block .more-expl-box:before,
#more-expl .more-expl-block .more-expl-box:after {
display: none;
}
#more-expl .more-expl-block .more-expl-box-in {
background: none;
padding: 0 0;
height: auto;
background: none;
background-color: #565656;
box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.4);
-webkit-box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.4);
-moz-box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.4);
-o-box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.4);
-ms-box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.4);
}
#more-expl .more-expl-block .more-expl-box .more-expl-image img {
width: 100%;
}
#more-expl .more-expl-block .more-expl-box .more-expl-copy {
padding: 15px 15px 0;
height: 115px;
}
#more-expl .more-expl-block .more-expl-box .more-expl-type {
padding: 0 15px 15px;
font-size: 0.625rem;
}
}
/************************** products-list *****************************/
#products-list {
color: #1f1f1f;
}
#products-list h3, #products-list .products-list__title {
text-align: center;
}
#products-list .products-block-wrapper:not(.expanded) {
overflow: hidden;
}
#products-list .products-block {
display: -webkit-inline-flex;
display: inline-flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
}
#products-list .products-seeall {
margin-top: 30px;
text-align: center;
}
#products-list .products-seeall button {
padding: 0;
border: none;
background: none;
-webkit-appearance: none;
appearance: none;
}
#products-list .products-seeall a, #products-list .products-seeall button {
display: inline-block;
box-sizing: border-box;
height: 34px;
padding: 0 12px;
background-image: linear-gradient(#fff, #f1f1f1);
border: 1px solid #d8d8d8;
border-radius: 3px;
}
#products-list .products-seeall a::after, #products-list .products-seeall button::after {
content: url("/etc/designs/panasonic/learncontent-clientlibs/images/icn-arrow-down-db.png");
display: inline-block;
width: 9px;
height: 7px;
vertical-align: middle;
line-height: 0;
}
#products-list .products-seeall a.opened::after, #products-list .products-seeall button.opened::after {
transform: scaleY(-1);
}
#products-list .products-seeall a > span, #products-list .products-seeall button > span {
display: inline-block;
vertical-align: middle;
line-height: 32px;
font-weight: bold;
color: #0041c0;
}
#products-list .products-seeall a > span::after, #products-list .products-seeall button > span::after {
content: "";
display: inline-block;
width: 12px;
}
#products-list .products-seeall a > span.hid, #products-list .products-seeall button > span.hid {
display: none;
}
#products-list .extras {
padding-bottom: 40px;
}
#products-list .extras dl {
margin-top: 30px;
}
#products-list .extras dt {
font-weight: bold;
margin-bottom: 10px;
}
#products-list .extras dt a {
display: inline-block;
padding-right: 14px;
background-position: 100% 50%;
background-repeat: no-repeat;
background-image: url(common-clientlibs/images/icn-arrow-darkgrey-right.png);
font-size: 11px;
color: #1f1f1f;
}
#products-list .extras dd span {
display: inline-block;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#products-list {
padding: 25px 0 30px;
}
#products-list h3, #products-list .products-list__title {
padding-bottom: 5px;
}
#products-list h3.header1, #products-list .products-list__title.header1 {
padding-bottom: 30px;
padding-top: 25px;
}
#products-list .products-block-wrapper.expanded {
text-align: center;
}
#products-list .products-block {
margin-right: -10px;
margin-left: -10px;
}
#products-list .product-box {
margin: 20px 10px 0;
}
#products-list .products-seeall a > span, #products-list .products-seeall button > span {
font-size: 12px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#products-list {
padding: 15px 0 30px;
}
#products-list .products-list__title {
padding-left: 10px;
padding-right: 10px;
}
#products-list .products-list__title.align-inherit {
text-align: inherit;
}
#products-list .products-block-wrapper {
padding: 0 10px 2px;
}
#products-list .products-block {
margin-right: -1%;
margin-left: -1%;
}
#products-list .product-box {
margin: 20px 1% 0;
}
#products-list .products-seeall a > span, #products-list .products-seeall button > span {
font-size: 0.75rem;
}
#products-list .extras {
padding: 0 10px;
}
#products-list .extras dl {
margin-top: 30px;
}
#products-list .extras dt {
font-weight: bold;
margin-bottom: 10px;
}
#products-list .extras dt a {
display: inline-block;
padding-right: 14px;
background-position: 100% 50%;
background-repeat: no-repeat;
background-image: url(common-clientlibs/images/icn-arrow-darkgrey-right.png);
font-size: 11px;
color: #1f1f1f;
}
#products-list .extras dd span {
display: inline-block;
}
}
/********** title text **********/
#learncontent-contents .titleText_in.aligncenter {
text-align: center;
}
/********** add categorystyle **********/
#learncontent-contents .product-box-in a {
font-weight: inherit;
}
#learncontent-contents .recommended-products-list {
text-align: center;
}
#learncontent-contents .recommended-products-list.borderbottom {
border-bottom: 1px solid #d6d6d6;
}
#learncontent-contents .recommended-products-list .recommended-products {
color: #1f1f1f;
}
.style-dark #learncontent-contents .recommended-products-list.borderbottom {
border-color: #616161;
}
#learncontent-contents .category-products-column .category-products {
color: #1f1f1f;
}
#learncontent-contents .category-products-column .category-products .btn-area > a {
display: block;
-webkit-box-sizing: border-box;
box-sizing: border-box;
border: 1px solid #ddd;
background: #ececec;
position: relative;
text-align: center;
border-radius: 3px;
}
#learncontent-contents .category-products-column .category-products .btn-area > a > span {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
color: #1f1f1f;
}
#learncontent-contents .category-anchorlinks {
font-size: 0;
text-align: center;
margin: 0 -10px;
}
#learncontent-contents .category-anchorlinks::after {
content: "";
display: table;
clear: both;
}
#learncontent-contents .category-anchorlinks__item {
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 0 10px;
}
#learncontent-contents .category-anchorlinks__item__title {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
color: #1f1f1f;
vertical-align: middle;
line-height: 1.2;
}
#learncontent-contents .category-anchorlinks__item__title::before {
content: "";
display: inline-block;
height: 100%;
vertical-align: middle;
}
#learncontent-contents .category-anchorlinks__item__title > span {
display: inline-block;
vertical-align: middle;
}
#learncontent-contents .category-anchorlinks__item__icon svg path {
fill: none;
stroke: #1f1f1f;
stroke-width: 3px;
fill-rule: evenodd;
}
#learncontent-contents .category-anchorlinks a:hover .category-anchorlinks__item__title {
color: #0041c0;
}
#learncontent-contents .category-anchorlinks a:hover .category-anchorlinks__item__icon svg path {
stroke: #0041c0;
}
.style-dark #learncontent-contents .category-anchorlinks__item__title {
color: #FFF;
}
.style-dark #learncontent-contents .category-anchorlinks__item__icon svg path {
stroke: #FFF;
}
.style-dark #learncontent-contents .category-anchorlinks a:hover .category-anchorlinks__item__title {
color: #00a0c6;
}
.style-dark #learncontent-contents .category-anchorlinks a:hover .category-anchorlinks__item__icon svg path {
stroke: #00a0c6;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#learncontent-contents .recommended-products-list {
padding: 25px 0 35px;
}
#learncontent-contents .recommended-products-list::after {
content: "";
display: table;
clear: both;
}
#learncontent-contents .recommended-products-list .recommended-products-title {
margin-bottom: 25px;
}
#learncontent-contents .recommended-products-list .recommended-products {
font-size: 0;
}
#learncontent-contents .category-products-column {
margin-left: -10px;
margin-right: -10px;
text-align: center;
font-size: 0;
}
#learncontent-contents .category-products-column .category-image, #learncontent-contents .category-products-column .category-products {
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 0 10px;
display: inline-block;
vertical-align: top;
}
#learncontent-contents .category-products-column .category-products {
font-size: 0;
}
#learncontent-contents .category-products-column .category-products .btn-area {
margin-top: 20px;
}
#learncontent-contents .category-products-column .category-products .btn-area > a {
padding: 13px 10px;
-webkit-background: linear-gradient(#f5f5f5, #c8c8c8);
background: linear-gradient(#f5f5f5, #c8c8c8);
-webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
}
#learncontent-contents .category-products-column .category-products .btn-area > a > span {
font-size: 14px;
}
#learncontent-contents .recommended-products-list .products-block, #learncontent-contents .category-products-column .products-block {
text-align: center;
}
#learncontent-contents .recommended-products-list .product-box, #learncontent-contents .category-products-column .product-box {
display: inline-block;
vertical-align: top;
}
#learncontent-contents .recommended-products-list .product-box:not(:first-child), #learncontent-contents .category-products-column .product-box:not(:first-child) {
margin-left: 20px;
}
#learncontent-contents .category-anchorlinks__item {
display: inline-block;
width: 25%;
}
#learncontent-contents .category-anchorlinks__item__title {
font-size: 14px;
height: 64px;
}
#learncontent-contents .category-anchorlinks__item__icon {
margin-top: 8px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#learncontent-contents .recommended-products-list {
padding: 0 0 20px;
}
#learncontent-contents .category-products-column .category-products .btn-area {
margin-top: 20px;
}
#learncontent-contents .category-products-column .category-products .btn-area > a {
padding: 7px 10px;
-webkit-background: linear-gradient(#fff, #f1f1f1) #f1f1f1;
background: linear-gradient(#fff, #f1f1f1) #f1f1f1;
}
#learncontent-contents .category-products-column .category-products .btn-area > a > span {
font-size: 0.938rem;
}
#learncontent-contents .recommended-products-list .products-block::after, #learncontent-contents .category-products-column .products-block::after {
content: "";
display: table;
clear: both;
}
#learncontent-contents .recommended-products-list .product-box, #learncontent-contents .category-products-column .product-box {
margin-top: 20px;
margin-bottom: 2px;
}
#learncontent-contents .recommended-products-list .product-box:nth-child(2n+1), #learncontent-contents .category-products-column .product-box:nth-child(2n+1) {
float: left;
clear: both;
}
#learncontent-contents .recommended-products-list .product-box:nth-child(2n), #learncontent-contents .category-products-column .product-box:nth-child(2n) {
float: right;
}
#learncontent-contents .category-anchorlinks__item {
width: 50%;
float: left;
}
#learncontent-contents .category-anchorlinks__item__title {
font-size: 12px;
height: 28px;
}
#learncontent-contents .category-anchorlinks__item__icon {
margin-top: 3px;
}
}
/************************** addthissection *****************************/
.addthissection-in.aligncenter {
text-align: center;
}
.addthissection__items {
font-size: 0;
}
.addthissection__item {
display: inline-block;
border-radius: 4px;
overflow: hidden;
transition: all .2s ease-in-out;
text-decoration: none;
}
.addthissection__item-in {
display: block;
padding: 5px;
text-align: center;
}
.addthissection__item.fb {
background-color: #3b5998;
}
.addthissection__item.tw {
background-color: #1da1f2;
}
.addthissection__item.gp {
background-color: #dc4e41;
}
.addthissection__item.more {
background-color: #ff6550;
}
.addthissection__item:not(.more):focus, .addthissection__item:not(.more):hover {
transform: translateY(-4px);
}
.addthissection__item:not(.more) svg title {
display: none;
}
.addthissection__item .icn {
display: inline-block;
vertical-align: middle;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.addthissection {
padding-top: 45px;
}
.addthissection__title {
padding-bottom: 25px;
}
.addthissection__item {
margin: 0 2px 5px;
}
.addthissection__item:not(.more) .addthissection__item-in {
-webkit-box-sizing: border-box;
box-sizing: border-box;
min-width: 120px;
}
.addthissection__item .label {
color: #fff;
display: inline-block;
font-size: 11.4px;
font-family: helvetica neue,helvetica,arial,sans-serif;
font-weight: bold;
line-height: 32px;
margin-left: 5px;
padding-right: 15px;
vertical-align: middle;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.addthissection {
padding-top: 20px;
}
.addthissection__title {
padding-bottom: 20px;
padding-top: 10px;
}
.addthissection__item {
margin: 0 4px 5px;
}
.addthissection__item .label {
display: none;
}
}
/************************** categorytop hero *****************************/
#learncontent-contents .categorytop-hero {
padding-bottom: 20px;
position: relative;
}
#learncontent-contents .categorytop-hero::before {
content: "";
display: block;
height: 21px;
width: 100%;
position: absolute;
background: url(/etc/designs/panasonic/dynamicHomepage-clientlibs/images/img-content-shadow-1px.png) repeat-x top;
z-index: 2;
top: 0;
}
#learncontent-contents .categorytop-hero .hid {
display: none;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu {
position: absolute;
top: 27px;
z-index: 10;
width: 100%;
text-align: center;
font-size: 0;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu ul {
display: inline-block;
font-size: 0;
border: 1px solid #e1e1e1;
border-radius: 3px;
position: relative;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu ul li {
display: inline-block;
vertical-align: top;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu ul li.startup {
height: 0;
width: 0;
overflow: hidden;
position: absolute;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu ul li:last-child a {
border-right: none;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu ul li a {
display: inline-block;
padding: 0 25px;
height: 34px;
border-right: 1px solid #e5ecec;
background: -webkit-linear-gradient(#ffffff, #ebebeb);
background: linear-gradient(#ffffff, #ebebeb);
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-size: 13px;
font-weight: bold;
color: #1f1f1f;
position: relative;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu ul li a::before {
content: "";
display: inline-block;
height: 34px;
vertical-align: middle;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu ul li span {
display: inline-block;
vertical-align: middle;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu ul li:hover a, #learncontent-contents .categorytop-hero .hero-tabs .tabs-menu ul li.ui-state-active a {
background: -webkit-linear-gradient(top, #bfbfbf 0%, #d1d1d1 11%, #e9e9e9 93%);
background: linear-gradient(to bottom, #bfbfbf 0%, #d1d1d1 11%, #e9e9e9 93%);
color: #606060;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu form {
display: none;
}
#learncontent-contents .categorytop-hero .hero-tabs .ui-tabs-panel {
z-index: 2;
}
#learncontent-contents .categorytop-hero .slider-wrapper {
position: relative;
padding-bottom: 44px;
}
#learncontent-contents .categorytop-hero .slider-wrapper .slider-ui-panel {
position: absolute;
width: 100%;
bottom: 0;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator-controller {
padding-top: 9px;
min-height: 35px;
background: url(/etc/designs/panasonic/dynamicHomepage-clientlibs/images/img-content-shadow-1px.png) repeat-x top;
text-align: center;
font-size: 0;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator-controller > .container::after::after {
content: "";
display: table;
clear: both;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator-controller .slide-button-paginator {
display: inline-block;
padding-top: 7px;
margin-left: 28px;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator-controller .first-child {
float: left;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator-controller .last-child {
float: right;
}
#learncontent-contents .categorytop-hero .slider-wrapper .slide-pause {
float: right;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator {
display: inline-block;
padding: 3px 35px;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator a {
display: inline-block;
padding: 0 5px;
vertical-align: middle;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator a > span {
display: block;
width: 11px;
height: 11px;
}
#learncontent-contents .categorytop-hero .slide-block {
min-height: 470px;
position: relative;
float: left;
}
#learncontent-contents .categorytop-hero .hero-image {
height: 470px;
text-align: center;
overflow: hidden;
}
#learncontent-contents .categorytop-hero .hero-image > .container > span {
display: inline-block;
margin-left: -112px;
}
#learncontent-contents .categorytop-hero .hero-image > .container > span > img {
height: 470px;
}
#learncontent-contents .categorytop-hero .keycopy {
width: 395px;
position: absolute;
left: 0px;
bottom: 40px;
}
#learncontent-contents .categorytop-hero .keycopy.position-right {
left: auto;
right: 0px;
text-align: right;
}
#learncontent-contents .categorytop-hero .keycopy p {
margin-top: 10px;
}
#learncontent-contents .categorytop-hero .keycopy .seemore {
margin-top: 15px;
}
#learncontent-contents .categorytop-hero .keycopy .seemore a {
position: relative;
display: inline-block;
height: 43px;
padding: 0 18px;
border-radius: 3px;
box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.3);
}
#learncontent-contents .categorytop-hero .keycopy .seemore a::before {
content: "";
display: inline-block;
height: 43px;
vertical-align: middle;
}
#learncontent-contents .categorytop-hero .keycopy .seemore a span {
display: inline-block;
vertical-align: middle;
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-size: 14px;
font-weight: bold;
text-transform: uppercase;
}
#learncontent-contents .categorytop-hero .keycopy .seemore.type-video a {
padding-left: 13px;
}
#learncontent-contents .categorytop-hero .keycopy .seemore.type-video a::before {
margin-right: 13px;
height: 43px;
width: 28px;
background-image: url(/etc/designs/panasonic/dynamicHomepage-clientlibs/images/spr-dynamichomepage.png);
background-repeat: no-repeat;
}
#learncontent-contents .categorytop-hero .style-dark {
color: #fff;
}
#learncontent-contents .categorytop-hero .style-dark .keycopy .seemore a {
background: #ececec;
background: -webkit-linear-gradient(#f5f5f5, #e4e4e4);
background: linear-gradient(#f5f5f5, #e4e4e4);
color: #1f1f1f;
}
#learncontent-contents .categorytop-hero .style-dark .keycopy .seemore a:hover, #learncontent-contents .categorytop-hero .style-dark .keycopy .seemore a:focus {
background: #262525;
background: -webkit-linear-gradient(#464444, #262525);
background: linear-gradient(#464444, #262525);
color: #fff;
}
#learncontent-contents .categorytop-hero .style-dark .keycopy .seemore.type-video a::before {
background-position: -28px 0;
}
#learncontent-contents .categorytop-hero .style-dark .keycopy .seemore.type-video a:hover::before, #learncontent-contents .categorytop-hero .style-dark .keycopy .seemore.type-video a:focus::before {
background-position: 0 0;
}
#learncontent-contents .categorytop-hero .style-light {
color: #1f1f1f;
}
#learncontent-contents .categorytop-hero .style-light .keycopy .seemore a {
background: #262525;
background: -webkit-linear-gradient(#464444, #262525);
background: linear-gradient(#464444, #262525);
color: #fff;
}
#learncontent-contents .categorytop-hero .style-light .keycopy .seemore a:hover, #learncontent-contents .categorytop-hero .style-light .keycopy .seemore a:focus {
background: #ececec;
background: -webkit-linear-gradient(#f5f5f5, #e4e4e4);
background: linear-gradient(#f5f5f5, #e4e4e4);
color: #1f1f1f;
}
#learncontent-contents .categorytop-hero .style-light .keycopy .seemore.type-video a::before {
background-position: 0 0;
}
#learncontent-contents .categorytop-hero .style-light .keycopy .seemore.type-video a:hover::before, #learncontent-contents .categorytop-hero .style-light .keycopy .seemore.type-video a:focus::before {
background-position: -28px 0;
}
html.touch-device #learncontent-contents .categorytop-hero .hero-tabs .tabs-menu ul li:hover a {
background: -webkit-linear-gradient(#ffffff, #ebebeb);
background: linear-gradient(#ffffff, #ebebeb);
color: #1f1f1f;
}
html.touch-device #learncontent-contents .categorytop-hero .hero-tabs .tabs-menu ul li.ui-state-active a {
background: -webkit-linear-gradient(top, #bfbfbf 0%, #d1d1d1 11%, #e9e9e9 93%);
background: linear-gradient(to bottom, #bfbfbf 0%, #d1d1d1 11%, #e9e9e9 93%);
color: #606060;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#learncontent-contents .categorytop-hero .style-light.textShadow {
-webkit-text-shadow: 0 0 3px rgba(255,255,255,1), 0 0 3px rgba(255,255,255,1);
text-shadow: 0 0 3px rgba(255,255,255,1), 0 0 3px rgba(255,255,255,1);
}
#learncontent-contents .categorytop-hero .style-light.textShadow-strong1 {
-webkit-text-shadow: -1px -1px 0 rgba(255,255,255,1), 1px -1px 0 rgba(255,255,255,1), 1px 1px 0 rgba(255,255,255,1), -1px 1px 0 rgba(255,255,255,1), 0 0 7px rgba(255,255,255,1), 0 0 6px rgba(255,255,255,1), 0 0 5px rgba(255,255,255,1), 0 0 4px rgba(255,255,255,1), 0 0 3px rgba(255,255,255,1), 0 0 2px rgba(255,255,255,1), 0 0 1px rgba(255,255,255,1);
text-shadow: -1px -1px 0 rgba(255,255,255,1), 1px -1px 0 rgba(255,255,255,1), 1px 1px 0 rgba(255,255,255,1), -1px 1px 0 rgba(255,255,255,1), 0 0 7px rgba(255,255,255,1), 0 0 6px rgba(255,255,255,1), 0 0 5px rgba(255,255,255,1), 0 0 4px rgba(255,255,255,1), 0 0 3px rgba(255,255,255,1), 0 0 2px rgba(255,255,255,1), 0 0 1px rgba(255,255,255,1);
}
#learncontent-contents .categorytop-hero .style-light.textShadow-strong2 {
-webkit-text-shadow: 0 0 5px rgba(255,255,255,1), 0 0 4px rgba(255,255,255,1), 0 0 3px rgba(255,255,255,1), 0 0 2px rgba(255,255,255,1), 0 0 1px rgba(255,255,255,1);
text-shadow: 0 0 5px rgba(255,255,255,1), 0 0 4px rgba(255,255,255,1), 0 0 3px rgba(255,255,255,1), 0 0 2px rgba(255,255,255,1), 0 0 1px rgba(255,255,255,1);
}
#learncontent-contents .categorytop-hero .style-dark.textShadow {
-webkit-text-shadow: 0 0 3px rgba(0,0,0,1), 0 0 3px rgba(0,0,0,1);
text-shadow: 0 0 3px rgba(0,0,0,1), 0 0 3px rgba(0,0,0,1);
}
#learncontent-contents .categorytop-hero .style-dark.textShadow-strong1 {
-webkit-text-shadow: -1px -1px 0 rgba(0,0,0,1), 1px -1px 0 rgba(0,0,0,1), 1px 1px 0 rgba(0,0,0,1), -1px 1px 0 rgba(0,0,0,1), 0 0 7px rgba(0,0,0,1), 0 0 6px rgba(0,0,0,1), 0 0 5px rgba(0,0,0,1), 0 0 4px rgba(0,0,0,1), 0 0 3px rgba(0,0,0,1), 0 0 2px rgba(0,0,0,1), 0 0 1px rgba(0,0,0,1);
text-shadow: -1px -1px 0 rgba(0,0,0,1), 1px -1px 0 rgba(0,0,0,1), 1px 1px 0 rgba(0,0,0,1), -1px 1px 0 rgba(0,0,0,1), 0 0 7px rgba(0,0,0,1), 0 0 6px rgba(0,0,0,1), 0 0 5px rgba(0,0,0,1), 0 0 4px rgba(0,0,0,1), 0 0 3px rgba(0,0,0,1), 0 0 2px rgba(0,0,0,1), 0 0 1px rgba(0,0,0,1);
}
#learncontent-contents .categorytop-hero .style-dark.textShadow-strong2 {
-webkit-text-shadow: 0 0 5px rgba(0,0,0,1), 0 0 4px rgba(0,0,0,1), 0 0 3px rgba(0,0,0,1), 0 0 2px rgba(0,0,0,1), 0 0 1px rgba(0,0,0,1);
text-shadow: 0 0 5px rgba(0,0,0,1), 0 0 4px rgba(0,0,0,1), 0 0 3px rgba(0,0,0,1), 0 0 2px rgba(0,0,0,1), 0 0 1px rgba(0,0,0,1);
}
#learncontent-contents .categorytop-hero .keycopy .seemore {
text-shadow: none;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#learncontent-contents .categorytop-hero {
margin-top: -15px;
padding-bottom: 0;
background-color: #202020;
}
#learncontent-contents .categorytop-hero::before {
background-image: url(/etc/designs/panasonic/dynamicHomepage-clientlibs/images/img-content-shadow-1px-m.png);
background-size: 1px 5px;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu {
top: 15px;
left: 10px;
width: auto;
text-align: left;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu-text {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-size: 0.688rem;
font-weight: bold;
color: #1f1f1f;
display: inline-block;
vertical-align: middle;
padding-right: 18px;
background: url(/etc/designs/panasonic/common-clientlibs/images/img-arrow-grey-down-m.png) no-repeat 100% 50%;
background-size: 13px 8px;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu nav {
display: inline-block;
height: 30px;
background: #ececec;
background: -webkit-linear-gradient(#f5f5f5, #e4e4e4);
background: linear-gradient(#f5f5f5, #e4e4e4);
position: relative;
border-radius: 3px;
border: 1px solid #e1e1e1;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding-left: 6px;
padding-right: 6px;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu nav form {
display: inherit;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu nav form::before {
content: "";
display: inline-block;
height: 28px;
vertical-align: middle;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu nav form select {
width: 100%;
height: 28px !important;
position: absolute;
top: 0;
left: 0;
opacity: 0;
font-size: 18px;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu .container {
padding: 0 !important;
}
#learncontent-contents .categorytop-hero .hero-tabs .tabs-menu ul {
display: none;
}
#learncontent-contents .categorytop-hero .style-dark, #learncontent-contents .categorytop-hero .style-light {
color: #fff;
}
#learncontent-contents .categorytop-hero .slider-wrapper {
padding-bottom: 68px;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator-controller {
background: none;
padding: 25px 0;
min-height: 0;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator-controller .slide-button-paginator {
padding-top: 0;
margin-left: 0;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator-controller .first-child, #learncontent-contents .categorytop-hero .slider-wrapper .paginator-controller .last-child {
display: none;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator {
text-align: center;
height: 12px;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator img {
display: none;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator a {
padding: 0 2px;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator a span {
display: inline-block;
width: 12px;
height: 12px;
background-image: url(/etc/designs/panasonic/common-clientlibs/images/icn-slideshow-dot-grey-off-m.png);
background-position: left top;
background-size: 12px 12px;
}
#learncontent-contents .categorytop-hero .slider-wrapper .paginator .selected span {
background-position: left top;
background-image: url(/etc/designs/panasonic/common-clientlibs/images/icn-slideshow-dot-grey-on-m.png);
}
#learncontent-contents .categorytop-hero .slide-pause {
display: none;
}
#learncontent-contents .categorytop-hero .slide-block {
min-height: 0;
position: relative;
float: left;
}
#learncontent-contents .categorytop-hero .hero-image {
height: 167px;
background-color: #000;
}
#learncontent-contents .categorytop-hero .hero-image > .container > span {
margin-left: -112px;
margin-right: -112px;
}
#learncontent-contents .categorytop-hero .hero-image > .container > span > img {
height: 167px;
}
#learncontent-contents .categorytop-hero .keycopy {
width: auto !important;
position: static;
padding: 20px 10px 0;
text-align: left!important;
}
#learncontent-contents .categorytop-hero .keycopy p {
margin-top: 10px;
}
#learncontent-contents .categorytop-hero .keycopy .seemore {
margin-top: 25px;
text-align: center !important;
}
#learncontent-contents .categorytop-hero .keycopy .seemore a, #learncontent-contents .categorytop-hero .keycopy .seemore a:hover {
padding: 0 !important;
height: 31px;
font-size: 0.938rem;
color: #1f1f1f !important;
background: #ececec !important;
background: -webkit-linear-gradient(#f5f5f5, #e4e4e4) #ececec !important;
background: linear-gradient(#f5f5f5, #e4e4e4) #ececec !important;
}
#learncontent-contents .categorytop-hero .keycopy .seemore a::before {
height: 31px !important;
width: 0 !important;
background: none !important;
margin-right: 0 !important;
}
#learncontent-contents .categorytop-hero .keycopy .seemore a span {
padding: 0 15px;
}
}
/************************** modalwindow *****************************/
#modalwindow {
padding: 18px;
}
#modalwindow-wrapper {
width: 976px;
height: 0;
overflow: hidden;
position: absolute;
z-index: 1000;
}
#modalwindow-bg {
background-color: #fff;
position: relative;
}
#modalwindow-bg .btn-close {
position: absolute;
display: block;
top: 16px;
right: 18px;
width: 45px;
height: 45px;
cursor: pointer;
overflow: hidden;
z-index: 10;
}
#modalwindow-wrapper.visual {
width: auto;
overflow: auto;
}
#modalwindow-wrapper.visual #modalwindow-bg {
padding: 0 60px;
background: none;
}
#modalwindow-wrapper.visual #modalwindow-bg .btn-close {
top: 0px;
right: 0;
}
#modalwindow-wrapper.visual #modalwindow {
padding: 0;
}
#modalwindow-wrapper.visual #modalwindow .video {
background-color: #000;
width: 854px;
/*height:480px;*/
}
.lightbox_title {
margin-bottom: 20px;
margin-right: 55px;
}
.lightbox_title:after {
content: "";
display: table;
clear: both;
}
.lightbox_title .Title {
float: left;
}
#modalwindow .lightbox_title .printbut {
float: right;
display: inline-block;
height: 41px;
padding: 0 16px 0 55px;
border-radius: 3px;
position: relative;
box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.3);
background: url(/etc/designs/panasonic/basicpage-clientlibs/images/icn-button-print.png) no-repeat 0 50%, url(/etc/designs/panasonic/basicpage-clientlibs/images/btn-darkgrey-1px.png) repeat-x;
}
.lightbox_title .printbut:before,
.lightbox_title .printbut:after {
display: inline-block;
content: "";
overflow: hidden;
height: 41px;
background-repeat: no-repeat;
vertical-align: middle;
}
.lightbox_title .printbut span {
display: inline-block;
vertical-align: middle;
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-size: 14px;
font-weight: bold;
text-transform: uppercase;
color: #fff;
}
.modal_content {
overflow: auto;
}
.modal_content .container {
padding: 0 0;
max-width: 940px;
margin: 0 auto;
}
.modal_content .jspVerticalBar {
width: 33px;
background: none;
margin: 8px 0;
}
.modal_content .jspVerticalBar .jspCap {
display: block;
width: 9px;
height: 7px;
margin: 0 auto;
background-image: url(/etc/designs/panasonic/basicpage-clientlibs/images/spr-global-lightbox.png);
background-repeat: no-repeat;
}
.modal_content .jspVerticalBar .jspCap.jspCapTop {
background-position: -61px -51px;
margin-top: -8px;
}
.modal_content .jspVerticalBar .jspCap.jspCapBottom {
background-position: -61px -64px;
margin-bottom: -8px;
}
.modal_content .jspVerticalBar .jspTrack {
background: none;
background: url(/etc/designs/panasonic/basicpage-clientlibs/images/img-lightbox-scroll-track-1px.png) repeat-y center;
}
.modal_content .jspVerticalBar .jspDrag {
position: relative;
background: none;
background: url(/etc/designs/panasonic/basicpage-clientlibs/images/img-lightbox-scroll-slider-3line.png) no-repeat 50% 50% #323131;
border: 1px solid #555;
border-radius: 3px;
}
html.touch-device .modal_content {
-webkit-overflow-scrolling: touch !important;
overflow: auto !important;
}
.printlightbox .printbut {
display: none;
}
.printlightbox .jspScrollable {
overflow: visible !important;
height: auto !important;
width: auto !important;
}
.printlightbox .jspContainer {
height: auto !important;
width: auto !important;
}
.printlightbox .jspPane {
position: static !important;
width: auto !important;
}
.printlightbox .jspVerticalBar {
display: none;
}
/*video*/
#modalwindow-wrapper.visual #modalwindow .video .video-caption-link {
background-color: #1f1f1f;
padding: 0 20px;
color: #fff;
}
#modalwindow-wrapper.visual #modalwindow .video .video-caption-link .richtext {
padding-top: 15px;
padding-bottom: 10px;
}
#modalwindow-wrapper.visual #modalwindow .video .video-caption-link .learnmore {
padding-bottom: 20px;
}
#modalwindow-wrapper.visual #modalwindow .video .video-caption-link .learnmore a {
margin-top: 8px;
position: relative;
display: inline-block;
height: 43px;
padding: 0 18px;
margin-right: 10px;
border-radius: 3px;
box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.3);
}
#modalwindow-wrapper.visual #modalwindow .video .video-caption-link .learnmore a:before {
content: "";
display: inline-block;
height: 43px;
vertical-align: middle;
}
#modalwindow-wrapper.visual #modalwindow .video .video-caption-link .learnmore a span {
display: inline-block;
vertical-align: middle;
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-size: 14px;
font-weight: bold;
text-transform: uppercase;
}
#modalwindow-wrapper.visual #modalwindow .video .video-caption-link .learnmore a {
background: #ececec;
background: -webkit-linear-gradient(#f5f5f5, #e4e4e4);
background: linear-gradient(#f5f5f5, #e4e4e4);
color: #1f1f1f;
}
#modalwindow-wrapper.visual #modalwindow .video .closed {
height: 100%;
text-align: center;
}
#modalwindow-wrapper.visual #modalwindow .video .closed:before {
content: "";
display: inline-block;
height: 100%;
vertical-align: middle;
}
#modalwindow-wrapper.visual #modalwindow .video .closed > span {
color: #fff;
font-size: 13px;
}
#modalwindow-wrapper .richtext.section {
font-size: 12px;
line-height: 17px;
}
#modalwindow-wrapper .richtext.section a {
color: #00a0c6;
font-weight: bold;
}
#modalwindow-wrapper .richtext.section b {
font-weight: bold;
}
#modalwindow-wrapper .richtext.section i {
font-style: italic;
}
#modalwindow-wrapper .richtext.section p,
#modalwindow-wrapper .richtext.section ul,
#modalwindow-wrapper .richtext.section ol,
#modalwindow-wrapper .richtext.section > div {
margin-top: 15px;
}
#modalwindow-wrapper .richtext.section:first-child > :first-child {
margin-top: 0;
}
#modalwindow-wrapper .richtext.section ul {
list-style: outside disc;
margin-left: 1.5em;
}
#modalwindow-wrapper .richtext.section ol {
list-style: outside decimal;
margin-left: 1.5em;
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#modalwindow-wrapper {
width: 100%;
top: 0;
}
#modalwindow-bg {
margin: 10px;
background-color: #fff;
}
#modalwindow-bg .btn-close {
top: 7px;
right: 7px;
width: 32px;
height: 32px;
background: url(/etc/designs/panasonic/common-clientlibs/images/btn-lightbox-close.png) no-repeat;
background-size: 32px 32px;
}
#modalwindow-bg .btn-close img {
display: none;
}
#modalwindow {
padding: 15px;
}
#modalwindow-wrapper.visual {
width: 100%;
}
#modalwindow-wrapper.visual #modalwindow-bg {
padding: 40px 0 0;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
#modalwindow-wrapper.visual #modalwindow .video {
width: 100%;
height: auto;
margin: 0 auto;
}
#modalwindow-wrapper.visual #modalwindow .video > div {
margin-top: 0;
}
#modalwindow .lightbox_title {
margin-bottom: 0;
height: 32px;
}
#modalwindow .lightbox_title .printbut {
display: none;
}
.modal_content {
overflow: auto;
}
.modal_content .jspVerticalBar {
width: 15px;
}
#modalwindow-wrapper .jScrollbar_draggable {
/* slider container */
display: none !important;
}
#modalwindow-wrapper.android2 .jScrollbar_draggable {
/* slider container */
display: block !important;
}
/*video*/
#modalwindow-wrapper.visual #modalwindow .video .video-caption-link {
padding: 0 10px;
}
#modalwindow-wrapper.visual #modalwindow .video .video-caption-link .richtext {
padding-top: 10px;
}
#modalwindow-wrapper.visual #modalwindow .video .video-caption-link .learnmore {
text-align: center;
padding-bottom: 10px;
}
#modalwindow-wrapper.visual #modalwindow .video .video-caption-link .learnmore a {
margin: 5px 5px 0;
padding: 0 !important;
height: 31px;
font-size: 0.938rem;
color: #1f1f1f !important;
background: -webkit-linear-gradient(#f5f5f5, #e4e4e4) !important;
background: linear-gradient(#f5f5f5, #e4e4e4) !important;
}
#modalwindow-wrapper.visual #modalwindow .video .video-caption-link .learnmore a:before {
height: 31px;
}
#modalwindow-wrapper.visual #modalwindow .video .video-caption-link .learnmore a span {
padding: 0 15px;
}
}
/******************** categorytop-linklis ********************/
#learncontent-contents .categorylink, #learncontent-contents .categorylist {
background-color: #fff;
border-bottom: 1px solid #d6d6d6;
color: #1f1f1f;
}
#learncontent-contents .categorylink img, #learncontent-contents .categorylist img {
max-width: 100%;
width: auto;
height: auto;
}
#learncontent-contents .categorylink__title, #learncontent-contents .categorylist__title {
text-align: center;
}
#learncontent-contents .categorylink__seeall, #learncontent-contents .categorylist__seeall {
text-align: center;
}
#learncontent-contents .categorylink__seeall::before, #learncontent-contents .categorylist__seeall::before {
content: "";
display: table;
}
#learncontent-contents .categorylink__seeall__link, #learncontent-contents .categorylist__seeall__link {
color: #0041c0 !important;
font-weight: normal;
font-size: 14px;
}
#learncontent-contents .categorylink .icn, #learncontent-contents .categorylist .icn {
display: inline-block;
vertical-align: middle;
line-height: 0;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#learncontent-contents .categorylink, #learncontent-contents .categorylist {
padding: 60px 0;
}
#learncontent-contents .categorylink__title, #learncontent-contents .categorylist__title {
margin-bottom: 25px;
}
#learncontent-contents .categorylink__seeall-in, #learncontent-contents .categorylist__seeall-in {
margin-top: 15px;
}
#learncontent-contents .categorylink .icn, #learncontent-contents .categorylist .icn {
margin-left: 7px;
position: relative;
}
#learncontent-contents .categorylink .icn-swapimg_db::after, #learncontent-contents .categorylist .icn-swapimg_db::after {
content: url(/etc/designs/panasonic/common-clientlibs/images/icn-see-more-ro-db.gif);
display: inline-block;
height: 10px;
width: 10px;
position: absolute;
top: 0;
left: 0;
opacity: 0;
}
#learncontent-contents .categorylink a:hover .icn-swapimg_db img, #learncontent-contents .categorylist a:hover .icn-swapimg_db img {
opacity: 0;
}
#learncontent-contents .categorylink a:hover .icn-swapimg_db::after, #learncontent-contents .categorylist a:hover .icn-swapimg_db::after {
opacity: 1;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#learncontent-contents .categorylink, #learncontent-contents .categorylist {
padding: 15px 0;
}
#learncontent-contents .categorylink-in, #learncontent-contents .categorylist-in {
padding: 0;
}
#learncontent-contents .categorylink__title, #learncontent-contents .categorylist__title {
padding: 15px 10px 10px;
}
#learncontent-contents .categorylink__seeall-in, #learncontent-contents .categorylist__seeall-in {
margin-top: 15px;
}
#learncontent-contents .categorylink .icn, #learncontent-contents .categorylist .icn {
margin-left: 7px;
}
#learncontent-contents .categorylink .icn img, #learncontent-contents .categorylist .icn img {
width: 8px;
height: 8px;
}
}
/******************** categorylink ********************/
#learncontent-contents .categorylink__content {
font-size: 0;
}
#learncontent-contents .categorylink__content a {
color: #1f1f1f;
text-decoration: none;
}
#learncontent-contents .categorylink__content a:hover {
color: #0041c0;
}
#learncontent-contents .categorylink__parentitem {
-webkit-appearance: none;
appearance: none;
border: none;
border-radius: 0;
background: none;
padding: 0;
margin: 0;
display: block;
width: 100%;
cursor: pointer;
text-align: center;
}
#learncontent-contents .categorylink__parentitem > a, #learncontent-contents .categorylink__parentitem > span {
display: block;
cursor: pointer;
}
#learncontent-contents .categorylink__parentitem-label {
color: #1f1f1f;
text-decoration: none;
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
}
#learncontent-contents .categorylink__parentitem-icn {
position: relative;
}
#learncontent-contents .categorylink__parentitem-icn::after {
content: "";
display: block;
position: absolute;
width: 100%;
bottom: 0;
}
#learncontent-contents .categorylink__parentitem a:hover .categorylink__parentitem-icn::after, #learncontent-contents .categorylink__parentitem.active .categorylink__parentitem-icn::after {
border-bottom: 3px solid #0041c0;
}
#learncontent-contents .categorylink__parentitem a:hover .categorylink__parentitem-icn svg, #learncontent-contents .categorylink__parentitem.active .categorylink__parentitem-icn svg {
fill: #0041c0;
}
#learncontent-contents .categorylink__child {
-webkit-box-sizing: border-box;
box-sizing: border-box;
display: none;
}
#learncontent-contents .categorylink__child a {
display: block;
}
#learncontent-contents .categorylink__child__top {
-webkit-box-sizing: border-box;
box-sizing: border-box;
background-color: #fff;
border-radius: 3px;
}
#learncontent-contents .categorylink__child__top-label {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
}
#learncontent-contents .categorylink__child__top-description {
margin-top: 2px;
font-weight: normal;
font-size: 12px;
line-height: 14px;
max-height: 28px;
overflow: hidden;
}
#learncontent-contents .categorylink__child__item {
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
#learncontent-contents .categorylink__child__item-label {
font-weight: normal;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#learncontent-contents .categorylink__content {
position: relative;
padding-bottom: 180px;
margin: 0 -112px;
}
#learncontent-contents .categorylink__content::before {
content: "";
display: block;
position: absolute;
width: 100%;
height: 180px;
left: 0;
bottom: 0;
background-color: #f6f6f6;
}
#learncontent-contents .categorylink__content::after {
content: "";
display: block;
position: absolute;
width: 100%;
height: 8px;
left: 0;
bottom: 172px;
background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0));
}
#learncontent-contents .categorylink__parentlist {
text-align: center;
}
#learncontent-contents .categorylink__parentlist__li {
display: inline-block;
width: 112px;
margin: 0 5px;
vertical-align: bottom;
}
#learncontent-contents .categorylink__parentitem-img {
margin-bottom: 10px;
}
#learncontent-contents .categorylink__parentitem-img img {
width: 102px;
}
#learncontent-contents .categorylink__parentitem-label {
font-size: 13px;
line-height: 17px;
height: 34px;
}
#learncontent-contents .categorylink__parentitem-icn {
padding: 8px 0;
}
#learncontent-contents .categorylink__child {
position: absolute;
width: 100%;
left: 0;
z-index: 1;
height: 180px;
padding: 20px 10px;
}
#learncontent-contents .categorylink__child__top {
display: inline-block;
width: 168px;
height: 140px;
padding: 5px 3px;
vertical-align: middle;
}
#learncontent-contents .categorylink__child__top-img img {
width: 80px;
}
#learncontent-contents .categorylink__child__top-label {
font-size: 13px;
line-height: 17px;
height: 34px;
}
#learncontent-contents .categorylink__child__list {
display: inline-block;
vertical-align: middle;
padding: 12px 0;
margin-left: 20px;
max-width: 768px;
text-align: left;
}
#learncontent-contents .categorylink__child__list__li {
display: inline-block;
vertical-align: middle;
width: 192px;
}
#learncontent-contents .categorylink__child__item a {
display: block;
}
#learncontent-contents .categorylink__child__item-in::before {
content: "";
display: inline-block;
height: 58px;
vertical-align: middle;
}
#learncontent-contents .categorylink__child__item-img {
display: inline-block;
vertical-align: middle;
padding: 0 5px;
}
#learncontent-contents .categorylink__child__item-img img {
width: 54px;
}
#learncontent-contents .categorylink__child__item-label {
width: 120px;
display: inline-block;
vertical-align: middle;
font-size: 12px;
line-height: 15px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#learncontent-contents .categorylink__content-in {
padding: 0;
}
#learncontent-contents .categorylink__parentlist {
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
border-top: 1px solid #c1c1c1;
position: relative;
}
#learncontent-contents .categorylink__parentlist::after {
content: "";
display: block;
position: absolute;
width: 100%;
bottom: 0;
left: 0;
border-bottom: 1px solid #c1c1c1;
}
#learncontent-contents .categorylink__parentlist__li {
width: 50%;
-webkit-flex-shrink: 0;
flex-shrink: 0;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
#learncontent-contents .categorylink__parentlist__li:nth-child(2n+1) .categorylink__parentitem {
border-right: 1px solid #c1c1c1;
}
#learncontent-contents .categorylink__parentlist__li:nth-child(2n) .categorylink__child {
left: -100%;
}
#learncontent-contents .categorylink__parentitem {
border-bottom: 1px solid #c1c1c1;
}
#learncontent-contents .categorylink__parentitem.active .categorylink__parentitem-icn svg {
transform: scaleY(-1);
}
#learncontent-contents .categorylink__parentitem-in {
padding: 10px 10px 0;
}
#learncontent-contents .categorylink__parentitem-img {
margin-bottom: 6px;
}
#learncontent-contents .categorylink__parentitem-img img {
width: 108px;
height: 80px;
}
#learncontent-contents .categorylink__parentitem-label {
font-size: 13px;
line-height: 15px;
height: 30px;
}
#learncontent-contents .categorylink__parentitem-icn {
padding: 8px 0;
}
#learncontent-contents .categorylink__child {
width: 100vw;
position: relative;
}
#learncontent-contents .categorylink__child-in {
background-color: #e3e3e3;
border-bottom: 1px solid #c1c1c1;
padding: 20px;
}
#learncontent-contents .categorylink__child__top-in {
display: -webkit-flex;
display: flex;
align-items: center;
}
#learncontent-contents .categorylink__child__top-img {
-webkit-flex-shrink: 0;
flex-shrink: 0;
}
#learncontent-contents .categorylink__child__top-img img {
width: 108px;
height: 80px;
}
#learncontent-contents .categorylink__child__top-label_description {
padding: 0 10px;
-webkit-flex-grow: 1;
flex-grow: 1;
}
#learncontent-contents .categorylink__child__top-label {
font-size: 14px;
line-height: 20px;
}
#learncontent-contents .categorylink__child__list {
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
margin: 10px -5px 0;
}
#learncontent-contents .categorylink__child__list__li {
width: calc(50% - 10px);
-webkit-flex-shrink: 0;
flex-shrink: 0;
margin: 10px 5px 0;
}
#learncontent-contents .categorylink__child__item {
text-align: center;
background-color: #fff;
border-radius: 3px;
}
#learncontent-contents .categorylink__child__item-in {
padding: 5px;
}
#learncontent-contents .categorylink__child__item-img {
margin-bottom: 5px;
}
#learncontent-contents .categorylink__child__item-img img {
width: 60px;
height: 45px;
}
#learncontent-contents .categorylink__child__item-label {
font-size: 12px;
line-height: 15px;
height: 30px;
overflow: hidden;
}
}
/******************** categorylist ********************/
#learncontent-contents .categorylist__item a {
color: #1f1f1f;
text-decoration: none;
display: inline-block;
}
#learncontent-contents .categorylist__item a:hover {
color: #0041c0;
}
#learncontent-contents .categorylist__item-img::before {
content: "";
display: inline-block;
height: 100%;
vertical-align: middle;
}
#learncontent-contents .categorylist__item.parent .categorylist__item-label-main {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
}
#learncontent-contents .categorylist__item.child .categorylist__item-label {
font-weight: normal;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
#learncontent-contents .categorylist__content {
text-align: center;
font-size: 0;
}
#learncontent-contents .categorylist__content::after {
content: "";
display: table;
clear: both;
}
#learncontent-contents .categorylist__content > .categorylist__list {
margin: -40px -20px 0;
display: inline-block;
text-align: left;
}
#learncontent-contents .categorylist__content > .categorylist__list > .categorylist__list__li {
-webkit-box-sizing: border-box;
box-sizing: border-box;
width: 254px;
padding: 0 20px;
margin-top: 40px;
float: left;
}
#learncontent-contents .categorylist__content > .categorylist__list > .categorylist__list__li:nth-child(4n+1) {
clear: both;
}
#learncontent-contents .categorylist__item.parent {
text-align: center;
border-bottom: 2px solid #a8a8a8;
padding-bottom: 13px;
}
#learncontent-contents .categorylist__item.parent .categorylist__item-label-sub {
margin-top: 5px;
font-size: 13px;
line-height: 15px;
overflow: hidden;
font-weight: normal;
height: 30px;
}
#learncontent-contents .categorylist__item.parent .categorylist__item-label-main {
font-size: 20px;
line-height: 24px;
height: 48px;
overflow: hidden;
}
#learncontent-contents .categorylist__item.parent .categorylist__item-img {
margin-bottom: 30px;
height: 92px;
}
#learncontent-contents .categorylist__item.parent .categorylist__item-img img {
max-width: 123px;
max-height: 92px;
}
#learncontent-contents .categorylist__item.parent + .categorylist__list {
margin-top: 12px;
}
#learncontent-contents .categorylist__item.child {
margin-top: 4px;
}
#learncontent-contents .categorylist__item.child .categorylist__item-label-main {
font-size: 12px;
line-height: 14px;
}
#learncontent-contents .categorylist__item.child .categorylist__item-img {
display: none;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
#learncontent-contents .categorylist__content {
border-top: 1px solid #c9c9c9;
}
#learncontent-contents .categorylist__list {
position: relative;
}
#learncontent-contents .categorylist__item {
font-size: 0;
border-bottom: 1px solid #c9c9c9;
}
#learncontent-contents .categorylist__item a {
display: block;
}
#learncontent-contents .categorylist__item-in {
display: -webkit-flex;
display: flex;
}
#learncontent-contents .categorylist__item-img {
width: 64px;
height: 48px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-flex-shrink: 0;
flex-shrink: 0;
text-align: center;
}
#learncontent-contents .categorylist__item-label {
-webkit-flex-grow: 1;
flex-grow: 1;
padding: 0 18px;
white-space: nowrap;
}
#learncontent-contents .categorylist__item-label::before {
content: "";
display: inline-block;
height: 48px;
vertical-align: middle;
}
#learncontent-contents .categorylist__item-label-sub {
display: none;
}
#learncontent-contents .categorylist__item-label-main {
display: inline-block;
vertical-align: middle;
white-space: normal;
}
#learncontent-contents .categorylist__item.parent .categorylist__item-img img {
max-width: 64px;
max-height: 48px;
}
#learncontent-contents .categorylist__item.parent .categorylist__item-label {
font-size: 14px;
line-height: 17px;
}
#learncontent-contents .categorylist__item.parent + .categorylist__list::after {
content: "";
display: block;
position: absolute;
width: 100%;
height: 9px;
left: 0;
top: 0;
background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0));
}
#learncontent-contents .categorylist__item.child {
background-color: #f6f6f6;
}
#learncontent-contents .categorylist__item.child .categorylist__item-img {
padding: 6px 0;
}
#learncontent-contents .categorylist__item.child .categorylist__item-img img {
max-width: 48px;
max-height: 36px;
}
#learncontent-contents .categorylist__item.child .categorylist__item-label {
font-size: 12px;
line-height: 15px;
}
}
/************************** btn style *****************************/
.btn-style2 {
display: inline-block;
height: 45px;
padding: 0 1px;
margin: 0 12px 0 49px;
background-repeat: repeat-x;
background-image: url(productpage-clientlibs/images/btn-product-darkgrey-1px.png);
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-size: 13px;
font-weight: bold;
text-transform: uppercase;
color: #fff;
}
.btn-style2::before, .btn-style2::after {
display: inline-block;
content: "";
height: 45px;
background-repeat: no-repeat;
background-image: url(productpage-clientlibs/images/spr-global-product-db.png);
vertical-align: middle;
}
.btn-style2::before {
width: 51px;
margin-left: -51px;
}
.btn-style2::after {
width: 14px;
margin-right: -14px;
background-position: -371px -72px;
}
.btn-style2 span {
display: inline-block;
vertical-align: middle;
padding-top: 2px;
color: #fff;
}
.type-pdf .btn-style2::before {
background-position: -86px -72px;
}
.type-download .btn-style2::before {
background-position: -314px -72px;
}
.type-spec .btn-style2::before {
background-position: -257px -72px;
}
.type-overview .btn-style2::before {
background-position: -143px -72px;
}
.type-buy .btn-style2::before {
background-position: -143px -72px;
}
.touch-device .btn-style2 span {
padding-top: 0;
}
/************************** support *****************************/
.support_bg a {
color: #0041c0;
}
.support-content {
margin-top: 70px;
}
.support-content::after {
content: "";
display: table;
clear: both;
}
.support-content .col dt {
font-weight: bold;
}
.support-content .col dd.pdf {
background: url(common-clientlibs/images/icn-pdf-large.png) no-repeat left;
}
.support-content .col a {
font-weight: bold;
color: #0041c0 !important;
}
.supportsection .fitch {
margin-top: 45px;
text-align: center;
}
.supportsection .fitch a {
font-weight: bold;
color: #0041c0 !important;
}
.supportsection .fitch a img {
margin-left: 3px;
vertical-align: middle;
max-width: 13px;
max-height: 15px;
width: auto;
height: auto;
}
.supportsection .support-notes {
margin-top: 45px;
}
.supportsection .fitch + .support-notes {
margin-top: 18px;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.support_bg {
min-height: 460px;
}
.support_bg .sectionContents {
padding: 45px 0;
}
.support-content .col {
float: left;
width: 229px;
}
.support-content .col:not(:first-child) {
margin-left: 20px;
}
.support-content .col dt, .support-content .col dd, .support-content .col li {
font-size: 13px;
line-height: 16px;
}
.support-content .col dd:not(:first-child) {
margin-top: 20px;
}
.support-content .col dd.pdf {
padding-left: 37px;
}
.support-content .col li:not(:first-child) {
margin-top: 35px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.support_bg .sectionContents {
padding: 20px 0;
}
.support-title {
text-align: center;
}
.support-title h3 {
margin-top: 0;
}
.support-content {
padding: 0 10px;
margin-top: 0;
}
.support-content .col {
margin-top: 20px;
}
.support-content .col dl::after {
content: "";
display: table;
clear: both;
}
.support-content .col dt, .support-content .col dd, .support-content .col li {
font-size: 0.625rem;
line-height: 0.75rem;
}
.support-content .col dd {
margin-top: 15px;
float: left;
width: 48%;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.support-content .col dd:nth-of-type(even) {
float: right;
}
.support-content .col dd.pdf {
padding-left: 31px;
background-size: 26px 26px;
}
.support-content .col li:not(:first-child) {
margin-top: 5px;
}
.support-notes {
padding: 0 10px;
margin-top: 40px;
}
#learncontent-contents .supportsection .container {
padding: 0;
}
}
/************************** disclaimer *****************************/
.disclaimer-detail .title {
text-align: center;
padding: 15px 60px 20px;
border-bottom: 1px solid #c9c9c9;
margin-bottom: 20px;
}
.disclaimer-detail .title h1, .disclaimer-detail .title h2, .disclaimer-detail .title h3, .disclaimer-detail .title h4, .disclaimer-detail .title h5, .disclaimer-detail .title h6 {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-size: 20px;
font-weight: bold;
line-height: 24px;
}
.disclaimer-detail .spech_lightbox {
margin-bottom: 20px;
}
.disclaimer-detail .content {
padding: 0 40px 40px;
}
.disclaimer-detail .content p.leftmargin {
margin-left: 1.5em;
}
.disclaimer-detail .firmware_download {
padding-top: 20px;
border-top: 1px solid #c9c9c9;
text-align: right;
}
.disclaimer-detail .firmware_download .check-accept {
display: inline-block;
margin-right: 20px;
font-size: 12px;
line-height: 14px;
color: #5d5d5d;
}
.disclaimer-detail .firmware_download .check-accept > span {
display: inline-block;
min-height: 16px;
padding-top: 1px;
padding-left: 21px;
background-repeat: no-repeat;
background-position: left top;
background-image: url(common-clientlibs/images/img-checkbox-inactive.png);
}
.disclaimer-detail .firmware_download .check-accept input {
position: absolute;
top: 0;
left: 0;
filter: alpha(opacity=0) \9;
opacity: 0;
margin: 0;
}
.disclaimer-detail .firmware_download .check-accept label {
display: inline-block;
min-height: 16px;
padding-top: 1px;
padding-left: 21px;
cursor: pointer;
position: relative;
color: #1f1f1f;
}
.disclaimer-detail .firmware_download .check-accept label > span {
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
width: 16px;
height: 16px;
background-repeat: no-repeat;
background-position: left top;
background-image: url(common-clientlibs/images/img-checkbox-off-hc.png);
}
.disclaimer-detail .firmware_download .check-accept label.checked > span {
background-image: url(common-clientlibs/images/img-checkbox-on-hc.png);
}
.disclaimer-detail .firmware_download .main-btn {
display: inline-block;
visibility: hidden;
}
.disclaimer-detail .firmware_download.accepted .main-btn {
visibility: visible;
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.disclaimer-detail .title {
padding: 10px 30px 15px;
margin-bottom: 20px;
}
.disclaimer-detail .title h1, .disclaimer-detail .title h2, .disclaimer-detail .title h3, .disclaimer-detail .title h4, .disclaimer-detail .title h5, .disclaimer-detail .title h6 {
font-size: 1.125rem;
line-height: 1.25rem;
}
.disclaimer-detail .spech_lightbox {
margin-bottom: 15px;
}
.disclaimer-detail .content {
padding: 0 10px 20px;
}
.disclaimer-detail .firmware_download {
padding-top: 15px;
border-top: 1px solid #c9c9c9;
text-align: right;
}
.disclaimer-detail .check-accept {
margin-right: 20px;
font-size: 0.625rem;
line-height: 0.75rem;
}
.disclaimer-detail .check-accept input {
font-size: 18px;
opacity: 0;
z-index: 2;
}
}
/*
recipe
*/
/* appearance reset */
.ingredients button, .ingredients select, .ingredients input[type="checkbox"], .ingredients input[type="text"], .quickfilter button, .quickfilter select, .quickfilter input[type="checkbox"], .quickfilter input[type="text"], .recipelistcomplex button, .recipelistcomplex select, .recipelistcomplex input[type="checkbox"], .recipelistcomplex input[type="text"] {
-webkit-appearance: none;
appearance: none;
border: none;
border-radius: 0;
background: none;
padding: 0;
margin: 0;
}
/* cookingtime */
.cookingtime__container {
display: -webkit-flex;
display: flex;
align-items: center;
}
.cookingtime__icon {
margin-right: 10px;
-webkit-flex-shrink: 0;
flex-shrink: 0;
}
.cookingtime__text {
font-weight: bold;
line-height: 1.41;
}
.cookingtime__text__time, .cookingtime__text__fw, .cookingtime__text__date {
display: inline-block;
}
.cookingtime__text__time:not(:last-child)::after, .cookingtime__text__fw:not(:last-child)::after, .cookingtime__text__date:not(:last-child)::after {
content: "";
display: inline-block;
}
.cookingtime__difficulty {
-webkit-flex-grow: 1;
flex-grow: 1;
-webkit-flex-shrink: 0;
flex-shrink: 0;
text-align: right;
font-weight: bold;
line-height: 1.41;
}
.cookingtime__difficulty::before {
content: "";
display: inline-block;
width: 20px;
}
.cookingtime__difficulty__label {
color: #484848;
}
.cookingtime__difficulty__label::after {
content: " ";
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.cookingtime__text {
font-size: 14px;
}
.cookingtime__text__time:not(:last-child)::after, .cookingtime__text__fw:not(:last-child)::after, .cookingtime__text__date:not(:last-child)::after {
width: 20px;
}
.cookingtime__difficulty {
font-size: 14px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.cookingtime__text {
font-size: 12px;
}
.cookingtime__text__time:not(:last-child)::after, .cookingtime__text__fw:not(:last-child)::after, .cookingtime__text__date:not(:last-child)::after {
width: 10px;
}
.cookingtime__difficulty {
font-size: 12px;
}
}
/* nutrition */
.nutrition__title {
margin-bottom: 10px;
font-weight: bold;
}
.nutrition__list {
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
}
.nutrition__list__item {
box-sizing: border-box;
border: 1px solid #c1c1c1;
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
text-align: center;
}
.nutrition__list__item__layout {
position: relative;
padding-top: 100%;
}
.nutrition__list__item__layout__in {
position: absolute;
top: 0;
width: 100%;
height: 100%;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
-webkit-justify-content: center;
justify-content: center;
-webkit-align-items: center;
align-items: center;
}
.nutrition__list__item__value {
margin-top: 5px;
color: #484848;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.nutrition__title {
font-size: 16px;
line-height: 20px;
}
.nutrition__list {
margin: 0 -10px;
}
.nutrition__list__wrapper {
margin-top: -20px;
}
.nutrition__list__item {
margin: 20px 10px 0;
width: calc(12.5% - 20px);
}
.nutrition__list__item__label {
font-size: 16px;
}
.nutrition__list__item__value {
font-size: 30px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.nutrition__title {
font-size: 12px;
line-height: 17px;
}
.nutrition__list {
margin: 0 -5px;
}
.nutrition__list__wrapper {
margin-top: -10px;
}
.nutrition__list__item {
margin: 10px 5px 0;
width: calc(25% - 10px);
}
.nutrition__list__item__label {
font-size: 10px;
}
.nutrition__list__item__value {
font-size: 16px;
}
}
/* ingredients */
.ingredients__title {
margin-bottom: 20px;
}
.ingredients__servings {
margin-bottom: 20px;
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
display: -webkit-flex;
display: flex;
align-items: center;
}
.ingredients__servings__btn {
position: relative;
background-color: #707070 !important;
border-radius: 3px !important;
overflow: hidden;
text-indent: -9999px;
}
.ingredients__servings__btn::before, .ingredients__servings__btn::after {
content: "";
display: block;
box-sizing: border-box;
position: absolute;
margin: auto;
top: 0;
bottom: 0;
left: 0;
right: 0;
background-color: #fff;
}
.ingredients__servings__btn::before {
height: 2px;
border: 1px solid #fff;
}
.ingredients__servings__btn.ingredients-decrease::after {
display: none;
}
.ingredients__servings__btn.ingredients-increase::after {
width: 2px;
border: 1px solid #fff;
}
.ingredients__content {
font-weight: bold;
}
.ingredients__content::before {
content: "";
display: table;
}
.ingredients__content__block__list {
color: #484848;
}
.ingredients__content__block__list__item__data:first-child::after {
content: " ";
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.ingredients__servings {
margin-top: -3px;
}
.ingredients__servings__label {
margin-right: 15px;
font-size: 18px;
-webkit-order: 0;
order: 0;
}
.ingredients__servings__count {
font-size: 24px;
-webkit-order: 2;
order: 2;
margin: 0 14px;
}
.ingredients__servings__btn {
width: 24px;
height: 24px;
}
.ingredients__servings__btn::before {
width: 12px;
}
.ingredients__servings__btn.ingredients-increase {
-webkit-order: 3;
order: 3;
}
.ingredients__servings__btn.ingredients-increase::after {
height: 12px;
}
.ingredients__content {
display: -webkit-flex;
display: flex;
margin: 0 -10px;
}
.ingredients__content__col {
box-sizing: border-box;
padding: 0 10px;
width: 50%;
margin-top: -20px;
}
.ingredients__content__block {
margin-top: 20px;
font-size: 16px;
line-height: 20px;
}
.ingredients__content__block__title {
padding-bottom: 10px;
}
.ingredients__content__block__list {
border-left: 1px solid #c1c1c1;
border-right: 1px solid #c1c1c1;
border-top: 1px solid #c1c1c1;
}
.ingredients__content__block__list__item {
padding: 10px;
border-bottom: 1px solid #c1c1c1;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.ingredients__servings {
background-color: #efefef;
padding: 5px 10px;
margin-top: -1px;
}
.ingredients__servings__label {
font-size: 14px;
margin-right: .25em;
}
.ingredients__servings__count {
font-size: 16px;
flex-grow: 1;
}
.ingredients__servings__btn {
width: 35px;
height: 25px;
margin-left: 10px !important;
}
.ingredients__servings__btn::before {
width: 13px;
}
.ingredients__servings__btn.ingredients-increase::after {
height: 13px;
}
.ingredients__content {
margin-top: -20px;
}
.ingredients__content__block {
margin-top: 20px;
font-size: 12px;
line-height: 17px;
}
.ingredients__content__block__title {
margin-bottom: 10px;
}
.ingredients__content__block__list {
margin-left: 1.5em;
list-style: disc;
}
.ingredients__content__block__list__item {
margin-top: 5px;
}
}
/* stepsofmaking */
.stepsofmaking__content::before {
content: "";
display: table;
}
.stepsofmaking__content__item {
box-sizing: border-box;
}
.stepsofmaking__content__item__tx__label {
font-weight: bold;
}
.stepsofmaking__content__item__img__video {
height: auto !important;
padding-top: 56.25%;
position: relative;
}
.stepsofmaking__content__item__img__video .youtube-placeholder {
position: absolute;
top: 0;
width: 100%;
height: 100%;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.stepsofmaking__title {
margin-bottom: 20px;
}
.stepsofmaking__content__in {
margin: -20px -10px 0;
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
}
.stepsofmaking__content__item {
width: 50%;
padding: 0 10px;
margin-top: 20px;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
}
.stepsofmaking__content__item__tx {
-webkit-flex-grow: 1;
flex-grow: 1;
-webkit-flex-shrink: 0;
flex-shrink: 0;
-webkit-flex-basis: auto;
flex-basis: auto;
}
.stepsofmaking__content__item__tx__label {
margin-bottom: 8px;
font-size: 16px;
line-height: 20px;
}
.stepsofmaking__content__item__img {
margin-top: 20px;
-webkit-flex-shrink: 0;
flex-shrink: 0;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.stepsofmaking__title {
margin-bottom: 10px;
}
.stepsofmaking__content__in {
margin-top: -20px;
}
.stepsofmaking__content__item {
margin-top: 20px;
}
.stepsofmaking__content__item__tx__label {
margin-bottom: 5px;
font-size: 12px;
line-height: 17px;
}
.stepsofmaking__content__item__img {
margin-top: 10px;
}
}
/* relatedrecipes */
.relatedrecipes a {
font-weight: normal !important;
color: #1f1f1f !important;
}
.relatedrecipes__content::before {
content: "";
display: table;
}
.relatedrecipes__content__list {
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
}
.relatedrecipes__content__list__item {
box-sizing: border-box;
}
.relatedrecipes__content__list__item .tagscategories {
margin-top: 15px;
}
.relatedrecipes__content__list__item__txt__name, .relatedrecipes__content__list__item__txt__description {
display: block;
}
.relatedrecipes__content__list__item__txt__name {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
}
.relatedrecipes__content__list__item .icn-externallink {
vertical-align: middle !important;
margin-left: 7px;
}
.relatedrecipes__content__list__item__more__in {
position: relative;
padding-top: 100%;
}
.relatedrecipes__content__list__item__more__in > span {
position: absolute;
width: 100%;
display: block;
text-align: center;
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
color: #0041C0;
top: 50%;
transform: translateY(-50%);
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.relatedrecipes__container:not(.align-inherit) {
text-align: center;
}
.relatedrecipes__title {
margin-bottom: 20px;
}
.relatedrecipes__content {
display: inline-block;
max-width: 100%;
text-align: left;
}
.relatedrecipes__content__list {
margin: -20px -10px 0;
}
.relatedrecipes__content__list__item {
margin-top: 20px;
padding: 0 10px;
width: 249px;
}
.relatedrecipes__content__list__item__txt__name {
margin-top: 10px;
font-size: 16px;
line-height: 20px;
}
.relatedrecipes__content__list__item__txt__description {
margin-top: 5px;
font-size: 12px;
line-height: 17px;
}
.relatedrecipes__content__list__item__more__in > span {
font-size: 18px;
line-height: 20px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.relatedrecipes__title {
margin-bottom: 10px;
}
.relatedrecipes__content__list {
margin: -20px -5px 0;
}
.relatedrecipes__content__list__item {
margin-top: 20px;
padding: 0 5px;
width: 50%;
}
.relatedrecipes__content__list__item__txt__name {
margin-top: 10px;
font-size: 14px;
line-height: 20px;
}
.relatedrecipes__content__list__item__txt__description {
margin-top: 5px;
font-size: 10px;
line-height: 12px;
}
.relatedrecipes__content__list__item .icn-externallink {
width: 8px;
height: 8px;
}
.relatedrecipes__content__list__item__more__in > span {
font-size: 14px;
line-height: 16.8px;
}
}
/* tagscategories */
.tagscategories::before {
content: "";
display: table;
}
.tagscategories a, .tagscategories .nolink {
display: block;
color: #1f1f1f !important;
}
.tagscategories a > span, .tagscategories .nolink > span {
font-size: 12px;
font-weight: bold;
line-height: 14px;
display: inline-block;
vertical-align: middle;
}
.tagscategories a:hover {
color: #0041C0 !important;
}
.tagscategories__container {
margin-top: -10px;
}
.tagscategories__tags__list, .tagscategories__categories__list {
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
}
.tagscategories__tags__list__item {
margin-top: 10px;
}
.tagscategories__tags__list__item:not(:last-child) a::after, .tagscategories__tags__list__item:not(:last-child) .nolink::after {
content: "";
box-sizing: border-box;
display: inline-block;
border-left: 1px solid #484848;
height: 14px;
width: 1px;
vertical-align: middle;
}
.tagscategories__categories__list__item {
border: 1px solid #707070;
border-radius: 2px;
margin-top: 10px;
box-sizing: border-box;
max-width: 100%;
}
.tagscategories__categories__list__item:not(:last-child) {
margin-right: 10px;
}
.tagscategories__categories__list__item a, .tagscategories__categories__list__item .nolink {
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
padding: 0 10px;
}
.tagscategories__categories__list__item a > span, .tagscategories__categories__list__item .nolink > span {
font-weight: normal;
white-space: nowrap;
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.tagscategories__tags__list__item:not(:last-child) a::after, .tagscategories__tags__list__item:not(:last-child) .nolink::after {
margin: 0 8px;
}
.tagscategories__categories__list__item a, .tagscategories__categories__list__item .nolink {
height: 24px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.tagscategories__tags__list__item:not(:last-child) a::after, .tagscategories__tags__list__item:not(:last-child) .nolink::after {
margin: 0 15px;
}
.tagscategories__categories__list__item a, .tagscategories__categories__list__item .nolink {
height: 28px;
}
}
/* customize-recipecheckbox */
.customize-recipecheckbox {
display: inline-block;
position: relative;
width: 14px;
height: 14px;
border-radius: 2px;
}
.customize-recipecheckbox input[type="checkbox"] {
width: 100%;
height: 100%;
border-radius: 2px;
}
.customize-recipecheckbox input[type="checkbox"]:checked + .customize-recipecheckbox__box {
background-color: #707070;
}
.customize-recipecheckbox input[type="checkbox"]:checked + .customize-recipecheckbox__box::after {
content: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI5LjMxMyIgaGVpZ2h0PSI4LjA1NiIgdmlld0JveD0iMCAwIDkuMzEzIDguMDU2Ij4KICA8ZyBpZD0iY2hlY2tlZCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTc3OC4zNDQgLTEwMTMuMDc2KSI+CiAgICA8cGF0aCBpZD0iY2hlY2tlZC0yIiBkYXRhLW5hbWU9ImNoZWNrZWQiIGQ9Ik03LjU4Myw2Mi41MDcsMi44NzUsNjguMDQuNDE3LDY1LjE1MSwwLDY1LjY0MSwyLjg3NSw2OS4wMiw4LDYzWiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNzc5IDk1MS4zNDEpIiBmaWxsPSIjZmZmIiBzdHJva2U9IiNmZmYiIHN0cm9rZS13aWR0aD0iMSIvPgogIDwvZz4KPC9zdmc+);
position: absolute;
margin: auto;
left: 0;
bottom: 0;
right: 0;
top: 0;
width: 9.313px;
height: 8.056px;
font-size: 0;
}
.customize-recipecheckbox__box {
display: block;
box-sizing: border-box;
border: 1px solid #707070;
border-radius: 2px;
position: absolute;
background-color: #fff;
width: 100%;
height: 100%;
top: 0;
left: 0;
}
/* quickfilter */
.quickfilter__container {
position: relative;
}
.quickfilter__bar {
background-color: #efefef;
}
.quickfilter__bar__in button {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
cursor: pointer;
display: -webkit-flex;
display: flex;
align-items: center;
}
.quickfilter__bar__in button::after {
font-size: 0;
}
.quickfilter__bar__in button[aria-expanded="true"]::after {
transform: rotate(180deg);
}
.quickfilter__panel {
position: absolute;
background-color: #f6f6f6;
width: 100%;
z-index: 1;
overflow: hidden;
display: none;
}
.quickfilter__panel::before, .quickfilter__panel::after {
content: "";
display: block;
position: absolute;
left: 0;
width: 100%;
}
.quickfilter__panel::before {
top: 0;
border-top: 1px solid #c1c1c1;
}
.quickfilter__panel::after {
bottom: 0;
border-bottom: 1px solid #c1c1c1;
}
.quickfilter__panel[aria-hidden="false"] {
z-index: 20;
}
.quickfilter__panel__col__title {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
}
.quickfilter__panel__submit__btn {
text-align: center;
}
.quickfilter__panel__submit__btn button {
background-color: #0041c0;
border-radius: 2px;
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
text-transform: uppercase;
color: #fff;
display: -webkit-inline-flex;
display: inline-flex;
-webkit-align-items: center;
align-items: center;
cursor: pointer;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.quickfilter__container:not(.no-padding-top) {
padding-top: 45px;
}
.quickfilter__bar__in {
height: 48px;
margin: auto;
width: 976px;
display: -webkit-flex;
display: flex;
align-items: center;
}
.quickfilter__bar__in button {
font-size: 20px;
}
.quickfilter__bar__in button::after {
content: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOS4yNDQiIGhlaWdodD0iOS42MjIiIHZpZXdCb3g9IjAgMCAxOS4yNDQgOS42MjIiPgogIDxnIGlkPSJhcnJvdy1kcm9wLWRvd24iIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE5LjI0NCA5LjYyMikgcm90YXRlKDE4MCkiPgogICAgPHBhdGggZD0iTTAsNjMuNzVsOS42MjIsOS42MjIsOS42MjItOS42MjJaIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxOS4yNDQgNzMuMzcyKSByb3RhdGUoMTgwKSIgZmlsbD0iIzFmMWYxZiIvPgogIDwvZz4KPC9zdmc+);
width: 19.244px;
height: 9.622px;
}
.quickfilter__bar__in button > span::after {
content: "";
display: inline-block;
width: 10px;
}
.quickfilter__panel__in {
padding: 20px 0;
margin: auto;
width: 976px;
}
.quickfilter__panel__row {
display: -webkit-flex;
display: flex;
justify-content: center;
}
.quickfilter__panel__row:not(:first-of-type) {
margin-top: 20px;
border-top: 1px solid #c1c1c1;
}
.quickfilter__panel__col {
position: relative;
padding: 18px 0;
}
.quickfilter__panel__col + .quickfilter__panel__col::after {
content: "";
display: block;
height: 100%;
border-left: 1px solid #c1c1c1;
position: absolute;
top: 0;
left: 0;
}
.quickfilter__panel__col-md-3 {
width: 25%;
}
.quickfilter__panel__col-md-12 {
width: 100%;
}
.quickfilter__panel__col-md-12 .quickfilter__panel__checkboxes__list__item {
max-width: 25%;
flex-basis: 25%;
}
.quickfilter__panel__col__title {
padding: 0 20px;
margin-bottom: 15px;
font-size: 16px;
line-height: 20px;
}
.quickfilter__panel__checkboxes__list {
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
}
.quickfilter__panel__checkboxes__list__item {
box-sizing: border-box;
min-height: 24px;
margin-top: 10px;
padding: 0 20px;
width: 244px;
}
.quickfilter__panel__checkboxes__list__item__checkbox {
vertical-align: middle;
margin-right: 10px;
}
.quickfilter__panel__checkboxes__list__item__label {
font-weight: bold;
font-size: 13px;
line-height: 15px;
color: #484848;
}
.quickfilter__panel__checkboxes.limitedheight {
max-height: 170px;
overflow: auto;
}
.quickfilter__panel__multipleselect {
display: none;
}
.quickfilter__panel__submit {
margin-top: 20px;
}
.quickfilter__panel__submit__btn button {
height: 35px;
padding: 0 20px;
font-size: 16px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.quickfilter__container:not(.no-padding-top) {
padding-top: 30px;
}
.quickfilter__container.no-padding-top {
margin-top: -15px;
}
.quickfilter__bar__in button {
height: 42px;
font-size: 16px;
width: 100%;
padding: 0 10px;
text-align: left;
}
.quickfilter__bar__in button::after {
content: "";
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOS4yNDQiIGhlaWdodD0iOS42MjIiIHZpZXdCb3g9IjAgMCAxOS4yNDQgOS42MjIiPgogIDxnIGlkPSJhcnJvdy1kcm9wLWRvd24iIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE5LjI0NCA5LjYyMikgcm90YXRlKDE4MCkiPgogICAgPHBhdGggZD0iTTAsNjMuNzVsOS42MjIsOS42MjIsOS42MjItOS42MjJaIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxOS4yNDQgNzMuMzcyKSByb3RhdGUoMTgwKSIgZmlsbD0iIzFmMWYxZiIvPgogIDwvZz4KPC9zdmc+);
background-repeat: no-repeat;
background-size: contain;
width: 9px;
height: 4.5px;
}
.quickfilter__bar__in button > span {
-webkit-flex-grow: 1;
flex-grow: 1;
}
.quickfilter__panel__in {
padding: 10px;
}
.quickfilter__panel__col {
margin-bottom: 15px;
}
.quickfilter__panel__col__title {
font-size: 15px;
margin-bottom: 10px;
}
.quickfilter__panel__checkboxes {
display: none;
}
.quickfilter__panel__multipleselect {
border: 1px solid #707070;
border-radius: 2px;
background-color: #fff;
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
}
.quickfilter__panel__multipleselect::after {
content: "";
display: block;
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOS4yNDQiIGhlaWdodD0iOS42MjIiIHZpZXdCb3g9IjAgMCAxOS4yNDQgOS42MjIiPgogIDxnIGlkPSJhcnJvdy1kcm9wLWRvd24iIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE5LjI0NCA5LjYyMikgcm90YXRlKDE4MCkiPgogICAgPHBhdGggZD0iTTAsNjMuNzVsOS42MjIsOS42MjIsOS42MjItOS42MjJaIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxOS4yNDQgNzMuMzcyKSByb3RhdGUoMTgwKSIgZmlsbD0iIzcwNzA3MCIvPgogIDwvZz4KPC9zdmc+Cg==);
background-repeat: no-repeat;
background-size: contain;
width: 9px;
height: 4.5px;
font-size: 0;
margin: 0 10px;
}
.quickfilter__panel__multipleselect select {
font-size: 16px;
width: 100%;
height: 42px;
box-sizing: border-box;
padding: 10px;
color: #707070;
}
.quickfilter__panel__submit {
margin-top: 20px;
margin-bottom: 10px;
}
.quickfilter__panel__submit__btn button {
height: 35px;
padding: 0 20px;
font-size: 12px;
}
}
/* recipelistcomplex */
.recipelistcomplex-header1, .recipelistcomplex-subheader1 {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.recipelistcomplex-header1 {
font-size: 24px;
line-height: 36px;
}
.recipelistcomplex-subheader1 {
font-size: 16px;
line-height: 20px;
}
.recipelistcomplex__layoutcontainer {
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
margin: 0 -10px;
}
.recipelistcomplex__header, .recipelistcomplex__main, .recipelistcomplex__sub {
box-sizing: border-box;
padding-left: 10px;
padding-right: 10px;
}
.recipelistcomplex__header {
width: calc( 100% * 2 / 3);
}
.recipelistcomplex__main {
width: calc( 100% * 2 / 3);
}
.recipelistcomplex__sub {
width: calc( 100% * 1 / 3);
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.recipelistcomplex-header1 {
font-size: 18px;
}
.recipelistcomplex-subheader1 {
font-size: 14px;
line-height: 16.8px;
}
}
/*.recipequery*/
.recipequery::before {
content: "";
display: table;
}
.recipequery__list {
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
margin-top: -10px;
}
.recipequery__list__item {
margin-top: 10px;
display: -webkit-flex;
display: flex;
}
.recipequery__list__item:not(:last-child)::after {
content: "";
width: 1px;
box-sizing: border-box;
border-left: 1px solid #1f1f1f;
display: inline-block;
vertical-align: middle;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.recipequery {
margin-bottom: 20px;
}
.recipequery__list__item:not(:last-child)::after {
margin: 0 15px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.recipequery {
margin-bottom: 20px;
}
.recipequery__list__item:not(:last-child)::after {
margin: 0 15px;
}
}
/*.recipelist*/
.recipelist__content {
border-top: 1px solid #a3a3a3;
min-height: 470px;
}
.recipelist__content__list__item {
border-bottom: 1px solid #a3a3a3;
}
.recipelist__content__list__item__in {
display: -webkit-flex;
display: flex;
}
.recipelist__content__list__item__main {
-webkit-order: 1;
order: 1;
}
.recipelist__content__list__item__main__top {
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
}
.recipelist__content__list__item__textarea {
-webkit-order: 1;
order: 1;
}
.recipelist__content__list__item__textarea a {
color: inherit !important;
}
.recipelist__content__list__item__textarea a:hover {
color: #0041C0 !important;
}
.recipelist__content__list__item__title {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
font-size: 16px;
line-height: 22px;
}
.recipelist__content__list__item__description {
font-weight: normal;
font-size: 14px;
line-height: 20px;
}
.recipelist__content__list__item__image img {
width: 100%;
height: auto;
}
.recipelist__content__searchtips {
display: none;
margin-top: 30px;
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
}
.recipelist__content__searchtips ul, .recipelist__content__searchtips ol {
margin-left: 1.5em;
}
.recipelist__content__searchtips ul {
list-style: disc;
}
.recipelist__content__searchtips ol {
list-style: decimal;
}
.recipelist__content.noresults .recipelist__content__searchtips {
display: block;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.recipelist__title {
margin-bottom: 20px;
}
.recipelist__content__list__item__in {
padding: 20px 0;
margin: 0 -10px;
}
.recipelist__content__list__item__main {
width: 409px;
margin: 0 10px;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
}
.recipelist__content__list__item__main__top {
-webkit-flex-grow: 1;
flex-grow: 1;
margin-bottom: 20px;
}
.recipelist__content__list__item__main__top .blogdate {
margin-bottom: 5px;
}
.recipelist__content__list__item__title, .recipelist__content__list__item__description {
margin-top: 10px;
}
.recipelist__content__list__item__image {
width: 215px;
margin: 0 10px;
}
.recipelist__content__searchtips {
font-size: 16px;
line-height: 24px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.recipelist__title {
margin-bottom: 10px;
}
.recipelist__content__list__item__in {
padding: 10px 0 20px;
-webkit-flex-direction: column;
flex-direction: column;
}
.recipelist__content__list__item__main__btm {
margin-top: 15px;
}
.recipelist__content__list__item__image {
margin-bottom: 10px;
}
.recipelist__content__list__item__title, .recipelist__content__list__item__description {
margin-top: 10px;
}
.recipelist__content__searchtips {
font-size: 15px;
line-height: 17px;
}
}
/*.recipepagination*/
.recipepagination {
text-align: center;
}
.recipepagination__in {
display: -webkit-inline-flex;
display: inline-flex;
}
.recipepagination__pagelist, .recipepagination__pagenum {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
}
.recipepagination__prev, .recipepagination__next {
display: -webkit-flex;
display: flex;
font-size: 0;
}
.recipepagination__prev.disabled, .recipepagination__next.disabled {
visibility: hidden;
}
.recipepagination__prev {
-webkit-order: 0;
order: 0;
}
.recipepagination__prev__prev {
margin: 0 10px;
}
.recipepagination__next {
-webkit-order: 2;
order: 2;
}
.recipepagination__next__next {
margin: 0 10px;
}
.recipepagination__btn__box {
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
-webkit-justify-content: center;
justify-content: center;
width: 35px;
height: 35px;
border-radius: 2px;
box-sizing: border-box;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.recipepagination {
margin-top: 45px;
}
.recipepagination__pagelist {
display: -webkit-flex;
display: flex;
margin: 0 25px;
}
.recipepagination__pagelist__item__box {
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
-webkit-justify-content: center;
justify-content: center;
border-radius: 2px;
box-sizing: border-box;
width: 35px;
height: 35px;
margin: 0 2px;
font-size: 15px;
}
.recipepagination__pagelist__item__box > span {
color: #1f1f1f;
}
.recipepagination__pagelist__item__box.current {
background-color: #707070;
}
.recipepagination__pagelist__item__box.current > span {
color: #fff;
}
.recipepagination__pagenum {
display: none;
}
.recipepagination__prev__first {
display: none;
}
.recipepagination__next__last {
display: none;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.recipepagination {
margin-top: 20px;
}
.recipepagination__in {
width: 100%;
}
.recipepagination__pagelist {
display: none;
}
.recipepagination__pagenum {
flex-grow: 1;
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
-webkit-justify-content: center;
justify-content: center;
height: 35px;
color: #707070;
}
.recipepagination__pagenum__current {
color: #1f1f1f;
}
.recipepagination__prev__prev .recipepagination__btn__box > span {
width: 9px;
background: url("/etc/designs/panasonic/common-clientlibs/images/img-arrow-grey-left-m.png") no-repeat left top;
background-size: contain;
}
.recipepagination__prev__first .recipepagination__btn__box > span {
width: 15px;
background: url("/etc/designs/panasonic/common-clientlibs/images/img-arrow-grey-left-m.png") no-repeat left top, url("/etc/designs/panasonic/common-clientlibs/images/img-arrow-grey-left-m.png") no-repeat 6px top;
background-size: contain;
}
.recipepagination__next__next .recipepagination__btn__box > span {
width: 9px;
background: url("/etc/designs/panasonic/common-clientlibs/images/img-arrow-grey-right-m.png") no-repeat right top;
background-size: contain;
}
.recipepagination__next__last .recipepagination__btn__box > span {
width: 15px;
background: url("/etc/designs/panasonic/common-clientlibs/images/img-arrow-grey-right-m.png") no-repeat right 0 top, url("/etc/designs/panasonic/common-clientlibs/images/img-arrow-grey-right-m.png") no-repeat right 6px top;
background-size: contain;
}
.recipepagination__btn__box {
border: 1px solid #707070;
}
.recipepagination__btn__box > span {
height: 13px;
}
.recipepagination__btn__box img {
opacity: 0;
}
}
/*.recipesearch*/
.recipesearch__content__in {
display: -webkit-flex;
display: flex;
}
.recipesearch__content__inputtext {
-webkit-flex-grow: 1;
flex-grow: 1;
}
.recipesearch__content__inputtext input[type="text"] {
border: 1px solid #707070;
border-radius: 2px;
background-color: #fff;
box-sizing: border-box;
width: calc( 100% - 10px);
height: 35px;
padding: 5px 10px;
font-size: 16px;
}
.recipesearch__content__submit button {
border-radius: 2px;
background-color: #707070;
box-sizing: border-box;
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
-webkit-justify-content: center;
justify-content: center;
width: 45px;
height: 35px;
}
.recipesearch__content__submit button img {
width: 17px;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.recipesearch__title {
margin-bottom: 20px;
text-align: center;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.recipesearch {
margin-top: 30px;
}
.recipesearch__title {
margin-bottom: 10px;
}
}
/*.recipeproducts*/
.recipeproducts__content__list {
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
margin: -10px -5px 0;
}
.recipeproducts__content__list__item {
box-sizing: border-box;
width: calc(50% - 10px);
border-radius: 2px;
position: relative;
text-align: center;
min-height: 160px;
padding: 5px 5px 10px;
margin: 10px 5px 0;
}
.recipeproducts__content__list__item label {
cursor: pointer;
}
.recipeproducts__content__list__item__checkbox {
position: absolute;
top: 10px;
left: 10px;
}
.recipeproducts__content__list__item__image, .recipeproducts__content__list__item__label {
display: block;
}
.recipeproducts__content__list__item__image {
margin-bottom: 5px;
}
.recipeproducts__content__list__item__image img {
width: 130px;
height: auto;
}
.recipeproducts__content__list__item__label {
font-weight: bold;
font-size: 12px;
line-height: 17px;
}
.recipeproducts__content__submit {
text-align: center;
}
.recipeproducts__content__submit button {
background-color: #707070;
border-radius: 2px;
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
text-transform: uppercase;
color: #fff;
display: -webkit-inline-flex;
display: inline-flex;
-webkit-align-items: center;
align-items: center;
-webkit-justify-content: center;
justify-content: center;
height: 35px;
box-sizing: border-box;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.recipeproducts:not(:first-child) {
margin-top: 45px;
}
.recipeproducts__title {
margin-bottom: 20px;
text-align: center;
}
.recipeproducts__content {
padding: 20px 10px;
border-radius: 2px;
border: 1px solid #A3A3A3;
}
.recipeproducts__content__list__item.checked, .recipeproducts__content__list__item:hover {
background-color: #f6f6f6;
}
.recipeproducts__content__submit {
margin-top: 30px;
}
.recipeproducts__content__submit button {
width: 100%;
font-size: 16px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.recipeproducts {
margin: 30px -10px;
background-color: #f6f6f6;
}
.recipeproducts__in {
padding: 20px 10px;
}
.recipeproducts__title {
margin-bottom: 10px;
}
.recipeproducts__content__list__item {
border: 1px solid #C1C1C1;
}
.recipeproducts__content__list__item.checked {
border-color: #707070;
background-color: #fff;
}
.recipeproducts__content__submit {
margin-top: 20px;
}
.recipeproducts__content__submit button {
padding: 0 20px;
font-size: 12px;
}
}
/*
imggallery
*/
#colorbox, #cboxOverlay, #cboxWrapper {
position: absolute;
top: 0;
left: 0;
z-index: 9999;
overflow: hidden;
-webkit-transform: translate3d(0, 0, 0);
}
#cboxWrapper {
max-width: none;
}
#cboxOverlay {
position: fixed;
width: 100%;
height: 100%;
}
#cboxMiddleLeft, #cboxBottomLeft {
clear: left;
}
#cboxContent {
position: relative;
}
#cboxLoadedContent {
overflow: auto;
-webkit-overflow-scrolling: touch;
}
#cboxTitle {
margin: 0;
}
#cboxLoadingOverlay, #cboxLoadingGraphic {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow {
cursor: pointer;
}
.cboxPhoto {
float: left;
margin: auto;
border: 0;
display: block;
max-width: none;
-ms-interpolation-mode: bicubic;
}
.cboxIframe {
width: 100%;
height: 100%;
display: block;
border: 0;
padding: 0;
margin: 0;
}
#colorbox, #cboxContent, #cboxLoadedContent {
box-sizing: content-box;
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
}
#cboxOverlay {
background-color: #1f1f1f;
}
#cboxCurren, #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {
display: none !important;
}
#colorbox {
color: #fff;
}
html:not(.pressTabkey) #colorbox:focus {
outline: none;
}
@media (min-width: 641px), (min-device-width: 1281px) {
#cboxContent {
max-width: 100%;
}
}
button.commonbtn {
border: none;
background: none;
padding: 0;
margin: 0;
cursor: pointer;
}
.commonbtn {
display: block;
border-radius: 3px;
box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.2);
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
}
.commonbtn .label, .commonbtn .icon {
-webkit-flex-shrink: 0;
flex-shrink: 0;
}
.commonbtn .label {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
font-size: 13px;
padding: 0 12px;
}
.commonbtn .icon {
position: relative;
}
.commonbtn .icon img {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
margin: auto;
}
.commonbtn.color-dark {
background: linear-gradient(#464444, #262525) !important;
}
.commonbtn.color-dark .label {
color: #fff;
}
.commonbtn.color-dark.type-wtxt .icon::before {
background-color: rgba(255, 255, 255, 0.1);
}
.commonbtn.color-dark.type-wtxt .icon::after {
background-color: rgba(0, 0, 0, 0.3);
}
.commonbtn.type-wtxt .icon::before, .commonbtn.type-wtxt .icon::after {
content: "";
display: block;
height: 100%;
width: 1px;
top: 0;
position: absolute;
}
.commonbtn.type-wtxt .icon::before {
right: -1px;
}
.commonbtn.type-wtxt .icon::after {
right: 0;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.commonbtn .icon {
height: 41px;
width: 41px;
}
.commonbtn.type-wtxt .icon {
width: 37px;
margin-right: 4px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.commonbtn .icon {
height: 29px;
width: 29px;
}
.commonbtn .icon-close img {
width: 8px;
height: 8px;
}
}
.imggallery__container {
background-color: #000;
}
.imggallery__list__item a {
display: block;
overflow: hidden;
}
.imggallery__list__item a:hover .imggallery__list__item__thumb {
-webkit-transform: scale(1.075);
transform: scale(1.075);
}
.imggallery__list__item .imggallery-video__icon {
position: absolute;
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
-webkit-justify-content: center;
justify-content: center;
top: 50%;
left: 50%;
width: 45px;
height: 45px;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
background-color: rgba(0, 0, 0, 0.7);
text-align: center;
border-radius: 50%;
border: solid 2px rgba(255, 255, 255, 0.7);
-webkit-transition: opacity 1s;
transition: opacity 1s;
}
.imggallery__list__item .imggallery-video__icon svg {
width: 100%;
height: 40%;
-webkit-transform: translateX(2px);
transform: translateX(2px);
}
.imggallery__list__item .imggallery-video::after {
content: url(/etc/designs/panasonic/dynamicHomepage-clientlibs/images/icn-play-lg.png);
position: absolute;
display: block;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -47.8%);
transform: translate(-50%, -47.8%);
opacity: .8;
}
.imggallery__list__item__thumb {
display: block;
max-width: none;
width: 100%;
height: auto;
-webkit-transition: transform 0.4s;
transition: transform 0.4s;
}
.imggallery__list__item__thumb.not-loaded + .imggallery-video__icon {
opacity: 0;
}
.imggallery__gbox {
position: relative;
height: 100%;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
-webkit-justify-content: center;
justify-content: center;
max-width: 976px;
box-sizing: border-box;
}
.imggallery__gbox button {
border: none;
background: none;
padding: 0;
margin: 0;
cursor: pointer;
}
.imggallery__gbox__controls, .imggallery__gbox__imagebox, .imggallery__gbox__caption, .imggallery__gbox__relitems {
flex-shrink: 0;
}
.imggallery__gbox__controls {
display: -webkit-flex;
display: flex;
-webkit-flex-direction: row-reverse;
flex-direction: row-reverse;
}
.imggallery__gbox__arrows {
font-size: 0;
}
.imggallery__gbox__arrows__prev, .imggallery__gbox__arrows__next {
display: inline-block;
}
.imggallery__gbox__arrows__prev img, .imggallery__gbox__arrows__next img {
display: block;
}
.imggallery__gbox__imagebox {
position: relative;
text-align: center;
}
.imggallery__gbox__imagebox__in {
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
}
.imggallery__gbox__imagebox__img {
width: auto;
height: auto;
max-width: 100%;
max-height: 100%;
display: block;
margin: auto;
}
.imggallery__gbox__imagebox .video-container {
position: relative;
padding-bottom: 56.25%;
box-sizing: border-box;
}
.imggallery__gbox__imagebox .video-container iframe, .imggallery__gbox__imagebox .video-container .closed {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
}
.imggallery__gbox__imagebox .video-container .closed {
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
}
.imggallery__gbox__imagebox .video-container .closed span {
width: 100%;
}
.imggallery__gbox__caption__in {
background-color: #333;
}
.imggallery__gbox__caption__in a {
color: #6BF0FF;
}
.imggallery__gbox__relitems__in {
background-color: #333;
}
.imggallery__gbox__relitems__list {
display: -webkit-flex;
display: flex;
}
.imggallery__gbox__relitems__list__item {
-webkit-flex-shrink: 0;
flex-shrink: 0;
box-sizing: border-box;
}
.imggallery__gbox__relitems__list__item__link {
border-radius: 3px;
}
.imggallery__gbox__relitems__list__item__img {
font-size: 0;
}
.imggallery__gbox__relitems__list__item__img img {
width: auto;
height: auto;
max-width: 100%;
}
.imggallery__gbox__relitems__list__item__label {
font-family: 'Open Sans Condensed', 'Arial', sans-serif;
font-weight: bold;
color: #fff;
word-wrap: break-word;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.imggallery__list__sizer {
width: 25%;
}
.imggallery__list__item {
width: 25%;
}
.imggallery__list__item-width2 {
width: 50%;
}
.imggallery__list__item-width3 {
width: 75%;
}
.imggallery__list__item-width4 {
width: 100%;
}
.imggallery__gbox {
margin: 0 60px;
padding: 15px 0;
}
.imggallery__gbox__controls {
padding-bottom: 15px;
}
.imggallery__gbox__controls__close, .imggallery__gbox__controls__download {
margin-left: 10px;
}
.imggallery__gbox__arrows__prev, .imggallery__gbox__arrows__next {
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.imggallery__gbox__arrows__prev {
left: -52px;
}
.imggallery__gbox__arrows__next {
right: -52px;
}
.imggallery__gbox__imagebox .video-container {
max-width: 976px;
width: 100%;
}
.imggallery__gbox__caption__in {
padding: 15px;
font-size: 12px;
line-height: 17px;
}
:empty + .imggallery__gbox__relitems .imggallery__gbox__relitems__in {
padding-top: 15px;
}
.imggallery__gbox__relitems__in {
padding: 0 15px 15px;
}
.imggallery__gbox__relitems__list {
margin: 0 -10px;
}
.imggallery__gbox__relitems__list__item {
width: 25%;
padding: 0 10px;
}
.imggallery__gbox__relitems__list__item__link {
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
}
.imggallery__gbox__relitems__list__item__link:hover {
background-color: #454545;
}
.imggallery__gbox__relitems__list__item__img {
-webkit-flex-shrink: 0;
flex-shrink: 0;
width: 123px;
}
.imggallery__gbox__relitems__list__item__label {
padding: 5px 10px;
font-size: 16px;
line-height: 20px;
box-sizing: border-box;
width: calc(100% - 123px);
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.imggallery__list__sizer {
width: 50%;
}
.imggallery__list__item {
width: 50%;
}
.imggallery__list__item-width2 {
width: 100%;
}
.imggallery__list__item-width3 {
width: 100%;
}
.imggallery__list__item-width4 {
width: 100%;
}
.imggallery__gbox {
margin: 0 10px;
padding: 10px 0;
}
.imggallery__gbox__controls {
padding-bottom: 10px;
}
.imggallery__gbox__controls__close, .imggallery__gbox__controls__download {
margin-left: 10px;
}
.imggallery__gbox__arrows {
-webkit-flex-grow: 1;
flex-grow: 1;
}
.imggallery__gbox__arrows__prev, .imggallery__gbox__arrows__next {
position: relative;
}
.imggallery__gbox__arrows__prev img, .imggallery__gbox__arrows__next img {
width: 11px;
height: 29px;
opacity: 0;
}
.imggallery__gbox__arrows__prev::before, .imggallery__gbox__arrows__next::before {
content: url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB3aWR0aD0iMTAuNnB4IgoJIGhlaWdodD0iMTYuN3B4IiB2aWV3Qm94PSIwIDAgMTAuNiAxNi43Ij4KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4KCS5zdDB7ZmlsbDpub25lO3N0cm9rZTojRkZGRkZGO3N0cm9rZS13aWR0aDozO3N0cm9rZS1taXRlcmxpbWl0OjEwO30KPC9zdHlsZT4KPGRlZnM+CjwvZGVmcz4KPHBvbHlsaW5lIGNsYXNzPSJzdDAiIHBvaW50cz0iOS4zLDEuMSAyLjEsOC4zIDkuNSwxNS42ICIvPgo8L3N2Zz4K);
width: 11px;
height: 17px;
display: block;
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
margin: auto;
}
.imggallery__gbox__arrows__next {
margin-left: 35px !important;
}
.imggallery__gbox__arrows__next::before {
-webkit-transform: scaleX(-1);
transform: scaleX(-1);
}
.imggallery__gbox__imagebox .video-container {
width: calc(100vw - 20px);
}
.imggallery__gbox__caption__in {
font-size: 12px;
line-height: 14.4px;
padding: 10px;
}
:empty > .imggallery__gbox__relitems .imggallery__gbox__relitems__in {
padding-top: 10px;
}
.imggallery__gbox__relitems__in {
padding-bottom: 10px;
}
.imggallery__gbox__relitems__list {
-wetkit-justify-content: center;
justify-content: center;
}
.imggallery__gbox__relitems__list__item {
width: 50%;
}
.imggallery__gbox__relitems__list__item__link {
display: block;
text-align: center;
}
.imggallery__gbox__relitems__list__item__label {
display: block;
padding: 0 10px 10px;
font-size: 14px;
line-height: 16.8px;
}
.imggallery__gbox__relitems__list__item__img {
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
-webkit-justify-content: center;
justify-content: center;
height: 80px;
}
.imggallery__gbox__relitems__list__item__img img {
max-height: 100%;
}
}
/*
ext-table-regular
*/
.ext-table-regular {
--tablewidth: 100%;
}
.ext-table-regular .matrix-table-regular {
border-collapse: collapse;
border-spacing: 0;
width: 100%;
}
.ext-table-regular .matrix-table-regular th, .ext-table-regular .matrix-table-regular td {
text-align: left;
vertical-align: top;
}
.ext-table-regular .matrix-table-regular.vmiddle-th th {
vertical-align: middle;
}
.ext-table-regular .matrix-table-regular.vmiddle-td td {
vertical-align: middle;
}
.ext-table-regular .matrix-table-regular.style-dark td, .ext-table-regular .matrix-table-regular.style-dark th {
border: 1px solid #707070;
color: #fff;
}
.ext-table-regular .matrix-table-regular.style-dark th {
background-color: #484848;
}
.ext-table-regular .matrix-table-regular.style-dark td {
background-color: #222222;
}
.ext-table-regular .matrix-table-regular.style-light td, .ext-table-regular .matrix-table-regular.style-light th {
border: 1px solid #C1C1C1;
color: #1f1f1f;
}
.ext-table-regular .matrix-table-regular.style-light th {
background-color: #EFEFEF;
}
.ext-table-regular .matrix-table-regular.style-light td {
background-color: #fff;
}
.ext-table-regular .matrix-table-regular .w1 {
width: 1%;
}
.ext-table-regular .matrix-table-regular .w2 {
width: 2%;
}
.ext-table-regular .matrix-table-regular .w3 {
width: 3%;
}
.ext-table-regular .matrix-table-regular .w4 {
width: 4%;
}
.ext-table-regular .matrix-table-regular .w5 {
width: 5%;
}
.ext-table-regular .matrix-table-regular .w6 {
width: 6%;
}
.ext-table-regular .matrix-table-regular .w7 {
width: 7%;
}
.ext-table-regular .matrix-table-regular .w8 {
width: 8%;
}
.ext-table-regular .matrix-table-regular .w9 {
width: 9%;
}
.ext-table-regular .matrix-table-regular .w10 {
width: 10%;
}
.ext-table-regular .matrix-table-regular .w11 {
width: 11%;
}
.ext-table-regular .matrix-table-regular .w12 {
width: 12%;
}
.ext-table-regular .matrix-table-regular .w13 {
width: 13%;
}
.ext-table-regular .matrix-table-regular .w14 {
width: 14%;
}
.ext-table-regular .matrix-table-regular .w15 {
width: 15%;
}
.ext-table-regular .matrix-table-regular .w16 {
width: 16%;
}
.ext-table-regular .matrix-table-regular .w17 {
width: 17%;
}
.ext-table-regular .matrix-table-regular .w18 {
width: 18%;
}
.ext-table-regular .matrix-table-regular .w19 {
width: 19%;
}
.ext-table-regular .matrix-table-regular .w20 {
width: 20%;
}
.ext-table-regular .matrix-table-regular .w21 {
width: 21%;
}
.ext-table-regular .matrix-table-regular .w22 {
width: 22%;
}
.ext-table-regular .matrix-table-regular .w23 {
width: 23%;
}
.ext-table-regular .matrix-table-regular .w24 {
width: 24%;
}
.ext-table-regular .matrix-table-regular .w25 {
width: 25%;
}
.ext-table-regular .matrix-table-regular .w26 {
width: 26%;
}
.ext-table-regular .matrix-table-regular .w27 {
width: 27%;
}
.ext-table-regular .matrix-table-regular .w28 {
width: 28%;
}
.ext-table-regular .matrix-table-regular .w29 {
width: 29%;
}
.ext-table-regular .matrix-table-regular .w30 {
width: 30%;
}
.ext-table-regular .matrix-table-regular .w31 {
width: 31%;
}
.ext-table-regular .matrix-table-regular .w32 {
width: 32%;
}
.ext-table-regular .matrix-table-regular .w33 {
width: 33%;
}
.ext-table-regular .matrix-table-regular .w34 {
width: 34%;
}
.ext-table-regular .matrix-table-regular .w35 {
width: 35%;
}
.ext-table-regular .matrix-table-regular .w36 {
width: 36%;
}
.ext-table-regular .matrix-table-regular .w37 {
width: 37%;
}
.ext-table-regular .matrix-table-regular .w38 {
width: 38%;
}
.ext-table-regular .matrix-table-regular .w39 {
width: 39%;
}
.ext-table-regular .matrix-table-regular .w40 {
width: 40%;
}
.ext-table-regular .matrix-table-regular .w41 {
width: 41%;
}
.ext-table-regular .matrix-table-regular .w42 {
width: 42%;
}
.ext-table-regular .matrix-table-regular .w43 {
width: 43%;
}
.ext-table-regular .matrix-table-regular .w44 {
width: 44%;
}
.ext-table-regular .matrix-table-regular .w45 {
width: 45%;
}
.ext-table-regular .matrix-table-regular .w46 {
width: 46%;
}
.ext-table-regular .matrix-table-regular .w47 {
width: 47%;
}
.ext-table-regular .matrix-table-regular .w48 {
width: 48%;
}
.ext-table-regular .matrix-table-regular .w49 {
width: 49%;
}
.ext-table-regular .matrix-table-regular .w50 {
width: 50%;
}
.ext-table-regular .matrix-table-regular .w51 {
width: 51%;
}
.ext-table-regular .matrix-table-regular .w52 {
width: 52%;
}
.ext-table-regular .matrix-table-regular .w53 {
width: 53%;
}
.ext-table-regular .matrix-table-regular .w54 {
width: 54%;
}
.ext-table-regular .matrix-table-regular .w55 {
width: 55%;
}
.ext-table-regular .matrix-table-regular .w56 {
width: 56%;
}
.ext-table-regular .matrix-table-regular .w57 {
width: 57%;
}
.ext-table-regular .matrix-table-regular .w58 {
width: 58%;
}
.ext-table-regular .matrix-table-regular .w59 {
width: 59%;
}
.ext-table-regular .matrix-table-regular .w60 {
width: 60%;
}
.ext-table-regular .matrix-table-regular .w61 {
width: 61%;
}
.ext-table-regular .matrix-table-regular .w62 {
width: 62%;
}
.ext-table-regular .matrix-table-regular .w63 {
width: 63%;
}
.ext-table-regular .matrix-table-regular .w64 {
width: 64%;
}
.ext-table-regular .matrix-table-regular .w65 {
width: 65%;
}
.ext-table-regular .matrix-table-regular .w66 {
width: 66%;
}
.ext-table-regular .matrix-table-regular .w67 {
width: 67%;
}
.ext-table-regular .matrix-table-regular .w68 {
width: 68%;
}
.ext-table-regular .matrix-table-regular .w69 {
width: 69%;
}
.ext-table-regular .matrix-table-regular .w70 {
width: 70%;
}
.ext-table-regular .matrix-table-regular .w71 {
width: 71%;
}
.ext-table-regular .matrix-table-regular .w72 {
width: 72%;
}
.ext-table-regular .matrix-table-regular .w73 {
width: 73%;
}
.ext-table-regular .matrix-table-regular .w74 {
width: 74%;
}
.ext-table-regular .matrix-table-regular .w75 {
width: 75%;
}
.ext-table-regular .matrix-table-regular .w76 {
width: 76%;
}
.ext-table-regular .matrix-table-regular .w77 {
width: 77%;
}
.ext-table-regular .matrix-table-regular .w78 {
width: 78%;
}
.ext-table-regular .matrix-table-regular .w79 {
width: 79%;
}
.ext-table-regular .matrix-table-regular .w80 {
width: 80%;
}
.ext-table-regular .matrix-table-regular .w81 {
width: 81%;
}
.ext-table-regular .matrix-table-regular .w82 {
width: 82%;
}
.ext-table-regular .matrix-table-regular .w83 {
width: 83%;
}
.ext-table-regular .matrix-table-regular .w84 {
width: 84%;
}
.ext-table-regular .matrix-table-regular .w85 {
width: 85%;
}
.ext-table-regular .matrix-table-regular .w86 {
width: 86%;
}
.ext-table-regular .matrix-table-regular .w87 {
width: 87%;
}
.ext-table-regular .matrix-table-regular .w88 {
width: 88%;
}
.ext-table-regular .matrix-table-regular .w89 {
width: 89%;
}
.ext-table-regular .matrix-table-regular .w90 {
width: 90%;
}
.ext-table-regular .matrix-table-regular .w91 {
width: 91%;
}
.ext-table-regular .matrix-table-regular .w92 {
width: 92%;
}
.ext-table-regular .matrix-table-regular .w93 {
width: 93%;
}
.ext-table-regular .matrix-table-regular .w94 {
width: 94%;
}
.ext-table-regular .matrix-table-regular .w95 {
width: 95%;
}
.ext-table-regular .matrix-table-regular .w96 {
width: 96%;
}
.ext-table-regular .matrix-table-regular .w97 {
width: 97%;
}
.ext-table-regular .matrix-table-regular .w98 {
width: 98%;
}
.ext-table-regular .matrix-table-regular .w99 {
width: 99%;
}
@media (min-width: 641px), (min-device-width: 1281px), print {
.ext-table-regular .matrix-table-regular.onstyle th, .ext-table-regular .matrix-table-regular.onstyle td {
padding: 10px;
}
}
@media only screen and (max-width: 640px) and (max-device-width: 1280px) {
.ext-table-regular[style*="tablewidth"] {
overflow: auto;
}
.ext-table-regular__in {
min-width: var(--tablewidth);
}
.ext-table-regular .matrix-table-regular.onstyle th, .ext-table-regular .matrix-table-regular.onstyle td {
padding: 10px;
}
}