

/*============================= 
! Layout for ipad landscape  
============================= */
@media only screen and (max-width: 1042px) {
    /*index page styling begins here*/
.bannerSec{display:none;}
.outerWrapper{background:#302e33 url(parthenon_LD.jpg) no-repeat top center;background-size:100%;height:100%;}

.navi li{width:14%;margin-left:5px;margin-right:10px;}
 .navi li a.one{width: 90%;height: 114px;background-size:100%;}
 
  .navi li.listTwo{width:16%!important;margin:0!important;}
 .navi li.listThree{width:16%!important;}
 .navi li.last{float: left;width: 15%!important;margin:0!important;}
 .navi li.seclast{float: left;width: 17%!important;margin:0!important;}
 .navi li.thrdlast{float: left;width: 16%!important;}
 .navi li a.nav1{width:95%;}
 .navi li a.nav2{width:100%;}
 .navi li a.nav3{width:95%;}
 .navi li a.nav4{width:95%;}
 .navi li a.nav5{width:95%;}
 .navi li a.nav6{width:95%;}
 .navi li.last{float: left;width: 14%;}
.navi li.seclast{float: left;width: 14%;}
.navi li.thrdlast{float: left;width: 14%;}
.para{font-size:15px;line-height:25px;width:85%;}
}
/* ============================= */
/*============================= 
! Layout for ipad portrait  
============================= */
@media only screen and (max-width: 992px) {
    a:hover{background-size:contain!important;}
 .wrapper{width:100%;}
 .para{font-size:15px;line-height:20px;width:90%;}
 .navi{margin-left:5px;}
 .navi li{width:15%;}
  .navi li.listTwo{width:17%!important;margin:0!important;}
 .navi li.listThree{width:17%!important;margin:0!important}
 .navi li.last{float: left;width: 16%!important;margin:0!important;}
 .navi li.seclast{float: left;width: 16%!important;margin:0!important;}
 .navi li.thrdlast{float: left;width: 16%!important;margin:0!important}
 .navi li a.nav1{width:100%;background-size:100%;} 
 .navi li a.nav2{width:100%;background-size:100%;}
 .navi li a.nav3{width:100%;background-size:100%;}
 .navi li a.nav4{width:95%;background-size:100%;}
 .navi li a.nav5{width:95%;background-size:100%;}
 .navi li a.nav6{width:95%;background-size:100%;}
}
/* ============================= */
/* ! Layout for mobile(lanscape) version   */
/* ============================= */
@media only screen and (max-width: 767px) {
    .blackBox{width:95%;margin:20px 10px 0 1px;}
    .para{font-size:14px;}
    .navigation li{width:30%;}
    .outerWrapper{height:400px;}
    
 .navi{height:auto;}
 .navi li{width:26%;margin-left:5px;margin-right:10px;}
 .navi li a.one{width: 96%;height: 114px;background-size:100%;}
 .navi li.listTwo{width:32%;}
 .navi li.listThree{width:32%;}
 .navi li.last{float: left;width: 30%;}
 .navi li.seclast{float: left;width: 30%;}
 .navi li.thrdlast{float: left;width: 30%;}
 .navi li a.nav1{width:100%;}
 .navi li a.nav2{width:100%;}
 .navi li a.nav3{width:95%;}
 .navi li a.nav4{width:95%;}
 .navi li a.nav5{width:100%;}
 .navi li a.nav6{width:95%;}
 
  
}

/* ============================= */
/* ! Layout for mobile(portrait) version   */
/* ============================= */
@media only screen and (max-width: 479px) {
.navigation li {padding: 0;width: 30%;}
.navigation li a {font: 16px/20px 'arial_rounded_mt_boldbold';padding: 36% 0 45%;position: relative;}
.contentArea{width:100%;margin-top:9px;}
.arrow { left: 180px;top: -193px;}
.para{padding-left:10px;}
.lookInside{width:64%;}
.boxImage {margin-left: 21%; margin-top: 5%;width: 53%;}
.navi{height:auto;}
.navi li{width:38%;}
.navi li a.one{width: 100%;height: 114px;background-size:100%;}
.navi li.listTwo{width:48%;}
.navi li.listThree{width:45%;}
.navi li.last{float: left;width: 43%;}
.navi li.seclast{float: left;width: 44%;}
.navi li.thrdlast{float: left;width: 43%;}

 

   
}