﻿
@media only screen and (min-device-width : 1024px) and (max-device-width : 1366px) and (orientation : portrait) {
.main-banner-info-section .separator-img-wrapper.desktop-view-separator{

	display:block;
}

.main-banner-info-section .separator-img-wrapper.mobile-view-separator{

	display:none;
	
}

.outer-wrapper.desktop-view .main-listing-wrapper:after{background:none !important;position:static;}

}


@media only screen and (min-device-width : 600px) and (max-device-width : 1024px) and (orientation : portrait) {

.pricing-wrapper .pricing ul li:last-child .price-card .choose-plan:after {
     top: -75px; 
}
.pricing-wrapper .nav-pills>li:last-child.active>a>.price-card .choose-plan:after {
    top: -66px;
}
}



/* Portrait */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  /*and (orientation: portrait)*/ 
  and (-webkit-min-device-pixel-ratio: 1) {

 .separator-img-wrapper.desktop-view-separator{

	display:none;
}

.separator-img-wrapper.mobile-view-separator{

	display:block;
	padding: 15px 0 0;
}

.separator-img-wrapper.mobile-view-separator img{
	max-width:100%;
}
.no-padding-left{padding-left:15px;}

.no-padding-right{padding-right:15px;}

.modal-footer{margin-top:0;}

.small-price-card .yearly-icon img {
    max-width: 70px;
}
.small-price-card {
    min-height: 90px;
}

.vehicle-details-progress-section {
    padding: 5rem 0 2rem;
}

.tell-us-about-vehicle-wrapper, .just-few-more-details-wrapper, .tell-us-about-you-wrapper{
	max-width:100%;
	margin: 10px 20px;
	
}

.tell-us-about-vehicle-wrapper,.few-more-vehicle-details-block{padding-bottom: 15px;}

.just-few-more-details-wrapper{margin-top:20px;padding-bottom: 15px;}

.tell-us-about-vehicle-wrapper .pull-right{float:none !important;}

.tell-us-about-vehicle-wrapper .vehicle-details-edit .pull-right{float:right !important;}

.policy-info-details,.tell-us-about-vehicle-wrapper.few-more-vehicle-details-block .col-md-4,
.claim-details .form-row{clear:both;}

.about-info .add-on,.vehicle-info .add-on{
	top:4px;
}
.personal label{top:-18px !important;right:0 !important;}

.claimlbl-toggle {
    right: 14px;
}
.idv-wrapper{margin-top:20px;margin-bottom:20px;}

.tell-us-about-vehicle-wrapper .pull-right{
	float:right !important;
}
#action-btn .btn {
    width: 165px !important;
}
.main-page .btn-bg, .main-page .btn-bg:hover, .main-page .btn-white, .main-page .btn-white:hover {
    padding: 7px 5px;
}

.outer-wrapper.desktop-view .main-listing-wrapper{position:relative;}
.outer-wrapper.desktop-view .main-listing-wrapper:after{content:"";display:block;width:15px;height:352px;
background:url(../images/separator-shape.png);position: absolute;
right: 0;top: -70px;background-repeat:no-repeat;}

}

@media only screen and (min-device-width : 600px) and (max-device-width : 1024px) and (orientation : portrait) {

.tell-us-about-vehicle-wrapper .col-md-4.pull-right {float:none !important;}

.policy-info-details,.tell-us-about-vehicle-wrapper.few-more-vehicle-details-block .col-md-4,
.claim-details .form-row{clear:both;}
.price-card{ padding: 2% 6%;}
#just-few-more-details .personal label{top:-18px !important;right:0 !important;}
.vehicle-loan-text, .claims-text{align-items:center;}
#just-few-more-details .accident-cover span {
    margin-top: -10px !important;
}
}



@media only screen and (max-width: 767px){



#action-btn .btn{margin-bottom:20px !important;}

.main-wrapper h1{font-size:28px;}


.main-logo-wrapper img{

	max-width:100%;
}

.modal-dialog{top: initial;left: initial;}

.main-listing-wrapper ul li{
	display:flex;
	align-items: center;
}

.logo-wrapper {
    margin-top: 0;
}

.main-banner-info-section .container-fluid{
	padding: 2rem 0 0rem;
}

.no-padding-left{padding-left:15px;}

.no-padding-right{padding-right:15px;}

.policy-modal .modal-dialog {
    top: 30%;
    left: 0;
    width:initial;
}

#currentPolicy .modal-dialog {
    width:90% !important;
}

.separator-img-wrapper.desktop-view-separator{

	display:none;
}

.separator-img-wrapper.mobile-view-separator{

	display:block;
	padding: 15px 0 0;
}

.separator-img-wrapper.mobile-view-separator img{
	max-width:100%;
}

.about-info .add-on,.vehicle-info .add-on{
	top:8px;
}
.insurance-needs-block .info-wrap{
	margin-bottom:20px;
}

.modal-footer{margin-top:0;}

.price-card{

 min-height: 285px;

}
.price-card.small-price-card{
	min-height:100px;
}

.accident-cover span{margin-top:0 !important;}

.claim-details .form-row,.policy-info-details,.tell-us-about-vehicle-wrapper.few-more-vehicle-details-block .col-md-4
{clear:both;}


.additional-discount-block{display:inherit;}
.personal label{top:0px !important;right:0 !important;}
.togglename.accident-cover span{margin-right:3px !important;}
.personal-lbl{top:2px !important;}

.vehicle-details-progress-section {
    padding: 2rem 0 2rem;
}
.tell-us-about-vehicle-wrapper, .just-few-more-details-wrapper, .tell-us-about-you-wrapper{
	max-width:100%;
	margin: 10px 12px;
	
}

.tell-us-about-vehicle-wrapper,.few-more-vehicle-details-block{padding-bottom: 15px;}

.just-few-more-details-wrapper{margin-top:20px;padding-bottom: 15px;}

.content-claim {
    margin-left: 45px;
}

.claimlbl-toggle{right:14px;}

.vehicle-loan-text,.claims-text{display:flex;align-items:center;}


.vehicle-loan-text img{ /*height: 25px;*/
    margin-right: 2px;
    max-width: 22px;}


 .claims-text img{max-width: 20px;}   

.policy-info-details{margin: 25px 0;}
.next-block .pull-right,.few-more-vehicle-details-block .col-md-4.pull-right{float:none !important;}

.idv-wrapper{margin-top:20px;margin-bottom:20px;}

footer .pricing-footer .footer {
    padding: 22px 0 0;
    text-align: center;
}
.separator-section .separator{overflow:hidden;padding-bottom:35%;}




.price-card .yearly-icon {
    float: left;
    display: block;
    position: relative;
    top: 5px;
    z-index: 2;
    margin: 0 -100% 0 0;
    left: -18px;
}

.price-card .yearly-icon img {
    max-width: 55px;
    margin:0px;
}

.price-card .choose-plan {
    position: relative;
  
}
.price-card {
    min-height: 100px;
}
.nav-pills>li.active>a>.price-card .choose-plan:after {
    position: absolute;
    right: -25px;
    top: -75px;
}

.price-card .choose-plan:after {
    position: absolute;
    right: -25px;
    top: -75px;
    margin: 0 auto;
}

.price-card h3{margin:0;font-size:14px;text-align:left;}

.price-card p, .choose-plan span{text-align:left;}

.price-card .price-name, .price-card .choose-plan{margin-left:50px; position: relative;
    top: 10px;}

.price-card .choose-plan{text-align:left;}

.price-card .price-name p{font-size:12px;}

.helpbtn{display:block;}

.helpbtn,.helpbtn:hover{border:0;box-shadow:none;}

.policy-help-col{ transition: .3s all ease;display:none;}

.modal-body .form-group{display:inline;}

/*.vehicle-details .expired-form-group{float: none !important;
    text-align: center;}*/

 .vehicle-details .expired-form-group .not-expired-btn{font-size: 12px;} 

 .current-policy-row p{display:flex; align-items: center; width:100% !important;}
 .current-policy-row .col-xs-9{width:60% !important; display:inline-block;}
 .current-policy-row .col-xs-3{width:40% !important; display:inline-block; padding-left:1px !important;}

 .footer-premium-summary{display:block;}

 .claimlbl-toggle{right:16px !important;}

 .summary-vehicle-policy-heading h4{margin:0;}

 .premium-summary-sticky{padding:0 0 10px;}

 .premium-summary-sticky a{font-size:16px; color:#0094c1;}


 .pricing-body-block .helpbtn.btn-white:hover {
    background: #fff;
    border: 1px solid #fff;
    color: #0094c1;
}

#few-more-info .col-md-6{padding:0;}

.pricing-footer .desktop-content{display:none;}

.pricing-footer .mobile-content{display:block; font-size: 14px;margin-bottom:0;text-align: left; padding-left: 38px;}

.tab-pane .price-details h4{margin-top:0;}

.next-block {
    padding-top: 3px;
}

.outer-wrapper.desktop-view .col-md-4, .outer-wrapper.desktop-view .col-md-1{display:none;}

.insurance-trust-section .insurance-content-wrapper{margin-top:0;}

.mobile-view{display:block;background:#f0f0f0;padding: 0 0 3rem;}

.outer-main-wrapper .text-wrapper{margin-left:0;}

.outer-main-wrapper .icon-wrapper{float:none;margin:0;}

.insurance-needs-block .col-xs-6,.insurance-needs-block .col-xs-12{text-align:center;}

.claimlbl-toggle{top:-60px;}

.modal-help .modal-header{border-bottom:0;}

.about-vehicle-modal .modal-body .col-md-6{padding:0;}

#just-few-more-details .help-btn-wrap{ float: right;position:relative;}

#just-few-more-details .help-btn-wrap .btn{position:absolute;}

.modal-body input{margin-bottom:15px;}

.few-more-info-modal .claimlbl-toggle {
    top: -60px;
    right: 2px !important;
}

.few-more-info-modal #just-few-more-details .help-btn-wrap .btn{right:-75px;display:none;}

.few-more-info-modal .vehicle-loan-text img{margin-right:2px;}

.summary-table,.insured-details{margin-bottom:0;}

.summary-div .col-xs-9{padding-top:8px;}

.policy-modal .modal-title{font-size:15px;}

.policy-modal .modal-header .close {
    margin-top: 2px;
}
#btnMorethan90 {margin-bottom: 20px !important;}

#divPADeclarationText { margin-left: -7px !important;  }
#divPADeclarationTextModel { margin-left: -9px !important;  }
#divHelmetChk { margin-left: 10px  !important; }
#divHelmetText { margin-left: -12px  !important; }
#divHelmetChkModal { margin-left: -8px  !important; }
#divHelmetTextModal { padding-left: 24px  !important; }
.save-btn-wrap {
    padding-top: 17px;
}

}

@media only screen and (min-device-width : 411px) and (max-device-width : 731px) and (orientation : portrait) {

.claimlbl-toggle {
    top: 0;
}
#just-few-more-details .help-btn-wrap .btn {
    top: 32px;
}
.personal label {
    top: 0!important;}

.few-more-info-modal .switchToggle .claimlbl-toggle {
    top: 6px;
}
    

}


@media only screen and (min-device-width : 414px) and (max-device-width : 736px) and (orientation : landscape) {

.tell-us-about-vehicle-wrapper .col-md-4.pull-right {float:none !important;}
.policy-info-details,.tell-us-about-vehicle-wrapper.few-more-vehicle-details-block .col-md-4,
.claim-details .form-row{clear:both;}
#just-few-more-details .personal label{top:-18px !important;right:0 !important;}
.price-card{ padding: 2% 6%;}
#just-few-more-details .personal label{top:-18px !important;right:0 !important;}
.vehicle-loan-text, .claims-text{align-items:center;}
#just-few-more-details .accident-cover span {
    margin-top: -10px !important;
}

}



@media only screen and (min-device-width : 360px) and (max-device-width : 640px) and (orientation : portrait) {

.pricing ul li .price-card .choose-plan:after{top:-60px;}
.nav-pills>li:last-child.active>a>.price-card .choose-plan:after{top:-80px;}
.pricing ul li:last-child .price-card .choose-plan:after{top:-82px;}
.nav-pills>li.active>a>.price-card .choose-plan:after{right: -25px;
    top: -66px;}
.claimlbl-toggle {
    top: 0;
}
#just-few-more-details .help-btn-wrap .btn {
    top: 32px;
}
.personal label {
    top: 0!important;}

.few-more-info-modal .personal label {
    top: 0px!important;
}
.few-more-info-modal .claimlbl-toggle {
    top: -45px;}

.few-more-info-modal #just-few-more-details .help-btn-wrap .btn{
	top:0;
}


}


@media only screen and (min-device-width : 360px) and (max-device-width : 640px) and (orientation : landscape) {

	


}






@media only screen and (min-device-width : 320px) and (max-device-width : 767px) and (orientation : landscape) {

.nav-pills>li.active>a>.price-card .choose-plan:after {
    position: absolute;
    top: -50px;
}

.price-card .choose-plan:after{
	top:-60px;
}

.claimlbl-toggle {
    top: 0;
}
 #just-few-more-details .personal label {
    top: 0!important;
}
#just-few-more-details .help-btn-wrap .btn {
    position: absolute;
    top: 32px;
} 
.few-more-info-modal .claimlbl-toggle {
    top: 0px;}
}    

}

