*{margin:0;padding: 0;}.clearfix:before, .clearfix:after { content: ""; display: table; }.clearfix:after { clear: both; }.clearfix { *zoom: 1; }a{text-decoration: none;}button{box-shadow: none;border: none;background: none;cursor: pointer;}img{border: none;}ul,li{list-style: none;}html { font-size: 62.5%; }body {font-family: 'Noto Sans', sans-serif; font-weight: 400;}p{font-size: 1.5rem;line-height: 2.4rem;}em{font-style: normal;}h4{font-weight: 700; font-size: 1.6rem; color:var(--darkgreyfont-2);}.dcselection{background: rgb(0 0 0 / 70%);     position: fixed;     left: 0;     right: 0;     top: 0;     bottom: 0;     justify-content: center;     align-items: center;     display: flex;     z-index: 2;}.relative{position: relative;}.flex{display: flex;}.ease{ -webkit-transition: transform 0.3s ease-out; -moz-transition: transform 0.3s ease-out; -ms-transition: transform 0.3s ease-out; -o-transition: transform 0.3s ease-out; transition: transform 0.3s ease-out;}@font-face { font-family: 'datacenter'; src:  url('../../fonts/dcselection/datacenter.1dc0ca0ccd2184a96d53af2d7ed6d770.eot'); src:  url('../../fonts/dcselection/datacenter.1dc0ca0ccd2184a96d53af2d7ed6d770.eot') format('embedded-opentype'), url('../../fonts/dcselection/datacenter.4c4f2dc44cdeb3ef52f8561674cd4da3.woff2') format('woff2'), url('../../fonts/dcselection/datacenter.27f76104b61d6e68ebcb85bfaed5ca0b.ttf') format('truetype'), url('../../fonts/dcselection/datacenter.9a563a346714c456b60b51cd4ed70dba.woff') format('woff'), url('../../fonts/dcselection/datacenter.23711225044d85de56e086caf91a4a3a.svg') format('svg'); font-weight: normal; font-style: normal; font-display: block; }[class^="icon-"], [class*=" icon-"] {  font-family: 'datacenter' !important; speak: never; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }.icon-right-arrow:before { content: "\e900"; }.icon-down-arrowfill:before { content: "\e901"; }.icon-close_ic:before {  content: "\e902";}@font-face { font-family: 'Noto Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url(https://fonts.gstatic.com/s/notosans/v27/o-0IIpQlx3QUlC5A4PNr5TRASf6M7Q.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }@font-face { font-family: 'Noto Sans'; font-style: normal; font-weight: 500; font-display: swap; src: url(https://fonts.gstatic.com/s/notosans/v27/o-0NIpQlx3QUlC5A4PNjFhdVZNyBx2pqPA.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }@font-face { font-family: 'Noto Sans'; font-style: normal; font-weight: 600; font-display: swap; src: url(https://fonts.gstatic.com/s/notosans/v27/o-0NIpQlx3QUlC5A4PNjOhBVZNyBx2pqPA.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }@font-face { font-family: 'Noto Sans'; font-style: normal; font-weight: 700; font-display: swap; src: url(https://fonts.gstatic.com/s/notosans/v27/o-0NIpQlx3QUlC5A4PNjXhFVZNyBx2pqPA.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }.reg{ font-weight: 400; }.medium{font-weight: 500; }.semi{ font-weight: 600;}.bold,b{font-weight: 700;}.white_theme{    --bluecolor:#2075EA;    --onhovbluecolor:#115CC3;    --blueicon:#1665AD;    --lightblue:#F4FAFF;    --lightgrey:#ECECEC;    --darkgrey:#363636;    --lightgrey-3:#DADADA;    --lightgrey-2:#E7E7E7;    --darkgreyfont:#555555;    --darkgreyfont-2:#6D6D6D;    --whitecolor:#fff;    --darkbluishgrey:#8989A7;    --greyfont:#3D3D3D;    --bordergrey:#F3F3F3;    --borderdgrey:#EBEBEB;    --icongrey:#808080;    --blueborder:#2687E0;    --blueborderonhover:#1a4e7d;    --bluefont:#1665AD;    --onhoverblue:#0693e2;    --boxshadow:0 2px 4px 0 rgba(0,0,0,0.05);    --boxshadow-bg:rgba(255,255,255,0.19);    --boxshadowmenu:0 2px 5px 1px rgba(37,37,37,0.08);    --lightred:#ff7e7e;    --redfont:#f95050;    --redicon:#ad1616;    --lightdark:#787878;    --orangeBg:#FF6500;    --orangeBgHo:#D55B0B;    --orangeFont:#EF6B14;    --orangeborderHo:#BC4C03;}.dcwrapper{display: flex;               background: #fff;               width: 600px;               min-height: 600px;               flex-flow: column;               position: relative;}.dcwrapper header{border-bottom: 1px solid var(--bordergrey);padding: 24px;}.dcwrapper .productlogo img{height: 26px;width: 32px}.mainbody{       margin-top: 10rem; display: flex; justify-content: center;}.mainbody .choose_wr{ position: relative;   flex-flow: column;}.mainbody .label_txt{font-size: 1.5rem; color: var(--darkgreyfont-2);}.mainbody .dropdown_value{background: var(--whitecolor);cursor: pointer; min-width: 240px;  padding: 12px 16px 12px 8px; align-self: self-start; border: 1px solid var(--lightgrey-3); border-radius: 4px; font-size: 1.5rem; color: var(--greyfont); display: flex; align-items: center; justify-content: space-between;}.mainbody .icon-down-arrowfill{font-size: .6rem;color: var(--icongrey);position: relative; z-index: 1;}.mainbody .dropdown_value:hover{box-shadow: var(--boxshadowmenu);}.mainbody .bottom_wr{align-self: self-start; margin-top: 1.6rem;display: flex; flex-flow: column;}.mainbody .blue_btn{    background: var(--bluecolor);                        margin-top: 4rem;                        font-size: 1.5rem;                        display: flex;                        align-items: center;                        justify-content: center;                        color: var(--whitecolor);                        border-radius: 4px;                        padding: 13px 0;                        min-width: 100%;                        align-self: flex-end;                        position: relative;                        min-height: 44px;}.mainbody .blue_btn:hover{background: var(--onhovbluecolor);}.mainbody .blue_btn:hover .icon-right-arrow{ -webkit-transform: translateX(4px);display: inline-block; -moz-transform: translateX(4px); -ms-transform: translateX(4px); -o-transform: translateX(4px); transform: translateX(4px);}.datacenter_ul {    position: absolute;    left: 0;    top: 46px;    right: 0;    background: var(--whitecolor);    border: 1px solid var(--lightgrey-3);    border-radius: 0 4px 4px 0;    box-shadow: var(--boxshadow);}.datacenter_ul .search_wr{    position: absolute; top: -40px; left: -1px; right: -1px; background: #fff; border: 1px solid var(--lightgrey-3); border-radius: 4px; font-size: 1.5rem; color: var(--greyfont); padding: 9px 16px 9px 8px;}.datacenter_li .value_txt{color: var(--greyfont);padding:10px 16px;cursor: pointer;}.datacenter_li .value_txt:hover{background: var(--lightblue);}.datacenter_illustration{width: 438px;height: 404px;display: block;                             position: absolute;                             bottom: -163px;                             right: -120px;                             background: url(../../images/dcselection/datacenter_illustration.f24060725e6c4930514722e3df974de8.png);                             background-size: 100%}.blue_btn .loading { display: block;                         justify-content: center;                         position: absolute;                         left: 50%;                         top: 16px;                         transform: translate(-50%, 50%);                         align-self: self-start;}.blue_btn .loading em { width: 8px;                            display: inline-block;                            height: 8px;                            margin: 0rem 0.2rem;                            background: #ffffff;                            border-radius: 50%;                            -webkit-animation: 0.9s bounce infinite alternate;                            animation: 0.9s bounce infinite alternate; }.blue_btn .loading em:nth-child(2) { -webkit-animation-delay: 0.3s; animation-delay: 0.3s; }.blue_btn .loading em:nth-child(3) { -webkit-animation-delay: 0.6s; animation-delay: 0.6s; }@-webkit-keyframes bounce { to { opacity: 0.3; transform: translate3d(0, -1rem, 0); } }@keyframes bounce { to { opacity: 0.3; transform: translate3d(0, -1rem, 0); } }.datacenter_heading{font-size: 1.8rem;                        color: #696767;                        padding: 2.4rem;                        border-bottom: 1px solid var(--borderdgrey);                        display: flex;                        justify-content: space-between;                        }.datacenter_heading .icon-close_ic{              padding: 8px;              font-size: 1rem;              border-radius: 50%;              cursor: pointer;          }.datacenter_heading .icon-close_ic:hover {   background: #e8e6e6;}@media screen and (max-width: 600px) {.dcwrapper{width: 100%;     min-height: 100%;}}.datacenter_em{    display: block;    margin-top: 8px;}.mainbody .bottom_wr {    align-self: self-start;    margin-top: 2.4rem;    display: flex;    flex-flow: column;    position: relative;}.mainbody .icon-right-arrow {    margin-left: 8px;    -webkit-transition: opacity 200ms ease-in, -webkit-transform 200ms ease-in;    transition: opacity 200ms ease-in, -webkit-transform 200ms ease-in;    transition: transform 200ms ease-in, opacity 200ms ease-in;    transition: transform 200ms ease-in, opacity 200ms ease-in, -webkit-transform 200ms ease-in;    opacity: 0;    font-size:1.1rem;}.mainbody .bottom_wr:hover  .icon-right-arrow {    -webkit-transform: translateX(4px);    -ms-transform: translateX(4px);    transform: translateX(4px);    opacity: 1;}.mainbody .datacenter_error{display: flex;                            color: #f43333;                            margin-top: 1rem;                            font-size: 1.5rem;}@-webkit-keyframes halfrotate {    from {        -webkit-transform: rotate(0deg);    } to {        -webkit-transform: rotate(-180deg);    }}@keyframes halfrotate {    from {        transform: rotate(0deg);    } to {        transform: rotate(-180deg);    }}.icon-up-arrowfill{animation-name: halfrotate;      animation-duration: .3s;      animation-iteration-count: 1;      animation-timing-function: linear;transform: rotate(-180deg);}