Difference between revisions of "Template:Austin UTexas"

Line 11: Line 11:
 
/********************************* MENU ********************************/
 
/********************************* MENU ********************************/
  
 +
/*********************new menu*******************/
 
.clearfix:after {
 
.clearfix:after {
 
     display:block;
 
     display:block;
 
     clear:both;
 
     clear:both;
 
}
 
}
 +
 +
.menu-wrap {
 +
    width:100%;
 +
    box-shadow:0px 1px 3px rgba(0,0,0,0.2);
 +
    background:#3e3436;
 +
}
 +
 +
.menu {
 +
    width:1000px;
 +
    margin:0px auto;
 +
}
 +
 +
.menu li {
 +
    margin:0px;
 +
    list-style:none;
 +
    font-family:'Ek Mukta';
 +
}
 +
 +
.menu a {
 +
    transition:all linear 0.15s;
 +
    color:#919191;
 +
}
 +
 +
.menu li:hover > a, .menu .current-item > a {
 +
    text-decoration:none;
 +
    color:#be5b70;
 +
}
 +
 +
.menu .arrow {
 +
    font-size:11px;
 +
    line-height:0%;
 +
}
 +
 +
/*----- Top Level -----*/
 +
.menu > ul > li {
 +
    float:left;
 +
    display:inline-block;
 +
    position:relative;
 +
    font-size:19px;
 +
}
 +
 +
.menu > ul > li > a {
 +
    padding:10px 40px;
 +
    display:inline-block;
 +
    text-shadow:0px 1px 0px rgba(0,0,0,0.4);
 +
}
 +
 +
.menu > ul > li:hover > a, .menu > ul > .current-item > a {
 +
    background:#2e2728;
 +
}
 +
 +
/*----- Bottom Level -----*/
 +
.menu li:hover .sub-menu {
 +
    z-index:1;
 +
    opacity:1;
 +
}
 +
 +
.sub-menu {
 +
    width:160%;
 +
    padding:5px 0px;
 +
    position:absolute;
 +
    top:100%;
 +
    left:0px;
 +
    z-index:-1;
 +
    opacity:0;
 +
    transition:opacity linear 0.15s;
 +
    box-shadow:0px 2px 3px rgba(0,0,0,0.2);
 +
    background:#2e2728;
 +
}
 +
 +
.sub-menu li {
 +
    display:block;
 +
    font-size:16px;
 +
}
 +
 +
.sub-menu li a {
 +
    padding:10px 30px;
 +
    display:block;
 +
}
 +
 +
.sub-menu li a:hover, .sub-menu .current-item a {
 +
    background:#3e3436;
 +
}
 +
 +
  
  
 
/* Wrapper for the menu */
 
/* Wrapper for the menu */
.menu-wrap {
+
.menu_wrapper {  
              width:100%;
+
width:100%;
 +
                margin-top:-10px;
 +
                margin-left:-20px;
 +
height:0px;
 +
position:fixed;
 +
padding:0px;
 +
display:inline;
 +
                list-style: none;  
 
               box-shadow:0px 1px 3px rgba(0,0,0,0.2);
 
               box-shadow:0px 1px 3px rgba(0,0,0,0.2);
                background:#3e3436;
+
}
        }
+
 
+
  
  
Line 479: Line 570:
 
</div>
 
</div>
 
--!>
 
--!>
 +
 +
 +
<div class="menu-wrap">
 +
    <nav class="menu">
 +
        <ul class="clearfix">
 +
            <li><a href="#">Home</a></li>
 +
            <li>
 +
                <a href="#">Movies <span class="arrow">&#9660;</span></a>
 +
 +
                <ul class="sub-menu">
 +
                    <li><a href="#">In Cinemas Now</a></li>
 +
                    <li><a href="#">Coming Soon</a></li>
 +
                    <li><a href="#">On DVD/Blu-ray</a></li>
 +
                    <li><a href="#">Showtimes &amp; Tickets</a></li>
 +
                </ul>
 +
            </li>
 +
            <li><a href="#">T.V. Shows</a></li>
 +
            <li class="current-item"><a href="#">Photos</a></li>
 +
            <li><a href="#">Site Help</a></li>
 +
        </ul>
 +
    </nav>
 +
</div>
  
 
<div class="content_wrapper">
 
<div class="content_wrapper">

Revision as of 04:58, 18 October 2016