/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {



    .right-inner-addon i {
        position: absolute !important;
        left: 90% !important;
    }

    .stepHeader {
        margin-top: 50px !important;
        padding:8% 5% 2% 4% !important;
    }

    .SectionHeader {
        height: 30px !important;
        clear: both !important;
    }




    .col-main {
        margin-left: 1% !important;
    }

    .navbar-nav .open .dropdown-menu {
        left: 0% !important;
    }

    .navbar-inverse .navbar-nav > li > a {
        width: 62% !important;
        left: 35% !important;
    }

    .navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open > a:focus, .navbar-inverse .navbar-nav > .open > a:hover {
        width: 62% !important;
    }
    .listrow{
        padding:4% 0 !important;
    }
    h4.panel-title{
        width:100%;
    }
	label.visible-xs{
		display:inline !important;
		margin-right:3%;
	}
	#ctl00_FormContent_btnSelectAll.btn{
        margin-left:0px;
	}
  
}
/* desktop shrink----------- */
@media only screen and (min-width : 733px) and (max-width : 986px) {



    .col-main {
        margin-left: 6% !important;
        width: 90%;
    }

    .left-panel {
        margin-left: -5% !important;
    }

    h4.fullTitle {
        margin: 20px 20%;
    }
     .stepHeader {
        padding: 4% 4% 2% 3% !important;
         font-size: 1.5em;
       
    }
    .navbar-nav .open .dropdown-menu {
        left: 0% !important;
    }
   .listrow{
        padding: 3% 0%;
    }
	
    
    .table-responsive {
      
        margin-bottom: 15px;
        overflow-x: auto;
        overflow-y: hidden;
        width: 100%;
    }
    .wizard-steps a {
         font-size: 0.66em;
    }
	
	.panel .btn{
		width:auto;
		margin-top:1%;
		
	}
    #manufacturerNameSubHeader .btn{
        width:80px !important;
    }
    label.visible-xs {
		display: inline !important;
		margin-right: 2%;
	}
   
}
@media only screen and (min-width : 733px) and (max-width : 767px) {
       .stepHeader {
        padding: 4% 5% 2% 5% !important;
         font-size: 1.5em;
    }
	

     #manufacturerNameSubHeader .btn{
        width:80px !important;
    }

}
/* Smartphones (landscape) & desktop shrink----------- */
@media only screen and (min-width : 480px) and (max-width : 732px) {



    .col-main {
        margin-left: 0% !important;
    }

    h4.fullTitle {
        margin: 15px 0px 10px 15% !important;
    }


    .deleteicon {
        right: 2% !important;
        position: absolute !important;
    }

    .SectionHeader {
        height: 30px !important;
        clear: both !important;
    }



    .left-panel {
        margin-left: -3% !important;
    }

    .navbar-nav .open .dropdown-menu {
        left: 0% !important;
    }

    .navbar-inverse .navbar-nav > li > a {
        width: 45%;
        left: 52.5%;
    }

    .navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open > a:focus, .navbar-inverse .navbar-nav > .open > a:hover {
        width: 45%;
    }

 

     .stepHeader{
         padding:4% 5% 1% 4% !important;
           font-size: 1.5em;

    }

    .stepHeader h2 {
        font-size: 0.7em !important;
    }

    .listrow{
        padding: 3% 0%;
    }
   
   
    .listrow:last-child{
           padding:5% 0;
       }

	
	.panel .btn{
		width:100%;
		margin-top:3%;
	}
    label.visible-xs {
		display: inline !important;
		margin-right: 3%;
	}
   #manufacturerNameSubHeader .btn{
        width:80px !important;
    }
   #productSummary .table-responsive{
       border: none;
   }
   
}

/* Smartphones (landscape) & desktop shrink----------- */
@media only screen and (min-width : 320px) and (max-width : 480px) {
 

    .navbar-nav .open .dropdown-menu {
        left: -50% !important;
    }

    .navbar-inverse .navbar-nav > li > a {
        width: 65%;
        left: 32%;
    }

    .navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open > a:focus, .navbar-inverse .navbar-nav > .open > a:hover {
        width: 65%;
    }

    .col-main {
        margin-left: 0% !important;
    }

    .stepHeader{
         padding:5% 5% 2% 4% !important;
         font-size:1.4em;
         margin-top:55px;
    }

    .stepHeader h2 {
        font-size: 0.6em !important;
    }

    h4.panel-title {
        width: 100%;
    }

    .listrow:last-child{
           padding:10% 0;
    }

    
    .footer .btn{
          width:100%;
          margin-top:5%;
      }
    
    
   label.visible-xs{
		display:inline !important;
		margin-right:3%;
	}
	
	.panel .btn{
		width:100%;
		margin-top:5%;
	}
    #ctl00_FormContent_btnSelectAll.btn{
        margin-left:0px;
	}
     #productSummary .table-responsive{
       border: none;
   }
   
}


/* Smartphones (portrait) ----------- */
@media only screen and (max-width : 320px) {


   
    .right-inner-addon i {
        position: absolute !important;
        left: 84% !important;
    }

    .SectionHeader {
        height: 30px !important;
        clear: both !important;
    }


    .col-main {
        margin-left: 0% !important;
    }

    .navbar-nav .open .dropdown-menu {
        left: -62% !important;
    }

    .navbar-inverse .navbar-nav > li > a {
        width: 70%;
        left: 28%;
    }

    .navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open > a:focus, .navbar-inverse .navbar-nav > .open > a:hover {
        width: 70%;
    }

    .stepHeader {
        padding: 10% 10% 2% 4% !important;
         font-size:1.2em;
         margin-top:45px;
    }

        .stepHeader h2 {
            font-size: 0.6em !important;
        }


    .form-control {
        font-size: 0.9em;
    }


  
    h4.panel-title {
        width: 100%;
    }


    .listrow:last-child{
           padding:10% 0;
       }
     
	label.visible-xs{
		display:inline !important;
		margin-right:3%;
	}
    .list-heading {
		font-size: 1em;
		padding: 2% 5%;
	}

	.panel .btn{
		width:100%;
		margin-top:5%;
	}
    #ctl00_FormContent_btnSelectAll.btn{
        margin-left:0px;
	}
     #productSummary .table-responsive{
       border: none;
   }
   
}
/* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
    h4.fullTitle {
        margin: 15px 0px 10px 6%;
    }

  
    .deleteicon {
        right: 2% !important;
        position: absolute !important;
    }

    .SectionHeader {
        height: 30px !important;
        clear: both !important;
    }

	
}
/* iPads (landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
   

    .deleteicon {
        right: 2% !important;
        position: absolute !important;
    }

    .SectionHeader {
        height: 30px !important;
        clear: both !important;
    }

   
}

/* iPads (portrait) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
 

    .deleteicon {
        right: 2% !important;
        position: absolute !important;
    }

    .SectionHeader {
        height: 30px !important;
        clear: both !important;
    }

	

}
/**********
iPad 3
**********/
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio : 2) {
  
    
    .SectionHeader {
        height: 30px !important;
        clear: both !important;
    }

  
  
}

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio : 2) {
  

   

    .SectionHeader {
        height: 30px !important;
        clear: both !important;
    }

  
}


/* iPhone 4 ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio : 2) {

   

    .right-inner-addon i {
        position: absolute !important;
        left: 90% !important;
    }

    .SectionHeader {
        height: 30px !important;
        clear: both !important;
    }




    .col-main {
        margin-left: 0% !important;
    }
}

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio : 2) {


  
    .right-inner-addon i {
        position: absolute !important;
        left: 90% !important;
    }

    .SectionHeader {
        height: 30px !important;
        clear: both !important;
    }

    .col-main {
        margin-left: 1% !important;
    }

    .navbar-inverse .navbar-nav > li > a {
        width: 62% !important;
        left: 35% !important;
    }

    .navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open > a:focus, .navbar-inverse .navbar-nav > .open > a:hover {
        width: 62% !important;
    }
}

/* iPhone 5 ----------- */
@media only screen and (min-device-width: 320px) and (max-device-height: 568px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2) {

    .deleteicon {
        right: 2% !important;
        position: absolute !important;
    }

    .right-inner-addon i {
        position: absolute !important;
        left: 90% !important;
    }

    .SectionHeader {
        height: 30px !important;
        clear: both !important;
    }

  

    .col-main {
        margin-left: 1% !important;
    }
	#coursebannerbg{
		
			background-image: url("Images/coursebanneripadportrait.png");
			height:80px !important;
			
	}
	#viewcoursebtn{
	    margin-left: 14%;
		margin-top:6%;
		width:32% !important;
		height:25%;
		font-size: 0.8em !important;
		padding: 0.2% !important;
		
		
	}
}

@media only screen and (min-device-width: 320px) and (max-device-height: 568px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2) {


  .right-inner-addon i {
        position: absolute !important;
        left: 90% !important;
    }

    .SectionHeader {
        height: 30px !important;
        clear: both !important;
    }

 
    .col-main {
        margin-left: 1% !important;
    }

    .navbar-inverse .navbar-nav > li > a {
        width: 70%;
        left: 28%;
    }

    .navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open > a:focus, .navbar-inverse .navbar-nav > .open > a:hover {
        width: 70%;
    }
}
/* iPhone 6 ----------- */
@media only screen and (min-device-width: 375px) and (max-device-height: 667px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2) {

   
    .right-inner-addon i {
        position: absolute !important;
        left: 90% !important;
    }

    .SectionHeader {
        height: 30px !important;
        clear: both !important;
    }

    #tabcontainer {
        margin-bottom: 10px !important;
    }



    .col-main {
        margin-left: 1% !important;
    }
}

@media only screen and (min-device-width: 375px) and (max-device-height: 667px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2) {
   

    .right-inner-addon i {
        position: absolute !important;
        left: 90% !important;
    }

    .SectionHeader {
        height: 30px !important;
        clear: both !important;
    }



    .col-main {
        margin-left: 1% !important;
    }
}

/* iPhone 6+ ----------- */
@media only screen and (min-device-width: 414px) and (max-device-height: 736px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2) {



    .right-inner-addon i {
        position: absolute !important;
        left: 90% !important;
    }

    .SectionHeader {
        height: 30px !important;
        clear: both !important;
    }

 

    .col-main {
        margin-left: 1% !important;
    }
}

@media only screen and (min-device-width: 414px) and (max-device-height: 736px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2) {


    .right-inner-addon i {
        position: absolute !important;
        left: 90% !important;
    }

    .SectionHeader {
        height: 30px !important;
        clear: both !important;
    }


    .col-main {
        margin-left: 1% !important;
    }
}

@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2) {
  
 
    .right-inner-addon i {
        position: absolute !important;
        left: 90% !important;
    }

    .SectionHeader {
        height: 30px !important;
        clear: both !important;
    }



    .col-main {
        margin-left: 1% !important;
    }
}


@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 3) {
 

    .right-inner-addon i {
        position: absolute !important;
        left: 90% !important;
    }

    .SectionHeader {
        height: 30px !important;
        clear: both !important;
    }

    .col-main {
        margin-left: 1% !important;
    }
}



@media only screen and (min-device-width: 360px) and (max-device-height: 640px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 3) {

    .right-inner-addon i {
        position: absolute !important;
        left: 90% !important;
    }

    .SectionHeader {
        height: 30px !important;
        clear: both !important;
    }


    .col-main {
        margin-left: 1% !important;
    }
}
/* Device specific */

/* Samsung Galaxy S3 ----------- */
@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2) {
  

    .navbar-nav .open .dropdown-menu {
        left: -50% !important;
    }

    .navbar-inverse .navbar-nav > li > a {
        width: 65%;
        left: 32%;
    }

    .navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open > a:focus, .navbar-inverse .navbar-nav > .open > a:hover {
        width: 65%;
    }

    .col-main {
        margin-left: 0% !important;
    }

    .stepHeader{
         padding:5% 5% 2% 4% !important;
    }

    .stepHeader h2 {
        font-size: 0.6em !important;
    }

    h4.panel-title {
        width: 100%;
    }

   
    .listrow{
        padding: 10% 0%;
    }
  
}


/* Samsung Galaxy S4 General can see in emulator----------- */
@media only screen and (max-width: 640px) and (min-width: 320px)
{
     .navbar-nav .open .dropdown-menu {
        left: -50% !important;
    }

    .navbar-inverse .navbar-nav > li > a {
        width: 65%;
        left: 32%;
    }

    .navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open > a:focus, .navbar-inverse .navbar-nav > .open > a:hover {
        width: 65%;
    }

    .col-main {
        margin-left: 0% !important;
    }

    .stepHeader{
         padding:5% 5% 2% 4% !important;
    }

    .stepHeader h2 {
        font-size: 0.6em !important;
    }

    h4.panel-title {
        width: 100%;
    }

   
    .listrow{
        padding: 10% 0%;
    }
   
}
/* Samsung Galaxy S4 ----------- */
@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 3) {
 
     .navbar-nav .open .dropdown-menu {
        left: -50% !important;
    }

    .navbar-inverse .navbar-nav > li > a {
        width: 65%;
        left: 32%;
    }

    .navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open > a:focus, .navbar-inverse .navbar-nav > .open > a:hover {
        width: 65%;
    }

    .col-main {
        margin-left: 0% !important;
    }

    .stepHeader{
         padding:5% 5% 2% 4% !important;
    }

    .stepHeader h2 {
        font-size: 0.6em !important;
    }

    h4.panel-title {
        width: 100%;
    }

   
  
    .listrow{
        padding: 10% 0%;
    }
   
}

/* Samsung Galaxy S5 ----------- */
@media only screen and (min-device-width: 360px) and (max-device-height: 640px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 3) {
 
  

     .navbar-nav .open .dropdown-menu {
        left: -50% !important;
    }

    .navbar-inverse .navbar-nav > li > a {
        width: 65%;
        left: 32%;
    }

    .navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open > a:focus, .navbar-inverse .navbar-nav > .open > a:hover {
        width: 65%;
    }

    .col-main {
        margin-left: 0% !important;
    }

    .stepHeader{
         padding:5% 5% 2% 4% !important;
    }

    .stepHeader h2 {
        font-size: 0.6em !important;
    }

    h4.panel-title {
        width: 100%;
    }

   
   
    .listrow{
        padding: 10% 0%;
    }
    
}
/* LG Optimus*/
@media only screen and (max-device-width : 424px) and (max-device-height : 753px) {

    .navbar-nav .open .dropdown-menu {
        left: -12% !important;
    }
}

/* Google Nexus 7 2  all google has to be before iphone 5 configuration*/
@media only screen and (max-device-width : 960px) and (max-device-height : 600px) {
    .col-main {
        margin-left: 0% !important;
    }

    .left-panel {
        margin-left: 0% !important;
    }

    h4.fullTitle {
        margin-left: 20% !important;
    }
}
/* Google Nexus 7*/
@media only screen and (max-device-width : 966px) and (max-device-height : 604px) {
    .col-main {
        margin-left: 15% !important;
    }

    .left-panel {
        margin-left: 0% !important;
        left: 2% !important;
    }

    h4.fullTitle {
        margin-left: 20% !important;
    }
}
/* Google Nexus S*/
@media only screen and (max-device-width : 320px) and (max-device-height : 533px) {
    .col-main {
        margin-left: 0% !important;
    }
	#viewcoursebtn {
		margin-left: 15%;
		margin-top: 6%;
		width: 27% !important;
		height: 50%;
		font-size: 0.80em !important;
		padding: 0.2% 1% !important;
	}
	#coursebannerbg{
		height:60px;
	}
}


/* iphone 3Gs*/
@media only screen and (max-device-width : 320px) and (max-device-height : 480px) {
    .col-main {
        margin-left: 0% !important;
    }
}
/* iphone 6 plus*/
@media only screen and (max-device-width : 414px) and (max-device-height : 736px) {
    .navbar-nav .open .dropdown-menu {
        left: -15% !important;
    }
}
/* iphone 6 has to be before iphone 5 configuration*/
@media only screen and (max-device-width : 375px) and (max-device-height : 667px) {
    .col-main {
        margin-left: 0% !important;
    }

    .navbar-nav .open .dropdown-menu {
        left: -26% !important;
    }
}
/* blackberry Z10*/
@media only screen and (max-device-width : 384px) and (max-device-height : 640px) {
    .navbar-nav .open .dropdown-menu {
        left: -24% !important;
    }
}
/* blackberry Z30 has to be after iphone 6*/
@media only screen and (max-device-width : 360px) and (max-device-height : 640px) {
    .navbar-nav .open .dropdown-menu {
        left: -32% !important;
    }
}

/* iphone 5*/
@media only screen and (max-device-width : 320px) and (max-device-height : 568px) {
    .col-main {
        margin-left: 0% !important;
    }

    .navbar-nav .open .dropdown-menu {
        left: -48% !important;
    }

    .navbar-inverse .navbar-nav > li > a {
        width: 62%;
        left: 35%;
    }

    .navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open > a:focus, .navbar-inverse .navbar-nav > .open > a:hover {
        width: 62%;
    }
}

/* LG Optimus One*/
@media only screen and (max-device-width : 213px) and (max-device-height : 320px) {
    .stepHeader {
        font-size: 1.2em;
    }

  
}


/* Amazon kindle Fire HDX 7 */
@media only screen and (max-device-width : 1920px) and (max-device-height : 1200px) {
    .container {
        width: 95%;
    }

    /* h4.fullTitle{
		margin-left:-20% ;
	} */

}

/* Amazon kindle Fire HDX 8.9 */
@media only screen and (max-device-width : 2560px) and (max-device-height : 1600px) {
    .container {
        width: 95%;
    }

    /* 	h4.fullTitle{
		margin-left:-20% ;
	} */

}

/* Motorola Defy Droid X*/
@media only screen and (max-device-width : 320px) and (max-device-height : 569px) and (-webkit-device-pixel-ratio: 1.5) {
    .col-main {
        margin-left: 0% !important;
    }

    .stepHeader {
        font-size: 1.2em;
    }

    #advFilterShow, #advFilterHide {
        font-size: 0.5em !important;
    }

    .navbar-nav .open .dropdown-menu {
        left: -50% !important;
    }
}
/* Motorola Defy 3, 4*/
@media only screen and (max-device-width : 540px) and (max-device-height : 960px) and (-webkit-device-pixel-ratio: 1) {
    .navbar-nav .open .dropdown-menu {
        left: -50% !important;
    }
}
/* /* Motorola Defy 3, 4*/
@media only screen and (max-device-width : 720px) and (max-device-height : 1280px) and (-webkit-device-pixel-ratio: 1) {
    .navbar-nav .open .dropdown-menu {
        left: -50% !important;
    }
}