@keyframes torec{
            0%{
                transform: scale(1);
            }
            20%{
                transform: scale(10);
            }

            100%{
                transform: scale(80);

            }
        }
        @-webkit-keyframes torec{
            0%{
                transform: scale(1);
            }
            20%{
                transform: scale(10);
            }

            100%{
                transform: scale(80);

            }
        }
/*animation*/


        @media screen and (min-width: 768px) {
        .searchBar{
            padding: 0;
            margin: 0;
            position: absolute;
            top: 5px;
            left: 5px;
            z-index: 9999;
        }
        .search_btn1{
            margin: 0;
            padding: 0;
            position: absolute;
            left: 5px;
            top: 0px;
            border-radius: 30px;
            width: 0px;
            height: 0px;
            background-color: white;
            z-index: 9999;
        }
        .search_btn{
            margin: 0;
            padding: 0;
            position: absolute;
            border-radius: 30px;
            animation: torec 0.8s;
            animation-timing-function: linear;
            animation-fill-mode: forwards;
            width: 30px;
            height: 30px;
            background-color: white;
        }
        .search_input{
            overflow: hidden;
            margin: 0;
            padding: 0;
            position: absolute;
            top:8px;
            width: 400px;
            height: 35px;
            clip: rect();
            z-index: 0;

        }
/*mysearch*/


            .dropdown-menu {
				position:relative;
                float: none;
                top: -20px;
                font-size: 20px;
                width: 350px;
            }

            #cb-search-btn{
                position: absolute; 
                left: 16px; 
                top: 13px; 
                z-index: 9996
            }
            .cb-serarch-tool {
                position: relative; 
                top: 0px ; 
                bottom: 0px; 
                left: 0px; 
                right:  0px;
                opacity: 1;
                background: transparent; 
                z-index: 9997; 
            }

            .cb-close-btn1{
                margin: 0;
            padding: 0;
            position: absolute;
            left: 360px;
            top: 0px;
            border-radius: 30px;
            display: none;
            z-index: 9999;
            }

			.cb-search-tool ul{
                 width: 350px ;
                 white-space:nowrap;
                 overflow:hidden;
                 text-overflow: ellipsis;
             }


            .cb-search-content {
                border: 0;
                outline: none;
                background: transparent;
                width: 300px;
                position: relative;
                top: 8px;
                left: 30px;
                font-size: 22px;
                height: 30px;
                color: black;
                opacity: 1.0;
                border-radius: 0px;
                z-index: 9999;
            }
        }

        @media screen and (max-width: 767px) {
        .searchBar{
            padding: 0;
            margin: 0;
            position: absolute;
            top: 5px;
            left: 5px;
            z-index: 9999;
        }
        .search_btn1{
            margin: 0;
            padding: 0;
            position: absolute;
            left: 5px;
            top: 0px;
            border-radius: 30px;
            width: 0px;
            height: 0px;
            background-color: white;
            z-index: 9999;
        }
        .search_btn{
            margin: 0;
            padding: 0;
            position: absolute;
            border-radius: 30px;
            animation: torec 0.8s;
            animation-timing-function: linear;
            animation-fill-mode: forwards;
            width: 30px;
            height: 30px;
            background-color: white;
        }
        .search_input{
            overflow: hidden;
            margin: 0;
            padding: 0;
            position: absolute;
            top:8px;
            width: 300px;
            height: 30px;
            clip: rect();
            z-index: 0;

        }
            /*mysearch*/
            .dropdown-menu {
				position:absolute;
                float: none;
                font-size: 18px;
                width: 200px;
                border: none;
                border-radius: none;
            }
			.cb-search-tool ul{
				width: 300px;
				white-space:nowrap; 
				overflow:hidden; 
				text-overflow: ellipsis;
			}
            .cb-serarch-tool {
                border-radius: none;
                border: none;
                opacity: 1; 
            }
            .cb-close-btn1{
                    margin: 0;
            padding: 0;
            position: absolute;
            left: 250px;
            top: 0px;
            border-radius: 30px;
            display: none;
                z-index: 9999;
            }

            .cb-search-content {
                border: none;
                box-shadow: none;
                outline: none;
                background: transparent;
                width: 220px;
                position: absolute;
                top: 7px;
                left: 30px;
                font-size: 20px;
                height: 30px;
                color: black;
                opacity: 1.0;
            }
        }