/**
 *  LESS file for the Search Form
 */

 #masthead.simple, #masthead.default {
    #top-search {
        display: block;
        position: absolute;
        left: 0;
        right: 0;
        .size(14px);
        .transform(translateY(-15px));
        z-index: 99;
        form {
            text-align: center;
            @media screen and (max-width: 767px) {
                width: 100%;
            }
            label {
                border: solid 1px #ddd;
                border-radius: 20px;
                background-color: #ffffff;
                box-shadow: 0px 0px 3px rgba(0,0,0,.2);
                input[type="text"] {
                    border: none;
                    background: none;
                    padding-left: 10px;
                    .italic;
                }
            }
            button {
                box-shadow: none;
                border: none;
                position: relative;
            }
            input[type="submit"] {
                display: none;
            }
        }
    }
}

#masthead.full {
    #top-search {
        display: block;
        .size(17px);
        z-index: 99;
        form {
            text-align: center;
            label {
                border: none;
                border-radius: 24px;
                padding: 6px 10px;
                background-color: rgba(255,255,255,.55);
                .transition( background .1s ease-out );
                input[type="text"] {
                    border: none;
                    color: black;
                    background: none;
                    padding-left: 10px;
                    .italic;
                    &::placeholder {
                        color: black;
                    }
                }
            }
            button {
                box-shadow: none;
                border: none;
                position: relative;
            }
            input[type="submit"] {
                display: none;
            }
        }
    }
}


#masthead.ad {
    #top-search {
        display: inline-block;
        position: relative;
        .size(14px);
        @media screen and (max-width: 767px) {
            width: 100%;
            text-align: center;
        }
        form {
            label {
                margin: 0px;
                border: solid 1px #ddd;
                border-radius: 20px;
                background-color: #ffffff;
                box-shadow: 0px 0px 3px rgba(0,0,0,.2);
                input[type="text"] {
                    border: none;
                    background: none;
                    padding-left: 10px;
                    .italic;
                }
            }
            button {
                box-shadow: none;
                border: none;
                position: relative;
            }
            input[type="submit"] {
                display: none;
            }
        }
    }
}