@import url("http://fonts.googleapis.com/css?family=Roboto:100,300,100italic,300italic"); 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}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}body{-webkit-text-size-adjust:none} @font-face { font-family: 'Sofia Pro'; src: url('../fonts/SofiaPro.woff2') format('woff2'), url('../fonts/SofiaPro.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'Sofia Pro'; src: url('../fonts/SofiaPro-Bold.woff2') format('woff2'), url('../fonts/SofiaPro-Bold.woff') format('woff'); font-weight: bold; font-style: normal; font-display: swap; } .dropotron { display:none !important;} /* Box Model */ *, *:before, *:after {-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box; } /* Containers */ .container {margin-left: auto;margin-right: auto;}.container.\31 25\25 {width: 100%;max-width: 87.5em;min-width: 70em;}.container.\37 5\25 {width: 52.5em;}.container.\35 0\25 {width: 35em;}.container.\32 5\25 {width: 17.5em;} .container {width: 1300px;} @media screen and (max-width: 1680px) { .container.\31 25\25 {width: 100%;max-width: 87.5em;min-width: 70em;}.container.\37 5\25 {width: 52.5em;}.container.\35 0\25 {width: 35em;}.container.\32 5\25 {width: 17.5em;} .container {width: 1300px;} } @media screen and (max-width: 1280px) { .container.\31 25\25 {width: 100%;max-width: 87.5em;min-width: 70em;}.container.\37 5\25 {width: 52.5em;}.container.\35 0\25 {width: 35em;}.container.\32 5\25 {width: 17.5em;} .container {width: 1100px;} } @media screen and (max-width: 1100px) { .container.\31 25\25 {width: 100%;max-width: 87.5em;min-width: 70em;}.container.\37 5\25 {width: 52.5em;}.container.\35 0\25 {width: 35em;}.container.\32 5\25 {width: 17.5em;} .container {width: 1000px;} } @media screen and (max-width: 1100px) { .container.\31 25\25 {width: 100%;max-width: 112.5%;min-width: 90%;}.container.\37 5\25 {width: 67.5%;}.container.\35 0\25 {width: 45%;}.container.\32 5\25 {width: 22.5%;} .container {width: 90%;} } @media screen and (max-width: 980px) { .container.\31 25\25 {width: 100%;max-width: 125%;min-width: 100%;}.container.\37 5\25 {width: 75%;}.container.\35 0\25 {width: 50%;}.container.\32 5\25 {width: 25%;} .container {width: 100% !important;} } @media screen and (max-width: 736px) { .container.\31 25\25 {width: 100%;max-width: 125%;min-width: 100%;}.container.\37 5\25 {width: 75%;}.container.\35 0\25 {width: 50%;}.container.\32 5\25 {width: 25%;} .container {width: 100% !important } } @media screen and (max-width: 480px) { .container.\31 25\25 {width: 100%;max-width: 125%;min-width: 100%;}.container.\37 5\25 {width: 75%;}.container.\35 0\25 {width: 50%;}.container.\32 5\25 {width: 25%;} .container {width: 100% !important;} #action-btn button {width: 100%; margin-top: 10px} .scopeone .delete, .scopetwo .delete {margin: 0 !important} .unit-display.energy {padding: 6px; margin-left: 10px} .responsive-table {width: 100%; overflow-x: scroll} } /* Grid */ .row{border-bottom:solid 1px transparent;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box} .row > *{float:left;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box} .row:after,.row:before{content:'';display:block;clear:both;height:0} .row.uniform > * > :first-child{margin-top:0}.row.uniform > * > :last-child{margin-bottom:0} .row.\30 \25 > * {padding: 0 0 0 0em;}.row.\30 \25 {margin: 0 0 -1px 0em;} .row.uniform.\30 \25 > * {padding: 0em 0 0 0em;}.row.uniform.\30 \25 {margin: 0em 0 -1px 0em;} .row > * {padding: 0 0 0 2.5em;}.row {margin: 0 0 -1px -2.5em;} .row.uniform > * {padding: 2.5em 0 0 2.5em;}.row.uniform {margin: -2.5em 0 -1px -2.5em;} .row.\32 00\25 > * {padding: 0 0 0 5em;}.row.\32 00\25 {margin: 0 0 -1px -5em;} .row.uniform.\32 00\25 > * {padding: 5em 0 0 5em;}.row.uniform.\32 00\25 {margin: -5em 0 -1px -5em;} .row.\31 50\25 > * {padding: 0 0 0 3.75em;}.row.\31 50\25 {margin: 0 0 -1px -3.75em;} .row.uniform.\31 50\25 > * {padding: 3.75em 0 0 3.75em;}.row.uniform.\31 50\25 {margin: -3.75em 0 -1px -3.75em;} .row.\35 0\25 > * {padding: 0 0 0 1.25em;}.row.\35 0\25 {margin: 0 0 -1px -1.25em;} .row.uniform.\35 0\25 > * {padding: 1.25em 0 0 1.25em;}.row.uniform.\35 0\25 {margin: -1.25em 0 -1px -1.25em;} .row.\32 5\25 > * {padding: 0 0 0 0.625em;}.row.\32 5\25 {margin: 0 0 -1px -0.625em;} .row.uniform.\32 5\25 > * {padding: 0.625em 0 0 0.625em;}.row.uniform.\32 5\25 {margin: -0.625em 0 -1px -0.625em;} .\31 2u, .\31 2u\24 {width: 100%;clear: none;margin-left: 0;}.\31 1u, .\31 1u\24 {width: 91.6666666667%;clear: none;margin-left: 0;}.\31 0u, .\31 0u\24 {width: 83.3333333333%;clear: none;margin-left: 0;}.\39 u, .\39 u\24 {width: 75%;clear: none;margin-left: 0;}.\38 u, .\38 u\24 {width: 66.6666666667%;clear: none;margin-left: 0;}.\37 u, .\37 u\24 {width: 58.3333333333%;clear: none;margin-left: 0;}.\36 u, .\36 u\24 {width: 50%;clear: none;margin-left: 0;}.\35 u, .\35 u\24 {width: 41.6666666667%;clear: none;margin-left: 0;}.\34 u, .\34 u\24 {width: 33.3333333333%;clear: none;margin-left: 0;}.\33 u, .\33 u\24 {width: 25%;clear: none;margin-left: 0;}.\32 u, .\32 u\24 {width: 16.6666666667%;clear: none;margin-left: 0;}.\31 u, .\31 u\24 {width: 8.3333333333%;clear: none;margin-left: 0;} .\31 2u\24 + *,.\31 1u\24 + *,.\31 0u\24 + *,.\39 u\24 + *,.\38 u\24 + *,.\37 u\24 + *,.\36 u\24 + *,.\35 u\24 + *,.\34 u\24 + *,.\33 u\24 + *,.\32 u\24 + *,.\31 u\24 + * { clear: left;} .\-11u {margin-left: 91.66667%;}.\-10u {margin-left: 83.33333%;}.\-9u {margin-left: 75%;}.\-8u {margin-left: 66.66667%;}.\-7u {margin-left: 58.33333%;}.\-6u {margin-left: 50%;}.\-5u {margin-left: 41.66667%;}.\-4u {margin-left: 33.33333%;}.\-3u {margin-left: 25%;}.\-2u {margin-left: 16.66667%;}.\-1u {margin-left: 8.33333%;} @media screen and (max-width: 1680px) { .row > *{padding:0 0 0 2.5em}.row{margin:0 0 -1px -2.5em} .row.uniform > *{padding:2.5em 0 0 2.5em}.row.uniform{margin:-2.5em 0 -1px -2.5em} .row.\32 00\25 > * {padding: 0 0 0 5em;}.row.\32 00\25 {margin: 0 0 -1px -5em;} .row.uniform.\32 00\25 > * {padding: 5em 0 0 5em;}.row.uniform.\32 00\25 {margin: -5em 0 -1px -5em;} .row.\31 50\25 > * {padding: 0 0 0 3.75em;}.row.\31 50\25 {margin: 0 0 -1px -3.75em;} .row.uniform.\31 50\25 > * {padding: 3.75em 0 0 3.75em;}.row.uniform.\31 50\25 {margin: -3.75em 0 -1px -3.75em;} .row.\35 0\25 > * {padding: 0 0 0 1.25em;}.row.\35 0\25 {margin: 0 0 -1px -1.25em;} .row.uniform.\35 0\25 > * {padding: 1.25em 0 0 1.25em;}.row.uniform.\35 0\25 {margin: -1.25em 0 -1px -1.25em;} .row.\32 5\25 > * {padding: 0 0 0 0.625em;}.row.\32 5\25 {margin: 0 0 -1px -0.625em;} .row.uniform.\32 5\25 > * {padding: 0.625em 0 0 0.625em;}.row.uniform.\32 5\25 {margin: -0.625em 0 -1px -0.625em;} .\31 2u\28xlarge\29, .\31 2u\24\28xlarge\29 {width: 100%;clear: none;margin-left: 0;}.\31 1u\28xlarge\29, .\31 1u\24\28xlarge\29 {width: 91.6666666667%;clear: none;margin-left: 0;}.\31 0u\28xlarge\29, .\31 0u\24\28xlarge\29 {width: 83.3333333333%;clear: none;margin-left: 0;}.\39 u\28xlarge\29, .\39 u\24\28xlarge\29 {width: 75%;clear: none;margin-left: 0;}.\38 u\28xlarge\29, .\38 u\24\28xlarge\29 {width: 66.6666666667%;clear: none;margin-left: 0;}.\37 u\28xlarge\29, .\37 u\24\28xlarge\29 {width: 58.3333333333%;clear: none;margin-left: 0;}.\36 u\28xlarge\29, .\36 u\24\28xlarge\29 {width: 50%;clear: none;margin-left: 0;}.\35 u\28xlarge\29, .\35 u\24\28xlarge\29 {width: 41.6666666667%;clear: none;margin-left: 0;}.\34 u\28xlarge\29, .\34 u\24\28xlarge\29 {width: 33.3333333333%;clear: none;margin-left: 0;}.\33 u\28xlarge\29, .\33 u\24\28xlarge\29 {width: 25%;clear: none;margin-left: 0;}.\32 u\28xlarge\29, .\32 u\24\28xlarge\29 {width: 16.6666666667%;clear: none;margin-left: 0;}.\31 u\28xlarge\29, .\31 u\24\28xlarge\29 {width: 8.3333333333%;clear: none;margin-left: 0;} .\31 2u\24\28xlarge\29 + *,.\31 1u\24\28xlarge\29 + *,.\31 0u\24\28xlarge\29 + *,.\39 u\24\28xlarge\29 + *,.\38 u\24\28xlarge\29 + *,.\37 u\24\28xlarge\29 + *,.\36 u\24\28xlarge\29 + *,.\35 u\24\28xlarge\29 + *,.\34 u\24\28xlarge\29 + *,.\33 u\24\28xlarge\29 + *,.\32 u\24\28xlarge\29 + *,.\31 u\24\28xlarge\29 + * { clear: left;} .\-11u\28xlarge\29 {margin-left: 91.66667%;}.\-10u\28xlarge\29 {margin-left: 83.33333%;}.\-9u\28xlarge\29 {margin-left: 75%;}.\-8u\28xlarge\29 {margin-left: 66.66667%;}.\-7u\28xlarge\29 {margin-left: 58.33333%;}.\-6u\28xlarge\29 {margin-left: 50%;}.\-5u\28xlarge\29 {margin-left: 41.66667%;}.\-4u\28xlarge\29 {margin-left: 33.33333%;}.\-3u\28xlarge\29 {margin-left: 25%;}.\-2u\28xlarge\29 {margin-left: 16.66667%;}.\-1u\28xlarge\29 {margin-left: 8.33333%;} } @media screen and (max-width: 1100px) { .row > *{padding:0 0 0 2.5em}.row{margin:0 0 -1px -2.5em} .row.uniform > *{padding:2.5em 0 0 2.5em}.row.uniform{margin:-2.5em 0 -1px -2.5em} .row.\32 00\25 > * {padding: 0 0 0 5em;}.row.\32 00\25 {margin: 0 0 -1px -5em;} .row.uniform.\32 00\25 > * {padding: 5em 0 0 5em;}.row.uniform.\32 00\25 {margin: -5em 0 -1px -5em;} .row.\31 50\25 > * {padding: 0 0 0 3.75em;}.row.\31 50\25 {margin: 0 0 -1px -3.75em;} .row.uniform.\31 50\25 > * {padding: 3.75em 0 0 3.75em;}.row.uniform.\31 50\25 {margin: -3.75em 0 -1px -3.75em;} .row.\35 0\25 > * {padding: 0 0 0 1.25em;}.row.\35 0\25 {margin: 0 0 -1px -1.25em;} .row.uniform.\35 0\25 > * {padding: 1.25em 0 0 1.25em;}.row.uniform.\35 0\25 {margin: -1.25em 0 -1px -1.25em;} .row.\32 5\25 > * {padding: 0 0 0 0.625em;}.row.\32 5\25 {margin: 0 0 -1px -0.625em;} .row.uniform.\32 5\25 > * {padding: 0.625em 0 0 0.625em;}.row.uniform.\32 5\25 {margin: -0.625em 0 -1px -0.625em;} .\31 2u\28large\29, .\31 2u\24\28large\29 {width: 100%;clear: none;margin-left: 0;}.\31 1u\28large\29, .\31 1u\24\28large\29 {width: 91.6666666667%;clear: none;margin-left: 0;}.\31 0u\28large\29, .\31 0u\24\28large\29 {width: 83.3333333333%;clear: none;margin-left: 0;}.\39 u\28large\29, .\39 u\24\28large\29 {width: 75%;clear: none;margin-left: 0;}.\38 u\28large\29, .\38 u\24\28large\29 {width: 66.6666666667%;clear: none;margin-left: 0;}.\37 u\28large\29, .\37 u\24\28large\29 {width: 58.3333333333%;clear: none;margin-left: 0;}.\36 u\28large\29, .\36 u\24\28large\29 {width: 50%;clear: none;margin-left: 0;}.\35 u\28large\29, .\35 u\24\28large\29 {width: 41.6666666667%;clear: none;margin-left: 0;}.\34 u\28large\29, .\34 u\24\28large\29 {width: 33.3333333333%;clear: none;margin-left: 0;}.\33 u\28large\29, .\33 u\24\28large\29 {width: 25%;clear: none;margin-left: 0;}.\32 u\28large\29, .\32 u\24\28large\29 {width: 16.6666666667%;clear: none;margin-left: 0;} .\31 u\28large\29, .\31 u\24\28large\29 {width: 8.3333333333%;clear: none;margin-left: 0;} .\31 2u\24\28large\29 + *,.\31 1u\24\28large\29 + *,.\31 0u\24\28large\29 + *,.\39 u\24\28large\29 + *,.\38 u\24\28large\29 + *,.\37 u\24\28large\29 + *,.\36 u\24\28large\29 + *,.\35 u\24\28large\29 + *,.\34 u\24\28large\29 + *,.\33 u\24\28large\29 + *,.\32 u\24\28large\29 + *,.\31 u\24\28large\29 + * {clear: left;} .\-11u\28large\29 {margin-left: 91.66667%;}.\-10u\28large\29 {margin-left: 83.33333%;}.\-9u\28large\29 {margin-left: 75%;}.\-8u\28large\29 {margin-left: 66.66667%;}.\-7u\28large\29 {margin-left: 58.33333%;}.\-6u\28large\29 {margin-left: 50%;}.\-5u\28large\29 {margin-left: 41.66667%;}.\-4u\28large\29 {margin-left: 33.33333%;}.\-3u\28large\29 {margin-left: 25%;}.\-2u\28large\29 {margin-left: 16.66667%;}.\-1u\28large\29 {margin-left: 8.33333%;} } @media screen and (max-width: 980px) { .row > * {padding: 0 0 0 2.5em;}.row {margin: 0 0 -1px -2.5em;} .row.uniform > * {padding: 2.5em 0 0 2.5em;}.row.uniform {margin: -2.5em 0 -1px -2.5em;} .row.\32 00\25 > * {padding: 0 0 0 5em;}.row.\32 00\25 {margin: 0 0 -1px -5em;} .row.uniform.\32 00\25 > * {padding: 5em 0 0 5em;}.row.uniform.\32 00\25 {margin: -5em 0 -1px -5em;} .row.\31 50\25 > * {padding: 0 0 0 3.75em;}.row.\31 50\25 {margin: 0 0 -1px -3.75em;} .row.uniform.\31 50\25 > * {padding: 3.75em 0 0 3.75em;}.row.uniform.\31 50\25 {margin: -3.75em 0 -1px -3.75em;} .row.\35 0\25 > * {padding: 0 0 0 1.25em;}.row.\35 0\25 {margin: 0 0 -1px -1.25em;} .row.uniform.\35 0\25 > * {padding: 1.25em 0 0 1.25em;}.row.uniform.\35 0\25 {margin: -1.25em 0 -1px -1.25em;} .row.\32 5\25 > * {padding: 0 0 0 0.625em;}.row.\32 5\25 {margin: 0 0 -1px -0.625em;} .row.uniform.\32 5\25 > * {padding: 0.625em 0 0 0.625em;}.row.uniform.\32 5\25 {margin: -0.625em 0 -1px -0.625em;} .\31 2u\28medium\29, .\31 2u\24\28medium\29 {width: 100%;clear: none;margin-left: 0;} .\31 1u\28medium\29, .\31 1u\24\28medium\29 { width: 91.6666666667%; clear: none; margin-left: 0; } .\31 0u\28medium\29, .\31 0u\24\28medium\29 { width: 83.3333333333%; clear: none; margin-left: 0; } .\39 u\28medium\29, .\39 u\24\28medium\29 { width: 75%; clear: none; margin-left: 0; } .\38 u\28medium\29, .\38 u\24\28medium\29 { width: 66.6666666667%; clear: none; margin-left: 0; } .\37 u\28medium\29, .\37 u\24\28medium\29 { width: 58.3333333333%; clear: none; margin-left: 0; } .\36 u\28medium\29, .\36 u\24\28medium\29 { width: 50%; clear: none; margin-left: 0; } .\35 u\28medium\29, .\35 u\24\28medium\29 { width: 41.6666666667%; clear: none; margin-left: 0; } .\34 u\28medium\29, .\34 u\24\28medium\29 { width: 33.3333333333%; clear: none; margin-left: 0; } .\33 u\28medium\29, .\33 u\24\28medium\29 { width: 25%; clear: none; margin-left: 0; } .\32 u\28medium\29, .\32 u\24\28medium\29 { width: 16.6666666667%; clear: none; margin-left: 0; } .\31 u\28medium\29, .\31 u\24\28medium\29 { width: 8.3333333333%; clear: none; margin-left: 0; } .\31 2u\24\28medium\29 + *,.\31 1u\24\28medium\29 + *,.\31 0u\24\28medium\29 + *,.\39 u\24\28medium\29 + *,.\38 u\24\28medium\29 + *,.\37 u\24\28medium\29 + *,.\36 u\24\28medium\29 + *,.\35 u\24\28medium\29 + *,.\34 u\24\28medium\29 + *,.\33 u\24\28medium\29 + *,.\32 u\24\28medium\29 + *,.\31 u\24\28medium\29 + * {clear: left;}.\-11u\28medium\29 {margin-left: 91.66667%;}.\-10u\28medium\29 {margin-left: 83.33333%;}.\-9u\28medium\29 {margin-left: 75%;}.\-8u\28medium\29 {margin-left: 66.66667%;}.\-7u\28medium\29 {margin-left: 58.33333%;}.\-6u\28medium\29 {margin-left: 50%;}.\-5u\28medium\29 {margin-left: 41.66667%;}.\-4u\28medium\29 {margin-left: 33.33333%;}.\-3u\28medium\29 {margin-left: 25%;}.\-2u\28medium\29 {margin-left: 16.66667%;}.\-1u\28medium\29 {margin-left: 8.33333%;} } @media screen and (max-width: 736px) { .row > *{padding:0 0 0 2.5em} .row{margin:0 0 -1px -2.5em} .row.uniform > *{padding:2.5em 0 0 2.5em} .row.uniform{margin:-2.5em 0 -1px -2.5em} .row.\32 00\25 > * {padding: 0 0 0 5em;} .row.\32 00\25 {margin: 0 0 -1px -5em;} .row.uniform.\32 00\25 > * {padding: 5em 0 0 5em;} .row.uniform.\32 00\25 {margin: -5em 0 -1px -5em;} .row.\31 50\25 > * {padding: 0 0 0 3.75em;} .row.\31 50\25 {margin: 0 0 -1px -3.75em;} .row.uniform.\31 50\25 > * {padding: 3.75em 0 0 3.75em;} .row.uniform.\31 50\25 {margin: -3.75em 0 -1px -3.75em;} .row.\35 0\25 > * {padding: 0 0 0 1.25em;} .row.\35 0\25 {margin: 0 0 -1px -1.25em;} .row.uniform.\35 0\25 > * {padding: 1.25em 0 0 1.25em;} .row.uniform.\35 0\25 {margin: -1.25em 0 -1px -1.25em;} .row.\32 5\25 > * {padding: 0 0 0 0.625em;} .row.\32 5\25 {margin: 0 0 -1px -0.625em;} .row.uniform.\32 5\25 > * {padding: 0.625em 0 0 0.625em;} .row.uniform.\32 5\25 {margin: -0.625em 0 -1px -0.625em;} .\31 2u\28small\29, .\31 2u\24\28small\29 {width: 100%;clear: none;margin-left: 0;} .\31 1u\28small\29, .\31 1u\24\28small\29 {width: 91.6666666667%;clear: none;margin-left: 0;} .\31 0u\28small\29, .\31 0u\24\28small\29 {width: 83.3333333333%;clear: none;margin-left: 0;} .\39 u\28small\29, .\39 u\24\28small\29 {width: 75%;clear: none;margin-left: 0;} .\38 u\28small\29, .\38 u\24\28small\29 {width: 66.6666666667%;clear: none;margin-left: 0;} .\37 u\28small\29, .\37 u\24\28small\29 {width: 58.3333333333%;clear: none;margin-left: 0;} .\36 u\28small\29, .\36 u\24\28small\29 {width: 50%;clear: none;margin-left: 0;} .\35 u\28small\29, .\35 u\24\28small\29 {width: 41.6666666667%;clear: none;margin-left: 0;} .\34 u\28small\29, .\34 u\24\28small\29 {width: 33.3333333333%;clear: none;margin-left: 0;} .\33 u\28small\29, .\33 u\24\28small\29 {width: 25%;clear: none;margin-left: 0;} .\32 u\28small\29, .\32 u\24\28small\29 { width: 16.6666666667%; clear: none; margin-left: 0; } .\31 u\28small\29, .\31 u\24\28small\29 { width: 8.3333333333%; clear: none; margin-left: 0; } .\31 2u\24\28small\29 + *,.\31 1u\24\28small\29 + *,.\31 0u\24\28small\29 + *,.\39 u\24\28small\29 + *,.\38 u\24\28small\29 + *,.\37 u\24\28small\29 + *,.\36 u\24\28small\29 + *,.\35 u\24\28small\29 + *,.\34 u\24\28small\29 + *,.\33 u\24\28small\29 + *,.\32 u\24\28small\29 + *,.\31 u\24\28small\29 + * { clear: left;} .\-11u\28small\29 {margin-left: 91.66667%;}.\-10u\28small\29 {margin-left: 83.33333%;}.\-9u\28small\29 {margin-left: 75%;}.\-8u\28small\29 {margin-left: 66.66667%;}.\-7u\28small\29 {margin-left: 58.33333%;}.\-6u\28small\29 {margin-left: 50%;}.\-5u\28small\29 {margin-left: 41.66667%;}.\-4u\28small\29 {margin-left: 33.33333%;}.\-3u\28small\29 {margin-left: 25%;}.\-2u\28small\29 {margin-left: 16.66667%;}.\-1u\28small\29 {margin-left: 8.33333%;} } @media screen and (max-width: 636px) { .row > * {padding: 0 0 0 2.5em;}.row {margin: 0 0 -1px -2.5em;} .row.uniform > * {padding: 2.5em 0 0 2.5em;}.row.uniform {margin: -2.5em 0 -1px -2.5em;} .row.\32 00\25 > * {padding: 0 0 0 5em;}.row.\32 00\25 {margin: 0 0 -1px -5em;} .row.uniform.\32 00\25 > * {padding: 5em 0 0 5em;}.row.uniform.\32 00\25 {margin: -5em 0 -1px -5em;} .row.\31 50\25 > * {padding: 0 0 0 3.75em;}.row.\31 50\25 {margin: 0 0 -1px -3.75em;} .row.uniform.\31 50\25 > * {padding: 3.75em 0 0 3.75em;}.row.uniform.\31 50\25 {margin: -3.75em 0 -1px -3.75em;} .row.\35 0\25 > * {padding: 0 0 0 1.25em;}.row.\35 0\25 {margin: 0 0 -1px -1.25em;} .row.uniform.\35 0\25 > * {padding: 1.25em 0 0 1.25em;}.row.uniform.\35 0\25 {margin: -1.25em 0 -1px -1.25em;} .row.\32 5\25 > * {padding: 0 0 0 0.625em;}.row.\32 5\25 {margin: 0 0 -1px -0.625em;} .row.uniform.\32 5\25 > * {padding: 0.625em 0 0 0.625em;}.row.uniform.\32 5\25 {margin: -0.625em 0 -1px -0.625em;} .\31 2u\28smaller\29, .\31 2u\24\28smaller\29 {width: 100%;clear: none;margin-left: 0;}.\31 1u\28smaller\29, .\31 1u\24\28smaller\29 {width: 91.6666666667%;clear: none;margin-left: 0;}.\31 0u\28smaller\29, .\31 0u\24\28smaller\29 {width: 83.3333333333%;clear: none;margin-left: 0;}.\39 u\28smaller\29, .\39 u\24\28smaller\29 {width: 75%;clear: none;margin-left: 0;}.\38 u\28smaller\29, .\38 u\24\28smaller\29 {width: 66.6666666667%;clear: none;margin-left: 0;}.\37 u\28smaller\29, .\37 u\24\28smaller\29 {width: 58.3333333333%;clear: none;margin-left: 0;}.\36 u\28smaller\29, .\36 u\24\28smaller\29 {width: 50%;clear: none;margin-left: 0;}.\35 u\28smaller\29, .\35 u\24\28smaller\29 {width: 41.6666666667%;clear: none;margin-left: 0;}.\34 u\28smaller\29, .\34 u\24\28smaller\29 {width: 33.3333333333%;clear: none;margin-left: 0;}.\33 u\28smaller\29, .\33 u\24\28smaller\29 {width: 25%;clear: none;margin-left: 0;}.\32 u\28smaller\29, .\32 u\24\28smaller\29 {width: 16.6666666667%;clear: none;margin-left: 0;}.\31 u\28smaller\29, .\31 u\24\28smaller\29 {width: 8.3333333333%;clear: none;margin-left: 0;} .\31 2u\24\28smaller\29 + *,.\31 1u\24\28smaller\29 + *,.\31 0u\24\28smaller\29 + *,.\39 u\24\28smaller\29 + *,.\38 u\24\28smaller\29 + *,.\37 u\24\28smaller\29 + *,.\36 u\24\28smaller\29 + *,.\35 u\24\28smaller\29 + *,.\34 u\24\28smaller\29 + *,.\33 u\24\28smaller\29 + *,.\32 u\24\28smaller\29 + *,.\31 u\24\28smaller\29 + * {clear: left;} .\-11u\28smaller\29 {margin-left: 91.66667%;}.\-10u\28smaller\29 {margin-left: 83.33333%;}.\-9u\28smaller\29 {margin-left: 75%;}.\-8u\28smaller\29 {margin-left: 66.66667%;}.\-7u\28smaller\29 {margin-left: 58.33333%;}.\-6u\28smaller\29 {margin-left: 50%;}.\-5u\28smaller\29 {margin-left: 41.66667%;}.\-4u\28smaller\29 {margin-left: 33.33333%;}.\-3u\28smaller\29 {margin-left: 25%;}.\-2u\28smaller\29 {margin-left: 16.66667%;}.\-1u\28smaller\29 {margin-left: 8.33333%;} } /* smaller iphone5 landscape */ @media screen and (max-width: 636px) { body, input, select, textarea {font-size: 12pt;} } @media screen and (max-width: 480px) { .row > *{padding:0 0 0 2.5em}.row{margin:0 0 -1px -2.5em} .row.uniform > *{padding:2.5em 0 0 2.5em}.row.uniform{margin:-2.5em 0 -1px -2.5em} .row.\32 00\25 > * {padding: 0 0 0 5em;}.row.\32 00\25 {margin: 0 0 -1px -5em;} .row.uniform.\32 00\25 > * {padding: 5em 0 0 5em;}.row.uniform.\32 00\25 {margin: -5em 0 -1px -5em;} .row.\31 50\25 > * {padding: 0 0 0 3.75em;}.row.\31 50\25 {margin: 0 0 -1px -3.75em;} .row.uniform.\31 50\25 > * {padding: 3.75em 0 0 3.75em;}.row.uniform.\31 50\25 {margin: -3.75em 0 -1px -3.75em;} .row.\35 0\25 > * {padding: 0 0 0 1.25em;}.row.\35 0\25 {margin: 0 0 -1px -1.25em;} .row.uniform.\35 0\25 > * {padding: 1.25em 0 0 1.25em;}.row.uniform.\35 0\25 {margin: -1.25em 0 -1px -1.25em;} .row.\32 5\25 > * {padding: 0 0 0 0.625em;}.row.\32 5\25 {margin: 0 0 -1px -0.625em;} .row.uniform.\32 5\25 > * {padding: 0.625em 0 0 0.625em;}.row.uniform.\32 5\25 {margin: -0.625em 0 -1px -0.625em;} .\31 2u\28xsmall\29, .\31 2u\24\28xsmall\29 {width: 100%;clear: none;margin-left: 0;}.\31 1u\28xsmall\29, .\31 1u\24\28xsmall\29 {width: 91.6666666667%;clear: none;margin-left: 0;}.\31 0u\28xsmall\29, .\31 0u\24\28xsmall\29 {width: 83.3333333333%;clear: none;margin-left: 0;}.\39 u\28xsmall\29, .\39 u\24\28xsmall\29 {width: 75%;clear: none;margin-left: 0;}.\38 u\28xsmall\29, .\38 u\24\28xsmall\29 {width: 66.6666666667%;clear: none;margin-left: 0;}.\37 u\28xsmall\29, .\37 u\24\28xsmall\29 {width: 58.3333333333%;clear: none;margin-left: 0;}.\36 u\28xsmall\29, .\36 u\24\28xsmall\29 {width: 50%;clear: none;margin-left: 0;}.\35 u\28xsmall\29, .\35 u\24\28xsmall\29 {width: 41.6666666667%;clear: none;margin-left: 0;} .\34 u\28xsmall\29, .\34 u\24\28xsmall\29 {width: 33.3333333333%;clear: none;margin-left: 0;}.\33 u\28xsmall\29, .\33 u\24\28xsmall\29 {width: 25%;clear: none;margin-left: 0;}.\32 u\28xsmall\29, .\32 u\24\28xsmall\29 {width: 16.6666666667%;clear: none;margin-left: 0;}.\31 u\28xsmall\29, .\31 u\24\28xsmall\29 {width: 8.3333333333%;clear: none;margin-left: 0;} .\31 2u\24\28xsmall\29 + *,.\31 1u\24\28xsmall\29 + *,.\31 0u\24\28xsmall\29 + *,.\39 u\24\28xsmall\29 + *,.\38 u\24\28xsmall\29 + *,.\37 u\24\28xsmall\29 + *,.\36 u\24\28xsmall\29 + *,.\35 u\24\28xsmall\29 + *,.\34 u\24\28xsmall\29 + *,.\33 u\24\28xsmall\29 + *,.\32 u\24\28xsmall\29 + *,.\31 u\24\28xsmall\29 + * { clear: left;} .\-11u\28xsmall\29 {margin-left: 91.66667%;}.\-10u\28xsmall\29 {margin-left: 83.33333%;}.\-9u\28xsmall\29 {margin-left: 75%;}.\-8u\28xsmall\29 {margin-left: 66.66667%;}.\-7u\28xsmall\29 {margin-left: 58.33333%;}.\-6u\28xsmall\29 {margin-left: 50%;}.\-5u\28xsmall\29 {margin-left: 41.66667%;}.\-4u\28xsmall\29 {margin-left: 33.33333%;}.\-3u\28xsmall\29 {margin-left: 25%;}.\-2u\28xsmall\29 {margin-left: 16.66667%;}.\-1u\28xsmall\29 {margin-left: 8.33333%;} } /* Basic */ html, body {background: #fff; } body,input,select,textarea{color:#222; font-family: 'Sofia Pro';font-size:12.5pt;line-height:1.75em} a{-moz-transition:border-color .2s ease-in-out,color .2s ease-in-out;-webkit-transition:border-color .2s ease-in-out,color .2s ease-in-out;-ms-transition:border-color .2s ease-in-out,color .2s ease-in-out;transition:border-color .2s ease-in-out,color .2s ease-in-out;text-decoration:none; color: #084f8d;} a:hover{color:#000;border-bottom-color:transparent} strong,b{font-weight:700} em,i{font-style:italic} p{margin:0 0 2em} h1,h2,h3,h4,h5,h6{font-weight:300;line-height:1em;margin:0 0 1em} h1 a,h2 a,h3 a,h4 a,h5 a,h6 a{color:inherit;border:0} h2{font-size:2em;line-height:1.5em;letter-spacing:-.025em} h3{font-size:1.35em;line-height:1.5em} h4{font-size:1.1em;line-height:1.5em} h5{font-size:.9em;line-height:1.5em} h6{font-size:.7em;line-height:1.5em} sub{font-size:.8em;position:relative;top:0.5em}sup{font-size:0.8em;position:relative;top:-.5em} hr{border:0;border-bottom:solid 1px #eee;margin:3em 0} hr.major{margin:4em 0} blockquote{border-left:solid 4px rgba(255,255,255,0.3);font-style:italic;margin:0 0 2em;padding:.5em 0 .5em 2em} code{background:rgba(255,255,255,0.075);border-radius:4px;font-family:"Courier New",monospace;font-size:.9em;margin:0 .25em;padding:.25em .65em} pre{-webkit-overflow-scrolling:touch;font-family:"Courier New",monospace;font-size:.9em;margin:0 0 2em}pre code{display:block;line-height:1.75em;padding:1em 1.5em;overflow-x:auto} .align-left{text-align:left}.align-center{text-align:center}.align-right{text-align:right} .alert {padding: 20px 0px} /* Section/Article */ section.special,article.special{text-align:center} .disclaimer{ font-size:0.9em; line-height: 1.3; } .disclamer { border-top:1px solid #ddd; padding-top: 2em } /* Form */ form { margin: 0 0 2em 0; } label { display: block; margin: 0; } input[type="text"], input[type="number"], input[type="password"], input[type="email"], select, textarea { -moz-appearance: none; -webkit-appearance: none; -ms-appearance: none; appearance: none; -moz-transition: border-color 0.2s ease-in-out; -webkit-transition: border-color 0.2s ease-in-out; -ms-transition: border-color 0.2s ease-in-out; transition: border-color 0.2s ease-in-out; background: transparent; border-radius: 4px; border: 1px solid #ccc; color: inherit; display: block; outline: 0; padding: 0 1em; text-decoration: none; width: 100%; font-size: 0.9em; } input[type="text"]:invalid, input[type="number"]:invalid, input[type="password"]:invalid, input[type="email"]:invalid, select:invalid, textarea:invalid { box-shadow: none; } input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus, select:focus, textarea:focus { border-color: #666; } select { background:url("../../images/arrow-down.png") right center no-repeat #fff; margin-bottom: 1em;} .select-wrapper { text-decoration: none; display: block; position: relative; } .select-wrapper:before { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-family: FontAwesome; font-style: normal; font-weight: normal; text-transform: none !important; } .select-wrapper:before { color: rgba(255, 255, 255, 0.3); content: '\f078'; display: block; height: 3em; line-height: 3em; pointer-events: none; position: absolute; right: 0; text-align: center; top: 0; width: 3em; } .select-wrapper select::-ms-expand { display: none; } input[type="text"], input[type="number"], input[type="password"], input[type="email"] { padding: 0.5em 1em; } select { padding: 0.5em 2.5em 0.5em 1em; } textarea { padding: 0.5em 1em; } select option { background-color: #fff; color: #333; font-size: 0.9em; } select:focus::-ms-value { background: transparent; } input[type="checkbox"], input[type="radio"] { /* -moz-appearance: none; -webkit-appearance: none; -ms-appearance: none; appearance: none;*/ font-size: 0.9em; width: 1em; height: 1em; z-index: 1; border:1px solid #ccc; vertical-align: sub; } input[type="checkbox"] + label, input[type="radio"] + label { text-decoration: none; color: rgba(255, 255, 255, 0.75); cursor: pointer; display: inline-block; font-size: 1em; font-weight: 100; padding-left: 2.55em; padding-right: 0.75em; position: relative; } input[type="checkbox"] + label:before, input[type="radio"] + label:before { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-family: FontAwesome; font-style: normal; font-weight: normal; text-transform: none !important; } input[type="checkbox"] + label:before, input[type="radio"] + label:before { border-radius: 4px; border: solid 1px rgba(255, 255, 255, 0.3); content: ''; display: inline-block; height: 1.8em; left: 0; line-height: 1.725em; position: absolute; text-align: center; top: 0; width: 1.8em; } input[type="checkbox"]:checked + label:before, input[type="radio"]:checked + label:before { background: rgba(255, 255, 255, 0.25); color: #ffffff; content: '\f00c'; } input[type="checkbox"]:focus + label:before, input[type="radio"]:focus + label:before { border-color: #e44c65; } input[type="checkbox"] + label:before { border-radius: 4px; } input[type="radio"] + label:before { border-radius: 100%; } ::-webkit-input-placeholder { color: #999 !important; opacity: 1.0; } :-moz-placeholder { color: #999 !important; opacity: 1.0; } ::-moz-placeholder { color: #999 !important; opacity: 1.0; } :-ms-input-placeholder { color: #999 !important; opacity: 1.0; } .formerize-placeholder { color: #999 !important; opacity: 1.0; } .form-group { position:relative;} .toggle-password { position: absolute; right: 10px; top: 70%; transform: translateY(-50%); cursor: pointer; color: #888; } .add { clear:both; margin-right: 1em;} .add a , .add button{ background:#00a5e1; color:#fff; padding: 0.5em 2em; font-size: 14px; font-family: inherit; border: 0;} .add a:hover, .add button:hover{ background: #084f8d;} .add button { background: #00a5e1; color:#fff; padding: 0.5em 2em; font-size: 14px; border-radius: 5px; ; border: none} .add button:hover{ background: #084f8d; border: none} /* List */ ol{list-style:decimal;margin:0 0 2em;padding-left:1.25em} ol li{padding-left:.25em} ul{list-style:disc;margin:0 0 2em;padding-left:1em} ul li{padding-left:.5em} dl{margin:0 0 2em} /* Table */ .table-wrapper{-webkit-overflow-scrolling:touch;overflow-x:auto} table{margin:0 0 2em;width:100%} table tbody tr{border:solid 1px rgba(255,255,255,0.3);border-left:0;border-right:0} table tbody tr:nth-child(2n + 1){background-color:rgba(255,255,255,0.075)} table td{padding:.75em} table th{color:#fff;font-size:.9em;font-weight:300;padding:0 .75em .75em;text-align:left} table thead{border-bottom:solid 1px rgba(255,255,255,0.3)} table tfoot{border-top:solid 1px rgba(255,255,255,0.3)} table.alt{border-collapse:separate} table.alt tbody tr td{border:solid 1px rgba(255,255,255,0.3);border-left-width:0;border-top-width:0} table.alt tbody tr td:first-child{border-left-width:1px} table.alt tbody tr:first-child td{border-top-width:1px} table.alt thead{border-bottom:0} table.alt tfoot{border-top:0} /* Button */ input[type="submit"], input[type="reset"], input[type="button"], .button { -moz-appearance: none; -webkit-appearance: none; -ms-appearance: none; appearance: none; -moz-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out, box-shadow 0.2s ease-in-out; -webkit-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out, box-shadow 0.2s ease-in-out; -ms-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out, box-shadow 0.2s ease-in-out; transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out, box-shadow 0.2s ease-in-out; background-color: #f4f4f4; border-radius: 4px; border: 0; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.3); color: #666!important; cursor: pointer; display: inline-block; font-weight: 300; height: 3em; line-height: 3em; padding: 0 2.25em; text-align: center; text-decoration: none; white-space: nowrap; } input[type="submit"]:hover, input[type="submit"]:active, input[type="reset"]:hover, input[type="reset"]:active, input[type="button"]:hover, input[type="button"]:active, .button:hover, .button:active { box-shadow: inset 0 0 0 1px #e44c65; color: #e44c65 !important; } input[type="submit"]:active, input[type="reset"]:active, input[type="button"]:active, .button:active { background-color: rgba(228, 76, 101, 0.15); } input[type="submit"].disabled, input[type="submit"]:disabled, input[type="reset"].disabled, input[type="reset"]:disabled, input[type="button"].disabled, input[type="button"]:disabled, .button.disabled, .button:disabled { background-color: rgba(255, 255, 255, 0.3) !important; box-shadow: none !important; color: #ffffff !important; cursor: default; opacity: 0.25; } /* Spotlight */ .spotlight { position:relative; } .spotlight .image.main {display: none;} .spotlight .image.main img {position: relative;} .spotlight .content {-moz-transform: translate(0,0);-webkit-transform: translate(0,0);-ms-transform: translate(0,0);transform: translate(0,0);-moz-transition: -moz-transform 1s ease, opacity 1s ease;-webkit-transition: -webkit-transform 1s ease, opacity 1s ease;-ms-transition: -ms-transform 1s ease, opacity 1s ease;transition: transform 1s ease, opacity 1s ease;opacity: 1;} .spotlight.top .content, .spotlight.bottom .content {left: 0;width: auto;} .spotlight.top .content {top: 0;} .spotlight.bottom .content {bottom: 0;} .spotlight.left .content, .spotlight.right .content {top: 0;width: auto;} .spotlight.left .content {left: 0;} .spotlight.right .content {right: 0;} .spotlight.inactive .content {opacity: 0;} .spotlight.inactive.top .content {-moz-transform: translate(0,-5em);-webkit-transform: translate(0,-5em);-ms-transform: translate(0,-5em);transform: translate(0,-5em);} .spotlight.inactive.bottom .content {-moz-transform: translate(0,5em);-webkit-transform: translate(0,5em);-ms-transform: translate(0,5em);transform: translate(0,5em);} .spotlight.inactive.left .content {-moz-transform: translate(-5em,0);-webkit-transform: translate(-5em,0);-ms-transform: translate(-5em,0);transform: translate(-5em,0);} .spotlight.inactive.right .content {-moz-transform: translate(5em,0);-webkit-transform: translate(5em,0);-ms-transform: translate(5em,0);transform: translate(5em,0);} /* Wrapper */ .wrapper {padding: 4em 0 4em 0; } .wrapper.style2 {background: #e44c65;} .wrapper.fade-down > .container {-moz-transform: translate(0,0);-webkit-transform: translate(0,0);-ms-transform: translate(0,0);transform: translate(0,0);-moz-transition: -moz-transform 1s ease, opacity 1s ease;-webkit-transition: -webkit-transform 1s ease, opacity 1s ease;-ms-transition: -ms-transform 1s ease, opacity 1s ease;transition: transform 1s ease, opacity 1s ease;opacity: 1;} .wrapper.fade-down.inactive > .container {-moz-transform: translate(0,-1em);-webkit-transform: translate(0,-1em);-ms-transform: translate(0,-1em);transform: translate(0,-1em);opacity: 0;} .wrapper.fade-up > .container {-moz-transform: translate(0,0);-webkit-transform: translate(0,0);-ms-transform: translate(0,0);transform: translate(0,0);-moz-transition: -moz-transform 1s ease, opacity 1s ease;-webkit-transition: -webkit-transform 1s ease, opacity 1s ease;-ms-transition: -ms-transform 1s ease, opacity 1s ease;transition: transform 1s ease, opacity 1s ease;opacity: 1;} .wrapper.fade-up.inactive > .container {-moz-transform: translate(0,1em);-webkit-transform: translate(0,1em);-ms-transform: translate(0,1em);transform: translate(0,1em);opacity: 0;} .wrapper.fade > .container {-moz-transition: opacity 1s ease;-webkit-transition: opacity 1s ease;-ms-transition: opacity 1s ease;transition: opacity 1s ease;opacity: 1;} .wrapper.fade.inactive > .container {opacity: 0; } /* Dropotron */ .dropotron {background: rgba(39, 40, 51, 0.965);;box-shadow: 0 0.075em 0.35em 0 rgba(0, 0, 0, 0.125);list-style: none;margin-top: calc(-0.25em + 1px);min-width: 12em;padding: 0.25em 0;} .dropotron > li {border-top: solid 1px rgba(255, 255, 255, 0.035);padding: 0;} .dropotron > li a, .dropotron > li span {border: 0;color: rgba(255, 255, 255, 0.75);display: block;padding: 0.1em 1em;text-decoration: none;} .dropotron > li:first-child {border-top: 0;} .dropotron > li.active > a, .dropotron > li.active > span {color: #e44c65;} .dropotron.level-0 {font-size: 0.8em;margin-top: 1em;} .dropotron.level-0:before {-moz-transform: rotate(45deg);-webkit-transform: rotate(45deg);-ms-transform: rotate(45deg);transform: rotate(45deg);background: #272833;content: '';display: block;height: 1em;position: absolute;right: 1.5em;top: -0.5em;width: 1em;} /* Header */ #page-wrapper { } #header { background: #fff; box-shadow: 0 0 0.25em 0 rgba(0, 0, 0, 0.25); cursor: default; width: 100%; padding: 10px 5%; z-index: 100; display: flex; justify-content: space-between; align-items: center; } #header #logo { height: inherit; } #header #logo img { display:block; max-height: 80px; width: auto;} #header nav { font-size:1.1em; } #header nav ul { margin: 0; } #header nav ul li { display: inline-block; margin-left: 1em; } #header nav ul li a, #header nav ul li span { border: 0; color: inherit; display: inline-block; height: inherit; line-height: inherit; outline: 0; } #header nav ul li a.button{ height: 2em; line-height: 2em; border-radius: 0; padding: 0 1.25em; background: #00a5e1; color: #fff !important; border:0; box-shadow: none; } #header nav ul li a.button:hover { border:0; box-shadow: none; background:#084f8d; color: #fff;} #header nav ul li a:not(.button):before, #header nav ul li span:not(.button):before { margin-right: 0.5em; } #header nav ul li.active > a, #header nav ul li.active > span { color:#125b60; } #header nav ul li > ul {display: none;} #form-page { background:#f1f3f4; min-height: 90vh; } .login-info { min-height: 4em;} #formbox { } #formbox #breadcrumb { background:#084f8d; color: #fff; text-align: center; padding:0em 2em;} #formbox #breadcrumb .breadcrumb {background:#084f8d} #formbox .content {background :#fff; padding:2em 2em 2em 2em; } #formbox .title {color: #125b60; font-size:2em; font-weight: bold; margin-bottom: 2em; text-align: center;} #formbox .box {background:#fff; padding:3em 2em; box-shadow: 0 0 10px rgba(0,0,0,0.2); } #formbox.login {box-shadow: none;} #formbox.login .content {box-shadow: 0 0 10px rgba(0,0,0,0.2); max-width: 600px; margin: 0 auto; padding: 3em;} #formbox.login .note { text-align:center; padding: 2em;} #formbox .note { padding: 2em; } #formbox .note .midtitle { margin-bottom:1em;} #formbox .note p { margin-bottom:1em;} #formbox.login .note.align-left { text-align:left;} #formbox.login input {border:0; border-bottom: 1px solid rgba(0,0,0,0.6); border-radius:0; margin-bottom: 1em; } #formbox.login .tab-container { max-width: 500px; margin: auto; background: #fff; box-shadow: 0 0 10px rgba(0,0,0,0.1); overflow: hidden; } #formbox.login .tabs { display: flex; border-bottom: 1px solid #ccc; } #formbox.login .tab { flex: 1; text-align: center; padding: 12px; cursor: pointer; background: #eee; transition: 0.3s; } #formbox.login .tab.active { background: #fff; font-weight: bold; border-bottom: 2px solid #084f8d; } #formbox.login .tab-content { display: none; padding: 2em 2em 1em 2em; } #formbox.login .tab-content.active { display: block; } #formbox.login .form-group { position: relative; margin-bottom: 20px; } #formbox.login input { width: 100%; padding: 12px 40px 12px 12px; border:0; border-bottom: 1px solid #ccc; border-radius: 0; } #formbox.login .toggle-password { position: absolute; right: 10px; top: 3.5em; transform: translateY(-50%); cursor: pointer; color: #888; } #formbox.login button { width: 100%; padding: 12px; background-color: #084f8d; color: white; border: none; font-size: 16px; } .title { text-align: center; font-size: 25px; margin-bottom: 20px; } .midtitle { font-size: 1.6em; color: #084f8d; } .smalltitle { font-size: 1.3em; color:#084f8d; margin-bottom: 1em; } .captcha-sample { margin-bottom: 1em; margin-top: 1em;} .forgotpassword {margin-top: 2em; color: #084f8d; } #formbox.login button.guest{ background:#8b8b8b; margin-top: 1em;} #formbox.login button:hover{ background: #1b6166;} #formbox.login button.guest:hover { background:#333;} #formbox.login input.email { background:url(../../images/email-form.png) left center no-repeat; background-size:30px; padding-left:50px; } #formbox.login input.password { background:url(../../images/password-icon.png) left center no-repeat; background-size:34px; padding-left:50px; } #formbox.login input.user { background:url(../../images/user-icon.png) left center no-repeat; background-size:34px; padding-left:50px; } #formbox.login input.company { background:url(../../images/company.png) left center no-repeat; background-size:34px; padding-left:50px; } .forgotpassword a{ color:inherit;} .breadcrumb li { list-style:none; padding: 10px 1.5em;} .breadcrumb li a { color:#c3c3c3;} .breadcrumb li a:hover {color:#fff !important;} .breadcrumb li.active a, .breadcrumb li.done a { color:#fff; } .breadcrumb li:last-child { margin-right:0; } .breadcrumb { list-style: none; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; padding: 0; margin: 0; font-family: sans-serif; } .breadcrumb li { position: relative; margin-right: 20px; } .breadcrumb li a { text-decoration: none; color: #cdcdcd; } .breadcrumb li.active a { font-weight: bold; } .breadcrumb li::after { content: ''; position: absolute; top: 50%; right: -14px; transform: translateY(-50%); width: 10px; height: 10px; background: url("data:image/svg+xml,%3Csvg fill='%23999' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 12'%3E%3Cpath d='M1.41 0L0 1.41 4.58 6 0 10.59 1.41 12l6-6z'/%3E%3C/svg%3E") no-repeat center center; background-size: contain; } /* Remove arrow from last breadcrumb */ .breadcrumb li:last-child::after { content: none; } .login-info { display:flex; justify-content: space-between; align-items: center;} select.inline-width { width:auto; max-width: 100%; padding: 0.5em 3em 0.5em 1em} .checkbox-options { margin-bottom: 1em;} .checkbox-options label { display:inline-block; width: 30%;} /*tooltip*/ .info-container { position: relative; display: inline-block; cursor: pointer; font-size: 18px; vertical-align: text-top; } .info-icon { border-radius: 50%; border: 1px solid #666; width: 20px; height:20px; line-height: 18px; font-size: 14px; color: #666; text-align: center; display: inline-block; font-weight: bold; } .info-text { visibility: hidden; width: max-content; max-width: 500px; font-size: 12px; line-height: 1.2; font-weight: normal; background-color: #eaeaea; color: #333; text-align: left; padding: 10px; position: absolute; z-index: 1; bottom: 125%; /* Position above the icon */ left: 50%; transform: translateX(-50%); opacity: 0; transition: opacity 0.3s; pointer-events: none; } .info-container:hover .info-text { visibility: visible; opacity: 1; } /* Optional: Tooltip arrow */ .info-text::after { content: ""; position: absolute; top: 100%; left: 50%; margin-left: -5px; border-width: 5px; border-style: solid; border-color: #eaeaea transparent transparent transparent; } .selectoption { display:flex; gap:10px; } .selectoption option { min-width:200px;} .selectoption .select-wrapper { width:100%;} .selectoption label { } .year-inputs { position: relative} .year-inputs .remove-btn{ position:absolute; right:0;} .year-inputs label { text-align:center;} .selectoption label strong { font-weight: normal;} .scopeone .selectoption label{ margin-right: 1em; min-width: 50%} .scopeone .input-year , .scopetwo .input-year , .scopeone .year-inputs{ display:grid; grid-template-columns: repeat(5, 1fr); gap:10px; text-align: center;} .scopeone .info-container, .scopetwo .info-container{ vertical-align: bottom;} .input-year input, .year-inputs input{ width: 7em; margin-bottom: 1em; font-weight: normal;} .input-year label strong { font-weight:normal;} .scopeone .delete, .scopetwo .delete { text-align:right; display: flex; align-items: center; justify-content: flex-start; padding-top: 0.5em; } .scopeone .delete img, .scopetwo .delete img { max-width: 22px; height: auto;} .scopeone .delete img:hover, .scopetwo .delete img:hover { filter:brightness(50%);} #action-btn { padding:2em 0; } #action-btn button { padding: 12px 2em; font-size:16px; background: #00a5e1; color: #fff; border: 0; margin-right: 1em;} #action-btn button.previous { background: #ccc; color: #343434; } #action-btn button:hover{ background: #084f8d;} #action-btn button.previous:hover { background:#084f8d; color: #fff;} .delete button {background: none; border: none} .unit-display {padding: 0.3em 2.5em 0.3em 1em; margin: 10px 0px 0px 0px; background-color: #f0f0f0; border: 1px solid #ccc; border-radius: 4px; display: inline-block; min-width: 60px; text-align: center;} .year-input-scope2 {width: auto; min-width: 70px;} .scopetwo .source .input-year { display: flex; justify-content: space-between; align-items: center;} .scopetwo .source { margin-bottom: 1em;} .scopetwo .source .electricity-inputs {display: grid; grid-template-columns: repeat(4, 1fr); max-width:calc(100% - 60px); gap:10px;} .scopetwo .source .input-year input { font-size: 0.9em; border: 1px solid #ccc; padding: 0.5em 1em 0.5em 1em;} .scopetwo .electricity-group label{ } .scopeone .remove-btn { height:100% !important;} .scopetwo .source .remove-btn , .scopeone .remove-btn { background: url("../../images/delete-icon.png") 10px no-repeat; background-size:22px; width:20%;height: 40px; border:0; appearance: none; cursor: pointer;} .kwh { margin-left:1em;} .demo-only { background: #f4f4f4; padding: 2em; margin-top: 2em;} #calculateBtn , #summaryBtn{ background: #084f8d; color:#fff; padding: 5px 2em;} #downloadBtn { display:none;} #result { margin-top: 1.5rem; font-size: 1.1rem; white-space: pre-line; } .optional .extra-content { max-height: 0; overflow: hidden; transition: max-height 0.3s ease; } /* Fix: Use :has() to check if the checkbox is checked */ .optional:has(input[type="checkbox"]:checked) .extra-content { max-height: 500px; } /* Footer */ #footer { background:#002545; padding: 1em 0; text-align: center; color: rgba(255, 255, 255, 0.8); font-size: 15px; line-height: 1.2; } .pdf-cover { width: 100%; max-width: 400px; height: auto; display: block;} #banner { background: url("../../images/banner-icon.png") no-repeat 18% center #084f8d; background-size:16%; color:#fff;} #banner .caption { font-size:2em;line-height: 1.2; padding-left: 30%;} #banner .caption .description{ font-size:0.5em; font-weight: normal; line-height: 1.5em; margin-top: 1.7em; text-align: justify;} #banner .get-started { margin-top:1em;} #banner .get-started a{ background:#00a5e1; color:#fff; padding: 0.5em 1.5em; font-size: 1.3rem; font-weight: normal;} #banner .get-started a:hover { background:#fff; color: #222;} #banner.pic { background:url("../../images/bg.jpg") center right no-repeat; background-size:100%; } #banner.pic .caption{ padding-left:0; padding-right: 60%; } #banner.pic .overlay { padding:2em 0; background:rgba(32,75,106,0.4);} #banner.icons { background: url("../../images/banner-icons.jpg") no-repeat; background-size:100%; padding:4em 0;} #banner.icons .caption{ color:#333; padding-left: 33%; } #banner.icons .get-started a{background: #084f8d; color:#fff;} #banner.icons .get-started a:hover{ background:#105b60; } #banner.general { background: #084f8d; min-height: 365px;} #banner.general .caption { padding-left:2.5rem;} #static img { width:100%; height: auto;} #intro.whitebg { background:#fff;} #what.greybg { background:#f4f4f4;} .whitebg .example { background: #f4f4f4; padding: 1em 2em; margin-bottom: 3em; border-left: 4px solid #084f8d;} .whitebg .example ul{ margin-bottom:0;} .maintitle { font-size:1.6em; color:#084f8d; line-height: normal; margin-bottom: 0.5em;} #intro { background:#f4f4f4; text-align: justify;} #intro .box , #about .box , #methodology .box , #emmision .box{ background:#084f8d; box-shadow: 0px 6px 38px -2px rgba(4,47,83,0.68); color:#ccdeed; padding: 2.5em;} #intro .box .title, #about .box .title , #methodology .box .title , #emmision .box .title{ text-align:left; color:#fff; } #intro .box .info { } #intro .flex .box { display:flex; gap:2em; align-items: center;} #intro .thumbnail { } #home-about { background: url("../../images/lightgrey-bg.jpg"); background-size:100%; } #home-about .overlay { background:rgba(255,255,255,0.2); padding: 4em 0;} #home-about .box.sedg{ background:#fff; color:#333; display:flex; height: 100%; flex-direction: row; padding: 2.5em; gap: 30px; box-shadow: 0px 6px 38px -2px rgb(178 178 178 / 68%);} #home-about .box.sedg p.description { min-height: 10.4em; } #home-about .box.sedg .thumbnail img { max-width: 230px;} #home-about .box { height:100%;} #home-about .flex { display:flex; align-items: center;} #intro .note a{text-decoration: underline; color:#fff;} #intro .note a:hover { color:#00a5e1; text-decoration: none;} #about { text-align:justify;} #about .box p:last-child { margin-bottom: 0;} #methodology .box.whitebg{ background:transparent; color: inherit; /*box-shadow: 0px 6px 38px -2px rgb(178 178 178 / 68%);*/ box-shadow: none; padding:2em 0 0 0;} #methodology .box .row.flex { display:flex;} .scope-content { background:#fff; border-left: 3px solid; border-color:#084f8d; padding: 1em; line-height: 1.2; font-size: 0.95em; margin: 1em 0;} .scope-content.two{ border-color:#1d7fe1;} .scope-content.three{border-color:#b82222;} .co2 { max-height:80px; width:auto; float:left; margin-right: 1em;} #what .co2{ float: none;} #what .title { text-align:left; font-weight: bold;} #what .row.flex { display:flex; align-items: end;} #what .info { margin-bottom:1em;} img.image-full { width:100%; height: auto; display: block;} #what .sedg .info { background: #165ca2; color:#fff; padding:2em; margin-bottom: 10px; } .read a{ background: #00a5e1; color:#fff; padding: 0.5em 1.5em; font-size: 1em; } .read a:hover { background:#fff; color:#222;} .sedg .read a:hover{ background: #084f8d; color:#fff;} #scope-info { background:#f4f4f4; padding: 0 0 4em 0;} #scope-info .row.flex{ display: flex;} #scope-info .scopebox { background:#fff; padding: 2em; height: 100%; box-shadow:0px 6px 38px -2px rgba(4,47,83,0.29); } #scope-info .scopebox .title { text-align:left; color: #084f8d;} #scope-info .scopebox .info { text-align:justify;} #scope-info .note { margin-top:2em;} #home-method { background: url("../../images/tree-bg.jpg") no-repeat center fixed; background-size:cover; text-align: justify;} #home-method .overlay {padding: 4em 0; background: rgba(37,75,124,0.8); min-height:300px; color: #fff;} #home-method .title { text-align:left;} #home-method .format { color: #fff; font-size: 1.2em; font-style: italic; font-weight: bold;} #home-method .frame {display: inline-block; background: rgba(255,255,255,0.2); padding: 1em 2em;} #home-about .title { text-align:left; color:#084f8d;} #home-about .read a:hover{ background: #084f8d; color:#fff;} #summaryChart { margin-top: 2rem; max-width: 100%; height: auto; } .hidden { display: none; } #methodology .title{ text-align: left; } #methodology .overview{ text-align: justify; padding-bottom: 2em;} #methodology .box{text-align: justify;} #methodology .box .right { border:1px solid rgba(255,255,255,0.3); padding: 2em; display: flex; flex-direction: column; height: calc(100% - 2em); align-items: center; justify-content: center;} #methodology .box .formula{ margin-top: 1em; font-size: 1.2em; font-style:italic; font-weight: bold; color: #fff;} /*#emmision .box { text-align: justify; background:#fff; box-shadow: 0px 6px 38px -2px rgb(178 178 178 / 68%); color:inherit; border-radius:25px; padding: 2.5em ; }*/ #emmision { background: url("../../images/emmision-bg.jpg") fixed; background-size:cover;text-align: justify;color:#fff;} #emmision .title { text-align:left;} #emmision .overlay{ background:rgba(21,60,111,0.67); padding: 4em 0; } #more-detials { background:#f4f4f4; padding: 2.5em; } #more-detials .container { display:flex; gap:2em; justify-content: space-between; } #more-detials .read { min-width:170px; text-align: right;} #more-detials .read a:hover{ background: #084f8d; color: #fff;} #stationary-section table th{ color:inherit;} /* XLarge */ @media screen and (max-width: 1680px) { body, input, select, textarea { font-size: 11pt;} .input-year input , .year-inputs input{ height:46px;} #banner { background-position:6% center;} #banner .caption { padding-left:22%;} } @media screen and (max-width: 1500px) { #home-about .box.sedg .thumbnail img{ max-width: 205px;} #home-about .box.sedg .thumbnail{ background: #165ca2;} } /* Large */ @media screen and (max-width: 1100px) { body, input, select, textarea {font-size: 10.5pt;} .wrapper {padding: 4.5em 0 2.5em 0;} #intro .flex { flex-direction:column;} /* Dropotron */ .dropotron.level-0 {font-size: 1em;} .scopeone .input-year , .scopeone .year-inputs{ max-width:500px;} #intro .box .title { min-height:80px;} #home-about .box.sedg .title { min-height:30px;} #intro .flex .box { height:auto; margin-bottom: 2.5em; justify-content: space-between;} #intro .box .info , #intro .flex .box.sedg p.description {} #home-about .box.sedg p.description { max-width:560px;} #home-about .box.sedg .thumbnail img { max-width:150px;} } /* Medium */ @media screen and (max-width: 980px) { body, input, select, textarea {font-size: 10.5pt;} .wrapper {padding: 4.5em 2.5em 2.5em 2.5em;} #header #logo img { max-height:60px;} #formbox #breadcrumb { font-size:15px; padding: 0 1em;} .breadcrumb li {padding: 10px 1em;} #formbox.login .note { padding:1em;} .checkbox-options { display:grid; grid-template-columns: repeat(3, 1fr); /* 3 items per row on mobile */} .checkbox-options label { display: block; width: 100%; } #banner .caption { font-size:1.5rem;} #banner .get-started a { font-size:1rem;} #banner .wrapper{ padding:4em 2em;} #intro .flex { flex-direction: column;} #intro .box {margin-bottom:2em;} #banner.icons { padding:0;} #scope-info .row.flex { display: block;} #scope-info { padding-left: 5% ; padding-right: 5%;} #scope-info .scopebox { margin-bottom: 2em;} #home-method .overlay {padding:4em 5% ;} #home-about{ padding:0em 5% ; } #home-about .title { margin-top:0em;} .info-text { max-width: 50vw;} #methodology .box .row.flex { display:block;} #methodology .box .right { margin-bottom:2em;} #emmision .overlay{ padding: 2em;} #banner.general .caption{ padding-top: 0; padding-left: 0;} #home-about .box.sedg { margin-top:2em;} #home-about .flex { display:block;} } /* Small */ #navPanel, #titleBar {display: none;} @media screen and (max-width: 736px) { html, body {overflow-x: hidden;} body, input, select, textarea {font-size: 10.5pt;} h2 {font-size: 1.5em;} h3 {font-size: 1.2em;} h4 {font-size: 1em;} #header { justify-content: center;} #header #nav { } #formbox #breadcrumb { padding:0;} .breadcrumb li { padding:0; font-size: 12px;} #banner.icons { background-repeat: repeat-y;} #banner.icons .caption { padding-top:0;} /* Off-Canvas Navigation */ #page-wrapper {-moz-backface-visibility: hidden;-webkit-backface-visibility: hidden;-ms-backface-visibility: hidden;backface-visibility: hidden;-moz-transition: -moz-transform 0.5s ease;-webkit-transition: -webkit-transform 0.5s ease;-ms-transition: -ms-transform 0.5s ease;transition: transform 0.5s ease; padding-bottom: 1px;padding-top: 0px !important;} #titleBar { -moz-backface-visibility: hidden;-webkit-backface-visibility: hidden;-ms-backface-visibility: hidden;backface-visibility: hidden;-moz-transition: -moz-transform 0.5s ease;-webkit-transition: -webkit-transform 0.5s ease;-ms-transition: -ms-transform 0.5s ease;transition: transform 0.5s ease; display: block; height: 44px; left: 0; position: fixed; top: 0; width: 100%; z-index: 10001; } #titleBar .title { color: #ffffff; display: inline-block;; height: 44px; line-height: 44px; text-align: center; } #titleBar .title a {color: inherit;border: 0;} #titleBar .toggle { text-decoration: none; height: 60px; left: 0; position: absolute; top: 0; width: 90px; outline: 0; border: 0; } #titleBar .toggle:before { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-family: FontAwesome; font-style: normal; font-weight: normal; text-transform: none !important; } #titleBar .toggle:before { background: #00a5e1; color: rgba(255, 255, 255, 0.5); content: '\f0c9'; display: block; font-size: 18px; height: 44px; left: 0; line-height: 44px; position: absolute; text-align: center; top: 0; width: 54px; } #navPanel { -moz-backface-visibility: hidden;-webkit-backface-visibility: hidden;-ms-backface-visibility: hidden;backface-visibility: hidden;-moz-transform: translateX(-275px);-webkit-transform: translateX(-275px);-ms-transform: translateX(-275px);transform: translateX(-275px);-moz-transition: -moz-transform 0.5s ease;-webkit-transition: -webkit-transform 0.5s ease;-ms-transition: -ms-transform 0.5s ease;transition: transform 0.5s ease; display: block; height: 100%; left: 0; overflow-y: auto; position: fixed; top: 0; width: 275px; z-index: 10002; background: #181920; padding: 0.75em 1.25em; } #navPanel .link { border: 0; border-top: solid 1px rgba(255, 255, 255, 0.05); color: rgba(255, 255, 255, 0.75); display: block; height: 3em; line-height: 3em; text-decoration: none; } #navPanel .link:hover {color: inherit !important;} #navPanel .link:first-child {border-top: 0;} #navPanel .link.depth-0 {color: #ffffff;font-weight: 300;} #navPanel .link .indent-1 {display: inline-block;width: 1.25em;} #navPanel .link .indent-2 {display: inline-block;width: 2.5em;} #navPanel .link .indent-3 {display: inline-block;width: 3.75em;} #navPanel .link .indent-4 {display: inline-block;width: 5em;} #navPanel .link .indent-5 {display: inline-block;width: 6.25em;} body.navPanel-visible #page-wrapper {-moz-transform: translateX(275px);-webkit-transform: translateX(275px);-ms-transform: translateX(275px);transform: translateX(275px);} body.navPanel-visible #titleBar {-moz-transform: translateX(275px);-webkit-transform: translateX(275px);-ms-transform: translateX(275px);transform: translateX(275px);} body.navPanel-visible #navPanel {-moz-transform: translateX(0);-webkit-transform: translateX(0);-ms-transform: translateX(0);transform: translateX(0);} #banner.pic .caption { padding-right:30%;} } /* iphone5 landscape - smaller*/ @media screen and (max-width: 636px) { } /* XSmall */ @media screen and (max-width: 480px) { html, body {min-width: 320px;} body, input, select, textarea {font-size: 11pt;} .checkbox-options { display:grid; grid-template-columns: repeat(1, 1fr); /* 3 items per row on mobile */} input[type="submit"],input[type="reset"],input[type="button"],.button {padding: 0;} .wrapper {padding: 3em 1.25em 1em 1.25em;} #footer { padding:1em;} .scopeone .selectoption { display:block;} .scopeone .selectoption label { margin-right:0;} .scopeone .input-year, .scopeone .year-inputs { display:grid; grid-template-columns: repeat(2, 1fr); text-align: left;} .scopeone .input-year > div , .scopeone .year-inputs > div{ grid-column: span 2; } .input-year input, .year-inputs input { width: 100%; } .pdf-cover{ max-width:100%;} .excel-download, .pdf-download { width:100%; margin-top: 1em;} #banner .caption { padding-left:0; padding-top: 70px;} #banner {background-position:2em 2em; background-size: 100px; } #banner.pic { background-size:cover;} #banner.pic .caption { padding:0;} #what .row.flex { flex-direction:column;} #home-about { background-size:cover;} #home-about .box.sedg {flex-direction:column;} #home-about .box.sedg .thumbnail img { max-width:100%;} #more-detials .container { display:block; text-align: center;} #more-detials .read { text-align: center; margin-top: 1em;} #intro .flex .box { flex-direction: column;} #home-about .box.sedg p.description { min-height:100px;} } /* -------------------------------------------- */ /* --- Hamburger Menu Styles --- */ /* -------------------------------------------- */ #hamburger-button { display: none; /* Hidden by default on larger screens */ background: none; border: none; padding: 10px; cursor: pointer; z-index: 1001; /* Ensure it's above other header content if needed */ position: relative; /* Or absolute/fixed depending on your header layout */ /* Adjust positioning if needed, e.g., float: right; margin: 10px; */ } #hamburger-button span { display: block; width: 25px; height: 3px; background-color: #333; /* Color of the burger lines - match your site */ margin: 5px 0; transition: all 0.3s ease-in-out; border-radius: 3px; } /* Styles for the