/*!*******************************************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[2]!./node_modules/findomestic-ui-style/lib/dialog-polyfill/dialog-polyfill.css ***! \*******************************************************************************************************************************************************************************************************************************************************************/ dialog { position: absolute; left: 0; right: 0; width: fit-content; height: fit-content; margin: auto; border: solid; padding: 1em; background: white; color: black; display: block; } dialog:not([open]) { display: none; } dialog + .backdrop { position: fixed; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0,0,0,0.1); } ._dialog_overlay { position: fixed; top: 0; right: 0; bottom: 0; left: 0; } dialog.fixed { position: fixed; top: 50%; transform: translate(0, -50%); } /*!************************************************************************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[2]!./node_modules/findomestic-ui-style/src/fnd-customerarea/extra/scrollbar/jquery.mCustomScrollbar.min.css ***! \************************************************************************************************************************************************************************************************************************************************************************************************/ .mCustomScrollbar{touch-action:pinch-zoom}.mCustomScrollbar.mCS_no_scrollbar,.mCustomScrollbar.mCS_touch_action{touch-action:auto}.mCustomScrollBox{position:relative;overflow:hidden;height:100%;max-width:100%;outline:0;direction:ltr}.mCSB_container{overflow:hidden;width:auto;height:auto}.mCSB_inside>.mCSB_container{margin-right:30px}.mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden{margin-right:0}.mCS-dir-rtl>.mCSB_inside>.mCSB_container{margin-right:0;margin-left:30px}.mCS-dir-rtl>.mCSB_inside>.mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden{margin-left:0}.mCSB_scrollTools{position:absolute;width:16px;height:auto;left:auto;top:0;right:0;bottom:0;opacity:.75;filter:"alpha(opacity=75)";-ms-filter:"alpha(opacity=75)"}.mCSB_outside+.mCSB_scrollTools{right:-26px}.mCS-dir-rtl>.mCSB_inside>.mCSB_scrollTools,.mCS-dir-rtl>.mCSB_outside+.mCSB_scrollTools{right:auto;left:0}.mCS-dir-rtl>.mCSB_outside+.mCSB_scrollTools{left:-26px}.mCSB_scrollTools .mCSB_draggerContainer{position:absolute;top:0;left:0;bottom:0;right:0;height:auto}.mCSB_scrollTools a+.mCSB_draggerContainer{margin:20px 0}.mCSB_scrollTools .mCSB_draggerRail{width:2px;height:100%;margin:0 auto;border-radius:16px}.mCSB_scrollTools .mCSB_dragger{cursor:pointer;width:100%;height:30px;z-index:1}.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{position:relative;width:4px;height:100%;margin:0 auto;border-radius:16px;text-align:center}.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{width:12px}.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{width:8px}.mCSB_scrollTools .mCSB_buttonDown,.mCSB_scrollTools .mCSB_buttonUp{display:block;position:absolute;height:20px;width:100%;overflow:hidden;margin:0 auto;cursor:pointer}.mCSB_scrollTools .mCSB_buttonDown{bottom:0}.mCSB_horizontal.mCSB_inside>.mCSB_container{margin-right:0;margin-bottom:30px}.mCSB_horizontal.mCSB_outside>.mCSB_container{min-height:100%}.mCSB_horizontal>.mCSB_container.mCS_no_scrollbar_x.mCS_x_hidden{margin-bottom:0}.mCSB_scrollTools.mCSB_scrollTools_horizontal{width:auto;height:16px;top:auto;right:0;bottom:0;left:0}.mCustomScrollBox+.mCSB_scrollTools+.mCSB_scrollTools.mCSB_scrollTools_horizontal,.mCustomScrollBox+.mCSB_scrollTools.mCSB_scrollTools_horizontal{bottom:-26px}.mCSB_scrollTools.mCSB_scrollTools_horizontal a+.mCSB_draggerContainer{margin:0 20px}.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail{width:100%;height:2px;margin:7px 0}.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger{width:30px;height:100%;left:0}.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{width:100%;height:4px;margin:6px auto}.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{height:12px;margin:2px auto}.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{height:8px;margin:4px 0}.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft,.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight{display:block;position:absolute;width:20px;height:100%;overflow:hidden;margin:0 auto;cursor:pointer}.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft{left:0}.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight{right:0}.mCSB_container_wrapper{position:absolute;height:auto;width:auto;overflow:hidden;top:0;left:0;right:0;bottom:0;margin-right:30px;margin-bottom:30px}.mCSB_container_wrapper>.mCSB_container{padding-right:30px;padding-bottom:30px;box-sizing:border-box}.mCSB_vertical_horizontal>.mCSB_scrollTools.mCSB_scrollTools_vertical{bottom:20px}.mCSB_vertical_horizontal>.mCSB_scrollTools.mCSB_scrollTools_horizontal{right:20px}.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden+.mCSB_scrollTools.mCSB_scrollTools_vertical{bottom:0}.mCS-dir-rtl>.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside>.mCSB_scrollTools.mCSB_scrollTools_horizontal,.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden+.mCSB_scrollTools~.mCSB_scrollTools.mCSB_scrollTools_horizontal{right:0}.mCS-dir-rtl>.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside>.mCSB_scrollTools.mCSB_scrollTools_horizontal{left:20px}.mCS-dir-rtl>.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside>.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden+.mCSB_scrollTools~.mCSB_scrollTools.mCSB_scrollTools_horizontal{left:0}.mCS-dir-rtl>.mCSB_inside>.mCSB_container_wrapper{margin-right:0;margin-left:30px}.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden>.mCSB_container{padding-right:0}.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden>.mCSB_container{padding-bottom:0}.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside>.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden{margin-right:0;margin-left:0}.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside>.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden{margin-bottom:0}.mCSB_scrollTools,.mCSB_scrollTools .mCSB_buttonDown,.mCSB_scrollTools .mCSB_buttonLeft,.mCSB_scrollTools .mCSB_buttonRight,.mCSB_scrollTools .mCSB_buttonUp,.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{transition:opacity .2s ease-in-out,background-color .2s ease-in-out}.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail,.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar,.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail,.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar{transition:width .2s ease-out .2s,height .2s ease-out .2s,margin-left .2s ease-out .2s,margin-right .2s ease-out .2s,margin-top .2s ease-out .2s,margin-bottom .2s ease-out .2s,opacity .2s ease-in-out,background-color .2s ease-in-out}.mCS-autoHide>.mCustomScrollBox>.mCSB_scrollTools,.mCS-autoHide>.mCustomScrollBox~.mCSB_scrollTools{opacity:0;filter:"alpha(opacity=0)";-ms-filter:"alpha(opacity=0)"}.mCS-autoHide:hover>.mCustomScrollBox>.mCSB_scrollTools,.mCS-autoHide:hover>.mCustomScrollBox~.mCSB_scrollTools,.mCustomScrollBox:hover>.mCSB_scrollTools,.mCustomScrollBox:hover~.mCSB_scrollTools,.mCustomScrollbar>.mCustomScrollBox>.mCSB_scrollTools.mCSB_scrollTools_onDrag,.mCustomScrollbar>.mCustomScrollBox~.mCSB_scrollTools.mCSB_scrollTools_onDrag{opacity:1;filter:"alpha(opacity=100)";-ms-filter:"alpha(opacity=100)"}.mCSB_scrollTools .mCSB_draggerRail{background-color:#000;background-color:rgba(0,0,0,.4);filter:"alpha(opacity=40)";-ms-filter:"alpha(opacity=40)"}.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.75);filter:"alpha(opacity=75)";-ms-filter:"alpha(opacity=75)"}.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.85);filter:"alpha(opacity=85)";-ms-filter:"alpha(opacity=85)"}.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.9);filter:"alpha(opacity=90)";-ms-filter:"alpha(opacity=90)"}.mCSB_scrollTools .mCSB_buttonDown,.mCSB_scrollTools .mCSB_buttonLeft,.mCSB_scrollTools .mCSB_buttonRight,.mCSB_scrollTools .mCSB_buttonUp{background-image:url(mCSB_buttons.png);background-repeat:no-repeat;opacity:.4;filter:"alpha(opacity=40)";-ms-filter:"alpha(opacity=40)"}.mCSB_scrollTools .mCSB_buttonUp{background-position:0 0}.mCSB_scrollTools .mCSB_buttonDown{background-position:0 -20px}.mCSB_scrollTools .mCSB_buttonLeft{background-position:0 -40px}.mCSB_scrollTools .mCSB_buttonRight{background-position:0 -56px}.mCSB_scrollTools .mCSB_buttonDown:hover,.mCSB_scrollTools .mCSB_buttonLeft:hover,.mCSB_scrollTools .mCSB_buttonRight:hover,.mCSB_scrollTools .mCSB_buttonUp:hover{opacity:.75;filter:"alpha(opacity=75)";-ms-filter:"alpha(opacity=75)"}.mCSB_scrollTools .mCSB_buttonDown:active,.mCSB_scrollTools .mCSB_buttonLeft:active,.mCSB_scrollTools .mCSB_buttonRight:active,.mCSB_scrollTools .mCSB_buttonUp:active{opacity:.9;filter:"alpha(opacity=90)";-ms-filter:"alpha(opacity=90)"}.mCS-dark.mCSB_scrollTools .mCSB_draggerRail{background-color:#000;background-color:rgba(0,0,0,.15)}.mCS-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.75)}.mCS-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:rgba(0,0,0,.85)}.mCS-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:rgba(0,0,0,.9)}.mCS-dark.mCSB_scrollTools .mCSB_buttonUp{background-position:-80px 0}.mCS-dark.mCSB_scrollTools .mCSB_buttonDown{background-position:-80px -20px}.mCS-dark.mCSB_scrollTools .mCSB_buttonLeft{background-position:-80px -40px}.mCS-dark.mCSB_scrollTools .mCSB_buttonRight{background-position:-80px -56px}.mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail,.mCS-light-2.mCSB_scrollTools .mCSB_draggerRail{width:4px;background-color:#fff;background-color:rgba(255,255,255,.1);border-radius:1px}.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-light-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{width:4px;background-color:#fff;background-color:rgba(255,255,255,.75);border-radius:1px}.mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-light-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-light-2.mCSB_scrollTools_horizontal .mCSB_draggerRail{width:100%;height:4px;margin:6px auto}.mCS-light-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.85)}.mCS-light-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-light-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.9)}.mCS-light-2.mCSB_scrollTools .mCSB_buttonUp{background-position:-32px 0}.mCS-light-2.mCSB_scrollTools .mCSB_buttonDown{background-position:-32px -20px}.mCS-light-2.mCSB_scrollTools .mCSB_buttonLeft{background-position:-40px -40px}.mCS-light-2.mCSB_scrollTools .mCSB_buttonRight{background-position:-40px -56px}.mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail{background-color:#000;background-color:rgba(0,0,0,.1);border-radius:1px}.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.75);border-radius:1px}.mCS-dark-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.85)}.mCS-dark-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-dark-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.9)}.mCS-dark-2.mCSB_scrollTools .mCSB_buttonUp{background-position:-112px 0}.mCS-dark-2.mCSB_scrollTools .mCSB_buttonDown{background-position:-112px -20px}.mCS-dark-2.mCSB_scrollTools .mCSB_buttonLeft{background-position:-120px -40px}.mCS-dark-2.mCSB_scrollTools .mCSB_buttonRight{background-position:-120px -56px}.mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail,.mCS-light-thick.mCSB_scrollTools .mCSB_draggerRail{width:4px;background-color:#fff;background-color:rgba(255,255,255,.1);border-radius:2px}.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-light-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{width:6px;background-color:#fff;background-color:rgba(255,255,255,.75);border-radius:2px}.mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail{width:100%;height:4px;margin:6px 0}.mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{width:100%;height:6px;margin:5px auto}.mCS-light-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.85)}.mCS-light-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-light-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.9)}.mCS-light-thick.mCSB_scrollTools .mCSB_buttonUp{background-position:-16px 0}.mCS-light-thick.mCSB_scrollTools .mCSB_buttonDown{background-position:-16px -20px}.mCS-light-thick.mCSB_scrollTools .mCSB_buttonLeft{background-position:-20px -40px}.mCS-light-thick.mCSB_scrollTools .mCSB_buttonRight{background-position:-20px -56px}.mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail{background-color:#000;background-color:rgba(0,0,0,.1);border-radius:2px}.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.75);border-radius:2px}.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.85)}.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.9)}.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonUp{background-position:-96px 0}.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonDown{background-position:-96px -20px}.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonLeft{background-position:-100px -40px}.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonRight{background-position:-100px -56px}.mCS-light-thin.mCSB_scrollTools .mCSB_draggerRail{background-color:#fff;background-color:rgba(255,255,255,.1)}.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-light-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{width:2px}.mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail{width:100%}.mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{width:100%;height:2px;margin:7px auto}.mCS-dark-thin.mCSB_scrollTools .mCSB_draggerRail{background-color:#000;background-color:rgba(0,0,0,.15)}.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.75)}.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.85)}.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.9)}.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonUp{background-position:-80px 0}.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonDown{background-position:-80px -20px}.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonLeft{background-position:-80px -40px}.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonRight{background-position:-80px -56px}.mCS-rounded.mCSB_scrollTools .mCSB_draggerRail{background-color:#fff;background-color:rgba(255,255,255,.15)}.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger,.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger,.mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger,.mCS-rounded.mCSB_scrollTools .mCSB_dragger{height:14px}.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-rounded.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{width:14px;margin:0 1px}.mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger,.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger,.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger,.mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger{width:14px}.mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{height:14px;margin:1px 0}.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar,.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{width:16px;height:16px;margin:-1px 0}.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{width:4px}.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar,.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{height:16px;width:16px;margin:0 -1px}.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{height:4px;margin:6px 0}.mCS-rounded.mCSB_scrollTools .mCSB_buttonUp{background-position:0 -72px}.mCS-rounded.mCSB_scrollTools .mCSB_buttonDown{background-position:0 -92px}.mCS-rounded.mCSB_scrollTools .mCSB_buttonLeft{background-position:0 -112px}.mCS-rounded.mCSB_scrollTools .mCSB_buttonRight{background-position:0 -128px}.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.75)}.mCS-rounded-dark.mCSB_scrollTools .mCSB_draggerRail{background-color:#000;background-color:rgba(0,0,0,.15)}.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.85)}.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.9)}.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonUp{background-position:-80px -72px}.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonDown{background-position:-80px -92px}.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonLeft{background-position:-80px -112px}.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonRight{background-position:-80px -128px}.mCS-rounded-dots-dark.mCSB_scrollTools_vertical .mCSB_draggerRail,.mCS-rounded-dots.mCSB_scrollTools_vertical .mCSB_draggerRail{width:4px}.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail,.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail{background-color:transparent;background-position:center}.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAANElEQVQYV2NkIAAYiVbw//9/Y6DiM1ANJoyMjGdBbLgJQAX/kU0DKgDLkaQAvxW4HEvQFwCRcxIJK1XznAAAAABJRU5ErkJggg==);background-repeat:repeat-y;opacity:.3;filter:"alpha(opacity=30)";-ms-filter:"alpha(opacity=30)"}.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail{height:4px;margin:6px 0;background-repeat:repeat-x}.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonUp{background-position:-16px -72px}.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonDown{background-position:-16px -92px}.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonLeft{background-position:-20px -112px}.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonRight{background-position:-20px -128px}.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAALElEQVQYV2NkIAAYSVFgDFR8BqrBBEifBbGRTfiPZhpYjiQFBK3A6l6CvgAAE9kGCd1mvgEAAAAASUVORK5CYII=)}.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonUp{background-position:-96px -72px}.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonDown{background-position:-96px -92px}.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonLeft{background-position:-100px -112px}.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonRight{background-position:-100px -128px}.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-repeat:repeat-y;background-image:linear-gradient(to right,rgba(255,255,255,.5) 0,rgba(255,255,255,0) 100%)}.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{background-repeat:repeat-x;background-image:linear-gradient(to bottom,rgba(255,255,255,.5) 0,rgba(255,255,255,0) 100%)}.mCS-3d-dark.mCSB_scrollTools_vertical .mCSB_dragger,.mCS-3d.mCSB_scrollTools_vertical .mCSB_dragger{height:70px}.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger,.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger{width:70px}.mCS-3d-dark.mCSB_scrollTools,.mCS-3d.mCSB_scrollTools{opacity:1;filter:"alpha(opacity=30)";-ms-filter:"alpha(opacity=30)"}.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d.mCSB_scrollTools .mCSB_draggerRail{border-radius:16px}.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-3d.mCSB_scrollTools .mCSB_draggerRail{width:8px;background-color:#000;background-color:rgba(0,0,0,.2);box-shadow:inset 1px 0 1px rgba(0,0,0,.5),inset -1px 0 1px rgba(255,255,255,.2)}.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-3d.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,.mCS-3d.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#555}.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{width:8px}.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-3d.mCSB_scrollTools_horizontal .mCSB_draggerRail{width:100%;height:8px;margin:4px 0;box-shadow:inset 0 1px 1px rgba(0,0,0,.5),inset 0 -1px 1px rgba(255,255,255,.2)}.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{width:100%;height:8px;margin:4px auto}.mCS-3d.mCSB_scrollTools .mCSB_buttonUp{background-position:-32px -72px}.mCS-3d.mCSB_scrollTools .mCSB_buttonDown{background-position:-32px -92px}.mCS-3d.mCSB_scrollTools .mCSB_buttonLeft{background-position:-40px -112px}.mCS-3d.mCSB_scrollTools .mCSB_buttonRight{background-position:-40px -128px}.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail{background-color:#000;background-color:rgba(0,0,0,.1);box-shadow:inset 1px 0 1px rgba(0,0,0,.1)}.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{box-shadow:inset 0 1px 1px rgba(0,0,0,.1)}.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonUp{background-position:-112px -72px}.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonDown{background-position:-112px -92px}.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonLeft{background-position:-120px -112px}.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonRight{background-position:-120px -128px}.mCS-3d-thick-dark.mCSB_scrollTools,.mCS-3d-thick.mCSB_scrollTools{opacity:1;filter:"alpha(opacity=30)";-ms-filter:"alpha(opacity=30)"}.mCS-3d-thick-dark.mCSB_scrollTools,.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer,.mCS-3d-thick.mCSB_scrollTools,.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer{border-radius:7px}.mCSB_inside+.mCS-3d-thick-dark.mCSB_scrollTools_vertical,.mCSB_inside+.mCS-3d-thick.mCSB_scrollTools_vertical{right:1px}.mCS-3d-thick-dark.mCSB_scrollTools_vertical,.mCS-3d-thick.mCSB_scrollTools_vertical{box-shadow:inset 1px 0 1px rgba(0,0,0,.1),inset 0 0 14px rgba(0,0,0,.5)}.mCS-3d-thick-dark.mCSB_scrollTools_horizontal,.mCS-3d-thick.mCSB_scrollTools_horizontal{bottom:1px;box-shadow:inset 0 1px 1px rgba(0,0,0,.1),inset 0 0 14px rgba(0,0,0,.5)}.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{border-radius:5px;box-shadow:inset 1px 0 0 rgba(255,255,255,.4);width:12px;margin:2px;position:absolute;height:auto;top:0;bottom:0;left:0;right:0}.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{box-shadow:inset 0 1px 0 rgba(255,255,255,.4);height:12px;width:auto}.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#555}.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer{background-color:#000;background-color:rgba(0,0,0,.05);box-shadow:inset 1px 1px 16px rgba(0,0,0,.1)}.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerRail{background-color:transparent}.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonUp{background-position:-32px -72px}.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonDown{background-position:-32px -92px}.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonLeft{background-position:-40px -112px}.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonRight{background-position:-40px -128px}.mCS-3d-thick-dark.mCSB_scrollTools{box-shadow:inset 0 0 14px rgba(0,0,0,.2)}.mCS-3d-thick-dark.mCSB_scrollTools_horizontal{box-shadow:inset 0 1px 1px rgba(0,0,0,.1),inset 0 0 14px rgba(0,0,0,.2)}.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{box-shadow:inset 1px 0 0 rgba(255,255,255,.4),inset -1px 0 0 rgba(0,0,0,.2)}.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{box-shadow:inset 0 1px 0 rgba(255,255,255,.4),inset 0 -1px 0 rgba(0,0,0,.2)}.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#777}.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer{background-color:#fff;background-color:rgba(0,0,0,.05);box-shadow:inset 1px 1px 16px rgba(0,0,0,.1)}.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-minimal-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-minimal.mCSB_scrollTools .mCSB_draggerRail{background-color:transparent}.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonUp{background-position:-112px -72px}.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonDown{background-position:-112px -92px}.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonLeft{background-position:-120px -112px}.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonRight{background-position:-120px -128px}.mCSB_outside+.mCS-minimal-dark.mCSB_scrollTools_vertical,.mCSB_outside+.mCS-minimal.mCSB_scrollTools_vertical{right:0;margin:12px 0}.mCustomScrollBox.mCS-minimal+.mCSB_scrollTools+.mCSB_scrollTools.mCSB_scrollTools_horizontal,.mCustomScrollBox.mCS-minimal+.mCSB_scrollTools.mCSB_scrollTools_horizontal,.mCustomScrollBox.mCS-minimal-dark+.mCSB_scrollTools+.mCSB_scrollTools.mCSB_scrollTools_horizontal,.mCustomScrollBox.mCS-minimal-dark+.mCSB_scrollTools.mCSB_scrollTools_horizontal{bottom:0;margin:0 12px}.mCS-dir-rtl>.mCSB_outside+.mCS-minimal-dark.mCSB_scrollTools_vertical,.mCS-dir-rtl>.mCSB_outside+.mCS-minimal.mCSB_scrollTools_vertical{left:0;right:auto}.mCS-minimal-dark.mCSB_scrollTools_vertical .mCSB_dragger,.mCS-minimal.mCSB_scrollTools_vertical .mCSB_dragger{height:50px}.mCS-minimal-dark.mCSB_scrollTools_horizontal .mCSB_dragger,.mCS-minimal.mCSB_scrollTools_horizontal .mCSB_dragger{width:50px}.mCS-minimal.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.2);filter:"alpha(opacity=20)";-ms-filter:"alpha(opacity=20)"}.mCS-minimal.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-minimal.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.5);filter:"alpha(opacity=50)";-ms-filter:"alpha(opacity=50)"}.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.2);filter:"alpha(opacity=20)";-ms-filter:"alpha(opacity=20)"}.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.5);filter:"alpha(opacity=50)";-ms-filter:"alpha(opacity=50)"}.mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail,.mCS-light-3.mCSB_scrollTools .mCSB_draggerRail{width:6px;background-color:#000;background-color:rgba(0,0,0,.2)}.mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-light-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{width:6px}.mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-light-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-light-3.mCSB_scrollTools_horizontal .mCSB_draggerRail{width:100%;height:6px;margin:5px 0}.mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,.mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,.mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,.mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{width:12px}.mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,.mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,.mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,.mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{height:12px;margin:2px 0}.mCS-light-3.mCSB_scrollTools .mCSB_buttonUp{background-position:-32px -72px}.mCS-light-3.mCSB_scrollTools .mCSB_buttonDown{background-position:-32px -92px}.mCS-light-3.mCSB_scrollTools .mCSB_buttonLeft{background-position:-40px -112px}.mCS-light-3.mCSB_scrollTools .mCSB_buttonRight{background-position:-40px -128px}.mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.75)}.mCS-dark-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.85)}.mCS-dark-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-dark-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.9)}.mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail{background-color:#000;background-color:rgba(0,0,0,.1)}.mCS-dark-3.mCSB_scrollTools .mCSB_buttonUp{background-position:-112px -72px}.mCS-dark-3.mCSB_scrollTools .mCSB_buttonDown{background-position:-112px -92px}.mCS-dark-3.mCSB_scrollTools .mCSB_buttonLeft{background-position:-120px -112px}.mCS-dark-3.mCSB_scrollTools .mCSB_buttonRight{background-position:-120px -128px}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail,.mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-inset.mCSB_scrollTools .mCSB_draggerRail{width:12px;background-color:#000;background-color:rgba(0,0,0,.2)}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-inset-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-inset.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{width:6px;margin:3px 5px;position:absolute;height:auto;top:0;bottom:0;left:0;right:0}.mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,.mCS-inset.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{height:6px;margin:5px 3px;position:absolute;width:auto;top:0;bottom:0;left:0;right:0}.mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,.mCS-inset.mCSB_scrollTools_horizontal .mCSB_draggerRail{width:100%;height:12px;margin:2px 0}.mCS-inset-2.mCSB_scrollTools .mCSB_buttonUp,.mCS-inset-3.mCSB_scrollTools .mCSB_buttonUp,.mCS-inset.mCSB_scrollTools .mCSB_buttonUp{background-position:-32px -72px}.mCS-inset-2.mCSB_scrollTools .mCSB_buttonDown,.mCS-inset-3.mCSB_scrollTools .mCSB_buttonDown,.mCS-inset.mCSB_scrollTools .mCSB_buttonDown{background-position:-32px -92px}.mCS-inset-2.mCSB_scrollTools .mCSB_buttonLeft,.mCS-inset-3.mCSB_scrollTools .mCSB_buttonLeft,.mCS-inset.mCSB_scrollTools .mCSB_buttonLeft{background-position:-40px -112px}.mCS-inset-2.mCSB_scrollTools .mCSB_buttonRight,.mCS-inset-3.mCSB_scrollTools .mCSB_buttonRight,.mCS-inset.mCSB_scrollTools .mCSB_buttonRight{background-position:-40px -128px}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.75)}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.85)}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.9)}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail{background-color:#000;background-color:rgba(0,0,0,.1)}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonUp,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonUp,.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonUp{background-position:-112px -72px}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonDown,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonDown,.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonDown{background-position:-112px -92px}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonLeft,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonLeft,.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonLeft{background-position:-120px -112px}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonRight,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonRight,.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonRight{background-position:-120px -128px}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,.mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail{background-color:transparent;border-width:1px;border-style:solid;border-color:#fff;border-color:rgba(255,255,255,.2);box-sizing:border-box}.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail{border-color:#000;border-color:rgba(0,0,0,.2)}.mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail{background-color:#fff;background-color:rgba(255,255,255,.6)}.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail{background-color:#000;background-color:rgba(0,0,0,.6)}.mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.75)}.mCS-inset-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.85)}.mCS-inset-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-inset-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#000;background-color:rgba(0,0,0,.9)}.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.75)}.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.85)}.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar{background-color:#fff;background-color:rgba(255,255,255,.9)} /*!***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[2]!./node_modules/resolve-url-loader/index.js??ruleSet[1].rules[6].rules[1].use[0]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[6].rules[1].use[1]!./src/styles.scss?ngGlobalStyle ***! \***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/ @charset "UTF-8"; /* You can add global styles to this file, and also import other style files */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* Material Design Lite */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /*------------------------------------*\ $CONTENTS \*------------------------------------*/ /** * STYLE GUIDE VARIABLES------------------Declarations of Sass variables * -----Typography * -----Colors * -----Textfield * -----Switch * -----Spinner * -----Radio * -----Menu * -----List * -----Layout * -----Icon toggles * -----Footer * -----Column * -----Checkbox * -----Card * -----Button * -----Animation * -----Progress * -----Badge * -----Shadows * -----Grid * -----Data table * -----Dialog * -----Snackbar * -----Tooltip * -----Chip * * Even though all variables have the `!default` directive, most of them * should not be changed as they are dependent one another. This can cause * visual distortions (like alignment issues) that are hard to track down * and fix. */ /* ========== TYPOGRAPHY ========== */ /* We're splitting fonts into "preferred" and "performance" in order to optimize page loading. For important text, such as the body, we want it to load immediately and not wait for the web font load, whereas for other sections, such as headers and titles, we're OK with things taking a bit longer to load. We do have some optional classes and parameters in the mixins, in case you definitely want to make sure you're using the preferred font and don't mind the performance hit. We should be able to improve on this once CSS Font Loading L3 becomes more widely available. */ /* ========== COLORS ========== */ /** * * Material design color palettes. * @see http://www.google.com/design/spec/style/color.html * **/ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== Color Palettes ========== */ /* colors.scss */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== IMAGES ========== */ /* ========== Color & Themes ========== */ /* ========== Typography ========== */ /* ========== Components ========== */ /* ========== Standard Buttons ========== */ /* ========== Icon Toggles ========== */ /* ========== Radio Buttons ========== */ /* ========== Ripple effect ========== */ /* ========== Layout ========== */ /* ========== Content Tabs ========== */ /* ========== Checkboxes ========== */ /* ========== Switches ========== */ /* ========== Spinner ========== */ /* ========== Text fields ========== */ /* ========== Card ========== */ /* ========== Sliders ========== */ /* ========== Progress ========== */ /* ========== List ========== */ /* ========== Item ========== */ /* ========== Dropdown menu ========== */ /* ========== Tooltips ========== */ /* ========== Footer ========== */ /* TEXTFIELD */ /* SWITCH */ /* SPINNER */ /* RADIO */ /* MENU */ /* LIST */ /* LAYOUT */ /* ICON TOGGLE */ /* FOOTER */ /*mega-footer*/ /*mini-footer*/ /* CHECKBOX */ /* CARD */ /* Card dimensions */ /* Cover image */ /* BUTTON */ /** * * Dimensions * */ /* ANIMATION */ /* PROGRESS */ /* BADGE */ /* SHADOWS */ /* GRID */ /* DATA TABLE */ /* DIALOG */ /* SNACKBAR */ /* TOOLTIP */ /* CHIP */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* Typography */ /* Shadows */ /* Animations */ /* Dialog */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /*------------------------------------*\ $CONTENTS \*------------------------------------*/ /** * STYLE GUIDE VARIABLES------------------Declarations of Sass variables * -----Typography * -----Colors * -----Textfield * -----Switch * -----Spinner * -----Radio * -----Menu * -----List * -----Layout * -----Icon toggles * -----Footer * -----Column * -----Checkbox * -----Card * -----Button * -----Animation * -----Progress * -----Badge * -----Shadows * -----Grid * -----Data table * -----Dialog * -----Snackbar * -----Tooltip * -----Chip * * Even though all variables have the `!default` directive, most of them * should not be changed as they are dependent one another. This can cause * visual distortions (like alignment issues) that are hard to track down * and fix. */ /* ========== TYPOGRAPHY ========== */ /* We're splitting fonts into "preferred" and "performance" in order to optimize page loading. For important text, such as the body, we want it to load immediately and not wait for the web font load, whereas for other sections, such as headers and titles, we're OK with things taking a bit longer to load. We do have some optional classes and parameters in the mixins, in case you definitely want to make sure you're using the preferred font and don't mind the performance hit. We should be able to improve on this once CSS Font Loading L3 becomes more widely available. */ /* ========== COLORS ========== */ /** * * Material design color palettes. * @see http://www.google.com/design/spec/style/color.html * **/ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== Color Palettes ========== */ /* colors.scss */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== IMAGES ========== */ /* ========== Color & Themes ========== */ /* ========== Typography ========== */ /* ========== Components ========== */ /* ========== Standard Buttons ========== */ /* ========== Icon Toggles ========== */ /* ========== Radio Buttons ========== */ /* ========== Ripple effect ========== */ /* ========== Layout ========== */ /* ========== Content Tabs ========== */ /* ========== Checkboxes ========== */ /* ========== Switches ========== */ /* ========== Spinner ========== */ /* ========== Text fields ========== */ /* ========== Card ========== */ /* ========== Sliders ========== */ /* ========== Progress ========== */ /* ========== List ========== */ /* ========== Item ========== */ /* ========== Dropdown menu ========== */ /* ========== Tooltips ========== */ /* ========== Footer ========== */ /* TEXTFIELD */ /* SWITCH */ /* SPINNER */ /* RADIO */ /* MENU */ /* LIST */ /* LAYOUT */ /* ICON TOGGLE */ /* FOOTER */ /*mega-footer*/ /*mini-footer*/ /* CHECKBOX */ /* CARD */ /* Card dimensions */ /* Cover image */ /* BUTTON */ /** * * Dimensions * */ /* ANIMATION */ /* PROGRESS */ /* BADGE */ /* SHADOWS */ /* GRID */ /* DATA TABLE */ /* DIALOG */ /* SNACKBAR */ /* TOOLTIP */ /* CHIP */ /* * What follows is the result of much research on cross-browser styling. * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal, * Kroc Camen, and the H5BP dev community and team. */ /* ========================================================================== Base styles: opinionated defaults ========================================================================== */ html { color: rgba(0,0,0, 0.87); font-size: 1em; line-height: 1.4; } /* * Remove text-shadow in selection highlight: * https://twitter.com/miketaylr/status/12228805301 * * These selection rule sets have to be separate. * Customize the background color to match your design. */ ::selection { background: #b3d4fc; text-shadow: none; } /* * A better looking default horizontal rule */ hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; } /* * Remove the gap between audio, canvas, iframes, * images, videos and the bottom of their containers: * https://github.com/h5bp/html5-boilerplate/issues/440 */ audio, canvas, iframe, img, svg, video { vertical-align: middle; } /* * Remove default fieldset styles. */ fieldset { border: 0; margin: 0; padding: 0; } /* * Allow only vertical resizing of textareas. */ textarea { resize: vertical; } /* ========================================================================== Browser Upgrade Prompt ========================================================================== */ .browserupgrade { margin: 0.2em 0; background: #ccc; color: #000; padding: 0.2em 0; } /* ========================================================================== Author's custom styles ========================================================================== */ /* ========================================================================== Helper classes ========================================================================== */ /* * Hide visually and from screen readers: */ .hidden { display: none !important; } /* * Hide only visually, but have it available for screen readers: * http://snook.ca/archives/html_and_css/hiding-content-for-accessibility */ .visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } /* * Extends the .visuallyhidden class to allow the element * to be focusable when navigated to via the keyboard: * https://www.drupal.org/node/897638 */ .visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; } /* * Hide visually and from screen readers, but maintain layout */ .invisible { visibility: hidden; } /* * Clearfix: contain floats * * For modern browsers * 1. The space content is one way to avoid an Opera bug when the * `contenteditable` attribute is included anywhere else in the document. * Otherwise it causes space to appear at the top and bottom of elements * that receive the `clearfix` class. * 2. The use of `table` rather than `block` is only necessary if using * `:before` to contain the top-margins of child elements. */ .clearfix:before, .clearfix:after { content: " "; /* 1 */ display: table; /* 2 */ } .clearfix:after { clear: both; } /* ========================================================================== EXAMPLE Media Queries for Responsive Design. These examples override the primary ('mobile first') styles. Modify as content requires. ========================================================================== */ @media only screen and (min-width: 35em) { /* Style adjustments for viewports that meet the condition */ } @media print, (min-resolution: 1.25dppx), (min-resolution: 120dpi) { /* Style adjustments for high resolution devices */ } /* ========================================================================== Print styles. Inlined to avoid the additional HTTP request: http://www.phpied.com/delay-loading-your-print-css/ ========================================================================== */ @media print { *, *:before, *:after, *:first-letter { background: transparent !important; color: #000 !important; /* Black prints faster: http://www.sanbeiji.com/archives/953 */ box-shadow: none !important; } a, a:visited { text-decoration: underline; } a[href]:after { content: " (" attr(href) ")"; } abbr[title]:after { content: " (" attr(title) ")"; } /* * Don't show links that are fragment identifiers, * or use the `javascript:` pseudo protocol */ a[href^="#"]:after, a[href^="javascript:"]:after { content: ""; } pre, blockquote { border: 1px solid #999; page-break-inside: avoid; } /* * Printing Tables: * http://css-discuss.incutio.com/wiki/Printing_Tables */ thead { display: table-header-group; } tr, img { page-break-inside: avoid; } img { max-width: 100% !important; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3 { page-break-after: avoid; } } /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* Remove the unwanted box around FAB buttons */ /* More info: http://goo.gl/IPwKi */ a, .mdl-accordion, .mdl-button, .mdl-card, .mdl-checkbox, .mdl-dropdown-menu, .mdl-icon-toggle, .mdl-item, .mdl-radio, .mdl-slider, .mdl-switch, .mdl-tabs__tab { -webkit-tap-highlight-color: transparent; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); } /* * Make html take up the entire screen * Then set touch-action to avoid touch delay on mobile IE */ html { width: 100%; height: 100%; touch-action: manipulation; } /* * Make body take up the entire screen * Remove body margin so layout containers don't cause extra overflow. */ body { width: 100%; min-height: 100%; margin: 0; } /* * Main display reset for IE support. * Source: http://weblog.west-wind.com/posts/2015/Jan/12/main-HTML5-Tag-not-working-in-Internet-Explorer-91011 */ main { display: block; } /* * Apply no display to elements with the hidden attribute. * IE 9 and 10 support. */ *[hidden] { display: none !important; } /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /*------------------------------------*\ $CONTENTS \*------------------------------------*/ /** * STYLE GUIDE VARIABLES------------------Declarations of Sass variables * -----Typography * -----Colors * -----Textfield * -----Switch * -----Spinner * -----Radio * -----Menu * -----List * -----Layout * -----Icon toggles * -----Footer * -----Column * -----Checkbox * -----Card * -----Button * -----Animation * -----Progress * -----Badge * -----Shadows * -----Grid * -----Data table * -----Dialog * -----Snackbar * -----Tooltip * -----Chip * * Even though all variables have the `!default` directive, most of them * should not be changed as they are dependent one another. This can cause * visual distortions (like alignment issues) that are hard to track down * and fix. */ /* ========== TYPOGRAPHY ========== */ /* We're splitting fonts into "preferred" and "performance" in order to optimize page loading. For important text, such as the body, we want it to load immediately and not wait for the web font load, whereas for other sections, such as headers and titles, we're OK with things taking a bit longer to load. We do have some optional classes and parameters in the mixins, in case you definitely want to make sure you're using the preferred font and don't mind the performance hit. We should be able to improve on this once CSS Font Loading L3 becomes more widely available. */ /* ========== COLORS ========== */ /** * * Material design color palettes. * @see http://www.google.com/design/spec/style/color.html * **/ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== Color Palettes ========== */ /* colors.scss */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== IMAGES ========== */ /* ========== Color & Themes ========== */ /* ========== Typography ========== */ /* ========== Components ========== */ /* ========== Standard Buttons ========== */ /* ========== Icon Toggles ========== */ /* ========== Radio Buttons ========== */ /* ========== Ripple effect ========== */ /* ========== Layout ========== */ /* ========== Content Tabs ========== */ /* ========== Checkboxes ========== */ /* ========== Switches ========== */ /* ========== Spinner ========== */ /* ========== Text fields ========== */ /* ========== Card ========== */ /* ========== Sliders ========== */ /* ========== Progress ========== */ /* ========== List ========== */ /* ========== Item ========== */ /* ========== Dropdown menu ========== */ /* ========== Tooltips ========== */ /* ========== Footer ========== */ /* TEXTFIELD */ /* SWITCH */ /* SPINNER */ /* RADIO */ /* MENU */ /* LIST */ /* LAYOUT */ /* ICON TOGGLE */ /* FOOTER */ /*mega-footer*/ /*mini-footer*/ /* CHECKBOX */ /* CARD */ /* Card dimensions */ /* Cover image */ /* BUTTON */ /** * * Dimensions * */ /* ANIMATION */ /* PROGRESS */ /* BADGE */ /* SHADOWS */ /* GRID */ /* DATA TABLE */ /* DIALOG */ /* SNACKBAR */ /* TOOLTIP */ /* CHIP */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* Typography */ /* Shadows */ /* Animations */ /* Dialog */ html, body { font-family: "Helvetica", "Arial", sans-serif; font-size: 14px; font-weight: 400; line-height: 20px; } h1, h2, h3, h4, h5, h6, p { margin: 0; padding: 0; } /** * Styles for HTML elements */ h1 small, h2 small, h3 small, h4 small, h5 small, h6 small { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 56px; font-weight: 400; line-height: 1.35; letter-spacing: -0.02em; opacity: 0.54; font-size: 0.6em; } h1 { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 56px; font-weight: 400; line-height: 1.35; letter-spacing: -0.02em; margin-top: 24px; margin-bottom: 24px; } h2 { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 45px; font-weight: 400; line-height: 48px; margin-top: 24px; margin-bottom: 24px; } h3 { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 34px; font-weight: 400; line-height: 40px; margin-top: 24px; margin-bottom: 24px; } h4 { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 24px; font-weight: 400; line-height: 32px; -moz-osx-font-smoothing: grayscale; margin-top: 24px; margin-bottom: 16px; } h5 { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 20px; font-weight: 500; line-height: 1; letter-spacing: 0.02em; margin-top: 24px; margin-bottom: 16px; } h6 { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 16px; font-weight: 400; line-height: 24px; letter-spacing: 0.04em; margin-top: 24px; margin-bottom: 16px; } p { font-size: 14px; font-weight: 400; line-height: 24px; letter-spacing: 0; margin-bottom: 16px; } a { color: rgb(255,64,129); font-weight: 500; } blockquote { font-family: "Roboto", "Helvetica", "Arial", sans-serif; position: relative; font-size: 24px; font-weight: 300; font-style: italic; line-height: 1.35; letter-spacing: 0.08em; } blockquote:before { position: absolute; left: -0.5em; content: "“"; } blockquote:after { content: "”"; margin-left: -0.05em; } mark { background-color: #f4ff81; } dt { font-weight: 700; } address { font-size: 12px; font-weight: 400; line-height: 1; letter-spacing: 0; font-style: normal; } ul, ol { font-size: 14px; font-weight: 400; line-height: 24px; letter-spacing: 0; } /** * Class Name Styles */ .mdl-typography--display-4 { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 112px; font-weight: 300; line-height: 1; letter-spacing: -0.04em; } .mdl-typography--display-4-color-contrast { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 112px; font-weight: 300; line-height: 1; letter-spacing: -0.04em; opacity: 0.54; } .mdl-typography--display-3 { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 56px; font-weight: 400; line-height: 1.35; letter-spacing: -0.02em; } .mdl-typography--display-3-color-contrast { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 56px; font-weight: 400; line-height: 1.35; letter-spacing: -0.02em; opacity: 0.54; } .mdl-typography--display-2 { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 45px; font-weight: 400; line-height: 48px; } .mdl-typography--display-2-color-contrast { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 45px; font-weight: 400; line-height: 48px; opacity: 0.54; } .mdl-typography--display-1 { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 34px; font-weight: 400; line-height: 40px; } .mdl-typography--display-1-color-contrast { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 34px; font-weight: 400; line-height: 40px; opacity: 0.54; } .mdl-typography--headline { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 24px; font-weight: 400; line-height: 32px; -moz-osx-font-smoothing: grayscale; } .mdl-typography--headline-color-contrast { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 24px; font-weight: 400; line-height: 32px; -moz-osx-font-smoothing: grayscale; opacity: 0.87; } .mdl-typography--title { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 20px; font-weight: 500; line-height: 1; letter-spacing: 0.02em; } .mdl-typography--title-color-contrast { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 20px; font-weight: 500; line-height: 1; letter-spacing: 0.02em; opacity: 0.87; } .mdl-typography--subhead { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 16px; font-weight: 400; line-height: 24px; letter-spacing: 0.04em; } .mdl-typography--subhead-color-contrast { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 16px; font-weight: 400; line-height: 24px; letter-spacing: 0.04em; opacity: 0.87; } .mdl-typography--body-2 { font-size: 14px; font-weight: bold; line-height: 24px; letter-spacing: 0; } .mdl-typography--body-2-color-contrast { font-size: 14px; font-weight: bold; line-height: 24px; letter-spacing: 0; opacity: 0.87; } .mdl-typography--body-1 { font-size: 14px; font-weight: 400; line-height: 24px; letter-spacing: 0; } .mdl-typography--body-1-color-contrast { font-size: 14px; font-weight: 400; line-height: 24px; letter-spacing: 0; opacity: 0.87; } .mdl-typography--body-2-force-preferred-font { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 14px; font-weight: 500; line-height: 24px; letter-spacing: 0; } .mdl-typography--body-2-force-preferred-font-color-contrast { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 14px; font-weight: 500; line-height: 24px; letter-spacing: 0; opacity: 0.87; } .mdl-typography--body-1-force-preferred-font { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 14px; font-weight: 400; line-height: 24px; letter-spacing: 0; } .mdl-typography--body-1-force-preferred-font-color-contrast { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 14px; font-weight: 400; line-height: 24px; letter-spacing: 0; opacity: 0.87; } .mdl-typography--caption { font-size: 12px; font-weight: 400; line-height: 1; letter-spacing: 0; } .mdl-typography--caption-force-preferred-font { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 12px; font-weight: 400; line-height: 1; letter-spacing: 0; } .mdl-typography--caption-color-contrast { font-size: 12px; font-weight: 400; line-height: 1; letter-spacing: 0; opacity: 0.54; } .mdl-typography--caption-force-preferred-font-color-contrast { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 12px; font-weight: 400; line-height: 1; letter-spacing: 0; opacity: 0.54; } .mdl-typography--menu { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 14px; font-weight: 500; line-height: 1; letter-spacing: 0; } .mdl-typography--menu-color-contrast { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 14px; font-weight: 500; line-height: 1; letter-spacing: 0; opacity: 0.87; } .mdl-typography--button { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 14px; font-weight: 500; text-transform: uppercase; line-height: 1; letter-spacing: 0; } .mdl-typography--button-color-contrast { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 14px; font-weight: 500; text-transform: uppercase; line-height: 1; letter-spacing: 0; opacity: 0.87; } .mdl-typography--text-left { text-align: left; } .mdl-typography--text-right { text-align: right; } .mdl-typography--text-center { text-align: center; } .mdl-typography--text-justify { text-align: justify; } .mdl-typography--text-nowrap { white-space: nowrap; } .mdl-typography--text-lowercase { text-transform: lowercase; } .mdl-typography--text-uppercase { text-transform: uppercase; } .mdl-typography--text-capitalize { text-transform: capitalize; } .mdl-typography--font-thin { font-weight: 200 !important; } .mdl-typography--font-light { font-weight: 300 !important; } .mdl-typography--font-regular { font-weight: 400 !important; } .mdl-typography--font-medium { font-weight: 500 !important; } .mdl-typography--font-bold { font-weight: 700 !important; } .mdl-typography--font-black { font-weight: 900 !important; } .material-icons { font-family: "Material Icons"; font-weight: normal; font-style: normal; font-size: 24px; line-height: 1; letter-spacing: normal; text-transform: none; display: inline-block; word-wrap: normal; font-feature-settings: "liga"; -webkit-font-feature-settings: "liga"; -webkit-font-smoothing: antialiased; } /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /*------------------------------------*\ $CONTENTS \*------------------------------------*/ /** * STYLE GUIDE VARIABLES------------------Declarations of Sass variables * -----Typography * -----Colors * -----Textfield * -----Switch * -----Spinner * -----Radio * -----Menu * -----List * -----Layout * -----Icon toggles * -----Footer * -----Column * -----Checkbox * -----Card * -----Button * -----Animation * -----Progress * -----Badge * -----Shadows * -----Grid * -----Data table * -----Dialog * -----Snackbar * -----Tooltip * -----Chip * * Even though all variables have the `!default` directive, most of them * should not be changed as they are dependent one another. This can cause * visual distortions (like alignment issues) that are hard to track down * and fix. */ /* ========== TYPOGRAPHY ========== */ /* We're splitting fonts into "preferred" and "performance" in order to optimize page loading. For important text, such as the body, we want it to load immediately and not wait for the web font load, whereas for other sections, such as headers and titles, we're OK with things taking a bit longer to load. We do have some optional classes and parameters in the mixins, in case you definitely want to make sure you're using the preferred font and don't mind the performance hit. We should be able to improve on this once CSS Font Loading L3 becomes more widely available. */ /* ========== COLORS ========== */ /** * * Material design color palettes. * @see http://www.google.com/design/spec/style/color.html * **/ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== Color Palettes ========== */ /* colors.scss */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== IMAGES ========== */ /* ========== Color & Themes ========== */ /* ========== Typography ========== */ /* ========== Components ========== */ /* ========== Standard Buttons ========== */ /* ========== Icon Toggles ========== */ /* ========== Radio Buttons ========== */ /* ========== Ripple effect ========== */ /* ========== Layout ========== */ /* ========== Content Tabs ========== */ /* ========== Checkboxes ========== */ /* ========== Switches ========== */ /* ========== Spinner ========== */ /* ========== Text fields ========== */ /* ========== Card ========== */ /* ========== Sliders ========== */ /* ========== Progress ========== */ /* ========== List ========== */ /* ========== Item ========== */ /* ========== Dropdown menu ========== */ /* ========== Tooltips ========== */ /* ========== Footer ========== */ /* TEXTFIELD */ /* SWITCH */ /* SPINNER */ /* RADIO */ /* MENU */ /* LIST */ /* LAYOUT */ /* ICON TOGGLE */ /* FOOTER */ /*mega-footer*/ /*mini-footer*/ /* CHECKBOX */ /* CARD */ /* Card dimensions */ /* Cover image */ /* BUTTON */ /** * * Dimensions * */ /* ANIMATION */ /* PROGRESS */ /* BADGE */ /* SHADOWS */ /* GRID */ /* DATA TABLE */ /* DIALOG */ /* SNACKBAR */ /* TOOLTIP */ /* CHIP */ .mdl-color-text--red { color: rgb(244,67,54) !important; } .mdl-color--red { background-color: rgb(244,67,54) !important; } .mdl-color-text--red-50 { color: rgb(255,235,238) !important; } .mdl-color--red-50 { background-color: rgb(255,235,238) !important; } .mdl-color-text--red-100 { color: rgb(255,205,210) !important; } .mdl-color--red-100 { background-color: rgb(255,205,210) !important; } .mdl-color-text--red-200 { color: rgb(239,154,154) !important; } .mdl-color--red-200 { background-color: rgb(239,154,154) !important; } .mdl-color-text--red-300 { color: rgb(229,115,115) !important; } .mdl-color--red-300 { background-color: rgb(229,115,115) !important; } .mdl-color-text--red-400 { color: rgb(239,83,80) !important; } .mdl-color--red-400 { background-color: rgb(239,83,80) !important; } .mdl-color-text--red-500 { color: rgb(244,67,54) !important; } .mdl-color--red-500 { background-color: rgb(244,67,54) !important; } .mdl-color-text--red-600 { color: rgb(229,57,53) !important; } .mdl-color--red-600 { background-color: rgb(229,57,53) !important; } .mdl-color-text--red-700 { color: rgb(211,47,47) !important; } .mdl-color--red-700 { background-color: rgb(211,47,47) !important; } .mdl-color-text--red-800 { color: rgb(198,40,40) !important; } .mdl-color--red-800 { background-color: rgb(198,40,40) !important; } .mdl-color-text--red-900 { color: rgb(183,28,28) !important; } .mdl-color--red-900 { background-color: rgb(183,28,28) !important; } .mdl-color-text--red-A100 { color: rgb(255,138,128) !important; } .mdl-color--red-A100 { background-color: rgb(255,138,128) !important; } .mdl-color-text--red-A200 { color: rgb(255,82,82) !important; } .mdl-color--red-A200 { background-color: rgb(255,82,82) !important; } .mdl-color-text--red-A400 { color: rgb(255,23,68) !important; } .mdl-color--red-A400 { background-color: rgb(255,23,68) !important; } .mdl-color-text--red-A700 { color: rgb(213,0,0) !important; } .mdl-color--red-A700 { background-color: rgb(213,0,0) !important; } .mdl-color-text--pink { color: rgb(233,30,99) !important; } .mdl-color--pink { background-color: rgb(233,30,99) !important; } .mdl-color-text--pink-50 { color: rgb(252,228,236) !important; } .mdl-color--pink-50 { background-color: rgb(252,228,236) !important; } .mdl-color-text--pink-100 { color: rgb(248,187,208) !important; } .mdl-color--pink-100 { background-color: rgb(248,187,208) !important; } .mdl-color-text--pink-200 { color: rgb(244,143,177) !important; } .mdl-color--pink-200 { background-color: rgb(244,143,177) !important; } .mdl-color-text--pink-300 { color: rgb(240,98,146) !important; } .mdl-color--pink-300 { background-color: rgb(240,98,146) !important; } .mdl-color-text--pink-400 { color: rgb(236,64,122) !important; } .mdl-color--pink-400 { background-color: rgb(236,64,122) !important; } .mdl-color-text--pink-500 { color: rgb(233,30,99) !important; } .mdl-color--pink-500 { background-color: rgb(233,30,99) !important; } .mdl-color-text--pink-600 { color: rgb(216,27,96) !important; } .mdl-color--pink-600 { background-color: rgb(216,27,96) !important; } .mdl-color-text--pink-700 { color: rgb(194,24,91) !important; } .mdl-color--pink-700 { background-color: rgb(194,24,91) !important; } .mdl-color-text--pink-800 { color: rgb(173,20,87) !important; } .mdl-color--pink-800 { background-color: rgb(173,20,87) !important; } .mdl-color-text--pink-900 { color: rgb(136,14,79) !important; } .mdl-color--pink-900 { background-color: rgb(136,14,79) !important; } .mdl-color-text--pink-A100 { color: rgb(255,128,171) !important; } .mdl-color--pink-A100 { background-color: rgb(255,128,171) !important; } .mdl-color-text--pink-A200 { color: rgb(255,64,129) !important; } .mdl-color--pink-A200 { background-color: rgb(255,64,129) !important; } .mdl-color-text--pink-A400 { color: rgb(245,0,87) !important; } .mdl-color--pink-A400 { background-color: rgb(245,0,87) !important; } .mdl-color-text--pink-A700 { color: rgb(197,17,98) !important; } .mdl-color--pink-A700 { background-color: rgb(197,17,98) !important; } .mdl-color-text--purple { color: rgb(156,39,176) !important; } .mdl-color--purple { background-color: rgb(156,39,176) !important; } .mdl-color-text--purple-50 { color: rgb(243,229,245) !important; } .mdl-color--purple-50 { background-color: rgb(243,229,245) !important; } .mdl-color-text--purple-100 { color: rgb(225,190,231) !important; } .mdl-color--purple-100 { background-color: rgb(225,190,231) !important; } .mdl-color-text--purple-200 { color: rgb(206,147,216) !important; } .mdl-color--purple-200 { background-color: rgb(206,147,216) !important; } .mdl-color-text--purple-300 { color: rgb(186,104,200) !important; } .mdl-color--purple-300 { background-color: rgb(186,104,200) !important; } .mdl-color-text--purple-400 { color: rgb(171,71,188) !important; } .mdl-color--purple-400 { background-color: rgb(171,71,188) !important; } .mdl-color-text--purple-500 { color: rgb(156,39,176) !important; } .mdl-color--purple-500 { background-color: rgb(156,39,176) !important; } .mdl-color-text--purple-600 { color: rgb(142,36,170) !important; } .mdl-color--purple-600 { background-color: rgb(142,36,170) !important; } .mdl-color-text--purple-700 { color: rgb(123,31,162) !important; } .mdl-color--purple-700 { background-color: rgb(123,31,162) !important; } .mdl-color-text--purple-800 { color: rgb(106,27,154) !important; } .mdl-color--purple-800 { background-color: rgb(106,27,154) !important; } .mdl-color-text--purple-900 { color: rgb(74,20,140) !important; } .mdl-color--purple-900 { background-color: rgb(74,20,140) !important; } .mdl-color-text--purple-A100 { color: rgb(234,128,252) !important; } .mdl-color--purple-A100 { background-color: rgb(234,128,252) !important; } .mdl-color-text--purple-A200 { color: rgb(224,64,251) !important; } .mdl-color--purple-A200 { background-color: rgb(224,64,251) !important; } .mdl-color-text--purple-A400 { color: rgb(213,0,249) !important; } .mdl-color--purple-A400 { background-color: rgb(213,0,249) !important; } .mdl-color-text--purple-A700 { color: rgb(170,0,255) !important; } .mdl-color--purple-A700 { background-color: rgb(170,0,255) !important; } .mdl-color-text--deep-purple { color: rgb(103,58,183) !important; } .mdl-color--deep-purple { background-color: rgb(103,58,183) !important; } .mdl-color-text--deep-purple-50 { color: rgb(237,231,246) !important; } .mdl-color--deep-purple-50 { background-color: rgb(237,231,246) !important; } .mdl-color-text--deep-purple-100 { color: rgb(209,196,233) !important; } .mdl-color--deep-purple-100 { background-color: rgb(209,196,233) !important; } .mdl-color-text--deep-purple-200 { color: rgb(179,157,219) !important; } .mdl-color--deep-purple-200 { background-color: rgb(179,157,219) !important; } .mdl-color-text--deep-purple-300 { color: rgb(149,117,205) !important; } .mdl-color--deep-purple-300 { background-color: rgb(149,117,205) !important; } .mdl-color-text--deep-purple-400 { color: rgb(126,87,194) !important; } .mdl-color--deep-purple-400 { background-color: rgb(126,87,194) !important; } .mdl-color-text--deep-purple-500 { color: rgb(103,58,183) !important; } .mdl-color--deep-purple-500 { background-color: rgb(103,58,183) !important; } .mdl-color-text--deep-purple-600 { color: rgb(94,53,177) !important; } .mdl-color--deep-purple-600 { background-color: rgb(94,53,177) !important; } .mdl-color-text--deep-purple-700 { color: rgb(81,45,168) !important; } .mdl-color--deep-purple-700 { background-color: rgb(81,45,168) !important; } .mdl-color-text--deep-purple-800 { color: rgb(69,39,160) !important; } .mdl-color--deep-purple-800 { background-color: rgb(69,39,160) !important; } .mdl-color-text--deep-purple-900 { color: rgb(49,27,146) !important; } .mdl-color--deep-purple-900 { background-color: rgb(49,27,146) !important; } .mdl-color-text--deep-purple-A100 { color: rgb(179,136,255) !important; } .mdl-color--deep-purple-A100 { background-color: rgb(179,136,255) !important; } .mdl-color-text--deep-purple-A200 { color: rgb(124,77,255) !important; } .mdl-color--deep-purple-A200 { background-color: rgb(124,77,255) !important; } .mdl-color-text--deep-purple-A400 { color: rgb(101,31,255) !important; } .mdl-color--deep-purple-A400 { background-color: rgb(101,31,255) !important; } .mdl-color-text--deep-purple-A700 { color: rgb(98,0,234) !important; } .mdl-color--deep-purple-A700 { background-color: rgb(98,0,234) !important; } .mdl-color-text--indigo { color: rgb(63,81,181) !important; } .mdl-color--indigo { background-color: rgb(63,81,181) !important; } .mdl-color-text--indigo-50 { color: rgb(232,234,246) !important; } .mdl-color--indigo-50 { background-color: rgb(232,234,246) !important; } .mdl-color-text--indigo-100 { color: rgb(197,202,233) !important; } .mdl-color--indigo-100 { background-color: rgb(197,202,233) !important; } .mdl-color-text--indigo-200 { color: rgb(159,168,218) !important; } .mdl-color--indigo-200 { background-color: rgb(159,168,218) !important; } .mdl-color-text--indigo-300 { color: rgb(121,134,203) !important; } .mdl-color--indigo-300 { background-color: rgb(121,134,203) !important; } .mdl-color-text--indigo-400 { color: rgb(92,107,192) !important; } .mdl-color--indigo-400 { background-color: rgb(92,107,192) !important; } .mdl-color-text--indigo-500 { color: rgb(63,81,181) !important; } .mdl-color--indigo-500 { background-color: rgb(63,81,181) !important; } .mdl-color-text--indigo-600 { color: rgb(57,73,171) !important; } .mdl-color--indigo-600 { background-color: rgb(57,73,171) !important; } .mdl-color-text--indigo-700 { color: rgb(48,63,159) !important; } .mdl-color--indigo-700 { background-color: rgb(48,63,159) !important; } .mdl-color-text--indigo-800 { color: rgb(40,53,147) !important; } .mdl-color--indigo-800 { background-color: rgb(40,53,147) !important; } .mdl-color-text--indigo-900 { color: rgb(26,35,126) !important; } .mdl-color--indigo-900 { background-color: rgb(26,35,126) !important; } .mdl-color-text--indigo-A100 { color: rgb(140,158,255) !important; } .mdl-color--indigo-A100 { background-color: rgb(140,158,255) !important; } .mdl-color-text--indigo-A200 { color: rgb(83,109,254) !important; } .mdl-color--indigo-A200 { background-color: rgb(83,109,254) !important; } .mdl-color-text--indigo-A400 { color: rgb(61,90,254) !important; } .mdl-color--indigo-A400 { background-color: rgb(61,90,254) !important; } .mdl-color-text--indigo-A700 { color: rgb(48,79,254) !important; } .mdl-color--indigo-A700 { background-color: rgb(48,79,254) !important; } .mdl-color-text--blue { color: rgb(33,150,243) !important; } .mdl-color--blue { background-color: rgb(33,150,243) !important; } .mdl-color-text--blue-50 { color: rgb(227,242,253) !important; } .mdl-color--blue-50 { background-color: rgb(227,242,253) !important; } .mdl-color-text--blue-100 { color: rgb(187,222,251) !important; } .mdl-color--blue-100 { background-color: rgb(187,222,251) !important; } .mdl-color-text--blue-200 { color: rgb(144,202,249) !important; } .mdl-color--blue-200 { background-color: rgb(144,202,249) !important; } .mdl-color-text--blue-300 { color: rgb(100,181,246) !important; } .mdl-color--blue-300 { background-color: rgb(100,181,246) !important; } .mdl-color-text--blue-400 { color: rgb(66,165,245) !important; } .mdl-color--blue-400 { background-color: rgb(66,165,245) !important; } .mdl-color-text--blue-500 { color: rgb(33,150,243) !important; } .mdl-color--blue-500 { background-color: rgb(33,150,243) !important; } .mdl-color-text--blue-600 { color: rgb(30,136,229) !important; } .mdl-color--blue-600 { background-color: rgb(30,136,229) !important; } .mdl-color-text--blue-700 { color: rgb(25,118,210) !important; } .mdl-color--blue-700 { background-color: rgb(25,118,210) !important; } .mdl-color-text--blue-800 { color: rgb(21,101,192) !important; } .mdl-color--blue-800 { background-color: rgb(21,101,192) !important; } .mdl-color-text--blue-900 { color: rgb(13,71,161) !important; } .mdl-color--blue-900 { background-color: rgb(13,71,161) !important; } .mdl-color-text--blue-A100 { color: rgb(130,177,255) !important; } .mdl-color--blue-A100 { background-color: rgb(130,177,255) !important; } .mdl-color-text--blue-A200 { color: rgb(68,138,255) !important; } .mdl-color--blue-A200 { background-color: rgb(68,138,255) !important; } .mdl-color-text--blue-A400 { color: rgb(41,121,255) !important; } .mdl-color--blue-A400 { background-color: rgb(41,121,255) !important; } .mdl-color-text--blue-A700 { color: rgb(41,98,255) !important; } .mdl-color--blue-A700 { background-color: rgb(41,98,255) !important; } .mdl-color-text--light-blue { color: rgb(3,169,244) !important; } .mdl-color--light-blue { background-color: rgb(3,169,244) !important; } .mdl-color-text--light-blue-50 { color: rgb(225,245,254) !important; } .mdl-color--light-blue-50 { background-color: rgb(225,245,254) !important; } .mdl-color-text--light-blue-100 { color: rgb(179,229,252) !important; } .mdl-color--light-blue-100 { background-color: rgb(179,229,252) !important; } .mdl-color-text--light-blue-200 { color: rgb(129,212,250) !important; } .mdl-color--light-blue-200 { background-color: rgb(129,212,250) !important; } .mdl-color-text--light-blue-300 { color: rgb(79,195,247) !important; } .mdl-color--light-blue-300 { background-color: rgb(79,195,247) !important; } .mdl-color-text--light-blue-400 { color: rgb(41,182,246) !important; } .mdl-color--light-blue-400 { background-color: rgb(41,182,246) !important; } .mdl-color-text--light-blue-500 { color: rgb(3,169,244) !important; } .mdl-color--light-blue-500 { background-color: rgb(3,169,244) !important; } .mdl-color-text--light-blue-600 { color: rgb(3,155,229) !important; } .mdl-color--light-blue-600 { background-color: rgb(3,155,229) !important; } .mdl-color-text--light-blue-700 { color: rgb(2,136,209) !important; } .mdl-color--light-blue-700 { background-color: rgb(2,136,209) !important; } .mdl-color-text--light-blue-800 { color: rgb(2,119,189) !important; } .mdl-color--light-blue-800 { background-color: rgb(2,119,189) !important; } .mdl-color-text--light-blue-900 { color: rgb(1,87,155) !important; } .mdl-color--light-blue-900 { background-color: rgb(1,87,155) !important; } .mdl-color-text--light-blue-A100 { color: rgb(128,216,255) !important; } .mdl-color--light-blue-A100 { background-color: rgb(128,216,255) !important; } .mdl-color-text--light-blue-A200 { color: rgb(64,196,255) !important; } .mdl-color--light-blue-A200 { background-color: rgb(64,196,255) !important; } .mdl-color-text--light-blue-A400 { color: rgb(0,176,255) !important; } .mdl-color--light-blue-A400 { background-color: rgb(0,176,255) !important; } .mdl-color-text--light-blue-A700 { color: rgb(0,145,234) !important; } .mdl-color--light-blue-A700 { background-color: rgb(0,145,234) !important; } .mdl-color-text--cyan { color: rgb(0,188,212) !important; } .mdl-color--cyan { background-color: rgb(0,188,212) !important; } .mdl-color-text--cyan-50 { color: rgb(224,247,250) !important; } .mdl-color--cyan-50 { background-color: rgb(224,247,250) !important; } .mdl-color-text--cyan-100 { color: rgb(178,235,242) !important; } .mdl-color--cyan-100 { background-color: rgb(178,235,242) !important; } .mdl-color-text--cyan-200 { color: rgb(128,222,234) !important; } .mdl-color--cyan-200 { background-color: rgb(128,222,234) !important; } .mdl-color-text--cyan-300 { color: rgb(77,208,225) !important; } .mdl-color--cyan-300 { background-color: rgb(77,208,225) !important; } .mdl-color-text--cyan-400 { color: rgb(38,198,218) !important; } .mdl-color--cyan-400 { background-color: rgb(38,198,218) !important; } .mdl-color-text--cyan-500 { color: rgb(0,188,212) !important; } .mdl-color--cyan-500 { background-color: rgb(0,188,212) !important; } .mdl-color-text--cyan-600 { color: rgb(0,172,193) !important; } .mdl-color--cyan-600 { background-color: rgb(0,172,193) !important; } .mdl-color-text--cyan-700 { color: rgb(0,151,167) !important; } .mdl-color--cyan-700 { background-color: rgb(0,151,167) !important; } .mdl-color-text--cyan-800 { color: rgb(0,131,143) !important; } .mdl-color--cyan-800 { background-color: rgb(0,131,143) !important; } .mdl-color-text--cyan-900 { color: rgb(0,96,100) !important; } .mdl-color--cyan-900 { background-color: rgb(0,96,100) !important; } .mdl-color-text--cyan-A100 { color: rgb(132,255,255) !important; } .mdl-color--cyan-A100 { background-color: rgb(132,255,255) !important; } .mdl-color-text--cyan-A200 { color: rgb(24,255,255) !important; } .mdl-color--cyan-A200 { background-color: rgb(24,255,255) !important; } .mdl-color-text--cyan-A400 { color: rgb(0,229,255) !important; } .mdl-color--cyan-A400 { background-color: rgb(0,229,255) !important; } .mdl-color-text--cyan-A700 { color: rgb(0,184,212) !important; } .mdl-color--cyan-A700 { background-color: rgb(0,184,212) !important; } .mdl-color-text--teal { color: rgb(0,150,136) !important; } .mdl-color--teal { background-color: rgb(0,150,136) !important; } .mdl-color-text--teal-50 { color: rgb(224,242,241) !important; } .mdl-color--teal-50 { background-color: rgb(224,242,241) !important; } .mdl-color-text--teal-100 { color: rgb(178,223,219) !important; } .mdl-color--teal-100 { background-color: rgb(178,223,219) !important; } .mdl-color-text--teal-200 { color: rgb(128,203,196) !important; } .mdl-color--teal-200 { background-color: rgb(128,203,196) !important; } .mdl-color-text--teal-300 { color: rgb(77,182,172) !important; } .mdl-color--teal-300 { background-color: rgb(77,182,172) !important; } .mdl-color-text--teal-400 { color: rgb(38,166,154) !important; } .mdl-color--teal-400 { background-color: rgb(38,166,154) !important; } .mdl-color-text--teal-500 { color: rgb(0,150,136) !important; } .mdl-color--teal-500 { background-color: rgb(0,150,136) !important; } .mdl-color-text--teal-600 { color: rgb(0,137,123) !important; } .mdl-color--teal-600 { background-color: rgb(0,137,123) !important; } .mdl-color-text--teal-700 { color: rgb(0,121,107) !important; } .mdl-color--teal-700 { background-color: rgb(0,121,107) !important; } .mdl-color-text--teal-800 { color: rgb(0,105,92) !important; } .mdl-color--teal-800 { background-color: rgb(0,105,92) !important; } .mdl-color-text--teal-900 { color: rgb(0,77,64) !important; } .mdl-color--teal-900 { background-color: rgb(0,77,64) !important; } .mdl-color-text--teal-A100 { color: rgb(167,255,235) !important; } .mdl-color--teal-A100 { background-color: rgb(167,255,235) !important; } .mdl-color-text--teal-A200 { color: rgb(100,255,218) !important; } .mdl-color--teal-A200 { background-color: rgb(100,255,218) !important; } .mdl-color-text--teal-A400 { color: rgb(29,233,182) !important; } .mdl-color--teal-A400 { background-color: rgb(29,233,182) !important; } .mdl-color-text--teal-A700 { color: rgb(0,191,165) !important; } .mdl-color--teal-A700 { background-color: rgb(0,191,165) !important; } .mdl-color-text--green { color: rgb(76,175,80) !important; } .mdl-color--green { background-color: rgb(76,175,80) !important; } .mdl-color-text--green-50 { color: rgb(232,245,233) !important; } .mdl-color--green-50 { background-color: rgb(232,245,233) !important; } .mdl-color-text--green-100 { color: rgb(200,230,201) !important; } .mdl-color--green-100 { background-color: rgb(200,230,201) !important; } .mdl-color-text--green-200 { color: rgb(165,214,167) !important; } .mdl-color--green-200 { background-color: rgb(165,214,167) !important; } .mdl-color-text--green-300 { color: rgb(129,199,132) !important; } .mdl-color--green-300 { background-color: rgb(129,199,132) !important; } .mdl-color-text--green-400 { color: rgb(102,187,106) !important; } .mdl-color--green-400 { background-color: rgb(102,187,106) !important; } .mdl-color-text--green-500 { color: rgb(76,175,80) !important; } .mdl-color--green-500 { background-color: rgb(76,175,80) !important; } .mdl-color-text--green-600 { color: rgb(67,160,71) !important; } .mdl-color--green-600 { background-color: rgb(67,160,71) !important; } .mdl-color-text--green-700 { color: rgb(56,142,60) !important; } .mdl-color--green-700 { background-color: rgb(56,142,60) !important; } .mdl-color-text--green-800 { color: rgb(46,125,50) !important; } .mdl-color--green-800 { background-color: rgb(46,125,50) !important; } .mdl-color-text--green-900 { color: rgb(27,94,32) !important; } .mdl-color--green-900 { background-color: rgb(27,94,32) !important; } .mdl-color-text--green-A100 { color: rgb(185,246,202) !important; } .mdl-color--green-A100 { background-color: rgb(185,246,202) !important; } .mdl-color-text--green-A200 { color: rgb(105,240,174) !important; } .mdl-color--green-A200 { background-color: rgb(105,240,174) !important; } .mdl-color-text--green-A400 { color: rgb(0,230,118) !important; } .mdl-color--green-A400 { background-color: rgb(0,230,118) !important; } .mdl-color-text--green-A700 { color: rgb(0,200,83) !important; } .mdl-color--green-A700 { background-color: rgb(0,200,83) !important; } .mdl-color-text--light-green { color: rgb(139,195,74) !important; } .mdl-color--light-green { background-color: rgb(139,195,74) !important; } .mdl-color-text--light-green-50 { color: rgb(241,248,233) !important; } .mdl-color--light-green-50 { background-color: rgb(241,248,233) !important; } .mdl-color-text--light-green-100 { color: rgb(220,237,200) !important; } .mdl-color--light-green-100 { background-color: rgb(220,237,200) !important; } .mdl-color-text--light-green-200 { color: rgb(197,225,165) !important; } .mdl-color--light-green-200 { background-color: rgb(197,225,165) !important; } .mdl-color-text--light-green-300 { color: rgb(174,213,129) !important; } .mdl-color--light-green-300 { background-color: rgb(174,213,129) !important; } .mdl-color-text--light-green-400 { color: rgb(156,204,101) !important; } .mdl-color--light-green-400 { background-color: rgb(156,204,101) !important; } .mdl-color-text--light-green-500 { color: rgb(139,195,74) !important; } .mdl-color--light-green-500 { background-color: rgb(139,195,74) !important; } .mdl-color-text--light-green-600 { color: rgb(124,179,66) !important; } .mdl-color--light-green-600 { background-color: rgb(124,179,66) !important; } .mdl-color-text--light-green-700 { color: rgb(104,159,56) !important; } .mdl-color--light-green-700 { background-color: rgb(104,159,56) !important; } .mdl-color-text--light-green-800 { color: rgb(85,139,47) !important; } .mdl-color--light-green-800 { background-color: rgb(85,139,47) !important; } .mdl-color-text--light-green-900 { color: rgb(51,105,30) !important; } .mdl-color--light-green-900 { background-color: rgb(51,105,30) !important; } .mdl-color-text--light-green-A100 { color: rgb(204,255,144) !important; } .mdl-color--light-green-A100 { background-color: rgb(204,255,144) !important; } .mdl-color-text--light-green-A200 { color: rgb(178,255,89) !important; } .mdl-color--light-green-A200 { background-color: rgb(178,255,89) !important; } .mdl-color-text--light-green-A400 { color: rgb(118,255,3) !important; } .mdl-color--light-green-A400 { background-color: rgb(118,255,3) !important; } .mdl-color-text--light-green-A700 { color: rgb(100,221,23) !important; } .mdl-color--light-green-A700 { background-color: rgb(100,221,23) !important; } .mdl-color-text--lime { color: rgb(205,220,57) !important; } .mdl-color--lime { background-color: rgb(205,220,57) !important; } .mdl-color-text--lime-50 { color: rgb(249,251,231) !important; } .mdl-color--lime-50 { background-color: rgb(249,251,231) !important; } .mdl-color-text--lime-100 { color: rgb(240,244,195) !important; } .mdl-color--lime-100 { background-color: rgb(240,244,195) !important; } .mdl-color-text--lime-200 { color: rgb(230,238,156) !important; } .mdl-color--lime-200 { background-color: rgb(230,238,156) !important; } .mdl-color-text--lime-300 { color: rgb(220,231,117) !important; } .mdl-color--lime-300 { background-color: rgb(220,231,117) !important; } .mdl-color-text--lime-400 { color: rgb(212,225,87) !important; } .mdl-color--lime-400 { background-color: rgb(212,225,87) !important; } .mdl-color-text--lime-500 { color: rgb(205,220,57) !important; } .mdl-color--lime-500 { background-color: rgb(205,220,57) !important; } .mdl-color-text--lime-600 { color: rgb(192,202,51) !important; } .mdl-color--lime-600 { background-color: rgb(192,202,51) !important; } .mdl-color-text--lime-700 { color: rgb(175,180,43) !important; } .mdl-color--lime-700 { background-color: rgb(175,180,43) !important; } .mdl-color-text--lime-800 { color: rgb(158,157,36) !important; } .mdl-color--lime-800 { background-color: rgb(158,157,36) !important; } .mdl-color-text--lime-900 { color: rgb(130,119,23) !important; } .mdl-color--lime-900 { background-color: rgb(130,119,23) !important; } .mdl-color-text--lime-A100 { color: rgb(244,255,129) !important; } .mdl-color--lime-A100 { background-color: rgb(244,255,129) !important; } .mdl-color-text--lime-A200 { color: rgb(238,255,65) !important; } .mdl-color--lime-A200 { background-color: rgb(238,255,65) !important; } .mdl-color-text--lime-A400 { color: rgb(198,255,0) !important; } .mdl-color--lime-A400 { background-color: rgb(198,255,0) !important; } .mdl-color-text--lime-A700 { color: rgb(174,234,0) !important; } .mdl-color--lime-A700 { background-color: rgb(174,234,0) !important; } .mdl-color-text--yellow { color: rgb(255,235,59) !important; } .mdl-color--yellow { background-color: rgb(255,235,59) !important; } .mdl-color-text--yellow-50 { color: rgb(255,253,231) !important; } .mdl-color--yellow-50 { background-color: rgb(255,253,231) !important; } .mdl-color-text--yellow-100 { color: rgb(255,249,196) !important; } .mdl-color--yellow-100 { background-color: rgb(255,249,196) !important; } .mdl-color-text--yellow-200 { color: rgb(255,245,157) !important; } .mdl-color--yellow-200 { background-color: rgb(255,245,157) !important; } .mdl-color-text--yellow-300 { color: rgb(255,241,118) !important; } .mdl-color--yellow-300 { background-color: rgb(255,241,118) !important; } .mdl-color-text--yellow-400 { color: rgb(255,238,88) !important; } .mdl-color--yellow-400 { background-color: rgb(255,238,88) !important; } .mdl-color-text--yellow-500 { color: rgb(255,235,59) !important; } .mdl-color--yellow-500 { background-color: rgb(255,235,59) !important; } .mdl-color-text--yellow-600 { color: rgb(253,216,53) !important; } .mdl-color--yellow-600 { background-color: rgb(253,216,53) !important; } .mdl-color-text--yellow-700 { color: rgb(251,192,45) !important; } .mdl-color--yellow-700 { background-color: rgb(251,192,45) !important; } .mdl-color-text--yellow-800 { color: rgb(249,168,37) !important; } .mdl-color--yellow-800 { background-color: rgb(249,168,37) !important; } .mdl-color-text--yellow-900 { color: rgb(245,127,23) !important; } .mdl-color--yellow-900 { background-color: rgb(245,127,23) !important; } .mdl-color-text--yellow-A100 { color: rgb(255,255,141) !important; } .mdl-color--yellow-A100 { background-color: rgb(255,255,141) !important; } .mdl-color-text--yellow-A200 { color: rgb(255,255,0) !important; } .mdl-color--yellow-A200 { background-color: rgb(255,255,0) !important; } .mdl-color-text--yellow-A400 { color: rgb(255,234,0) !important; } .mdl-color--yellow-A400 { background-color: rgb(255,234,0) !important; } .mdl-color-text--yellow-A700 { color: rgb(255,214,0) !important; } .mdl-color--yellow-A700 { background-color: rgb(255,214,0) !important; } .mdl-color-text--amber { color: rgb(255,193,7) !important; } .mdl-color--amber { background-color: rgb(255,193,7) !important; } .mdl-color-text--amber-50 { color: rgb(255,248,225) !important; } .mdl-color--amber-50 { background-color: rgb(255,248,225) !important; } .mdl-color-text--amber-100 { color: rgb(255,236,179) !important; } .mdl-color--amber-100 { background-color: rgb(255,236,179) !important; } .mdl-color-text--amber-200 { color: rgb(255,224,130) !important; } .mdl-color--amber-200 { background-color: rgb(255,224,130) !important; } .mdl-color-text--amber-300 { color: rgb(255,213,79) !important; } .mdl-color--amber-300 { background-color: rgb(255,213,79) !important; } .mdl-color-text--amber-400 { color: rgb(255,202,40) !important; } .mdl-color--amber-400 { background-color: rgb(255,202,40) !important; } .mdl-color-text--amber-500 { color: rgb(255,193,7) !important; } .mdl-color--amber-500 { background-color: rgb(255,193,7) !important; } .mdl-color-text--amber-600 { color: rgb(255,179,0) !important; } .mdl-color--amber-600 { background-color: rgb(255,179,0) !important; } .mdl-color-text--amber-700 { color: rgb(255,160,0) !important; } .mdl-color--amber-700 { background-color: rgb(255,160,0) !important; } .mdl-color-text--amber-800 { color: rgb(255,143,0) !important; } .mdl-color--amber-800 { background-color: rgb(255,143,0) !important; } .mdl-color-text--amber-900 { color: rgb(255,111,0) !important; } .mdl-color--amber-900 { background-color: rgb(255,111,0) !important; } .mdl-color-text--amber-A100 { color: rgb(255,229,127) !important; } .mdl-color--amber-A100 { background-color: rgb(255,229,127) !important; } .mdl-color-text--amber-A200 { color: rgb(255,215,64) !important; } .mdl-color--amber-A200 { background-color: rgb(255,215,64) !important; } .mdl-color-text--amber-A400 { color: rgb(255,196,0) !important; } .mdl-color--amber-A400 { background-color: rgb(255,196,0) !important; } .mdl-color-text--amber-A700 { color: rgb(255,171,0) !important; } .mdl-color--amber-A700 { background-color: rgb(255,171,0) !important; } .mdl-color-text--orange { color: rgb(255,152,0) !important; } .mdl-color--orange { background-color: rgb(255,152,0) !important; } .mdl-color-text--orange-50 { color: rgb(255,243,224) !important; } .mdl-color--orange-50 { background-color: rgb(255,243,224) !important; } .mdl-color-text--orange-100 { color: rgb(255,224,178) !important; } .mdl-color--orange-100 { background-color: rgb(255,224,178) !important; } .mdl-color-text--orange-200 { color: rgb(255,204,128) !important; } .mdl-color--orange-200 { background-color: rgb(255,204,128) !important; } .mdl-color-text--orange-300 { color: rgb(255,183,77) !important; } .mdl-color--orange-300 { background-color: rgb(255,183,77) !important; } .mdl-color-text--orange-400 { color: rgb(255,167,38) !important; } .mdl-color--orange-400 { background-color: rgb(255,167,38) !important; } .mdl-color-text--orange-500 { color: rgb(255,152,0) !important; } .mdl-color--orange-500 { background-color: rgb(255,152,0) !important; } .mdl-color-text--orange-600 { color: rgb(251,140,0) !important; } .mdl-color--orange-600 { background-color: rgb(251,140,0) !important; } .mdl-color-text--orange-700 { color: rgb(245,124,0) !important; } .mdl-color--orange-700 { background-color: rgb(245,124,0) !important; } .mdl-color-text--orange-800 { color: rgb(239,108,0) !important; } .mdl-color--orange-800 { background-color: rgb(239,108,0) !important; } .mdl-color-text--orange-900 { color: rgb(230,81,0) !important; } .mdl-color--orange-900 { background-color: rgb(230,81,0) !important; } .mdl-color-text--orange-A100 { color: rgb(255,209,128) !important; } .mdl-color--orange-A100 { background-color: rgb(255,209,128) !important; } .mdl-color-text--orange-A200 { color: rgb(255,171,64) !important; } .mdl-color--orange-A200 { background-color: rgb(255,171,64) !important; } .mdl-color-text--orange-A400 { color: rgb(255,145,0) !important; } .mdl-color--orange-A400 { background-color: rgb(255,145,0) !important; } .mdl-color-text--orange-A700 { color: rgb(255,109,0) !important; } .mdl-color--orange-A700 { background-color: rgb(255,109,0) !important; } .mdl-color-text--deep-orange { color: rgb(255,87,34) !important; } .mdl-color--deep-orange { background-color: rgb(255,87,34) !important; } .mdl-color-text--deep-orange-50 { color: rgb(251,233,231) !important; } .mdl-color--deep-orange-50 { background-color: rgb(251,233,231) !important; } .mdl-color-text--deep-orange-100 { color: rgb(255,204,188) !important; } .mdl-color--deep-orange-100 { background-color: rgb(255,204,188) !important; } .mdl-color-text--deep-orange-200 { color: rgb(255,171,145) !important; } .mdl-color--deep-orange-200 { background-color: rgb(255,171,145) !important; } .mdl-color-text--deep-orange-300 { color: rgb(255,138,101) !important; } .mdl-color--deep-orange-300 { background-color: rgb(255,138,101) !important; } .mdl-color-text--deep-orange-400 { color: rgb(255,112,67) !important; } .mdl-color--deep-orange-400 { background-color: rgb(255,112,67) !important; } .mdl-color-text--deep-orange-500 { color: rgb(255,87,34) !important; } .mdl-color--deep-orange-500 { background-color: rgb(255,87,34) !important; } .mdl-color-text--deep-orange-600 { color: rgb(244,81,30) !important; } .mdl-color--deep-orange-600 { background-color: rgb(244,81,30) !important; } .mdl-color-text--deep-orange-700 { color: rgb(230,74,25) !important; } .mdl-color--deep-orange-700 { background-color: rgb(230,74,25) !important; } .mdl-color-text--deep-orange-800 { color: rgb(216,67,21) !important; } .mdl-color--deep-orange-800 { background-color: rgb(216,67,21) !important; } .mdl-color-text--deep-orange-900 { color: rgb(191,54,12) !important; } .mdl-color--deep-orange-900 { background-color: rgb(191,54,12) !important; } .mdl-color-text--deep-orange-A100 { color: rgb(255,158,128) !important; } .mdl-color--deep-orange-A100 { background-color: rgb(255,158,128) !important; } .mdl-color-text--deep-orange-A200 { color: rgb(255,110,64) !important; } .mdl-color--deep-orange-A200 { background-color: rgb(255,110,64) !important; } .mdl-color-text--deep-orange-A400 { color: rgb(255,61,0) !important; } .mdl-color--deep-orange-A400 { background-color: rgb(255,61,0) !important; } .mdl-color-text--deep-orange-A700 { color: rgb(221,44,0) !important; } .mdl-color--deep-orange-A700 { background-color: rgb(221,44,0) !important; } .mdl-color-text--brown { color: rgb(121,85,72) !important; } .mdl-color--brown { background-color: rgb(121,85,72) !important; } .mdl-color-text--brown-50 { color: rgb(239,235,233) !important; } .mdl-color--brown-50 { background-color: rgb(239,235,233) !important; } .mdl-color-text--brown-100 { color: rgb(215,204,200) !important; } .mdl-color--brown-100 { background-color: rgb(215,204,200) !important; } .mdl-color-text--brown-200 { color: rgb(188,170,164) !important; } .mdl-color--brown-200 { background-color: rgb(188,170,164) !important; } .mdl-color-text--brown-300 { color: rgb(161,136,127) !important; } .mdl-color--brown-300 { background-color: rgb(161,136,127) !important; } .mdl-color-text--brown-400 { color: rgb(141,110,99) !important; } .mdl-color--brown-400 { background-color: rgb(141,110,99) !important; } .mdl-color-text--brown-500 { color: rgb(121,85,72) !important; } .mdl-color--brown-500 { background-color: rgb(121,85,72) !important; } .mdl-color-text--brown-600 { color: rgb(109,76,65) !important; } .mdl-color--brown-600 { background-color: rgb(109,76,65) !important; } .mdl-color-text--brown-700 { color: rgb(93,64,55) !important; } .mdl-color--brown-700 { background-color: rgb(93,64,55) !important; } .mdl-color-text--brown-800 { color: rgb(78,52,46) !important; } .mdl-color--brown-800 { background-color: rgb(78,52,46) !important; } .mdl-color-text--brown-900 { color: rgb(62,39,35) !important; } .mdl-color--brown-900 { background-color: rgb(62,39,35) !important; } .mdl-color-text--grey { color: rgb(158,158,158) !important; } .mdl-color--grey { background-color: rgb(158,158,158) !important; } .mdl-color-text--grey-50 { color: rgb(250,250,250) !important; } .mdl-color--grey-50 { background-color: rgb(250,250,250) !important; } .mdl-color-text--grey-100 { color: rgb(245,245,245) !important; } .mdl-color--grey-100 { background-color: rgb(245,245,245) !important; } .mdl-color-text--grey-200 { color: rgb(238,238,238) !important; } .mdl-color--grey-200 { background-color: rgb(238,238,238) !important; } .mdl-color-text--grey-300 { color: rgb(224,224,224) !important; } .mdl-color--grey-300 { background-color: rgb(224,224,224) !important; } .mdl-color-text--grey-400 { color: rgb(189,189,189) !important; } .mdl-color--grey-400 { background-color: rgb(189,189,189) !important; } .mdl-color-text--grey-500 { color: rgb(158,158,158) !important; } .mdl-color--grey-500 { background-color: rgb(158,158,158) !important; } .mdl-color-text--grey-600 { color: rgb(117,117,117) !important; } .mdl-color--grey-600 { background-color: rgb(117,117,117) !important; } .mdl-color-text--grey-700 { color: rgb(97,97,97) !important; } .mdl-color--grey-700 { background-color: rgb(97,97,97) !important; } .mdl-color-text--grey-800 { color: rgb(66,66,66) !important; } .mdl-color--grey-800 { background-color: rgb(66,66,66) !important; } .mdl-color-text--grey-900 { color: rgb(33,33,33) !important; } .mdl-color--grey-900 { background-color: rgb(33,33,33) !important; } .mdl-color-text--blue-grey { color: rgb(96,125,139) !important; } .mdl-color--blue-grey { background-color: rgb(96,125,139) !important; } .mdl-color-text--blue-grey-50 { color: rgb(236,239,241) !important; } .mdl-color--blue-grey-50 { background-color: rgb(236,239,241) !important; } .mdl-color-text--blue-grey-100 { color: rgb(207,216,220) !important; } .mdl-color--blue-grey-100 { background-color: rgb(207,216,220) !important; } .mdl-color-text--blue-grey-200 { color: rgb(176,190,197) !important; } .mdl-color--blue-grey-200 { background-color: rgb(176,190,197) !important; } .mdl-color-text--blue-grey-300 { color: rgb(144,164,174) !important; } .mdl-color--blue-grey-300 { background-color: rgb(144,164,174) !important; } .mdl-color-text--blue-grey-400 { color: rgb(120,144,156) !important; } .mdl-color--blue-grey-400 { background-color: rgb(120,144,156) !important; } .mdl-color-text--blue-grey-500 { color: rgb(96,125,139) !important; } .mdl-color--blue-grey-500 { background-color: rgb(96,125,139) !important; } .mdl-color-text--blue-grey-600 { color: rgb(84,110,122) !important; } .mdl-color--blue-grey-600 { background-color: rgb(84,110,122) !important; } .mdl-color-text--blue-grey-700 { color: rgb(69,90,100) !important; } .mdl-color--blue-grey-700 { background-color: rgb(69,90,100) !important; } .mdl-color-text--blue-grey-800 { color: rgb(55,71,79) !important; } .mdl-color--blue-grey-800 { background-color: rgb(55,71,79) !important; } .mdl-color-text--blue-grey-900 { color: rgb(38,50,56) !important; } .mdl-color--blue-grey-900 { background-color: rgb(38,50,56) !important; } .mdl-color--black { background-color: rgb(0,0,0) !important; } .mdl-color-text--black { color: rgb(0,0,0) !important; } .mdl-color--white { background-color: rgb(255,255,255) !important; } .mdl-color-text--white { color: rgb(255,255,255) !important; } .mdl-color--primary { background-color: rgb(0,162,77) !important; } .mdl-color--primary-contrast { background-color: rgb(255,255,255) !important; } .mdl-color--primary-dark { background-color: rgb(48,63,159) !important; } .mdl-color--accent { background-color: rgb(255,64,129) !important; } .mdl-color--accent-contrast { background-color: rgb(255,255,255) !important; } .mdl-color-text--primary { color: rgb(0,162,77) !important; } .mdl-color-text--primary-contrast { color: rgb(255,255,255) !important; } .mdl-color-text--primary-dark { color: rgb(48,63,159) !important; } .mdl-color-text--accent { color: rgb(255,64,129) !important; } .mdl-color-text--accent-contrast { color: rgb(255,255,255) !important; } /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /*------------------------------------*\ $CONTENTS \*------------------------------------*/ /** * STYLE GUIDE VARIABLES------------------Declarations of Sass variables * -----Typography * -----Colors * -----Textfield * -----Switch * -----Spinner * -----Radio * -----Menu * -----List * -----Layout * -----Icon toggles * -----Footer * -----Column * -----Checkbox * -----Card * -----Button * -----Animation * -----Progress * -----Badge * -----Shadows * -----Grid * -----Data table * -----Dialog * -----Snackbar * -----Tooltip * -----Chip * * Even though all variables have the `!default` directive, most of them * should not be changed as they are dependent one another. This can cause * visual distortions (like alignment issues) that are hard to track down * and fix. */ /* ========== TYPOGRAPHY ========== */ /* We're splitting fonts into "preferred" and "performance" in order to optimize page loading. For important text, such as the body, we want it to load immediately and not wait for the web font load, whereas for other sections, such as headers and titles, we're OK with things taking a bit longer to load. We do have some optional classes and parameters in the mixins, in case you definitely want to make sure you're using the preferred font and don't mind the performance hit. We should be able to improve on this once CSS Font Loading L3 becomes more widely available. */ /* ========== COLORS ========== */ /** * * Material design color palettes. * @see http://www.google.com/design/spec/style/color.html * **/ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== Color Palettes ========== */ /* colors.scss */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== IMAGES ========== */ /* ========== Color & Themes ========== */ /* ========== Typography ========== */ /* ========== Components ========== */ /* ========== Standard Buttons ========== */ /* ========== Icon Toggles ========== */ /* ========== Radio Buttons ========== */ /* ========== Ripple effect ========== */ /* ========== Layout ========== */ /* ========== Content Tabs ========== */ /* ========== Checkboxes ========== */ /* ========== Switches ========== */ /* ========== Spinner ========== */ /* ========== Text fields ========== */ /* ========== Card ========== */ /* ========== Sliders ========== */ /* ========== Progress ========== */ /* ========== List ========== */ /* ========== Item ========== */ /* ========== Dropdown menu ========== */ /* ========== Tooltips ========== */ /* ========== Footer ========== */ /* TEXTFIELD */ /* SWITCH */ /* SPINNER */ /* RADIO */ /* MENU */ /* LIST */ /* LAYOUT */ /* ICON TOGGLE */ /* FOOTER */ /*mega-footer*/ /*mini-footer*/ /* CHECKBOX */ /* CARD */ /* Card dimensions */ /* Cover image */ /* BUTTON */ /** * * Dimensions * */ /* ANIMATION */ /* PROGRESS */ /* BADGE */ /* SHADOWS */ /* GRID */ /* DATA TABLE */ /* DIALOG */ /* SNACKBAR */ /* TOOLTIP */ /* CHIP */ .mdl-ripple { background: rgb(0,0,0); border-radius: 50%; height: 50px; left: 0; opacity: 0; pointer-events: none; position: absolute; top: 0; transform: translate(-50%, -50%); width: 50px; overflow: hidden; } .mdl-ripple.is-animating { transition: transform 0.3s cubic-bezier(0, 0, 0.2, 1), width 0.3s cubic-bezier(0, 0, 0.2, 1), height 0.3s cubic-bezier(0, 0, 0.2, 1), opacity 0.6s cubic-bezier(0, 0, 0.2, 1); } .mdl-ripple.is-visible { opacity: 0.3; } /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /*------------------------------------*\ $CONTENTS \*------------------------------------*/ /** * STYLE GUIDE VARIABLES------------------Declarations of Sass variables * -----Typography * -----Colors * -----Textfield * -----Switch * -----Spinner * -----Radio * -----Menu * -----List * -----Layout * -----Icon toggles * -----Footer * -----Column * -----Checkbox * -----Card * -----Button * -----Animation * -----Progress * -----Badge * -----Shadows * -----Grid * -----Data table * -----Dialog * -----Snackbar * -----Tooltip * -----Chip * * Even though all variables have the `!default` directive, most of them * should not be changed as they are dependent one another. This can cause * visual distortions (like alignment issues) that are hard to track down * and fix. */ /* ========== TYPOGRAPHY ========== */ /* We're splitting fonts into "preferred" and "performance" in order to optimize page loading. For important text, such as the body, we want it to load immediately and not wait for the web font load, whereas for other sections, such as headers and titles, we're OK with things taking a bit longer to load. We do have some optional classes and parameters in the mixins, in case you definitely want to make sure you're using the preferred font and don't mind the performance hit. We should be able to improve on this once CSS Font Loading L3 becomes more widely available. */ /* ========== COLORS ========== */ /** * * Material design color palettes. * @see http://www.google.com/design/spec/style/color.html * **/ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== Color Palettes ========== */ /* colors.scss */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== IMAGES ========== */ /* ========== Color & Themes ========== */ /* ========== Typography ========== */ /* ========== Components ========== */ /* ========== Standard Buttons ========== */ /* ========== Icon Toggles ========== */ /* ========== Radio Buttons ========== */ /* ========== Ripple effect ========== */ /* ========== Layout ========== */ /* ========== Content Tabs ========== */ /* ========== Checkboxes ========== */ /* ========== Switches ========== */ /* ========== Spinner ========== */ /* ========== Text fields ========== */ /* ========== Card ========== */ /* ========== Sliders ========== */ /* ========== Progress ========== */ /* ========== List ========== */ /* ========== Item ========== */ /* ========== Dropdown menu ========== */ /* ========== Tooltips ========== */ /* ========== Footer ========== */ /* TEXTFIELD */ /* SWITCH */ /* SPINNER */ /* RADIO */ /* MENU */ /* LIST */ /* LAYOUT */ /* ICON TOGGLE */ /* FOOTER */ /*mega-footer*/ /*mini-footer*/ /* CHECKBOX */ /* CARD */ /* Card dimensions */ /* Cover image */ /* BUTTON */ /** * * Dimensions * */ /* ANIMATION */ /* PROGRESS */ /* BADGE */ /* SHADOWS */ /* GRID */ /* DATA TABLE */ /* DIALOG */ /* SNACKBAR */ /* TOOLTIP */ /* CHIP */ .mdl-animation--default { transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); } .mdl-animation--fast-out-slow-in { transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); } .mdl-animation--linear-out-slow-in { transition-timing-function: cubic-bezier(0, 0, 0.2, 1); } .mdl-animation--fast-out-linear-in { transition-timing-function: cubic-bezier(0.4, 0, 1, 1); } /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /*------------------------------------*\ $CONTENTS \*------------------------------------*/ /** * STYLE GUIDE VARIABLES------------------Declarations of Sass variables * -----Typography * -----Colors * -----Textfield * -----Switch * -----Spinner * -----Radio * -----Menu * -----List * -----Layout * -----Icon toggles * -----Footer * -----Column * -----Checkbox * -----Card * -----Button * -----Animation * -----Progress * -----Badge * -----Shadows * -----Grid * -----Data table * -----Dialog * -----Snackbar * -----Tooltip * -----Chip * * Even though all variables have the `!default` directive, most of them * should not be changed as they are dependent one another. This can cause * visual distortions (like alignment issues) that are hard to track down * and fix. */ /* ========== TYPOGRAPHY ========== */ /* We're splitting fonts into "preferred" and "performance" in order to optimize page loading. For important text, such as the body, we want it to load immediately and not wait for the web font load, whereas for other sections, such as headers and titles, we're OK with things taking a bit longer to load. We do have some optional classes and parameters in the mixins, in case you definitely want to make sure you're using the preferred font and don't mind the performance hit. We should be able to improve on this once CSS Font Loading L3 becomes more widely available. */ /* ========== COLORS ========== */ /** * * Material design color palettes. * @see http://www.google.com/design/spec/style/color.html * **/ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== Color Palettes ========== */ /* colors.scss */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== IMAGES ========== */ /* ========== Color & Themes ========== */ /* ========== Typography ========== */ /* ========== Components ========== */ /* ========== Standard Buttons ========== */ /* ========== Icon Toggles ========== */ /* ========== Radio Buttons ========== */ /* ========== Ripple effect ========== */ /* ========== Layout ========== */ /* ========== Content Tabs ========== */ /* ========== Checkboxes ========== */ /* ========== Switches ========== */ /* ========== Spinner ========== */ /* ========== Text fields ========== */ /* ========== Card ========== */ /* ========== Sliders ========== */ /* ========== Progress ========== */ /* ========== List ========== */ /* ========== Item ========== */ /* ========== Dropdown menu ========== */ /* ========== Tooltips ========== */ /* ========== Footer ========== */ /* TEXTFIELD */ /* SWITCH */ /* SPINNER */ /* RADIO */ /* MENU */ /* LIST */ /* LAYOUT */ /* ICON TOGGLE */ /* FOOTER */ /*mega-footer*/ /*mini-footer*/ /* CHECKBOX */ /* CARD */ /* Card dimensions */ /* Cover image */ /* BUTTON */ /** * * Dimensions * */ /* ANIMATION */ /* PROGRESS */ /* BADGE */ /* SHADOWS */ /* GRID */ /* DATA TABLE */ /* DIALOG */ /* SNACKBAR */ /* TOOLTIP */ /* CHIP */ .mdl-badge { position: relative; white-space: nowrap; margin-right: 24px; } .mdl-badge:not([data-badge]) { margin-right: auto; } .mdl-badge[data-badge]:after { content: attr(data-badge); display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; align-content: center; align-items: center; position: absolute; top: -11px; right: -24px; font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-weight: 600; font-size: 12px; width: 22px; height: 22px; border-radius: 50%; background: rgb(255,64,129); color: rgb(255,255,255); } .mdl-button .mdl-badge[data-badge]:after { top: -10px; right: -5px; } .mdl-badge.mdl-badge--no-background[data-badge]:after { color: rgb(255,64,129); background: rgba(255,255,255,0.2); box-shadow: 0 0 1px gray; } .mdl-badge.mdl-badge--overlap { margin-right: 10px; } .mdl-badge.mdl-badge--overlap:after { right: -10px; } /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /*------------------------------------*\ $CONTENTS \*------------------------------------*/ /** * STYLE GUIDE VARIABLES------------------Declarations of Sass variables * -----Typography * -----Colors * -----Textfield * -----Switch * -----Spinner * -----Radio * -----Menu * -----List * -----Layout * -----Icon toggles * -----Footer * -----Column * -----Checkbox * -----Card * -----Button * -----Animation * -----Progress * -----Badge * -----Shadows * -----Grid * -----Data table * -----Dialog * -----Snackbar * -----Tooltip * -----Chip * * Even though all variables have the `!default` directive, most of them * should not be changed as they are dependent one another. This can cause * visual distortions (like alignment issues) that are hard to track down * and fix. */ /* ========== TYPOGRAPHY ========== */ /* We're splitting fonts into "preferred" and "performance" in order to optimize page loading. For important text, such as the body, we want it to load immediately and not wait for the web font load, whereas for other sections, such as headers and titles, we're OK with things taking a bit longer to load. We do have some optional classes and parameters in the mixins, in case you definitely want to make sure you're using the preferred font and don't mind the performance hit. We should be able to improve on this once CSS Font Loading L3 becomes more widely available. */ /* ========== COLORS ========== */ /** * * Material design color palettes. * @see http://www.google.com/design/spec/style/color.html * **/ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== Color Palettes ========== */ /* colors.scss */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== IMAGES ========== */ /* ========== Color & Themes ========== */ /* ========== Typography ========== */ /* ========== Components ========== */ /* ========== Standard Buttons ========== */ /* ========== Icon Toggles ========== */ /* ========== Radio Buttons ========== */ /* ========== Ripple effect ========== */ /* ========== Layout ========== */ /* ========== Content Tabs ========== */ /* ========== Checkboxes ========== */ /* ========== Switches ========== */ /* ========== Spinner ========== */ /* ========== Text fields ========== */ /* ========== Card ========== */ /* ========== Sliders ========== */ /* ========== Progress ========== */ /* ========== List ========== */ /* ========== Item ========== */ /* ========== Dropdown menu ========== */ /* ========== Tooltips ========== */ /* ========== Footer ========== */ /* TEXTFIELD */ /* SWITCH */ /* SPINNER */ /* RADIO */ /* MENU */ /* LIST */ /* LAYOUT */ /* ICON TOGGLE */ /* FOOTER */ /*mega-footer*/ /*mini-footer*/ /* CHECKBOX */ /* CARD */ /* Card dimensions */ /* Cover image */ /* BUTTON */ /** * * Dimensions * */ /* ANIMATION */ /* PROGRESS */ /* BADGE */ /* SHADOWS */ /* GRID */ /* DATA TABLE */ /* DIALOG */ /* SNACKBAR */ /* TOOLTIP */ /* CHIP */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* Typography */ /* Shadows */ /* Animations */ /* Dialog */ .mdl-button { background: transparent; border: none; border-radius: 2px; color: rgb(0,0,0); position: relative; height: 36px; margin: 0; min-width: 64px; padding: 0 16px; display: inline-block; font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 14px; font-weight: 500; text-transform: uppercase; line-height: 1; letter-spacing: 0; overflow: hidden; will-change: box-shadow; transition: box-shadow 0.2s cubic-bezier(0.4, 0, 1, 1), background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0.2s cubic-bezier(0.4, 0, 0.2, 1); outline: none; cursor: pointer; text-decoration: none; text-align: center; line-height: 36px; vertical-align: middle; } .mdl-button::-moz-focus-inner { border: 0; } .mdl-button:hover { background-color: rgba(158,158,158, 0.20); } .mdl-button:focus:not(:active) { background-color: rgba(0,0,0, 0.12); } .mdl-button:active { background-color: rgba(158,158,158, 0.40); } .mdl-button.mdl-button--colored { color: rgb(0,162,77); } .mdl-button.mdl-button--colored:focus:not(:active) { background-color: rgba(0,0,0, 0.12); } input.mdl-button[type=submit] { -webkit-appearance: none; } .mdl-button--raised { background: rgba(158,158,158, 0.20); box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); } .mdl-button--raised:active { box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.2); background-color: rgba(158,158,158, 0.40); } .mdl-button--raised:focus:not(:active) { box-shadow: 0 0 8px rgba(0, 0, 0, 0.18), 0 8px 16px rgba(0, 0, 0, 0.36); background-color: rgba(158,158,158, 0.40); } .mdl-button--raised.mdl-button--colored { background: rgb(0,162,77); color: rgb(255,255,255); } .mdl-button--raised.mdl-button--colored:hover { background-color: rgb(0,162,77); } .mdl-button--raised.mdl-button--colored:active { background-color: rgb(0,162,77); } .mdl-button--raised.mdl-button--colored:focus:not(:active) { background-color: rgb(0,162,77); } .mdl-button--raised.mdl-button--colored .mdl-ripple { background: rgb(255,255,255); } .mdl-button--fab { border-radius: 50%; font-size: 24px; height: 56px; margin: auto; min-width: 56px; width: 56px; padding: 0; overflow: hidden; background: rgba(158,158,158, 0.20); box-shadow: 0 1px 1.5px 0 rgba(0, 0, 0, 0.12), 0 1px 1px 0 rgba(0, 0, 0, 0.24); position: relative; line-height: normal; } .mdl-button--fab .material-icons { position: absolute; top: 50%; left: 50%; transform: translate(-12px, -12px); line-height: 24px; width: 24px; } .mdl-button--fab.mdl-button--mini-fab { height: 40px; min-width: 40px; width: 40px; } .mdl-button--fab .mdl-button__ripple-container { border-radius: 50%; -webkit-mask-image: -webkit-radial-gradient(circle, white, black); } .mdl-button--fab:active { box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.2); background-color: rgba(158,158,158, 0.40); } .mdl-button--fab:focus:not(:active) { box-shadow: 0 0 8px rgba(0, 0, 0, 0.18), 0 8px 16px rgba(0, 0, 0, 0.36); background-color: rgba(158,158,158, 0.40); } .mdl-button--fab.mdl-button--colored { background: rgb(255,64,129); color: rgb(255,255,255); } .mdl-button--fab.mdl-button--colored:hover { background-color: rgb(255,64,129); } .mdl-button--fab.mdl-button--colored:focus:not(:active) { background-color: rgb(255,64,129); } .mdl-button--fab.mdl-button--colored:active { background-color: rgb(255,64,129); } .mdl-button--fab.mdl-button--colored .mdl-ripple { background: rgb(255,255,255); } .mdl-button--icon { border-radius: 50%; font-size: 24px; height: 32px; margin-left: 0; margin-right: 0; min-width: 32px; width: 32px; padding: 0; overflow: hidden; color: inherit; line-height: normal; } .mdl-button--icon .material-icons { position: absolute; top: 50%; left: 50%; transform: translate(-12px, -12px); line-height: 24px; width: 24px; } .mdl-button--icon.mdl-button--mini-icon { height: 24px; min-width: 24px; width: 24px; } .mdl-button--icon.mdl-button--mini-icon .material-icons { top: 0px; left: 0px; } .mdl-button--icon .mdl-button__ripple-container { border-radius: 50%; -webkit-mask-image: -webkit-radial-gradient(circle, white, black); } .mdl-button__ripple-container { display: block; height: 100%; left: 0px; position: absolute; top: 0px; width: 100%; z-index: 0; overflow: hidden; } .mdl-button[disabled] .mdl-button__ripple-container .mdl-ripple, .mdl-button.mdl-button--disabled .mdl-button__ripple-container .mdl-ripple { background-color: transparent; } .mdl-button--primary.mdl-button--primary { color: rgb(0,162,77); } .mdl-button--primary.mdl-button--primary .mdl-ripple { background: rgb(255,255,255); } .mdl-button--primary.mdl-button--primary.mdl-button--raised, .mdl-button--primary.mdl-button--primary.mdl-button--fab { color: rgb(255,255,255); background-color: rgb(0,162,77); } .mdl-button--accent.mdl-button--accent { color: rgb(255,64,129); } .mdl-button--accent.mdl-button--accent .mdl-ripple { background: rgb(255,255,255); } .mdl-button--accent.mdl-button--accent.mdl-button--raised, .mdl-button--accent.mdl-button--accent.mdl-button--fab { color: rgb(255,255,255); background-color: rgb(255,64,129); } .mdl-button[disabled][disabled], .mdl-button.mdl-button--disabled.mdl-button--disabled { color: rgba(0,0,0, 0.26); cursor: default; background-color: transparent; } .mdl-button--fab[disabled][disabled], .mdl-button--fab.mdl-button--disabled.mdl-button--disabled { background-color: rgba(0,0,0, 0.12); color: rgba(0,0,0, 0.26); } .mdl-button--raised[disabled][disabled], .mdl-button--raised.mdl-button--disabled.mdl-button--disabled { background-color: rgba(0,0,0, 0.12); color: rgba(0,0,0, 0.26); box-shadow: none; } .mdl-button--colored[disabled][disabled], .mdl-button--colored.mdl-button--disabled.mdl-button--disabled { color: rgba(0,0,0, 0.26); } .mdl-button .material-icons { vertical-align: middle; } /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /*------------------------------------*\ $CONTENTS \*------------------------------------*/ /** * STYLE GUIDE VARIABLES------------------Declarations of Sass variables * -----Typography * -----Colors * -----Textfield * -----Switch * -----Spinner * -----Radio * -----Menu * -----List * -----Layout * -----Icon toggles * -----Footer * -----Column * -----Checkbox * -----Card * -----Button * -----Animation * -----Progress * -----Badge * -----Shadows * -----Grid * -----Data table * -----Dialog * -----Snackbar * -----Tooltip * -----Chip * * Even though all variables have the `!default` directive, most of them * should not be changed as they are dependent one another. This can cause * visual distortions (like alignment issues) that are hard to track down * and fix. */ /* ========== TYPOGRAPHY ========== */ /* We're splitting fonts into "preferred" and "performance" in order to optimize page loading. For important text, such as the body, we want it to load immediately and not wait for the web font load, whereas for other sections, such as headers and titles, we're OK with things taking a bit longer to load. We do have some optional classes and parameters in the mixins, in case you definitely want to make sure you're using the preferred font and don't mind the performance hit. We should be able to improve on this once CSS Font Loading L3 becomes more widely available. */ /* ========== COLORS ========== */ /** * * Material design color palettes. * @see http://www.google.com/design/spec/style/color.html * **/ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== Color Palettes ========== */ /* colors.scss */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== IMAGES ========== */ /* ========== Color & Themes ========== */ /* ========== Typography ========== */ /* ========== Components ========== */ /* ========== Standard Buttons ========== */ /* ========== Icon Toggles ========== */ /* ========== Radio Buttons ========== */ /* ========== Ripple effect ========== */ /* ========== Layout ========== */ /* ========== Content Tabs ========== */ /* ========== Checkboxes ========== */ /* ========== Switches ========== */ /* ========== Spinner ========== */ /* ========== Text fields ========== */ /* ========== Card ========== */ /* ========== Sliders ========== */ /* ========== Progress ========== */ /* ========== List ========== */ /* ========== Item ========== */ /* ========== Dropdown menu ========== */ /* ========== Tooltips ========== */ /* ========== Footer ========== */ /* TEXTFIELD */ /* SWITCH */ /* SPINNER */ /* RADIO */ /* MENU */ /* LIST */ /* LAYOUT */ /* ICON TOGGLE */ /* FOOTER */ /*mega-footer*/ /*mini-footer*/ /* CHECKBOX */ /* CARD */ /* Card dimensions */ /* Cover image */ /* BUTTON */ /** * * Dimensions * */ /* ANIMATION */ /* PROGRESS */ /* BADGE */ /* SHADOWS */ /* GRID */ /* DATA TABLE */ /* DIALOG */ /* SNACKBAR */ /* TOOLTIP */ /* CHIP */ .mdl-card { display: flex; flex-direction: column; font-size: 16px; font-weight: 400; min-height: 200px; overflow: hidden; width: 330px; z-index: 1; position: relative; background: rgb(255,255,255); border-radius: 2px; box-sizing: border-box; } .mdl-card__media { background-color: rgb(255,64,129); background-repeat: repeat; background-position: 50% 50%; background-size: cover; background-origin: padding-box; background-attachment: scroll; box-sizing: border-box; } .mdl-card__title { align-items: center; color: rgb(0,0,0); display: block; display: flex; justify-content: stretch; line-height: normal; padding: 16px 16px; perspective-origin: 165px 56px; transform-origin: 165px 56px; box-sizing: border-box; } .mdl-card__title.mdl-card--border { border-bottom: 1px solid rgba(0, 0, 0, 0.1); } .mdl-card__title-text { align-self: flex-end; color: inherit; display: block; display: flex; font-size: 24px; font-weight: 300; line-height: normal; overflow: hidden; transform-origin: 149px 48px; margin: 0; } .mdl-card__subtitle-text { font-size: 14px; color: rgba(0,0,0, 0.54); margin: 0; } .mdl-card__supporting-text { color: rgba(0,0,0, 0.54); font-size: 1rem; line-height: 18px; overflow: hidden; padding: 16px 16px; width: 90%; } .mdl-card__supporting-text.mdl-card--border { border-bottom: 1px solid rgba(0, 0, 0, 0.1); } .mdl-card__actions { font-size: 16px; line-height: normal; width: 100%; background-color: rgba(0, 0, 0, 0); padding: 8px; box-sizing: border-box; } .mdl-card__actions.mdl-card--border { border-top: 1px solid rgba(0, 0, 0, 0.1); } .mdl-card--expand { flex-grow: 1; } .mdl-card__menu { position: absolute; right: 16px; top: 16px; } /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /*------------------------------------*\ $CONTENTS \*------------------------------------*/ /** * STYLE GUIDE VARIABLES------------------Declarations of Sass variables * -----Typography * -----Colors * -----Textfield * -----Switch * -----Spinner * -----Radio * -----Menu * -----List * -----Layout * -----Icon toggles * -----Footer * -----Column * -----Checkbox * -----Card * -----Button * -----Animation * -----Progress * -----Badge * -----Shadows * -----Grid * -----Data table * -----Dialog * -----Snackbar * -----Tooltip * -----Chip * * Even though all variables have the `!default` directive, most of them * should not be changed as they are dependent one another. This can cause * visual distortions (like alignment issues) that are hard to track down * and fix. */ /* ========== TYPOGRAPHY ========== */ /* We're splitting fonts into "preferred" and "performance" in order to optimize page loading. For important text, such as the body, we want it to load immediately and not wait for the web font load, whereas for other sections, such as headers and titles, we're OK with things taking a bit longer to load. We do have some optional classes and parameters in the mixins, in case you definitely want to make sure you're using the preferred font and don't mind the performance hit. We should be able to improve on this once CSS Font Loading L3 becomes more widely available. */ /* ========== COLORS ========== */ /** * * Material design color palettes. * @see http://www.google.com/design/spec/style/color.html * **/ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== Color Palettes ========== */ /* colors.scss */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== IMAGES ========== */ /* ========== Color & Themes ========== */ /* ========== Typography ========== */ /* ========== Components ========== */ /* ========== Standard Buttons ========== */ /* ========== Icon Toggles ========== */ /* ========== Radio Buttons ========== */ /* ========== Ripple effect ========== */ /* ========== Layout ========== */ /* ========== Content Tabs ========== */ /* ========== Checkboxes ========== */ /* ========== Switches ========== */ /* ========== Spinner ========== */ /* ========== Text fields ========== */ /* ========== Card ========== */ /* ========== Sliders ========== */ /* ========== Progress ========== */ /* ========== List ========== */ /* ========== Item ========== */ /* ========== Dropdown menu ========== */ /* ========== Tooltips ========== */ /* ========== Footer ========== */ /* TEXTFIELD */ /* SWITCH */ /* SPINNER */ /* RADIO */ /* MENU */ /* LIST */ /* LAYOUT */ /* ICON TOGGLE */ /* FOOTER */ /*mega-footer*/ /*mini-footer*/ /* CHECKBOX */ /* CARD */ /* Card dimensions */ /* Cover image */ /* BUTTON */ /** * * Dimensions * */ /* ANIMATION */ /* PROGRESS */ /* BADGE */ /* SHADOWS */ /* GRID */ /* DATA TABLE */ /* DIALOG */ /* SNACKBAR */ /* TOOLTIP */ /* CHIP */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* Typography */ /* Shadows */ /* Animations */ /* Dialog */ .mdl-checkbox { position: relative; z-index: 1; vertical-align: middle; display: inline-block; box-sizing: border-box; width: 100%; height: 24px; margin: 0; padding: 0; } .mdl-checkbox.is-upgraded { padding-left: 24px; } .mdl-checkbox__input { line-height: 24px; } .mdl-checkbox.is-upgraded .mdl-checkbox__input { position: absolute; width: 0; height: 0; margin: 0; padding: 0; opacity: 0; appearance: none; border: none; } .mdl-checkbox__box-outline { position: absolute; top: 3px; left: 0; display: inline-block; box-sizing: border-box; width: 16px; height: 16px; margin: 0; cursor: pointer; overflow: hidden; border: 2px solid rgba(0,0,0, 0.54); border-radius: 2px; z-index: 2; } .mdl-checkbox.is-checked .mdl-checkbox__box-outline { border: 2px solid rgb(0,162,77); } fieldset[disabled] .mdl-checkbox .mdl-checkbox__box-outline, .mdl-checkbox.is-disabled .mdl-checkbox__box-outline { border: 2px solid rgba(0,0,0, 0.26); cursor: auto; } .mdl-checkbox__focus-helper { position: absolute; top: 3px; left: 0; display: inline-block; box-sizing: border-box; width: 16px; height: 16px; border-radius: 50%; background-color: transparent; } .mdl-checkbox.is-focused .mdl-checkbox__focus-helper { box-shadow: 0 0 0px 8px rgba(0, 0, 0, 0.1); background-color: rgba(0, 0, 0, 0.1); } .mdl-checkbox.is-focused.is-checked .mdl-checkbox__focus-helper { box-shadow: 0 0 0px 8px rgba(0,162,77, 0.26); background-color: rgba(0,162,77, 0.26); } .mdl-checkbox__tick-outline { position: absolute; top: 0; left: 0; height: 100%; width: 100%; mask: url("/images/tick-mask.svg?embed"); background: transparent; transition-duration: 0.28s; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-property: background; } .mdl-checkbox.is-checked .mdl-checkbox__tick-outline { background: rgb(0,162,77) url("/images/tick.svg?embed"); } fieldset[disabled] .mdl-checkbox.is-checked .mdl-checkbox__tick-outline, .mdl-checkbox.is-checked.is-disabled .mdl-checkbox__tick-outline { background: rgba(0,0,0, 0.26) url("/images/tick.svg?embed"); } .mdl-checkbox__label { position: relative; cursor: pointer; font-size: 16px; line-height: 24px; margin: 0; } fieldset[disabled] .mdl-checkbox .mdl-checkbox__label, .mdl-checkbox.is-disabled .mdl-checkbox__label { color: rgba(0,0,0, 0.26); cursor: auto; } .mdl-checkbox__ripple-container { position: absolute; z-index: 2; top: -6px; left: -10px; box-sizing: border-box; width: 36px; height: 36px; border-radius: 50%; cursor: pointer; overflow: hidden; -webkit-mask-image: -webkit-radial-gradient(circle, white, black); } .mdl-checkbox__ripple-container .mdl-ripple { background: rgb(0,162,77); } fieldset[disabled] .mdl-checkbox .mdl-checkbox__ripple-container, .mdl-checkbox.is-disabled .mdl-checkbox__ripple-container { cursor: auto; } fieldset[disabled] .mdl-checkbox .mdl-checkbox__ripple-container .mdl-ripple, .mdl-checkbox.is-disabled .mdl-checkbox__ripple-container .mdl-ripple { background: transparent; } /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /*------------------------------------*\ $CONTENTS \*------------------------------------*/ /** * STYLE GUIDE VARIABLES------------------Declarations of Sass variables * -----Typography * -----Colors * -----Textfield * -----Switch * -----Spinner * -----Radio * -----Menu * -----List * -----Layout * -----Icon toggles * -----Footer * -----Column * -----Checkbox * -----Card * -----Button * -----Animation * -----Progress * -----Badge * -----Shadows * -----Grid * -----Data table * -----Dialog * -----Snackbar * -----Tooltip * -----Chip * * Even though all variables have the `!default` directive, most of them * should not be changed as they are dependent one another. This can cause * visual distortions (like alignment issues) that are hard to track down * and fix. */ /* ========== TYPOGRAPHY ========== */ /* We're splitting fonts into "preferred" and "performance" in order to optimize page loading. For important text, such as the body, we want it to load immediately and not wait for the web font load, whereas for other sections, such as headers and titles, we're OK with things taking a bit longer to load. We do have some optional classes and parameters in the mixins, in case you definitely want to make sure you're using the preferred font and don't mind the performance hit. We should be able to improve on this once CSS Font Loading L3 becomes more widely available. */ /* ========== COLORS ========== */ /** * * Material design color palettes. * @see http://www.google.com/design/spec/style/color.html * **/ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== Color Palettes ========== */ /* colors.scss */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== IMAGES ========== */ /* ========== Color & Themes ========== */ /* ========== Typography ========== */ /* ========== Components ========== */ /* ========== Standard Buttons ========== */ /* ========== Icon Toggles ========== */ /* ========== Radio Buttons ========== */ /* ========== Ripple effect ========== */ /* ========== Layout ========== */ /* ========== Content Tabs ========== */ /* ========== Checkboxes ========== */ /* ========== Switches ========== */ /* ========== Spinner ========== */ /* ========== Text fields ========== */ /* ========== Card ========== */ /* ========== Sliders ========== */ /* ========== Progress ========== */ /* ========== List ========== */ /* ========== Item ========== */ /* ========== Dropdown menu ========== */ /* ========== Tooltips ========== */ /* ========== Footer ========== */ /* TEXTFIELD */ /* SWITCH */ /* SPINNER */ /* RADIO */ /* MENU */ /* LIST */ /* LAYOUT */ /* ICON TOGGLE */ /* FOOTER */ /*mega-footer*/ /*mini-footer*/ /* CHECKBOX */ /* CARD */ /* Card dimensions */ /* Cover image */ /* BUTTON */ /** * * Dimensions * */ /* ANIMATION */ /* PROGRESS */ /* BADGE */ /* SHADOWS */ /* GRID */ /* DATA TABLE */ /* DIALOG */ /* SNACKBAR */ /* TOOLTIP */ /* CHIP */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* Typography */ /* Shadows */ /* Animations */ /* Dialog */ .mdl-chip { height: 32px; font-family: "Roboto", "Helvetica", "Arial", sans-serif; line-height: 32px; padding: 0 12px; border: 0; border-radius: 16px; background-color: rgb(222, 222, 222); display: inline-block; color: rgba(0,0,0, 0.87); margin: 2px 0; font-size: 0; white-space: nowrap; } .mdl-chip__text { font-size: 13px; vertical-align: middle; display: inline-block; } .mdl-chip__action { height: 24px; width: 24px; background: transparent; opacity: 0.54; display: inline-block; cursor: pointer; text-align: center; vertical-align: middle; padding: 0; margin: 0 0 0 4px; font-size: 13px; text-decoration: none; color: rgba(0,0,0, 0.87); border: none; outline: none; overflow: hidden; } .mdl-chip__contact { height: 32px; width: 32px; border-radius: 16px; display: inline-block; vertical-align: middle; margin-right: 8px; overflow: hidden; text-align: center; font-size: 18px; line-height: 32px; } .mdl-chip:focus { outline: 0; box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); } .mdl-chip:active { background-color: rgb(214, 214, 214); } .mdl-chip--deletable { padding-right: 4px; } .mdl-chip--contact { padding-left: 0; } /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /*------------------------------------*\ $CONTENTS \*------------------------------------*/ /** * STYLE GUIDE VARIABLES------------------Declarations of Sass variables * -----Typography * -----Colors * -----Textfield * -----Switch * -----Spinner * -----Radio * -----Menu * -----List * -----Layout * -----Icon toggles * -----Footer * -----Column * -----Checkbox * -----Card * -----Button * -----Animation * -----Progress * -----Badge * -----Shadows * -----Grid * -----Data table * -----Dialog * -----Snackbar * -----Tooltip * -----Chip * * Even though all variables have the `!default` directive, most of them * should not be changed as they are dependent one another. This can cause * visual distortions (like alignment issues) that are hard to track down * and fix. */ /* ========== TYPOGRAPHY ========== */ /* We're splitting fonts into "preferred" and "performance" in order to optimize page loading. For important text, such as the body, we want it to load immediately and not wait for the web font load, whereas for other sections, such as headers and titles, we're OK with things taking a bit longer to load. We do have some optional classes and parameters in the mixins, in case you definitely want to make sure you're using the preferred font and don't mind the performance hit. We should be able to improve on this once CSS Font Loading L3 becomes more widely available. */ /* ========== COLORS ========== */ /** * * Material design color palettes. * @see http://www.google.com/design/spec/style/color.html * **/ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== Color Palettes ========== */ /* colors.scss */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== IMAGES ========== */ /* ========== Color & Themes ========== */ /* ========== Typography ========== */ /* ========== Components ========== */ /* ========== Standard Buttons ========== */ /* ========== Icon Toggles ========== */ /* ========== Radio Buttons ========== */ /* ========== Ripple effect ========== */ /* ========== Layout ========== */ /* ========== Content Tabs ========== */ /* ========== Checkboxes ========== */ /* ========== Switches ========== */ /* ========== Spinner ========== */ /* ========== Text fields ========== */ /* ========== Card ========== */ /* ========== Sliders ========== */ /* ========== Progress ========== */ /* ========== List ========== */ /* ========== Item ========== */ /* ========== Dropdown menu ========== */ /* ========== Tooltips ========== */ /* ========== Footer ========== */ /* TEXTFIELD */ /* SWITCH */ /* SPINNER */ /* RADIO */ /* MENU */ /* LIST */ /* LAYOUT */ /* ICON TOGGLE */ /* FOOTER */ /*mega-footer*/ /*mini-footer*/ /* CHECKBOX */ /* CARD */ /* Card dimensions */ /* Cover image */ /* BUTTON */ /** * * Dimensions * */ /* ANIMATION */ /* PROGRESS */ /* BADGE */ /* SHADOWS */ /* GRID */ /* DATA TABLE */ /* DIALOG */ /* SNACKBAR */ /* TOOLTIP */ /* CHIP */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* Typography */ /* Shadows */ /* Animations */ /* Dialog */ .mdl-data-table { position: relative; border: 1px solid rgba(0, 0, 0, 0.12); border-collapse: collapse; white-space: nowrap; font-size: 13px; background-color: rgb(255,255,255); } .mdl-data-table thead { padding-bottom: 3px; } .mdl-data-table thead .mdl-data-table__select { margin-top: 0; } .mdl-data-table tbody tr { position: relative; height: 48px; transition-duration: 0.28s; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-property: background-color; } .mdl-data-table tbody tr.is-selected { background-color: #e0e0e0; } .mdl-data-table tbody tr:hover { background-color: #eeeeee; } .mdl-data-table td, .mdl-data-table th { padding: 0 18px 12px 18px; text-align: right; } .mdl-data-table td:first-of-type, .mdl-data-table th:first-of-type { padding-left: 24px; } .mdl-data-table td:last-of-type, .mdl-data-table th:last-of-type { padding-right: 24px; } .mdl-data-table td { position: relative; vertical-align: middle; height: 48px; border-top: 1px solid rgba(0, 0, 0, 0.12); border-bottom: 1px solid rgba(0, 0, 0, 0.12); padding-top: 12px; box-sizing: border-box; } .mdl-data-table td .mdl-data-table__select { vertical-align: middle; } .mdl-data-table th { position: relative; vertical-align: bottom; text-overflow: ellipsis; font-size: 14px; font-weight: bold; line-height: 24px; letter-spacing: 0; height: 48px; font-size: 12px; color: rgba(0, 0, 0, 0.54); padding-bottom: 8px; box-sizing: border-box; } .mdl-data-table th.mdl-data-table__header--sorted-ascending, .mdl-data-table th.mdl-data-table__header--sorted-descending { color: rgba(0, 0, 0, 0.87); } .mdl-data-table th.mdl-data-table__header--sorted-ascending:before, .mdl-data-table th.mdl-data-table__header--sorted-descending:before { font-family: "Material Icons"; font-weight: normal; font-style: normal; font-size: 24px; line-height: 1; letter-spacing: normal; text-transform: none; display: inline-block; word-wrap: normal; font-feature-settings: "liga"; -webkit-font-feature-settings: "liga"; -webkit-font-smoothing: antialiased; font-size: 16px; content: "\e5d8"; margin-right: 5px; vertical-align: sub; } .mdl-data-table th.mdl-data-table__header--sorted-ascending:hover, .mdl-data-table th.mdl-data-table__header--sorted-descending:hover { cursor: pointer; } .mdl-data-table th.mdl-data-table__header--sorted-ascending:hover:before, .mdl-data-table th.mdl-data-table__header--sorted-descending:hover:before { color: rgba(0, 0, 0, 0.26); } .mdl-data-table th.mdl-data-table__header--sorted-descending:before { content: "\e5db"; } .mdl-data-table__select { width: 16px; } .mdl-data-table__cell--non-numeric.mdl-data-table__cell--non-numeric { text-align: left; } /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /*------------------------------------*\ $CONTENTS \*------------------------------------*/ /** * STYLE GUIDE VARIABLES------------------Declarations of Sass variables * -----Typography * -----Colors * -----Textfield * -----Switch * -----Spinner * -----Radio * -----Menu * -----List * -----Layout * -----Icon toggles * -----Footer * -----Column * -----Checkbox * -----Card * -----Button * -----Animation * -----Progress * -----Badge * -----Shadows * -----Grid * -----Data table * -----Dialog * -----Snackbar * -----Tooltip * -----Chip * * Even though all variables have the `!default` directive, most of them * should not be changed as they are dependent one another. This can cause * visual distortions (like alignment issues) that are hard to track down * and fix. */ /* ========== TYPOGRAPHY ========== */ /* We're splitting fonts into "preferred" and "performance" in order to optimize page loading. For important text, such as the body, we want it to load immediately and not wait for the web font load, whereas for other sections, such as headers and titles, we're OK with things taking a bit longer to load. We do have some optional classes and parameters in the mixins, in case you definitely want to make sure you're using the preferred font and don't mind the performance hit. We should be able to improve on this once CSS Font Loading L3 becomes more widely available. */ /* ========== COLORS ========== */ /** * * Material design color palettes. * @see http://www.google.com/design/spec/style/color.html * **/ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== Color Palettes ========== */ /* colors.scss */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== IMAGES ========== */ /* ========== Color & Themes ========== */ /* ========== Typography ========== */ /* ========== Components ========== */ /* ========== Standard Buttons ========== */ /* ========== Icon Toggles ========== */ /* ========== Radio Buttons ========== */ /* ========== Ripple effect ========== */ /* ========== Layout ========== */ /* ========== Content Tabs ========== */ /* ========== Checkboxes ========== */ /* ========== Switches ========== */ /* ========== Spinner ========== */ /* ========== Text fields ========== */ /* ========== Card ========== */ /* ========== Sliders ========== */ /* ========== Progress ========== */ /* ========== List ========== */ /* ========== Item ========== */ /* ========== Dropdown menu ========== */ /* ========== Tooltips ========== */ /* ========== Footer ========== */ /* TEXTFIELD */ /* SWITCH */ /* SPINNER */ /* RADIO */ /* MENU */ /* LIST */ /* LAYOUT */ /* ICON TOGGLE */ /* FOOTER */ /*mega-footer*/ /*mini-footer*/ /* CHECKBOX */ /* CARD */ /* Card dimensions */ /* Cover image */ /* BUTTON */ /** * * Dimensions * */ /* ANIMATION */ /* PROGRESS */ /* BADGE */ /* SHADOWS */ /* GRID */ /* DATA TABLE */ /* DIALOG */ /* SNACKBAR */ /* TOOLTIP */ /* CHIP */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* Typography */ /* Shadows */ /* Animations */ /* Dialog */ .mdl-dialog { border: none; box-shadow: 0 9px 46px 8px rgba(0, 0, 0, 0.14), 0 11px 15px -7px rgba(0, 0, 0, 0.12), 0 24px 38px 3px rgba(0, 0, 0, 0.2); width: 280px; } .mdl-dialog__title { padding: 24px 24px 0; margin: 0; font-size: 2.5rem; } .mdl-dialog__actions { padding: 8px 8px 8px 24px; display: flex; flex-direction: row-reverse; flex-wrap: wrap; } .mdl-dialog__actions > * { margin-right: 8px; height: 36px; } .mdl-dialog__actions > *:first-child { margin-right: 0; } .mdl-dialog__actions--full-width { padding: 0 0 8px 0; } .mdl-dialog__actions--full-width > * { height: 48px; flex: 0 0 100%; padding-right: 16px; margin-right: 0; text-align: right; } .mdl-dialog__content { padding: 20px 24px 24px 24px; color: rgba(0,0,0, 0.54); } /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /*------------------------------------*\ $CONTENTS \*------------------------------------*/ /** * STYLE GUIDE VARIABLES------------------Declarations of Sass variables * -----Typography * -----Colors * -----Textfield * -----Switch * -----Spinner * -----Radio * -----Menu * -----List * -----Layout * -----Icon toggles * -----Footer * -----Column * -----Checkbox * -----Card * -----Button * -----Animation * -----Progress * -----Badge * -----Shadows * -----Grid * -----Data table * -----Dialog * -----Snackbar * -----Tooltip * -----Chip * * Even though all variables have the `!default` directive, most of them * should not be changed as they are dependent one another. This can cause * visual distortions (like alignment issues) that are hard to track down * and fix. */ /* ========== TYPOGRAPHY ========== */ /* We're splitting fonts into "preferred" and "performance" in order to optimize page loading. For important text, such as the body, we want it to load immediately and not wait for the web font load, whereas for other sections, such as headers and titles, we're OK with things taking a bit longer to load. We do have some optional classes and parameters in the mixins, in case you definitely want to make sure you're using the preferred font and don't mind the performance hit. We should be able to improve on this once CSS Font Loading L3 becomes more widely available. */ /* ========== COLORS ========== */ /** * * Material design color palettes. * @see http://www.google.com/design/spec/style/color.html * **/ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== Color Palettes ========== */ /* colors.scss */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== IMAGES ========== */ /* ========== Color & Themes ========== */ /* ========== Typography ========== */ /* ========== Components ========== */ /* ========== Standard Buttons ========== */ /* ========== Icon Toggles ========== */ /* ========== Radio Buttons ========== */ /* ========== Ripple effect ========== */ /* ========== Layout ========== */ /* ========== Content Tabs ========== */ /* ========== Checkboxes ========== */ /* ========== Switches ========== */ /* ========== Spinner ========== */ /* ========== Text fields ========== */ /* ========== Card ========== */ /* ========== Sliders ========== */ /* ========== Progress ========== */ /* ========== List ========== */ /* ========== Item ========== */ /* ========== Dropdown menu ========== */ /* ========== Tooltips ========== */ /* ========== Footer ========== */ /* TEXTFIELD */ /* SWITCH */ /* SPINNER */ /* RADIO */ /* MENU */ /* LIST */ /* LAYOUT */ /* ICON TOGGLE */ /* FOOTER */ /*mega-footer*/ /*mini-footer*/ /* CHECKBOX */ /* CARD */ /* Card dimensions */ /* Cover image */ /* BUTTON */ /** * * Dimensions * */ /* ANIMATION */ /* PROGRESS */ /* BADGE */ /* SHADOWS */ /* GRID */ /* DATA TABLE */ /* DIALOG */ /* SNACKBAR */ /* TOOLTIP */ /* CHIP */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* Typography */ /* Shadows */ /* Animations */ /* Dialog */ .mdl-mega-footer { padding: 16px 40px; color: rgb(158,158,158); background-color: rgb(66,66,66); } .mdl-mega-footer--top-section:after, .mdl-mega-footer--middle-section:after, .mdl-mega-footer--bottom-section:after, .mdl-mega-footer__top-section:after, .mdl-mega-footer__middle-section:after, .mdl-mega-footer__bottom-section:after { content: ""; display: block; clear: both; } .mdl-mega-footer--left-section, .mdl-mega-footer__left-section { margin-bottom: 16px; } .mdl-mega-footer--right-section, .mdl-mega-footer__right-section { margin-bottom: 16px; } .mdl-mega-footer--right-section a, .mdl-mega-footer__right-section a { display: block; margin-bottom: 16px; color: inherit; text-decoration: none; } @media screen and (min-width: 760px) { .mdl-mega-footer--left-section, .mdl-mega-footer__left-section { float: left; } .mdl-mega-footer--right-section, .mdl-mega-footer__right-section { float: right; } .mdl-mega-footer--right-section a, .mdl-mega-footer__right-section a { display: inline-block; margin-left: 16px; line-height: 36px; vertical-align: middle; } } .mdl-mega-footer--social-btn, .mdl-mega-footer__social-btn { width: 36px; height: 36px; padding: 0; margin: 0; background-color: rgb(158,158,158); border: none; } .mdl-mega-footer--drop-down-section, .mdl-mega-footer__drop-down-section { display: block; position: relative; } @media screen and (min-width: 760px) { .mdl-mega-footer--drop-down-section, .mdl-mega-footer__drop-down-section { width: 33%; } .mdl-mega-footer--drop-down-section:nth-child(1), .mdl-mega-footer--drop-down-section:nth-child(2), .mdl-mega-footer__drop-down-section:nth-child(1), .mdl-mega-footer__drop-down-section:nth-child(2) { float: left; } .mdl-mega-footer--drop-down-section:nth-child(3), .mdl-mega-footer__drop-down-section:nth-child(3) { float: right; } .mdl-mega-footer--drop-down-section:nth-child(3):after, .mdl-mega-footer__drop-down-section:nth-child(3):after { clear: right; } .mdl-mega-footer--drop-down-section:nth-child(4), .mdl-mega-footer__drop-down-section:nth-child(4) { clear: right; float: right; } .mdl-mega-footer--middle-section:after, .mdl-mega-footer__middle-section:after { content: ""; display: block; clear: both; } .mdl-mega-footer--bottom-section, .mdl-mega-footer__bottom-section { padding-top: 0; } } @media screen and (min-width: 1024px) { .mdl-mega-footer--drop-down-section, .mdl-mega-footer--drop-down-section:nth-child(3), .mdl-mega-footer--drop-down-section:nth-child(4), .mdl-mega-footer__drop-down-section, .mdl-mega-footer__drop-down-section:nth-child(3), .mdl-mega-footer__drop-down-section:nth-child(4) { width: 24%; float: left; } } .mdl-mega-footer--heading-checkbox, .mdl-mega-footer__heading-checkbox { position: absolute; width: 100%; height: 55.8px; padding: 32px; margin: 0; margin-top: -16px; cursor: pointer; z-index: 1; opacity: 0; } .mdl-mega-footer--heading-checkbox + .mdl-mega-footer--heading:after, .mdl-mega-footer--heading-checkbox + .mdl-mega-footer__heading:after, .mdl-mega-footer__heading-checkbox + .mdl-mega-footer--heading:after, .mdl-mega-footer__heading-checkbox + .mdl-mega-footer__heading:after { font-family: "Material Icons"; content: "\e5ce"; } .mdl-mega-footer--heading-checkbox:checked ~ .mdl-mega-footer--link-list, .mdl-mega-footer--heading-checkbox:checked ~ .mdl-mega-footer__link-list, .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer--heading + .mdl-mega-footer--link-list, .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer__heading + .mdl-mega-footer__link-list, .mdl-mega-footer__heading-checkbox:checked ~ .mdl-mega-footer--link-list, .mdl-mega-footer__heading-checkbox:checked ~ .mdl-mega-footer__link-list, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer--heading + .mdl-mega-footer--link-list, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer__heading + .mdl-mega-footer__link-list { display: none; } .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer--heading:after, .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer__heading:after, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer--heading:after, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer__heading:after { font-family: "Material Icons"; content: "\e5cf"; } .mdl-mega-footer--heading, .mdl-mega-footer__heading { position: relative; width: 100%; padding-right: 39.8px; margin-bottom: 16px; box-sizing: border-box; font-size: 14px; line-height: 23.8px; font-weight: 500; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: rgb(224,224,224); } .mdl-mega-footer--heading:after, .mdl-mega-footer__heading:after { content: ""; position: absolute; top: 0; right: 0; display: block; width: 23.8px; height: 23.8px; background-size: cover; } .mdl-mega-footer--link-list, .mdl-mega-footer__link-list { list-style: none; margin: 0; padding: 0; margin-bottom: 32px; } .mdl-mega-footer--link-list:after, .mdl-mega-footer__link-list:after { clear: both; display: block; content: ""; } .mdl-mega-footer--link-list li, .mdl-mega-footer__link-list li { font-size: 14px; font-weight: 400; line-height: 24px; letter-spacing: 0; line-height: 20px; } .mdl-mega-footer--link-list a, .mdl-mega-footer__link-list a { color: inherit; text-decoration: none; white-space: nowrap; } @media screen and (min-width: 760px) { .mdl-mega-footer--heading-checkbox, .mdl-mega-footer__heading-checkbox { display: none; } .mdl-mega-footer--heading-checkbox + .mdl-mega-footer--heading:after, .mdl-mega-footer--heading-checkbox + .mdl-mega-footer__heading:after, .mdl-mega-footer__heading-checkbox + .mdl-mega-footer--heading:after, .mdl-mega-footer__heading-checkbox + .mdl-mega-footer__heading:after { content: ""; } .mdl-mega-footer--heading-checkbox:checked ~ .mdl-mega-footer--link-list, .mdl-mega-footer--heading-checkbox:checked ~ .mdl-mega-footer__link-list, .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer__heading + .mdl-mega-footer__link-list, .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer--heading + .mdl-mega-footer--link-list, .mdl-mega-footer__heading-checkbox:checked ~ .mdl-mega-footer--link-list, .mdl-mega-footer__heading-checkbox:checked ~ .mdl-mega-footer__link-list, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer__heading + .mdl-mega-footer__link-list, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer--heading + .mdl-mega-footer--link-list { display: block; } .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer--heading:after, .mdl-mega-footer--heading-checkbox:checked + .mdl-mega-footer__heading:after, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer--heading:after, .mdl-mega-footer__heading-checkbox:checked + .mdl-mega-footer__heading:after { content: ""; } } .mdl-mega-footer--bottom-section, .mdl-mega-footer__bottom-section { padding-top: 16px; margin-bottom: 16px; } .mdl-logo { margin-bottom: 16px; color: white; } .mdl-mega-footer--bottom-section .mdl-mega-footer--link-list li, .mdl-mega-footer__bottom-section .mdl-mega-footer__link-list li { float: left; margin-bottom: 0; margin-right: 16px; } @media screen and (min-width: 760px) { .mdl-logo { float: left; margin-bottom: 0; margin-right: 16px; } } /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /*------------------------------------*\ $CONTENTS \*------------------------------------*/ /** * STYLE GUIDE VARIABLES------------------Declarations of Sass variables * -----Typography * -----Colors * -----Textfield * -----Switch * -----Spinner * -----Radio * -----Menu * -----List * -----Layout * -----Icon toggles * -----Footer * -----Column * -----Checkbox * -----Card * -----Button * -----Animation * -----Progress * -----Badge * -----Shadows * -----Grid * -----Data table * -----Dialog * -----Snackbar * -----Tooltip * -----Chip * * Even though all variables have the `!default` directive, most of them * should not be changed as they are dependent one another. This can cause * visual distortions (like alignment issues) that are hard to track down * and fix. */ /* ========== TYPOGRAPHY ========== */ /* We're splitting fonts into "preferred" and "performance" in order to optimize page loading. For important text, such as the body, we want it to load immediately and not wait for the web font load, whereas for other sections, such as headers and titles, we're OK with things taking a bit longer to load. We do have some optional classes and parameters in the mixins, in case you definitely want to make sure you're using the preferred font and don't mind the performance hit. We should be able to improve on this once CSS Font Loading L3 becomes more widely available. */ /* ========== COLORS ========== */ /** * * Material design color palettes. * @see http://www.google.com/design/spec/style/color.html * **/ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== Color Palettes ========== */ /* colors.scss */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== IMAGES ========== */ /* ========== Color & Themes ========== */ /* ========== Typography ========== */ /* ========== Components ========== */ /* ========== Standard Buttons ========== */ /* ========== Icon Toggles ========== */ /* ========== Radio Buttons ========== */ /* ========== Ripple effect ========== */ /* ========== Layout ========== */ /* ========== Content Tabs ========== */ /* ========== Checkboxes ========== */ /* ========== Switches ========== */ /* ========== Spinner ========== */ /* ========== Text fields ========== */ /* ========== Card ========== */ /* ========== Sliders ========== */ /* ========== Progress ========== */ /* ========== List ========== */ /* ========== Item ========== */ /* ========== Dropdown menu ========== */ /* ========== Tooltips ========== */ /* ========== Footer ========== */ /* TEXTFIELD */ /* SWITCH */ /* SPINNER */ /* RADIO */ /* MENU */ /* LIST */ /* LAYOUT */ /* ICON TOGGLE */ /* FOOTER */ /*mega-footer*/ /*mini-footer*/ /* CHECKBOX */ /* CARD */ /* Card dimensions */ /* Cover image */ /* BUTTON */ /** * * Dimensions * */ /* ANIMATION */ /* PROGRESS */ /* BADGE */ /* SHADOWS */ /* GRID */ /* DATA TABLE */ /* DIALOG */ /* SNACKBAR */ /* TOOLTIP */ /* CHIP */ .mdl-mini-footer { display: flex; flex-flow: row wrap; justify-content: space-between; padding: 32px 16px; color: rgb(158,158,158); background-color: rgb(66,66,66); } .mdl-mini-footer:after { content: ""; display: block; } .mdl-mini-footer .mdl-logo { line-height: 36px; } .mdl-mini-footer--link-list, .mdl-mini-footer__link-list { display: flex; flex-flow: row nowrap; list-style: none; margin: 0; padding: 0; } .mdl-mini-footer--link-list li, .mdl-mini-footer__link-list li { margin-bottom: 0; margin-right: 16px; } @media screen and (min-width: 760px) { .mdl-mini-footer--link-list li, .mdl-mini-footer__link-list li { line-height: 36px; } } .mdl-mini-footer--link-list a, .mdl-mini-footer__link-list a { color: inherit; text-decoration: none; white-space: nowrap; } .mdl-mini-footer--left-section, .mdl-mini-footer__left-section { display: inline-block; order: 0; } .mdl-mini-footer--right-section, .mdl-mini-footer__right-section { display: inline-block; order: 1; } .mdl-mini-footer--social-btn, .mdl-mini-footer__social-btn { width: 36px; height: 36px; padding: 0; margin: 0; background-color: rgb(158,158,158); border: none; } /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /*------------------------------------*\ $CONTENTS \*------------------------------------*/ /** * STYLE GUIDE VARIABLES------------------Declarations of Sass variables * -----Typography * -----Colors * -----Textfield * -----Switch * -----Spinner * -----Radio * -----Menu * -----List * -----Layout * -----Icon toggles * -----Footer * -----Column * -----Checkbox * -----Card * -----Button * -----Animation * -----Progress * -----Badge * -----Shadows * -----Grid * -----Data table * -----Dialog * -----Snackbar * -----Tooltip * -----Chip * * Even though all variables have the `!default` directive, most of them * should not be changed as they are dependent one another. This can cause * visual distortions (like alignment issues) that are hard to track down * and fix. */ /* ========== TYPOGRAPHY ========== */ /* We're splitting fonts into "preferred" and "performance" in order to optimize page loading. For important text, such as the body, we want it to load immediately and not wait for the web font load, whereas for other sections, such as headers and titles, we're OK with things taking a bit longer to load. We do have some optional classes and parameters in the mixins, in case you definitely want to make sure you're using the preferred font and don't mind the performance hit. We should be able to improve on this once CSS Font Loading L3 becomes more widely available. */ /* ========== COLORS ========== */ /** * * Material design color palettes. * @see http://www.google.com/design/spec/style/color.html * **/ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== Color Palettes ========== */ /* colors.scss */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== IMAGES ========== */ /* ========== Color & Themes ========== */ /* ========== Typography ========== */ /* ========== Components ========== */ /* ========== Standard Buttons ========== */ /* ========== Icon Toggles ========== */ /* ========== Radio Buttons ========== */ /* ========== Ripple effect ========== */ /* ========== Layout ========== */ /* ========== Content Tabs ========== */ /* ========== Checkboxes ========== */ /* ========== Switches ========== */ /* ========== Spinner ========== */ /* ========== Text fields ========== */ /* ========== Card ========== */ /* ========== Sliders ========== */ /* ========== Progress ========== */ /* ========== List ========== */ /* ========== Item ========== */ /* ========== Dropdown menu ========== */ /* ========== Tooltips ========== */ /* ========== Footer ========== */ /* TEXTFIELD */ /* SWITCH */ /* SPINNER */ /* RADIO */ /* MENU */ /* LIST */ /* LAYOUT */ /* ICON TOGGLE */ /* FOOTER */ /*mega-footer*/ /*mini-footer*/ /* CHECKBOX */ /* CARD */ /* Card dimensions */ /* Cover image */ /* BUTTON */ /** * * Dimensions * */ /* ANIMATION */ /* PROGRESS */ /* BADGE */ /* SHADOWS */ /* GRID */ /* DATA TABLE */ /* DIALOG */ /* SNACKBAR */ /* TOOLTIP */ /* CHIP */ .mdl-icon-toggle { position: relative; z-index: 1; vertical-align: middle; display: inline-block; height: 32px; margin: 0; padding: 0; } .mdl-icon-toggle__input { line-height: 32px; } .mdl-icon-toggle.is-upgraded .mdl-icon-toggle__input { position: absolute; width: 0; height: 0; margin: 0; padding: 0; opacity: 0; appearance: none; border: none; } .mdl-icon-toggle__label { display: inline-block; position: relative; cursor: pointer; height: 32px; width: 32px; min-width: 32px; color: rgb(97,97,97); border-radius: 50%; padding: 0; margin-left: 0; margin-right: 0; text-align: center; background-color: transparent; will-change: background-color; transition: background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0.2s cubic-bezier(0.4, 0, 0.2, 1); } .mdl-icon-toggle__label.material-icons { line-height: 32px; font-size: 24px; } .mdl-icon-toggle.is-checked .mdl-icon-toggle__label { color: rgb(0,162,77); } .mdl-icon-toggle.is-disabled .mdl-icon-toggle__label { color: rgba(0,0,0, 0.26); cursor: auto; transition: none; } .mdl-icon-toggle.is-focused .mdl-icon-toggle__label { background-color: rgba(0,0,0, 0.12); } .mdl-icon-toggle.is-focused.is-checked .mdl-icon-toggle__label { background-color: rgba(0,162,77, 0.26); } .mdl-icon-toggle__ripple-container { position: absolute; z-index: 2; top: -2px; left: -2px; box-sizing: border-box; width: 36px; height: 36px; border-radius: 50%; cursor: pointer; overflow: hidden; -webkit-mask-image: -webkit-radial-gradient(circle, white, black); } .mdl-icon-toggle__ripple-container .mdl-ripple { background: rgb(97,97,97); } .mdl-icon-toggle.is-disabled .mdl-icon-toggle__ripple-container { cursor: auto; } .mdl-icon-toggle.is-disabled .mdl-icon-toggle__ripple-container .mdl-ripple { background: transparent; } /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /*------------------------------------*\ $CONTENTS \*------------------------------------*/ /** * STYLE GUIDE VARIABLES------------------Declarations of Sass variables * -----Typography * -----Colors * -----Textfield * -----Switch * -----Spinner * -----Radio * -----Menu * -----List * -----Layout * -----Icon toggles * -----Footer * -----Column * -----Checkbox * -----Card * -----Button * -----Animation * -----Progress * -----Badge * -----Shadows * -----Grid * -----Data table * -----Dialog * -----Snackbar * -----Tooltip * -----Chip * * Even though all variables have the `!default` directive, most of them * should not be changed as they are dependent one another. This can cause * visual distortions (like alignment issues) that are hard to track down * and fix. */ /* ========== TYPOGRAPHY ========== */ /* We're splitting fonts into "preferred" and "performance" in order to optimize page loading. For important text, such as the body, we want it to load immediately and not wait for the web font load, whereas for other sections, such as headers and titles, we're OK with things taking a bit longer to load. We do have some optional classes and parameters in the mixins, in case you definitely want to make sure you're using the preferred font and don't mind the performance hit. We should be able to improve on this once CSS Font Loading L3 becomes more widely available. */ /* ========== COLORS ========== */ /** * * Material design color palettes. * @see http://www.google.com/design/spec/style/color.html * **/ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== Color Palettes ========== */ /* colors.scss */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== IMAGES ========== */ /* ========== Color & Themes ========== */ /* ========== Typography ========== */ /* ========== Components ========== */ /* ========== Standard Buttons ========== */ /* ========== Icon Toggles ========== */ /* ========== Radio Buttons ========== */ /* ========== Ripple effect ========== */ /* ========== Layout ========== */ /* ========== Content Tabs ========== */ /* ========== Checkboxes ========== */ /* ========== Switches ========== */ /* ========== Spinner ========== */ /* ========== Text fields ========== */ /* ========== Card ========== */ /* ========== Sliders ========== */ /* ========== Progress ========== */ /* ========== List ========== */ /* ========== Item ========== */ /* ========== Dropdown menu ========== */ /* ========== Tooltips ========== */ /* ========== Footer ========== */ /* TEXTFIELD */ /* SWITCH */ /* SPINNER */ /* RADIO */ /* MENU */ /* LIST */ /* LAYOUT */ /* ICON TOGGLE */ /* FOOTER */ /*mega-footer*/ /*mini-footer*/ /* CHECKBOX */ /* CARD */ /* Card dimensions */ /* Cover image */ /* BUTTON */ /** * * Dimensions * */ /* ANIMATION */ /* PROGRESS */ /* BADGE */ /* SHADOWS */ /* GRID */ /* DATA TABLE */ /* DIALOG */ /* SNACKBAR */ /* TOOLTIP */ /* CHIP */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* Typography */ /* Shadows */ /* Animations */ /* Dialog */ .mdl-list { display: block; padding: 8px 0; list-style: none; } .mdl-list__item { font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 16px; font-weight: 400; line-height: 24px; letter-spacing: 0.04em; line-height: 1; display: flex; min-height: 48px; box-sizing: border-box; flex-direction: row; flex-wrap: nowrap; align-items: center; padding: 16px; cursor: default; color: rgba(0,0,0, 0.87); overflow: hidden; } .mdl-list__item .mdl-list__item-primary-content { order: 0; flex-grow: 2; text-decoration: none; box-sizing: border-box; display: flex; align-items: center; } .mdl-list__item .mdl-list__item-primary-content .mdl-list__item-icon { margin-right: 32px; } .mdl-list__item .mdl-list__item-primary-content .mdl-list__item-avatar { margin-right: 16px; } .mdl-list__item .mdl-list__item-secondary-content { display: flex; flex-flow: column; align-items: flex-end; margin-left: 16px; } .mdl-list__item .mdl-list__item-secondary-content .mdl-list__item-secondary-action label { display: inline; } .mdl-list__item .mdl-list__item-secondary-content .mdl-list__item-secondary-info { font-size: 12px; font-weight: 400; line-height: 1; letter-spacing: 0; color: rgba(0,0,0, 0.54); } .mdl-list__item .mdl-list__item-secondary-content .mdl-list__item-sub-header { padding: 0 0 0 16px; } .mdl-list__item-icon, .mdl-list__item-icon.material-icons { height: 24px; width: 24px; font-size: 24px; box-sizing: border-box; color: rgb(117,117,117); } .mdl-list__item-avatar, .mdl-list__item-avatar.material-icons { height: 40px; width: 40px; box-sizing: border-box; border-radius: 50%; background-color: rgb(117,117,117); font-size: 40px; color: white; } .mdl-list__item--two-line { height: 72px; } .mdl-list__item--two-line .mdl-list__item-primary-content { height: 36px; line-height: 20px; display: block; } .mdl-list__item--two-line .mdl-list__item-primary-content .mdl-list__item-avatar { float: left; } .mdl-list__item--two-line .mdl-list__item-primary-content .mdl-list__item-icon { float: left; margin-top: 6px; } .mdl-list__item--two-line .mdl-list__item-primary-content .mdl-list__item-secondary-content { height: 36px; } .mdl-list__item--two-line .mdl-list__item-primary-content .mdl-list__item-sub-title { font-size: 14px; font-weight: 400; line-height: 24px; letter-spacing: 0; line-height: 18px; color: rgba(0,0,0, 0.54); display: block; padding: 0; } .mdl-list__item--three-line { height: 88px; } .mdl-list__item--three-line .mdl-list__item-primary-content { height: 52px; line-height: 20px; display: block; } .mdl-list__item--three-line .mdl-list__item-primary-content .mdl-list__item-avatar, .mdl-list__item--three-line .mdl-list__item-primary-content .mdl-list__item-icon { float: left; } .mdl-list__item--three-line .mdl-list__item-secondary-content { height: 52px; } .mdl-list__item--three-line .mdl-list__item-text-body { font-size: 14px; font-weight: 400; line-height: 24px; letter-spacing: 0; line-height: 18px; height: 52px; color: rgba(0,0,0, 0.54); display: block; padding: 0; } /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /*------------------------------------*\ $CONTENTS \*------------------------------------*/ /** * STYLE GUIDE VARIABLES------------------Declarations of Sass variables * -----Typography * -----Colors * -----Textfield * -----Switch * -----Spinner * -----Radio * -----Menu * -----List * -----Layout * -----Icon toggles * -----Footer * -----Column * -----Checkbox * -----Card * -----Button * -----Animation * -----Progress * -----Badge * -----Shadows * -----Grid * -----Data table * -----Dialog * -----Snackbar * -----Tooltip * -----Chip * * Even though all variables have the `!default` directive, most of them * should not be changed as they are dependent one another. This can cause * visual distortions (like alignment issues) that are hard to track down * and fix. */ /* ========== TYPOGRAPHY ========== */ /* We're splitting fonts into "preferred" and "performance" in order to optimize page loading. For important text, such as the body, we want it to load immediately and not wait for the web font load, whereas for other sections, such as headers and titles, we're OK with things taking a bit longer to load. We do have some optional classes and parameters in the mixins, in case you definitely want to make sure you're using the preferred font and don't mind the performance hit. We should be able to improve on this once CSS Font Loading L3 becomes more widely available. */ /* ========== COLORS ========== */ /** * * Material design color palettes. * @see http://www.google.com/design/spec/style/color.html * **/ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== Color Palettes ========== */ /* colors.scss */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== IMAGES ========== */ /* ========== Color & Themes ========== */ /* ========== Typography ========== */ /* ========== Components ========== */ /* ========== Standard Buttons ========== */ /* ========== Icon Toggles ========== */ /* ========== Radio Buttons ========== */ /* ========== Ripple effect ========== */ /* ========== Layout ========== */ /* ========== Content Tabs ========== */ /* ========== Checkboxes ========== */ /* ========== Switches ========== */ /* ========== Spinner ========== */ /* ========== Text fields ========== */ /* ========== Card ========== */ /* ========== Sliders ========== */ /* ========== Progress ========== */ /* ========== List ========== */ /* ========== Item ========== */ /* ========== Dropdown menu ========== */ /* ========== Tooltips ========== */ /* ========== Footer ========== */ /* TEXTFIELD */ /* SWITCH */ /* SPINNER */ /* RADIO */ /* MENU */ /* LIST */ /* LAYOUT */ /* ICON TOGGLE */ /* FOOTER */ /*mega-footer*/ /*mini-footer*/ /* CHECKBOX */ /* CARD */ /* Card dimensions */ /* Cover image */ /* BUTTON */ /** * * Dimensions * */ /* ANIMATION */ /* PROGRESS */ /* BADGE */ /* SHADOWS */ /* GRID */ /* DATA TABLE */ /* DIALOG */ /* SNACKBAR */ /* TOOLTIP */ /* CHIP */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* Typography */ /* Shadows */ /* Animations */ /* Dialog */ .mdl-menu__container { display: block; margin: 0; padding: 0; border: none; position: absolute; overflow: visible; height: 0; width: 0; visibility: hidden; z-index: -1; } .mdl-menu__container.is-visible, .mdl-menu__container.is-animating { z-index: 999; visibility: visible; } .mdl-menu__outline { display: block; background: rgb(255,255,255); margin: 0; padding: 0; border: none; border-radius: 2px; position: absolute; top: 0; left: 0; overflow: hidden; opacity: 0; transform: scale(0); transform-origin: 0 0; box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); will-change: transform; transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1); z-index: -1; } .mdl-menu__container.is-visible .mdl-menu__outline { opacity: 1; transform: scale(1); z-index: 999; } .mdl-menu__outline.mdl-menu--bottom-right { transform-origin: 100% 0; } .mdl-menu__outline.mdl-menu--top-left { transform-origin: 0 100%; } .mdl-menu__outline.mdl-menu--top-right { transform-origin: 100% 100%; } .mdl-menu { position: absolute; list-style: none; top: 0; left: 0; height: auto; width: auto; min-width: 124px; padding: 8px 0; margin: 0; opacity: 0; clip: rect(0 0 0 0); z-index: -1; } .mdl-menu__container.is-visible .mdl-menu { opacity: 1; z-index: 999; } .mdl-menu.is-animating { transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1), clip 0.3s cubic-bezier(0.4, 0, 0.2, 1); } .mdl-menu.mdl-menu--bottom-right { left: auto; right: 0; } .mdl-menu.mdl-menu--top-left { top: auto; bottom: 0; } .mdl-menu.mdl-menu--top-right { top: auto; left: auto; bottom: 0; right: 0; } .mdl-menu.mdl-menu--unaligned { top: auto; left: auto; } .mdl-menu__item { display: block; border: none; color: rgba(0,0,0, 0.87); background-color: transparent; text-align: left; margin: 0; padding: 0 16px; outline-color: rgb(189,189,189); position: relative; overflow: hidden; font-size: 14px; font-weight: 400; line-height: 24px; letter-spacing: 0; text-decoration: none; cursor: pointer; height: 48px; line-height: 48px; white-space: nowrap; opacity: 0; transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1); -webkit-user-select: none; user-select: none; } .mdl-menu__container.is-visible .mdl-menu__item { opacity: 1; } .mdl-menu__item::-moz-focus-inner { border: 0; } .mdl-menu__item--full-bleed-divider { border-bottom: 1px solid rgba(0,0,0, 0.12); } .mdl-menu__item[disabled], .mdl-menu__item[data-mdl-disabled] { color: rgb(189,189,189); background-color: transparent; cursor: auto; } .mdl-menu__item[disabled]:hover, .mdl-menu__item[data-mdl-disabled]:hover { background-color: transparent; } .mdl-menu__item[disabled]:focus, .mdl-menu__item[data-mdl-disabled]:focus { background-color: transparent; } .mdl-menu__item[disabled] .mdl-ripple, .mdl-menu__item[data-mdl-disabled] .mdl-ripple { background: transparent; } .mdl-menu__item:hover { background-color: rgb(238,238,238); } .mdl-menu__item:focus { outline: none; background-color: rgb(238,238,238); } .mdl-menu__item:active { background-color: rgb(224,224,224); } .mdl-menu__item--ripple-container { display: block; height: 100%; left: 0px; position: absolute; top: 0px; width: 100%; z-index: 0; overflow: hidden; } /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /*------------------------------------*\ $CONTENTS \*------------------------------------*/ /** * STYLE GUIDE VARIABLES------------------Declarations of Sass variables * -----Typography * -----Colors * -----Textfield * -----Switch * -----Spinner * -----Radio * -----Menu * -----List * -----Layout * -----Icon toggles * -----Footer * -----Column * -----Checkbox * -----Card * -----Button * -----Animation * -----Progress * -----Badge * -----Shadows * -----Grid * -----Data table * -----Dialog * -----Snackbar * -----Tooltip * -----Chip * * Even though all variables have the `!default` directive, most of them * should not be changed as they are dependent one another. This can cause * visual distortions (like alignment issues) that are hard to track down * and fix. */ /* ========== TYPOGRAPHY ========== */ /* We're splitting fonts into "preferred" and "performance" in order to optimize page loading. For important text, such as the body, we want it to load immediately and not wait for the web font load, whereas for other sections, such as headers and titles, we're OK with things taking a bit longer to load. We do have some optional classes and parameters in the mixins, in case you definitely want to make sure you're using the preferred font and don't mind the performance hit. We should be able to improve on this once CSS Font Loading L3 becomes more widely available. */ /* ========== COLORS ========== */ /** * * Material design color palettes. * @see http://www.google.com/design/spec/style/color.html * **/ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== Color Palettes ========== */ /* colors.scss */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== IMAGES ========== */ /* ========== Color & Themes ========== */ /* ========== Typography ========== */ /* ========== Components ========== */ /* ========== Standard Buttons ========== */ /* ========== Icon Toggles ========== */ /* ========== Radio Buttons ========== */ /* ========== Ripple effect ========== */ /* ========== Layout ========== */ /* ========== Content Tabs ========== */ /* ========== Checkboxes ========== */ /* ========== Switches ========== */ /* ========== Spinner ========== */ /* ========== Text fields ========== */ /* ========== Card ========== */ /* ========== Sliders ========== */ /* ========== Progress ========== */ /* ========== List ========== */ /* ========== Item ========== */ /* ========== Dropdown menu ========== */ /* ========== Tooltips ========== */ /* ========== Footer ========== */ /* TEXTFIELD */ /* SWITCH */ /* SPINNER */ /* RADIO */ /* MENU */ /* LIST */ /* LAYOUT */ /* ICON TOGGLE */ /* FOOTER */ /*mega-footer*/ /*mini-footer*/ /* CHECKBOX */ /* CARD */ /* Card dimensions */ /* Cover image */ /* BUTTON */ /** * * Dimensions * */ /* ANIMATION */ /* PROGRESS */ /* BADGE */ /* SHADOWS */ /* GRID */ /* DATA TABLE */ /* DIALOG */ /* SNACKBAR */ /* TOOLTIP */ /* CHIP */ .mdl-progress { display: block; position: relative; height: 4px; width: 500px; max-width: 100%; } .mdl-progress > .bar { display: block; position: absolute; top: 0; bottom: 0; width: 0%; transition: width 0.2s cubic-bezier(0.4, 0, 0.2, 1); } .mdl-progress > .progressbar { background-color: rgb(0,162,77); z-index: 1; left: 0; } .mdl-progress > .bufferbar { background-image: linear-gradient(to right, rgba(255,255,255, 0.7), rgba(255,255,255, 0.7)), linear-gradient(to right, rgb(0,162,77), rgb(0,162,77)); z-index: 0; left: 0; } .mdl-progress > .auxbar { right: 0; } @supports (-webkit-appearance: none) { .mdl-progress:not(.mdl-progress--indeterminate):not(.mdl-progress--indeterminate) > .auxbar, .mdl-progress:not(.mdl-progress__indeterminate):not(.mdl-progress__indeterminate) > .auxbar { background-image: linear-gradient(to right, rgba(255,255,255, 0.7), rgba(255,255,255, 0.7)), linear-gradient(to right, rgb(0,162,77), rgb(0,162,77)); mask: url("/images/buffer.svg?embed"); } } .mdl-progress:not(.mdl-progress--indeterminate) > .auxbar, .mdl-progress:not(.mdl-progress__indeterminate) > .auxbar { background-image: linear-gradient(to right, rgba(255,255,255, 0.9), rgba(255,255,255, 0.9)), linear-gradient(to right, rgb(0,162,77), rgb(0,162,77)); } .mdl-progress.mdl-progress--indeterminate > .bar1, .mdl-progress.mdl-progress__indeterminate > .bar1 { background-color: rgb(0,162,77); animation-name: indeterminate1; animation-duration: 2s; animation-iteration-count: infinite; animation-timing-function: linear; } .mdl-progress.mdl-progress--indeterminate > .bar3, .mdl-progress.mdl-progress__indeterminate > .bar3 { background-image: none; background-color: rgb(0,162,77); animation-name: indeterminate2; animation-duration: 2s; animation-iteration-count: infinite; animation-timing-function: linear; } @keyframes indeterminate1 { 0% { left: 0%; width: 0%; } 50% { left: 25%; width: 75%; } 75% { left: 100%; width: 0%; } } @keyframes indeterminate2 { 0% { left: 0%; width: 0%; } 50% { left: 0%; width: 0%; } 75% { left: 0%; width: 25%; } 100% { left: 100%; width: 0%; } } /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /*------------------------------------*\ $CONTENTS \*------------------------------------*/ /** * STYLE GUIDE VARIABLES------------------Declarations of Sass variables * -----Typography * -----Colors * -----Textfield * -----Switch * -----Spinner * -----Radio * -----Menu * -----List * -----Layout * -----Icon toggles * -----Footer * -----Column * -----Checkbox * -----Card * -----Button * -----Animation * -----Progress * -----Badge * -----Shadows * -----Grid * -----Data table * -----Dialog * -----Snackbar * -----Tooltip * -----Chip * * Even though all variables have the `!default` directive, most of them * should not be changed as they are dependent one another. This can cause * visual distortions (like alignment issues) that are hard to track down * and fix. */ /* ========== TYPOGRAPHY ========== */ /* We're splitting fonts into "preferred" and "performance" in order to optimize page loading. For important text, such as the body, we want it to load immediately and not wait for the web font load, whereas for other sections, such as headers and titles, we're OK with things taking a bit longer to load. We do have some optional classes and parameters in the mixins, in case you definitely want to make sure you're using the preferred font and don't mind the performance hit. We should be able to improve on this once CSS Font Loading L3 becomes more widely available. */ /* ========== COLORS ========== */ /** * * Material design color palettes. * @see http://www.google.com/design/spec/style/color.html * **/ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== Color Palettes ========== */ /* colors.scss */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== IMAGES ========== */ /* ========== Color & Themes ========== */ /* ========== Typography ========== */ /* ========== Components ========== */ /* ========== Standard Buttons ========== */ /* ========== Icon Toggles ========== */ /* ========== Radio Buttons ========== */ /* ========== Ripple effect ========== */ /* ========== Layout ========== */ /* ========== Content Tabs ========== */ /* ========== Checkboxes ========== */ /* ========== Switches ========== */ /* ========== Spinner ========== */ /* ========== Text fields ========== */ /* ========== Card ========== */ /* ========== Sliders ========== */ /* ========== Progress ========== */ /* ========== List ========== */ /* ========== Item ========== */ /* ========== Dropdown menu ========== */ /* ========== Tooltips ========== */ /* ========== Footer ========== */ /* TEXTFIELD */ /* SWITCH */ /* SPINNER */ /* RADIO */ /* MENU */ /* LIST */ /* LAYOUT */ /* ICON TOGGLE */ /* FOOTER */ /*mega-footer*/ /*mini-footer*/ /* CHECKBOX */ /* CARD */ /* Card dimensions */ /* Cover image */ /* BUTTON */ /** * * Dimensions * */ /* ANIMATION */ /* PROGRESS */ /* BADGE */ /* SHADOWS */ /* GRID */ /* DATA TABLE */ /* DIALOG */ /* SNACKBAR */ /* TOOLTIP */ /* CHIP */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* Typography */ /* Shadows */ /* Animations */ /* Dialog */ .mdl-navigation { display: flex; flex-wrap: nowrap; box-sizing: border-box; } .mdl-navigation__link { color: rgb(66,66,66); text-decoration: none; margin: 0; font-size: 14px; font-weight: 400; line-height: 24px; letter-spacing: 0; opacity: 0.87; } .mdl-navigation__link .material-icons { vertical-align: middle; } .mdl-layout { width: 100%; height: 100%; display: flex; flex-direction: column; overflow-y: auto; overflow-x: hidden; position: relative; -webkit-overflow-scrolling: touch; } .mdl-layout.is-small-screen .mdl-layout--large-screen-only { display: none; } .mdl-layout:not(.is-small-screen) .mdl-layout--small-screen-only { display: none; } .mdl-layout__container { position: absolute; width: 100%; height: 100%; } .mdl-layout__title, .mdl-layout-title { display: block; position: relative; font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 20px; font-weight: 500; line-height: 1; letter-spacing: 0.02em; font-weight: 400; box-sizing: border-box; } .mdl-layout-spacer { flex-grow: 1; } .mdl-layout__drawer { display: flex; flex-direction: column; flex-wrap: nowrap; width: 240px; height: 100%; max-height: 100%; position: absolute; top: 0; left: 0; box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); box-sizing: border-box; border-right: 1px solid rgb(224,224,224); background: rgb(250,250,250); transform: translateX(-250px); transform-style: preserve-3d; will-change: transform; transition-duration: 0.2s; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-property: transform; color: rgb(66,66,66); overflow: visible; overflow-y: auto; z-index: 5; } .mdl-layout__drawer.is-visible { transform: translateX(0); } .mdl-layout__drawer.is-visible ~ .mdl-layout__content.mdl-layout__content { overflow: hidden; } .mdl-layout__drawer > * { flex-shrink: 0; } .mdl-layout__drawer > .mdl-layout__title, .mdl-layout__drawer > .mdl-layout-title { line-height: 64px; padding-left: 40px; } @media screen and (max-width: 1024px) { .mdl-layout__drawer > .mdl-layout__title, .mdl-layout__drawer > .mdl-layout-title { line-height: 56px; padding-left: 16px; } } .mdl-layout__drawer .mdl-navigation { flex-direction: column; align-items: stretch; padding-top: 16px; } .mdl-layout__drawer .mdl-navigation .mdl-navigation__link { display: block; flex-shrink: 0; padding: 16px 40px; margin: 0; color: #757575; } @media screen and (max-width: 1024px) { .mdl-layout__drawer .mdl-navigation .mdl-navigation__link { padding: 16px 16px; } } .mdl-layout__drawer .mdl-navigation .mdl-navigation__link:hover { background-color: rgb(224,224,224); } .mdl-layout__drawer .mdl-navigation .mdl-navigation__link--current { background-color: rgb(224,224,224); color: rgb(0,0,0); } @media screen and (min-width: 1025px) { .mdl-layout--fixed-drawer > .mdl-layout__drawer { transform: translateX(0); } } .mdl-layout__drawer-button { display: block; position: absolute; height: 48px; width: 48px; border: 0; flex-shrink: 0; overflow: hidden; text-align: center; cursor: pointer; font-size: 26px; line-height: 56px; font-family: Helvetica, Arial, sans-serif; margin: 8px 12px; top: 0; left: 0; color: rgb(255,255,255); z-index: 4; } .mdl-layout__header .mdl-layout__drawer-button { position: absolute; color: rgb(255,255,255); background-color: inherit; } @media screen and (max-width: 1024px) { .mdl-layout__header .mdl-layout__drawer-button { margin: 4px; } } @media screen and (max-width: 1024px) { .mdl-layout__drawer-button { margin: 4px; color: rgba(0, 0, 0, 0.5); } } @media screen and (min-width: 1025px) { .mdl-layout__drawer-button { line-height: 54px; } .mdl-layout--no-desktop-drawer-button .mdl-layout__drawer-button, .mdl-layout--fixed-drawer > .mdl-layout__drawer-button, .mdl-layout--no-drawer-button .mdl-layout__drawer-button { display: none; } } .mdl-layout__header { display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: flex-start; box-sizing: border-box; flex-shrink: 0; width: 100%; margin: 0; padding: 0; border: none; min-height: 64px; max-height: 1000px; z-index: 3; background-color: rgb(0,162,77); color: rgb(255,255,255); box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); transition-duration: 0.2s; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-property: max-height, box-shadow; } @media screen and (max-width: 1024px) { .mdl-layout__header { min-height: 56px; } } .mdl-layout--fixed-drawer.is-upgraded:not(.is-small-screen) > .mdl-layout__header { margin-left: 240px; width: calc(100% - 240px); } @media screen and (min-width: 1025px) { .mdl-layout--fixed-drawer > .mdl-layout__header .mdl-layout__header-row { padding-left: 40px; } } .mdl-layout__header > .mdl-layout-icon { position: absolute; left: 40px; top: 16px; height: 32px; width: 32px; overflow: hidden; z-index: 3; display: block; } @media screen and (max-width: 1024px) { .mdl-layout__header > .mdl-layout-icon { left: 16px; top: 12px; } } .mdl-layout.has-drawer .mdl-layout__header > .mdl-layout-icon { display: none; } .mdl-layout__header.is-compact { max-height: 64px; } @media screen and (max-width: 1024px) { .mdl-layout__header.is-compact { max-height: 56px; } } .mdl-layout__header.is-compact.has-tabs { height: 112px; } @media screen and (max-width: 1024px) { .mdl-layout__header.is-compact.has-tabs { min-height: 104px; } } @media screen and (max-width: 1024px) { .mdl-layout__header { display: none; } .mdl-layout--fixed-header > .mdl-layout__header { display: flex; } } .mdl-layout__header--transparent.mdl-layout__header--transparent { background-color: transparent; box-shadow: none; } .mdl-layout__header--seamed { box-shadow: none; } .mdl-layout__header--scroll { box-shadow: none; } .mdl-layout__header--waterfall { box-shadow: none; overflow: hidden; } .mdl-layout__header--waterfall.is-casting-shadow { box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); } .mdl-layout__header--waterfall.mdl-layout__header--waterfall-hide-top { justify-content: flex-end; } .mdl-layout__header-row { display: flex; flex-direction: row; flex-wrap: nowrap; flex-shrink: 0; box-sizing: border-box; align-self: stretch; align-items: center; height: 64px; margin: 0; padding: 0 40px 0 80px; } .mdl-layout--no-drawer-button .mdl-layout__header-row { padding-left: 40px; } @media screen and (min-width: 1025px) { .mdl-layout--no-desktop-drawer-button .mdl-layout__header-row { padding-left: 40px; } } @media screen and (max-width: 1024px) { .mdl-layout__header-row { height: 56px; padding: 0 16px 0 72px; } .mdl-layout--no-drawer-button .mdl-layout__header-row { padding-left: 16px; } } .mdl-layout__header-row > * { flex-shrink: 0; } .mdl-layout__header--scroll .mdl-layout__header-row { width: 100%; } .mdl-layout__header-row .mdl-navigation { margin: 0; padding: 0; height: 64px; flex-direction: row; align-items: center; } @media screen and (max-width: 1024px) { .mdl-layout__header-row .mdl-navigation { height: 56px; } } .mdl-layout__header-row .mdl-navigation__link { display: block; color: rgb(255,255,255); line-height: 64px; padding: 0 24px; } @media screen and (max-width: 1024px) { .mdl-layout__header-row .mdl-navigation__link { line-height: 56px; padding: 0 16px; } } .mdl-layout__obfuscator { background-color: transparent; position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 4; visibility: hidden; transition-property: background-color; transition-duration: 0.2s; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); } .mdl-layout__obfuscator.is-visible { background-color: rgba(0, 0, 0, 0.5); visibility: visible; } @supports (pointer-events: auto) { .mdl-layout__obfuscator { background-color: rgba(0, 0, 0, 0.5); opacity: 0; transition-property: opacity; visibility: visible; pointer-events: none; } .mdl-layout__obfuscator.is-visible { pointer-events: auto; opacity: 1; } } .mdl-layout__content { -ms-flex: 0 1 auto; position: relative; display: inline-block; overflow-y: auto; overflow-x: hidden; flex-grow: 1; z-index: 1; -webkit-overflow-scrolling: touch; } .mdl-layout--fixed-drawer > .mdl-layout__content { margin-left: 240px; } .mdl-layout__container.has-scrolling-header .mdl-layout__content { overflow: visible; } @media screen and (max-width: 1024px) { .mdl-layout--fixed-drawer > .mdl-layout__content { margin-left: 0; } .mdl-layout__container.has-scrolling-header .mdl-layout__content { overflow-y: auto; overflow-x: hidden; } } .mdl-layout__tab-bar { height: 96px; margin: 0; width: calc(100% - 112px); padding: 0 0 0 56px; display: flex; background-color: rgb(0,162,77); overflow-y: hidden; overflow-x: scroll; } .mdl-layout__tab-bar::-webkit-scrollbar { display: none; } .mdl-layout--no-drawer-button .mdl-layout__tab-bar { padding-left: 16px; width: calc(100% - 32px); } @media screen and (min-width: 1025px) { .mdl-layout--no-desktop-drawer-button .mdl-layout__tab-bar { padding-left: 16px; width: calc(100% - 32px); } } @media screen and (max-width: 1024px) { .mdl-layout__tab-bar { width: calc(100% - 60px); padding: 0 0 0 60px; } .mdl-layout--no-drawer-button .mdl-layout__tab-bar { width: calc(100% - 8px); padding-left: 4px; } } .mdl-layout--fixed-tabs .mdl-layout__tab-bar { padding: 0; overflow: hidden; width: 100%; } .mdl-layout__tab-bar-container { position: relative; height: 48px; width: 100%; border: none; margin: 0; z-index: 2; flex-grow: 0; flex-shrink: 0; overflow: hidden; } .mdl-layout__container > .mdl-layout__tab-bar-container { position: absolute; top: 0; left: 0; } .mdl-layout__tab-bar-button { display: inline-block; position: absolute; top: 0; height: 48px; width: 56px; z-index: 4; text-align: center; background-color: rgb(0,162,77); color: transparent; cursor: pointer; -webkit-user-select: none; user-select: none; } .mdl-layout--no-desktop-drawer-button .mdl-layout__tab-bar-button, .mdl-layout--no-drawer-button .mdl-layout__tab-bar-button { width: 16px; } .mdl-layout--no-desktop-drawer-button .mdl-layout__tab-bar-button .material-icons, .mdl-layout--no-drawer-button .mdl-layout__tab-bar-button .material-icons { position: relative; left: -4px; } @media screen and (max-width: 1024px) { .mdl-layout__tab-bar-button { width: 60px; } } .mdl-layout--fixed-tabs .mdl-layout__tab-bar-button { display: none; } .mdl-layout__tab-bar-button .material-icons { line-height: 48px; } .mdl-layout__tab-bar-button.is-active { color: rgb(255,255,255); } .mdl-layout__tab-bar-left-button { left: 0; } .mdl-layout__tab-bar-right-button { right: 0; } .mdl-layout__tab { margin: 0; border: none; padding: 0 24px 0 24px; float: left; position: relative; display: block; flex-grow: 0; flex-shrink: 0; text-decoration: none; height: 48px; line-height: 48px; text-align: center; font-weight: 500; font-size: 14px; text-transform: uppercase; color: rgba(255,255,255, 0.6); overflow: hidden; } @media screen and (max-width: 1024px) { .mdl-layout__tab { padding: 0 12px 0 12px; } } .mdl-layout--fixed-tabs .mdl-layout__tab { float: none; flex-grow: 1; padding: 0; } .mdl-layout.is-upgraded .mdl-layout__tab.is-active { color: rgb(255,255,255); } .mdl-layout.is-upgraded .mdl-layout__tab.is-active::after { height: 2px; width: 100%; display: block; content: " "; bottom: 0; left: 0; position: absolute; background: rgb(255,64,129); animation: border-expand 0.2s cubic-bezier(0.4, 0, 0.4, 1) 0.01s alternate forwards; transition: all 1s cubic-bezier(0.4, 0, 1, 1); } .mdl-layout__tab .mdl-layout__tab-ripple-container { display: block; position: absolute; height: 100%; width: 100%; left: 0; top: 0; z-index: 1; overflow: hidden; } .mdl-layout__tab .mdl-layout__tab-ripple-container .mdl-ripple { background-color: rgb(255,255,255); } .mdl-layout__tab-panel { display: block; } .mdl-layout.is-upgraded .mdl-layout__tab-panel { display: none; } .mdl-layout.is-upgraded .mdl-layout__tab-panel.is-active { display: block; } /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /*------------------------------------*\ $CONTENTS \*------------------------------------*/ /** * STYLE GUIDE VARIABLES------------------Declarations of Sass variables * -----Typography * -----Colors * -----Textfield * -----Switch * -----Spinner * -----Radio * -----Menu * -----List * -----Layout * -----Icon toggles * -----Footer * -----Column * -----Checkbox * -----Card * -----Button * -----Animation * -----Progress * -----Badge * -----Shadows * -----Grid * -----Data table * -----Dialog * -----Snackbar * -----Tooltip * -----Chip * * Even though all variables have the `!default` directive, most of them * should not be changed as they are dependent one another. This can cause * visual distortions (like alignment issues) that are hard to track down * and fix. */ /* ========== TYPOGRAPHY ========== */ /* We're splitting fonts into "preferred" and "performance" in order to optimize page loading. For important text, such as the body, we want it to load immediately and not wait for the web font load, whereas for other sections, such as headers and titles, we're OK with things taking a bit longer to load. We do have some optional classes and parameters in the mixins, in case you definitely want to make sure you're using the preferred font and don't mind the performance hit. We should be able to improve on this once CSS Font Loading L3 becomes more widely available. */ /* ========== COLORS ========== */ /** * * Material design color palettes. * @see http://www.google.com/design/spec/style/color.html * **/ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== Color Palettes ========== */ /* colors.scss */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== IMAGES ========== */ /* ========== Color & Themes ========== */ /* ========== Typography ========== */ /* ========== Components ========== */ /* ========== Standard Buttons ========== */ /* ========== Icon Toggles ========== */ /* ========== Radio Buttons ========== */ /* ========== Ripple effect ========== */ /* ========== Layout ========== */ /* ========== Content Tabs ========== */ /* ========== Checkboxes ========== */ /* ========== Switches ========== */ /* ========== Spinner ========== */ /* ========== Text fields ========== */ /* ========== Card ========== */ /* ========== Sliders ========== */ /* ========== Progress ========== */ /* ========== List ========== */ /* ========== Item ========== */ /* ========== Dropdown menu ========== */ /* ========== Tooltips ========== */ /* ========== Footer ========== */ /* TEXTFIELD */ /* SWITCH */ /* SPINNER */ /* RADIO */ /* MENU */ /* LIST */ /* LAYOUT */ /* ICON TOGGLE */ /* FOOTER */ /*mega-footer*/ /*mini-footer*/ /* CHECKBOX */ /* CARD */ /* Card dimensions */ /* Cover image */ /* BUTTON */ /** * * Dimensions * */ /* ANIMATION */ /* PROGRESS */ /* BADGE */ /* SHADOWS */ /* GRID */ /* DATA TABLE */ /* DIALOG */ /* SNACKBAR */ /* TOOLTIP */ /* CHIP */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* Typography */ /* Shadows */ /* Animations */ /* Dialog */ .mdl-radio { position: relative; font-size: 16px; line-height: 24px; display: inline-block; vertical-align: middle; box-sizing: border-box; height: 24px; margin: 0; padding-left: 0; } .mdl-radio.is-upgraded { padding-left: 24px; } .mdl-radio__button { line-height: 24px; } .mdl-radio.is-upgraded .mdl-radio__button { position: absolute; width: 0; height: 0; margin: 0; padding: 0; opacity: 0; appearance: none; border: none; } .mdl-radio__outer-circle { position: absolute; top: 4px; left: 0; display: inline-block; box-sizing: border-box; width: 16px; height: 16px; margin: 0; cursor: pointer; border: 2px solid rgba(0,0,0, 0.54); border-radius: 50%; z-index: 2; } .mdl-radio.is-checked .mdl-radio__outer-circle { border: 2px solid rgb(0,162,77); } .mdl-radio__outer-circle fieldset[disabled] .mdl-radio, .mdl-radio.is-disabled .mdl-radio__outer-circle { border: 2px solid rgba(0,0,0, 0.26); cursor: auto; } .mdl-radio__inner-circle { position: absolute; z-index: 1; margin: 0; top: 8px; left: 4px; box-sizing: border-box; width: 8px; height: 8px; cursor: pointer; transition-duration: 0.28s; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-property: transform; transform: scale(0, 0); border-radius: 50%; background: rgb(0,162,77); } .mdl-radio.is-checked .mdl-radio__inner-circle { transform: scale(1, 1); } fieldset[disabled] .mdl-radio .mdl-radio__inner-circle, .mdl-radio.is-disabled .mdl-radio__inner-circle { background: rgba(0,0,0, 0.26); cursor: auto; } .mdl-radio.is-focused .mdl-radio__inner-circle { box-shadow: 0 0 0px 10px rgba(0, 0, 0, 0.1); } .mdl-radio__label { cursor: pointer; } fieldset[disabled] .mdl-radio .mdl-radio__label, .mdl-radio.is-disabled .mdl-radio__label { color: rgba(0,0,0, 0.26); cursor: auto; } .mdl-radio__ripple-container { position: absolute; z-index: 2; top: -9px; left: -13px; box-sizing: border-box; width: 42px; height: 42px; border-radius: 50%; cursor: pointer; overflow: hidden; -webkit-mask-image: -webkit-radial-gradient(circle, white, black); } .mdl-radio__ripple-container .mdl-ripple { background: rgb(0,162,77); } fieldset[disabled] .mdl-radio .mdl-radio__ripple-container, .mdl-radio.is-disabled .mdl-radio__ripple-container { cursor: auto; } fieldset[disabled] .mdl-radio .mdl-radio__ripple-container .mdl-ripple, .mdl-radio.is-disabled .mdl-radio__ripple-container .mdl-ripple { background: transparent; } /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /*------------------------------------*\ $CONTENTS \*------------------------------------*/ /** * STYLE GUIDE VARIABLES------------------Declarations of Sass variables * -----Typography * -----Colors * -----Textfield * -----Switch * -----Spinner * -----Radio * -----Menu * -----List * -----Layout * -----Icon toggles * -----Footer * -----Column * -----Checkbox * -----Card * -----Button * -----Animation * -----Progress * -----Badge * -----Shadows * -----Grid * -----Data table * -----Dialog * -----Snackbar * -----Tooltip * -----Chip * * Even though all variables have the `!default` directive, most of them * should not be changed as they are dependent one another. This can cause * visual distortions (like alignment issues) that are hard to track down * and fix. */ /* ========== TYPOGRAPHY ========== */ /* We're splitting fonts into "preferred" and "performance" in order to optimize page loading. For important text, such as the body, we want it to load immediately and not wait for the web font load, whereas for other sections, such as headers and titles, we're OK with things taking a bit longer to load. We do have some optional classes and parameters in the mixins, in case you definitely want to make sure you're using the preferred font and don't mind the performance hit. We should be able to improve on this once CSS Font Loading L3 becomes more widely available. */ /* ========== COLORS ========== */ /** * * Material design color palettes. * @see http://www.google.com/design/spec/style/color.html * **/ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== Color Palettes ========== */ /* colors.scss */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== IMAGES ========== */ /* ========== Color & Themes ========== */ /* ========== Typography ========== */ /* ========== Components ========== */ /* ========== Standard Buttons ========== */ /* ========== Icon Toggles ========== */ /* ========== Radio Buttons ========== */ /* ========== Ripple effect ========== */ /* ========== Layout ========== */ /* ========== Content Tabs ========== */ /* ========== Checkboxes ========== */ /* ========== Switches ========== */ /* ========== Spinner ========== */ /* ========== Text fields ========== */ /* ========== Card ========== */ /* ========== Sliders ========== */ /* ========== Progress ========== */ /* ========== List ========== */ /* ========== Item ========== */ /* ========== Dropdown menu ========== */ /* ========== Tooltips ========== */ /* ========== Footer ========== */ /* TEXTFIELD */ /* SWITCH */ /* SPINNER */ /* RADIO */ /* MENU */ /* LIST */ /* LAYOUT */ /* ICON TOGGLE */ /* FOOTER */ /*mega-footer*/ /*mini-footer*/ /* CHECKBOX */ /* CARD */ /* Card dimensions */ /* Cover image */ /* BUTTON */ /** * * Dimensions * */ /* ANIMATION */ /* PROGRESS */ /* BADGE */ /* SHADOWS */ /* GRID */ /* DATA TABLE */ /* DIALOG */ /* SNACKBAR */ /* TOOLTIP */ /* CHIP */ _:-ms-input-placeholder, :root .mdl-slider.mdl-slider.is-upgraded { -ms-appearance: none; height: 32px; margin: 0; } .mdl-slider { width: calc(100% - 40px); margin: 0 20px; } .mdl-slider.is-upgraded { appearance: none; height: 2px; background: transparent; -webkit-user-select: none; user-select: none; outline: 0; padding: 0; color: rgb(0,162,77); align-self: center; z-index: 1; cursor: pointer; /**************************** Tracks ****************************/ /**************************** Thumbs ****************************/ /**************************** 0-value ****************************/ /**************************** Disabled ****************************/ } .mdl-slider.is-upgraded::-moz-focus-outer { border: 0; } .mdl-slider.is-upgraded::-ms-tooltip { display: none; } .mdl-slider.is-upgraded::-webkit-slider-runnable-track { background: transparent; } .mdl-slider.is-upgraded::-moz-range-track { background: transparent; border: none; } .mdl-slider.is-upgraded::-ms-track { background: none; color: transparent; height: 2px; width: 100%; border: none; } .mdl-slider.is-upgraded::-ms-fill-lower { padding: 0; background: linear-gradient(to right, transparent, transparent 16px, rgb(0,162,77) 16px, rgb(0,162,77) 0); } .mdl-slider.is-upgraded::-ms-fill-upper { padding: 0; background: linear-gradient(to left, transparent, transparent 16px, rgba(0,0,0, 0.26) 16px, rgba(0,0,0, 0.26) 0); } .mdl-slider.is-upgraded::-webkit-slider-thumb { -webkit-appearance: none; width: 12px; height: 12px; box-sizing: border-box; border-radius: 50%; background: rgb(0,162,77); border: none; -webkit-transition: transform 0.18s cubic-bezier(0.4, 0, 0.2, 1), border 0.18s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1), background 0.28s cubic-bezier(0.4, 0, 0.2, 1); transition: transform 0.18s cubic-bezier(0.4, 0, 0.2, 1), border 0.18s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1), background 0.28s cubic-bezier(0.4, 0, 0.2, 1); } .mdl-slider.is-upgraded::-moz-range-thumb { -moz-appearance: none; width: 12px; height: 12px; box-sizing: border-box; border-radius: 50%; background-image: none; background: rgb(0,162,77); border: none; } .mdl-slider.is-upgraded:focus:not(:active)::-webkit-slider-thumb { box-shadow: 0 0 0 10px rgba(0,162,77, 0.26); } .mdl-slider.is-upgraded:focus:not(:active)::-moz-range-thumb { box-shadow: 0 0 0 10px rgba(0,162,77, 0.26); } .mdl-slider.is-upgraded:active::-webkit-slider-thumb { background-image: none; background: rgb(0,162,77); transform: scale(1.5); } .mdl-slider.is-upgraded:active::-moz-range-thumb { background-image: none; background: rgb(0,162,77); transform: scale(1.5); } .mdl-slider.is-upgraded::-ms-thumb { width: 32px; height: 32px; border: none; border-radius: 50%; background: rgb(0,162,77); transform: scale(0.375); -ms-transition: transform 0.18s cubic-bezier(0.4, 0, 0.2, 1), background 0.28s cubic-bezier(0.4, 0, 0.2, 1); transition: transform 0.18s cubic-bezier(0.4, 0, 0.2, 1), background 0.28s cubic-bezier(0.4, 0, 0.2, 1); } .mdl-slider.is-upgraded:focus:not(:active)::-ms-thumb { background: radial-gradient(circle closest-side, rgb(0,162,77) 0%, rgb(0,162,77) 37.5%, rgba(0,162,77, 0.26) 37.5%, rgba(0,162,77, 0.26) 100%); transform: scale(1); } .mdl-slider.is-upgraded:active::-ms-thumb { background: rgb(0,162,77); transform: scale(0.5625); } .mdl-slider.is-upgraded.is-lowest-value::-webkit-slider-thumb { border: 2px solid rgba(0,0,0, 0.26); background: transparent; } .mdl-slider.is-upgraded.is-lowest-value::-moz-range-thumb { border: 2px solid rgba(0,0,0, 0.26); background: transparent; } .mdl-slider.is-upgraded.is-lowest-value + .mdl-slider__background-flex > .mdl-slider__background-upper { left: 6px; } .mdl-slider.is-upgraded.is-lowest-value:focus:not(:active)::-webkit-slider-thumb { box-shadow: 0 0 0 10px rgba(0,0,0, 0.12); background: rgba(0,0,0, 0.12); } .mdl-slider.is-upgraded.is-lowest-value:focus:not(:active)::-moz-range-thumb { box-shadow: 0 0 0 10px rgba(0,0,0, 0.12); background: rgba(0,0,0, 0.12); } .mdl-slider.is-upgraded.is-lowest-value:active::-webkit-slider-thumb { border: 1.6px solid rgba(0,0,0, 0.26); transform: scale(1.5); } .mdl-slider.is-upgraded.is-lowest-value:active + .mdl-slider__background-flex > .mdl-slider__background-upper { left: 9px; } .mdl-slider.is-upgraded.is-lowest-value:active::-moz-range-thumb { border: 1.5px solid rgba(0,0,0, 0.26); transform: scale(1.5); } .mdl-slider.is-upgraded.is-lowest-value::-ms-thumb { background: radial-gradient(circle closest-side, transparent 0%, transparent 66.67%, rgba(0,0,0, 0.26) 66.67%, rgba(0,0,0, 0.26) 100%); } .mdl-slider.is-upgraded.is-lowest-value:focus:not(:active)::-ms-thumb { background: radial-gradient(circle closest-side, rgba(0,0,0, 0.12) 0%, rgba(0,0,0, 0.12) 25%, rgba(0,0,0, 0.26) 25%, rgba(0,0,0, 0.26) 37.5%, rgba(0,0,0, 0.12) 37.5%, rgba(0,0,0, 0.12) 100%); transform: scale(1); } .mdl-slider.is-upgraded.is-lowest-value:active::-ms-thumb { transform: scale(0.5625); background: radial-gradient(circle closest-side, transparent 0%, transparent 77.78%, rgba(0,0,0, 0.26) 77.78%, rgba(0,0,0, 0.26) 100%); } .mdl-slider.is-upgraded.is-lowest-value::-ms-fill-lower { background: transparent; } .mdl-slider.is-upgraded.is-lowest-value::-ms-fill-upper { margin-left: 6px; } .mdl-slider.is-upgraded.is-lowest-value:active::-ms-fill-upper { margin-left: 9px; } .mdl-slider.is-upgraded:disabled:focus::-webkit-slider-thumb, .mdl-slider.is-upgraded:disabled:active::-webkit-slider-thumb, .mdl-slider.is-upgraded:disabled::-webkit-slider-thumb { transform: scale(0.667); background: rgba(0,0,0, 0.26); } .mdl-slider.is-upgraded:disabled:focus::-moz-range-thumb, .mdl-slider.is-upgraded:disabled:active::-moz-range-thumb, .mdl-slider.is-upgraded:disabled::-moz-range-thumb { transform: scale(0.667); background: rgba(0,0,0, 0.26); } .mdl-slider.is-upgraded:disabled + .mdl-slider__background-flex > .mdl-slider__background-lower { background-color: rgba(0,0,0, 0.26); left: -6px; } .mdl-slider.is-upgraded:disabled + .mdl-slider__background-flex > .mdl-slider__background-upper { left: 6px; } .mdl-slider.is-upgraded.is-lowest-value:disabled:focus::-webkit-slider-thumb, .mdl-slider.is-upgraded.is-lowest-value:disabled:active::-webkit-slider-thumb, .mdl-slider.is-upgraded.is-lowest-value:disabled::-webkit-slider-thumb { border: 3px solid rgba(0,0,0, 0.26); background: transparent; transform: scale(0.667); } .mdl-slider.is-upgraded.is-lowest-value:disabled:focus::-moz-range-thumb, .mdl-slider.is-upgraded.is-lowest-value:disabled:active::-moz-range-thumb, .mdl-slider.is-upgraded.is-lowest-value:disabled::-moz-range-thumb { border: 3px solid rgba(0,0,0, 0.26); background: transparent; transform: scale(0.667); } .mdl-slider.is-upgraded.is-lowest-value:disabled:active + .mdl-slider__background-flex > .mdl-slider__background-upper { left: 6px; } .mdl-slider.is-upgraded:disabled:focus::-ms-thumb, .mdl-slider.is-upgraded:disabled:active::-ms-thumb, .mdl-slider.is-upgraded:disabled::-ms-thumb { transform: scale(0.25); background: rgba(0,0,0, 0.26); } .mdl-slider.is-upgraded.is-lowest-value:disabled:focus::-ms-thumb, .mdl-slider.is-upgraded.is-lowest-value:disabled:active::-ms-thumb, .mdl-slider.is-upgraded.is-lowest-value:disabled::-ms-thumb { transform: scale(0.25); background: radial-gradient(circle closest-side, transparent 0%, transparent 50%, rgba(0,0,0, 0.26) 50%, rgba(0,0,0, 0.26) 100%); } .mdl-slider.is-upgraded:disabled::-ms-fill-lower { margin-right: 6px; background: linear-gradient(to right, transparent, transparent 25px, rgba(0,0,0, 0.26) 25px, rgba(0,0,0, 0.26) 0); } .mdl-slider.is-upgraded:disabled::-ms-fill-upper { margin-left: 6px; } .mdl-slider.is-upgraded.is-lowest-value:disabled:active::-ms-fill-upper { margin-left: 6px; } .mdl-slider__ie-container { height: 18px; overflow: visible; border: none; margin: none; padding: none; } .mdl-slider__container { height: 18px; position: relative; background: none; display: flex; flex-direction: row; } .mdl-slider__background-flex { background: transparent; position: absolute; height: 2px; width: calc(100% - 52px); top: 50%; left: 0; margin: 0 26px; display: flex; overflow: hidden; border: 0; padding: 0; transform: translate(0, -1px); } .mdl-slider__background-lower { background: rgb(0,162,77); flex: 0; position: relative; border: 0; padding: 0; } .mdl-slider__background-upper { background: rgba(0,0,0, 0.26); flex: 0; position: relative; border: 0; padding: 0; transition: left 0.18s cubic-bezier(0.4, 0, 0.2, 1); } /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /*------------------------------------*\ $CONTENTS \*------------------------------------*/ /** * STYLE GUIDE VARIABLES------------------Declarations of Sass variables * -----Typography * -----Colors * -----Textfield * -----Switch * -----Spinner * -----Radio * -----Menu * -----List * -----Layout * -----Icon toggles * -----Footer * -----Column * -----Checkbox * -----Card * -----Button * -----Animation * -----Progress * -----Badge * -----Shadows * -----Grid * -----Data table * -----Dialog * -----Snackbar * -----Tooltip * -----Chip * * Even though all variables have the `!default` directive, most of them * should not be changed as they are dependent one another. This can cause * visual distortions (like alignment issues) that are hard to track down * and fix. */ /* ========== TYPOGRAPHY ========== */ /* We're splitting fonts into "preferred" and "performance" in order to optimize page loading. For important text, such as the body, we want it to load immediately and not wait for the web font load, whereas for other sections, such as headers and titles, we're OK with things taking a bit longer to load. We do have some optional classes and parameters in the mixins, in case you definitely want to make sure you're using the preferred font and don't mind the performance hit. We should be able to improve on this once CSS Font Loading L3 becomes more widely available. */ /* ========== COLORS ========== */ /** * * Material design color palettes. * @see http://www.google.com/design/spec/style/color.html * **/ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== Color Palettes ========== */ /* colors.scss */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== IMAGES ========== */ /* ========== Color & Themes ========== */ /* ========== Typography ========== */ /* ========== Components ========== */ /* ========== Standard Buttons ========== */ /* ========== Icon Toggles ========== */ /* ========== Radio Buttons ========== */ /* ========== Ripple effect ========== */ /* ========== Layout ========== */ /* ========== Content Tabs ========== */ /* ========== Checkboxes ========== */ /* ========== Switches ========== */ /* ========== Spinner ========== */ /* ========== Text fields ========== */ /* ========== Card ========== */ /* ========== Sliders ========== */ /* ========== Progress ========== */ /* ========== List ========== */ /* ========== Item ========== */ /* ========== Dropdown menu ========== */ /* ========== Tooltips ========== */ /* ========== Footer ========== */ /* TEXTFIELD */ /* SWITCH */ /* SPINNER */ /* RADIO */ /* MENU */ /* LIST */ /* LAYOUT */ /* ICON TOGGLE */ /* FOOTER */ /*mega-footer*/ /*mini-footer*/ /* CHECKBOX */ /* CARD */ /* Card dimensions */ /* Cover image */ /* BUTTON */ /** * * Dimensions * */ /* ANIMATION */ /* PROGRESS */ /* BADGE */ /* SHADOWS */ /* GRID */ /* DATA TABLE */ /* DIALOG */ /* SNACKBAR */ /* TOOLTIP */ /* CHIP */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* Typography */ /* Shadows */ /* Animations */ /* Dialog */ .mdl-snackbar { position: fixed; bottom: 0; left: 50%; cursor: default; background-color: #323232; z-index: 3; display: block; display: flex; justify-content: space-between; font-family: "Roboto", "Helvetica", "Arial", sans-serif; will-change: transform; transform: translate(0, 80px); transition: transform 0.25s cubic-bezier(0.4, 0, 1, 1); pointer-events: none; } @media (max-width: 479px) { .mdl-snackbar { width: 100%; left: 0; min-height: 48px; max-height: 80px; } } @media (min-width: 480px) { .mdl-snackbar { min-width: 288px; max-width: 568px; border-radius: 2px; transform: translate(-50%, 80px); } } .mdl-snackbar--active { transform: translate(0, 0); pointer-events: auto; transition: transform 0.25s cubic-bezier(0, 0, 0.2, 1); } @media (min-width: 480px) { .mdl-snackbar--active { transform: translate(-50%, 0); } } .mdl-snackbar__text { padding: 14px 12px 14px 24px; vertical-align: middle; color: white; float: left; } .mdl-snackbar__action { background: transparent; border: none; color: rgb(255,64,129); float: right; text-transform: uppercase; padding: 14px 24px 14px 12px; font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-size: 14px; font-weight: 500; text-transform: uppercase; line-height: 1; letter-spacing: 0; overflow: hidden; outline: none; opacity: 0; pointer-events: none; cursor: pointer; text-decoration: none; text-align: center; align-self: center; } .mdl-snackbar__action::-moz-focus-inner { border: 0; } .mdl-snackbar__action:not([aria-hidden]) { opacity: 1; pointer-events: auto; } /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /*------------------------------------*\ $CONTENTS \*------------------------------------*/ /** * STYLE GUIDE VARIABLES------------------Declarations of Sass variables * -----Typography * -----Colors * -----Textfield * -----Switch * -----Spinner * -----Radio * -----Menu * -----List * -----Layout * -----Icon toggles * -----Footer * -----Column * -----Checkbox * -----Card * -----Button * -----Animation * -----Progress * -----Badge * -----Shadows * -----Grid * -----Data table * -----Dialog * -----Snackbar * -----Tooltip * -----Chip * * Even though all variables have the `!default` directive, most of them * should not be changed as they are dependent one another. This can cause * visual distortions (like alignment issues) that are hard to track down * and fix. */ /* ========== TYPOGRAPHY ========== */ /* We're splitting fonts into "preferred" and "performance" in order to optimize page loading. For important text, such as the body, we want it to load immediately and not wait for the web font load, whereas for other sections, such as headers and titles, we're OK with things taking a bit longer to load. We do have some optional classes and parameters in the mixins, in case you definitely want to make sure you're using the preferred font and don't mind the performance hit. We should be able to improve on this once CSS Font Loading L3 becomes more widely available. */ /* ========== COLORS ========== */ /** * * Material design color palettes. * @see http://www.google.com/design/spec/style/color.html * **/ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== Color Palettes ========== */ /* colors.scss */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== IMAGES ========== */ /* ========== Color & Themes ========== */ /* ========== Typography ========== */ /* ========== Components ========== */ /* ========== Standard Buttons ========== */ /* ========== Icon Toggles ========== */ /* ========== Radio Buttons ========== */ /* ========== Ripple effect ========== */ /* ========== Layout ========== */ /* ========== Content Tabs ========== */ /* ========== Checkboxes ========== */ /* ========== Switches ========== */ /* ========== Spinner ========== */ /* ========== Text fields ========== */ /* ========== Card ========== */ /* ========== Sliders ========== */ /* ========== Progress ========== */ /* ========== List ========== */ /* ========== Item ========== */ /* ========== Dropdown menu ========== */ /* ========== Tooltips ========== */ /* ========== Footer ========== */ /* TEXTFIELD */ /* SWITCH */ /* SPINNER */ /* RADIO */ /* MENU */ /* LIST */ /* LAYOUT */ /* ICON TOGGLE */ /* FOOTER */ /*mega-footer*/ /*mini-footer*/ /* CHECKBOX */ /* CARD */ /* Card dimensions */ /* Cover image */ /* BUTTON */ /** * * Dimensions * */ /* ANIMATION */ /* PROGRESS */ /* BADGE */ /* SHADOWS */ /* GRID */ /* DATA TABLE */ /* DIALOG */ /* SNACKBAR */ /* TOOLTIP */ /* CHIP */ .mdl-spinner { display: inline-block; position: relative; width: 28px; height: 28px; } .mdl-spinner:not(.is-upgraded).is-active:after { content: "Loading..."; } .mdl-spinner.is-upgraded.is-active { animation: mdl-spinner__container-rotate 1568.2352941176ms linear infinite; } @keyframes mdl-spinner__container-rotate { to { transform: rotate(360deg); } } .mdl-spinner__layer { position: absolute; width: 100%; height: 100%; opacity: 0; } .mdl-spinner__layer-1 { border-color: rgb(66,165,245); } .mdl-spinner--single-color .mdl-spinner__layer-1 { border-color: rgb(0,162,77); } .mdl-spinner.is-active .mdl-spinner__layer-1 { animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-1-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; } .mdl-spinner__layer-2 { border-color: rgb(244,67,54); } .mdl-spinner--single-color .mdl-spinner__layer-2 { border-color: rgb(0,162,77); } .mdl-spinner.is-active .mdl-spinner__layer-2 { animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-2-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; } .mdl-spinner__layer-3 { border-color: rgb(253,216,53); } .mdl-spinner--single-color .mdl-spinner__layer-3 { border-color: rgb(0,162,77); } .mdl-spinner.is-active .mdl-spinner__layer-3 { animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-3-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; } .mdl-spinner__layer-4 { border-color: rgb(76,175,80); } .mdl-spinner--single-color .mdl-spinner__layer-4 { border-color: rgb(0,162,77); } .mdl-spinner.is-active .mdl-spinner__layer-4 { animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-4-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; } @keyframes mdl-spinner__fill-unfill-rotate { 12.5% { transform: rotate(135deg); } 25% { transform: rotate(270deg); } 37.5% { transform: rotate(405deg); } 50% { transform: rotate(540deg); } 62.5% { transform: rotate(675deg); } 75% { transform: rotate(810deg); } 87.5% { transform: rotate(945deg); } to { transform: rotate(1080deg); } } /** * HACK: Even though the intention is to have the current .mdl-spinner__layer-N * at `opacity: 1`, we set it to `opacity: 0.99` instead since this forces Chrome * to do proper subpixel rendering for the elements being animated. This is * especially visible in Chrome 39 on Ubuntu 14.04. See: * * - https://github.com/Polymer/paper-spinner/issues/9 * - https://code.google.com/p/chromium/issues/detail?id=436255 */ @keyframes mdl-spinner__layer-1-fade-in-out { from { opacity: 0.99; } 25% { opacity: 0.99; } 26% { opacity: 0; } 89% { opacity: 0; } 90% { opacity: 0.99; } 100% { opacity: 0.99; } } @keyframes mdl-spinner__layer-2-fade-in-out { from { opacity: 0; } 15% { opacity: 0; } 25% { opacity: 0.99; } 50% { opacity: 0.99; } 51% { opacity: 0; } } @keyframes mdl-spinner__layer-3-fade-in-out { from { opacity: 0; } 40% { opacity: 0; } 50% { opacity: 0.99; } 75% { opacity: 0.99; } 76% { opacity: 0; } } @keyframes mdl-spinner__layer-4-fade-in-out { from { opacity: 0; } 65% { opacity: 0; } 75% { opacity: 0.99; } 90% { opacity: 0.99; } 100% { opacity: 0; } } /** * Patch the gap that appear between the two adjacent * div.mdl-spinner__circle-clipper while the spinner is rotating * (appears on Chrome 38, Safari 7.1, and IE 11). * * Update: the gap no longer appears on Chrome when .mdl-spinner__layer-N's * opacity is 0.99, but still does on Safari and IE. */ .mdl-spinner__gap-patch { position: absolute; box-sizing: border-box; top: 0; left: 45%; width: 10%; height: 100%; overflow: hidden; border-color: inherit; } .mdl-spinner__gap-patch .mdl-spinner__circle { width: 1000%; left: -450%; } .mdl-spinner__circle-clipper { display: inline-block; position: relative; width: 50%; height: 100%; overflow: hidden; border-color: inherit; } .mdl-spinner__circle-clipper.mdl-spinner__left { float: left; } .mdl-spinner__circle-clipper.mdl-spinner__right { float: right; } .mdl-spinner__circle-clipper .mdl-spinner__circle { width: 200%; } .mdl-spinner__circle { box-sizing: border-box; height: 100%; border-width: 3px; border-style: solid; border-color: inherit; border-bottom-color: transparent !important; border-radius: 50%; animation: none; position: absolute; top: 0; right: 0; bottom: 0; left: 0; } .mdl-spinner__left .mdl-spinner__circle { border-right-color: transparent !important; transform: rotate(129deg); } .mdl-spinner.is-active .mdl-spinner__left .mdl-spinner__circle { animation: mdl-spinner__left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; } .mdl-spinner__right .mdl-spinner__circle { left: -100%; border-left-color: transparent !important; transform: rotate(-129deg); } .mdl-spinner.is-active .mdl-spinner__right .mdl-spinner__circle { animation: mdl-spinner__right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; } @keyframes mdl-spinner__left-spin { from { transform: rotate(130deg); } 50% { transform: rotate(-5deg); } to { transform: rotate(130deg); } } @keyframes mdl-spinner__right-spin { from { transform: rotate(-130deg); } 50% { transform: rotate(5deg); } to { transform: rotate(-130deg); } } /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /*------------------------------------*\ $CONTENTS \*------------------------------------*/ /** * STYLE GUIDE VARIABLES------------------Declarations of Sass variables * -----Typography * -----Colors * -----Textfield * -----Switch * -----Spinner * -----Radio * -----Menu * -----List * -----Layout * -----Icon toggles * -----Footer * -----Column * -----Checkbox * -----Card * -----Button * -----Animation * -----Progress * -----Badge * -----Shadows * -----Grid * -----Data table * -----Dialog * -----Snackbar * -----Tooltip * -----Chip * * Even though all variables have the `!default` directive, most of them * should not be changed as they are dependent one another. This can cause * visual distortions (like alignment issues) that are hard to track down * and fix. */ /* ========== TYPOGRAPHY ========== */ /* We're splitting fonts into "preferred" and "performance" in order to optimize page loading. For important text, such as the body, we want it to load immediately and not wait for the web font load, whereas for other sections, such as headers and titles, we're OK with things taking a bit longer to load. We do have some optional classes and parameters in the mixins, in case you definitely want to make sure you're using the preferred font and don't mind the performance hit. We should be able to improve on this once CSS Font Loading L3 becomes more widely available. */ /* ========== COLORS ========== */ /** * * Material design color palettes. * @see http://www.google.com/design/spec/style/color.html * **/ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== Color Palettes ========== */ /* colors.scss */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== IMAGES ========== */ /* ========== Color & Themes ========== */ /* ========== Typography ========== */ /* ========== Components ========== */ /* ========== Standard Buttons ========== */ /* ========== Icon Toggles ========== */ /* ========== Radio Buttons ========== */ /* ========== Ripple effect ========== */ /* ========== Layout ========== */ /* ========== Content Tabs ========== */ /* ========== Checkboxes ========== */ /* ========== Switches ========== */ /* ========== Spinner ========== */ /* ========== Text fields ========== */ /* ========== Card ========== */ /* ========== Sliders ========== */ /* ========== Progress ========== */ /* ========== List ========== */ /* ========== Item ========== */ /* ========== Dropdown menu ========== */ /* ========== Tooltips ========== */ /* ========== Footer ========== */ /* TEXTFIELD */ /* SWITCH */ /* SPINNER */ /* RADIO */ /* MENU */ /* LIST */ /* LAYOUT */ /* ICON TOGGLE */ /* FOOTER */ /*mega-footer*/ /*mini-footer*/ /* CHECKBOX */ /* CARD */ /* Card dimensions */ /* Cover image */ /* BUTTON */ /** * * Dimensions * */ /* ANIMATION */ /* PROGRESS */ /* BADGE */ /* SHADOWS */ /* GRID */ /* DATA TABLE */ /* DIALOG */ /* SNACKBAR */ /* TOOLTIP */ /* CHIP */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* Typography */ /* Shadows */ /* Animations */ /* Dialog */ .mdl-switch { position: relative; z-index: 1; vertical-align: middle; display: inline-block; box-sizing: border-box; width: 100%; height: 24px; margin: 0; padding: 0; overflow: visible; -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; } .mdl-switch.is-upgraded { padding-left: 28px; } .mdl-switch__input { line-height: 24px; } .mdl-switch.is-upgraded .mdl-switch__input { position: absolute; width: 0; height: 0; margin: 0; padding: 0; opacity: 0; appearance: none; border: none; } .mdl-switch__track { background: rgba(0,0,0, 0.26); position: absolute; left: 0; top: 5px; height: 14px; width: 36px; border-radius: 14px; cursor: pointer; } .mdl-switch.is-checked .mdl-switch__track { background: rgba(0,162,77, 0.5); } .mdl-switch__track fieldset[disabled] .mdl-switch, .mdl-switch.is-disabled .mdl-switch__track { background: rgba(0,0,0, 0.12); cursor: auto; } .mdl-switch__thumb { background: rgb(250,250,250); position: absolute; left: 0; top: 2px; height: 20px; width: 20px; border-radius: 50%; cursor: pointer; box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); transition-duration: 0.28s; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-property: left; } .mdl-switch.is-checked .mdl-switch__thumb { background: rgb(0,162,77); left: 16px; box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 3px 3px -2px rgba(0, 0, 0, 0.2), 0 1px 8px 0 rgba(0, 0, 0, 0.12); } .mdl-switch__thumb fieldset[disabled] .mdl-switch, .mdl-switch.is-disabled .mdl-switch__thumb { background: rgb(189,189,189); cursor: auto; } .mdl-switch__focus-helper { position: absolute; top: 50%; left: 50%; transform: translate(-4px, -4px); display: inline-block; box-sizing: border-box; width: 8px; height: 8px; border-radius: 50%; background-color: transparent; } .mdl-switch.is-focused .mdl-switch__focus-helper { box-shadow: 0 0 0px 20px rgba(0, 0, 0, 0.1); background-color: rgba(0, 0, 0, 0.1); } .mdl-switch.is-focused.is-checked .mdl-switch__focus-helper { box-shadow: 0 0 0px 20px rgba(0,162,77, 0.26); background-color: rgba(0,162,77, 0.26); } .mdl-switch__label { position: relative; cursor: pointer; font-size: 16px; line-height: 24px; margin: 0; left: 24px; } .mdl-switch__label fieldset[disabled] .mdl-switch, .mdl-switch.is-disabled .mdl-switch__label { color: rgb(189,189,189); cursor: auto; } .mdl-switch__ripple-container { position: absolute; z-index: 2; top: -12px; left: -14px; box-sizing: border-box; width: 48px; height: 48px; border-radius: 50%; cursor: pointer; overflow: hidden; -webkit-mask-image: -webkit-radial-gradient(circle, white, black); transition-duration: 0.4s; transition-timing-function: step-end; transition-property: left; } .mdl-switch__ripple-container .mdl-ripple { background: rgb(0,162,77); } .mdl-switch__ripple-container fieldset[disabled] .mdl-switch, .mdl-switch.is-disabled .mdl-switch__ripple-container { cursor: auto; } fieldset[disabled] .mdl-switch .mdl-switch__ripple-container .mdl-ripple, .mdl-switch.is-disabled .mdl-switch__ripple-container .mdl-ripple { background: transparent; } .mdl-switch.is-checked .mdl-switch__ripple-container { left: 2px; } /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /*------------------------------------*\ $CONTENTS \*------------------------------------*/ /** * STYLE GUIDE VARIABLES------------------Declarations of Sass variables * -----Typography * -----Colors * -----Textfield * -----Switch * -----Spinner * -----Radio * -----Menu * -----List * -----Layout * -----Icon toggles * -----Footer * -----Column * -----Checkbox * -----Card * -----Button * -----Animation * -----Progress * -----Badge * -----Shadows * -----Grid * -----Data table * -----Dialog * -----Snackbar * -----Tooltip * -----Chip * * Even though all variables have the `!default` directive, most of them * should not be changed as they are dependent one another. This can cause * visual distortions (like alignment issues) that are hard to track down * and fix. */ /* ========== TYPOGRAPHY ========== */ /* We're splitting fonts into "preferred" and "performance" in order to optimize page loading. For important text, such as the body, we want it to load immediately and not wait for the web font load, whereas for other sections, such as headers and titles, we're OK with things taking a bit longer to load. We do have some optional classes and parameters in the mixins, in case you definitely want to make sure you're using the preferred font and don't mind the performance hit. We should be able to improve on this once CSS Font Loading L3 becomes more widely available. */ /* ========== COLORS ========== */ /** * * Material design color palettes. * @see http://www.google.com/design/spec/style/color.html * **/ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== Color Palettes ========== */ /* colors.scss */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== IMAGES ========== */ /* ========== Color & Themes ========== */ /* ========== Typography ========== */ /* ========== Components ========== */ /* ========== Standard Buttons ========== */ /* ========== Icon Toggles ========== */ /* ========== Radio Buttons ========== */ /* ========== Ripple effect ========== */ /* ========== Layout ========== */ /* ========== Content Tabs ========== */ /* ========== Checkboxes ========== */ /* ========== Switches ========== */ /* ========== Spinner ========== */ /* ========== Text fields ========== */ /* ========== Card ========== */ /* ========== Sliders ========== */ /* ========== Progress ========== */ /* ========== List ========== */ /* ========== Item ========== */ /* ========== Dropdown menu ========== */ /* ========== Tooltips ========== */ /* ========== Footer ========== */ /* TEXTFIELD */ /* SWITCH */ /* SPINNER */ /* RADIO */ /* MENU */ /* LIST */ /* LAYOUT */ /* ICON TOGGLE */ /* FOOTER */ /*mega-footer*/ /*mini-footer*/ /* CHECKBOX */ /* CARD */ /* Card dimensions */ /* Cover image */ /* BUTTON */ /** * * Dimensions * */ /* ANIMATION */ /* PROGRESS */ /* BADGE */ /* SHADOWS */ /* GRID */ /* DATA TABLE */ /* DIALOG */ /* SNACKBAR */ /* TOOLTIP */ /* CHIP */ .mdl-tabs { display: block; width: 100%; } .mdl-tabs__tab-bar { display: flex; flex-direction: row; justify-content: center; align-content: space-between; align-items: flex-start; height: 48px; padding: 0 0 0 0; margin: 0; border-bottom: 1px solid rgb(224,224,224); } .mdl-tabs__tab { margin: 0; border: none; padding: 0 24px 0 24px; float: left; position: relative; display: block; text-decoration: none; height: 48px; line-height: 48px; text-align: center; font-weight: 500; font-size: 14px; text-transform: uppercase; color: rgba(0,0,0, 0.54); overflow: hidden; } .mdl-tabs.is-upgraded .mdl-tabs__tab.is-active { color: rgba(0,0,0, 0.87); } .mdl-tabs.is-upgraded .mdl-tabs__tab.is-active:after { height: 2px; width: 100%; display: block; content: " "; bottom: 0px; left: 0px; position: absolute; background: rgb(0,162,77); animation: border-expand 0.2s cubic-bezier(0.4, 0, 0.4, 1) 0.01s alternate forwards; transition: all 1s cubic-bezier(0.4, 0, 1, 1); } .mdl-tabs__tab .mdl-tabs__ripple-container { display: block; position: absolute; height: 100%; width: 100%; left: 0px; top: 0px; z-index: 1; overflow: hidden; } .mdl-tabs__tab .mdl-tabs__ripple-container .mdl-ripple { background: rgb(0,162,77); } .mdl-tabs__panel { display: block; } .mdl-tabs.is-upgraded .mdl-tabs__panel { display: none; } .mdl-tabs.is-upgraded .mdl-tabs__panel.is-active { display: block; } @keyframes border-expand { 0% { opacity: 0; width: 0; } 100% { opacity: 1; width: 100%; } } /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /*------------------------------------*\ $CONTENTS \*------------------------------------*/ /** * STYLE GUIDE VARIABLES------------------Declarations of Sass variables * -----Typography * -----Colors * -----Textfield * -----Switch * -----Spinner * -----Radio * -----Menu * -----List * -----Layout * -----Icon toggles * -----Footer * -----Column * -----Checkbox * -----Card * -----Button * -----Animation * -----Progress * -----Badge * -----Shadows * -----Grid * -----Data table * -----Dialog * -----Snackbar * -----Tooltip * -----Chip * * Even though all variables have the `!default` directive, most of them * should not be changed as they are dependent one another. This can cause * visual distortions (like alignment issues) that are hard to track down * and fix. */ /* ========== TYPOGRAPHY ========== */ /* We're splitting fonts into "preferred" and "performance" in order to optimize page loading. For important text, such as the body, we want it to load immediately and not wait for the web font load, whereas for other sections, such as headers and titles, we're OK with things taking a bit longer to load. We do have some optional classes and parameters in the mixins, in case you definitely want to make sure you're using the preferred font and don't mind the performance hit. We should be able to improve on this once CSS Font Loading L3 becomes more widely available. */ /* ========== COLORS ========== */ /** * * Material design color palettes. * @see http://www.google.com/design/spec/style/color.html * **/ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== Color Palettes ========== */ /* colors.scss */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== IMAGES ========== */ /* ========== Color & Themes ========== */ /* ========== Typography ========== */ /* ========== Components ========== */ /* ========== Standard Buttons ========== */ /* ========== Icon Toggles ========== */ /* ========== Radio Buttons ========== */ /* ========== Ripple effect ========== */ /* ========== Layout ========== */ /* ========== Content Tabs ========== */ /* ========== Checkboxes ========== */ /* ========== Switches ========== */ /* ========== Spinner ========== */ /* ========== Text fields ========== */ /* ========== Card ========== */ /* ========== Sliders ========== */ /* ========== Progress ========== */ /* ========== List ========== */ /* ========== Item ========== */ /* ========== Dropdown menu ========== */ /* ========== Tooltips ========== */ /* ========== Footer ========== */ /* TEXTFIELD */ /* SWITCH */ /* SPINNER */ /* RADIO */ /* MENU */ /* LIST */ /* LAYOUT */ /* ICON TOGGLE */ /* FOOTER */ /*mega-footer*/ /*mini-footer*/ /* CHECKBOX */ /* CARD */ /* Card dimensions */ /* Cover image */ /* BUTTON */ /** * * Dimensions * */ /* ANIMATION */ /* PROGRESS */ /* BADGE */ /* SHADOWS */ /* GRID */ /* DATA TABLE */ /* DIALOG */ /* SNACKBAR */ /* TOOLTIP */ /* CHIP */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* Typography */ /* Shadows */ /* Animations */ /* Dialog */ .mdl-textfield { position: relative; font-size: 16px; display: inline-block; box-sizing: border-box; width: 300px; max-width: 100%; margin: 0; padding: 20px 0; } .mdl-textfield .mdl-button { position: absolute; bottom: 20px; } .mdl-textfield--align-right { text-align: right; } .mdl-textfield--full-width { width: 100%; } .mdl-textfield--expandable { min-width: 32px; width: auto; min-height: 32px; } .mdl-textfield--expandable .mdl-button--icon { top: 16px; } .mdl-textfield__input { border: none; border-bottom: 1px solid rgba(0,0,0, 0.12); display: block; font-size: 16px; font-family: "Helvetica", "Arial", sans-serif; margin: 0; padding: 4px 0; width: 100%; background: none; text-align: left; color: inherit; } .mdl-textfield__input[type=number] { -moz-appearance: textfield; } .mdl-textfield__input[type=number]::-webkit-inner-spin-button, .mdl-textfield__input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } .mdl-textfield.is-focused .mdl-textfield__input { outline: none; } .mdl-textfield.is-invalid .mdl-textfield__input { border-color: rgb(213,0,0); box-shadow: none; } fieldset[disabled] .mdl-textfield .mdl-textfield__input, .mdl-textfield.is-disabled .mdl-textfield__input { background-color: transparent; border-bottom: 1px dotted rgba(0,0,0, 0.12); color: rgba(0,0,0, 0.26); } .mdl-textfield textarea.mdl-textfield__input { display: block; } .mdl-textfield__label { bottom: 0; color: rgba(0,0,0, 0.26); font-size: 16px; left: 0; right: 0; pointer-events: none; position: absolute; display: block; top: 24px; width: 100%; overflow: hidden; white-space: nowrap; text-align: left; } .mdl-textfield.is-dirty .mdl-textfield__label, .mdl-textfield.has-placeholder .mdl-textfield__label { visibility: hidden; } .mdl-textfield--floating-label .mdl-textfield__label { transition-duration: 0.2s; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); } .mdl-textfield--floating-label.has-placeholder .mdl-textfield__label { transition: none; } fieldset[disabled] .mdl-textfield .mdl-textfield__label, .mdl-textfield.is-disabled.is-disabled .mdl-textfield__label { color: rgba(0,0,0, 0.26); } .mdl-textfield--floating-label.is-focused .mdl-textfield__label, .mdl-textfield--floating-label.is-dirty .mdl-textfield__label, .mdl-textfield--floating-label.has-placeholder .mdl-textfield__label { color: rgb(0,162,77); font-size: 12px; top: 4px; visibility: visible; } .mdl-textfield--floating-label.is-focused .mdl-textfield__expandable-holder .mdl-textfield__label, .mdl-textfield--floating-label.is-dirty .mdl-textfield__expandable-holder .mdl-textfield__label, .mdl-textfield--floating-label.has-placeholder .mdl-textfield__expandable-holder .mdl-textfield__label { top: -16px; } .mdl-textfield--floating-label.is-invalid .mdl-textfield__label { color: rgb(213,0,0); font-size: 12px; } .mdl-textfield__label:after { background-color: rgb(0,162,77); bottom: 20px; content: ""; height: 2px; left: 45%; position: absolute; transition-duration: 0.2s; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); visibility: hidden; width: 10px; } .mdl-textfield.is-focused .mdl-textfield__label:after { left: 0; visibility: visible; width: 100%; } .mdl-textfield.is-invalid .mdl-textfield__label:after { background-color: rgb(213,0,0); } .mdl-textfield__error { color: rgb(213,0,0); position: absolute; font-size: 12px; margin-top: 3px; visibility: hidden; display: block; } .mdl-textfield.is-invalid .mdl-textfield__error { visibility: visible; } .mdl-textfield__expandable-holder { display: inline-block; position: relative; margin-left: 32px; transition-duration: 0.2s; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); display: inline-block; max-width: 0.1px; } .mdl-textfield.is-focused .mdl-textfield__expandable-holder, .mdl-textfield.is-dirty .mdl-textfield__expandable-holder { max-width: 600px; } .mdl-textfield__expandable-holder .mdl-textfield__label:after { bottom: 0; } /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /*------------------------------------*\ $CONTENTS \*------------------------------------*/ /** * STYLE GUIDE VARIABLES------------------Declarations of Sass variables * -----Typography * -----Colors * -----Textfield * -----Switch * -----Spinner * -----Radio * -----Menu * -----List * -----Layout * -----Icon toggles * -----Footer * -----Column * -----Checkbox * -----Card * -----Button * -----Animation * -----Progress * -----Badge * -----Shadows * -----Grid * -----Data table * -----Dialog * -----Snackbar * -----Tooltip * -----Chip * * Even though all variables have the `!default` directive, most of them * should not be changed as they are dependent one another. This can cause * visual distortions (like alignment issues) that are hard to track down * and fix. */ /* ========== TYPOGRAPHY ========== */ /* We're splitting fonts into "preferred" and "performance" in order to optimize page loading. For important text, such as the body, we want it to load immediately and not wait for the web font load, whereas for other sections, such as headers and titles, we're OK with things taking a bit longer to load. We do have some optional classes and parameters in the mixins, in case you definitely want to make sure you're using the preferred font and don't mind the performance hit. We should be able to improve on this once CSS Font Loading L3 becomes more widely available. */ /* ========== COLORS ========== */ /** * * Material design color palettes. * @see http://www.google.com/design/spec/style/color.html * **/ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== Color Palettes ========== */ /* colors.scss */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== IMAGES ========== */ /* ========== Color & Themes ========== */ /* ========== Typography ========== */ /* ========== Components ========== */ /* ========== Standard Buttons ========== */ /* ========== Icon Toggles ========== */ /* ========== Radio Buttons ========== */ /* ========== Ripple effect ========== */ /* ========== Layout ========== */ /* ========== Content Tabs ========== */ /* ========== Checkboxes ========== */ /* ========== Switches ========== */ /* ========== Spinner ========== */ /* ========== Text fields ========== */ /* ========== Card ========== */ /* ========== Sliders ========== */ /* ========== Progress ========== */ /* ========== List ========== */ /* ========== Item ========== */ /* ========== Dropdown menu ========== */ /* ========== Tooltips ========== */ /* ========== Footer ========== */ /* TEXTFIELD */ /* SWITCH */ /* SPINNER */ /* RADIO */ /* MENU */ /* LIST */ /* LAYOUT */ /* ICON TOGGLE */ /* FOOTER */ /*mega-footer*/ /*mini-footer*/ /* CHECKBOX */ /* CARD */ /* Card dimensions */ /* Cover image */ /* BUTTON */ /** * * Dimensions * */ /* ANIMATION */ /* PROGRESS */ /* BADGE */ /* SHADOWS */ /* GRID */ /* DATA TABLE */ /* DIALOG */ /* SNACKBAR */ /* TOOLTIP */ /* CHIP */ .mdl-tooltip { transform: scale(0); transform-origin: top center; z-index: 999; background: rgba(97,97,97, 0.9); border-radius: 2px; color: rgb(255,255,255); display: inline-block; font-size: 10px; font-weight: 500; line-height: 14px; max-width: 170px; position: fixed; top: -500px; left: -500px; padding: 8px; text-align: center; } .mdl-tooltip.is-active { animation: pulse 200ms cubic-bezier(0, 0, 0.2, 1) forwards; } .mdl-tooltip--large { line-height: 14px; font-size: 14px; padding: 16px; } @keyframes pulse { 0% { transform: scale(0); opacity: 0; } 50% { transform: scale(0.99); } 100% { transform: scale(1); opacity: 1; visibility: visible; } } /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /*------------------------------------*\ $CONTENTS \*------------------------------------*/ /** * STYLE GUIDE VARIABLES------------------Declarations of Sass variables * -----Typography * -----Colors * -----Textfield * -----Switch * -----Spinner * -----Radio * -----Menu * -----List * -----Layout * -----Icon toggles * -----Footer * -----Column * -----Checkbox * -----Card * -----Button * -----Animation * -----Progress * -----Badge * -----Shadows * -----Grid * -----Data table * -----Dialog * -----Snackbar * -----Tooltip * -----Chip * * Even though all variables have the `!default` directive, most of them * should not be changed as they are dependent one another. This can cause * visual distortions (like alignment issues) that are hard to track down * and fix. */ /* ========== TYPOGRAPHY ========== */ /* We're splitting fonts into "preferred" and "performance" in order to optimize page loading. For important text, such as the body, we want it to load immediately and not wait for the web font load, whereas for other sections, such as headers and titles, we're OK with things taking a bit longer to load. We do have some optional classes and parameters in the mixins, in case you definitely want to make sure you're using the preferred font and don't mind the performance hit. We should be able to improve on this once CSS Font Loading L3 becomes more widely available. */ /* ========== COLORS ========== */ /** * * Material design color palettes. * @see http://www.google.com/design/spec/style/color.html * **/ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== Color Palettes ========== */ /* colors.scss */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== IMAGES ========== */ /* ========== Color & Themes ========== */ /* ========== Typography ========== */ /* ========== Components ========== */ /* ========== Standard Buttons ========== */ /* ========== Icon Toggles ========== */ /* ========== Radio Buttons ========== */ /* ========== Ripple effect ========== */ /* ========== Layout ========== */ /* ========== Content Tabs ========== */ /* ========== Checkboxes ========== */ /* ========== Switches ========== */ /* ========== Spinner ========== */ /* ========== Text fields ========== */ /* ========== Card ========== */ /* ========== Sliders ========== */ /* ========== Progress ========== */ /* ========== List ========== */ /* ========== Item ========== */ /* ========== Dropdown menu ========== */ /* ========== Tooltips ========== */ /* ========== Footer ========== */ /* TEXTFIELD */ /* SWITCH */ /* SPINNER */ /* RADIO */ /* MENU */ /* LIST */ /* LAYOUT */ /* ICON TOGGLE */ /* FOOTER */ /*mega-footer*/ /*mini-footer*/ /* CHECKBOX */ /* CARD */ /* Card dimensions */ /* Cover image */ /* BUTTON */ /** * * Dimensions * */ /* ANIMATION */ /* PROGRESS */ /* BADGE */ /* SHADOWS */ /* GRID */ /* DATA TABLE */ /* DIALOG */ /* SNACKBAR */ /* TOOLTIP */ /* CHIP */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* Typography */ /* Shadows */ /* Animations */ /* Dialog */ .mdl-shadow--2dp { box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); } .mdl-shadow--3dp { box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 3px 3px -2px rgba(0, 0, 0, 0.2), 0 1px 8px 0 rgba(0, 0, 0, 0.12); } .mdl-shadow--4dp { box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.2); } .mdl-shadow--6dp { box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12), 0 3px 5px -1px rgba(0, 0, 0, 0.2); } .mdl-shadow--8dp { box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2); } .mdl-shadow--16dp { box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2); } .mdl-shadow--24dp { box-shadow: 0 9px 46px 8px rgba(0, 0, 0, 0.14), 0 11px 15px -7px rgba(0, 0, 0, 0.12), 0 24px 38px 3px rgba(0, 0, 0, 0.2); } /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* * NOTE: Some rules here are applied using duplicate selectors. * This is on purpose to increase their specificity when applied. * For example: `.mdl-cell--1-col-phone.mdl-cell--1-col-phone` */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /*------------------------------------*\ $CONTENTS \*------------------------------------*/ /** * STYLE GUIDE VARIABLES------------------Declarations of Sass variables * -----Typography * -----Colors * -----Textfield * -----Switch * -----Spinner * -----Radio * -----Menu * -----List * -----Layout * -----Icon toggles * -----Footer * -----Column * -----Checkbox * -----Card * -----Button * -----Animation * -----Progress * -----Badge * -----Shadows * -----Grid * -----Data table * -----Dialog * -----Snackbar * -----Tooltip * -----Chip * * Even though all variables have the `!default` directive, most of them * should not be changed as they are dependent one another. This can cause * visual distortions (like alignment issues) that are hard to track down * and fix. */ /* ========== TYPOGRAPHY ========== */ /* We're splitting fonts into "preferred" and "performance" in order to optimize page loading. For important text, such as the body, we want it to load immediately and not wait for the web font load, whereas for other sections, such as headers and titles, we're OK with things taking a bit longer to load. We do have some optional classes and parameters in the mixins, in case you definitely want to make sure you're using the preferred font and don't mind the performance hit. We should be able to improve on this once CSS Font Loading L3 becomes more widely available. */ /* ========== COLORS ========== */ /** * * Material design color palettes. * @see http://www.google.com/design/spec/style/color.html * **/ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== Color Palettes ========== */ /* colors.scss */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== IMAGES ========== */ /* ========== Color & Themes ========== */ /* ========== Typography ========== */ /* ========== Components ========== */ /* ========== Standard Buttons ========== */ /* ========== Icon Toggles ========== */ /* ========== Radio Buttons ========== */ /* ========== Ripple effect ========== */ /* ========== Layout ========== */ /* ========== Content Tabs ========== */ /* ========== Checkboxes ========== */ /* ========== Switches ========== */ /* ========== Spinner ========== */ /* ========== Text fields ========== */ /* ========== Card ========== */ /* ========== Sliders ========== */ /* ========== Progress ========== */ /* ========== List ========== */ /* ========== Item ========== */ /* ========== Dropdown menu ========== */ /* ========== Tooltips ========== */ /* ========== Footer ========== */ /* TEXTFIELD */ /* SWITCH */ /* SPINNER */ /* RADIO */ /* MENU */ /* LIST */ /* LAYOUT */ /* ICON TOGGLE */ /* FOOTER */ /*mega-footer*/ /*mini-footer*/ /* CHECKBOX */ /* CARD */ /* Card dimensions */ /* Cover image */ /* BUTTON */ /** * * Dimensions * */ /* ANIMATION */ /* PROGRESS */ /* BADGE */ /* SHADOWS */ /* GRID */ /* DATA TABLE */ /* DIALOG */ /* SNACKBAR */ /* TOOLTIP */ /* CHIP */ .mdl-grid { display: flex; flex-flow: row wrap; margin: 0 auto 0 auto; align-items: stretch; } .mdl-grid.mdl-grid--no-spacing { padding: 0; } .mdl-cell { box-sizing: border-box; } .mdl-cell--top { align-self: flex-start; } .mdl-cell--middle { align-self: center; } .mdl-cell--bottom { align-self: flex-end; } .mdl-cell--stretch { align-self: stretch; } .mdl-grid.mdl-grid--no-spacing > .mdl-cell { margin: 0; } .mdl-cell--order-1 { order: 1; } .mdl-cell--order-2 { order: 2; } .mdl-cell--order-3 { order: 3; } .mdl-cell--order-4 { order: 4; } .mdl-cell--order-5 { order: 5; } .mdl-cell--order-6 { order: 6; } .mdl-cell--order-7 { order: 7; } .mdl-cell--order-8 { order: 8; } .mdl-cell--order-9 { order: 9; } .mdl-cell--order-10 { order: 10; } .mdl-cell--order-11 { order: 11; } .mdl-cell--order-12 { order: 12; } @media (max-width: 479px) { .mdl-grid { padding: 8px; } .mdl-cell { margin: 8px; width: calc(100% - 16px); } .mdl-grid--no-spacing > .mdl-cell { width: 100%; } .mdl-cell--hide-phone { display: none !important; } .mdl-cell--order-1-phone.mdl-cell--order-1-phone { order: 1; } .mdl-cell--order-2-phone.mdl-cell--order-2-phone { order: 2; } .mdl-cell--order-3-phone.mdl-cell--order-3-phone { order: 3; } .mdl-cell--order-4-phone.mdl-cell--order-4-phone { order: 4; } .mdl-cell--order-5-phone.mdl-cell--order-5-phone { order: 5; } .mdl-cell--order-6-phone.mdl-cell--order-6-phone { order: 6; } .mdl-cell--order-7-phone.mdl-cell--order-7-phone { order: 7; } .mdl-cell--order-8-phone.mdl-cell--order-8-phone { order: 8; } .mdl-cell--order-9-phone.mdl-cell--order-9-phone { order: 9; } .mdl-cell--order-10-phone.mdl-cell--order-10-phone { order: 10; } .mdl-cell--order-11-phone.mdl-cell--order-11-phone { order: 11; } .mdl-cell--order-12-phone.mdl-cell--order-12-phone { order: 12; } .mdl-cell--1-col, .mdl-cell--1-col-phone.mdl-cell--1-col-phone { width: calc(25% - 16px); } .mdl-grid--no-spacing > .mdl-cell--1-col, .mdl-grid--no-spacing > .mdl-cell--1-col-phone.mdl-cell--1-col-phone { width: 25%; } .mdl-cell--2-col, .mdl-cell--2-col-phone.mdl-cell--2-col-phone { width: calc(50% - 16px); } .mdl-grid--no-spacing > .mdl-cell--2-col, .mdl-grid--no-spacing > .mdl-cell--2-col-phone.mdl-cell--2-col-phone { width: 50%; } .mdl-cell--3-col, .mdl-cell--3-col-phone.mdl-cell--3-col-phone { width: calc(75% - 16px); } .mdl-grid--no-spacing > .mdl-cell--3-col, .mdl-grid--no-spacing > .mdl-cell--3-col-phone.mdl-cell--3-col-phone { width: 75%; } .mdl-cell--4-col, .mdl-cell--4-col-phone.mdl-cell--4-col-phone { width: calc(100% - 16px); } .mdl-grid--no-spacing > .mdl-cell--4-col, .mdl-grid--no-spacing > .mdl-cell--4-col-phone.mdl-cell--4-col-phone { width: 100%; } .mdl-cell--5-col, .mdl-cell--5-col-phone.mdl-cell--5-col-phone { width: calc(100% - 16px); } .mdl-grid--no-spacing > .mdl-cell--5-col, .mdl-grid--no-spacing > .mdl-cell--5-col-phone.mdl-cell--5-col-phone { width: 100%; } .mdl-cell--6-col, .mdl-cell--6-col-phone.mdl-cell--6-col-phone { width: calc(100% - 16px); } .mdl-grid--no-spacing > .mdl-cell--6-col, .mdl-grid--no-spacing > .mdl-cell--6-col-phone.mdl-cell--6-col-phone { width: 100%; } .mdl-cell--7-col, .mdl-cell--7-col-phone.mdl-cell--7-col-phone { width: calc(100% - 16px); } .mdl-grid--no-spacing > .mdl-cell--7-col, .mdl-grid--no-spacing > .mdl-cell--7-col-phone.mdl-cell--7-col-phone { width: 100%; } .mdl-cell--8-col, .mdl-cell--8-col-phone.mdl-cell--8-col-phone { width: calc(100% - 16px); } .mdl-grid--no-spacing > .mdl-cell--8-col, .mdl-grid--no-spacing > .mdl-cell--8-col-phone.mdl-cell--8-col-phone { width: 100%; } .mdl-cell--9-col, .mdl-cell--9-col-phone.mdl-cell--9-col-phone { width: calc(100% - 16px); } .mdl-grid--no-spacing > .mdl-cell--9-col, .mdl-grid--no-spacing > .mdl-cell--9-col-phone.mdl-cell--9-col-phone { width: 100%; } .mdl-cell--10-col, .mdl-cell--10-col-phone.mdl-cell--10-col-phone { width: calc(100% - 16px); } .mdl-grid--no-spacing > .mdl-cell--10-col, .mdl-grid--no-spacing > .mdl-cell--10-col-phone.mdl-cell--10-col-phone { width: 100%; } .mdl-cell--11-col, .mdl-cell--11-col-phone.mdl-cell--11-col-phone { width: calc(100% - 16px); } .mdl-grid--no-spacing > .mdl-cell--11-col, .mdl-grid--no-spacing > .mdl-cell--11-col-phone.mdl-cell--11-col-phone { width: 100%; } .mdl-cell--12-col, .mdl-cell--12-col-phone.mdl-cell--12-col-phone { width: calc(100% - 16px); } .mdl-grid--no-spacing > .mdl-cell--12-col, .mdl-grid--no-spacing > .mdl-cell--12-col-phone.mdl-cell--12-col-phone { width: 100%; } .mdl-cell--1-offset, .mdl-cell--1-offset-phone.mdl-cell--1-offset-phone { margin-left: calc(25% + 8px); } .mdl-grid.mdl-grid--no-spacing > .mdl-cell--1-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--1-offset-phone.mdl-cell--1-offset-phone { margin-left: 25%; } .mdl-cell--2-offset, .mdl-cell--2-offset-phone.mdl-cell--2-offset-phone { margin-left: calc(50% + 8px); } .mdl-grid.mdl-grid--no-spacing > .mdl-cell--2-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--2-offset-phone.mdl-cell--2-offset-phone { margin-left: 50%; } .mdl-cell--3-offset, .mdl-cell--3-offset-phone.mdl-cell--3-offset-phone { margin-left: calc(75% + 8px); } .mdl-grid.mdl-grid--no-spacing > .mdl-cell--3-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--3-offset-phone.mdl-cell--3-offset-phone { margin-left: 75%; } } @media (min-width: 480px) and (max-width: 839px) { .mdl-grid { padding: 8px; } .mdl-cell { margin: 8px; width: calc(50% - 16px); } .mdl-grid--no-spacing > .mdl-cell { width: 50%; } .mdl-cell--hide-tablet { display: none !important; } .mdl-cell--order-1-tablet.mdl-cell--order-1-tablet { order: 1; } .mdl-cell--order-2-tablet.mdl-cell--order-2-tablet { order: 2; } .mdl-cell--order-3-tablet.mdl-cell--order-3-tablet { order: 3; } .mdl-cell--order-4-tablet.mdl-cell--order-4-tablet { order: 4; } .mdl-cell--order-5-tablet.mdl-cell--order-5-tablet { order: 5; } .mdl-cell--order-6-tablet.mdl-cell--order-6-tablet { order: 6; } .mdl-cell--order-7-tablet.mdl-cell--order-7-tablet { order: 7; } .mdl-cell--order-8-tablet.mdl-cell--order-8-tablet { order: 8; } .mdl-cell--order-9-tablet.mdl-cell--order-9-tablet { order: 9; } .mdl-cell--order-10-tablet.mdl-cell--order-10-tablet { order: 10; } .mdl-cell--order-11-tablet.mdl-cell--order-11-tablet { order: 11; } .mdl-cell--order-12-tablet.mdl-cell--order-12-tablet { order: 12; } .mdl-cell--1-col, .mdl-cell--1-col-tablet.mdl-cell--1-col-tablet { width: calc(12.5% - 16px); } .mdl-grid--no-spacing > .mdl-cell--1-col, .mdl-grid--no-spacing > .mdl-cell--1-col-tablet.mdl-cell--1-col-tablet { width: 12.5%; } .mdl-cell--2-col, .mdl-cell--2-col-tablet.mdl-cell--2-col-tablet { width: calc(25% - 16px); } .mdl-grid--no-spacing > .mdl-cell--2-col, .mdl-grid--no-spacing > .mdl-cell--2-col-tablet.mdl-cell--2-col-tablet { width: 25%; } .mdl-cell--3-col, .mdl-cell--3-col-tablet.mdl-cell--3-col-tablet { width: calc(37.5% - 16px); } .mdl-grid--no-spacing > .mdl-cell--3-col, .mdl-grid--no-spacing > .mdl-cell--3-col-tablet.mdl-cell--3-col-tablet { width: 37.5%; } .mdl-cell--4-col, .mdl-cell--4-col-tablet.mdl-cell--4-col-tablet { width: calc(50% - 16px); } .mdl-grid--no-spacing > .mdl-cell--4-col, .mdl-grid--no-spacing > .mdl-cell--4-col-tablet.mdl-cell--4-col-tablet { width: 50%; } .mdl-cell--5-col, .mdl-cell--5-col-tablet.mdl-cell--5-col-tablet { width: calc(62.5% - 16px); } .mdl-grid--no-spacing > .mdl-cell--5-col, .mdl-grid--no-spacing > .mdl-cell--5-col-tablet.mdl-cell--5-col-tablet { width: 62.5%; } .mdl-cell--6-col, .mdl-cell--6-col-tablet.mdl-cell--6-col-tablet { width: calc(75% - 16px); } .mdl-grid--no-spacing > .mdl-cell--6-col, .mdl-grid--no-spacing > .mdl-cell--6-col-tablet.mdl-cell--6-col-tablet { width: 75%; } .mdl-cell--7-col, .mdl-cell--7-col-tablet.mdl-cell--7-col-tablet { width: calc(87.5% - 16px); } .mdl-grid--no-spacing > .mdl-cell--7-col, .mdl-grid--no-spacing > .mdl-cell--7-col-tablet.mdl-cell--7-col-tablet { width: 87.5%; } .mdl-cell--8-col, .mdl-cell--8-col-tablet.mdl-cell--8-col-tablet { width: calc(100% - 16px); } .mdl-grid--no-spacing > .mdl-cell--8-col, .mdl-grid--no-spacing > .mdl-cell--8-col-tablet.mdl-cell--8-col-tablet { width: 100%; } .mdl-cell--9-col, .mdl-cell--9-col-tablet.mdl-cell--9-col-tablet { width: calc(100% - 16px); } .mdl-grid--no-spacing > .mdl-cell--9-col, .mdl-grid--no-spacing > .mdl-cell--9-col-tablet.mdl-cell--9-col-tablet { width: 100%; } .mdl-cell--10-col, .mdl-cell--10-col-tablet.mdl-cell--10-col-tablet { width: calc(100% - 16px); } .mdl-grid--no-spacing > .mdl-cell--10-col, .mdl-grid--no-spacing > .mdl-cell--10-col-tablet.mdl-cell--10-col-tablet { width: 100%; } .mdl-cell--11-col, .mdl-cell--11-col-tablet.mdl-cell--11-col-tablet { width: calc(100% - 16px); } .mdl-grid--no-spacing > .mdl-cell--11-col, .mdl-grid--no-spacing > .mdl-cell--11-col-tablet.mdl-cell--11-col-tablet { width: 100%; } .mdl-cell--12-col, .mdl-cell--12-col-tablet.mdl-cell--12-col-tablet { width: calc(100% - 16px); } .mdl-grid--no-spacing > .mdl-cell--12-col, .mdl-grid--no-spacing > .mdl-cell--12-col-tablet.mdl-cell--12-col-tablet { width: 100%; } .mdl-cell--1-offset, .mdl-cell--1-offset-tablet.mdl-cell--1-offset-tablet { margin-left: calc(12.5% + 8px); } .mdl-grid.mdl-grid--no-spacing > .mdl-cell--1-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--1-offset-tablet.mdl-cell--1-offset-tablet { margin-left: 12.5%; } .mdl-cell--2-offset, .mdl-cell--2-offset-tablet.mdl-cell--2-offset-tablet { margin-left: calc(25% + 8px); } .mdl-grid.mdl-grid--no-spacing > .mdl-cell--2-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--2-offset-tablet.mdl-cell--2-offset-tablet { margin-left: 25%; } .mdl-cell--3-offset, .mdl-cell--3-offset-tablet.mdl-cell--3-offset-tablet { margin-left: calc(37.5% + 8px); } .mdl-grid.mdl-grid--no-spacing > .mdl-cell--3-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--3-offset-tablet.mdl-cell--3-offset-tablet { margin-left: 37.5%; } .mdl-cell--4-offset, .mdl-cell--4-offset-tablet.mdl-cell--4-offset-tablet { margin-left: calc(50% + 8px); } .mdl-grid.mdl-grid--no-spacing > .mdl-cell--4-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--4-offset-tablet.mdl-cell--4-offset-tablet { margin-left: 50%; } .mdl-cell--5-offset, .mdl-cell--5-offset-tablet.mdl-cell--5-offset-tablet { margin-left: calc(62.5% + 8px); } .mdl-grid.mdl-grid--no-spacing > .mdl-cell--5-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--5-offset-tablet.mdl-cell--5-offset-tablet { margin-left: 62.5%; } .mdl-cell--6-offset, .mdl-cell--6-offset-tablet.mdl-cell--6-offset-tablet { margin-left: calc(75% + 8px); } .mdl-grid.mdl-grid--no-spacing > .mdl-cell--6-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--6-offset-tablet.mdl-cell--6-offset-tablet { margin-left: 75%; } .mdl-cell--7-offset, .mdl-cell--7-offset-tablet.mdl-cell--7-offset-tablet { margin-left: calc(87.5% + 8px); } .mdl-grid.mdl-grid--no-spacing > .mdl-cell--7-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--7-offset-tablet.mdl-cell--7-offset-tablet { margin-left: 87.5%; } } @media (min-width: 840px) { .mdl-grid { padding: 8px; } .mdl-cell { margin: 8px; width: calc(33.3333333333% - 16px); } .mdl-grid--no-spacing > .mdl-cell { width: 33.3333333333%; } .mdl-cell--hide-desktop { display: none !important; } .mdl-cell--order-1-desktop.mdl-cell--order-1-desktop { order: 1; } .mdl-cell--order-2-desktop.mdl-cell--order-2-desktop { order: 2; } .mdl-cell--order-3-desktop.mdl-cell--order-3-desktop { order: 3; } .mdl-cell--order-4-desktop.mdl-cell--order-4-desktop { order: 4; } .mdl-cell--order-5-desktop.mdl-cell--order-5-desktop { order: 5; } .mdl-cell--order-6-desktop.mdl-cell--order-6-desktop { order: 6; } .mdl-cell--order-7-desktop.mdl-cell--order-7-desktop { order: 7; } .mdl-cell--order-8-desktop.mdl-cell--order-8-desktop { order: 8; } .mdl-cell--order-9-desktop.mdl-cell--order-9-desktop { order: 9; } .mdl-cell--order-10-desktop.mdl-cell--order-10-desktop { order: 10; } .mdl-cell--order-11-desktop.mdl-cell--order-11-desktop { order: 11; } .mdl-cell--order-12-desktop.mdl-cell--order-12-desktop { order: 12; } .mdl-cell--1-col, .mdl-cell--1-col-desktop.mdl-cell--1-col-desktop { width: calc(8.3333333333% - 16px); } .mdl-grid--no-spacing > .mdl-cell--1-col, .mdl-grid--no-spacing > .mdl-cell--1-col-desktop.mdl-cell--1-col-desktop { width: 8.3333333333%; } .mdl-cell--2-col, .mdl-cell--2-col-desktop.mdl-cell--2-col-desktop { width: calc(16.6666666667% - 16px); } .mdl-grid--no-spacing > .mdl-cell--2-col, .mdl-grid--no-spacing > .mdl-cell--2-col-desktop.mdl-cell--2-col-desktop { width: 16.6666666667%; } .mdl-cell--3-col, .mdl-cell--3-col-desktop.mdl-cell--3-col-desktop { width: calc(25% - 16px); } .mdl-grid--no-spacing > .mdl-cell--3-col, .mdl-grid--no-spacing > .mdl-cell--3-col-desktop.mdl-cell--3-col-desktop { width: 25%; } .mdl-cell--4-col, .mdl-cell--4-col-desktop.mdl-cell--4-col-desktop { width: calc(33.3333333333% - 16px); } .mdl-grid--no-spacing > .mdl-cell--4-col, .mdl-grid--no-spacing > .mdl-cell--4-col-desktop.mdl-cell--4-col-desktop { width: 33.3333333333%; } .mdl-cell--5-col, .mdl-cell--5-col-desktop.mdl-cell--5-col-desktop { width: calc(41.6666666667% - 16px); } .mdl-grid--no-spacing > .mdl-cell--5-col, .mdl-grid--no-spacing > .mdl-cell--5-col-desktop.mdl-cell--5-col-desktop { width: 41.6666666667%; } .mdl-cell--6-col, .mdl-cell--6-col-desktop.mdl-cell--6-col-desktop { width: calc(50% - 16px); } .mdl-grid--no-spacing > .mdl-cell--6-col, .mdl-grid--no-spacing > .mdl-cell--6-col-desktop.mdl-cell--6-col-desktop { width: 50%; } .mdl-cell--7-col, .mdl-cell--7-col-desktop.mdl-cell--7-col-desktop { width: calc(58.3333333333% - 16px); } .mdl-grid--no-spacing > .mdl-cell--7-col, .mdl-grid--no-spacing > .mdl-cell--7-col-desktop.mdl-cell--7-col-desktop { width: 58.3333333333%; } .mdl-cell--8-col, .mdl-cell--8-col-desktop.mdl-cell--8-col-desktop { width: calc(66.6666666667% - 16px); } .mdl-grid--no-spacing > .mdl-cell--8-col, .mdl-grid--no-spacing > .mdl-cell--8-col-desktop.mdl-cell--8-col-desktop { width: 66.6666666667%; } .mdl-cell--9-col, .mdl-cell--9-col-desktop.mdl-cell--9-col-desktop { width: calc(75% - 16px); } .mdl-grid--no-spacing > .mdl-cell--9-col, .mdl-grid--no-spacing > .mdl-cell--9-col-desktop.mdl-cell--9-col-desktop { width: 75%; } .mdl-cell--10-col, .mdl-cell--10-col-desktop.mdl-cell--10-col-desktop { width: calc(83.3333333333% - 16px); } .mdl-grid--no-spacing > .mdl-cell--10-col, .mdl-grid--no-spacing > .mdl-cell--10-col-desktop.mdl-cell--10-col-desktop { width: 83.3333333333%; } .mdl-cell--11-col, .mdl-cell--11-col-desktop.mdl-cell--11-col-desktop { width: calc(91.6666666667% - 16px); } .mdl-grid--no-spacing > .mdl-cell--11-col, .mdl-grid--no-spacing > .mdl-cell--11-col-desktop.mdl-cell--11-col-desktop { width: 91.6666666667%; } .mdl-cell--12-col, .mdl-cell--12-col-desktop.mdl-cell--12-col-desktop { width: calc(100% - 16px); } .mdl-grid--no-spacing > .mdl-cell--12-col, .mdl-grid--no-spacing > .mdl-cell--12-col-desktop.mdl-cell--12-col-desktop { width: 100%; } .mdl-cell--1-offset, .mdl-cell--1-offset-desktop.mdl-cell--1-offset-desktop { margin-left: calc(8.3333333333% + 8px); } .mdl-grid.mdl-grid--no-spacing > .mdl-cell--1-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--1-offset-desktop.mdl-cell--1-offset-desktop { margin-left: 8.3333333333%; } .mdl-cell--2-offset, .mdl-cell--2-offset-desktop.mdl-cell--2-offset-desktop { margin-left: calc(16.6666666667% + 8px); } .mdl-grid.mdl-grid--no-spacing > .mdl-cell--2-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--2-offset-desktop.mdl-cell--2-offset-desktop { margin-left: 16.6666666667%; } .mdl-cell--3-offset, .mdl-cell--3-offset-desktop.mdl-cell--3-offset-desktop { margin-left: calc(25% + 8px); } .mdl-grid.mdl-grid--no-spacing > .mdl-cell--3-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--3-offset-desktop.mdl-cell--3-offset-desktop { margin-left: 25%; } .mdl-cell--4-offset, .mdl-cell--4-offset-desktop.mdl-cell--4-offset-desktop { margin-left: calc(33.3333333333% + 8px); } .mdl-grid.mdl-grid--no-spacing > .mdl-cell--4-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--4-offset-desktop.mdl-cell--4-offset-desktop { margin-left: 33.3333333333%; } .mdl-cell--5-offset, .mdl-cell--5-offset-desktop.mdl-cell--5-offset-desktop { margin-left: calc(41.6666666667% + 8px); } .mdl-grid.mdl-grid--no-spacing > .mdl-cell--5-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--5-offset-desktop.mdl-cell--5-offset-desktop { margin-left: 41.6666666667%; } .mdl-cell--6-offset, .mdl-cell--6-offset-desktop.mdl-cell--6-offset-desktop { margin-left: calc(50% + 8px); } .mdl-grid.mdl-grid--no-spacing > .mdl-cell--6-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--6-offset-desktop.mdl-cell--6-offset-desktop { margin-left: 50%; } .mdl-cell--7-offset, .mdl-cell--7-offset-desktop.mdl-cell--7-offset-desktop { margin-left: calc(58.3333333333% + 8px); } .mdl-grid.mdl-grid--no-spacing > .mdl-cell--7-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--7-offset-desktop.mdl-cell--7-offset-desktop { margin-left: 58.3333333333%; } .mdl-cell--8-offset, .mdl-cell--8-offset-desktop.mdl-cell--8-offset-desktop { margin-left: calc(66.6666666667% + 8px); } .mdl-grid.mdl-grid--no-spacing > .mdl-cell--8-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--8-offset-desktop.mdl-cell--8-offset-desktop { margin-left: 66.6666666667%; } .mdl-cell--9-offset, .mdl-cell--9-offset-desktop.mdl-cell--9-offset-desktop { margin-left: calc(75% + 8px); } .mdl-grid.mdl-grid--no-spacing > .mdl-cell--9-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--9-offset-desktop.mdl-cell--9-offset-desktop { margin-left: 75%; } .mdl-cell--10-offset, .mdl-cell--10-offset-desktop.mdl-cell--10-offset-desktop { margin-left: calc(83.3333333333% + 8px); } .mdl-grid.mdl-grid--no-spacing > .mdl-cell--10-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--10-offset-desktop.mdl-cell--10-offset-desktop { margin-left: 83.3333333333%; } .mdl-cell--11-offset, .mdl-cell--11-offset-desktop.mdl-cell--11-offset-desktop { margin-left: calc(91.6666666667% + 8px); } .mdl-grid.mdl-grid--no-spacing > .mdl-cell--11-offset, .mdl-grid.mdl-grid--no-spacing > .mdl-cell--11-offset-desktop.mdl-cell--11-offset-desktop { margin-left: 91.6666666667%; } } .getmdl-select .mdl-icon-toggle__label { float: right; margin-top: -30px; color: rgba(0, 0, 0, 0.4); } .getmdl-select.is-focused .mdl-icon-toggle__label { color: #3f51b5; } .getmdl-select .mdl-menu__container { width: 100% !important; overflow: hidden; } .getmdl-select .mdl-menu__container .mdl-menu .mdl-menu__item { font-size: 16px; } .getmdl-select__fullwidth .mdl-menu { width: 100%; } .getmdl-select__fix-height .mdl-menu__container { overflow-y: auto; max-height: 300px !important; } .getmdl-select__fix-height .mdl-menu.mdl-menu--top-left { bottom: auto; top: 0; } @font-face { font-family: "Material Icons"; font-style: normal; font-weight: 400; src: url('MaterialIcons-Regular.eot'); /* For IE6-8 */ src: local("Material Icons"), local("MaterialIcons-Regular"), url('MaterialIcons-Regular.woff2') format("woff2"), url('MaterialIcons-Regular.woff') format("woff"), url('MaterialIcons-Regular.ttf') format("truetype"); /* Safari, Android, iOS */ } .material-icons { font-family: "Material Icons"; font-weight: normal; font-style: normal; font-size: 24px; /* Preferred icon size */ display: inline-block; line-height: 1; text-transform: none; letter-spacing: normal; word-wrap: normal; white-space: nowrap; direction: ltr; /* Support for all WebKit browsers. */ -webkit-font-smoothing: antialiased; /* Support for Safari and Chrome. */ text-rendering: optimizeLegibility; /* Support for Firefox. */ -moz-osx-font-smoothing: grayscale; /* Support for IE. */ font-feature-settings: "liga"; /* Rules for sizing the icon. */ /* Rules for using icons as black on a light background. */ /* Rules for using icons as white on a dark background. */ } .material-icons.md-18 { font-size: 18px; } .material-icons.md-24 { font-size: 24px; } .material-icons.md-36 { font-size: 36px; } .material-icons.md-48 { font-size: 48px; } .material-icons.md-dark { color: rgba(0, 0, 0, 0.54); } .material-icons.md-dark.md-inactive { color: rgba(0, 0, 0, 0.26); } .material-icons.md-light { color: rgb(255, 255, 255); } .material-icons.md-light.md-inactive { color: rgba(255, 255, 255, 0.3); } /* Generated by Font Squirrel (https://www.fontsquirrel.com) on August, 2016 */ @font-face { font-family: "league_gothicregular"; src: url('leaguegothic-regular-webfont.eot'); src: url('leaguegothic-regular-webfont.eot?#iefix') format("embedded-opentype"), url('leaguegothic-regular-webfont.woff2') format("woff2"), url('leaguegothic-regular-webfont.woff') format("woff"), url('leaguegothic-regular-webfont.ttf') format("truetype"), url('leaguegothic-regular-webfont.svg#league_gothicregular') format("svg"); font-weight: normal; font-style: normal; } @font-face { font-family: "facitregular"; src: url('facit-regular-webfont.eot'); src: url('facit-regular-webfont.eot?#iefix') format("embedded-opentype"), url('facit-regular-webfont.woff2') format("woff2"), url('facit-regular-webfont.woff') format("woff"), url('facit-regular-webfont.ttf') format("truetype"), url('facit-regular-webfont.svg#facitregular') format("svg"); font-weight: normal; font-style: normal; } @font-face { font-family: "facitlight"; src: url('facit-light-webfont.eot'); src: url('facit-light-webfont.eot?#iefix') format("embedded-opentype"), url('facit-light-webfont.woff2') format("woff2"), url('facit-light-webfont.woff') format("woff"), url('facit-light-webfont.ttf') format("truetype"), url('facit-light-webfont.svg#facitlight') format("svg"); font-weight: normal; font-style: normal; } @font-face { font-family: "facitsemibold"; src: url('facit-semibold-webfont.eot'); src: url('facit-semibold-webfont.eot?#iefix') format("embedded-opentype"), url('facit-semibold-webfont.woff2') format("woff2"), url('facit-semibold-webfont.woff') format("woff"), url('facit-semibold-webfont.ttf') format("truetype"), url('facit-semibold-webfont.svg#facitsemibold') format("svg"); font-weight: normal; font-style: normal; } /** * Variables */ /* reset */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ""; content: none; } table { border-collapse: collapse; border-spacing: 0; } *, *:after, *:before { box-sizing: border-box; } *:invalid { border: 0; box-shadow: none; -moz-box-shadow: none; } ::-moz-focus-inner, :active, :focus { outline: none; border: 0; -moz-outline-style: none; } input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active { -webkit-transition: all 5000s ease-in-out 0s; transition: all 5000s ease-in-out 0s; -webkit-transition-property: background-color, color; transition-property: background-color, color; } html, body { -webkit-text-size-adjust: 100%; } /* Mixin */ .size-standard, .fd-assistance .mdl-card__supporting-text .fd-txt, .fd-content-container.fd-full-width .mdl-card .mdl-card__supporting-text .fd-listing li, .fd-content-container.fd-full-width .mdl-card .mdl-card__supporting-text .fd-listing, .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-left .fd-txt ul li, .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-left .fd-txt ul, .fd-col-dx .mdl-card .mdl-card__supporting-text .fd-icon-element, .fd-siff .mdl-card.fd-siff-int, .fd-siff, .fd-progress-bar .fd-bar .fd-progress, .fd-progress-bar, fnd-pp-title-bar .fd-title-bar, .fd-card-slider-products .fd-ctn-products, .fd-card-slider-products .fd-links-products, .fd-card-slider-products, .fd-tabs .fd-ctn-tabs .fd-box .fd-txt, .fd-tabs .fd-ctn-tabs, .fd-tabs .fd-link-tabs, .fd-tabs, .mdl-card .fd-creditcard, .fd-header .mdl-layout__header-row .fd-alert .fd-menu-alert ul li a, .fd-header .mdl-layout__header-row .fd-alert .fd-menu-alert ul, .fd-clear { clear: both; width: 100%; float: left; } .shadow, .fd-assistance .mdl-card__menu, .fd-panel-offerts, .fd-ctn-frm .fd-radio-ctn.fd-special-active, .fd-ctn-frm .fd-checkbox-ctn.fd-special-active, .fd-siff .fd-sel-dropdown, .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_calcola, .fd-sel-dropdown, .fd-ctn-frm .fd-select-ctn .mdl-menu__container.is-visible, .fd-menu-product .fd-menu-product-ctn, .fd-menu-user, .fd-header .mdl-layout__header-row .fd-alert .fd-menu-alert, .fd-header .mdl-layout__header-row .fd-search-bar .suggestion-list, .mdl-button.fd-btn { box-shadow: 0px 2px 4px #c7c7c7; } .shadow-hover, .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_calcola:active, .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_calcola:hover, .mdl-button.fd-btn:active, .mdl-button.fd-btn:hover { box-shadow: 0 6px 10px #c7c7c7; } .circular, .fd-assistance .mdl-card__menu .mdl-button.fd-icon-close, .fd-assistance .mdl-card__supporting-text .fd-subtitle .fd-icon-back, .fd-panel-offerts .fd-panel-offerts-header .fd-panel-offerts-header-close .mdl-button.fd-icon-close, .mdl-dialog__content .fd-box-outcome .fd-msg .fd-circular i, .fd-content-container.fd-full-width .mdl-card .fd-box-outcome .fd-msg .fd-circular i, .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step li .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step-vertical li .fd-number, .fd-progress-bar .fd-bar .fd-info .fd-percentage, .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_assicurazione_help, .mdl-dialog .mdl-dialog__title .mdl-button.fd-circular, .mdl-card .fd-step-horiz li .fd-number, .mdl-card .fd-info-modal, .mdl-card .fd-box-error .fd-msg .fd-circular i, .mdl-card .fd-box-outcome .fd-msg .fd-circular i, .mdl-card .mdl-card__title button, .mdl-card .mdl-card__title.fd-icon-title .mdl-card__title-text .fd-back, .mdl-card.fd-card-lite .mdl-card__actions .fd-step li .fd-number, .mdl-card.fd-card-focus .fd-icon-focus, .fd-menu-product button, .fd-title-bar .fd-link-tabs-hp a .fd-tabs-number, .fd-title-bar .fd-bubble-txt span, .fd-title-bar .fd-bubble, .fd-title-bar .fd-header-title .fd-menu-product button { border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; } /** * Base */ a { text-decoration: none; color: #1D3032; } a:hover, a:active, a:focus, a:link, a:visited { outline: 0; outline: 0 !important; outline-style: none; text-decoration: none; } button, object, embed { outline: 0; border: 0; } input::-moz-focus-inner { outline: 0; } input[type=submit]::-moz-focus-inner, input[type=button]::-moz-focus-inner { outline: 0; } strong, b { font-family: "facitsemibold", "Open Sans", arial, sans-serif; } html, body { height: 100%; -webkit-text-size-adjust: 100%; } body { font-family: "facitlight", "Open Sans", arial, sans-serif; color: #1D3032; font-size: 15px; background-color: #f4f4f9; } .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 { letter-spacing: -0.8px !important; } .fd-clear { height: 40px; } @media all and (max-width: 840px) { .fd-clear { height: 20px; } } .mdl-button { text-align: left; display: inline-block; font-family: "facitsemibold", "Open Sans", arial, sans-serif; font-size: 14.5px; padding: 0 10px; height: auto; min-height: 40px; line-height: 15px; } .mdl-button.fd-primary { color: #5bba6f; } .mdl-button.fd-primary:hover { background-color: #e6f6eb; } .mdl-button.fd-secondary { color: #0D5C63; } .mdl-button.fd-secondary:hover { background-color: #dde9eb; } .mdl-button span { display: block; padding: 13px 0 10px 0; } .mdl-button span i { margin: -8px 5px 0 0; font-size: 27px; display: block; float: left; } .mdl-button.fd-btn { line-height: 20px; background-color: #00A258; color: #FFFFFF; padding: 10px 40px; } .mdl-button.fd-btn.fd-sky { background-color: #66b3bd; } .mdl-button.fd-btn.fd-small { font-size: 12px; line-height: 12px; min-height: 34px; padding: 11px 40px 6px 40px; } .mdl-button.fd-btn.fd-disabled { cursor: default; color: #0D5C63; opacity: 0.8; filter: alpha(opacity=80); } .mdl-button.fd-btn.fd-disabled:active, .mdl-button.fd-btn.fd-disabled:hover { box-shadow: none !important; } .check { /*Adding custom checkbox icons*/ /*hiding the original checkboxes*/ /*when the user checks the checkbox the checked icon will animate in*/ /*adding some colors for fun*/ } .check label { position: relative; font-size: 15px; cursor: pointer; } .check label:before, .check label:after { font-family: "Material Icons"; font-size: 25px; /*absolutely positioned*/ position: absolute; top: 0; right: 30px; } .check label:before { content: "\e835"; /*unchecked*/ } .check label:after { content: "\e834"; /*checked*/ /*checked icon will be hidden by default by using 0 max-width and overflow hidden*/ max-width: 0; overflow: hidden; opacity: 0.5; } .check input[type=checkbox] { display: none; } .check input[type=checkbox]:checked + label:after { max-width: 25px; /*an arbitratry number more than the icon's width*/ opacity: 1; /*for fade in effect*/ } .check input[type=checkbox] + label:before, .check input[type=checkbox] + label:after { color: #0D5C63; } .fd-hide { display: none; } /* header */ @media screen and (max-width: 1024px) { .fd-header { display: block; } } .fd-header .mdl-layout__header-row { height: 64px; padding: 0; color: #0D5C63; } .fd-header .mdl-layout__header-row .mdl-button { border-radius: 0; color: #0D5C63; padding: 0; margin: 0 20px 0 0; min-width: 30px; width: 30px; } .fd-header .mdl-layout__header-row .mdl-button:hover { background-color: transparent; opacity: 0.5; filter: alpha(opacity=50); } .fd-header .mdl-layout__header-row .mdl-button:focus { background-color: transparent; opacity: 1; filter: alpha(opacity=100); } .fd-header .mdl-layout__header-row .mdl-button i { font-size: 30px; } @media all and (max-width: 640px) { .fd-header .mdl-layout__header-row .mdl-button { margin: 0 5px; } } @media all and (max-width: 320px) { .fd-header .mdl-layout__header-row .mdl-button { margin: 0; } .fd-header .mdl-layout__header-row .mdl-button i { font-size: 24px; } } .fd-header .mdl-layout__header-row .fd-icon-menu { width: 80px; height: 64px; border-right: 1px solid #e1e1e5; text-align: center; display: none; } @media all and (max-width: 1280px) { .fd-header .mdl-layout__header-row .fd-icon-menu { display: block; padding: 12px 0 0 0; width: 80px; } } @media all and (max-width: 640px) { .fd-header .mdl-layout__header-row .fd-icon-menu { width: 60px; } } @media all and (max-width: 320px) { .fd-header .mdl-layout__header-row .fd-icon-menu { padding: 15px 0 0 0; width: 40px; } } .fd-header .mdl-layout__header-row .fd-icon-menu i { display: block; margin: auto; font-size: 40.5px; color: #00A258; } @media all and (max-width: 320px) { .fd-header .mdl-layout__header-row .fd-icon-menu i { font-size: 30px; } } .fd-header .mdl-layout__header-row .fd-logo { float: left; display: block; height: 64px; width: 230px; overflow: hidden; border-right: 1px solid #e1e1e5; text-align: center; } @media all and (max-width: 1280px) { .fd-header .mdl-layout__header-row .fd-logo { width: 190px; } } @media all and (max-width: 840px) { .fd-header .mdl-layout__header-row .fd-logo { border: 0; } } @media all and (max-width: 640px) { .fd-header .mdl-layout__header-row .fd-logo { width: 190px; } } .fd-header .mdl-layout__header-row .fd-logo img { max-height: 64px; max-width: 190px; padding: 10px; } @media all and (max-width: 640px) { .fd-header .mdl-layout__header-row .fd-logo img { margin: 5px 0 0 10px; height: 58px; } } .fd-header .mdl-layout__header-row .fd-search-bar { position: relative; margin: 0 30px 0 0; display: block; } .fd-header .mdl-layout__header-row .fd-search-bar .fd-icon-close, .fd-header .mdl-layout__header-row .fd-search-bar .fd-icon-reset { display: none; } .fd-header .mdl-layout__header-row .fd-search-bar label { display: none !important; } .fd-header .mdl-layout__header-row .fd-search-bar input { color: #1D3032 !important; font-size: 15px; font-family: "facitlight", "Open Sans", arial, sans-serif !important; height: 30px; line-height: 20px; width: 100%; } .fd-header .mdl-layout__header-row .fd-search-bar input::-webkit-input-placeholder { color: #999999; font-family: "facitlight", "Open Sans", arial, sans-serif; opacity: 1; } .fd-header .mdl-layout__header-row .fd-search-bar input::-moz-placeholder { color: #999999; font-family: "facitlight", "Open Sans", arial, sans-serif; opacity: 1; } .fd-header .mdl-layout__header-row .fd-search-bar input:-ms-input-placeholder { color: #999999; font-family: "facitlight", "Open Sans", arial, sans-serif; opacity: 1; } .fd-header .mdl-layout__header-row .fd-search-bar input:-moz-placeholder { color: #999999; font-family: "facitlight", "Open Sans", arial, sans-serif; opacity: 1; } .fd-header .mdl-layout__header-row .fd-search-bar input:focus { border-bottom: 1px solid #007136; color: #1D3032 !important; -webkit-tap-highlight-color: transparent !important; -webkit-focus-ring-color: transparent !important; outline: none !important; } .fd-header .mdl-layout__header-row .fd-search-bar .suggestion-list { z-index: 11; display: none; height: 300px; overflow: auto; position: absolute; top: 50px; left: 0; width: 100%; background-color: #FFFFFF; } .fd-header .mdl-layout__header-row .fd-search-bar .suggestion-list ul { padding: 30px 20px 0 20px; } .fd-header .mdl-layout__header-row .fd-search-bar .suggestion-list ul li { display: block; padding: 0 0 15px 0; } .fd-header .mdl-layout__header-row .fd-search-bar .suggestion-list ul li .fd-focus { display: block; color: #5bba6f; font-family: "facitregular", "Open Sans", arial, sans-serif; padding: 0 0 15px 0; } .fd-header .mdl-layout__header-row .fd-search-bar .suggestion-list ul li a { color: #1D3032; font-family: "facitlight", "Open Sans", arial, sans-serif; font-size: 16px; } @media all and (max-width: 839px) { .fd-header .mdl-layout__header-row .fd-search-bar .suggestion-list ul li a { font-size: 15px; } } .fd-header .mdl-layout__header-row .fd-search-bar .suggestion-list ul li a:hover { color: #0D5C63; } .fd-header .mdl-layout__header-row .fd-search-bar .suggestion-list ul li ul { padding: 0 0 15px 0; } @media all and (max-width: 839px) { .fd-header .mdl-layout__header-row .fd-search-bar { z-index: 999; top: 0; left: 0; width: 100%; position: absolute; background-color: #FFFFFF; margin: 0; padding: 0; height: 64px; display: none; box-shadow: 0 5px 5px -5px rgba(0, 0, 0, 0.7); } .fd-header .mdl-layout__header-row .fd-search-bar input { display: block; position: absolute; top: 10px; left: 0; right: 0; width: 75%; border-bottom: 0; font-size: 17px; margin: auto; height: 40px; line-height: 20px; } .fd-header .mdl-layout__header-row .fd-search-bar input:focus { border-bottom: 0; } .fd-header .mdl-layout__header-row .fd-search-bar .fd-icon-close, .fd-header .mdl-layout__header-row .fd-search-bar .fd-icon-reset { position: relative; display: block; float: left; width: 40px; height: 40px; top: 10px; left: 0; border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; text-align: center; } .fd-header .mdl-layout__header-row .fd-search-bar .fd-icon-close:hover, .fd-header .mdl-layout__header-row .fd-search-bar .fd-icon-reset:hover { background-color: #e3ebed; opacity: 1; filter: alpha(opacity=100); } .fd-header .mdl-layout__header-row .fd-search-bar .fd-icon-reset { left: inherit; right: 0; float: right; } .fd-header .mdl-layout__header-row .fd-search-bar .suggestion-list { top: 64px; height: 500px; } .fd-header .mdl-layout__header-row .fd-search-bar .suggestion-list ul { width: 75%; margin: auto; padding: 30px 0 0 0; } .fd-header .mdl-layout__header-row .fd-search-bar .suggestion-list ul ul { width: auto; } } .fd-header .mdl-layout__header-row .fd-icon-search { display: none; } @media all and (max-width: 839px) { .fd-header .mdl-layout__header-row .fd-icon-search { display: block; } } .fd-header .mdl-layout__header-row .mdl-layout-title { color: #1D3032; font-family: "facitsemibold", "Open Sans", arial, sans-serif; letter-spacing: -0.5px; text-transform: uppercase; font-size: 16px; line-height: 20px; padding: 0 0 0 30px; } @media all and (max-width: 1280px) { .fd-header .mdl-layout__header-row .mdl-layout-title { display: none; } } .fd-header .mdl-layout__header-row .mdl-layout-title a { color: #00A258; } .fd-header .mdl-layout__header-row .mdl-layout-title a:hover { opacity: 0.8; filter: alpha(opacity=80); } .fd-header .mdl-layout__header-row .mdl-layout-title .fd-pipe { padding: 0 10px; } .fd-header .mdl-layout__header-row .mdl-layout-title strong { text-transform: none; color: #00A258; } .fd-header .mdl-layout__header-row .fd-icon-user { position: relative; } .fd-header .mdl-layout__header-row .fd-alert .fd-icon-alert { width: 35px; height: 50px; margin-right: 10px; } @media all and (max-width: 640px) { .fd-header .mdl-layout__header-row .fd-alert .fd-icon-alert { margin-right: 5px; } } @media all and (max-width: 320px) { .fd-header .mdl-layout__header-row .fd-alert .fd-icon-alert { margin-right: 0; } } .fd-header .mdl-layout__header-row .fd-alert .fd-icon-alert .mdl-badge::after { color: #FFFFFF; background-color: #d50000; width: 18px; height: 18px; font-family: "facitsemibold", "Open Sans", arial, sans-serif; } .fd-header .mdl-layout__header-row .fd-alert .fd-menu-alert { width: 600px; background-color: #FFFFFF; z-index: 999; position: absolute; top: 80px; right: 33px; display: none; } @media all and (max-width: 840px) { .fd-header .mdl-layout__header-row .fd-alert .fd-menu-alert { top: 0; left: 0; width: 100%; float: left; background-color: #FFFFFF; } } .fd-header .mdl-layout__header-row .fd-alert .fd-menu-alert .fd-pic { color: transparent; border-style: dashed dashed solid; border-width: 0 45px 45px; position: absolute; right: 6.5px; z-index: 1; height: 0; width: 0; animation: gb__a 0.2s; border-bottom-color: #FFFFFF; top: -8px; } @media all and (max-width: 840px) { .fd-header .mdl-layout__header-row .fd-alert .fd-menu-alert .fd-pic { display: none; } } .fd-header .mdl-layout__header-row .fd-alert .fd-menu-alert .fd-tic { color: transparent; border-color: transparent; border-bottom-color: #FFFFFF; border-style: dashed dashed solid; border-width: 0 45px 45px; display: block; position: absolute; right: 6.5px; top: -9px; z-index: 1; height: 0; width: 0; animation: gb__a 0.2s; border-bottom-color: #FFFFFF; } @media all and (max-width: 840px) { .fd-header .mdl-layout__header-row .fd-alert .fd-menu-alert .fd-tic { display: none; } } .fd-header .mdl-layout__header-row .fd-alert .fd-menu-alert .fd-head { width: 100%; } @media all and (max-width: 840px) { .fd-header .mdl-layout__header-row .fd-alert .fd-menu-alert .fd-head { height: 64px; box-shadow: 0px 2px 4px #c7c7c7; margin-bottom: 3px; } } .fd-header .mdl-layout__header-row .fd-alert .fd-menu-alert .fd-head h2 { color: #0D5C63; font-family: "facitsemibold", "Open Sans", arial, sans-serif; font-size: 20px; line-height: 25px; padding: 15px; border-bottom: 1px solid #e1e1e5; } @media all and (max-width: 840px) { .fd-header .mdl-layout__header-row .fd-alert .fd-menu-alert .fd-head h2 { border-bottom: 0; padding: 20px 10px 0 20px; } } .fd-header .mdl-layout__header-row .fd-alert .fd-menu-alert .fd-head .fd-icon-close { display: block; position: relative; display: block; float: left; width: 40px; height: 40px; top: 12px; left: -6px; border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; text-align: center; margin: 0 10px; } .fd-header .mdl-layout__header-row .fd-alert .fd-menu-alert .fd-head .fd-icon-close:hover { background-color: #e3ebed; opacity: 1; filter: alpha(opacity=100); } @media all and (min-width: 840px) { .fd-header .mdl-layout__header-row .fd-alert .fd-menu-alert .fd-head .fd-icon-close { display: none; } } .fd-header .mdl-layout__header-row .fd-alert .fd-menu-alert ul li { display: block; } .fd-header .mdl-layout__header-row .fd-alert .fd-menu-alert ul li a { position: relative; padding: 15px; border-bottom: 1px solid #e1e1e5; } .fd-header .mdl-layout__header-row .fd-alert .fd-menu-alert ul li a .material-icons { display: block; position: absolute; right: 10px; top: 37%; } .fd-header .mdl-layout__header-row .fd-alert .fd-menu-alert ul li a:hover { background-color: #f4f4f9; } .fd-header .mdl-layout__header-row .fd-alert .fd-menu-alert ul li .fd-icon { display: block; float: left; width: 35px; margin: 0 20px 0 0; } .fd-header .mdl-layout__header-row .fd-alert .fd-menu-alert ul li .fd-int { display: block; float: left; overflow: hidden; width: 500px; } @media all and (max-width: 840px) { .fd-header .mdl-layout__header-row .fd-alert .fd-menu-alert ul li .fd-int { width: 80%; } } .fd-header .mdl-layout__header-row .fd-alert .fd-menu-alert ul li .fd-int h3 { color: #0D5C63; font-size: 18px; line-height: 22px; padding: 0 0 5px 0; font-family: "facitsemibold", "Open Sans", arial, sans-serif; } .fd-header .mdl-layout__header-row .fd-alert .fd-menu-alert ul li .fd-int p { line-height: 20px; font-size: 14px; } /* menu user */ .fd-menu-user { top: 10px; right: 15px; width: 300px; height: auto; max-height: 435px; overflow: auto; background-color: #FFFFFF; position: absolute; z-index: 999; display: none; } @media all and (max-width: 839px) { .fd-menu-user { width: 250px; top: 0; right: -300px; min-height: 100%; height: 100%; overflow: hidden; } } .fd-menu-user .fd-ico-close { display: none; } @media all and (max-width: 839px) { .fd-menu-user .fd-ico-close { display: block; float: right; padding: 13px 0 0 0; font-size: 34.5px; } .fd-menu-user .fd-ico-close a { color: #00A258; } .fd-menu-user .fd-ico-close a:hover { opacity: 0.8; filter: alpha(opacity=80); } } .fd-menu-user ul { float: left; width: 100%; } .fd-menu-user ul li { line-height: 20px; padding: 15px 15px 15px 25px; } .fd-menu-user ul li a { color: #1D3032; font-size: 16px; } @media all and (max-width: 839px) { .fd-menu-user ul li a { font-size: 15px; } } .fd-menu-user ul li a:hover { color: #0D5C63; } .fd-menu-user ul li:hover, .fd-menu-user ul li:focus { background-color: transparent; } .fd-menu-user .fd-section { float: left; width: 100%; padding: 10px 20px; font-size: 14px !important; color: #00A258; cursor: default; line-height: 20px; border-bottom: 1px solid #e1e1e5; } .fd-menu-user .fd-section i { margin: 10px 10px 0 0; display: block; float: left; font-size: 33px; } .fd-menu-user .fd-section span { margin: 7px 0 0 0; display: block; float: left; } .fd-menu-user .fd-section span b { font-size: 15px !important; } .fd-menu-user .fd-section div.user-info-status { clear: both; } .fd-menu-user .fd-section div.user-info-status span { height: 20px; } .fd-menu-user .fd-section div.user-info-status .otp-status-data-btn { float: right; margin-right: 28px; border-radius: 50%; min-width: 28px; min-height: 28px; bottom: 6px; padding: 0 6px; } .fd-menu-user .fd-section div.user-info-status .otp-status-data-btn i { font-size: 16px; margin: 0px 0px; color: #999999; } .fd-menu-user .fd-esc { padding: 15px 20px; float: left; width: 100%; border-top: 1px solid #e1e1e5; line-height: 34px; } .fd-menu-user .fd-esc a { font-size: 16px; color: #1D3032; } .fd-menu-user .fd-esc a:hover { color: #0D5C63; } .fd-menu-user .fd-esc a i { margin: 0 10px 0 0; display: block; float: left; font-size: 33px; } /* menu */ .fd-menu-container { min-height: 100%; height: 100%; font-family: "facitregular", "Open Sans", arial, sans-serif; z-index: 999; position: fixed; display: block; display: none; } @media all and (min-width: 1281px) { .fd-menu-container { display: block; width: 230px; top: 64px; left: 0 !important; } .fd-menu-container .fd-toolbar { display: none; } } @media all and (max-width: 1280px) { .fd-menu-container { display: block; left: -300px; width: 270px; top: 0; box-shadow: 0px 8px 6px 6px rgba(0, 0, 0, 0.7); } .fd-menu-container .fd-toolbar { display: block; background-color: #FFFFFF; height: 64px; } .fd-menu-container .fd-toolbar .fd-logo { float: left; display: block; height: 64px; width: 220px; overflow: hidden; text-align: center; } .fd-menu-container .fd-toolbar .fd-logo img { max-height: 64px; max-width: 220px; padding: 10px; } .fd-menu-container .fd-toolbar .fd-ico-close { display: block; float: right; padding: 13px 20px 0 0; font-size: 34.5px; } .fd-menu-container .fd-toolbar .fd-ico-close a { color: #00A258; } .fd-menu-container .fd-toolbar .fd-ico-close a:hover { opacity: 0.8; filter: alpha(opacity=80); } } .fd-menu-container .fd-navigation { float: left; width: 100%; background-color: #1d3032; min-height: 100%; height: 100%; padding: 20px 0; } .fd-menu-container .fd-navigation .fd-menu { float: left; width: 100%; padding: 0 0 80px 0; } .fd-menu-container .fd-navigation .fd-menu > li { float: left; display: block; width: 94%; padding: 12px 0; margin: 0 0 0 3%; background: url('back-sep-menu-list.png') right bottom no-repeat; background-size: 179px 1px; } @media all and (max-width: 1280px) { .fd-menu-container .fd-navigation .fd-menu > li { background-size: 198px 1px; width: 90%; margin: 0 0 0 5%; } } .fd-menu-container .fd-navigation .fd-menu > li > a { width: 100%; display: table; line-height: 20px; color: #E4E4E4; height: 30px; } .fd-menu-container .fd-navigation .fd-menu > li > a .fd-label { display: table-cell; vertical-align: middle; font-size: 16px; } .fd-menu-container .fd-navigation .fd-menu > li > a .fd-icon { width: 37px; display: table-cell; vertical-align: middle; } @media all and (max-width: 1280px) { .fd-menu-container .fd-navigation .fd-menu > li > a .fd-icon { width: 44px; } } .fd-menu-container .fd-navigation .fd-menu > li > a .fd-icon.fd-home { background: url('back-ico-home-off.png') center left no-repeat; background-size: 28px 28px !important; } .fd-menu-container .fd-navigation .fd-menu > li > a .fd-icon.fd-prod { background: url('back-ico-menu-prod-off.png') center left no-repeat; background-size: 28px 28px !important; } .fd-menu-container .fd-navigation .fd-menu > li > a .fd-icon.fd-pay { background: url('back-ico-menu-pay-off.png') center left no-repeat; background-size: 28px 28px !important; } .fd-menu-container .fd-navigation .fd-menu > li > a .fd-icon.fd-help { background: url('back-ico-menu-help-off.png') center left no-repeat; background-size: 28px 28px !important; } .fd-menu-container .fd-navigation .fd-menu > li > a .fd-icon.fd-prod-findo { background: url('back-ico-menu-prod-findo-on.png') center left no-repeat; background-size: 28px 28px !important; } .fd-menu-container .fd-navigation .fd-menu > li > a .fd-arrow { float: right; display: block; width: 30px; } .fd-menu-container .fd-navigation .fd-menu > li > a .fd-arrow i { text-align: right; display: block; font-size: 30px; font-weight: 800; } .fd-menu-container .fd-navigation .fd-menu > li > a .fd-arrow.fd-rotate-down { animation-name: out; animation-duration: 0.5s; animation-fill-mode: forwards; /* Safari and Chrome: */ -webkit-animation-name: out; -webkit-animation-duration: 0.5s; -webkit-animation-fill-mode: forwards; } .fd-menu-container .fd-navigation .fd-menu > li > a .fd-arrow.fd-rotate-up { animation-name: in; animation-duration: 0.5s; animation-fill-mode: forwards; /* Safari and Chrome: */ -webkit-animation-name: in; -webkit-animation-duration: 0.5s; -webkit-animation-fill-mode: forwards; } @keyframes in { from { transform: rotate(0deg); } to { transform: rotate(180deg); } } @keyframes out { from { transform: rotate(180deg); } to { transform: rotate(0deg); } } .fd-menu-container .fd-navigation .fd-menu > li > a:hover { color: #FFFFFF !important; } .fd-menu-container .fd-navigation .fd-menu > li > a:hover .fd-icon.fd-home { background: url('back-ico-home-on.png') center left no-repeat; } .fd-menu-container .fd-navigation .fd-menu > li > a:hover .fd-icon.fd-prod { background: url('back-ico-menu-prod-on.png') center left no-repeat; } .fd-menu-container .fd-navigation .fd-menu > li > a:hover .fd-icon.fd-pay { background: url('back-ico-menu-pay-on.png') center left no-repeat; } .fd-menu-container .fd-navigation .fd-menu > li > a:hover .fd-icon.fd-help { background: url('back-ico-menu-help-on.png') center left no-repeat; } .fd-menu-container .fd-navigation .fd-menu > li > a:hover .fd-icon.fd-prod-findo { background: url('back-ico-menu-prod-findo-on.png') center left no-repeat; } .fd-menu-container .fd-navigation .fd-menu > li > a:hover .fd-arrow { color: #FFFFFF !important; } .fd-menu-container .fd-navigation .fd-menu > li > a.fd-focus { color: #00A258; } .fd-menu-container .fd-navigation .fd-menu > li ul { display: none; width: 179px; float: right; } @media all and (max-width: 1280px) { .fd-menu-container .fd-navigation .fd-menu > li ul { width: 199px; } } .fd-menu-container .fd-navigation .fd-menu > li ul li { display: block; padding: 7px 0; border-bottom: 1px solid #2f4042; } .fd-menu-container .fd-navigation .fd-menu > li ul li:last-child { border: 0; } .fd-menu-container .fd-navigation .fd-menu > li ul li a { display: block; line-height: 20px; color: #E4E4E4; font-size: 14px; } .fd-menu-container .fd-navigation .fd-menu > li ul li a:hover, .fd-menu-container .fd-navigation .fd-menu > li ul li a.fd-active { color: #FFFFFF; } .fd-menu-container .fd-navigation .fd-menu > li ul li a span { display: block; line-height: 16px; } /* menu sticky */ .fd-sticky-bar-container { min-height: 100%; height: 100%; width: 80px; position: fixed; font-family: "facitregular", "Open Sans", arial, sans-serif; top: 64px; left: 0; z-index: 99; } @media all and (max-width: 840px) { .fd-sticky-bar-container { display: none; } } @media all and (min-width: 841px) { .fd-sticky-bar-container { display: block; } } @media all and (min-width: 1281px) { .fd-sticky-bar-container { display: none; } } .fd-sticky-bar-container .fd-navigation-sticky { background-color: #1d3032; width: 100%; min-height: 100%; height: 100%; } .fd-sticky-bar-container .fd-navigation-sticky .fd-menu-sticky { float: left; width: 100%; padding: 30px 0; } .fd-sticky-bar-container .fd-navigation-sticky .fd-menu-sticky li { float: left; display: block; width: 100%; text-align: center; padding: 0 0 30px 0; } .fd-sticky-bar-container .fd-navigation-sticky .fd-menu-sticky li a { width: 100%; display: block; line-height: 20px; color: #E4E4E4; } .fd-sticky-bar-container .fd-navigation-sticky .fd-menu-sticky li a .fd-label { display: block; font-size: 10.3448275862px; line-height: 12.5px; text-transform: uppercase; } .fd-sticky-bar-container .fd-navigation-sticky .fd-menu-sticky li a .fd-icon { width: 30px; height: 30px; display: block; margin: 0 auto 10px auto; } .fd-sticky-bar-container .fd-navigation-sticky .fd-menu-sticky li a .fd-icon.fd-home { background: url('back-ico-home-off.png') center left no-repeat; background-size: 30px 30px !important; } .fd-sticky-bar-container .fd-navigation-sticky .fd-menu-sticky li a .fd-icon.fd-prod { background: url('back-ico-menu-prod-off.png') center left no-repeat; background-size: 30px 30px !important; } .fd-sticky-bar-container .fd-navigation-sticky .fd-menu-sticky li a .fd-icon.fd-pay { background: url('back-ico-menu-pay-off.png') center left no-repeat; background-size: 30px 30px !important; } .fd-sticky-bar-container .fd-navigation-sticky .fd-menu-sticky li a .fd-icon.fd-help { background: url('back-ico-menu-help-off.png') center left no-repeat; background-size: 30px 30px !important; } .fd-sticky-bar-container .fd-navigation-sticky .fd-menu-sticky li a .fd-icon.fd-prod-findo { background: url('back-ico-menu-prod-findo-on.png') center left no-repeat; background-size: 30px 30px !important; } .fd-sticky-bar-container .fd-navigation-sticky .fd-menu-sticky li a:hover, .fd-sticky-bar-container .fd-navigation-sticky .fd-menu-sticky li a.fd-active { color: #FFFFFF !important; } .fd-sticky-bar-container .fd-navigation-sticky .fd-menu-sticky li a:hover .fd-icon.fd-home, .fd-sticky-bar-container .fd-navigation-sticky .fd-menu-sticky li a.fd-active .fd-icon.fd-home { background: url('back-ico-home-on.png') center left no-repeat; } .fd-sticky-bar-container .fd-navigation-sticky .fd-menu-sticky li a:hover .fd-icon.fd-prod, .fd-sticky-bar-container .fd-navigation-sticky .fd-menu-sticky li a.fd-active .fd-icon.fd-prod { background: url('back-ico-menu-prod-on.png') center left no-repeat; } .fd-sticky-bar-container .fd-navigation-sticky .fd-menu-sticky li a:hover .fd-icon.fd-pay, .fd-sticky-bar-container .fd-navigation-sticky .fd-menu-sticky li a.fd-active .fd-icon.fd-pay { background: url('back-ico-menu-pay-on.png') center left no-repeat; } .fd-sticky-bar-container .fd-navigation-sticky .fd-menu-sticky li a:hover .fd-icon.fd-help, .fd-sticky-bar-container .fd-navigation-sticky .fd-menu-sticky li a.fd-active .fd-icon.fd-help { background: url('back-ico-menu-help-on.png') center left no-repeat; } .fd-sticky-bar-container .fd-navigation-sticky .fd-menu-sticky li a:hover .fd-icon.fd-prod-findo, .fd-sticky-bar-container .fd-navigation-sticky .fd-menu-sticky li a.fd-active .fd-icon.fd-prod-findo { background: url('back-ico-menu-prod-findo-on.png') center left no-repeat; } .fd-sticky-bar-container .fd-navigation-sticky .fd-menu-sticky li a.focus { color: #00A258; } /* container */ .fd-content-container { float: left; width: 100%; padding-left: 230px; position: relative; } @media all and (max-width: 1280px) { .fd-content-container { padding-left: 80px; } } @media all and (max-width: 840px) { .fd-content-container { padding: 0; } } .fd-content-container.fd-nolog { padding-left: 0 !important; } .fd-content-container.fd-nolog .fd-title-bar.fd-bar-sticky { left: 0 !important; } .fd-content-container.fd-nolog .fd-title-bar.fd-short { min-height: 100px; } @media all and (max-width: 1280px) { .fd-content-container.fd-nolog .fd-title-bar.fd-short { min-height: 100px; } } @media all and (max-width: 640px) { .fd-content-container.fd-nolog .fd-title-bar.fd-short { min-height: 70px; } } .fd-content-container.fd-bg-green { background-color: #5bba6f; } .fd-content-container.fd-bg-hp { background: #00A258 url('back-border-box.png') bottom left repeat-x; } .fd-content-container.fd-bg-hp .fd-title-bar { background-color: #00A258 !important; min-height: 80px; } @media all and (min-width: 840px) { .fd-content-container.fd-bg-hp .fd-title-bar { min-height: 110px; } } .fd-content-container.fd-bg-hp .fd-title-bar.fd-bar-sticky { min-height: 60px; } @media all and (max-width: 640px) { .fd-content-container.fd-bg-hp .fd-title-bar.fd-bar-sticky { min-height: 40px; } } .fd-bg-hp { background: #00A258 url('back-border-box.png') bottom left repeat-x; } .fd-bg-hp .fd-title-bar { background-color: #00A258 !important; min-height: 80px; } @media all and (min-width: 840px) { .fd-bg-hp .fd-title-bar { min-height: 110px; } } .fd-bg-hp .fd-title-bar.fd-bar-sticky { min-height: 60px; } @media all and (max-width: 640px) { .fd-bg-hp .fd-title-bar.fd-bar-sticky { min-height: 40px; } } .fd-title-bar { min-height: 190px; background-color: #5bba6f; } @media all and (max-width: 1280px) { .fd-title-bar { min-height: 250px; } } @media all and (max-width: 640px) { .fd-title-bar { min-height: 195px; } } .fd-title-bar.fd-bg-carta, .fd-title-bar.fd-orange { background-color: #ED6728; } .fd-title-bar.fd-bg-carta .fd-bubble.zoom-in, .fd-title-bar.fd-orange .fd-bubble.zoom-in { background-color: #ED6728; } .fd-title-bar.fd-bg-carta .fd-bubble-txt span, .fd-title-bar.fd-orange .fd-bubble-txt span { background-color: #ED6728; } .fd-title-bar.fd-bg-conto-bancario { background-color: #00797b; } .fd-title-bar.fd-green { background-color: #90BF21; } .fd-title-bar.fd-light-blue { background-color: #63b7bf; } .fd-title-bar.fd-bg-carta-findopay { background-color: #F59E01; } .fd-title-bar.fd-bg-prestito, .fd-title-bar.fd-sky { background-color: #009FE3; } .fd-title-bar.fd-bg-prestito .fd-bubble.zoom-in, .fd-title-bar.fd-sky .fd-bubble.zoom-in { background-color: #009FE3; } .fd-title-bar.fd-bg-prestito .fd-bubble-txt span, .fd-title-bar.fd-sky .fd-bubble-txt span { background-color: #009FE3; } .fd-title-bar.fd-bg-cessione { background-color: #006BB3; } .fd-title-bar.fd-bg-cessione .fd-bubble.zoom-in { background-color: #006BB3; } .fd-title-bar.fd-bg-cessione .fd-bubble-txt span { background-color: #006BB3; } .fd-title-bar.fd-bg-conto { background-color: #E24f83; } .fd-title-bar.fd-bg-conto .fd-bubble.zoom-in { background-color: #E24f83; } .fd-title-bar.fd-bg-conto .fd-bubble-txt span { background-color: #E24f83; } .fd-title-bar.fd-bg-polizza-libera { background-color: #63b7bf; } .fd-title-bar.fd-bg-polizza-libera .fd-bubble.zoom-in { background-color: #63b7bf; } .fd-title-bar.fd-bg-polizza-libera .fd-bubble-txt span { background-color: #63b7bf; } .fd-title-bar.fd-bg-prodotti { background-color: #90BF21; } .fd-title-bar.fd-bg-prodotti .fd-bubble.zoom-in { background-color: #90BF21; } .fd-title-bar.fd-bg-prodotti .fd-bubble-txt span { background-color: #90BF21; } @media all and (max-width: 1280px) { .fd-title-bar.fd-flow { min-height: 250px; } } @media all and (max-width: 840px) { .fd-title-bar.fd-flow { min-height: 190px; } } @media all and (max-width: 640px) { .fd-title-bar.fd-flow { min-height: 155px; } } .fd-title-bar.fd-short { min-height: 170px; } @media all and (max-width: 1280px) { .fd-title-bar.fd-short { min-height: 170px; } } @media all and (max-width: 640px) { .fd-title-bar.fd-short { min-height: 140px; } } .fd-title-bar.fd-bar-sticky { top: -64px; left: 230px; position: fixed; width: 100%; min-height: 60px; overflow: hidden; z-index: 555; } @media all and (max-width: 1280px) { .fd-title-bar.fd-bar-sticky { left: 80px; min-height: 60px; } } @media all and (max-width: 840px) { .fd-title-bar.fd-bar-sticky { min-height: 60px; left: 0; } } @media all and (max-width: 640px) { .fd-title-bar.fd-bar-sticky { min-height: 40px; } } .fd-title-bar.fd-bar-sticky .fd-header-title { padding: 10px 10px 10px 33px; } @media all and (max-width: 1280px) { .fd-title-bar.fd-bar-sticky .fd-header-title { padding: 10px 10px 10px 23px; } } @media all and (max-width: 640px) { .fd-title-bar.fd-bar-sticky .fd-header-title { padding: 10px; } } .fd-title-bar.fd-bar-sticky .fd-header-title h1 { font-size: 34.5px; line-height: 40px; padding: 0; } @media all and (max-width: 1180px) { .fd-title-bar.fd-bar-sticky .fd-header-title h1 { width: 100%; } } @media all and (max-width: 640px) { .fd-title-bar.fd-bar-sticky .fd-header-title h1 { font-size: 27px; line-height: 24px; padding: 0; } } .fd-title-bar .fd-nav { background: url('back-transparent.png') top left repeat; width: 100%; height: 40px; } @media all and (min-width: 1281px) { .fd-title-bar .fd-nav { display: none; } } .fd-title-bar .fd-nav .mdl-layout-title { font-family: "facitregular", "Open Sans", arial, sans-serif; letter-spacing: -0.5px; text-transform: uppercase; font-size: 15px; line-height: 20px; padding: 10px 30px; color: #FFFFFF; } @media all and (max-width: 840px) { .fd-title-bar .fd-nav .mdl-layout-title { padding: 10px 10px 10px 20px; } } @media all and (max-width: 640px) { .fd-title-bar .fd-nav .mdl-layout-title { padding: 10px 10px 10px 13px; } } .fd-title-bar .fd-nav .mdl-layout-title a { color: #FFFFFF; font-family: "facitlight", "Open Sans", arial, sans-serif; } .fd-title-bar .fd-header-title { position: relative; padding: 20px 20px 20px 30px; } @media all and (max-width: 840px) { .fd-title-bar .fd-header-title { padding: 20px 10px 20px 20px; } } @media all and (max-width: 640px) { .fd-title-bar .fd-header-title { padding: 20px 10px 20px 13px; } } .fd-title-bar .fd-header-title h1 { letter-spacing: 0 !important; display: block; float: left; font-family: "league_gothicregular", "Open Sans", arial, sans-serif; font-size: 49.5px; line-height: 44px; color: #FFFFFF; text-transform: uppercase; padding: 0 0 20px 0; } @media all and (max-width: 1180px) { .fd-title-bar .fd-header-title h1 { width: 80%; } } @media all and (max-width: 640px) { .fd-title-bar .fd-header-title h1 { font-size: 31.5px; line-height: 28px; padding: 0 0 10px 0; } } .fd-title-bar .fd-header-title h1 a { color: #FFFFFF; } .fd-title-bar .fd-header-title h1 a:hover { opacity: 0.8; filter: alpha(opacity=80); } .fd-title-bar .fd-header-title span { clear: both; display: block; font-family: "facitsemibold", "Open Sans", arial, sans-serif; font-size: 18px; letter-spacing: 0; line-height: 20px; color: #FFFFFF; text-transform: none; } .fd-title-bar .fd-header-title .fd-menu-product button { position: inherit; top: inherit; right: inherit; display: block; float: right; color: #FFFFFF; min-width: 50px; min-height: 50px; width: 50px; height: 50px; text-align: center; padding: 0; } @media all and (max-width: 640px) { .fd-title-bar .fd-header-title .fd-menu-product button { margin-top: -10px; } } .fd-title-bar .fd-header-title .fd-menu-product button i { display: block; font-size: 39px; margin: auto; } .fd-title-bar .fd-header-title .fd-menu-product button:hover { background: url('back-transparent.png') top center; } .fd-title-bar .fd-header-title .fd-menu-product .fd-menu-product-ctn { right: 10px; top: 50px; } @media all and (min-width: 1281px) { .fd-title-bar .fd-header-title .fd-menu-product .fd-menu-product-ctn { top: 75px; } } .fd-title-bar .fd-bubble { display: none; background: url('back-transparent.png') center center; width: 300px; height: 300px; position: absolute; top: -150px; right: -30px; z-index: 888; } @media all and (max-width: 1280px) { .fd-title-bar .fd-bubble { top: -130px; } } .fd-title-bar .fd-bubble.zoom-in { transition: 200ms ease-in-out all; transform: scale(1.5); } .fd-title-bar .fd-bubble.zoom-out { transition: 200ms ease-in-out; transform: scale(0.5); opacity: 0; } .fd-title-bar .fd-bubble-txt { display: none; z-index: 999; opacity: 1; position: absolute; top: 15px; right: 20px; width: 240px; text-align: left; } @media all and (max-width: 1280px) { .fd-title-bar .fd-bubble-txt { top: 50px; } } .fd-title-bar .fd-bubble-txt h2 { width: 200px; font-family: "facitregular", "Open Sans", arial, sans-serif; color: #FFFFFF; font-size: 17px; line-height: 20px; padding: 10px 0; text-transform: uppercase; } .fd-title-bar .fd-bubble-txt p { width: 200px; color: #FFFFFF; font-size: 14px; line-height: 17px; } .fd-title-bar .fd-bubble-txt span { text-align: center; display: block; margin: 10px auto 0 auto; color: #FFFFFF; min-width: 50px; min-height: 50px; width: 50px; height: 50px; position: absolute; top: 0; right: 0; } .fd-title-bar .fd-bubble-txt span i { display: block; font-size: 39px; line-height: 50px; margin: auto; } @keyframes leaves { 0% { transform: scale(1); opacity: 1; } 100% { transform: scale(1.2); opacity: 0.5; } } .fd-title-bar .fd-bubble-txt span.zoom-in { animation: leaves 2s ease-in-out infinite alternate; } .fd-title-bar .fd-link-tabs-hp { width: 100%; float: left; color: #FFFFFF; padding: 10px 0 0 0; border-bottom: 1px solid #FFFFFF; } @media all and (max-width: 640px) { .fd-title-bar .fd-link-tabs-hp { padding: 0; } } @media all and (min-width: 840px) { .fd-title-bar .fd-link-tabs-hp { padding: 20px 0 0 0; } } @media all and (max-width: 640px) { .fd-title-bar .fd-link-tabs-hp { border-bottom: 0; } } .fd-title-bar .fd-link-tabs-hp ul { display: block; float: right; width: auto; text-align: right; } @media all and (max-width: 640px) { .fd-title-bar .fd-link-tabs-hp ul { float: left; width: 100%; border-bottom: 1px solid #FFFFFF; } } @media all and (min-width: 1281px) { .fd-title-bar .fd-link-tabs-hp ul { width: auto; text-align: center; float: none; margin: auto; } } .fd-title-bar .fd-link-tabs-hp ul li { float: left; display: block; text-align: center; } @media all and (max-width: 640px) { .fd-title-bar .fd-link-tabs-hp ul li { width: 50%; } } @media all and (min-width: 1281px) { .fd-title-bar .fd-link-tabs-hp ul li { float: none; display: inline-block; } } .fd-title-bar .fd-link-tabs-hp a { display: block; position: relative; color: #FFFFFF; padding: 15px 60px 10px 20px; text-transform: uppercase; font-size: 17px; line-height: 20px; font-family: "facitsemibold", "Open Sans", arial, sans-serif; border-bottom: 5px solid transparent; } @media all and (max-width: 320px) { .fd-title-bar .fd-link-tabs-hp a { padding: 10px 50px 5px 10px; } } @media all and (max-width: 640px) { .fd-title-bar .fd-link-tabs-hp a { line-height: 15px; font-size: 15px; } } .fd-title-bar .fd-link-tabs-hp a br { display: none; } @media all and (max-width: 640px) { .fd-title-bar .fd-link-tabs-hp a br { display: block; } } .fd-title-bar .fd-link-tabs-hp a.fd-active { border-bottom: 5px solid #FFFFFF; } .fd-title-bar .fd-link-tabs-hp a .fd-tabs-number { display: block; position: absolute; right: 20px; bottom: 8px; background-color: #FFFFFF; width: 25px; height: 25px; color: #1D3032; font-size: 12px; font-family: "facitregular", "Open Sans", arial, sans-serif; line-height: 25px; } @media all and (max-width: 640px) { .fd-title-bar .fd-link-tabs-hp a .fd-tabs-number { bottom: 10px; } } @media all and (max-width: 320px) { .fd-title-bar .fd-link-tabs-hp a .fd-tabs-number { right: 10px; } } .fd-menu-product button { position: absolute; top: 5px; right: 5px; display: block; float: right; min-width: 50px; min-height: 50px; width: 50px; height: 50px; text-align: center; color: #0D5C63; } .fd-menu-product button i { display: block; font-size: 30px; margin: auto; } .fd-menu-product .fd-menu-product-ctn { display: none; position: absolute; background-color: #FFFFFF; z-index: 999; width: 250px; max-height: 395px; overflow: auto; } @media all and (max-width: 839px) { .fd-menu-product .fd-menu-product-ctn { max-width: 250px; } .fd-menu-product .fd-menu-product-ctn .material-icons { width: auto; } } .fd-menu-product .fd-menu-product-ctn .fd-menu-product-title-group { font-size: 12px; color: #999999; font-weight: 900; padding: 0px; } .fd-menu-product .fd-menu-product-ctn .fd-menu-product-title-group:hover { color: #999999; } .fd-menu-product .fd-menu-product-ctn .fd-section.fd-menu-product-no-spacing-li { border-top: 1px solid #e1e1e5; border-bottom: 0px; padding: 7px 0px; margin-top: 10px; } .fd-menu-product .fd-menu-product-ctn .material-icons { font-size: 17px; font-weight: 400; padding: 0px 16px 0px 0px; } .fd-menu-product .fd-menu-product-ctn .fd-menu-product-no-spacing-li { padding: 15px 0px 0px 0px; } .fd-menu-product .fd-menu-product-ctn .fd-menu-product-no-spacing-li div { line-height: 20px; } .fd-menu-product ul { padding-bottom: 10px; } .fd-menu-product ul li { line-height: 20px; padding: 20px 15px 0 15px; } .fd-menu-product ul li a { color: #5bba6f; font-family: "facitregular", "Open Sans", arial, sans-serif; font-size: 16px; } @media all and (max-width: 839px) { .fd-menu-product ul li a { font-size: 15px; } } .fd-menu-product ul li a:hover { color: #00A258; } .fd-menu-product ul li.fd-line { border-bottom: 1px solid #e1e1e5; padding-bottom: 10px; } .fd-menu-product ul li.fd-section { border-bottom: 1px solid #e1e1e5; padding-bottom: 10px; } .fd-menu-product ul li.fd-section a { font-size: 16px; color: #1D3032; } .fd-menu-product ul li.fd-section a:hover { color: #0D5C63; } .fd-content { max-width: 95%; padding: 0; display: flex; width: 100%; margin: 0 auto; flex-shrink: 0; } @media all and (min-width: 1281px) { .fd-content { max-width: 1050px; } } @media all and (min-width: 840px) { .fd-content.fd-login { max-width: 754px; } } .fd-content.fd-login .fd-card-above { margin-top: -60px; } @media all and (max-width: 640px) { .fd-content.fd-login .fd-card-above { margin-top: -40px; } } .fd-content.fd-login .mdl-card { padding: 10px; } @media all and (max-width: 640px) { .fd-content.fd-login .mdl-card { padding: 0; } } .fd-content.fd-login .mdl-card .mdl-card__supporting-text { padding-top: 0; padding-bottom: 0; } .fd-card-above { overflow: inherit; } .fd-card-above .mdl-card:first-child { min-height: 200px; } @media all and (min-width: 841px) { .fd-card-above { margin-top: -50px; } } @media all and (max-width: 840px) { .fd-card-above { margin-top: 0; } } .mdl-card { background-color: #FFFFFF; width: 100%; border: 1px solid #e1e1e5; min-height: inherit; position: relative; z-index: inherit; } .mdl-card.fd-card-focus { overflow: inherit; } @media all and (min-width: 1281px) { .mdl-card.fd-card-focus { margin-top: -40px; } } @media all and (max-width: 1280px) { .mdl-card.fd-card-focus { margin-top: -60px; } } @media all and (max-width: 640px) { .mdl-card.fd-card-focus { margin-top: -30px; } } .mdl-card.fd-card-focus .mdl-card__supporting-text { padding-top: 10px; padding-bottom: 10px; overflow: inherit; color: #1D3032; } .mdl-card.fd-card-focus .mdl-card__supporting-text.fd-ctn-data { padding: 0 16px 16px 16px !important; } .mdl-card.fd-card-focus .fd-icon-focus { display: block; width: 80px; height: 80px; float: left; background-color: #FFFFFF; margin-top: -30px; } .mdl-card.fd-card-focus .fd-icon-focus img { display: block; margin: 20px auto 0 auto; height: 54px; } .mdl-card.fd-card-focus p { display: block; float: left; font-family: "facitsemibold", "Open Sans", arial, sans-serif; line-height: 20px; padding: 0 0 0 20px; overflow: hidden; } .mdl-card.fd-card-focus p .fd-label { display: block; font-family: "facitlight", "Open Sans", arial, sans-serif; font-size: 14px; } .mdl-card.fd-card-above { overflow: inherit; } @media all and (min-width: 841px) { .mdl-card.fd-card-above { margin-top: -50px; } } @media all and (max-width: 840px) { .mdl-card.fd-card-above { margin-top: 0; } } .mdl-card.fd-card-special { overflow: inherit; } .mdl-card.fd-card-special.fd-orange, .mdl-card.fd-card-special.fd-sky, .mdl-card.fd-card-special.fd-green, .mdl-card.fd-card-special.fd-pink, .mdl-card.fd-card-special.fd-blue, .mdl-card.fd-card-special.fd-bg-conto, .mdl-card.fd-card-special.fd-bg-cessione, .mdl-card.fd-card-special.fd-light-blue { border-top: 0; border-bottom: 0; } .mdl-card.fd-card-special.fd-orange { border-left: 15px solid #ED6728; } .mdl-card.fd-card-special.fd-sky { border-left: 15px solid #009FE3; } .mdl-card.fd-card-special.fd-green { border-left: 15px solid #90BF21; } .mdl-card.fd-card-special.fd-light-blue { border-left: 15px solid #63b7bf; } .mdl-card.fd-card-special.fd-pink, .mdl-card.fd-card-special.fd-bg-conto { border-left: 15px solid #E24f83; } .mdl-card.fd-card-special.fd-blue, .mdl-card.fd-card-special.fd-bg-cessione { border-left: 15px solid #006BB3; } .mdl-card.fd-card-special .mdl-card__title { border-bottom: 1px solid #e1e1e5; } .mdl-card.fd-card-special .mdl-card__title a { color: #0D5C63; } .mdl-card.fd-card-special .mdl-card__title .mdl-card__title-text { text-transform: uppercase; padding: 0 35px; color: #0D5C63; } .mdl-card.fd-card-special .mdl-card__title .mdl-card__title-text.fd-other-category { padding: 0 35px 0 0; text-transform: none; } .mdl-card.fd-card-special .mdl-card__title .fd-icon { width: 35px; position: absolute; top: 10px; left: 10px; } .mdl-card.fd-card-special .fd-img { display: block; float: right; width: 70px; } .mdl-card.fd-card-special .fd-summary { padding: 0; line-height: 22px; } .mdl-card.fd-card-special .fd-summary span { display: inline; } .mdl-card.fd-card-special .fd-txt { padding-top: 10px; padding-bottom: 0; } .mdl-card.fd-card-special .mdl-card__supporting-text { padding-bottom: 0; } .mdl-card.fd-card-special .fd-menu-product .fd-menu-product-ctn { right: 5px; top: 55px; } .mdl-card.fd-alert .mdl-card__title { border-bottom: 1px solid #e1e1e5; } .mdl-card.fd-alert .mdl-card__title a { color: #d50000; } .mdl-card.fd-alert .mdl-card__title .mdl-card__title-text { color: #d50000; } .mdl-card.fd-card-lite { border: 0; background-color: transparent; } @media all and (max-width: 1280px) { .mdl-card.fd-card-lite { padding: 0 0 0 20px; } } @media all and (max-width: 840px) { .mdl-card.fd-card-lite { padding: 0; } } .mdl-card.fd-card-lite.fd-first { padding: 20px 0 0 0; } @media all and (max-width: 1280px) { .mdl-card.fd-card-lite.fd-first { padding: 20px 0 0 20px; } } @media all and (max-width: 840px) { .mdl-card.fd-card-lite.fd-first { padding: 0; } } .mdl-card.fd-card-lite.fd-external-title .mdl-card__title h2 { clear: both; font-family: "facitregular", "Open Sans", arial, sans-serif; overflow: inherit; padding: 20px 15px; color: #999999; font-size: 21px; line-height: 25px; } .mdl-card.fd-card-lite.fd-special-hp .mdl-card__title h2 { color: #FFFFFF; opacity: 0.8; filter: alpha(opacity=80); } .mdl-card.fd-card-lite.fd-special-hp .mdl-card__supporting-text p { color: #FFFFFF; opacity: 0.8; filter: alpha(opacity=80); } .mdl-card.fd-card-lite .mdl-card__title { padding: 15px 0 0 0; } .mdl-card.fd-card-lite .mdl-card__title h2 { clear: both; font-family: "facitregular", "Open Sans", arial, sans-serif; font-size: 26px; line-height: 25px; overflow: inherit; color: #0D5C63; } .mdl-card.fd-card-lite .mdl-card__supporting-text { padding: 15px 0 0 0; } @media all and (min-width: 841px) { .mdl-card.fd-card-lite .mdl-card__supporting-text { padding: 15px 50px 0 0; } } .mdl-card.fd-card-lite .mdl-card__supporting-text p { color: #999999; font-size: 14px; line-height: 19px; } .mdl-card.fd-card-lite .mdl-card__supporting-text p.fd-big { color: #0D5C63; font-size: 18px; line-height: 23px; padding: 40px 0 0 0; } @media all and (max-width: 840px) { .mdl-card.fd-card-lite .mdl-card__supporting-text p.fd-big { padding: 0; } } .mdl-card.fd-card-lite .mdl-card__actions { padding: 15px 0 0 0; } .mdl-card.fd-card-lite .mdl-card__actions .fd-step { float: left; width: 100%; } @media all and (min-width: 841px) { .mdl-card.fd-card-lite .mdl-card__actions .fd-step { background: transparent url('back-line-vert.png') 15px top no-repeat; } } @media all and (max-width: 840px) { .mdl-card.fd-card-lite .mdl-card__actions .fd-step { background: transparent url('back-line-orizz.png') left 19px no-repeat; } } .mdl-card.fd-card-lite .mdl-card__actions .fd-step li { float: left; display: block; height: 35px; padding: 2px 0 0 0; background-color: #f4f4f9; margin: 0 0 25px 0; } @media all and (max-width: 840px) { .mdl-card.fd-card-lite .mdl-card__actions .fd-step li { width: 43%; margin: 0; padding-left: 0; background-color: transparent; } .mdl-card.fd-card-lite .mdl-card__actions .fd-step li .fd-ctn-step { float: left; background-color: #f4f4f9; padding: 0 5px; } .mdl-card.fd-card-lite .mdl-card__actions .fd-step li:last-child { float: right; width: 77px; } } @media all and (min-width: 841px) { .mdl-card.fd-card-lite .mdl-card__actions .fd-step li { width: 100%; } } @media all and (max-width: 640px) { .mdl-card.fd-card-lite .mdl-card__actions .fd-step li { height: auto; width: 44%; margin: 0; padding-left: 0; } .mdl-card.fd-card-lite .mdl-card__actions .fd-step li .fd-ctn-step { background-color: transparent; padding: 0; } .mdl-card.fd-card-lite .mdl-card__actions .fd-step li:first-child { width: 42%; } .mdl-card.fd-card-lite .mdl-card__actions .fd-step li:first-child .fd-number { margin: 0; } .mdl-card.fd-card-lite .mdl-card__actions .fd-step li:last-child { width: 14% !important; } .mdl-card.fd-card-lite .mdl-card__actions .fd-step li:last-child .fd-ctn-step { float: right; } .mdl-card.fd-card-lite .mdl-card__actions .fd-step li:last-child .fd-number { margin: 0; } } .mdl-card.fd-card-lite .mdl-card__actions .fd-step li:last-child { margin: 0; } .mdl-card.fd-card-lite .mdl-card__actions .fd-step li .fd-number { display: block; float: left; width: 30px; height: 30px; text-align: center; line-height: 32px; font-size: 13px; color: #FFFFFF; background-color: #c7c7c7; font-family: "facitregular", "Open Sans", arial, sans-serif; } @media all and (max-width: 640px) { .mdl-card.fd-card-lite .mdl-card__actions .fd-step li .fd-number { margin: 0 0 0 15px; } } .mdl-card.fd-card-lite .mdl-card__actions .fd-step li .fd-number .material-icons { font-size: 16px; line-height: 30px; } .mdl-card.fd-card-lite .mdl-card__actions .fd-step li .fd-label { padding: 0 0 0 10px; display: block; float: left; color: #c3c3c7; font-size: 14px; line-height: 32px; } .mdl-card.fd-card-lite .mdl-card__actions .fd-step li .fd-label br { display: none; } @media all and (max-width: 840px) { .mdl-card.fd-card-lite .mdl-card__actions .fd-step li .fd-label { padding: 0 0 0 7px; } } @media all and (max-width: 640px) { .mdl-card.fd-card-lite .mdl-card__actions .fd-step li .fd-label { float: none; padding: 0 !important; } } .mdl-card.fd-card-lite .mdl-card__actions .fd-step li.fd-active .fd-number { background-color: #0D5C63; } .mdl-card.fd-card-lite .mdl-card__actions .fd-step li.fd-active .fd-label { color: #0D5C63; } @media all and (max-width: 840px) { .mdl-card.fd-card-lite .mdl-card__actions .fd-step.fd-for li { height: auto; width: 28.5%; margin: 0; padding-left: 0; } .mdl-card.fd-card-lite .mdl-card__actions .fd-step.fd-for li .fd-ctn-step { background-color: transparent; padding: 0; text-align: center; } .mdl-card.fd-card-lite .mdl-card__actions .fd-step.fd-for li:first-child { width: 29%; } .mdl-card.fd-card-lite .mdl-card__actions .fd-step.fd-for li:first-child .fd-number { margin: 0; } .mdl-card.fd-card-lite .mdl-card__actions .fd-step.fd-for li:first-child .fd-label { text-align: left; } .mdl-card.fd-card-lite .mdl-card__actions .fd-step.fd-for li:last-child { width: 14% !important; } .mdl-card.fd-card-lite .mdl-card__actions .fd-step.fd-for li:last-child .fd-ctn-step { float: right; } .mdl-card.fd-card-lite .mdl-card__actions .fd-step.fd-for li:last-child .fd-number { margin: 0; } .mdl-card.fd-card-lite .mdl-card__actions .fd-step.fd-for li:last-child .fd-label { text-align: right; } .mdl-card.fd-card-lite .mdl-card__actions .fd-step.fd-for li .fd-label { float: none; display: block; padding: 7px 0 0 0 !important; line-height: 15px !important; } .mdl-card.fd-card-lite .mdl-card__actions .fd-step.fd-for li .fd-label br { display: block; } .mdl-card.fd-card-lite .mdl-card__actions .fd-step.fd-for li .fd-number { margin: auto; float: none; } } .mdl-card.fd-card-promo { position: relative; } @media all and (min-width: 1281px) { .mdl-card.fd-card-promo { margin-top: -40px; } } @media all and (max-width: 1280px) { .mdl-card.fd-card-promo { margin-top: -30px; } } .mdl-card.fd-card-promo > .mdl-card__supporting-text, .mdl-card.fd-card-promo > fnd-card-body > .mdl-card__supporting-text { padding: 0; } .mdl-card.fd-card-promo.fd-element { margin-top: 0; } .mdl-card.fd-card-promo .mdl-card__title .mdl-card__title-text { display: block; font-family: "facitsemibold", "Open Sans", arial, sans-serif; text-transform: uppercase; color: #009FE3; font-size: 22.5px; margin: auto; } @media (min-width: 840px) { .mdl-card.fd-card-promo .mdl-card__title .mdl-card__title-text { margin: 0; } } .mdl-card.fd-card-promo .fd-promo-left { display: block; float: left; width: 100%; padding: 16px; } @media all and (min-width: 840px) { .mdl-card.fd-card-promo .fd-promo-left { width: 55%; } } @media all and (min-width: 1280px) { .mdl-card.fd-card-promo .fd-promo-left { width: 65%; } } @media all and (min-width: 840px) { .mdl-card.fd-card-promo .fd-promo-left.fd-small { width: 45%; } } @media all and (min-width: 1280px) { .mdl-card.fd-card-promo .fd-promo-left.fd-small { width: 35%; } } .mdl-card.fd-card-promo .fd-promo-left .fd-title { font-size: 19px; line-height: 20px; padding-bottom: 10px; font-family: "facitregular", "Open Sans", arial, sans-serif; color: #009FE3; } .mdl-card.fd-card-promo .fd-promo-left .fd-title.fd-sky { color: #009FE3; } .mdl-card.fd-card-promo .fd-promo-left .fd-title.fd-green { color: #90BF21; } .mdl-card.fd-card-promo .fd-promo-left .fd-title.fd-light-blue { color: #63b7bf; } .mdl-card.fd-card-promo .fd-promo-left .fd-title.fd-pink { color: #E24f83; } .mdl-card.fd-card-promo .fd-promo-left .fd-title.fd-blue { color: #006BB3; } .mdl-card.fd-card-promo .fd-promo-left .fd-title.fd-orange { color: #ED6728; } .mdl-card.fd-card-promo .fd-promo-left .fd-title.fd-petrol { color: #0D5C63; } .mdl-card.fd-card-promo .fd-promo-left .fd-title strong { display: block; font-family: "facitsemibold", "Open Sans", arial, sans-serif; font-size: 27px; line-height: 30px; padding-bottom: 7.5px; } @media all and (max-width: 640px) { .mdl-card.fd-card-promo .fd-promo-left .fd-title { font-size: 17px; line-height: 20px; } .mdl-card.fd-card-promo .fd-promo-left .fd-title strong { font-size: 22.5px; line-height: 24px; } } .mdl-card.fd-card-promo .fd-promo-left .fd-img { width: 100%; } @media all and (min-width: 840px) { .mdl-card.fd-card-promo .fd-promo-left .fd-info { position: absolute; bottom: -10px; left: 16px; } } .mdl-card.fd-card-promo .fd-promo-left .fd-info.fd-special { font-size: 14px; line-height: 20px; color: #0D5C63; } .mdl-card.fd-card-promo .fd-promo-left .fd-info.fd-special:hover { color: #44a1a0; } .mdl-card.fd-card-promo .fd-promo-right { position: relative; background-color: #f4f4f9; display: block; float: right; width: 100%; padding: 16px; border-top: 1px solid #e1e1e5; } @media all and (min-width: 840px) { .mdl-card.fd-card-promo .fd-promo-right { border-left: 1px solid #e1e1e5; width: 45%; min-height: 430px; } } @media all and (min-width: 1280px) { .mdl-card.fd-card-promo .fd-promo-right { width: 35%; border-top: 0; } } @media all and (min-width: 840px) { .mdl-card.fd-card-promo .fd-promo-right.fd-large { width: 55%; } } @media all and (min-width: 1280px) { .mdl-card.fd-card-promo .fd-promo-right.fd-large { width: 65%; } } .mdl-card.fd-card-promo .fd-promo-right .fd-txt ul { padding: 15px 15px 15px 18px; } @media (min-width: 840px) { .mdl-card.fd-card-promo .fd-promo-right .fd-txt ul { padding: 30px 15px 15px 15px; } } .mdl-card.fd-card-promo .fd-promo-right .fd-txt ul li { padding: 0 0 15px 0; } @media all and (min-width: 840px) { .mdl-card.fd-card-promo .fd-promo-right .fd-info { position: absolute; bottom: 0; left: 16px; } } .mdl-card.fd-card-promo .fd-promo-right .fd-img { width: 100%; } .mdl-card.fd-card-promo .fd-promo-amounts, .mdl-card.fd-card-promo .fd-promo-rate { display: block; float: left; width: 100%; } @media (min-width: 840px) { .mdl-card.fd-card-promo .fd-promo-amounts, .mdl-card.fd-card-promo .fd-promo-rate { width: 50%; } } .mdl-card.fd-card-promo .fd-promo-amounts p, .mdl-card.fd-card-promo .fd-promo-rate p { font-family: "league_gothicregular", "Open Sans", arial, sans-serif; width: 50%; display: block; float: left; text-transform: uppercase; } .mdl-card.fd-card-promo .fd-promo-amounts p span, .mdl-card.fd-card-promo .fd-promo-rate p span { display: inline-block; } .mdl-card.fd-card-promo .fd-promo-amounts p .fd-number, .mdl-card.fd-card-promo .fd-promo-rate p .fd-number { font-size: 60px; line-height: 76px; } @media (min-width: 1280px) { .mdl-card.fd-card-promo .fd-promo-amounts p .fd-number, .mdl-card.fd-card-promo .fd-promo-rate p .fd-number { font-size: 72px; line-height: 80px; } } .mdl-card.fd-card-promo .fd-promo-amounts p .fd-simbol, .mdl-card.fd-card-promo .fd-promo-rate p .fd-simbol { font-size: 37.5px; } @media (min-width: 1280px) { .mdl-card.fd-card-promo .fd-promo-amounts p .fd-simbol, .mdl-card.fd-card-promo .fd-promo-rate p .fd-simbol { font-size: 52.5px; } } .mdl-card.fd-card-promo .fd-promo-amounts p .fd-label, .mdl-card.fd-card-promo .fd-promo-rate p .fd-label { font-family: "facitsemibold", "Open Sans", arial, sans-serif; font-size: 15px; } @media (min-width: 1280px) { .mdl-card.fd-card-promo .fd-promo-amounts p .fd-label, .mdl-card.fd-card-promo .fd-promo-rate p .fd-label { font-size: 18px; } } .mdl-card.fd-card-promo .fd-promo-amounts.fd-promo-label, .mdl-card.fd-card-promo .fd-promo-rate.fd-promo-label { padding: 0 !important; } .mdl-card.fd-card-promo .fd-promo-amounts.fd-promo-label.fd-promo-amounts, .mdl-card.fd-card-promo .fd-promo-rate.fd-promo-label.fd-promo-amounts { width: 35% !important; border-right: 1px solid #e1e1e5; border-bottom: 0 !important; } .mdl-card.fd-card-promo .fd-promo-amounts.fd-promo-label.fd-promo-rate, .mdl-card.fd-card-promo .fd-promo-rate.fd-promo-label.fd-promo-rate { width: 56% !important; padding-left: 20px !important; } .mdl-card.fd-card-promo .fd-promo-amounts.fd-promo-label p, .mdl-card.fd-card-promo .fd-promo-rate.fd-promo-label p { text-align: left; } .mdl-card.fd-card-promo .fd-promo-amounts.fd-promo-label p .fd-number, .mdl-card.fd-card-promo .fd-promo-rate.fd-promo-label p .fd-number { font-size: 39px; line-height: 25px; } .mdl-card.fd-card-promo .fd-promo-amounts.fd-promo-label p .fd-simbol, .mdl-card.fd-card-promo .fd-promo-rate.fd-promo-label p .fd-simbol { font-size: 27px; } .mdl-card.fd-card-promo .fd-promo-amounts.fd-promo-label p .fd-label, .mdl-card.fd-card-promo .fd-promo-rate.fd-promo-label p .fd-label { display: inline; font-size: 13px; } @media (max-width: 640px) { .mdl-card.fd-card-promo .fd-promo-amounts.fd-promo-label p .fd-label, .mdl-card.fd-card-promo .fd-promo-rate.fd-promo-label p .fd-label { display: block; } } .mdl-card.fd-card-promo .fd-promo-amounts { padding: 0 16px; border-bottom: 1px solid #e1e1e5; } @media (min-width: 840px) { .mdl-card.fd-card-promo .fd-promo-amounts { border-bottom: 0; padding: 0 0 0 16px; border-right: 1px solid #e1e1e5; } } .mdl-card.fd-card-promo .fd-promo-amounts p { text-align: center; } @media (min-width: 840px) { .mdl-card.fd-card-promo .fd-promo-amounts p { text-align: left; } } .mdl-card.fd-card-promo .fd-promo-amounts p .fd-number, .mdl-card.fd-card-promo .fd-promo-amounts p .fd-simbol, .mdl-card.fd-card-promo .fd-promo-amounts p .fd-label { color: #009FE3; } .mdl-card.fd-card-promo .fd-promo-rate { padding: 0 16px; } @media (min-width: 840px) { .mdl-card.fd-card-promo .fd-promo-rate { padding: 0 16px 0 0; } } .mdl-card.fd-card-promo .fd-promo-rate p { text-align: center; } @media (min-width: 840px) { .mdl-card.fd-card-promo .fd-promo-rate p { text-align: right; } } @media (min-width: 1280px) { .mdl-card.fd-card-promo .fd-promo-rate p { padding: 0 10px 0 0; } } .mdl-card.fd-card-promo .fd-promo-rate p .fd-number, .mdl-card.fd-card-promo .fd-promo-rate p .fd-simbol, .mdl-card.fd-card-promo .fd-promo-rate p .fd-label { color: #0D5C63; } .mdl-card.fd-card-promo .fd-promo-rate p .fd-label { display: block; } .mdl-card.fd-card-promo .fd-txt { font-size: 14px; line-height: 20px; padding: 0; } .mdl-card.fd-card-promo .fd-txt ul { width: 100%; display: block; float: left; list-style-type: disc; padding: 10px 15px 10px 20px; } .mdl-card.fd-card-promo .fd-txt ul li { list-style-type: disc; display: list-item; padding: 0 0 5px 0; } .mdl-card.fd-card-promo .fd-txt ul li a { text-decoration: underline; } .mdl-card.fd-card-promo .fd-txt .fd-btn { margin: 30px auto !important; width: 100%; text-align: center; display: block; } @media (max-width: 640px) { .mdl-card.fd-card-promo .mdl-card__actions .fd-button { width: 100%; } } @media (max-width: 640px) { .mdl-card.fd-card-promo .mdl-card__actions .mdl-button, .mdl-card.fd-card-promo .mdl-card__actions .fd-btn { text-align: center; display: block; width: 95%; margin: 10px auto 0 auto; } } .mdl-card .mdl-card__title { position: relative; } .mdl-card .mdl-card__title .mdl-card__title-text { clear: both; font-family: "facitregular", "Open Sans", arial, sans-serif; font-size: 20px; line-height: 24px; font-weight: bold; color: #0D5C63; overflow: visible; } .mdl-card .mdl-card__title .mdl-card__title-text.fd-subtitle { font-size: 18px; line-height: 20px; padding: 0; font-weight: normal; } .mdl-card .mdl-card__title .fd-date { left: 16px; top: 40px; position: absolute; font-family: "facitlight", "Open Sans", arial, sans-serif; font-size: 12px; color: #999999; } .mdl-card .mdl-card__title.fd-icon-title .mdl-card__title-text { /* Solo sul mio */ } .mdl-card .mdl-card__title.fd-icon-title .mdl-card__title-text span { display: block; float: left; padding: 7px 0 0 5px; } .mdl-card .mdl-card__title.fd-icon-title .mdl-card__title-text .fd-back { margin: -5px 5px 0 0; display: block; float: left; width: 35px !important; height: 35px !important; padding: 0 !important; min-height: 35px !important; min-width: 35px !important; text-align: center; } .mdl-card .mdl-card__title.fd-icon-title .mdl-card__title-text .fd-back i { font-size: 30px; color: #0D5C63; } .mdl-card .mdl-card__title button { display: block; float: left; margin-top: -5px; margin-right: 5px; margin-left: -2px; width: 35px !important; height: 35px !important; padding: 0 !important; min-height: 35px !important; min-width: 35px !important; text-align: center; } .mdl-card .mdl-card__title button i { font-size: 30px; color: #0D5C63; } .mdl-card .mdl-card__menu { top: 10px; right: 10px; } .mdl-card .mdl-card__supporting-text { width: 100%; position: relative; z-index: 1; overflow: visible; } .mdl-card .mdl-card__supporting-text .mdl-button { margin-left: -10px; } .mdl-card .mdl-card__supporting-text.fd-large { padding: 0; } .mdl-card .mdl-card__supporting-text.fd-step { color: #999999; font-size: 14px; line-height: 14px; font-family: "facitregular", "Open Sans", arial, sans-serif; padding-bottom: 0; } @media (min-width: 841px) { .mdl-card .mdl-card__supporting-text.fd-step { display: none; } } .mdl-card .mdl-card__actions fnd-button { min-height: 40px; height: auto; display: inline-block; } .mdl-card .mdl-card__actions button, .mdl-card .mdl-card__actions a { float: left; margin: 0 10px 0 0 !important; } .mdl-card .mdl-card__actions button.fd-btn, .mdl-card .mdl-card__actions a.fd-btn { margin: 0 0 0 10px; } @media all and (max-width: 640px) { .mdl-card .mdl-card__actions button, .mdl-card .mdl-card__actions a { float: none; margin: 0; } } .mdl-card .mdl-card__actions button br, .mdl-card .mdl-card__actions a br { display: none; } @media all and (max-width: 420px) { .mdl-card .mdl-card__actions button br, .mdl-card .mdl-card__actions a br { display: block; } } .mdl-card .mdl-card__actions .fd-pagination { float: right; } .mdl-card .mdl-card__actions .fd-pagination span { float: left; padding: 7px 10px 0 0; color: #999999; font-size: 12px; } .mdl-card .mdl-card__actions .fd-pagination a { margin: 0 5px 0 0 !important; color: #999999; } .mdl-card .mdl-card__actions .fd-pagination a i { font-size: 30px; font-weight: bold; } .mdl-card .mdl-card__actions .fd-button { display: block; float: right; padding: 0 0 10px 0; } .mdl-card .mdl-card__actions .fd-button .mdl-button { float: right; margin: 0 0 0 10px; } .mdl-card .mdl-card__actions .fd-button .mdl-button.fd-btn { margin: 0 10px; } .mdl-card .fd-graphic { clear: both; margin: 0 0 20px 0; } .mdl-card .fd-graphic-data-left { color: #00B0DA; } .mdl-card .fd-graphic-data-right, .mdl-card .fd-graphic-data-center { color: #00A258; } .mdl-card .fd-graphic-data-left, .mdl-card .fd-graphic-data-right, .mdl-card .fd-graphic-data-center { display: block; float: left; width: 45%; font-family: "facitsemibold", "Open Sans", arial, sans-serif; font-size: 27px; line-height: 32px; margin: 0 0 0 5%; } @media all and (max-width: 640px) { .mdl-card .fd-graphic-data-left, .mdl-card .fd-graphic-data-right, .mdl-card .fd-graphic-data-center { width: 50%; margin: 0; font-size: 23.25px; } } .mdl-card .fd-graphic-data-left.fd-w-three, .mdl-card .fd-graphic-data-right.fd-w-three, .mdl-card .fd-graphic-data-center.fd-w-three { width: 28.333%; } @media all and (max-width: 640px) { .mdl-card .fd-graphic-data-left.fd-w-three, .mdl-card .fd-graphic-data-right.fd-w-three, .mdl-card .fd-graphic-data-center.fd-w-three { width: 33.3333%; } } .mdl-card .fd-graphic-data-left span, .mdl-card .fd-graphic-data-right span, .mdl-card .fd-graphic-data-center span { display: block; font-family: "facitregular", "Open Sans", arial, sans-serif; font-size: 14px; line-height: 14px; color: #999999; padding: 0 0 5px 0; } .mdl-card .fd-summary { padding: 0 0 20px 0; color: #1D3032 !important; font-family: "facitregular", "Open Sans", arial, sans-serif; font-size: 14px; line-height: 20px; } .mdl-card .fd-summary span { display: block; color: #999999 !important; font-size: 16px; } .mdl-card .fd-creditcard { margin: 0 0 50px 0; } .mdl-card .fd-creditcard li { display: block; float: left; width: 16.6666%; } .mdl-card .fd-creditcard li img { display: block; width: 90%; } .mdl-card .fd-link-icon { float: table; text-transform: uppercase; color: #999999; font-size: 14px; line-height: 16px; margin: 0 0 30px 0; } .mdl-card .fd-link-icon:hover { color: #666666; } .mdl-card .fd-link-icon i { display: table-cell; vertical-align: middle; } .mdl-card .fd-link-icon span { display: table-cell; vertical-align: middle; padding: 0 0 0 5px; } .mdl-card .fd-link-icon.fd-info { font-size: 11px; line-height: 12px; } .mdl-card .fd-subtitle { clear: both; font-family: "facitregular", "Open Sans", arial, sans-serif; color: #0D5C63; font-size: 18px; line-height: 20px; padding: 0 15px 15px 0; } .mdl-card .fd-tit-frm-group { clear: both; font-family: "facitlight", "Open Sans", arial, sans-serif; font-size: 16px; color: #666666; line-height: 20px; padding: 0 0 15px 0; letter-spacing: inherit !important; } .mdl-card .fd-txt { font-size: 14px; line-height: 18px; color: #1D3032; padding: 0 0 30px 0; } .mdl-card .fd-txt .fd-img-left, .mdl-card .fd-txt .fd-img-right { width: 25%; display: block; } @media all and (max-width: 640px) { .mdl-card .fd-txt .fd-img-left, .mdl-card .fd-txt .fd-img-right { width: 100%; float: none !important; margin: 0 0 15px 0 !important; } } .mdl-card .fd-txt .fd-img-right { float: right; margin: 0 0 10px 15px; } .mdl-card .fd-txt .fd-img-left { float: left; margin: 0 15px 10px 0; } .mdl-card .fd-txt.fd-mlr { width: 85%; margin: auto; } @media all and (max-width: 640px) { .mdl-card .fd-txt.fd-mlr { width: 90%; } } .mdl-card .fd-txt.fd-big-txt { font-size: 17px; line-height: 20px; } .mdl-card .fd-list-link { margin: 0 0 20px 0; } .mdl-card .fd-list-link li { border-top: 1px solid #e1e1e5; } .mdl-card .fd-list-link li a { font-size: 15px; line-height: 17px; } .mdl-card .fd-list-link li a i { color: #999999; } .mdl-card .fd-list-link li a.mdl-list__item-primary-action { width: 100%; } .mdl-card .fd-list-link li:hover { cursor: pointer; background-color: #f4f4f9; } .mdl-card .fd-list-link li:last-child { border-bottom: 1px solid #e1e1e5; } .mdl-card .fd-list-link li .fd-ctn { clear: both; } .mdl-card .fd-ctn-data { width: 100%; padding-top: 0; padding-bottom: 0; } .mdl-card .fd-ctn-data.fd-no-spacer { padding: 0 !important; } .mdl-card .fd-ctn-data.fd-no-spacer .mdl-data-table tr td:first-child, .mdl-card .fd-ctn-data.fd-no-spacer .mdl-data-table tr th:first-child { padding-left: 18px; } .mdl-card .fd-ctn-data.fd-no-spacer .mdl-data-table tr td:last-child { padding-right: 18px; } .mdl-card .fd-ctn-data.fd-data-int { margin: 0 0 30px 0; } .mdl-card .fd-ctn-data.fd-data-int .mdl-data-table tr td .fd-label { font-family: "facitlight", "Open Sans", arial, sans-serif; } .mdl-card .fd-ctn-data .mdl-data-table { color: #1D3032; width: 100%; border: 0; white-space: inherit; font-size: 14px; line-height: 20px; } .mdl-card .fd-ctn-data .mdl-data-table tr:first-child td { border-top: 0; } .mdl-card .fd-ctn-data .mdl-data-table tr th { font-size: 14px; font-family: "facitregular", "Open Sans", arial, sans-serif; padding: 10px 0 10px 5px; border-bottom: 1px solid #e1e1e5; cursor: default; } .mdl-card .fd-ctn-data .mdl-data-table tr th.fd-right { text-align: right; } @media all and (max-width: 640px) { .mdl-card .fd-ctn-data .mdl-data-table tr th.fd-lastColumn { padding-right: 18px; } } .mdl-card .fd-ctn-data .mdl-data-table tr td:first-child { padding-left: 0; } .mdl-card .fd-ctn-data .mdl-data-table tr td { padding: 10px 0 10px 5px; text-align: left; border-color: #e1e1e5; line-height: 16px; height: 60px; } .mdl-card .fd-ctn-data .mdl-data-table tr td.fd-nowrap { white-space: nowrap; } .mdl-card .fd-ctn-data .mdl-data-table tr td.fd-right { text-align: right; } .mdl-card .fd-ctn-data .mdl-data-table tr td.fd-right .mdl-button { text-align: right; } .mdl-card .fd-ctn-data .mdl-data-table tr td .fd-label { display: block; font-family: "facitregular", "Open Sans", arial, sans-serif; line-height: 16px; padding: 0 0 3.3333333333px 0; } .mdl-card .fd-ctn-data .mdl-data-table tr td .fd-data { display: block; color: #999999; font-family: "facitregular", "Open Sans", arial, sans-serif; } .mdl-card .fd-ctn-data .mdl-data-table tr td .fd-link { margin: 0 0 0 10px; color: #999999; } .mdl-card .fd-ctn-data .mdl-data-table tr td .fd-link i { font-size: 20px; } .mdl-card .fd-ctn-data .mdl-data-table tr td .fd-promo { display: block; color: #999999; } .mdl-card .fd-ctn-data .mdl-data-table tr td .fd-light { display: block; color: #999999; font-size: 12px; } .mdl-card .fd-ctn-data .mdl-data-table tr td .mdl-button { white-space: nowrap; text-align: right; } @media all and (max-width: 640px) { .mdl-card .fd-ctn-data .mdl-data-table tr td .mdl-button { white-space: inherit; } } @media all and (max-width: 640px) { .mdl-card .fd-ctn-data .mdl-data-table tr td.fd-lastColumn { padding-right: 18px; } } .mdl-card .fd-ctn-data .mdl-data-table tr:last-child td { border-bottom: 0; } .mdl-card .fd-ctn-data .mdl-data-table tr:hover { cursor: pointer; } .mdl-card .fd-ctn-data .mdl-data-table.fd-no-focus-line tr:hover { background-color: transparent; cursor: default; } .mdl-card .fd-ctn-data .mdl-data-table.fd-no-border-bottom tr:last-child td { border-bottom: 0; } .mdl-card .fd-ctn-data .mdl-data-table .firstColumn { width: 100px; } .mdl-card .fd-ctn-data .mdl-data-table .wordBreakColumn { width: 96px; word-break: break-all; } .mdl-card .fd-ctn-data .mdl-data-table .responsiveColumn { text-overflow: ellipsis; overflow: hidden; max-width: 0; } .mdl-card .fd-ctn-data .mdl-data-table .iconColumn { width: 46px; } .mdl-card .fd-ctn-data .fd-note { font-size: 13px; line-height: 16px; padding-bottom: 20px; } .mdl-card .fd-box-outcome { width: 100%; float: left; } .mdl-card .fd-box-outcome .fd-msg { display: table; } .mdl-card .fd-box-outcome .fd-msg .fd-circular { display: table-cell; vertical-align: middle; } .mdl-card .fd-box-outcome .fd-msg .fd-circular i { font-weight: 800; color: #FFFFFF; font-size: 52.5px; line-height: 70px; background-color: #00A258; width: 70px; height: 70px; text-align: center; overflow: hidden; } @media all and (max-width: 640px) { .mdl-card .fd-box-outcome .fd-msg .fd-circular i { font-size: 52.5px; line-height: 70px; } } .mdl-card .fd-box-outcome .fd-msg p { padding: 0 0 0 15px; display: table-cell; vertical-align: middle; color: #1D3032; font-size: 16px; line-height: 20px; } .mdl-card .fd-box-outcome .fd-ctn { clear: both; margin-left: 85px; padding: 10px 0; } @media all and (max-width: 640px) { .mdl-card .fd-box-outcome .fd-ctn { margin-left: 0; padding: 20px 0 10px 0; } } .mdl-card .fd-box-outcome .fd-ctn p { padding: 0 0 20px 0; color: #1D3032; font-size: 14px; line-height: 17px; } .mdl-card .fd-box-error { width: 100%; float: left; } .mdl-card .fd-box-error .fd-msg { display: table; background-color: #ffe3e3; padding: 5px 0; } @media all and (max-width: 640px) { .mdl-card .fd-box-error .fd-msg { padding: 10px 0; } } .mdl-card .fd-box-error .fd-msg .fd-circular { display: table-cell; vertical-align: middle; } .mdl-card .fd-box-error .fd-msg .fd-circular i { font-weight: 800; color: #FFFFFF; font-size: 52.5px; line-height: 70px; color: #d50000; width: 70px; height: 70px; text-align: center; overflow: hidden; } @media all and (max-width: 640px) { .mdl-card .fd-box-error .fd-msg .fd-circular i { font-size: 52.5px; line-height: 70px; } } .mdl-card .fd-box-error .fd-msg p { padding: 0 15px 0 5px; display: table-cell; vertical-align: middle; color: #1D3032; font-size: 14px; line-height: 20px; color: #d50000; } .mdl-card .fd-box-focus { width: 100%; float: left; padding: 10px; background-color: #f4f4f9; border: 1px solid #e1e1e5; margin: 0 0 40px 0; } .mdl-card .fd-box-focus h3 { color: #0D5C63; font-size: 18px; font-family: "facitregular", "Open Sans", arial, sans-serif; margin: 0 0 10px 0; } .mdl-card .fd-info-modal { width: 38px !important; height: 38px !important; padding: 0 !important; min-height: 38px !important; min-width: 38px !important; text-align: center; } .mdl-card .fd-info-modal i { font-size: 30px; color: #0D5C63; } .mdl-card .fd-info-modal.fd-right { position: absolute; top: 10px; right: 10px; } .mdl-card .fd-step-horiz { width: 100%; float: left; clear: both; padding: 0 0 30px 0; background: transparent url('back-line-orizz.png') center 35px no-repeat; background-size: 80% auto; } @media all and (max-width: 640px) { .mdl-card .fd-step-horiz { background-position: center 25px !important; } } .mdl-card .fd-step-horiz li { float: left; display: block; width: 25%; } .mdl-card .fd-step-horiz li.fd-active .fd-number { background-color: #0D5C63; } .mdl-card .fd-step-horiz li.fd-active .fd-label { color: #0D5C63; } .mdl-card .fd-step-horiz li .fd-number { text-align: center; display: block; width: 80px; height: 80px; color: #FFFFFF; background-color: #c7c7c7; line-height: 60px; font-size: 17px; margin: auto; border: 10px solid #FFFFFF; } @media all and (max-width: 640px) { .mdl-card .fd-step-horiz li .fd-number { width: 50px; height: 50px; border: 5px solid #FFFFFF; line-height: 40px; font-size: 15px; } } .mdl-card .fd-step-horiz li .fd-label { display: block; text-align: center; color: #c3c3c7; font-size: 16px; line-height: 23px; text-transform: uppercase; font-family: "facitregular", "Open Sans", arial, sans-serif; padding: 5px 0 0 0; } @media all and (max-width: 640px) { .mdl-card .fd-step-horiz li .fd-label { font-size: 12px; line-height: 20px; } } .mdl-card .fd-busy { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; background-color: #FFFFFF; opacity: 0.8; filter: alpha(opacity=80); z-index: 109; text-align: center; } .mdl-card .fd-busy .fd-spinner { position: absolute; top: 50%; bottom: 50%; left: 0; right: 0; margin: auto; width: 60px; height: 60px; } .mdl-card .fd-busy .fd-spinner .mdl-spinner { width: 60px; height: 60px; } .mdl-card .fd-busy .fd-spinner .mdl-spinner .mdl-spinner__circle { border-width: 6px; border-color: #007136; } /* Form */ .fd-ctn-frm { width: 100%; padding-top: 10px; padding-bottom: 0; } .fd-ctn-frm.mdl-card__supporting-text { position: inherit !important; } .fd-ctn-frm .fd-input-ctn { clear: both; float: left; width: 100%; margin: 0 0 20px 0; } .fd-ctn-frm .fd-input-ctn .fd-input-ctn { margin-bottom: 0; } .fd-ctn-frm .fd-input-ctn.fd-icon .mdl-textfield .mdl-textfield__input { padding-left: 25px; } .fd-ctn-frm .fd-input-ctn.fd-icon .mdl-textfield .mdl-textfield__label { color: #999999; padding-left: 25px; } .fd-ctn-frm .fd-input-ctn.fd-icon .mdl-textfield .fd-info-modal .material-icons { position: absolute; top: 19px; left: 4px; line-height: 1px; font-size: 30px; z-index: 888; } .fd-ctn-frm .fd-input-ctn.fd-icon .mdl-textfield .material-icons { position: absolute; top: 23px; left: 0; line-height: 20px; font-size: 18px; z-index: 888; } .fd-ctn-frm .fd-input-ctn.fd-icon .mdl-textfield.is-focused .mdl-textfield__label .material-icons { display: none; } .fd-ctn-frm .fd-input-ctn.fd-code, .fd-ctn-frm .fd-input-ctn.fd-icon-help { position: relative; } .fd-ctn-frm .fd-input-ctn.fd-code .fd-info-modal, .fd-ctn-frm .fd-input-ctn.fd-icon-help .fd-info-modal { position: absolute; top: 8px !important; right: -5px; } .fd-ctn-frm .fd-input-ctn.fd-code .fd-info-modal i, .fd-ctn-frm .fd-input-ctn.fd-icon-help .fd-info-modal i { color: #999999 !important; } .fd-ctn-frm .fd-input-ctn.fd-code .mdl-textfield, .fd-ctn-frm .fd-input-ctn.fd-icon-help .mdl-textfield { width: 75%; } .fd-ctn-frm .fd-input-ctn.fd-code .mdl-textfield .mdl-textfield__input, .fd-ctn-frm .fd-input-ctn.fd-icon-help .mdl-textfield .mdl-textfield__input { padding-right: 37px; } @media all and (max-width: 1280px) { .fd-ctn-frm .fd-input-ctn.fd-code .mdl-textfield, .fd-ctn-frm .fd-input-ctn.fd-icon-help .mdl-textfield { width: 71%; } } @media all and (max-width: 840px) { .fd-ctn-frm .fd-input-ctn.fd-code .mdl-textfield, .fd-ctn-frm .fd-input-ctn.fd-icon-help .mdl-textfield { width: 75%; } } @media all and (max-width: 640px) { .fd-ctn-frm .fd-input-ctn.fd-code .mdl-textfield, .fd-ctn-frm .fd-input-ctn.fd-icon-help .mdl-textfield { width: 100%; } } .fd-ctn-frm .fd-input-ctn.fd-code .fd-img-code, .fd-ctn-frm .fd-input-ctn.fd-icon-help .fd-img-code { position: absolute; top: 0; right: 0; width: 150px; height: 50px; } @media all and (max-width: 640px) { .fd-ctn-frm .fd-input-ctn.fd-code .fd-img-code, .fd-ctn-frm .fd-input-ctn.fd-icon-help .fd-img-code { position: inherit; margin: 10px 0 0 0; } } .fd-ctn-frm .fd-input-ctn.fd-icon-help .mdl-textfield { width: 100%; } .fd-ctn-frm .fd-input-ctn .mdl-textfield { position: relative; width: 100%; } .fd-ctn-frm .fd-input-ctn .mdl-textfield .mdl-textfield__input { width: 100%; font-size: 16px; font-family: "facitregular", "Open Sans", arial, sans-serif; border-radius: 0; } .fd-ctn-frm .fd-input-ctn .mdl-textfield .mdl-textfield__label { color: #999999; } .fd-ctn-frm .fd-input-ctn .mdl-textfield.is-focused .mdl-textfield__label { border-bottom: 0; font-size: 14px; color: #4caf50 !important; font-family: "facitregular", "Open Sans", arial, sans-serif; padding-left: 0; } .fd-ctn-frm .fd-input-ctn .mdl-textfield.is-focused .mdl-icon-toggle__label { color: #666666; } .fd-ctn-frm .fd-input-ctn .mdl-textfield.is-focused .mdl-textfield__input { border-bottom: 0 !important; } .fd-ctn-frm .fd-input-ctn .mdl-textfield.is-invalid .mdl-textfield__label { color: #d50000; } .fd-ctn-frm .fd-input-ctn .mdl-textfield.is-invalid .mdl-textfield__input { border-bottom: 1px solid #d50000; } .fd-ctn-frm .fd-input-ctn .fd-hint { display: block; font-size: 12px; line-height: 16px; color: #999999; margin-top: -15px; padding-bottom: 10px !important; } .fd-ctn-frm .fd-input-ctn .fd-int { display: block; float: left; } .fd-ctn-frm .fd-input-ctn .fd-int.fd-w-medium { width: 68%; margin-right: 2%; } .fd-ctn-frm .fd-input-ctn .fd-int.fd-w-small { width: 30%; } .fd-ctn-frm .fd-input-ctn .fd-int.fd-w-half { width: 49%; margin-right: 1%; } .fd-ctn-frm .fd-input-ctn .fd-int.fd-w-third { width: 32%; margin-right: 1%; } @media all and (max-width: 640px) { .fd-ctn-frm .fd-input-ctn .fd-int { float: none; width: 100% !important; } .fd-ctn-frm .fd-input-ctn .fd-int.fd-w-medium { width: 100%; margin-right: 0; } .fd-ctn-frm .fd-input-ctn .fd-int.fd-w-small { width: 100%; } .fd-ctn-frm .fd-input-ctn .fd-int.fd-w-half { width: 100%; margin-right: 0; } .fd-ctn-frm .fd-input-ctn .fd-int.fd-w-third { float: left !important; width: 32% !important; margin-right: 1% !important; } } .fd-ctn-frm .fd-input-ctn .mdl-button--file input { cursor: pointer; height: 100%; right: 0; opacity: 0; position: absolute; top: 0; width: 300px; z-index: 10; } .fd-ctn-frm .fd-input-ctn .mdl-textfield--file .mdl-textfield__input { box-sizing: border-box; width: calc(100% - 32px); } .fd-ctn-frm .fd-input-ctn .mdl-textfield--file .mdl-textfield__input::-webkit-input-placeholder { color: #999999; font-family: "facitlight", "Open Sans", arial, sans-serif; opacity: 1; } .fd-ctn-frm .fd-input-ctn .mdl-textfield--file .mdl-textfield__input::-moz-placeholder { color: #999999; font-family: "facitlight", "Open Sans", arial, sans-serif; opacity: 1; } .fd-ctn-frm .fd-input-ctn .mdl-textfield--file .mdl-textfield__input:-ms-input-placeholder { color: #999999; font-family: "facitlight", "Open Sans", arial, sans-serif; opacity: 1; } .fd-ctn-frm .fd-input-ctn .mdl-textfield--file .mdl-textfield__input:-moz-placeholder { color: #999999; font-family: "facitlight", "Open Sans", arial, sans-serif; opacity: 1; } .fd-ctn-frm .fd-input-ctn .mdl-textfield--file .mdl-button--file { right: 0; width: 35px !important; height: 35px !important; padding: 0 !important; min-height: 35px !important; min-width: 35px !important; text-align: center; } .fd-ctn-frm .fd-select-ctn { clear: both; float: left; width: 100%; margin: 0 0 30px 0; } .fd-ctn-frm .fd-select-ctn .mdl-menu__container.is-visible .mdl-menu__outline, .fd-ctn-frm .fd-select-ctn .mdl-menu__container.is-visible .mdl-menu__outline .mdl-menu, .fd-ctn-frm .fd-select-ctn .mdl-menu__container.is-visible .mdl-menu__outline .mdl-menu__item { width: 100% !important; padding: 0 !important; } .fd-ctn-frm .fd-radio-ctn, .fd-ctn-frm .fd-checkbox-ctn { clear: both; float: left; width: 100%; margin: 0 0 35px 0; } .fd-ctn-frm .fd-radio-ctn .fd-label, .fd-ctn-frm .fd-checkbox-ctn .fd-label { display: block !important; color: #666666; padding: 0 0 20px 0; } .fd-ctn-frm .fd-radio-ctn .mdl-radio, .fd-ctn-frm .fd-radio-ctn .mdl-checkbox, .fd-ctn-frm .fd-checkbox-ctn .mdl-radio, .fd-ctn-frm .fd-checkbox-ctn .mdl-checkbox { display: block; margin: 0 0 15px 0; min-height: 24px; height: auto; } .fd-ctn-frm .fd-radio-ctn .mdl-radio__label, .fd-ctn-frm .fd-radio-ctn .mdl-checkbox__label, .fd-ctn-frm .fd-checkbox-ctn .mdl-radio__label, .fd-ctn-frm .fd-checkbox-ctn .mdl-checkbox__label { color: #1D3032; } .fd-ctn-frm .fd-radio-ctn .mdl-radio__label .fd-hint, .fd-ctn-frm .fd-radio-ctn .mdl-checkbox__label .fd-hint, .fd-ctn-frm .fd-checkbox-ctn .mdl-radio__label .fd-hint, .fd-ctn-frm .fd-checkbox-ctn .mdl-checkbox__label .fd-hint { display: block; font-size: 12px; line-height: 16px; color: #999999; margin-top: -5px; } .fd-ctn-frm .fd-radio-ctn .mdl-radio__label.is-invalid, .fd-ctn-frm .fd-radio-ctn .mdl-checkbox__label.is-invalid, .fd-ctn-frm .fd-checkbox-ctn .mdl-radio__label.is-invalid, .fd-ctn-frm .fd-checkbox-ctn .mdl-checkbox__label.is-invalid { color: #d50000; } .fd-ctn-frm .fd-radio-ctn .mdl-textfield, .fd-ctn-frm .fd-checkbox-ctn .mdl-textfield { margin-top: -25px; width: 95%; } .fd-ctn-frm .fd-invalid .mdl-textfield .mdl-textfield__label { color: #d50000 !important; font-size: 16px !important; } .fd-ctn-frm .fd-invalid .mdl-textfield .mdl-textfield__label:after { background-color: #d50000; } .fd-ctn-frm .fd-invalid .mdl-textfield .mdl-textfield__input { border-bottom: 1px solid #d50000 !important; } .fd-ctn-frm .fd-invalid .mdl-textfield.is-focused .mdl-textfield__label { color: #d50000 !important; font-size: 14px !important; } .fd-ctn-frm .fd-invalid .fd-hint { color: #d50000 !important; } .fd-ctn-frm .fd-input-ctn .fd-invalid .mdl-textfield .mdl-textfield__label { color: #d50000 !important; font-size: 16px !important; } .fd-ctn-frm .fd-input-ctn .fd-invalid .mdl-textfield .mdl-textfield__input { border-bottom: 1px solid #d50000 !important; } .fd-ctn-frm .fd-input-ctn .fd-invalid .mdl-textfield.is-focused .mdl-textfield__label { color: #d50000 !important; font-size: 14px !important; } .fd-ctn-frm .fd-input-ctn .fd-invalid .fd-hint { color: #d50000 !important; } /* Toolbar */ .fd-footer-toolbar { margin-top: -40px; background-color: #e9e9ed; padding: 80px 0 60px; } @media all and (max-width: 1280px) { .fd-footer-toolbar { padding: 60px 0 20px; } } .fd-footer-toolbar .mdl-card { background-color: transparent; border: 0; margin: 0; } @media all and (max-width: 1280px) { .fd-footer-toolbar .mdl-card { padding-bottom: 20px; } } .fd-footer-toolbar .mdl-card h2 { color: #0D5C63; font-family: "facitregular", "Open Sans", arial, sans-serif; font-size: 20px; line-height: 23px; } .fd-footer-toolbar .mdl-card div { width: 100%; } .fd-footer-toolbar .mdl-card .mdl-card__supporting-text { padding-top: 0; color: #1D3032; line-height: 20px; } .fd-footer-toolbar .mdl-card .mdl-card__supporting-text .fd-big { padding: 15px 0 0 0; display: block; font-size: 27px; font-family: "facitregular", "Open Sans", arial, sans-serif; } .fd-footer-toolbar .mdl-card .mdl-card__supporting-text ul { border-top: 1px solid #c3c3c7; } .fd-footer-toolbar .mdl-card .mdl-card__supporting-text ul li { padding: 10px 0; border-bottom: 1px solid #c3c3c7; } .fd-footer-toolbar .mdl-card .mdl-card__supporting-text ul li a, .fd-footer-toolbar .mdl-card .mdl-card__supporting-text ul li button { color: #0D5C63; font-size: 14px; line-height: 20px; } .fd-footer-toolbar .mdl-card .mdl-card__supporting-text ul li a:hover, .fd-footer-toolbar .mdl-card .mdl-card__supporting-text ul li button:hover { color: #44a1a0; } .fd-footer-toolbar .mdl-card .mdl-card__supporting-text ul li a i, .fd-footer-toolbar .mdl-card .mdl-card__supporting-text ul li button i { float: right; vertical-align: middle; } .fd-footer-toolbar .mdl-card .mdl-card__supporting-text .fd-img { display: block; width: 60px; } @media all and (min-width: 1281px) { .fd-footer-toolbar .mdl-card .mdl-card__supporting-text .fd-img { float: right; margin: 0 0 0 15px; } } @media all and (max-width: 1280px) { .fd-footer-toolbar .mdl-card .mdl-card__supporting-text .fd-img { float: none; margin: 0 0 10px 0; } } @media all and (max-width: 840px) { .fd-footer-toolbar .mdl-card .mdl-card__supporting-text .fd-img { float: right; margin: 0 0 0 15px; } } .fd-footer-toolbar .mdl-card .mdl-card__actions { padding-left: 16px; padding-right: 16px; } /* Accordion */ .fd-accordion { width: 100%; float: left; } .fd-accordion li { width: 100%; display: block; float: left; } .fd-accordion li.fd-active { margin: 15px 0; } .fd-accordion li.fd-active a:hover { background-color: #FFFFFF; } .fd-accordion li .fd-link { display: block; cursor: pointer; padding: 20px 15px 13px 15px; color: #0D5C63; font-family: "facitregular", "Open Sans", arial, sans-serif; font-size: 17px; line-height: 20px; } .fd-accordion li .fd-link i { display: block; float: right; color: #999999; font-weight: 800; font-size: 27px; } .fd-accordion li .fd-link:hover { background-color: #f4f4f9; } .fd-accordion li .fd-ctn { display: none; } .fd-accordion li .fd-ctn .fd-logo-product { float: left; width: 25%; margin: 0 3% 0 0; } @media all and (max-width: 640px) { .fd-accordion li .fd-ctn .fd-logo-product { float: none; width: 70%; margin: 0 auto 20px auto; } } .fd-accordion li .fd-ctn .fd-logo-product img { display: block; margin: auto; width: 100%; } .fd-accordion li .fd-ctn .fd-ctn-txt { float: left; width: 72%; } @media all and (max-width: 640px) { .fd-accordion li .fd-ctn .fd-ctn-txt { float: none; width: 100%; } } .fd-accordion li .fd-ctn .fd-ctn-txt .fd-txt .fd-focus { color: #5bba6f; } .fd-accordion li .fd-ctn .mdl-card__actions { float: left; } .fd-accordion li .fd-ctn .mdl-card__actions .mdl-button.fd-primary { color: #5bba6f; } .fd-accordion li .fd-ctn .mdl-card__actions .mdl-button.fd-primary:hover { background-color: #e6f6eb; } .fd-accordion.fd-promo-element li .fd-link { padding: 20px 15px 13px 5px; border-left: 10px solid #FFFFFF; } .fd-accordion.fd-promo-element li .fd-link:hover { background-color: #FFFFFF; border-left: 10px solid #009FE3; } .fd-accordion.fd-promo-element li .fd-link:hover i { color: #009FE3; } .fd-accordion.fd-promo-element li.fd-active a:hover { border-left: 10px solid #FFFFFF; } .fd-accordion.fd-promo-element li.fd-active a:hover i { color: #999999; } .fd-accordion.fd-promo-element li .fd-ctn .mdl-card__actions .mdl-button.fd-btn { color: #FFFFFF !important; } .fd-accordion.fd-promo-element li .fd-ctn .mdl-card__actions .mdl-button.fd-btn:hover { background-color: #00A258 !important; } /* Dialog */ .mdl-dialog { position: relative; padding: 0; } @media all and (min-width: 1281px) { .mdl-dialog { width: 35%; } .mdl-dialog.large { width: 50%; } } @media all and (max-width: 1280px) { .mdl-dialog { width: 50%; max-height: 95%; overflow: auto; } .mdl-dialog.large { width: 70%; } } @media all and (max-width: 640px) { .mdl-dialog { width: 90%; } .mdl-dialog.large { width: 90%; } } .mdl-dialog .mdl-textfield { width: 100%; } .mdl-dialog .mdl-dialog__title { font-family: "facitregular", "Open Sans", arial, sans-serif; font-size: 20px; line-height: 22px; font-weight: bold; color: #0D5C63; padding: 15px; padding-bottom: 0; width: calc(100% - 40px); position: absolute; top: 0; left: 0; height: 55px; overflow: hidden; padding: 15px; } .mdl-dialog .mdl-dialog__title .mdl-button { background-color: transparent; } .mdl-dialog .mdl-dialog__title .mdl-button:hover { background-color: #dde9eb; } .mdl-dialog .mdl-dialog__title .mdl-button.fd-right { float: right; margin: -7px 0 0 0; } .mdl-dialog .mdl-dialog__title .mdl-button.fd-circular { display: block; float: left; width: 35px !important; height: 35px !important; padding: 0 !important; min-height: 35px !important; min-width: 35px !important; text-align: center; margin: -6px 5px 0 -5px; } .mdl-dialog .mdl-dialog__title .mdl-button.fd-circular i { font-size: 27px; color: #0D5C63; font-weight: 800; } .mdl-dialog .mdl-dialog__content { margin: 55px 0 60px 0; padding: 15px 15px 0 15px; overflow: auto; min-height: 50px; max-height: 600px; } .mdl-dialog .mdl-dialog__content .fd-txt { font-size: 14px; line-height: 18px; color: #1D3032; } .mdl-dialog .mdl-dialog__content .fd-tit-frm-group { clear: both; font-family: "facitlight", "Open Sans", arial, sans-serif; font-size: 16px; color: #666666; line-height: 20px; padding: 0 0 15px 0; letter-spacing: inherit !important; } .mdl-dialog .mdl-dialog__actions { width: 100%; position: absolute; bottom: 0; left: 0; padding: 10px 15px; } .mdl-dialog .mdl-dialog__actions .mdl-button.fd-primary { background-color: #FFFFFF; } .mdl-dialog .mdl-dialog__actions .mdl-button.fd-primary:hover { background-color: #e6f6eb; } .mdl-dialog .mdl-dialog__actions fnd-button { min-height: 40px; height: auto; display: inline-block; } .mdl-dialog .mdl-dialog__actions button, .mdl-dialog .mdl-dialog__actions a { text-align: center; } /*Tabs*/ .fd-tabs { position: relative; } .fd-tabs .bx-wrapper { max-width: 100% !important; } .fd-tabs .fd-link-tabs { height: 38px; border-bottom: 1px solid #e1e1e5; position: relative; } @media (min-width: 640px) { .fd-tabs .fd-link-tabs { height: 37px; } } @media (min-width: 840px) { .fd-tabs .fd-link-tabs { height: 38px; } } .fd-tabs .fd-link-tabs li { display: block; float: left; } .fd-tabs .fd-link-tabs li a { display: table; height: 38px; color: #91b1b5; font-size: 13px; font-weight: bold; text-transform: uppercase; text-align: center; padding: 0 5px; width: 100%; letter-spacing: -0.8px; font-family: "facitregular", "Open Sans", arial, sans-serif; } .fd-tabs .fd-link-tabs li a span { display: table-cell; vertical-align: middle; padding-bottom: 3px; } @media (min-width: 640px) { .fd-tabs .fd-link-tabs li a span { padding-bottom: 1px; } } .fd-tabs .fd-link-tabs li a.fd-active, .fd-tabs .fd-link-tabs li a.fd-current { width: 100%; color: #0D5C63; } .fd-tabs .fd-link-tabs li a.fd-current { cursor: default; } @media (min-width: 640px) { .fd-tabs .fd-link-tabs li a { display: block; font-size: 16px; height: auto; text-transform: inherit; padding: 10px 0; } .fd-tabs .fd-link-tabs li a span { display: block; } } @media (min-width: 840px) { .fd-tabs .fd-link-tabs li a { font-size: 17px; } } .fd-tabs .fd-link-tabs .fd-magic-line { position: absolute; bottom: 0; left: 0; height: 3px; background: #0D5C63; } @media (min-width: 840px) { .fd-tabs .fd-link-tabs .fd-magic-line { height: 1px; } } .fd-tabs .fd-ctn-tabs { padding: 20px 0 0 0; } .fd-tabs .fd-ctn-tabs .fd-box h3 { color: #0D5C63; padding: 0 0 12px 0; font-size: 19px; line-height: 20px; font-family: "facitregular", "Open Sans", arial, sans-serif; } @media (max-width: 640px) { .fd-tabs .fd-ctn-tabs .fd-box h3 { font-size: 17px; } } .fd-tabs .fd-ctn-tabs .fd-box .fd-txt { font-size: 14px; line-height: 20px; padding: 0 0 40px 0; } @media (max-width: 840px) { .fd-tabs .fd-ctn-tabs .fd-box .fd-txt { padding: 0 0 30px 0; } } @media (max-width: 640px) { .fd-tabs .fd-ctn-tabs .fd-box .fd-txt { padding: 0 0 20px 0; } } .fd-tabs .fd-ctn-tabs .fd-box .fd-txt p { padding-bottom: 10px; } .fd-tabs .fd-ctn-tabs .fd-box .fd-txt ul { width: 100%; display: block; float: left; list-style-type: disc; padding: 0 15px 10px 20px; } .fd-tabs .fd-ctn-tabs .fd-box .fd-txt ul li { list-style-type: disc; display: list-item; padding: 0; } .fd-tabs .fd-ctn-tabs .fd-box .fd-txt ul li a { text-decoration: underline; } .fd-tabs .controls-direction { position: relative; } .fd-tabs .controls-direction a { display: block; position: absolute; z-index: 100; top: -35px; background-color: #e9e9ed; opacity: 0.9; filter: alpha(opacity=90); } .fd-tabs .controls-direction a.bx-next { right: 0; } .fd-tabs .controls-direction a.bx-prev { left: 0; } @media (min-width: 640px) { .fd-tabs .controls-direction a.bx-next { right: -10px; } .fd-tabs .controls-direction a.bx-prev { left: -10px; } } .fd-tabs .controls-direction a.disabled { display: none; } @media (min-width: 640px) { .fd-tabs .controls-direction a { top: -30px; padding: 0 5px; } } .fd-card-slider-products { z-index: 10; margin-top: 30px; } .fd-card-slider-products .fd-links-products ul { margin: auto; width: 100%; position: relative; height: 55px !important; border-bottom: 1px solid #e1e1e5; } @media (max-width: 640px) { .fd-card-slider-products .fd-links-products ul { height: 40px !important; } } .fd-card-slider-products .fd-links-products ul li { display: block; float: left; width: 20%; text-align: center; } .fd-card-slider-products .fd-links-products ul li a { display: table; color: #91b1b5; padding: 7px 0 0 0; text-transform: uppercase; font-size: 12px; width: 100%; font-family: "facitregular", "Open Sans", arial, sans-serif; font-weight: 600; letter-spacing: -0.8px; } @media (max-width: 490px) { .fd-card-slider-products .fd-links-products ul li a { font-size: 11px; padding: 10px 0 0 0; } } @media (max-width: 320px) { .fd-card-slider-products .fd-links-products ul li a { font-size: 10px; padding: 10px 0 0 0; } } @media (min-width: 640px) { .fd-card-slider-products .fd-links-products ul li a { font-size: 15px; padding: 10px 0; } } @media (min-width: 840px) { .fd-card-slider-products .fd-links-products ul li a { text-transform: none; font-size: 17px; } } @media (min-width: 1281px) { .fd-card-slider-products .fd-links-products ul li a { font-size: 18px; padding: 20px 0 0 0; } } .fd-card-slider-products .fd-links-products ul li a.active { color: #0D5C63; } .fd-card-slider-products .fd-links-products ul li a span { display: table-cell; vertical-align: middle; padding-bottom: 5px; } .fd-card-slider-products .fd-links-products ul li a span br { display: block; } @media (min-width: 1280px) { .fd-card-slider-products .fd-links-products ul li a span br { display: none; } } .fd-card-slider-products .fd-links-products ul li.fd-magic-line { position: absolute; bottom: 0; left: 0; height: 1px !important; background: #0D5C63; } .fd-card-slider-products .fd-ctn-products .fd-card-promo { border: 0; } .fd-card-slider-products .fd-ctn-products .fd-card-promo .fd-promo-right { background-color: transparent; border: 0; } /* footer */ .fd-footer .fd-txt { padding: 20px; color: #999999; line-height: 22px; } .fd-footer .fd-txt a { color: #999999; font-size: 14px; } .fd-footer .fd-txt a:hover { color: #00A258; } /* Bg Modal */ .fd-bg-overlay { display: block; background-color: #aeaeae; height: 100%; left: 0; opacity: 0.9; position: fixed; top: 0; width: 100%; z-index: 501; } @media all and (min-width: 1281px) { .fd-bg-overlay { display: none; } } /* Threshold */ @media all and (max-width: 640px) { .threshold-xs { display: block; } .threshold-sm { display: none; } .threshold-md { display: none; } .threshold-lg { display: none; } } @media all and (max-width: 840px) { .threshold-xs { display: none; } .threshold-sm { display: block; } .threshold-md { display: none; } .threshold-lg { display: none; } } @media all and (min-width: 841px) and (max-width: 1280px) { .threshold-xs { display: none; } .threshold-sm { display: none; } .threshold-md { display: block; } .threshold-lg { display: none; } } /*@media all and (min-width: ($width-tablet)+1) { }*/ @media all and (min-width: 1281px) { .threshold-xs { display: none; } .threshold-sm { display: none; } .threshold-md { display: none; } .threshold-lg { display: block; } } /* fnd */ fnd-radio-input { clear: both; display: block; } fnd-radio-input fnd-text-input { display: block; } fnd-radio-input fnd-text-input .fd-input-ctn { margin-bottom: 0 !important; } fnd-radio-input.withBorder { width: 100%; padding: 15px 15px 0 15px; border: 1px solid #999999; border-radius: 2px; margin-bottom: 8px; } fnd-radio-input.withBorder.radioWithBorderSelected { border: 1px solid #00A258; background: #f4f4f9; color: #1D3032; } fnd-radio-input.withBorder.is-invalid { border: 1px solid #d50000; } fnd-radio-input.withBorder label { width: 100%; height: 45px; } fnd-radio-input.withBorder label .fd-hint { display: block; font-size: 12px; line-height: 16px; color: #999999; margin-top: -5px; } .mdl-checkbox__tick-outline { mask: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgdmVyc2lvbj0iMS4xIgogICB2aWV3Qm94PSIwIDAgMSAxIgogICBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWluWU1pbiBtZWV0Ij4KICA8ZGVmcz4KICAgIDxjbGlwUGF0aCBpZD0iY2xpcCI+CiAgICAgIDxwYXRoCiAgICAgICAgIGQ9Ik0gMCwwIDAsMSAxLDEgMSwwIDAsMCB6IE0gMC44NTM0Mzc1LDAuMTY3MTg3NSAwLjk1OTY4NzUsMC4yNzMxMjUgMC40MjkzNzUsMC44MDM0Mzc1IDAuMzIzMTI1LDAuOTA5Njg3NSAwLjIxNzE4NzUsMC44MDM0Mzc1IDAuMDQwMzEyNSwwLjYyNjg3NSAwLjE0NjU2MjUsMC41MjA2MjUgMC4zMjMxMjUsMC42OTc1IDAuODUzNDM3NSwwLjE2NzE4NzUgeiIKICAgICAgICAgc3R5bGU9ImZpbGw6I2ZmZmZmZjtmaWxsLW9wYWNpdHk6MTtzdHJva2U6bm9uZSIgLz4KICAgIDwvY2xpcFBhdGg+CiAgICA8bWFzayBpZD0ibWFzayIgbWFza1VuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgbWFza0NvbnRlbnRVbml0cz0ib2JqZWN0Qm91bmRpbmdCb3giPgogICAgICA8cGF0aAogICAgICAgICBkPSJNIDAsMCAwLDEgMSwxIDEsMCAwLDAgeiBNIDAuODUzNDM3NSwwLjE2NzE4NzUgMC45NTk2ODc1LDAuMjczMTI1IDAuNDI5Mzc1LDAuODAzNDM3NSAwLjMyMzEyNSwwLjkwOTY4NzUgMC4yMTcxODc1LDAuODAzNDM3NSAwLjA0MDMxMjUsMC42MjY4NzUgMC4xNDY1NjI1LDAuNTIwNjI1IDAuMzIzMTI1LDAuNjk3NSAwLjg1MzQzNzUsMC4xNjcxODc1IHoiCiAgICAgICAgIHN0eWxlPSJmaWxsOiNmZmZmZmY7ZmlsbC1vcGFjaXR5OjE7c3Ryb2tlOm5vbmUiIC8+CiAgICA8L21hc2s+CiAgPC9kZWZzPgogIDxyZWN0CiAgICAgd2lkdGg9IjEiCiAgICAgaGVpZ2h0PSIxIgogICAgIHg9IjAiCiAgICAgeT0iMCIKICAgICBjbGlwLXBhdGg9InVybCgjY2xpcCkiCiAgICAgc3R5bGU9ImZpbGw6IzAwMDAwMDtmaWxsLW9wYWNpdHk6MTtzdHJva2U6bm9uZSIgLz4KPC9zdmc+Cg=="); } .mdl-checkbox.is-checked .mdl-checkbox__tick-outline { background: rgb(76, 175, 80) url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgdmVyc2lvbj0iMS4xIgogICB2aWV3Qm94PSIwIDAgMSAxIgogICBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWluWU1pbiBtZWV0Ij4KICA8cGF0aAogICAgIGQ9Ik0gMC4wNDAzODA1OSwwLjYyNjc3NjcgMC4xNDY0NDY2MSwwLjUyMDcxMDY4IDAuNDI5Mjg5MzIsMC44MDM1NTMzOSAwLjMyMzIyMzMsMC45MDk2MTk0MSB6IE0gMC4yMTcxNTcyOSwwLjgwMzU1MzM5IDAuODUzNTUzMzksMC4xNjcxNTcyOSAwLjk1OTYxOTQxLDAuMjczMjIzMyAwLjMyMzIyMzMsMC45MDk2MTk0MSB6IgogICAgIGlkPSJyZWN0Mzc4MCIKICAgICBzdHlsZT0iZmlsbDojZmZmZmZmO2ZpbGwtb3BhY2l0eToxO3N0cm9rZTpub25lIiAvPgo8L3N2Zz4K"); } .fnd-modal-dialog { z-index: 200000; } @media all and (max-width: 640px) { .mdl-dialog { max-height: 95%; overflow: auto; } .mdl-dialog .mdl-dialog__content { margin-bottom: 0; } .mdl-dialog .mdl-dialog__actions { position: relative; } } fnd-card-body .mdl-card__supporting-text:after { content: ""; display: block; clear: both; } fnd-card-footer .mdl-card__actions:after { content: ""; display: block; clear: both; } /* siff select start */ fnd-select-input { width: 100%; display: block; } fnd-select-input .mdl-textfield { width: 100%; } fnd-select-input label { font-size: 12px; } .fd-sel { position: relative; width: 100%; } .fd-sel .mdl-textfield { width: 100%; } .fd-sel .fd-sel-option-active { position: relative; display: block; border-bottom: 1px solid rgba(0, 0, 0, 0.12); width: 100%; height: 30px; line-height: 30px; font-size: 15px; text-transform: uppercase; padding: 0 5px 0 0; overflow: hidden; cursor: text; } @media all and (max-width: 640px) { .fd-sel .fd-sel-option-active { width: 100%; } } .fd-sel .fd-sel-option-active .fd-arrow { position: absolute; top: 2px; right: 0; } .fd-sel-dropdown { display: none; float: left; position: absolute; top: -20px; left: 0; background-color: #FFFFFF; padding: 10px 5px; width: 100%; height: 300px; overflow: auto; z-index: 9999; } @media all and (max-width: 640px) { .fd-sel-dropdown { width: 80%; } } .fd-sel-dropdown ul { padding: 0 0 0 0; } .fd-sel-dropdown ul > li { display: block; padding: 0 0 0 0; } .fd-sel-dropdown span { display: block; color: #00A258; font-size: 13px; line-height: 20px; font-family: "facitsemibold", "Open Sans", arial, sans-serif; padding: 5px 10px; } .fd-sel-dropdown a { display: block; text-transform: uppercase; font-size: 15px; line-height: 20px; font-family: "facitlight", "Open Sans", arial, sans-serif; padding: 10px 5px; margin: 0 5px; } .fd-sel-dropdown a:hover, .fd-sel-dropdown a.active { background-color: #f4f4f9; } /* siff select end */ fnd-checkbox-input fnd-button { display: inline-block; margin-left: 10px; margin-top: -5px; } .mdl-button.file { line-height: 36px; z-index: 1; overflow: hidden; position: relative; } .mdl-button.file input { position: absolute; left: 0; top: 0; display: block; width: 200px; height: 40px; opacity: 0; filter: alpha(opacity=0); z-index: 2; } .mdl-textfield input { transform: translateZ(0px); } .login-logo-cont { width: 320px; height: 130px; margin: 0 auto; position: relative; } .login-logo-cont .login-logo { max-width: 320px; max-height: 130px; position: absolute; top: 0; bottom: 0; margin: auto; } .border-top-20 { padding-top: 20px; } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox { position: relative; border: 0; background: #f4f4f9 url('back-box-double.png') left center no-repeat; } @media all and (min-width: 840px) { .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox { height: 600px; } } @media all and (max-width: 840px) { .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox { background: #f4f4f9 url('back-box-double-2x.png') top center no-repeat; height: 450px; } } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox h2 { color: #1D3032; font-family: "facitsemibold", "Open Sans", arial, sans-serif; font-size: 22.5px; line-height: 23px; padding: 15px 20px 30px 20px; } @media (max-width: 640px) { .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox h2 { font-size: 19.5px; padding: 20px 10px 20px 0; } } @media (max-width: 840px) { .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox h2 { padding: 20px 10px 30px 0; } } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox .fd-siffbox-step li { display: block; float: left; width: 33.33333%; text-align: center; padding: 0 0 20px 0; } @media (min-width: 640px) { .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox .fd-siffbox-step li { padding: 0 0 10px 0; } } @media (min-width: 840px) { .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox .fd-siffbox-step li { padding: 0 0 20px 0; } } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox .fd-siffbox-step li span { display: block; padding: 0 0 5px 0; font-size: 37.5px; color: #0D5C63; } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox .fd-siffbox-step li p { color: #0D5C63; font-size: 12px; font-family: "facitsemibold", "Open Sans", arial, sans-serif; line-height: 12px; } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript { font-family: "facitlight", "Open Sans", arial, sans-serif !important; color: #1D3032 !important; font-size: 14px !important; padding: 20px; } @media (max-width: 840px) { .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript { padding: 15px 20px 0 0; min-height: 300px !important; } } @media (max-width: 640px) { .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript { padding: 0 10px 0 0; } } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #container_importo, .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #container_progetto { display: block; font-size: 14px; } @media (min-width: 640px) { .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #container_importo, .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #container_progetto { padding: 10px 0 0 0; } } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #container_titolo { display: none; } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_rata_container { display: none; } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_finalita_container { padding: 0 0 30px 0; } @media (min-width: 640px) { .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_finalita_container { padding: 0 0 10px 0; } } @media (min-width: 840px) { .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_finalita_container { padding: 0 0 20px 0; } } @media (min-width: 1280px) { .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_finalita_container { padding: 0 0 30px 0; } } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_finalita { visibility: visible; } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_importo_container { position: relative; padding: 0 0 20px 0; } @media (min-width: 640px) { .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_importo_container { padding: 0 0 10px 0; } } @media (min-width: 840px) { .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_importo_container { padding: 0 0 20px 0; } } @media (min-width: 1280px) { .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_importo_container { padding: 0 0 30px 0; } } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_importo_minmax { position: absolute; right: 0; bottom: 0; font-size: 12px; padding: 0 !important; } @media (min-width: 1280px) { .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_importo_minmax { padding: 5px 0 10px 0 !important; bottom: 0; } } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_assicurazione_container { padding-top: 15px; } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_assicurazione { float: none; width: auto; top: -12px !important; font-size: 16px; } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_assicurazione_check { display: inline-block; margin-left: 10px; } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_calcola { text-align: center; display: block; font-family: "facitsemibold", "Open Sans", arial, sans-serif; font-size: 14.5px; line-height: 20px; background-color: #00A258; color: #FFFFFF; padding: 0; text-transform: uppercase; margin: 20px 0 0 0; width: 100%; font-size: 15px; line-height: 20px; height: 40px; line-height: 36px; border: 0; -webkit-tap-highlight-color: transparent !important; -webkit-focus-ring-color: transparent !important; outline: none !important; cursor: pointer; } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #link_assicurazione { display: block; text-transform: uppercase; font-size: 13px; margin: 0 0 20px 0; } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #link_assicurazione a { color: #999999 !important; } @media (min-width: 640px) { .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #link_assicurazione { margin: 0 0 10px 0; } } @media (min-width: 840px) { .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #link_assicurazione { margin: 0 0 20px 0; } } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_assicurazione_help { color: #FFFFFF; display: inline-block !important; width: 25px !important; padding: 3.3333333333px 0 !important; font-family: "facitsemibold", "Open Sans", arial, sans-serif !important; background-color: #0D5C63 !important; text-align: center !important; font-size: 18px !important; font-family: "facitlight", "Open Sans", arial, sans-serif !important; margin: -20px 0 0 0 !important; } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript .siff-sel-error { position: absolute !important; bottom: -16px !important; } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript .siff-sel-error #findomestic_simulatore_javascript_finalita_error_container_internal { top: 2px !important; left: 10px !important; } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript .siff-sel-error #findomestic_simulatore_javascript_finalita_error_container_internal img { display: none !important; } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript .siff-sel-error #findomestic_simulatore_javascript_finalita_error_container_internal span { background-image: none !important; background-color: none !important; color: #d50000 !important; width: 260px !important; font-size: 12px !important; } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript .siff-input-error { position: absolute !important; left: 0 !important; bottom: 5px !important; } @media (min-width: 640px) { .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript .siff-input-error { bottom: -3px !important; } } @media (min-width: 840px) { .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript .siff-input-error { bottom: 8px !important; } } @media (min-width: 1280px) { .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript .siff-input-error { bottom: 16px !important; } } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_importo_error { position: abslute; left: 0; top: 0; } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_importo_error_container_internal, .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_importo_error_center_back_image { top: 2px !important; left: 10px !important; } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_importo_error_container_internal img, .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_importo_error_center_back_image img { display: none !important; } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_importo_error_container_internal span, .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_importo_error_center_back_image span { background-image: none !important; background-color: none !important; color: #d50000 !important; width: 260px !important; font-size: 12px !important; } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_importo, .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_finalita { border: 0; border-radius: 0; border-bottom: 1px solid #9e9e9e; margin-bottom: 1px; color: #0d5c63; width: 100%; padding: 5px 0; height: 30px; background-color: transparent; font-size: 14px; } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_importo ::-moz-placeholder, .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript #findomestic_simulatore_javascript_finalita ::-moz-placeholder { color: #d1d1d1; } .mdl-card.fd-card-promo .fd-promo-right.fd-siffbox #findomestic_simulatore_javascript input::-moz-placeholder { color: #d1d1d1; } #tooltipTemp { z-index: 550 !important; position: absolute !important; margin-right: 30px; /* left:0 !important; right:0 !important; width:90% !important; margin:auto !important; */ } @media (min-width: 768px) { #tooltipTemp { /*width:94% !important;*/ } } @media (min-width: 1200px) { #tooltipTemp { /*width:($width-desktop)-300px !important;*/ } } #tooltipTemp #overlayCont { box-shadow: 0px 2px 4px #c7c7c7; background-color: #FFFFFF; z-index: 101; padding: 15px; text-align: left; } #tooltipTemp #overlayCont p, #tooltipTemp #overlayCont li { font-size: 12px; line-height: 14px; padding: 0 0 5px 0; } #tooltipTemp #overlayCont p:last-child, #tooltipTemp #overlayCont li:last-child { padding: 0; } #tooltipTemp #overlayCont ul { padding: 0 10px 10px 15px; list-style-type: circle; } #tooltipTemp #overlayCont ul li { list-style-type: circle; padding: 0; } main fnd-pp-sidebar .fd-bg-overlay { display: none; } main.visible-pp-sidebar { z-index: 3; overflow: visible; } main.visible-pp-sidebar fnd-pp-sidebar .fd-col-dx { display: block; } main.visible-pp-sidebar fnd-pp-sidebar .fd-col-dx.closed { display: block; } main.visible-pp-sidebar fnd-pp-sidebar .fd-bg-overlay { display: block; z-index: 2; } .mdl-button > span { display: block; padding: 13px 0 10px 0; } .mdl-button > span i { margin: -8px 5px 0 0; font-size: 27px; display: block; float: left; } @media all and (max-width: 640px) { .mdl-button > span span { display: none; } } .mdl-button.fnd-second-submit-btn { line-height: 20px; background-color: transparent; color: #00A258; padding: 10px 0px 10px 10px !important; } .mdl-button.fd-btn.fd-disabled { color: #004a2d; background-color: #5bba6f; } .mdl-button.fd-btn.fd-right { float: right; } fnd-pp-header .fd-header .mdl-layout__header-row .fd-logo { display: none; width: 190px; } @media all and (max-width: 640px) { fnd-pp-header .fd-header .mdl-layout__header-row .fd-logo { display: block; float: left; overflow: hidden; } } fnd-pp-header .fd-header .mdl-layout__header-row .fd-logo img { width: 160px; display: block; margin: 0 0 0 10px; height: 64px; } fnd-pp-header .fd-header .mdl-layout__header-row .fd-logo-claim { display: block; float: left; width: 190px; text-align: center; } @media all and (max-width: 640px) { fnd-pp-header .fd-header .mdl-layout__header-row .fd-logo-claim { display: none; } } fnd-pp-header .fd-header .mdl-layout__header-row .fd-logo-claim img { max-width: 160px; max-height: 64px; } fnd-pp-header .fd-header .mdl-layout__header-row .fd-logo-partner img { max-height: 45px; margin: 10px 20px 10px 0; } @media all and (max-width: 640px) { fnd-pp-header .fd-header .mdl-layout__header-row .fd-logo-partner img { margin: 10px 5px 10px 0; max-height: auto; max-width: 180px; } } @media all and (max-width: 320px) { fnd-pp-header .fd-header .mdl-layout__header-row .fd-logo-partner img { max-height: auto; max-width: 120px; } } /* container */ .fd-content-container { float: left; width: 100%; position: relative; } @media all and (min-width: 1280px) { .fd-content-container.fd-space-right { padding-right: 285px; } } .fd-content-container.fd-full-width { padding-left: 0; } fnd-pp-title-bar .fd-title-bar { min-height: auto; background-color: #00A258; } @media all and (min-width: 840px) { fnd-pp-title-bar .fd-title-bar.fd-h-fix { min-height: 180px; } } @media all and (max-width: 840px) { fnd-pp-title-bar .fd-title-bar.fd-h-fix { min-height: 130px; } } fnd-pp-title-bar .fd-title-bar.fd-h-fix-all { min-height: 80px; } @media all and (min-width: 840px) { fnd-pp-title-bar .fd-title-bar.fd-h-fix-all { min-height: 120px; } } fnd-pp-title-bar .fd-title-bar .fd-header-title { position: relative; } @media all and (min-width: 1281px) { fnd-pp-title-bar .fd-title-bar .fd-header-title { max-width: 1200px; margin: auto; } } @media all and (min-width: 840px) { fnd-pp-title-bar .fd-title-bar .fd-header-title { padding: 30px; } } @media all and (max-width: 840px) { fnd-pp-title-bar .fd-title-bar .fd-header-title { padding: 15px 30px; } } @media all and (max-width: 640px) { fnd-pp-title-bar .fd-title-bar .fd-header-title { padding: 15px 15px 0 15px; } } fnd-pp-title-bar .fd-title-bar .fd-header-title h1 { letter-spacing: 0 !important; display: block; float: left; font-family: "league_gothicregular", "Open Sans", arial, sans-serif; font-size: 49.5px; line-height: 44px; color: #FFFFFF; padding: 0 0 20px 0; text-transform: none; } @media all and (max-width: 840px) { fnd-pp-title-bar .fd-title-bar .fd-header-title h1 { font-size: 42px; line-height: 52px; padding: 0 0 15px 0; } } @media all and (max-width: 640px) { fnd-pp-title-bar .fd-title-bar .fd-header-title h1 { font-size: 31.5px; line-height: 28px; padding: 0 0 15px 0; } } @media all and (max-width: 640px) { fnd-pp-title-bar .fd-title-bar .fd-header-title h1.fd-hide { display: none; } } fnd-pp-title-bar .fd-title-bar .fd-header-title h1 a { color: #FFFFFF; } fnd-pp-title-bar .fd-title-bar .fd-header-title h1 a:hover { color: #FFFFFF; } fnd-pp-title-bar .fd-title-bar .fd-open-coldx { display: block; position: absolute; } @media all and (max-width: 840px) { fnd-pp-title-bar .fd-title-bar .fd-open-coldx { top: 35px; right: 30px; } } @media all and (max-width: 640px) { fnd-pp-title-bar .fd-title-bar .fd-open-coldx { top: 23px; right: 20px; } } fnd-pp-title-bar .fd-title-bar .fd-open-coldx a { display: block; color: #FFFFFF; text-transform: uppercase; font-size: 14px; font-family: "facitregular", "Open Sans", arial, sans-serif; opacity: 0.8 !important; filter: alpha(opacity=80) !important; } fnd-pp-title-bar .fd-title-bar .fd-open-coldx a:hover { opacity: 1 !important; filter: alpha(opacity=100) !important; } @media all and (min-width: 840px) { fnd-pp-title-bar .fd-title-bar .fd-open-coldx { top: 50px; right: 40px; } } @media all and (min-width: 1280px) { fnd-pp-title-bar .fd-title-bar .fd-open-coldx { display: none; } } fnd-pp-title-bar .fd-title-bar .fd-open-coldx-all { position: relative; } @media all and (min-width: 1281px) { fnd-pp-title-bar .fd-title-bar .fd-open-coldx-all { max-width: 1200px; margin: -20px auto 0 auto; } } @media all and (min-width: 840px) { fnd-pp-title-bar .fd-title-bar .fd-open-coldx-all { padding: 0 30px; margin-top: -15px; } } @media all and (max-width: 840px) { fnd-pp-title-bar .fd-title-bar .fd-open-coldx-all { padding: 0 30px; margin-top: -5px; } } @media all and (max-width: 640px) { fnd-pp-title-bar .fd-title-bar .fd-open-coldx-all { padding: 0 10px 0 0; } } fnd-pp-title-bar .fd-title-bar .fd-open-coldx-all a { display: block; float: right; color: #FFFFFF; text-transform: uppercase; font-size: 14px; font-family: "facitregular", "Open Sans", arial, sans-serif; opacity: 1; filter: alpha(opacity=100); padding: 10px; } fnd-pp-title-bar .fd-title-bar .fd-open-coldx-all a:hover { background-color: #1ea463; } fnd-pp-title-bar .fd-title-bar .fd-open-coldx-all a i { display: block; float: right; margin: -5px 0 0 5px; } .fd-progress-bar { background-color: #00A258; position: relative; padding: 20px 0; } @media all and (min-width: 840px) { .fd-progress-bar { padding: 20px 0 100px 0; } } @media all and (max-width: 840px) { .fd-progress-bar { background-color: transparent; padding-bottom: 40px; } } .fd-progress-bar .fd-bar { display: block; position: relative; z-index: 1; background-color: #5bba6f; width: 100%; box-shadow: 0 -1px 3px #999999; height: 10px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; } @media all and (min-width: 840px) { .fd-progress-bar .fd-bar { width: 100%; margin: auto; } } @media all and (min-width: 1281px) { .fd-progress-bar .fd-bar { margin: 0; width: 97.5%; float: right; } } @media all and (max-width: 840px) { .fd-progress-bar .fd-bar { height: 17px; background-color: #b9e4d0; box-shadow: none; } } .fd-progress-bar .fd-bar .fd-progress { position: absolute; z-index: 2; top: -2px; left: 0; height: 12px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; background-color: #f4f4f9; } @media all and (max-width: 840px) { .fd-progress-bar .fd-bar .fd-progress { top: 0; background-color: #00A258; height: 17px; } } .fd-progress-bar .fd-bar .fd-info { display: block; position: absolute; z-index: 3; top: -14px; } @media all and (max-width: 840px) { .fd-progress-bar .fd-bar .fd-info { top: -8px; } } .fd-progress-bar .fd-bar .fd-info .fd-label { position: absolute; top: 48px; color: #FFFFFF; font-size: 12px; white-space: nowrap; width: 400px; left: -200px; text-align: center; } @media all and (max-width: 840px) { .fd-progress-bar .fd-bar .fd-info .fd-label { color: #666666; } } .fd-progress-bar .fd-bar .fd-info .fd-percentage { background-color: #004a2d; width: 38px; height: 38px; text-align: center; line-height: 38px; color: #FFFFFF; font-size: 12px; margin-left: -19px; box-shadow: 4px 4px 5px #004a2d; } @media all and (max-width: 840px) { .fd-progress-bar .fd-bar .fd-info .fd-percentage { background-color: #5bba6f; box-shadow: 4px 4px 5px #c7c7c7; } } .fd-siff-element { position: relative; } .fd-siff-element li:first-child:before { content: ""; position: absolute; left: -50%; width: 200%; top: -20px; height: 60px; background-color: #00A258; display: block; } .sifflayout.fd-gray-arrow .fd-sel > a > i { color: rgba(0, 0, 0, 0.4); } .fd-siff { background-color: #00A258; position: relative; padding-bottom: 20px; z-index: 2; } @media all and (max-width: 640px) { .fd-siff { padding-bottom: 20px; } } @media all and (min-width: 840px) { .fd-siff { padding-bottom: 20px; } } .fd-siff .mdl-card { border: 0 !important; background-color: transparent; overflow: inherit; } @media all and (max-width: 640px) { .fd-siff .mdl-card.fd-siff-int { display: none; background-color: #3fb17b; margin-top: -3px; width: 110% !important; min-height: 100% !important; margin-left: -5% !important; } } .fd-siff .mdl-card.fd-siff-int .mdl-card__menu { display: none; } @media all and (max-width: 640px) { .fd-siff .mdl-card.fd-siff-int .mdl-card__menu { display: block; } } @media all and (max-width: 640px) { .fd-siff .mdl-card.fd-ecm { margin-top: 5px; display: block !important; background-color: transparent; min-height: auto; margin-left: 0 !important; } .fd-siff .mdl-card.fd-ecm .mdl-card__supporting-text { padding: 0; } .fd-siff .mdl-card.fd-ecm .fd-data { padding-top: 0; } .fd-siff .mdl-card.fd-ecm .mdl-textfield { width: auto; float: left; padding: 0 15px 0 0; } } .fd-siff .mdl-card .mdl-card__supporting-text { overflow: inherit; } .fd-siff .mdl-card .mdl-textfield { display: block; width: 33%; float: left; } @media all and (max-width: 640px) { .fd-siff .mdl-card .mdl-textfield { width: 100%; } } .fd-siff .mdl-button.fd-icon-close { position: absolute; top: 0; right: 0; display: block; width: 38px; height: 38px; min-height: auto !important; min-width: auto !important; border-radius: 50%; padding: 0 !important; -moz-border-radius: 50%; -webkit-border-radius: 50%; text-align: center; } .fd-siff .mdl-button.fd-icon-close i { display: block; font-weight: bold; color: #FFFFFF; } .fd-siff .mdl-button.fd-icon-close:hover { background-color: #FFFFFF; opacity: 0.5 !important; filter: alpha(opacity=50) !important; } .fd-siff .mdl-button.fd-icon-close:hover i { color: #00A258; } .fd-siff label { color: #FFFFFF; display: block; text-transform: uppercase; font-size: 12px; line-height: 20px; font-family: "facitregular", "Open Sans", arial, sans-serif; } .fd-siff .fd-data { padding: 10px 0 0 0; display: block; font-size: 16px; font-family: "facitregular", "Open Sans", arial, sans-serif; color: #FFFFFF; } .fd-siff .fd-sel { position: relative; } .fd-siff .fd-sel .fd-sel-option-active { position: relative; display: block; border-bottom: 1px solid #FFFFFF; height: 40px; line-height: 40px; font-size: 15px; width: 90%; color: #FFFFFF; text-transform: uppercase; padding: 0 20px 0 0; overflow: hidden; cursor: text; } @media all and (max-width: 640px) { .fd-siff .fd-sel .fd-sel-option-active { width: 100%; } } .fd-siff .fd-sel .fd-sel-option-active .fd-arrow { position: absolute; top: 10px; right: 0; } .fd-siff .fd-input { position: relative; } .fd-siff .fd-input .fd-euro { display: block; position: absolute; top: 11px; left: 0; font-size: 17px; color: #FFFFFF; } .fd-siff .fd-input .fd-update { position: absolute; right: 10%; top: 0; color: #FFFFFF; font-size: 12px; line-height: 14px; font-family: "facitregular", "Open Sans", arial, sans-serif; } @media all and (max-width: 640px) { .fd-siff .fd-input .fd-update { right: 0; } } .fd-siff .fd-sel-dropdown { width: 100%; display: none; float: left; position: absolute; top: -20px; left: 0; background-color: #FFFFFF; padding: 10px 5px; height: 300px; overflow: auto; z-index: 9999; } @media all and (max-width: 640px) { .fd-siff .fd-sel-dropdown { width: 80%; } } .fd-siff .fd-sel-dropdown ul { padding: 10px 0 0 0; } .fd-siff .fd-sel-dropdown ul > li { display: block; padding: 0 0 10px 0; } .fd-siff .fd-sel-dropdown span { display: block; color: #00A258; font-size: 13px; line-height: 20px; font-family: "facitsemibold", "Open Sans", arial, sans-serif; padding: 5px 10px; } .fd-siff .fd-sel-dropdown a { display: block; text-transform: uppercase; font-size: 15px; line-height: 20px; font-family: "facitlight", "Open Sans", arial, sans-serif; padding: 10px 5px; margin: 0 5px; } .fd-siff .fd-sel-dropdown a:hover, .fd-siff .fd-sel-dropdown a.active { background-color: #f4f4f9; } .fd-siff input { border: 0; border-radius: 0; border-bottom: 1px solid #FFFFFF; height: 40px; line-height: 20px; font-size: 15px; font-family: "facitlight", "Open Sans", arial, sans-serif; color: #FFFFFF; width: 90%; padding-left: 22px; padding-right: 80px; } @media all and (max-width: 640px) { .fd-siff input { width: 100%; } } .fd-siff input::-webkit-input-placeholder { color: #FFFFFF; font-family: "facitlight", "Open Sans", arial, sans-serif; opacity: 1; } .fd-siff input::-moz-placeholder { color: #FFFFFF; font-family: "facitlight", "Open Sans", arial, sans-serif; opacity: 1; } .fd-siff input:-ms-input-placeholder { color: #FFFFFF; font-family: "facitlight", "Open Sans", arial, sans-serif; opacity: 1; } .fd-siff input:-moz-placeholder { color: #FFFFFF; font-family: "facitlight", "Open Sans", arial, sans-serif; opacity: 1; } .fd-siff input:focus { -webkit-tap-highlight-color: transparent !important; -webkit-focus-ring-color: transparent !important; outline: none !important; } .fd-siff input[type=text]:focus, .fd-siff textarea:focus, .fd-siff select:focus { font-size: 15px; } .fd-siff .fd-checkbox .mdl-checkbox.is-upgraded .mdl-checkbox__box-outline { color: #FFFFFF !important; border: 2px solid #FFFFFF; } .fd-siff .fd-checkbox .mdl-checkbox.is-upgraded.is-checked .mdl-checkbox__box-outline .mdl-checkbox__tick-outline { background-color: #FFFFFF !important; } @media all and (min-width: 640px) { .fd-siff .fd-checkbox { padding: 30px 0 0 0; } } .fd-siff .fd-checkbox .mdl-checkbox__input { display: block; float: left; } .fd-siff .fd-checkbox .mdl-checkbox__label { font-size: 13px; font-family: "facitlight", "Open Sans", arial, sans-serif; color: #FFFFFF; display: block; float: left; } .fd-siff .fd-checkbox .icon-help { color: #FFFFFF; display: block; float: left; margin: 0 0 0 10px; } .fd-siff .fd-links { text-align: center; } @media all and (max-width: 640px) { .fd-siff .fd-links { margin-left: -10px; margin-right: -10px; } } @media all and (max-width: 640px) { .fd-siff .fd-links li { display: inline-block; text-align: center; } } .fd-siff .fd-links a { display: block; float: right; text-transform: uppercase; padding: 10px; color: #FFFFFF !important; font-size: 14px; line-height: 20px; font-family: "facitsemibold", "Open Sans", arial, sans-serif; opacity: 1; filter: alpha(opacity=100); } @media all and (max-width: 320px) { .fd-siff .fd-links a { font-size: 12px; } } .fd-siff .fd-links a:hover { background-color: #1ea463; } .fd-siff .fd-links a.fd-disabled { cursor: default; opacity: 0.5; filter: alpha(opacity=50); } .fd-siff .fd-links a.fd-disabled:hover { background-color: transparent; } .fd-siff .fd-links a.fd-toggle-siff-int { position: relative; padding-right: 25px; } @media all and (min-width: 640px) { .fd-siff .fd-links a.fd-toggle-siff-int { display: none; } } .fd-siff .fd-links a.fd-toggle-siff-int.fd-active { background-color: #3fb17b; } .fd-siff .fd-links a.fd-toggle-siff-int .fd-arrow { position: absolute; right: 0; top: 8px; } @media all and (min-width: 640px) { .fd-siff .fd-links { margin-top: -70px; text-align: right; } } .fd-content-container.fd-full-width .fd-content { max-width: 95%; padding: 0; display: flex; width: 100%; margin: 0 auto; flex-shrink: 0; } @media all and (min-width: 1281px) { .fd-content-container.fd-full-width .fd-content { max-width: 1120px; } } @media all and (min-width: 1280px) { .fd-hide-xl { display: none; } } .fd-col-dx { min-height: 100%; height: 100%; font-family: "facitregular", "Open Sans", arial, sans-serif; z-index: 889 !important; position: fixed; overflow: hidden; display: none; width: 300px; top: 0; background-color: #FFFFFF; border: 1px solid #e1e1e5; right: 0px !important; } .fd-col-dx.closed { display: none; } .fd-col-dx > .fd-scroll > fnd-card > br { display: none; } .fd-col-dx > .fd-scroll > fnd-card > .mdl-card { margin-bottom: 0; } @media all and (min-width: 1280px) { .fd-col-dx { right: 15px !important; display: block; padding: 15px 0 40px 0; top: 60px; position: fixed; z-index: 2 !important; } .fd-col-dx.closed { padding: 0; top: 0; display: none; height: 100%; z-index: 889 !important; width: 300px; top: 0; background-color: #FFFFFF; border: 1px solid #e1e1e5; right: 0 !important; } } .fd-col-dx .fd-scroll { overflow: scroll; height: 100%; width: 107%; padding-bottom: 60px; } @media all and (min-width: 320px) { .fd-col-dx .fd-scroll { width: 100%; } } .fd-col-dx .fd-btn-close-col { display: block; background-color: #0D5C63; width: 100%; } .fd-col-dx .fd-btn-close-col a { display: block; padding: 12px 15px; color: #FFFFFF; text-transform: uppercase; font-size: 20px; line-height: 25px; } .fd-col-dx .fd-btn-close-col a span { display: block; float: right; font-size: 30px; line-height: 22px; } @media all and (min-width: 1280px) { .fd-col-dx .fd-btn-close-col { display: none; } } @media all and (min-width: 1280px) { .fd-col-dx.closed .fd-btn-close-col { display: block; } } .fd-col-dx .mdl-card { border: 0; min-height: auto; } .fd-col-dx .mdl-card.fd-back-img { border-bottom: 1px solid #e1e1e5; padding-bottom: 15px !important; } @media all and (min-width: 1280px) { .fd-col-dx .mdl-card.fd-back-img { background: transparent url('back-pat-box-coldx.png') bottom left repeat-x; padding-bottom: 30px !important; border-bottom: 0; } } .fd-col-dx .mdl-card .mdl-card__title h2 { font-family: "facitsemibold", "Open Sans", arial, sans-serif; line-height: 20px; } .fd-col-dx .mdl-card .mdl-card__title.fd-title-col { display: none; } @media all and (min-width: 1280px) { .fd-col-dx .mdl-card .mdl-card__title.fd-title-col { display: block; } } .fd-col-dx .mdl-card .mdl-card__supporting-text { padding-top: 0 !important; padding-bottom: 0 !important; font-family: "facitlight", "Open Sans", arial, sans-serif; } .fd-col-dx .mdl-card .mdl-card__supporting-text .fd-icon-element { color: #0D5C63; margin: 0 0 10px 0; } .fd-col-dx .mdl-card .mdl-card__supporting-text .fd-icon-element i { font-size: 27px; display: block; float: left; color: #0D5C63; margin: 0 10px 0 0; } .fd-col-dx .mdl-card .mdl-card__supporting-text .fd-icon-element span { font-size: 13.5px; display: block; float: left; padding: 5px 0 0 0; } .fd-col-dx .mdl-card .mdl-card__supporting-text .fd-txt { padding: 0 0 20px 0; } .fd-col-dx .mdl-card .mdl-card__supporting-text .fd-toggle { display: block; float: left; width: 100%; padding-bottom: 20px; } .fd-col-dx .mdl-card .mdl-card__supporting-text .fd-toggle li { display: block; float: left; width: 100%; border-bottom: 1px solid #e1e1e5; margin-bottom: 15px; } .fd-col-dx .mdl-card .mdl-card__supporting-text .fd-toggle li .fd-link-toggle { display: block; color: #0D5C63; font-family: "facitsemibold", "Open Sans", arial, sans-serif; line-height: 20px; font-size: 16px; margin: 0 0 10px 0; } .fd-col-dx .mdl-card .mdl-card__supporting-text .fd-toggle li .fd-link-toggle:hover { color: #44a1a0; } .fd-col-dx .mdl-card .mdl-card__supporting-text .fd-toggle li .fd-link-toggle:hover .fd-arrow { color: #44a1a0; } .fd-col-dx .mdl-card .mdl-card__supporting-text .fd-toggle li .fd-link-toggle .fd-arrow { float: right; } .fd-col-dx .mdl-card .mdl-card__actions { padding-top: 0; } .fd-col-dx .mdl-card .mdl-data-table { display: block; float: left; border: 0; width: 260px; margin-top: 10px; white-space: inherit !important; } .fd-col-dx .mdl-card .mdl-data-table tbody tr { height: auto !important; } .fd-col-dx .mdl-card .mdl-data-table tbody tr:hover { background-color: transparent; cursor: default; } .fd-col-dx .mdl-card .mdl-data-table tbody tr th { border-bottom: 0; color: #1D3032; font-family: "facitlight", "Open Sans", arial, sans-serif; font-size: 13px; line-height: 16px; width: 135px; vertical-align: top; text-align: left; padding: 0 0 15px 0 !important; height: auto !important; } .fd-col-dx .mdl-card .mdl-data-table tbody tr td { text-align: left; padding: 0 0 15px 0 !important; border: 0; color: #999999; font-family: "facitsemibold", "Open Sans", arial, sans-serif; vertical-align: top; font-size: 13px; line-height: 16px; height: auto !important; width: 125px; } .fd-col-dx .mdl-card .mdl-data-table tbody tr td span { display: block; width: 125px; -ms-word-break: keep-all; word-break: keep-all; } .fd-col-dx .mdl-card .mdl-data-table tbody tr td span.fd-break-all { -ms-word-break: break-all; word-break: break-all; } .fd-content-container.fd-full-width .fd-above { overflow: inherit; z-index: 501; } @media all and (min-width: 841px) { .fd-content-container.fd-full-width .fd-above { margin-top: -50px; } } @media all and (max-width: 840px) { .fd-content-container.fd-full-width .fd-above { margin-top: -40px; } } @media all and (max-width: 640px) { .fd-content-container.fd-full-width fnd-steps-navigation { display: block; height: 40px; clear: both; } .fd-content-container.fd-full-width fnd-steps-navigation .mdl-card { display: none; } } @media all and (max-width: 840px) { .fd-content-container.fd-full-width fnd-steps-navigation { display: block; height: 40px; clear: both; } .fd-content-container.fd-full-width fnd-steps-navigation .mdl-card { display: none; } } .fd-content-container.fd-full-width .fd-siff-element li:first-child .fd-card-active { margin-top: 0; } .fd-content-container.fd-full-width .mdl-card.fd-card-lite { border: 0; background-color: transparent; } @media all and (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-lite { padding: 0 0 10px 0 !important; } } @media all and (max-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-lite { padding: 0 10px 10px 0; } } @media all and (min-width: 1281px) { .fd-content-container.fd-full-width .mdl-card.fd-card-lite { padding: 0 0 20px 30px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-lite.fd-full { padding: 20px !important; } @media all and (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-lite.fd-full { padding: 10px 0 !important; } } .fd-content-container.fd-full-width .mdl-card.fd-card-lite.fd-full .mdl-card__title { padding-top: 0 !important; } .fd-content-container.fd-full-width .mdl-card.fd-card-lite.fd-full .mdl-card__supporting-text { padding: 0 !important; } .fd-content-container.fd-full-width .mdl-card.fd-card-lite.fd-full .mdl-card__supporting-text .fd-txt { padding: 0 0 10px 0; color: #999999 !important; } .fd-content-container.fd-full-width .mdl-card.fd-card-lite.fd-full .mdl-card__supporting-text .fd-txt p { color: #1D3032 !important; } @media all and (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-lite.fd-full .mdl-card__supporting-text .fd-txt p { padding: 0 10px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-lite.fd-full .mdl-card__actions { padding: 0; margin: 0 0 0 -10px !important; } @media all and (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-lite.fd-full .mdl-card__actions { padding: 0 10px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-lite.fd-external-title .mdl-card__title h2 { clear: both; font-family: "facitregular", "Open Sans", arial, sans-serif; overflow: inherit; padding: 20px 15px; color: #999999; font-size: 21px; line-height: 25px; } .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__title { padding: 15px 0 0 0; } @media all and (min-width: 1280px) { .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__title { padding: 50px 0 0 0; } } @media all and (max-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__title.fd-hide-mobile-tablet { display: none; } } .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__title h2 { clear: both; font-family: "facitregular", "Open Sans", arial, sans-serif; font-size: 30px; line-height: 30px; overflow: inherit; color: #0D5C63; } @media all and (max-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__title h2 { font-size: 23px; line-height: 26px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__title h3 { color: #0D5C63; font-size: 17px; line-height: 20px; padding: 0 0 10px 0; } @media all and (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__title h3 { padding: 0 10px 10px 10px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__supporting-text { padding: 15px 0 0 0; } @media all and (max-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__supporting-text { padding: 5px 0 0 0; } } @media all and (min-width: 841px) { .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__supporting-text { padding: 15px 50px 0 0; } } .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__supporting-text p { color: #999999; font-size: 14px; line-height: 19px; } .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__supporting-text p.fd-big { color: #0D5C63; font-size: 18px; line-height: 23px; padding: 40px 0 0 0; } @media all and (max-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__supporting-text p.fd-big { padding: 0; } } .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions { padding: 15px 0 0 0; } .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step-vertical { display: none; } @media all and (min-width: 841px) { .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step-vertical { margin: 20px 0 0 0; width: 100%; display: block; float: left; border-bottom: 1px solid #e1e1e5; } } .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step-vertical li { width: 100%; display: block; float: left; background-color: #f4f4f9; border-top: 1px solid #e1e1e5; padding: 10px 0; } .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step-vertical li .fd-number { display: block; float: left; width: 30px; height: 30px; text-align: center; line-height: 32px; font-size: 13px; color: #FFFFFF; background-color: #c7c7c7; font-family: "facitregular", "Open Sans", arial, sans-serif; } .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step-vertical li .fd-number .material-icons { font-size: 16px; line-height: 30px; } .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step-vertical li .fd-label { padding: 0 0 0 10px; display: block; float: left; color: #c3c3c7; font-size: 14px; line-height: 32px; height: 30px; overflow: hidden; max-width: 87%; } .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step-vertical li.fd-active .fd-number { background-color: #0D5C63; } .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step-vertical li.fd-active .fd-label { color: #0D5C63; } .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step { float: left; width: 100%; } @media all and (min-width: 841px) { .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step { background: transparent url('_-node_modules-findomestic-ui-style-img-pp-back-line-vert.png') 15px top no-repeat; } } @media all and (max-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step { background: transparent url('_-node_modules-findomestic-ui-style-img-pp-back-line-orizz.png') left 19px no-repeat; } } .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step li { float: left; display: block; height: 35px; padding: 2px 0 0 0; background-color: #f4f4f9; margin: 0 0 25px 0; } @media all and (max-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step li { width: 43%; margin: 0; padding-left: 0; background-color: transparent; } .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step li .fd-ctn-step { float: left; background-color: #f4f4f9; padding: 0 5px; } .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step li:last-child { float: right; width: 77px; } } @media all and (min-width: 841px) { .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step li { width: 100%; } } @media all and (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step li { height: auto; width: 44%; margin: 0; padding-left: 0; } .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step li .fd-ctn-step { background-color: transparent; padding: 0; } .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step li:first-child { width: 42%; } .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step li:first-child .fd-number { margin: 0; } .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step li:last-child { width: 14% !important; } .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step li:last-child .fd-ctn-step { float: right; } .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step li:last-child .fd-number { margin: 0; } } .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step li:last-child { margin: 0; } .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step li .fd-number { display: block; float: left; width: 30px; height: 30px; text-align: center; line-height: 32px; font-size: 13px; color: #FFFFFF; background-color: #c7c7c7; font-family: "facitregular", "Open Sans", arial, sans-serif; } @media all and (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step li .fd-number { margin: 0 0 0 15px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step li .fd-number .material-icons { font-size: 16px; line-height: 30px; } .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step li .fd-label { padding: 0 0 0 10px; display: block; float: left; color: #c3c3c7; font-size: 14px; line-height: 32px; } .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step li .fd-label br { display: none; } @media all and (max-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step li .fd-label { padding: 0 0 0 7px; } } @media all and (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step li .fd-label { float: none; padding: 0 !important; } } .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step li.fd-active .fd-number { background-color: #0D5C63; } .fd-content-container.fd-full-width .mdl-card.fd-card-lite .mdl-card__actions .fd-step li.fd-active .fd-label { color: #0D5C63; } .fd-content-container.fd-full-width .mdl-card.fd-card-promo { background-color: #FFFFFF; position: relative; } @media all and (min-width: 1281px) { .fd-content-container.fd-full-width .mdl-card.fd-card-promo { margin-top: -40px; } } @media all and (max-width: 1280px) { .fd-content-container.fd-full-width .mdl-card.fd-card-promo { margin-top: -30px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-promo > .mdl-card__supporting-text { padding: 0; } .fd-content-container.fd-full-width .mdl-card.fd-card-promo .mdl-card__title .mdl-card__title-text { display: block; font-family: "facitsemibold", "Open Sans", arial, sans-serif; text-transform: uppercase; color: #009FE3; font-size: 22.5px; margin: auto; } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-promo .mdl-card__title .mdl-card__title-text { margin: 0; } } .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-left { background-color: #f4f4f9; display: block; float: left; width: 100%; padding: 16px; } @media all and (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-left { width: 55%; padding: 20px 20px 40px 20px; } } @media all and (min-width: 1280px) { .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-left { width: 65%; } } .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-left .fd-title { font-size: 19px; line-height: 20px; padding-bottom: 10px; font-family: "facitregular", "Open Sans", arial, sans-serif; color: #009FE3; } .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-left .fd-title.fd-orange { color: #ED6728; } .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-left .fd-title strong { display: block; font-family: "facitsemibold", "Open Sans", arial, sans-serif; font-size: 27px; line-height: 30px; padding-bottom: 7.5px; } @media all and (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-left .fd-title { font-size: 17px; line-height: 20px; } .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-left .fd-title strong { font-size: 22.5px; line-height: 24px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-left .fd-img { max-width: 100%; display: block; margin: 15px 0; width: auto; } .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-left .fd-txt { color: #0D5C63; font-size: 14px; line-height: 20px; padding: 0 15px 15px 0; } .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-left .fd-txt .fd-big { font-size: 18px; line-height: 20px; text-transform: uppercase; font-family: "facitregular", "Open Sans", arial, sans-serif; } .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-left .fd-txt ul { list-style: none; padding: 15px 15px 10px 0; } .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-left .fd-txt ul li { list-style: none; line-height: 20px; padding: 0 0 5px 0; } .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-left .fd-txt ul li:before { content: "•"; display: block; color: #999999; font-size: 60px; float: left; width: 20px; } .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-left .fd-info { text-transform: uppercase; color: #999999; font-size: 11px; line-height: 12px; display: block; } @media all and (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-left .fd-info { position: absolute; bottom: 20px; left: 20px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-left .fd-info i { display: block; float: left; } .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-left .fd-info span { display: block; float: left; padding: 5px 0 0 5px; } .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-left .fd-info:hover { color: #44a1a0; } .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-right { display: block; width: 100%; padding: 16px; float: right; border-top: 1px solid #e1e1e5; background-color: transparent; } @media all and (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-right { position: absolute; top: 0; right: 0; min-height: 100%; border-left: 1px solid #e1e1e5; width: 45%; padding-bottom: 40px; } } @media all and (min-width: 1280px) { .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-right { width: 35%; border-top: 0; } } .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-right h3 { font-family: "facitsemibold", "Open Sans", arial, sans-serif; color: #0D5C63; font-size: 18px; line-height: 20px; padding: 10px 0; } .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-right .fd-label { color: #0D5C63; display: block; float: left; } .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-right .fd-info-modal { display: block; float: left; margin: -12px 0 0 3.3333333333px; } .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-right .fd-info-modal i { color: #999999 !important; font-size: 22.5px; } .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-right .fd-link-icon { display: block; margin: 10px 0 0 0; font-size: 13px; line-height: 25px; } .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-right .fd-clear { height: auto; padding-top: 10px; } @media all and (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-right .fd-clear { padding-top: 35px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-right .fd-btn { clear: both; width: 100%; text-align: center; margin: 0; } @media all and (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-promo .fd-promo-right .fd-btn { position: absolute; bottom: 20px; right: 20px; width: auto; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff { position: relative; z-index: 1; padding: 70px 0 0 0; } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff { padding: 40px 0 0 0; } } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff { padding: 55px 0 0 0; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff:first-child { margin-top: 10px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff.fd-card-img { padding: 20px 0 0 0; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff.fd-card-active { margin-top: 20px; margin-bottom: 20px; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff.fd-card-link { padding: 0; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff > .mdl-card__supporting-text { padding: 0; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-promo { display: block; position: absolute; right: 0; top: 0; width: 26%; min-height: 100% !important; background-color: #f4f4f9; } @media (min-width: 1280px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-promo { width: 21%; } } @media (max-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-promo { width: 100%; left: 0; min-height: 55px !important; } } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-promo { background-color: transparent; border-top: 10px solid #cfdcde; min-height: 45px !important; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-promo h2 { float: left; font-family: "facitlight", "Open Sans", arial, sans-serif; font-size: 19.5px; line-height: 46px; color: #0D5C63; } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-promo h2 { display: none; } } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-promo h2 { clear: both; float: none; margin: 30px 60px 20px 20px; font-size: 28px; line-height: 36px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-promo p { display: none; padding: 0 20px; font-size: 12px; line-height: 18px; color: #0D5C63; } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-promo p { display: block; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-promo .fd-desc { padding: 0 20px; font-size: 15px; color: #999999; } @media (max-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-promo .fd-desc { display: none; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-promo .fd-desc p { padding: 0; margin: 0; font-size: 15px; color: #999999; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-promo .fd-icon { display: block; background: transparent url('back-cockade.png') top left no-repeat; background-size: 35px auto; width: 35px; height: 48px; text-align: center; padding: 10px 0 0 0; float: left; margin: 0 10px 0 20px; } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-promo .fd-icon { background-position: left -13px !important; padding: 3px 0 0 0; } } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-promo .fd-icon { float: none; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-promo .fd-icon i { display: block; margin: auto; color: #0D5C63; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-img { display: block; position: absolute; right: 0; top: 30px; width: 30%; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-img img { display: block; width: 80%; margin: auto; } @media (min-width: 1280px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-img { width: 26%; } } @media (max-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-img { width: 30%; right: 0; top: 150px; } } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-img { position: relative; margin: auto; width: 80%; left: 0; right: 0; top: inherit; } } @media (max-width: 540px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-img { width: 100%; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-arrow { position: absolute; right: 10px; top: 10px; z-index: 101; } @media (max-width: 540px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-arrow { right: 5px; } } @media (max-width: 320px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-arrow { right: 0; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-arrow a i { font-size: 30px; font-weight: bold; color: #c3c3c7; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-arrow a:hover i { color: #FFFFFF; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate p { width: 50%; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts p { width: auto; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts .fd-label { margin: 0 15px 0 2px; } @media (max-width: 540px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts .fd-label { margin: 0 5px 0 2px; } } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts .fd-label { margin: 0 5px 0 2px; } } @media (min-width: 1280px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts .fd-label { margin: 0 15px 0 2px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate { display: block; float: left; width: 33%; padding: 0 10px; } @media (max-width: 320px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate { padding: 0 5px; } } @media (max-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate { width: 50%; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts p, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate p { font-family: "league_gothicregular", "Open Sans", arial, sans-serif; display: block; float: left; text-transform: uppercase; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts p span, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate p span { display: inline-block; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts p .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate p .fd-number { font-size: 64.5px; line-height: 76px; } @media (max-width: 540px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts p .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate p .fd-number { font-size: 30px; line-height: 40px; } } @media (max-width: 320px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts p .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate p .fd-number { font-size: 30px; line-height: 40px; } } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts p .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate p .fd-number { font-size: 60px; line-height: 72px; } } @media (min-width: 1280px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts p .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate p .fd-number { font-size: 82.5px; line-height: 110px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts p .fd-simbol, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate p .fd-simbol { font-size: 37.5px; } @media (max-width: 540px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts p .fd-simbol, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate p .fd-simbol { font-size: 22.5px; } } @media (max-width: 320px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts p .fd-simbol, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate p .fd-simbol { font-size: 18px; } } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts p .fd-simbol, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate p .fd-simbol { font-size: 37.5px; } } @media (min-width: 1280px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts p .fd-simbol, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate p .fd-simbol { font-size: 42px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts p .fd-label, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate p .fd-label { font-family: "facitregular", "Open Sans", arial, sans-serif; font-size: 18px; } @media (max-width: 540px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts p .fd-label, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate p .fd-label { font-size: 10px; } } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts p .fd-label, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate p .fd-label { font-size: 18px; } } @media (min-width: 1280px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts p .fd-label, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate p .fd-label { font-size: 18px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts { border-right: 1px solid #e1e1e5; padding: 0 0 0 20px; } @media (max-width: 320px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts { padding: 0 0 0 10px; } } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts.fd-label-rateMobileEvoluto { padding-left: 3%; padding-right: 5%; width: 40%; } } @media (min-width: 640px) and (max-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts.fd-label-rateMobileEvoluto { width: 45%; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts p.fd-varInstall { padding-left: 25%; } @media (min-width: 540px) and (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts p.fd-varInstall .fd-number { font-size: 49px; } } @media (max-width: 340px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts p.fd-varInstall .fd-number { font-size: 26px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts p .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts p .fd-simbol, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts p .fd-label { color: #009FE3; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts.fd-fix-color p .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts.fd-fix-color p .fd-simbol, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-amounts.fd-fix-color p .fd-label { color: #0D5C63; } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate { padding: 0; } } @media (min-width: 1280px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate { width: 40%; } } @media (min-width: 1280px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate.fd-label-Evoluto { padding-right: 10%; } } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate.fd-label-Evoluto { width: 50%; } } @media (min-width: 640px) and (max-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate.fd-label-Evoluto { width: 45%; padding-left: 7%; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate p { text-align: center; } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate p { text-align: right; } } @media (min-width: 1280px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate p { padding: 0 10px 0 0; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate p .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate p .fd-simbol, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate p .fd-label { color: #0D5C63; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate p .fd-label { display: block; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-fasi { clear: both; padding: 0 0 40px 0; } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-fasi { padding: 20px 0; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-fasi p { font-size: 14px !important; line-height: 20px !important; padding: 0 16px 20px 20px; } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-fasi p { text-align: center; padding: 0 16px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-fasi p.fd-fasi-label { display: block; font-size: 17px !important; line-height: 22px !important; font-family: "facitsemibold", "Open Sans", arial, sans-serif; color: #009FE3; } @media (min-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-fasi p.fd-fasi-label { padding-top: 15px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-fasi p.fd-small { font-size: 13px !important; line-height: 16px !important; } @media (max-width: 540px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-fasi p.fd-small { font-size: 12px !important; line-height: 14px !important; } } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-fasi p.fd-small br { display: none; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-fasi .parent-container { width: 81%; padding: 0 15px 0 20px; display: flex; flex-direction: row; flex-wrap: wrap; } @media (min-width: 640px) and (max-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-fasi .parent-container { width: 101%; padding: 0 0px 0 20px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-fasi .parent-container .child-container { display: flex; width: 33%; min-height: 100px; margin: 10px 0px 10px 0px; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-fasi .parent-container .child-container .items-var-rate { background-color: #f4f4f9; width: 90%; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-fasi .parent-container .child-container .items-var-rate .var-rate-detail { padding: 18px; color: #0D5C63; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-fasi .parent-container .child-container .items-var-rate .var-rate-detail sup { vertical-align: super; font-size: smaller; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-fasi .parent-container .child-container i.arrow-right { align-self: center; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-fasi.mobile-layout .fd-fasi-label { padding-bottom: 20px; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-fasi.mobile-layout .parent-container { padding: 0 20px 0 20px; width: 100%; flex-direction: column; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-fasi.mobile-layout .parent-container .child-container { flex-direction: column; width: 100%; margin: 0px; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-fasi.mobile-layout .parent-container .child-container .items-var-rate { width: 100%; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-txt { clear: both; padding: 0 0 40px 0; } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-txt { padding: 20px 0; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-txt.fd-txt-img { padding: 0; } @media (max-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-txt.fd-txt-img { padding: 0 31% 10px 0; } } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-txt.fd-txt-img { padding: 20px 0; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-txt.fd-fix-color p.fd-amount-total { color: #0D5C63; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-txt h3 { color: #0D5C63; font-size: 18px; line-height: 20px; font-family: "facitregular", "Open Sans", arial, sans-serif; padding: 20px 16px 10px 20px; } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-txt h3 { padding: 0 16px 10px 15px; text-align: center; } } @media (max-width: 540px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-txt h3 { margin-top: -10px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-txt p { font-size: 14px !important; line-height: 20px !important; padding: 0 16px 20px 20px; } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-txt p { text-align: center; padding: 0 16px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-txt p.fd-amount-total { display: block; font-size: 15px !important; line-height: 22px !important; font-family: "facitsemibold", "Open Sans", arial, sans-serif; color: #009FE3; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-txt p.fd-small { font-size: 13px !important; line-height: 16px !important; } @media (max-width: 540px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-txt p.fd-small { font-size: 12px !important; line-height: 14px !important; } } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-txt p.fd-small br { display: none; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .mdl-card__actions .fd-codicepass { width: 100%; height: 40px; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .mdl-card__actions .fd-codicepass .fd-link-variant { padding-left: 14px; } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .mdl-card__actions .fd-codicepass .fd-link-variant { padding-left: 0; float: none; } } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .mdl-card__actions .fd-codicepass { height: 60px; text-align: center; } } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .mdl-card__actions { padding-left: 4px; } } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .mdl-card__actions.selected { width: 73%; } } @media (min-width: 1280px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .mdl-card__actions.selected { width: 78%; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .mdl-card__actions.fd-w-max { width: 100%; } @media all and (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .mdl-card__actions.fd-w-max .fd-button { width: 100%; text-align: center; padding: 10px 0 0 0 !important; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .mdl-card__actions.fd-w-max .mdl-button { width: 100%; text-align: center !important; margin: 0 0 10px 0 !important; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .mdl-card__actions.fd-w-max .mdl-button.fd-primary > span { padding: 10px !important; } } @media (max-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .mdl-card__actions .mdl-button.fd-primary { margin: 0 !important; } } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .mdl-card__actions .mdl-button.fd-primary { min-width: 40px !important; max-width: 35px !important; height: 33px !important; padding: 2px !important; text-align: center; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .mdl-card__actions .mdl-button.fd-primary > span { padding: 5px 0 0 0 !important; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .mdl-card__actions .mdl-button.fd-primary i { font-size: 33px; float: none; margin: auto; color: #00A258; margin-bottom: 10px; } } @media (max-width: 540px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .mdl-card__actions .mdl-button { margin: 0 !important; padding-left: 15px; padding-right: 15px; } } @media (max-width: 320px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .mdl-card__actions .mdl-button { padding-left: 10px; padding-right: 10px; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .mdl-card__actions .mdl-button.fd-primary { min-width: 30px !important; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .mdl-card__actions .fd-link-variant { cursor: pointer; float: left; padding: 10px 0 10px 16px; color: #999999; font-size: 14px; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .mdl-card__actions .fd-link-variant:hover { color: #44a1a0; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .mdl-card__actions .fd-button { display: block; float: right; padding: 0 0 10px 0; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .mdl-card__actions .fd-button .mdl-button { float: right; margin: 0 0 0 10px; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .mdl-card__actions .fd-button .mdl-button.fd-btn { margin: 0 10px; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .mdl-card__actions .fd-button.fd-w-max fnd-button { width: 100%; float: right; } @media all and (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .mdl-card__actions .fd-button.fd-w-max { float: none !important; width: 98% !important; margin: auto; text-align: center; } } @media all and (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .mdl-card__actions .fd-button.fd-w-max .mdl-button { display: block !important; width: 100% !important; text-align: center; margin: 0 0 10px 0 !important; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link { padding: 10px 15px 10px 0; border-left: 10px solid #FFFFFF; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link:hover { background-color: #FFFFFF; border-left: 10px solid #009FE3; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link:hover .fd-arrow i { color: #009FE3; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-arrow { position: absolute; right: 10px; top: 35%; z-index: 101; } @media (max-width: 540px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-arrow { right: 5px; } } @media (max-width: 320px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-arrow { right: 0; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-arrow i { font-size: 30px; font-weight: bold; color: #c3c3c7; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-promo { z-index: 98; } @media (max-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-promo { display: block; position: absolute; left: inherit; right: 0; top: 0; min-height: 100% !important; background-color: #f4f4f9; width: 23%; } } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-promo { min-height: 1px !important; border-top: 7px solid #cfdcde; background-color: transparent; width: 100%; right: inherit; left: 0; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-promo h2 { font-size: 16px !important; line-height: 16px !important; font-family: "facitregular", "Open Sans", arial, sans-serif; position: absolute; top: -20px; left: 50px; padding-right: 100px; } @media (max-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-promo h2 { top: 10px; left: 60px; font-size: 15px !important; line-height: 18px !important; } } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-promo h2 { display: none; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-promo p { display: none; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-promo .fd-icon { position: absolute; top: 0; left: 0; } @media (max-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-promo .fd-icon { left: -10px; } } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-promo .fd-icon { display: none; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-amounts, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-rate { width: 38%; } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-amounts, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-rate { width: 46%; } } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-amounts, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-rate { width: 30%; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-amounts p .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-rate p .fd-number { font-size: 52.5px; line-height: 60px; } @media (max-width: 540px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-amounts p .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-rate p .fd-number { font-size: 25.5px; line-height: 40px; } } @media (max-width: 320px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-amounts p .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-rate p .fd-number { font-size: 30px; line-height: 36px; } } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-amounts p .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-rate p .fd-number { font-size: 49.5px; line-height: 60px; } } @media (min-width: 1280px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-amounts p .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-rate p .fd-number { font-size: 52.5px; line-height: 60px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-amounts p .fd-simbol, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-rate p .fd-simbol { font-size: 30px; } @media (max-width: 540px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-amounts p .fd-simbol, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-rate p .fd-simbol { font-size: 17px; } } @media (max-width: 320px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-amounts p .fd-simbol, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-rate p .fd-simbol { font-size: 18px; } } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-amounts p .fd-simbol, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-rate p .fd-simbol { font-size: 27px; } } @media (min-width: 1280px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-amounts p .fd-simbol, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-rate p .fd-simbol { font-size: 30px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-amounts p .fd-label, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-rate p .fd-label { font-family: "facitregular", "Open Sans", arial, sans-serif; font-size: 16px; } @media (max-width: 540px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-amounts p .fd-label, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-rate p .fd-label { font-size: 10px; } } @media (max-width: 320px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-amounts p .fd-label, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-rate p .fd-label { font-size: 9px; } } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-amounts p .fd-label, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-rate p .fd-label { font-size: 13.5px; } } @media (min-width: 1280px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-amounts p .fd-label, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-rate p .fd-label { font-size: 17px; } } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-amounts { padding-left: 10px; } } @media (max-width: 320px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-amounts { padding-left: 5px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-rate { width: 39%; } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-rate { width: 53%; } } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-rate { width: 40%; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-rate p .fd-label { display: inline; padding: 0 0 0 5px; } @media (max-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .fd-siff-rate p .fd-label { display: block; } } .fd-content-container.fd-full-width .mdl-card.fd-card-offerts { position: relative; z-index: 1; padding: 25px 0 0 0; margin-bottom: 10px; } .fd-content-container.fd-full-width .mdl-card.fd-card-offerts > .mdl-card__supporting-text { padding: 0; } .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-rate, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance { display: block; float: left; padding: 0 10px; } .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-rate p, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance p { font-family: "league_gothicregular", "Open Sans", arial, sans-serif; display: block; float: left; text-transform: uppercase; } .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p span, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-rate p span, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance p span { display: inline-block; } .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p .fd-element, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-rate p .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-rate p .fd-element, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance p .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance p .fd-element { font-size: 60px; line-height: 80px; } @media (max-width: 540px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p .fd-element, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-rate p .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-rate p .fd-element, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance p .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance p .fd-element { font-size: 45px; line-height: 56px; } } @media (max-width: 320px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p .fd-element, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-rate p .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-rate p .fd-element, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance p .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance p .fd-element { font-size: 30px; line-height: 36px; } } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p .fd-element, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-rate p .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-rate p .fd-element, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance p .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance p .fd-element { font-size: 37.5px; line-height: 44px; } } @media (min-width: 1280px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p .fd-element, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-rate p .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-rate p .fd-element, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance p .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance p .fd-element { font-size: 49.5px; line-height: 56px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p .fd-simbol, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-rate p .fd-simbol, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance p .fd-simbol { font-size: 22.5px; } @media (max-width: 540px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p .fd-simbol, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-rate p .fd-simbol, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance p .fd-simbol { font-size: 27px; } } @media (max-width: 320px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p .fd-simbol, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-rate p .fd-simbol, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance p .fd-simbol { font-size: 18px; } } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p .fd-simbol, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-rate p .fd-simbol, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance p .fd-simbol { font-size: 27px; } } @media (min-width: 1280px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p .fd-simbol, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-rate p .fd-simbol, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance p .fd-simbol { font-size: 33px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p .fd-label, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-rate p .fd-label, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance p .fd-label { display: block; font-family: "facitsemibold", "Open Sans", arial, sans-serif; font-size: 16px; letter-spacing: -0.8px !important; } @media (max-width: 540px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p .fd-label, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-rate p .fd-label, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance p .fd-label { font-size: 13.8px; } } @media (max-width: 320px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p .fd-label, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-rate p .fd-label, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance p .fd-label { font-size: 12px; } } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p .fd-label, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-rate p .fd-label, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance p .fd-label { font-size: 14px; } } @media (min-width: 1280px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p .fd-label, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-rate p .fd-label, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance p .fd-label { font-size: 16px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts { padding: 0 30px 10px 30px; margin: 0 0 20px 0; width: 100%; border-bottom: 1px solid #e1e1e5; clear: both; } @media (max-width: 320px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts { padding: 0 10px 10px 10px; } } @media (max-width: 540px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts { padding: 0 10px 10px 10px; } } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts { padding: 0 0 0 20px; margin: 0; border-bottom: 0; border-right: 1px solid #e1e1e5; width: 44%; } } .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p { width: 25%; } @media (min-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p { width: 32%; } } @media (min-width: 320px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p { width: 32%; } } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p { width: 26%; } } @media (min-width: 1280px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p { width: 23%; } } .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p:first-child { width: 50%; } @media (min-width: 320px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p:first-child { width: 48%; } } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p:first-child { width: 48%; } } @media (min-width: 1280px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p:first-child { width: 46%; } } .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p:last-child { text-align: right; width: 20%; } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p:last-child { text-align: center; } } .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p .fd-simbol, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-amounts p .fd-label { color: #009FE3; } .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-rate { width: 60%; } @media (min-width: 320px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-rate { width: 50%; } } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-rate { width: 26%; } } .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-rate p { width: 50%; text-align: center; } .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-rate p .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-rate p .fd-simbol, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-rate p .fd-label { color: #0D5C63; } .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance { width: 40%; } @media (min-width: 320px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance { width: 50%; } } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance { border-left: 1px solid #e1e1e5; width: 30%; } } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance p { padding: 0 0 0 15%; } } @media (max-width: 320px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance p { padding: 0; } } .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance p .fd-label, .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance p .fd-element { color: #009FE3; } @media (max-width: 540px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance p .fd-element { font-size: 33px; line-height: 40px; } } @media (max-width: 320px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-insurance p .fd-element { font-size: 30px; line-height: 40px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-txt { clear: both; padding: 20px 0 0 0; } .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-txt p { font-size: 14px !important; line-height: 20px !important; padding: 0 16px 10px 20px; } @media (max-width: 540px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-txt p { padding: 0 16px 10px 15px; } } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .fd-siff-txt p { padding: 0 16px 10px 20px; } } @media (max-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .mdl-card__actions .mdl-button.fd-primary { margin: 0 !important; } } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .mdl-card__actions .mdl-button.fd-primary { min-width: 40px !important; max-width: 35px !important; height: 33px !important; padding: 2px !important; text-align: center; } .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .mdl-card__actions .mdl-button.fd-primary > span { padding: 5px 0 0 0 !important; } .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .mdl-card__actions .mdl-button.fd-primary i { font-size: 33px; float: none; margin: auto; color: #00A258; margin-bottom: 10px; } } @media (max-width: 540px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .mdl-card__actions .mdl-button { margin: 0 !important; padding-left: 15px; padding-right: 15px; } } @media (max-width: 320px) { .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .mdl-card__actions .mdl-button { padding-left: 10px; padding-right: 10px; } .fd-content-container.fd-full-width .mdl-card.fd-card-offerts .mdl-card__actions .mdl-button.fd-primary { min-width: 30px !important; } } .fd-content-container.fd-full-width .mdl-card .mdl-card__menu { top: 10px; right: 10px; } .fd-content-container.fd-full-width .mdl-card .mdl-card__supporting-text.fd-checkbox-special { padding: 0 0 20px 0; } .fd-content-container.fd-full-width .mdl-card .mdl-card__supporting-text.fd-checkbox-special .fd-tit-frm-group { padding: 20px 16px 5px 16px; font-size: 14px; line-height: 20px; color: #0D5C63; font-family: "facitsemibold", "Open Sans", arial, sans-serif; } .fd-content-container.fd-full-width .mdl-card .mdl-card__supporting-text .fd-listing li { border-bottom: 1px solid #e1e1e5; padding: 20px 0 10px 0; font-size: 12px; color: #999999; line-height: 16px; font-family: "facitlight", "Open Sans", arial, sans-serif; } .fd-content-container.fd-full-width .mdl-card .mdl-card__supporting-text .fd-listing li p { overflow: hidden; display: block; float: left; } @media all and (max-width: 1180px) { .fd-content-container.fd-full-width .mdl-card .mdl-card__supporting-text .fd-listing li p { width: 50%; } } @media all and (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card .mdl-card__supporting-text .fd-listing li p { float: none; width: auto; } } .fd-content-container.fd-full-width .mdl-card .mdl-card__supporting-text .fd-listing li p span { display: block; font-size: 14px; color: #0D5C63; line-height: 20px; font-family: "facitregular", "Open Sans", arial, sans-serif; } .fd-content-container.fd-full-width .mdl-card .mdl-card__supporting-text .fd-listing li p span.fd-small { font-family: "facitlight", "Open Sans", arial, sans-serif; padding: 10px 0 0 0; } .fd-content-container.fd-full-width .mdl-card .mdl-card__supporting-text .fd-listing li .fd-check { display: block; float: left; color: #5bba6f; margin: 0 5px 0 0; } .fd-content-container.fd-full-width .mdl-card .mdl-card__supporting-text .fd-listing li .mdl-button { display: block; float: right; margin: -10px 0 0 10px; } @media all and (max-width: 1180px) { .fd-content-container.fd-full-width .mdl-card .mdl-card__supporting-text .fd-listing li .mdl-button { margin: 0; } } @media all and (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card .mdl-card__supporting-text .fd-listing li .mdl-button { margin: 10px 0 0 0; text-align: center; min-width: auto !important; } .fd-content-container.fd-full-width .mdl-card .mdl-card__supporting-text .fd-listing li .mdl-button.fd-first { float: left; } } @media all and (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card .mdl-card__supporting-text .fd-listing li .mdl-button .fd-label-btn { display: none; } } @media all and (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card .mdl-card__supporting-text .fd-listing li .mdl-button i { display: block; } } .fd-content-container.fd-full-width .mdl-card .mdl-card__supporting-text .fd-listing li .mdl-button i.fd-icon { display: block !important; } .fd-content-container.fd-full-width .mdl-card .fd-box-outcome { width: 100%; float: left; } .fd-content-container.fd-full-width .mdl-card .fd-box-outcome .fd-msg { display: table; } .fd-content-container.fd-full-width .mdl-card .fd-box-outcome .fd-msg .fd-circular { display: block; float: left; } .fd-content-container.fd-full-width .mdl-card .fd-box-outcome .fd-msg .fd-circular i { font-weight: 800; color: #FFFFFF; font-size: 60px; line-height: 80px; background-color: #00A258; width: 80px; height: 80px; text-align: center; overflow: hidden; } @media all and (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card .fd-box-outcome .fd-msg .fd-circular i { width: 70px; height: 70px; font-size: 52.5px; line-height: 70px; } } .fd-content-container.fd-full-width .mdl-card .fd-box-outcome .fd-msg .fd-circular.fd-nobg i { background-color: transparent; color: #0D5C63; font-size: 78px; line-height: auto; width: auto; height: auto; } .fd-content-container.fd-full-width .mdl-card .fd-box-outcome .fd-msg .fd-ctn-msg { padding: 0 0 0 15px; display: table-cell; vertical-align: middle; } .fd-content-container.fd-full-width .mdl-card .fd-box-outcome .fd-msg .fd-ctn-msg p { color: #1D3032; font-size: 15px; line-height: 20px; padding: 0 0 10px 0; display: block; } .fd-content-container.fd-full-width .mdl-card .fd-box-outcome .fd-msg .fd-ctn-msg p.fd-msg-major { font-size: 15px; font-family: "facitsemibold", "Open Sans", arial, sans-serif; } .fd-content-container.fd-full-width .mdl-card .fd-box-outcome .fd-msg .fd-ctn-msg p.fd-focus { color: #00A258 !important; } .fd-content-container.fd-full-width .mdl-card .fd-box-outcome .fd-msg.fd-variant { display: block; } .fd-content-container.fd-full-width .mdl-card .fd-box-outcome .fd-msg.fd-variant .fd-circular { display: block; float: left; } .fd-content-container.fd-full-width .mdl-card .fd-box-outcome .fd-msg.fd-variant .fd-circular i { background-color: transparent; font-size: 45px; line-height: 40px; color: #0D5C63; width: auto; height: auto; } @media all and (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card .fd-box-outcome .fd-msg.fd-variant .fd-circular i { font-size: 37.5px; line-height: 30px; } } .fd-content-container.fd-full-width .mdl-card .fd-box-outcome .fd-msg.fd-variant .fd-ctn-msg { padding: 0 0 0 15px; } .fd-content-container.fd-full-width .mdl-card .fd-box-outcome .fd-msg.fd-variant .fd-ctn-msg p { color: #0D5C63; font-size: 14px; line-height: 18px; padding: 0 0 10px 0; } .fd-content-container.fd-full-width .mdl-card .fd-box-outcome .fd-msg.fd-variant .fd-ctn-msg p.fd-msg-major { font-size: 21px; line-height: 26px; font-family: "facitsemibold", "Open Sans", arial, sans-serif; } .fd-content-container.fd-full-width .mdl-card .fd-box-outcome .fd-msg.fd-variant .fd-ctn-msg p.fd-msg-major span { display: block; padding: 5px 0 0 0; color: #44a1a0; font-size: 18px; line-height: 20px; font-family: "facitregular", "Open Sans", arial, sans-serif; } .fd-content-container.fd-full-width .mdl-card .fd-box-outcome .fd-msg.fd-variant-big { display: block; } .fd-content-container.fd-full-width .mdl-card .fd-box-outcome .fd-msg.fd-variant-big .fd-img-icon { display: block; float: left; width: 80px; height: 80px; } .fd-content-container.fd-full-width .mdl-card .fd-box-outcome .fd-msg.fd-variant-big .fd-img-icon img { display: block; width: 100%; } @media all and (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card .fd-box-outcome .fd-msg.fd-variant-big .fd-img-icon { width: 70px; height: 70px; } } .fd-content-container.fd-full-width .mdl-card .fd-box-outcome .fd-msg.fd-variant-big .fd-ctn-msg { padding: 0 0 0 15px; } .fd-content-container.fd-full-width .mdl-card .fd-box-outcome .fd-msg.fd-variant-big .fd-ctn-msg p { color: #0D5C63; font-size: 14px; line-height: 18px; padding: 0 0 10px 0; } .fd-content-container.fd-full-width .mdl-card .fd-box-outcome .fd-msg.fd-variant-big .fd-ctn-msg p.fd-msg-major { font-size: 25.5px; line-height: 30px; font-family: "facitsemibold", "Open Sans", arial, sans-serif; } .fd-content-container.fd-full-width .mdl-card .fd-box-outcome .fd-msg.fd-variant-big .fd-ctn-msg p.fd-msg-major span { display: block; padding: 10px 0 0 0; color: #0D5C63; font-size: 21px; line-height: 24px; font-family: "facitregular", "Open Sans", arial, sans-serif; } .fd-content-container.fd-full-width .mdl-card .fd-box-outcome .fd-msg p { display: block; } .fd-content-container.fd-full-width .mdl-card .fd-box-outcome .fd-ctn { clear: both; margin-left: 95px; padding: 10px 0; } @media all and (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card .fd-box-outcome .fd-ctn { margin-left: 0; padding: 20px 0 10px 0; } } .fd-content-container.fd-full-width .mdl-card .fd-box-outcome .fd-ctn h3 { color: #0D5C63; font-size: 18px; font-family: "facitsemibold", "Open Sans", arial, sans-serif; padding: 0 0 20px 0; } .fd-content-container.fd-full-width .mdl-card .fd-box-outcome .fd-ctn p { padding: 0 0 20px 0; color: #1D3032; font-size: 14px; line-height: 17px; } .mdl-dialog__content .fd-box-outcome { width: 100%; float: left; } .mdl-dialog__content .fd-box-outcome .fd-msg { display: table; } .mdl-dialog__content .fd-box-outcome .fd-msg .fd-circular { display: block; float: left; } .mdl-dialog__content .fd-box-outcome .fd-msg .fd-circular i { font-weight: 800; color: #FFFFFF; font-size: 45px; line-height: 60px; width: 60px; height: 60px; background-color: #00A258; text-align: center; overflow: hidden; } .mdl-dialog__content .fd-box-outcome .fd-msg .fd-ctn-msg { padding: 0 0 0 15px; display: table-cell; vertical-align: middle; } /* spinner */ .fd-spinner { position: absolute; top: 50%; bottom: 50%; left: 0; right: 0; margin: auto; width: 60px; height: 60px; } .fd-spinner .mdl-spinner { width: 60px; height: 60px; } .fd-spinner .mdl-spinner .mdl-spinner__circle { border-width: 6px; border-color: #007136; } /* Form */ .fd-ctn-frm .fd-radio-ctn.fd-special-focus, .fd-ctn-frm .fd-radio-ctn.fd-special-active, .fd-ctn-frm .fd-radio-ctn.fd-special-disabled, .fd-ctn-frm .fd-checkbox-ctn.fd-special-focus, .fd-ctn-frm .fd-checkbox-ctn.fd-special-active, .fd-ctn-frm .fd-checkbox-ctn.fd-special-disabled { padding: 10px 10px 10px 16px; width: 100%; display: block; float: left; margin: 0; border-bottom: 1px solid #e1e1e5; } .fd-ctn-frm .fd-radio-ctn.fd-special-focus .mdl-checkbox__label, .fd-ctn-frm .fd-radio-ctn.fd-special-active .mdl-checkbox__label, .fd-ctn-frm .fd-radio-ctn.fd-special-disabled .mdl-checkbox__label, .fd-ctn-frm .fd-checkbox-ctn.fd-special-focus .mdl-checkbox__label, .fd-ctn-frm .fd-checkbox-ctn.fd-special-active .mdl-checkbox__label, .fd-ctn-frm .fd-checkbox-ctn.fd-special-disabled .mdl-checkbox__label { font-size: 13px; line-height: 10px; font-family: "facitregular", "Open Sans", arial, sans-serif; } .fd-ctn-frm .fd-radio-ctn.fd-special-disabled, .fd-ctn-frm .fd-checkbox-ctn.fd-special-disabled { background-color: #FFFFFF; } .fd-ctn-frm .fd-radio-ctn.fd-special-disabled .mdl-checkbox__label, .fd-ctn-frm .fd-checkbox-ctn.fd-special-disabled .mdl-checkbox__label { color: #a8c6c7; } .fd-ctn-frm .fd-radio-ctn.fd-special-disabled .mdl-checkbox__box-outline, .fd-ctn-frm .fd-checkbox-ctn.fd-special-disabled .mdl-checkbox__box-outline { border-color: #a8c6c7; } .fd-ctn-frm .fd-radio-ctn.fd-special-active, .fd-ctn-frm .fd-checkbox-ctn.fd-special-active { background-color: #f4f4f9; margin-bottom: 5px; } .fd-ctn-frm .fd-radio-ctn.fd-special-focus, .fd-ctn-frm .fd-checkbox-ctn.fd-special-focus { background-color: #d3eed5; } .fd-ctn-frm .fd-invalid .mdl-textfield.is-invalid .mdl-textfield__label { color: #d50000; font-size: 16px; } .fd-ctn-frm .fd-invalid .mdl-textfield.is-invalid .mdl-textfield__input { border-bottom: 1px solid #d50000; } .fd-ctn-frm .fd-invalid .mdl-textfield.is-invalid.is-focused .mdl-textfield__label { font-size: 14px; } .fd-ctn-frm .fd-invalid .fd-hint { color: #d50000 !important; } /* Toolbar */ .fd-content-container.fd-full-width .fd-footer-toolbar { margin-top: -40px; background-color: #e9e9ed; padding: 80px 0 60px 0; } @media all and (max-width: 1280px) { .fd-content-container.fd-full-width .fd-footer-toolbar { padding: 60px 0 20px 0; } } .fd-content-container.fd-full-width .fd-footer-toolbar.fd-clear { margin-top: 0 !important; height: auto; } .fd-content-container.fd-full-width .fd-footer-toolbar.fd-spacer { padding: 40px 0 10px 0 !important; } .fd-content-container.fd-full-width .fd-footer-toolbar .mdl-card { background-color: transparent; border: 0; margin: 0; } @media all and (max-width: 1280px) { .fd-content-container.fd-full-width .fd-footer-toolbar .mdl-card { padding-bottom: 20px; } } .fd-content-container.fd-full-width .fd-footer-toolbar .mdl-card h2 { color: #0D5C63; font-family: "facitregular", "Open Sans", arial, sans-serif; font-size: 20px; line-height: 23px; } .fd-content-container.fd-full-width .fd-footer-toolbar .mdl-card div { width: 100%; } .fd-content-container.fd-full-width .fd-footer-toolbar .mdl-card .mdl-card__supporting-text { padding-top: 0; color: #1D3032; line-height: 20px; color: #0D5C63; } .fd-content-container.fd-full-width .fd-footer-toolbar .mdl-card .mdl-card__supporting-text a, .fd-content-container.fd-full-width .fd-footer-toolbar .mdl-card .mdl-card__supporting-text button { color: #0D5C63; font-size: 14px; line-height: 20px; } .fd-content-container.fd-full-width .fd-footer-toolbar .mdl-card .mdl-card__supporting-text a:hover, .fd-content-container.fd-full-width .fd-footer-toolbar .mdl-card .mdl-card__supporting-text button:hover { color: #44a1a0; } .fd-content-container.fd-full-width .fd-footer-toolbar .mdl-card .mdl-card__supporting-text i { float: left; vertical-align: middle; margin: 0 10px 0 0; } .fd-content-container.fd-full-width .fd-footer-toolbar .mdl-card .mdl-card__supporting-text .fd-phone { display: block; color: #999999; } /* Dialog */ .mdl-dialog .fd-icon-close { display: block; position: absolute; top: 5px; right: 5px; width: 40px; height: 40px; min-height: auto; min-width: auto; padding: 0; border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; text-align: center; color: #0D5C63; } .mdl-dialog .fd-icon-close i { display: block; font-weight: bold; } .mdl-dialog .fd-icon-close:hover { background-color: #f4f4f9; opacity: 1; filter: alpha(opacity=100); } /* snackbar */ .mdl-snackbar.fd-snackbar { background-color: #0D5C63; } .mdl-snackbar.fd-snackbar .mdl-snackbar__text { padding: 10px 20px; } .mdl-snackbar.fd-snackbar p { font-size: 13px; line-height: 16px; } .mdl-snackbar.fd-snackbar p span { font-size: 12px; line-height: 16px; } .mdl-snackbar.fd-snackbar .mdl-snackbar__action { color: #FFFFFF !important; font-size: 13px !important; } /* panel offerts */ .fd-panel-offerts { display: block; background-color: #FFFFFF; height: 100%; left: 0; right: 0; top: 0; position: fixed; margin: auto; width: 100%; overflow: auto; z-index: 10; } @media all and (min-width: 1279px) { .fd-panel-offerts { background-color: #f4f4f9; } } @media all and (min-width: 1280px) { .fd-panel-offerts { z-index: 2; top: 64px; max-width: 1200px; padding: 15px 30px 70px 30px; } } @media all and (max-width: 1279px) { .fd-panel-offerts .fd-panel-offerts-header { position: fixed; background-color: #FFFFFF; height: 64px; top: 0; left: 0; width: 100%; box-shadow: 0px 2px 4px #c7c7c7; z-index: 11; } } .fd-panel-offerts .fd-panel-offerts-header .fd-panel-offerts-header-title { color: #0D5C63; } @media all and (max-width: 1279px) { .fd-panel-offerts .fd-panel-offerts-header .fd-panel-offerts-header-title { text-transform: uppercase; font-family: "facitsemibold", "Open Sans", arial, sans-serif; font-size: 20px; line-height: 70px; padding: 0 0 0 15px; } } @media all and (min-width: 1280px) { .fd-panel-offerts .fd-panel-offerts-header .fd-panel-offerts-header-title { clear: both; font-family: "league_gothicregular", "Open Sans", arial, sans-serif; font-size: 48px; line-height: 48px; margin: 0 0 20px 20px; } } .fd-panel-offerts .fd-panel-offerts-header .fd-panel-offerts-header-close { display: block; position: absolute; top: 15px; right: 15px; } @media all and (min-width: 1280px) { .fd-panel-offerts .fd-panel-offerts-header .fd-panel-offerts-header-close { top: 25px; right: 50px; } } .fd-panel-offerts .fd-panel-offerts-header .fd-panel-offerts-header-close .mdl-button.fd-icon-close { position: absolute; top: 0; right: 0; display: block; width: 40px; height: 40px; min-height: auto !important; min-width: auto !important; padding: 0 !important; text-align: center; } .fd-panel-offerts .fd-panel-offerts-header .fd-panel-offerts-header-close .mdl-button.fd-icon-close i { display: block; font-weight: bold; color: #0D5C63; font-size: 30px; } @media all and (max-width: 1279px) { .fd-panel-offerts .fd-panel-offerts-ctn { margin-top: 90px; } } .fd-panel-offerts .fd-panel-offerts-category { clear: both; padding: 0 0 10px 0; } .fd-panel-offerts .fd-panel-offerts-category h2 { color: #0D5C63; font-family: "facitlight", "Open Sans", arial, sans-serif; font-size: 15px; line-height: 20px; letter-spacing: 0 !important; padding: 0 0 0 10px; } .fd-panel-offerts .fd-panel-offerts-category h2 span { font-family: "facitsemibold", "Open Sans", arial, sans-serif; text-transform: uppercase; } /* Bg Modal */ .fd-bg-overlay.fd-zindex-low { display: block; z-index: 1; top: 65px; } fnd-pp-header { z-index: 1; border-bottom: 1px solid #efefef; } .fd-content-container.fd-full-width dialog + .backdrop { position: fixed; top: 0; right: 0; bottom: 0; left: 0; background: rgba(153, 153, 153, 0.8); } /* panel assistance */ .fd-assistance { min-height: 100%; height: 100%; font-family: "facitregular", "Open Sans", arial, sans-serif; z-index: 890 !important; width: 80%; background-color: #FFFFFF; border: 1px solid #e1e1e5; right: 0 !important; display: block; top: 0; position: fixed; } .fd-assistance.closed { display: none; } @media all and (max-width: 640px) { .fd-assistance { width: 90%; } } .fd-assistance .fd-scroll { overflow-y: scroll; height: 100%; padding-bottom: 60px; } .fd-assistance .mdl-card { border: 0; } .fd-assistance .mdl-card .mdl-card__title { display: block; padding: 0 40px 0 16px; height: 69px; } .fd-assistance .mdl-card .mdl-card__title .mdl-card__title-text { line-height: 66px; } .fd-assistance .mdl-card__supporting-text .fd-subtitle { margin: 30px 0 0 0; color: #0D5C63; font-size: 19px; line-height: 24px; } .fd-assistance .mdl-card__supporting-text .fd-subtitle a { color: #0D5C63; } .fd-assistance .mdl-card__supporting-text .fd-subtitle a span { display: block; float: left; padding: 8px 0 0 5px; } @media all and (max-width: 640px) { .fd-assistance .mdl-card__supporting-text .fd-subtitle { margin: 10px 0 0 0; } } .fd-assistance .mdl-card__supporting-text .fd-subtitle .fd-icon-back { display: block; float: left; width: 40px; height: 40px; margin-left: 0; min-height: auto !important; min-width: auto !important; padding: 0 !important; text-align: center; } .fd-assistance .mdl-card__supporting-text .fd-subtitle .fd-icon-back i { display: block; font-weight: bold; color: #0D5C63; font-size: 27px; } .fd-assistance .mdl-card__supporting-text .fd-txt { padding: 20px 0 0 0; } .fd-assistance .mdl-card__supporting-text .fd-txt p { padding: 0 0 10px 0; color: #0D5C63; font-family: "facitlight", "Open Sans", arial, sans-serif; } .fd-assistance .mdl-card__supporting-text .fd-txt p img { display: block; width: 100%; } .fd-assistance .mdl-card__supporting-text .fd-listing li { padding: 20px 0; } @media all and (max-width: 640px) { .fd-assistance .mdl-card__supporting-text .fd-listing li { padding: 10px 0; } } .fd-assistance .mdl-card__supporting-text .fd-listing li a { font-size: 14px; line-height: 18px; } .fd-assistance .mdl-card__supporting-text .fd-listing li a:hover { color: #44a1a0; } .fd-assistance .mdl-card__menu { display: block; width: 100%; height: 69px; top: 0 !important; right: 0 !important; } .fd-assistance .mdl-card__menu .mdl-button.fd-icon-close { position: absolute; top: 15px; right: 10px; display: block; width: 40px; height: 40px; min-height: auto !important; min-width: auto !important; padding: 0 !important; text-align: center; } .fd-assistance .mdl-card__menu .mdl-button.fd-icon-close i { display: block; font-weight: bold; color: #0D5C63; font-size: 30px; } .mdl-card__actions .mdl-grid .mdl-cell--hide-tablet .fd-button.fd-w-max fnd-button { width: 100%; } .mdl-card__actions .mdl-grid .mdl-cell--hide-tablet .fd-button.fd-w-max fnd-button .mdl-button { width: 100%; text-align: center; margin: 10px 0 0 0 !important; } .fd-prod-desc { text-align: end; padding-right: 16.5em; } @media all and (max-width: 640px) { .fd-prod-desc { text-align: center; padding: 0 16px; } } .mdl-card .fd-info-modal { width: 38px !important; height: 38px !important; padding: 0 !important; min-height: 38px !important; min-width: 38px !important; text-align: center; } .mdl-card .fd-info-modal i { font-size: 30px; color: #0D5C63; } .mdl-card .fd-info-modal.fd-right { position: absolute; top: 10px; right: 10px; } .mdl-card .fd-info-modal.fd-variant i { color: #999999; } .fd-date-input .datepicker-container { width: 100%; } .fd-date-input .datepicker-container .ngx-datepicker-container * { font-family: "facitlight", "Open Sans", arial, sans-serif; } .fd-date-input .datepicker-container .ngx-datepicker-container .ngx-datepicker-input { width: 100% !important; padding: 4px 0 !important; color: inherit !important; border-left: none !important; border-right: none !important; border-top: none !important; border-bottom: 1px solid rgba(0, 0, 0, 0.12) !important; font-size: 16px !important; font-family: "facitregular", "Open Sans", arial, sans-serif !important; border-radius: 0 !important; } .fd-date-input .datepicker-container .ngx-datepicker-container .ngx-datepicker-calendar-container { z-index: 10; background-color: #fff; } .fd-date-input .datepicker-container .ngx-datepicker-container .is-selected { background-color: #5bba6f !important; } .fd-date-input .datepicker-container .clear-data-btn { float: right; margin-right: 28px; } .fd-date-input .datepicker-container .clear-data-btn button { border-radius: 50%; min-width: 28px; min-height: 28px; bottom: 22px; padding: 0 6px; } .fd-date-input .datepicker-container .clear-data-btn i { font-size: 16px; } /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /*------------------------------------*\ $CONTENTS \*------------------------------------*/ /** * STYLE GUIDE VARIABLES------------------Declarations of Sass variables * -----Typography * -----Colors * -----Textfield * -----Switch * -----Spinner * -----Radio * -----Menu * -----List * -----Layout * -----Icon toggles * -----Footer * -----Column * -----Checkbox * -----Card * -----Button * -----Animation * -----Progress * -----Badge * -----Shadows * -----Grid * -----Data table * -----Dialog * -----Snackbar * -----Tooltip * -----Chip * * Even though all variables have the `!default` directive, most of them * should not be changed as they are dependent one another. This can cause * visual distortions (like alignment issues) that are hard to track down * and fix. */ /* ========== TYPOGRAPHY ========== */ /* We're splitting fonts into "preferred" and "performance" in order to optimize page loading. For important text, such as the body, we want it to load immediately and not wait for the web font load, whereas for other sections, such as headers and titles, we're OK with things taking a bit longer to load. We do have some optional classes and parameters in the mixins, in case you definitely want to make sure you're using the preferred font and don't mind the performance hit. We should be able to improve on this once CSS Font Loading L3 becomes more widely available. */ /* ========== COLORS ========== */ /** * * Material design color palettes. * @see http://www.google.com/design/spec/style/color.html * **/ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== Color Palettes ========== */ /* colors.scss */ /** * Copyright 2015 Google Inc. All Rights Reserved. * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ /* ========== IMAGES ========== */ /* ========== Color & Themes ========== */ /* ========== Typography ========== */ /* ========== Components ========== */ /* ========== Standard Buttons ========== */ /* ========== Icon Toggles ========== */ /* ========== Radio Buttons ========== */ /* ========== Ripple effect ========== */ /* ========== Layout ========== */ /* ========== Content Tabs ========== */ /* ========== Checkboxes ========== */ /* ========== Switches ========== */ /* ========== Spinner ========== */ /* ========== Text fields ========== */ /* ========== Card ========== */ /* ========== Sliders ========== */ /* ========== Progress ========== */ /* ========== List ========== */ /* ========== Item ========== */ /* ========== Dropdown menu ========== */ /* ========== Tooltips ========== */ /* ========== Footer ========== */ /* TEXTFIELD */ /* SWITCH */ /* SPINNER */ /* RADIO */ /* MENU */ /* LIST */ /* LAYOUT */ /* ICON TOGGLE */ /* FOOTER */ /*mega-footer*/ /*mini-footer*/ /* CHECKBOX */ /* CARD */ /* Card dimensions */ /* Cover image */ /* BUTTON */ /** * * Dimensions * */ /* ANIMATION */ /* PROGRESS */ /* BADGE */ /* SHADOWS */ /* GRID */ /* DATA TABLE */ /* DIALOG */ /* SNACKBAR */ /* TOOLTIP */ /* CHIP */ .fnd-extended-select .select-all--button { position: absolute; left: 0px; bottom: 15px; } .fnd-extended-select .select-all--textfield { padding-left: 35px; width: auto; } .fnd-extended-select .select-all--popover { left: 0px; } .fnd-extended-select .fnd-popover.direction-up { bottom: 22px; } .fnd-extended-select .fnd-popover.direction-up.fnd-popover--above { bottom: 66px; } .fnd-extended-select__toggle { cursor: pointer; float: right; margin-top: -1.75rem; } .fnd-extended-select .mdl-textfield__input { box-sizing: border-box; cursor: pointer; overflow: hidden; padding-right: 1.5rem; text-overflow: ellipsis; white-space: nowrap; } .fnd-extended-select .mdl-textfield__input:focus { outline: none; } .fnd-extended-select .mdl-textfield.is-focused .fnd-extended-select__toggle { color: rgb(0,162,77); } .fnd-extended-select .mdl-textfield.is-invalid .fnd-extended-select__toggle { color: rgb(213,0,0); } .fnd-extended-select .mdl-textfield.is-disabled .fnd-extended-select__toggle { color: rgba(0,0,0, 0.26); } .fnd-extended-select .mdl-list { max-height: 280px; overflow-y: auto; padding: 0; -webkit-user-select: none; user-select: none; } .fnd-extended-select .mdl-list__item { cursor: pointer; } .fnd-extended-select .mdl-list__item:hover { background-color: rgb(238,238,238); } .fnd-extended-select .mdl-list__item.is-active { color: rgb(0,162,77); background-color: rgb(224,224,224); } .fnd-extended-select .fnd-option--disabled .mdl-list__item { cursor: default; opacity: 0.5; } .fnd-extended-select .fnd-optgroup--label { padding-left: 5px; padding-top: 5px; font-weight: bolder; opacity: initial; } .fnd-extended-select .fnd-optgroup--label:hover { background-color: initial; } .fd-siff .mdl-card .mdl-textfield.header-field { width: 24% !important; } @media (max-width: 640px) { .fd-siff .mdl-card .mdl-textfield.header-field { width: 100% !important; padding-left: 20px; } } .offer-text { font-family: facitregular, Open Sans, arial, sans-serif; color: #009FE3; line-height: 20px; font-size: 18px; } @media (max-width: 540px) { .offer-text { font-size: 15px; line-height: 17px; } } @media (min-width: 740px) { .offer-text { font-size: 20px; } } @media (min-width: 1280px) { .offer-text { font-size: 20px; } } @media (min-width: 1280px) { .not-selected .offer-text { font-size: 20px; } } @media (min-width: 1180px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata { padding: 0px 0px 15px 10px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-amounts.not-selected { width: 48%; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-amounts { display: inline-grid; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-amounts p { margin: auto; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-amounts p .fd-number { font-size: 64.5px; line-height: 76px; } @media (max-width: 540px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-amounts p .fd-number { font-size: 30px; line-height: 40px; } } @media (max-width: 320px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-amounts p .fd-number { font-size: 22.5px; line-height: 36px; } } @media (min-width: 1280px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-amounts p .fd-number { font-size: 82px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-amounts p .fd-simbol { font-size: 37.5px; } @media (max-width: 540px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-amounts p .fd-simbol { font-size: 22.5px; } } @media (max-width: 320px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-amounts p .fd-simbol { font-size: 18px; } } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-amounts p .fd-simbol { font-size: 2.8vw; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-amounts p .fd-label { font-family: "facitregular", "Open Sans", arial, sans-serif; font-size: 18px; } @media (max-width: 540px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-amounts p .fd-label { font-size: 12px; } } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-amounts p .fd-label { font-size: 1.4vw; padding: 0px 5px 0px 0px; } } @media (min-width: 1280px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-amounts p .fd-label { font-size: 1.2vw; padding: 0px 5px 0px 0px; } } @media (min-width: 1280px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-amounts.not-selected p .fd-number { font-size: 82px; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-amounts.not-selected p .fd-simbol { font-size: 50px; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-amounts.not-selected p .fd-label { font-size: 20px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-rate.not-selected { width: 50%; display: inline-flex; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-rate.not-selected p { width: auto; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-rate p .fd-number { font-size: 64.5px; line-height: 76px; } @media (max-width: 540px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-rate p .fd-number { font-size: 30px; line-height: 40px; } } @media (max-width: 320px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-rate p .fd-number { font-size: 22.5px; line-height: 36px; } } @media (min-width: 1280px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-rate p .fd-number { font-size: 82px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-rate p .fd-simbol { font-size: 37.5px; } @media (max-width: 540px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-rate p .fd-simbol { font-size: 22.5px; } } @media (max-width: 320px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-rate p .fd-simbol { font-size: 18px; } } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-rate p .fd-simbol { font-size: 2.8vw; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-rate p .fd-label { font-family: "facitregular", "Open Sans", arial, sans-serif; font-size: 18px; } @media (max-width: 540px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-rate p .fd-label { font-size: 12px; } } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-rate p .fd-label { font-size: 1.4vw; padding: 0px 5px 0px 0px; } } @media (min-width: 1280px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-rate p .fd-label { font-size: 1.2vw; padding: 0px 5px 0px 0px; } } @media (min-width: 1280px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-rate.not-selected p .fd-number { font-size: 82px; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-rate.not-selected p .fd-simbol { font-size: 50px; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .maxirata.fd-siff-rate.not-selected p .fd-label { font-size: 20px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .maxirata p span .fd-number { white-space: nowrap; } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .maxirata.fd-siff-amounts { width: 27%; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .maxirata.fd-siff-rate { width: 38%; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .maxirata.fd-siff-rate p { padding: 0; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .maxirata.fd-siff-rate.param { width: 13%; } } @media (max-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .maxirata.fd-siff-amounts { width: 42%; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .maxirata.fd-siff-rate { width: 35%; padding: 0; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .maxirata.fd-siff-rate.param { width: 20%; padding: 10px 0px 0px 0px; } } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .maxirata.fd-siff-amounts { width: 45%; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .maxirata.fd-siff-rate { width: 50%; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .maxirata.fd-siff-rate.param { width: 100%; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .maxirata.fd-siff-rate.param p { width: 100%; } } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .maxirata.fd-siff-rate .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .maxirata.fd-siff-amounts .fd-number { font-size: 4.5vw; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .maxirata.fd-siff-rate .fd-number.label, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .maxirata.fd-siff-amounts .fd-number.label { font-size: 3.5vw; } } @media (min-width: 1280px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .maxirata.fd-siff-rate .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .maxirata.fd-siff-amounts .fd-number { font-size: 3.6vw; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .maxirata.fd-siff-rate .fd-number.label, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .maxirata.fd-siff-amounts .fd-number.label { font-size: 2.8vw; } } @media (max-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .maxirata.fd-siff-rate .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .maxirata.fd-siff-amounts .fd-number { font-size: 6vw; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .maxirata.fd-siff-rate .fd-number.label, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .maxirata.fd-siff-amounts .fd-number.label { font-size: 4.4vw; } } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .maxirata.fd-siff-rate .fd-number, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .maxirata.fd-siff-amounts .fd-number { font-size: 8vw; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .maxirata.fd-siff-rate .fd-number.label, .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-link .maxirata.fd-siff-amounts .fd-number.label { font-size: 6.5vw; } } .fd-amount-centered { display: inline-block; align-items: center; font-family: league_gothicregular, Open Sans, arial, sans-serif; color: #0D5C63; } @media (min-width: 1280px) { .not-selected .fd-amount-centered .fd-number { font-size: 82px; } .not-selected .fd-amount-centered .fd-simbol { font-size: 50px; } } @media (min-width: 840px) { .amount-layout.not-selected { width: 100%; } } @media (min-width: 1280px) { .amount-layout { width: 74%; padding-bottom: 25px; } } @media (min-width: 840px) { .amount-layout { width: 80%; } } @media (max-width: 840px) { .amount-layout { width: 100%; font-size: 94.5px; line-height: 110px; } } @media (max-width: 540px) { .amount-layout { font-size: 34.5px; line-height: 40px; } } .amount-layout .fd-number { font-size: 64.5px; line-height: 76px; vertical-align: middle; } @media (max-width: 540px) { .amount-layout .fd-number { font-size: 30px; line-height: 40px; } } @media (max-width: 320px) { .amount-layout .fd-number { font-size: 22.5px; line-height: 36px; } } @media (min-width: 1280px) { .amount-layout .fd-number { font-size: 82px; line-height: 76px; } } .amount-layout .fd-simbol { font-size: 37.5px; } @media (max-width: 540px) { .amount-layout .fd-simbol { font-size: 22.5px; } } @media (max-width: 320px) { .amount-layout .fd-simbol { font-size: 18px; } } @media (min-width: 840px) { .amount-layout .fd-simbol { font-size: 2.8vw; } } @media (min-width: 1280px) { .amount-layout .fd-simbol { font-size: 42px; } } .amount-layout .fd-label { font-family: "facitregular", "Open Sans", arial, sans-serif; font-size: 18px; } @media (max-width: 540px) { .amount-layout .fd-label { font-size: 12px; } } @media (min-width: 840px) { .amount-layout .fd-label { font-size: 18px; } } @media (min-width: 1280px) { .amount-layout .fd-label { font-size: 18px; } } .amount-layout .mdl-grid { display: block; } .fd-amount-total { display: inline-block; padding-top: 11px; padding-left: 15px; font-family: facitsemibold, Open Sans, arial, sans-serif; color: #0D5C63; font-size: 18px; } @media (max-width: 640px) { .fd-amount-total { font-size: 15px; padding-bottom: 25px; } } .mdl-card .mdl-card__supporting-text.maxirata { padding: 0; display: inline-table; } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-promo { width: 19%; } } @media (min-width: 840px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-rate { width: 45%; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-promo { height: 55px; } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-promo h2 { font-size: 24px; } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .fd-siff-promo h2 { display: block; font-size: 15px; } } .fd-content-container.fd-full-width .mdl-card.fd-card-siff .mdl-card__actions.maxirata { padding-bottom: 30px; } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .mdl-card__actions.maxirata.selected { text-align: center; } } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .mdl-card__actions.maxirata .fd-button.fd-w-max fnd-button { width: 65%; } } @media (max-width: 640px) { .fd-content-container.fd-full-width .mdl-card.fd-card-siff .mdl-card__actions.maxirata .fd-button.fd-w-max .mdl-button { font-size: 12px; } } .mdl-card.fd-card-special .fd-summary.alert-container { padding: 15px 15px 15px 15px; background-color: #FFEBEE; color: #D50000 !important; display: flex; } .alert-content { display: table-cell; vertical-align: middle; padding-right: 15px; font-size: 14px; margin: auto 0; } .mdl-card.fd-card-special .fd-img.alert { margin-top: 17px; } .fd-box-outcome .fd-msg .fd-circular i.cancel { background-color: red; } fnd-checkbox-input .mdl-checkbox input[disabled] ~ .mdl-checkbox__box-outline { border: 2px solid #cec7c7; } fnd-checkbox-input .mdl-checkbox.is-checked input[disabled] ~ .mdl-checkbox__box-outline .mdl-checkbox__tick-outline { background-color: lightgray; } body fnd-checkbox-input label.mdl-checkbox input[disabled] ~ .mdl-checkbox__label { color: lightgray; } body fnd-accordion-item fnd-checkbox-input label.mdl-checkbox { width: 80%; } @font-face { font-family: "icomoon"; src: url('icomoon.eot?2i5mik'); src: url('icomoon.eot?2i5mik#iefix') format("embedded-opentype"), url('icomoon.ttf?2i5mik') format("truetype"), url('icomoon.woff?2i5mik') format("woff"), url('icomoon.svg?2i5mik#icomoon') format("svg"); font-weight: normal; font-style: normal; } .response-error { /* use !important to prevent issues with browser extensions that change fonts */ font-family: "icomoon", sans-serif !important; speak: none; font-style: normal; font-variant: normal; text-transform: none; font-weight: 800; color: #0D5C63; font-size: 67px; line-height: 70px; width: 70px; height: 70px; text-align: center; overflow: hidden; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .response-error:before { content: "\e9fc"; } .cp-open .mdl-card, .cp-open fnd-slider { overflow: inherit !important; } .cp-open fnd-slide:after { clear: both; float: none; display: inline-block; content: ""; } .cp-open fnd-slide:not([style*="visibility: visible"]) { opacity: 0; } .ngx-datepicker-calendar-container { z-index: 1000 !important; } .glabel { color: #00a258; text-decoration: underline; font-family: "facitregular", "Open Sans", arial, sans-serif; font-size: 13px; cursor: pointer; font-weight: 700; } .overflow-visible fnd-card > .mdl-card { overflow: visible !important; } .fd-menu-user { height: auto; } .overSpinnerSetupApp { position: relative; zoom: 5; /* margin: auto; */ left: 45%; top: 35%; } @media screen and (max-width: 768px) { .overSpinnerSetupApp { zoom: 3; top: 50%; margin: 0 auto; text-align: center; left: auto; transform: translate3d(0, -50%, 0); } } .spinnerContainer { position: fixed; /* Sit on top of the page content */ width: 100%; /* Full width (cover the whole page) */ height: 100%; /* Full height (cover the whole page) */ top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.3); /* Black background with opacity */ z-index: 9999; /* Specify a stack order in case you're using a different order for other elements */ } .page-products .mdl-card .fd-ctn-data .mdl-data-table { table-layout: fixed; } .mdl-card .fd-ctn-data .mdl-data-table tr td.fd-right { word-break: break-all; } /* APP - CAROUSEL PAGE PRODUCT */ .tiles { margin: 0 20px; } .tiles span { font-weight: 600; font-style: normal; font-size: 12px; color: #91B1B5; text-align: center; display: block; white-space: nowrap; } .tiles .selected.active ~ p span { color: rgb(13, 92, 99); } .box { height: 39px; line-height: 39px; position: relative; border-bottom: 1px solid rgb(228, 228, 228); } #labelCard { position: relative; } #labelCard a { position: absolute; z-index: 30; width: 30px; height: 30px; line-height: 30px; background: #f4f4f9; top: 8px; } #labelCard a.lt { left: 0; padding: 0; text-align: left; } #labelCard a.rt { right: 0; padding: 0; text-align: right; } #labelCard .selected { border-bottom: 2px solid rgb(13, 92, 99); bottom: 0; position: absolute; display: block; width: 100%; opacity: 0; } #labelCard .selected.active { opacity: 1; } .mobile-view-carousel > div > div { overflow: hidden; } @font-face { font-family: "icon_share_ios"; src: url('icon_share_ios.ttf?z6wxtd') format("truetype"), url('icon_share_ios.woff?z6wxtd') format("woff"), url('icon_share_ios.svg?z6wxtd#icon_share_ios') format("svg"); font-weight: normal; font-style: normal; } .mdl-textfield label::after { background-color: transparent !important; } /*# sourceMappingURL=styles.css.map*/