/* for Pardot Form (Default Style) 
@import url('https://assets.aten.com/webpage/shared/CMS_Libraries/CSS/Pardot/Form/Pardot-Form_Default-Style.css');
*/


/* for Pardot Form 【 A-1 】【 RWD 】【 for Original Ver Style for Landing 】 
@import url('https://assets.aten.com/webpage/shared/CMS_Libraries/CSS/Pardot/Form/Pardot-Form_Default-RWD-Style.css');
*/


/* for Pardot Form 【 A-2 】【 RWD 】【 for Original Ver Style for Landing >> Industry Field 】 
@import url('https://assets.aten.com/webpage/shared/CMS_Libraries/CSS/Pardot/Form/Pardot-Form_Default-Landing-RWD-Style.css');
*/


/* for Pardot Form 【 B 】 【Lite Ver Style for Product Page (含 RWD) 】
@import url('https://assets.aten.com/webpage/shared/CMS_Libraries/CSS/Pardot/Form/Pardot-Form_Product-Page-Style.css');
*/


/* for Pardot Form 【 C】【 RWD 】【 for Lightbox Form for Landing 】 
@import url('https://assets.aten.com/webpage/shared/CMS_Libraries/CSS/Pardot/Form/Pardot-Form_Lightbox-RWD-Style.css');
*/


/* for Pardot Form 【 D 】 【Lite Ver Style for Align Left for CCPA (含 RWD) 】
@import url('https://assets.aten.com/webpage/shared/CMS_Libraries/CSS/Pardot/Form/Pardot-Form_Text-Align-RWD-Style.css');
*/










/*******************************************************************************************************************************

                               【 RWD Form 】 【 Pardot Form 】 (Default Style for Original Form)

RWD >> 只適用於 Original Ver. Form 放在 Landing 頁面最底下 >> 不適用於 Product Page 的 Rich Content (.Pardot-inSection.col-md-6)

*******************************************************************************************************************************/




/* 橫向智慧手機到竪立平板電腦解析度 >> 1024 以上 */
@Media (min-width: 1024px) {


    /* Out-Container for Form */
    #pardot-form.form {
    display: flex;
    flex-wrap: wrap; /* 設為 wrap，則不會壓縮items，如果items過多就換行 (若不設定會將所有的flex items壓縮在同一行) */
    }


    /* 總寬度 >> Out-Container + .form-field + submit + section title */
    #pardot-form.form .Section-Title-Block, 
    #pardot-form.form .form-field, 
    #pardot-form.form .submit, 
    #pardot-form.form {
    max-width: 900px;
    }

    /* 變兩欄式 >> .form-field + submit */
    #pardot-form.form .form-field, 
    #pardot-form.form .submit {
    flex: 1 0 42%; /* 預設佔據 50% 寬度，即兩列 >> 改為 42% 因為兩欄要 padding 空間 */
    width: 50%;
    }

    /* .form-field + submit + section-title >> Padding 間距 */
    #pardot-form.form .Section-Title-Block, 
    #pardot-form.form .form-field, 
    #pardot-form.form .submit {
    padding: 5px 35px; /* 上下左右 padding 空間 */
    }

    /*取消兩欄 (單欄排列時) */
    /* #pardot-form.form .form-field.Customer_Type, */
    /* #pardot-form.form .form-field.industry, */
    #pardot-form.form .form-field.Alternate_Solutions, 
    #pardot-form.form .form-field.Vegetarian, 
    #pardot-form.form .form-field.Shuttle_Service, 
    #pardot-form.form .form-field.Trial_Model, 
    #pardot-form.form .form-field.Product_Type, 
    #pardot-form.form .form-field.pd-captcha, 
    #pardot-form.form .form-field.Agree_Policy,
    #pardot-form.form .form-field.Description, 
    #pardot-form.form .form-field textarea, 
    #pardot-form.form .form-field.Direct_Marketing_Approval, 
    #pardot-form.form .submit {
    flex-basis: 100%; /* 不受兩列佈局的影響，佔據整行 */
    flex-basis: 94%; /* 不受兩列佈局的影響，佔據整行 (縮小% 因為要對齊 input box) */
    flex-basis: 92%; /* 不受兩列佈局的影響，佔據整行 【box-sizing: border-box】(縮小% 因為要對齊 input box) */
    }


    /* 選產品四大類 (Checkbox) */
    #pardot-form.form .form-field.Product_Type span.value span {
    /* 兩欄一列使用
    display: block;
    width: 50%;
    float: left;*/

    display: inline-block;
    padding-right: 4%;
    }

    /* 兩欄排列時 >> Industry + country >> 下拉選單寬度*/
    #pardot-form.form .form-field.Customer_Type select, 
    #pardot-form.form .form-field.country select {
    /*width: 104%;
    width: calc(100% + 15px);*/
    }

    /*取消兩欄 (單欄排列時) >> Textarea 文字寬度 (兩欄排列時) */
    #pardot-form.form .form-field textarea {
    /*width: 98%;
    width: calc(100% - 15px);*/
    }

    /*取消兩欄 (單欄排列時) >> Indusy 下拉寬度 (兩欄排列時) */
    #pardot-form.form .form-field.industry select {
    /*width: 100%;
    width: calc(100% - 0px);*/
    }
  


}



/* 1281~1366 */
@Media (min-width: 1281px) and (max-width: 1366px) {

    #pardot-form.form .form-field .field-label {
    margin-top: 5px;
    }

    #pardot-form.form .value span input {
    top: 1px;
    }

}

