.menubutton { display: none; float: right; margin-top: 11px; }
.menubutton a { color: white; padding: 5px 0px; }
.qllogin { display: none; }

@media screen and (max-width: 1460px)
{
	.inner { padding: 0px 5px; width: 100%; max-width: 1279px; }
   .header .inner {  max-width: 100%; }
   .col.dblcol { width: 755px; }
   .tutorlistingsouter .subjectlevelfilters { width: 1200px; }
	.tutorquotes .col1, .tutorquotes .col2 { width: calc(100% - 40px); max-width: 454px; margin: 0px 15px }
	.footer .inner { padding: 60px 10px;  }
   .reviewscontainer { width: calc(100% - 50px); position: relative; }
   .banner.tutorlisting .inner:before { position: absolute; left: -150px; }
   .banner.tutorlisting .inner:after { position: absolute; right: -250px; }
   .frontend .ui-datatable.tutoravailabilitytable td img { width: 70px; height: 47px; }
   .frontend .ui-datatable.tutoravailabilitytable td:first-child img { width: 125px; }
   .studentparentavailabilityfortutor .ui-datatable.studentparentavailabilitytable { width: 85%; }
   .studentparentavailabilityfortutor .studentparentavailabilitytablenav { width: 85%; }
   .studentparentavailabilityfortutor .studentparentavailabilitytablenav div:first-child { width: 150px; }
   .filtermenus .inputRegion select { min-width: 165px !important; max-width: 165px !important; }
}

@media screen and (min-width: 1400px)
{ 
   .newtotutoring h2 { text-align: left; }
   .newtotutoring .watchdemo { float: left; }
}

@media screen and (max-width: 1435px)
{
   .col:first-child { margin-left: 30px; }
   .col.dblcol { margin-left: 0px; }
   .col.dblcol.tutorlistings { margin-left: 15px; }
}

@media screen and (max-width: 1289px)
{
   .banner .bgvideo { height: 390px; }
   .tutorlistingsouter{ margin-top: -60px; }
   .tutorlistingsouter .subjectlevelfilters, .col.dblcol.tutorlistings { width: 90%; margin: 0px auto !important; }
   .tutorlistingsouter .righthandpanel { display: none; }
   .tutorlistingsouter .pagination { padding: 30px 0px 30px 0px; }
}

@media screen and (max-width: 1279px)
{
   .inner { max-width: 100%; width: 100%; }
   .banner .inner { margin: 0px auto; max-width: 820px; }
	.col.dblcol, .col.rhcol { display: block; margin-left: auto; margin-right: auto }
   .resprollup .seefulldetailsresplink { display: block; margin-bottom: 20px; font-weight: bold; }
   .resprollup .col.dblcol { max-height: 400px; overflow: hidden; position: relative; }
   .resprollup .col.dblcol:after { content: ""; background: #ffffff; position: absolute; bottom: 0px; width: 100%; height: 70px; display: block; 
         background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%); /* FF3.6+ */
         background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0)), color-stop(100%,rgba(255,255,255,1))); /* Chrome,Safari4+ */
         background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* Chrome10+,Safari5.1+ */
         background: -o-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* Opera 11.10+ */
         background: -ms-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* IE10+ */
         background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* W3C */
         filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
   } 
   .resprollup .col.lastcol { width: 695px; display: block; }
   .resprollup .col.dblcol.viewallclicked { max-height: none; }
   .resprollup .col.dblcol.viewallclicked:after { background: none; height: 0px; }
   .resprollup .col.viewallclicked .seefulldetailsresplink { display: none; }
   .banner.tutorlisting .inner:before, .banner.tutorlisting .inner:after { display: none;  }

   .messagemeetingbooking { display: table; width: 100%; }
   .messagemeetingbooking .tutorcard.tutorcard-small { display: table-cell; width: 50%; }
   .messagemeetingbooking .actionbuttons { display: table-cell; width: 50%; text-align: right; vertical-align: top; }
   .messagemeetingbooking .actionbuttons .button { width: 70% !important; margin: 5px 0 !important; padding: 10px 20px; }
   .messagemeetingbooking .actionbuttons .button:first-child { margin-top: 0 !important; }
   .tutorcard.tutorcard-small .pricefrom { display: none; }

   .tutorcard.tutorcard-small .profileimage img { width: 75px; }
   .tutorcard.tutorcard-small .ratings { margin-bottom: 0; }
   .tutorcard.tutorcard-small .ratings.ratings-mobile, .tutorcard.tutorcard-small .profileimage .profilelink-mobile { display: block; }
   .tutorcard.tutorcard-small .ratings.ratings-desktop, .tutorcard.tutorcard-small .profilelink-desktop { display: none; }

}
   
@media screen and (max-width: 1256px)
{
   .subjectintro .heading, .subjectintro .intro, .pageintro .heading, .pageintro .intro { padding: 0px 20px;}
   .col.rightborder:nth-child(2) { border-right: none }
   .col.rightborder { margin-left: 0px; }
}

@media screen and (max-width: 1250px)
{
	.header .quicklinks { width: 100%; }
}

@media screen and (max-width: 1240px)
{
	.banner .bgvideo video { margin-top: 0px }
}

@media screen and (max-width: 1200px)
{
    body { font-size: 90%; }
  
   .banner.smaller { height: auto; padding-bottom: 60px }
   .banner.smaller.preserveheight { height: 300px; }
   .banner.message { height: 300px; }
   .subjectsearchbar input { width: 450px; }
   .subjectsearchbar {  font-size: 16px; }
   .subjectsearchbar .levelsearch { padding-top: 20px; }
   .subjectsearchbar button.subjectsearch { display: block; margin: 20px auto; }
   .tutorlistings .resultssummary .righthandpanel { display: none; }
}

@media screen and (max-width: 917px)
{
   .pricing .col { margin-left: 15px; margin-bottom: 30px !important; margin-right: 15px; float: none;}
   .pricing .col:last-of-type { margin-top: 0px;}
   
   .linkbartype2 { margin: 20px auto; display: block; text-align: center; }
   .linkbartype2 a { display: inline-block; margin: 0px 10px}
}

@media screen and (max-width: 850px)
{
	.tutoravailabilitytable.hideat850 { display: none; }
	.tutoravailabilitytable.responsive { display: block;  }
   .tutoravailabilitytable.responsive .marker { wi1dth: auto !important; overflow: visible }
   .tutoravailabilitytable.responsive td { text-align: center}
   .tutoravailabilitytable.responsive .marker .text { display: none; }
   .frontend .ui-datatable.tutoravailabilitytable table { table-layout: fixed; border-collapse: collapse; }
   .frontend .ui-datatable.tutoravailabilitytable td img { width: 100%; height: 100%; max-height: 50px !important; }
}

@media screen and (max-width: 842px)
{
   .inner.narrow  { max-width: 100%; }
   .col.dblcol, .col.firstcol, .col.lastcol, .tutorlistingsouter .subjectlevelfilters { width: calc(100% - 10px) !important;; }
   .inputRegion, .inputRegion * { max-width: 100% !important;  }
   .subjectintro .heading, .subjectintro .intro, .pageintro .heading, .pageintro .intro { float: none; display: block; width: 100%;  }
   .col.rightborder { border-right: none }
   #suggestedtutorsmessagesuccess { width: 100% !important; }
   .frontend .ui-datatable.studentparentavailabilitytable table { table-layout: fixed; border-collapse: collapse; }
   .frontend .ui-datatable.studentparentavailabilitytable td img { width: auto; height: auto; }
   .frontend .ui-datatable.studentparentavailabilitytable td:first-child { padding: 0; }
   .frontend .ui-datatable.studentparentavailabilitytable td:first-child img { width: auto; min-width: 30px; }
   #studentparentavailabilitysmessagesuccess { width: 100% !important; }
   .frontend .studentparentavailabilitytablenav div:first-child { width: auto; min-width: 30px; padding-left: 0; }
   .frontend .studentparentavailabilitytablenav div:last-child { width: 82%; }
}

@media screen and (max-width: 830px)
{
	.tutorprofile .col.lastcol { width: 100%; }
   .review .profileimage { margin-left: 40px;  }
   .review .details { padding-left: 40px; }
   .howitworks .step .col { margin: 0px 20px }
   .howitworks .step .numbercircle { position: static; float: left; }
   .howitworks .step h3 { clear: both; }
   .howitworks .step .action a { width: 100%}
   
   .frontend .ui-dialog .ui-dialog-content .modalinner { padding: 20px 20px 20px 20px; height: 300px; overflow-y: scroll !important; overflow-x: hidden }
}

@media screen and (max-width: 710px)
{
   body { overflow-x: hidden; font-size: 80%; }
   .howitworks .step .col { float: none !important; display: inline-block; }
   .subjectsearchbar .levelsearch { display: none; }
   .subjectbox { float: none; width: 100%;}
   .resprollup .col.lastcol { width: 100%; }
   .messagecard .delete { display: block !important; }

   .messagemeetingbooking .tutorcard.tutorcard-small { width: 70%; }
   .messagemeetingbooking .actionbuttons { width: 30%; }
   .messagemeetingbooking .actionbuttons .button { width: 100% !important; padding: 10px; }

   .suggestedmeetingtimes a.button { padding: 2px 8px !important; margin: 3px 1px !important; }
}

@media screen and (max-width: 710px)
{
   .tutorlistings .subjectlevelfilters { padding-bottom: 55px; }
   .subjectlevelfilters .inputRegion, .tutorlistingsouter .subjectlevelfilters .inputRegion { width: 100%; margin: 0; float: none;}
   .subjectlevelfilters .filters { display: block; position: static; top: inherit; bottom: 0; width: 100%; padding: 9px; font-size: 15px; }   
   .subjectlevelfilters #extrafilters hr { width: inherit; margin: 22px 0 13px; float: none; }
   .subjectlevelfilters #extrafilters .infoPanelsWrapper { display: none; }
   .subjectlevelfilters #extrafilters .checkboxLabel { display: none; }
   .subjectlevelfilters #extrafilters .infoPanel { margin: -30px 0 20px 30px; text-align: left; }
   .subjectlevelfilters #extrafilters .infoPanelMobile { display: block; }
   .subjectlevelfilters #extrafilters .infoPanelMobile .guarantee { color: #50bf5f; }
   .subjectlevelfilters #extrafilters .infoPanelMobile .premium { font-weight: bold; color: #000000; }
   .subjectlevelfilters #extrafilters .actionButtons { display: block; }
   .subjectlevelfilters #extrafilters .actionButtons .button { margin-bottom: 0; }
   .subjectlevelfilters #extrafilters .actionButtons .button.lightgreyfill { color: rgba(0, 0, 0, 0.7); }
   .tutorlistingsouter .pagination { background: #ffffff; width: 90%; border: 1px solid #cccccc; border-radius: 4px; margin: 20px auto; padding: 20px; }
   .tutorlistingsouter .pagination .pagelist { display: none;}
   .tutorlistingsouter .pagination .responsive { display: block; vertical-align: middle; }
   .tutorlistingsouter .pagination .responsive span, .tutorlistingsouter .pagination .responsive a { vertical-align: middle; font-size: 1.2rem }
   .tutorlistingsouter .pagination .responsive .button { height: auto; top: -8px; background: none; border: 0px !important; }
   .tutorlistingsouter .results { padding-bottom: 1px; }
   
   .tutorcard { height: auto !important }
   .tutorcard .availablevideolink { margin-top: 20px }
   .tutorcard .availablevideolink p { max-width: calc(100% - 40px); }
   .tutorcard .ratings { position: relative !important; margin-top: 30px; }
   .tutorcard .ratings .stars p { display:none; }
   .tutorcard .ratings .stars + .likes { border-left: none; padding-left: 25px; display: block; margin: 0px 0px; }
   
   #availablevideolinkandshortlist .saveonlargescreen { display: none; }
   #availablevideolinkandshortlist .saveonsmallscreen { display: initial; }
}

@media screen and (max-width: 650px)
{
}
   .tutorreqestconfirmation .centeredcol { padding: 20px 15px; }
   .tutorreqestconfirmation .centeredcol + .centeredcol { padding: 50px 15px; }
   .tutorreqestconfirmation h2 { font-size: 2em; }
}

@media screen and (max-width: 600px)
{
   .header .quicklinks { width: 100%;  }
   .subjectsearchbar input { width: 400px; }
   .banner { padding-bottom: 30px; }
   .banner h1 { font-size: 3.5em }
   .banner h3 { font-size: 1.2em; margin-bottom: 30px !important; }   
   .banner .valign { padding: 40px 0px; }
   .miabhl { font-size: 0.9em}
   .miabhl svg { width: 120px;}
   .miabhl .button { width: 140px; padding: 10px }
   .cookiewarning p, .cookiewarning a { font-size: 10pt;}
   .notification .cta .button { width: auto !important; }
   
   .banner .bgvideo video { display: none }
   .banner .bgvideo img { display: block; }
   
   .sessioncompletemodal.feedback { width: 100% !important; height: 100% !important; left: 0px !important; top: 0px !important;  }
   .sessioncompletemodal.feedback .dialoginner { max-width: 100%; margin: 0px auto }
   
   .tutoravailabilitytable.responsive .marker img { display: none; }
   .tutoravailabilitytable.responsive .marker .text { display: block; text-transform: capitalize; text-align: right; margin-right: 10px;}
}

/* PF datatable reflow styling */
@media screen and (max-width: 35em)
{
	.frontend .ui-datatable .hideheadingonflow .ui-column-title { display: none; }
	.frontend .ui-datatable .button:last-child { margin-bottom: 5px; }
   .frontend .ui-datatable .ui-column-title { font-weight: bold; }
}

@media screen and (max-width: 500px)
{
   .banner .stars img { margin-right: 0px !important; border-right: 0px !important;  }
   .banner .stars a { display: block; margin-bottom: 10px;  }
   .col.signup { padding: 30px 20px; width: 100% }
   .col, .col:first-child { min-width: 280px; margin: 0px 0px 30px 0px }
   .newtotutoring p { max-width: calc(100% - 80px); }
   .newtotutoring img { width: 250px !important; }
   .input input, .input select, .input textarea { width: 100%; }
   .frontend .ui-dialog { max-width: 100%; }
   .frontend .ui-dialog .ui-dialog-content { padding: 20px 10px }
   .frontend .ui-dialog .ui-dialog-content .modalinner { padding: 20px 10px; }
   .frontend .ui-dialog .ui-dialog-content .modalfooter { padding: 20px 10px; }   
   .frontend .ui-dialog .dialogicon { display: none;  }   
   .button.wideformobile { width: 250px; }
   
   #reviews .review .profileimage { display: block; text-align: center; margin: 0px; padding: 10px 0px}
   #reviews .review .profileimage img { margin: 0px auto; }
   #reviews .review .details { text-align: center }
   #reviews .review .details .stars { margin: 0px auto; width: 85px }

   .messagemeetingbooking .tutorcard.tutorcard-small { width: 100%; }
   .messagemeetingbooking .tutorcard.tutorcard-small .bookinglink-mobile { display: block; }
   .messagemeetingbooking .actionbuttons { display: none; width: 100%; margin-top: 10px; }

   .suggestedmeetingtimes .weekselector { display: none; }
   .suggestedmeetingtimes .weekdaytable { display: none !important; }
   .suggestedmeetingtimes .weekdaytable.weekdaytablemobile { display: block !important; }
   .suggestedmeetingtimes .weekdaycolumn { display: block !important; border: none !important; }
   .suggestedmeetingtimes .weekdaycolumn .weekdayheader { display: none !important; }
   .suggestedmeetingtimes .weekdaycolumn .weekdayheader.weekdayheadermobile { display: table !important; }
   .suggestedmeetingtimes .weekdaycolumn .weekdaybody { min-height: 0 !important; }
   .suggestedmeetingtimes a.button { display: block; padding: 15px 20px !important; margin: 8px 10px !important; }

   .tutorreqestconfirmation .whatsnext .wrapper { display: block; text-align: center }
   .tutorreqestconfirmation .whatsnext .wrapper h3 { display: block; text-align: center }
   .tutorreqestconfirmation .whatsnext .wrapper img { width: 100%; margin: 0px }
   
   .footer .inner { position: relative; padding-top: 250px;  }   
   .footer .column.contact { position: absolute; top: 0px; width: 95%; width: calc(100% - 20px); text-align: center; }
   .footer .column.contact svg { opacity: 0.5 }
   .footer .column { width: 100%; }
   .footer .column .responsive { display: none; padding: 10px; }
   .footer .column.show .responsive { display: block; }
   .footer .column .heading { display: block; border-top: 1px solid #1d3148; padding: 15px 10px; margin: 0px; width: 100%; position: relative; cursor: pointer }
   .footer .column .heading:after { content: ""; position: absolute; top: 20px; right: 10px; display: block; border-color: #445263; border-style: solid; border-width: 2px 2px 0 0; transform: rotate(45deg); height: 8px; width: 8px;  } 
   .footer .column.subjects .heading {  border-bottom: 1px solid #1d3148; }

}

@media screen and (max-width: 450px)
{
   .header .logo { width: 100px;}   
   .howitworks .step .col { margin: 0px }
   .siderule:before { border: none; }
   .subjectsearchbar input { padding-left: 10px; width: 280px !important; text-overflow: ellipsis; }
   .subjectsearchbar button { width: 280px !important; }
   .howitworks .col { max-width: 250px; }
   .howitworks .col img { width: 250px !important;}
   .pricing .col { width: 100%; margin: 0px 0px 30px 0px;}
   .miabhl { font-size: 0.8em; height: auto; padding: 0px 20px 20px 20px }   
   .miabhl .valign { top: 0px; transform: none;}
   .miabhl p { clear: none; }
   .miabhl svg { width: 80px; height: 180px; margin-bottom: 0px; margin-right: 20px}
   .miabhl .button { width: 170px; margin: 0px auto !important; display: block; float: left !important;  }
   .tutorcard { padding: 10px; height: auto !important}
   .tutorcard .profileimage img { width: 100px;}
   .tutorcard .profileimage a.buttonlink { width: 100px; }
   .tutorcard .pricefrom  { top: 1px; right: 5px; font-size: 1.0em}
   .tutorcard .profiledata { padding-left: 10px; height: auto; }
   .tutorcard .ratings { margin-top: 0px; position: static !important; margin-top: 15px; }
   .tutorcard .ratings .likes { padding-left: 25px; border-left: none; }
   .tutorcard .ratings .stars.manualstars svg { width: 17px; height: 17px; }
   .tutorcard .ratings .rating { font-size: 15px; width: 26px; height: 18px; }
   .tutorcard .statement { display: none; }
   .tutorcardtutorrequest { padding: 10px; height: auto !important}
   .tutorcardtutorrequest .profileimage img { width: 100px;}
   .tutorcardtutorrequest .profileimage a.buttonlink { width: 100px; }
   .tutorcardtutorrequest .pricefrom  { top: 1px; right: 5px; font-size: 1.0em}
   .tutorcardtutorrequest .profiledata { padding-left: 10px; height: auto; }
   .tutorcardtutorrequest .button { margin-top: 35px; }
   .tutorcardtutorrequest .statement { display: none; }
   .tutorreqestconfirmation .actionbuttons .button { width: 100%; }
   .studentparentavailability .centeredcol { padding: 30px !important; }
   .studentparentavailability .centeredcol:first-child { margin-bottom: 0 !important; }
   .studentparentavailability h2 { padding: 0 0 0 50px; }
   #availablevideolinkandshortlist { font-size: 1em; }
   .availablevideolink { font-size: 1em; padding: 3px 7px 6px 10px; }
   .addtoshortlist a.save:before, .addtoshortlist a.saved:before { width: 15px; height: 27px; left: -18px; }
}

@media screen and (max-width: 430px)
{
   .col { width: 100%; }
   .notification .cta { float: none !important; text-align: center }
   .notification .cta .button { width: 90% !important; margin: 0px 0px 10px 0px !important; display: block; }
}

@media screen and (max-width: 370px)
{
   .tutorcard .ratings .stars .ui-rating-star { display: none; }
   .tutoravailabilitytable.responsive .marker .text { font-size: 0.7rem; text-align: left; }
}