@-webkit-keyframes spin{from{-webkit-transform:rotate(0);transform:rotate(0)}
to{-webkit-transform:rotate(359deg);transform:rotate(359deg)}
}
@keyframes spin{0{-webkit-transform:rotate(0);transform:rotate(0)}
100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}
}
@keyframes fadeIn{from{transform:translateX(250px);opacity:0}
to{transform:translateX(0);opacity:1}
}
@font-face{font-family:OpenSans_regular;src:url(https://connectprodam.azureedge.net/cdn/prod/css/fonts/OpenSans-Regular.woff2) format('woff2')}
.onecms.connect.usr-signup-form.wrp{width:100%;padding-top:25px;font-family:OpenSans_regular !important;font-weight:bold;.spinner-container{position:fixed;top:0;left:0;width:100%;height:100%;justify-content:center;align-items:center;background:rgba(0,0,0,0.5);z-index:1000;display:none;&.show{display:flex}
}
.spinner{border:8px solid rgba(0,0,0,0.1);border-left:8px solid #3498db;border-radius:50%;width:50px;height:50px;animation:spin 1s linear infinite;position:absolute;top:25%}
.hide{display:none !important}
#popup{position:fixed;width:100%;height:100%;z-index:90;#pop-msg{position:fixed;top:35%;left:50%;width:500px;border:1px solid #aaa;transform:translate(-50%,-50%);z-index:99;background-color:#fff;.head{background-color:#00A0D0;color:#fff;padding:8px 0;p{margin:0;text-align:center}
}
.body{width:100%;.msg{display:flex;width:auto;padding:15px 30px;align-items:center;.icon{font-size:30px;width:15%;text-align:center;color:#00a0d0}
p{margin:0;display:inline-block;width:80%;color:#48494b;font-size:16px}
}
button{display:block;margin:0 auto;width:90px;background-color:#00a0d0;border:1px solid #fff;height:30px;color:#fff;margin-bottom:15px;border-radius:5px;cursor:pointer}
}
}
}
#popup.hide{display:none}
#popup.error #pop-msg{.head,button{background-color:#ff5722}
.body .msg .icon{color:#ff5722}
}
.signup-form{width:60%;margin:0 auto;border:1px solid #00A0D0;position:relative;max-width:600px;.form-title-container{display:flex;background-color:transparent;border-bottom:2px solid #e0e0e0;padding:0;gap:0;width:fit-content;box-shadow:none;cursor:pointer}
.form-title-reg,.form-title-apim{background-color:transparent;color:#666;padding:12px 24px;border-radius:0;border-bottom:3px solid transparent;margin:0;border-right:2px solid #e0e0e0}
.form-title-reg:hover:not(.active),.form-title-apim:hover:not(.active){color:#333;background-color:#f5f5f5;border-bottom-color:#ccc}
.form-title-reg.active,.form-title-apim.active{background-color:#f4f4f4;color:#00a0d0;border-bottom-color:#00a0d0;box-shadow:none;transform:none}
.form-fields-reg,.form-fields-apim{display:none}
.form-fields-apim{.description-wrp{margin-bottom:10px;label{width:19% !important}
}
.description ~ .error-msg{top:250px}
.description ~ .invalid-msg{top:250px}
.error-msg,.invalid-msg{display:none;font-size:10px;color:red}
@media screen and (min-width:660px){.error-msg,.invalid-msg{position:absolute;top:30px;left:25%}
}
@media screen and (max-width:660px){.form-field{display:flex;flex-direction:column}
}
}
.form-fields-apim.active{display:block !important;width:100%;color:#777;font-size:14px;.user-info{padding:50px 30px 30px}
.info{display:flex;flex-direction:row;flex-wrap:wrap;gap:20px;@media screen and (max-width:1024px){display:block;margin-bottom:20px}
.form-field{min-width:45%;display:flex;@media screen and (max-width:1024px){margin-bottom:20px}
label{width:25%}
input{width:70%;height:30px}
&.error,&.invalid{position:relative;input,textarea{border:1px solid red}
}
&.error{.error-msg{display:block}
}
&.invalid{.invalid-msg{display:block}
}
}
}
.buttons{width:calc(100% - 20px);display:flex;flex-direction:row-reverse;column-gap:20px;margin-bottom:20px;position:relative;margin-top:25px;button{width:100px;height:35px;border-radius:5px;border:0;z-index:10}
.form-submit{background-color:#04aa6d;color:#fff;cursor:pointer}
.captcha-wrp{position:absolute;top:-70px;z-index:9}
.onecms.captcha .captcha-txt{height:30px;font-size:18px}
}
}
.form-fields-reg.active{display:block !important;width:100%;color:#777;font-size:14px;label{margin:0}
.section{display:none;&.opaque{opacity:0}
.hide{display:none !important}
}
.section.active{display:block;padding:50px 30px 30px;&.opaque{opacity:1;animation:fadeIn 500ms ease-out backwards}
label{margin-bottom:10px}
hr{margin-top:25px;margin-bottom:25px;border:0;border-top:1px solid rgba(0,0,0,.1)}
}
.user-info{.form-field{min-width:45%;display:flex;margin-bottom:20px;label{width:30%}
input{width:70%;height:30px}
&.error,&.invalid{position:relative;input{border:1px solid red}
}
&.error{.error-msg{display:block}
}
&.invalid{.invalid-msg{display:block}
}
}
.user-type,.request-type{margin-top:15px;position:relative;.iama{display:inline;margin-right:50px}
label{display:inline-block}
input{display:inline-block;margin-left:13px}
.radio-field{display:inline-block}
&.error .error-msg{display:block;left:20%}
}
.request-type{margin-top:0;margin-bottom:25px}
.error-msg,.invalid-msg{display:none;font-size:10px;color:red;position:absolute;top:30px;left:25%}
}
.io-partnerarea{width:100%;.label{display:block;margin-bottom:20px}
.update-msg{font-size:11px;list-style-type:circle;font-style:italic}
.checkbox-wrp{display:flex;flex-direction:row;flex-wrap:wrap;column-gap:20px;row-gap:10px;margin-left:30px;width:100%;.checkbox{display:flex;column-gap:5px;width:25%;label{margin-bottom:0}
}
}
.technology-section{width:100%;display:block;margin-top:30px;.checkbox-wrp{width:70%;&.disabled{opacity:.5;pointer-events:none}
.checkbox{width:200px}
}
}
}
select{height:30px;color:#777;font-size:12px}
.distributor-section{width:100%;input[type=checkbox],input[type=radio]{transform:scale(1.2)}
.account-brand{display:flex;width:100%;column-gap:15px;.account{width:40%;display:flex;align-items:center;label{width:40%;margin:0}
input{width:50%;height:30px}
}
.brand{width:45%;display:flex;align-items:center;label{margin:0;width:15%}
select{width:85%;height:30px !important}
}
.add-btn{width:15%;margin:0 auto;display:flex;align-items:center;.add{background-color:green;color:#fff;border:1px solid #aaa;width:60px;border-radius:5px;height:30px;margin:auto 0}
.add:hover{cursor:pointer}
}
}
.account-brand-list{display:flex;align-items:center;width:100%;margin-top:30px;.label{display:inline-block;width:15%}
.account-brand-tbl{display:inline-block;width:95%;margin:0 auto;table{width:100%;border:1px solid #aaa;margin-left:5px;border-collapse:initial;text-align:center;thead{background-color:#00a0d0;color:#fff;font-size:12px}
tr{height:30px;th{padding:10px}
}
th.cName{width:35%}
th.cBrand{width:35%}
th.rmve{width:10%}
tbody{color:#aaa;text-align:center;td{border-right:1px solid #aaa;margin-right:2px;font-size:12px !important}
td:last-child{border-right:0;margin-right:0}
tr{td{border-bottom:1px solid #aaa;font-size:14px;color:#3f3f3f;padding:10px}
}
tr:last-child{td{border-bottom:0}
}
tr.no-items{text-align:left;td{border:0}
}
.remove{box-sizing:border-box;position:relative;display:table;margin:0 auto;transform:scale(1,1);width:16px;height:16px !important;border:1px solid #aaa;border-radius:22px;background-color:red;cursor:pointer}
.remove::before{content:"";display:block;box-sizing:border-box;position:absolute;width:8px;height:2px;background:#fff;border-radius:5px;top:6px;left:3px}
}
}
}
}
.access-level-section{.access-level{margin-left:30px;width:250px;height:30px !important}
}
}
.other-section{width:100%;input.error{border:1px solid red}
.role{display:flex;align-items:baseline;margin:25px;select{margin-left:30px;width:250px;height:30px !important}
input{width:250px;margin-left:20px;height:30px !important}
}
.address{width:95%;display:block;margin:0 auto;margin-top:20px;.field-wrp{display:flex;flex-direction:row;flex-wrap:wrap;gap:20px}
.label{display:block;margin-bottom:20px}
.form-field{width:45%;label{width:35%;display:inline-block}
input,select{height:30px !important;width:60%}
}
}
}
.enroll-box{width:100%;margin-top:30px;input,label{display:inline-block}
}
.buttons{width:calc(100% - 20px);display:flex;flex-direction:row-reverse;column-gap:20px;margin-bottom:20px;position:relative;margin-top:25px;button{width:100px;height:35px;border-radius:5px;border:0;z-index:10}
.next,.prev{background-color:#f4f4f4;color:#777;cursor:not-allowed}
.next.enable,.prev.enable{background-color:#00a0d0;color:#fff;cursor:pointer}
.form-submit{background-color:#04aa6d;color:#fff;cursor:pointer}
.captcha-wrp{position:absolute;top:-70px;z-index:9}
.onecms.captcha .captcha-txt{height:30px;font-size:18px}
}
}
}
}
@media only screen and (min-width:1024px){.onecms.connect.usr-signup-form.wrp{.signup-form{max-width:1022px;width:100%;.form-fields-reg,.form-fields-apim{width:100%;.user-info.active{.info{display:flex;flex-direction:row;flex-wrap:wrap;gap:20px;.form-field{margin-bottom:0;label{width:25%}
}
}
}
.user-type.active{width:100%;.iama{display:inline}
label{margin-right:15px;width:auto}
input{margin-left:0}
}
}
}
}
}
@media only screen and (min-width:1400px){.onecms.connect.usr-signup-form.wrp{.signup-form{width:70%}
}
}