css @import conflicts with razor

Question

(Posts such as MVC @import html keyword show similar problems to mine, but the solution does not seem to fix my problem.)

I am trying to use the below code within a .cshtml file. The css @import conflicts with Razor, so I tried @@import but to no avail. I get runtime errors in Visual studio such as "The controller for path '/media/css/site_jui.ccss' could not be found."

    <style type="text/css" media="screen">
        @import "/media/css/site_jui.ccss";
        @import "/release-datatables/media/css/demo_table_jui.css";
                    @import "/media/css/jui_themes/smoothness/jquery-ui-1.7.2.custom.css";

        /*
         * Override styles needed due to the mix of three different CSS sources! For proper examples
         * please see the themes example in the 'Examples' section of this site
         */
        .dataTables_info { padding-top: 0; }
        .dataTables_paginate { padding-top: 0; }
        .css_right { float: right; }
        #example_wrapper .fg-toolbar { font-size: 0.8em }
        #theme_links span { float: left; padding: 2px 10px; }

</style>

Answer 1

You can use double @ to escape the @:

@@import "/media/css/site_jui.css";