@media (orientation: landscape) {

    body{
        width:100%;
        margin:0px;
        }
        

        
        #logo{
            display:block;
            width:calc(100% - 75%);
           margin: 8% auto auto auto;}
        
        #logo1{
            width:100%;}
        
        #content{
            overflow:visible;
            width:calc(100% - 80%);
            margin: 6% auto auto 5%;
            float:left;
            height:80%;
        position:relative}
            
        #content p{
            font-size: 150%;
            position:absolute;
            bottom:3%;
        }
        
        #contentwrapper{
            display:none;
            overflow:auto;
            width:100%;
            margin:0 0 0 0;}
        
        #contentright{
        float:right;
        max-width:calc(100% - 30%);
        width:100%;
        height:100%;
        overflow:hidden;
        position:fixed;
        right:0px}
        
        #contentright .pics_gallery .pics .main_pic .main img{
                position: absolute;
                top: -9999px;
                bottom: -9999px;
                left: -9999px;
                right: -9999px;
                margin: auto;}
        
        #contentbottom{
                width:100%;
        height:auto;
        clear:both;
        /*position: absolute; */
        width:30%;
        bottom: 0;}
        
        #contentbottom .pad1{
            width:.55%;
        height:1px;
        bottom: 0;
        float: left;}
        
        .main{
        width:100%;
        height:100%;
        }
        .ui-loading .ui-loader { display: none; }
        .ui-loader { display: none; position: absolute; opacity: .85; z-index: 100; left: 50%; width: 200px; margin-left: -130px; margin-top: -35px; padding: 10px 30px; }
  }

  @media (orientation: portrait) {

    body{
        width:100%;
        margin:0px;
        }
        
        #main1{
            width:100%;
        height:100%;}
        
        #contentwrapper{
            width:100%;}
        
        #logo{
            display:block;
            width:70%;
           margin: 35% auto auto auto;}
        
        #logo1{
            width:100%;
            margin-bottom:3%;}
        
        #content{
            overflow:visible;
            width:65%;
            margin: 6% auto 5% auto;}
            
        #content p{
            overflow:visible;}
        
        #contentwrapper{
            display:none;
            overflow:auto;
            width:100%;
            height:100%;
            margin:0 0 0 0;}
        
        #contentright{
        float:right;
        max-width:100%;
        width:100%;
        height:100%;
        overflow:hidden;}
        
        #contentright .pics_gallery .pics .main_pic .main img{
                position: absolute;
                top: -9999px;
                bottom: -9999px;
                left: -9999px;
                right: -9999px;
                margin: auto;}
        
        #contentbottom{
                width:100%;
        height:auto;
        clear:both;
        /*position: absolute; */
        bottom: 0;}
        
        #contentbottom .pad1{
            width:.55%;
        height:1px;
        bottom: 0;
        float: left;}
        
        .main{
        width:100%;
        height:100%;
        }
        .ui-loading .ui-loader { display: none; }
        .ui-loader { display: none; position: absolute; opacity: .85; z-index: 100; left: 50%; width: 200px; margin-left: -130px; margin-top: -35px; padding: 10px 30px; }
  }