/*@media (min-device-width:430px) and (max-device-width:749px) 
{
       .collections
       {
              position:absolute;
              top:37px;
              left:5px;
              width: 98%;
       } 

       .logo
       {
              position:relative;
              float:left;
              top:37px;
              right:5px;
              width: 25%;
              height: 200px;
       }


}*/

@media (min-device-width:750px) and (max-device-width:1024px) 
{
       .collections
       {
              position:absolute;
              top:37px;
              left:5px;
              width: 98%;
       } 

       .logo
       {
              position:relative;
              float:left;
              top:37px;
              right:5px;
              width: 25%;
              height: 200px;
       }

       .DariansCollections_banner
       {
           position:relative;
           float:left;
           width:97%;
           height:700px;
           clear:both;
           border:1px solid black;
           /*top:350px;
           right:10px;*/   
           padding: 10px 10px 10px 10px;
       
           margin-bottom: 100px;
           background-image: url("../Images/Darian/Darian_Banner.jpeg");
           background-color: #cccccc;
           /*background-size: contain;*/
           background-repeat: no-repeat; 
           background-size: 100% 100%;  
           padding: 10px 10px 10px 10px;
           margin: 10px 10px 10px 10px;      
       }
       
       .LuannasCollections_banner 
       {
           position:relative;
           float:right;
           width:75%;
           height:500px;
           clear:both;
           border:1px solid black;
           /*top:350px;
           right:10px;*/
       
           margin-bottom: 100px;
           background-image: url("../Images/Luanna/LuannasBanner.jpeg");
           background-color: #cccccc;
           /*background-size: contain;*/
           background-repeat: no-repeat; 
           background-size: 100% 100%;  
           padding: 10px 10px 10px 10px;  
           margin: 10px 10px 10px 10px; 
       }
       
       .KaitysCollections_banner 
       {
           position:relative;
           float:left;
           width:97%;
           height:700px;
           clear:both;
           border:1px solid black;
           /*top:660px;
           right:10px;*/
       
       
           margin-bottom: 100px;
           background-image: url("../Images/Kaity/Banner.jpg");
           background-color: #cccccc;
           /*background-size: contain;*/
           background-repeat: no-repeat; 
           background-size: 100% 100%;   
           padding: 10px 10px 10px 10px; 
           margin: 10px 10px 10px 10px; 
       } 
       /*
       .collections
       {
       display:flex;
       justify-content: center;
       flex-direction:row;
       flex-wrap: wrap;
       }

       .row
       {
       
       }
       */

       nav
       {
              position:fixed;
              width:100%;
              height: 34px;
              z-index: 99;
              background: #4c4c4c; /* Old browsers */
              background: -moz-linear-gradient(top, #4c4c4c 0%, #595959 12%, #666666 25%, #474747 39%, #2c2c2c 50%, #000000 51%, #111111 60%, #2b2b2b 76%, #1c1c1c 91%, #131313 100%); /* FF3.6-15 */
              background: -webkit-linear-gradient(top, #4c4c4c 0%,#595959 12%,#666666 25%,#474747 39%,#2c2c2c 50%,#000000 51%,#111111 60%,#2b2b2b 76%,#1c1c1c 91%,#131313 100%); /* Chrome10-25,Safari5.1-6 */
              background: linear-gradient(to bottom, #4c4c4c 0%,#595959 12%,#666666 25%,#474747 39%,#2c2c2c 50%,#000000 51%,#111111 60%,#2b2b2b 76%,#1c1c1c 91%,#131313 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
              filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c4c4c', endColorstr='#131313',GradientType=0 ); /* IE6-9 */          
       }

       nav ul.development
       {
              float:right;
       }

       nav ul 
       {
              text-align: left;
              display: inline;
              float: left;
              margin: 0;
              list-style: none;
              border-right: 1px solid rgba(255, 255, 255, 0.0976562);
              border-left: 1px solid rgba(0, 0, 0, 0.347656);
       }



       .tinynav-container { display: none; }

       .tinynav { display: none; }



       nav ul.links {

              float: right;

       }



       nav ul li {

              font: bold 13px/17px "Helvetica Neue", Helvetica, Arial, Geneva, sans-serif;

              display: inline-block;

              float: left;

              position: relative;

              top: 1px;

              cursor: pointer;

              transition: all 0.2s;

              text-shadow: 0 0 2px #000;

              border-left: 1px solid rgba(255, 255, 255, 0.0976562);

              border-right: 1px solid rgba(0, 0, 0, 0.347656);

       }

       .ie nav ul li {

              top: 2px;

       }



       nav ul li:hover {

              background: #000;

              color: #fff;

       }



       nav ul li i {

              height: 1em;

       }



       nav ul li a {

              color: #e6e6e6 !important;

              font-weight: normal;

              font-style: normal;

              text-decoration: none;

              display: block;

              padding: 8px 12px;

       }



       nav ul li ul.narrow {

              padding: 0;

              position: absolute;

              top: 32px;

              left: -2px;

              width: 160px;

              display: none;

              opacity: 0;

              visibility: hidden;

              transition: opacity 0.2s;

              box-shadow: 0 4px 5px rgba(0, 0, 0, 0.4);

              z-index: 400;

       }



       nav ul li ul {

              padding: 0;

              position: absolute;

              top: 32px;

              left: -2px;

              width: 240px;

              display: none;

              opacity: 0;

              visibility: hidden;

              transition: opacity 0.2s;

              box-shadow: 0 4px 5px rgba(0, 0, 0, 0.4);

              z-index: 400;

       }       



       nav ul li ul.wide {

              padding: 0;

              position: absolute;

              top: 32px;

              left: -2px;

              width: 280px;

              display: none;

              opacity: 0;

              visibility: hidden;

              transition: opacity 0.2s;

              box-shadow: 0 4px 5px rgba(0, 0, 0, 0.4);

              z-index: 400;

       }



       nav ul li ul li {

              /*background: url(../images/bg-footer-noise.jpg) #000;*/

       background: #4c4c4c; /* Old browsers */

       background: -moz-linear-gradient(top, #4c4c4c 0%, #595959 12%, #666666 25%, #474747 39%, #2c2c2c 50%, #000000 51%, #111111 60%, #2b2b2b 76%, #1c1c1c 91%, #131313 100%); /* FF3.6-15 */

       background: -webkit-linear-gradient(top, #4c4c4c 0%,#595959 12%,#666666 25%,#474747 39%,#2c2c2c 50%,#000000 51%,#111111 60%,#2b2b2b 76%,#1c1c1c 91%,#131313 100%); /* Chrome10-25,Safari5.1-6 */

       background: linear-gradient(to bottom, #4c4c4c 0%,#595959 12%,#666666 25%,#474747 39%,#2c2c2c 50%,#000000 51%,#111111 60%,#2b2b2b 76%,#1c1c1c 91%,#131313 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

       filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c4c4c', endColorstr='#131313',GradientType=0 ); /* IE6-9 */          

              

              display: block;

              color: #fff;

              float: none;



       -webkit-transition:height 200ms ease-in;

       -moz-transition:height 200ms ease-in;

       -o-transition:height 200ms ease-in;

       transition:height 200ms ease-in;           

       }



       /*nav ul li ul li:hover { background: #000; }*/

       nav ul li:hover > ul {

              display: block;

              opacity: 1;

              visibility: visible;

       }



       nav ul.projects li.project {

              width: 42px;

              padding: 0;

              height: 33px;

              text-indent: -9999px;

              background: url(../images/jq-nav-icons.png) -6px 0;

              z-index: 10;

       }



       nav ul.projects li.project a {

              display: block;

              height: 33px;

       }



       nav ul.projects li.jquery-ui {

              background-position: -57px 0;

       }



       nav ul.projects li.jquery-mobile {

              background-position: -107px 0;

       }



       nav ul.projects li.sizzlejs {

              background-position: -155px 0;

       }



       nav ul.projects li.qunitjs {

              background-position: -204px 0;

       }



       nav ul.projects li.jquery {

              background-position: 0 bottom;

              width: 52px;

              position: relative;

              margin-top:1px;

              border: none;

       }



       nav ul.projects {

       border-left: none;

       }



       nav ul.projects li.jquery-ui {

              border-left: none;

              background-position: -59px 0;

       }



       nav ul.projects li.jquery-ui {

              background-position: -50px bottom;

              width: 52px;

              position: relative;

              margin-top:1px;

              border: none;

       }



       nav ul.projects li.jquery {

              border-right: none;

              background-position: -2px 0;

       }



       nav ul.projects li.jquery-mobile {

              border-left: none;

       }



       nav ul.projects li.jquery-mobile {

              background-position: -100px bottom;

              width: 52px;

              position: relative;

              margin-top:1px;

              border: none;

       }



       nav ul.projects li.jquery-ui {

              border-right: none;

              background-position: -53px 0;

       }



       nav ul.projects li.jquery-mobile {

              border-right: none;

       }



       nav ul.projects li.sizzlejs{

              border-left: none;

              background-position: -157px 0;

       }





       ul.projects li.jquery-mobile {

              border-right: none;

              background-position: -102px 0;

       }



       nav ul.projects li.sizzlejs {

              background-position: -148px bottom;

              width: 52px;

              position: relative;

              margin-top:1px;

              border: none;

       }



       nav ul.projects li.qunitjs{

              border-left: none;

              background-position: -206px 0;

       }





       nav ul.projects li.sizzlejs {

              border-right: none;

       }



       nav ul.projects li.qunitjs {

              background-position: -202px bottom;

              width: 52px;

              position: relative;

              margin-top:1px;

              border: none;

       }



       nav ul.projects {

              border-right: none;

       }



       .narrow .slideout ul

       {

       top:2px;

       left: 158px;

       width:140px;

       }



       .slideout ul

       {

       top:2px;

       left: 238px; 

       }



       .wide .slideout ul

       {

       top:2px;

       left: 278px; 

       }

       .constrain {

              max-width: 1240px;

              margin: 0 auto;

              padding: 0 20px;

       }     

       #container
       {
              background: #0769ad;
              margin: 0 auto;
              padding: 0 20px;
       }  


       .dropdown-menu > li > a:hover,

       .dropdown-menu > li > a:focus {

       background-color: #e8e8e8;

       background-image: -webkit-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);

       background-image:         linear-gradient(to bottom, #f5f5f5 0%, #e8e8e8 100%);

       filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#ffe8e8e8', GradientType=0);

       background-repeat: repeat-x;

       }

       .dropdown-menu > .active > a,

       .dropdown-menu > .active > a:hover,

       .dropdown-menu > .active > a:focus {

       background-color: #357ebd;

       background-image: -webkit-linear-gradient(top, #428bca 0%, #357ebd 100%);

       background-image:         linear-gradient(to bottom, #428bca 0%, #357ebd 100%);

       filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff357ebd', GradientType=0);

       background-repeat: repeat-x;

       }
}