/* ==========================================================================
   Responsive Styles
   ========================================================================== */

@media (hover:hover) and (pointer:fine){
	.header-nav .menu-item-has-children a:hover::after{
		top: 48%;
		-webkit-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		transform: rotate(45deg);
		border-color: var(--tr-secondary-color);
	}
	.header-nav .menu-item-has-children.open > a {
		color: var(--tr-secondary-color);
	}
}
@media screen and (max-width: 1440px){
	.protect-row .protect-col:first-child{
		width: 50%;
		flex: 0 0 50%;
	}

	
	.flexible-contact_detail .contact-detail-list{
		grid-template-columns: repeat(2, 1fr);
		align-items: center;
		text-align: center;
	}
}

@media screen and (min-width: 1500px) {
	.about-topside-reviews .wpac .grw-btns{
		position: absolute!important;
	}
	.about-topside-reviews .grw-btns.grw-prev{
		left: -50px!important;
	}
	.about-topside-reviews .grw-btns.grw-next{
		right: -50px!important;
	}
}

/* Desktop - 1367px and up */
@media screen and (min-width: 1367px) {
	.about-topside-trust .about-topside-partners.partner-tablet {
		display: none;
	}
	
	.single-review-only{
		margin-bottom: -55px;
	}
}

@media screen and (min-width: 1333px) and (max-width: 1500px){
	.about-topside-reviews .wp-gr .grw-review-inner{
		padding: 20px 15px !important;
	}
	.about-topside-reviews .wp-gr .grw-review-inner>svg {
		top: 25px !important;
		right: 15px !important;
		width: 20px !important;
		height: 20px !important;
	}
	.about-topside-reviews .wp-gr .grw-review .wp-google-left{
		padding-left: 70px !important;
	}
}

@media screen and (min-width: 1025px) and (max-width: 1440px){
	.protect-row .protect-col:first-child::after {
        right: -20%;
    }
}

/* Tablet and below - 1366px */
@media screen and (max-width: 1366px) {
	.about-topside-trust .about-topside-partners.partner-desktop {
		display: none;
	}

	.about-topside-trust .about-topside-partners.partner-tablet {
		-webkit-flex-direction: row;
		-ms-flex-direction: row;
		flex-direction: row;
		-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		-webkit-justify-content: center;
		-ms-flex-pack: center;
		justify-content: center;
	}

	.about-topside-trust .about-topside-row {
		padding-bottom: 166px;
	}

}

/* Large tablet - 1360px */
@media screen and (max-width: 1360px) {
	.footer-top-wrapper .footer-contact-row {
		padding: 20px;
	}
}

/* Medium tablet - 1140px */
@media only screen and (max-width: 1140px) {
	.footer-main .footer-wrapper {
		padding: clamp(100px, 14vw, 140px) 0 clamp(80px, 10vw, 100px);
	}

	.footer-spacer{
		height: 110px;
		margin-bottom: -110px;
	}
	.footer-contact-content .footer-contact-detail p, .footer-contact-content .footer-contact-detail p a{
		font-size: 14px;
	}

	.flexible-contact-map{
		margin-bottom: -25px;
	}

	.flexible-protect_home .protect-row {
		padding: 70px 60px 65px 60px;
	}

	.flexible-image_section {
		margin-bottom: -140px;
	}

	.plan-list {
		-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		gap: 70px 20px;
		-webkit-justify-content: center;
		-ms-flex-pack: center;
		justify-content: center;
	}

	.plan-list .plan-item {
		-webkit-flex: 0 0 49%;
		-ms-flex: 0 0 49%;
		flex: 0 0 49%;
		width: 49%;
	}

	.plan-list .plan-item:not(:last-child)::after {
		content: unset;
	}
}

@media screen and ( min-width: 768px ) and (max-width: 1140px){
	.footer-contact-item .footer-contact-detail br{
		display: none;
	}
}

@media screen and ( min-width: 1025px ) and (max-width: 1070px){
	.menu-item a{
		font-size: 14px;
	}
}

/* Desktop range - 1025px to 1360px */
@media only screen and (min-width: 1025px) and (max-width: 1360px) {

	.footer-wrapper .footer-row {
		gap: 30px;
	}

	.flexible-hero-section .hero-row {
		gap: 20px;
	}

}

@media only screen and (min-width: 1141px) and (max-width: 1500px){
	.header-col .header-contact {
		padding-left: 12px;
		margin-left: 12px;
		gap: 12px;
	}

	.header-nav .menu-item-has-children > a::after{
		right: -10px;
		width: 6px;
		height: 6px;
		top: calc(50% - 6px);
	}
	.header-nav .menu-item-has-children.open > a::after{
		top: 46%;
	}
	.header-nav ul:not(.sub-menu) .menu-item a{
		font-size: 14px;
	}
	.header-call{
		gap: 5px;
	}
	.header-call .header-link{
		font-size: 18px;
	}
}

@media only screen and (max-width: 1290px){
	.header-nav ul:not(.sub-menu) .menu-item {
		margin-left: 15px;
	}
}

@media only screen and (max-width: 1140px){
	body.open_menu {
		overflow-y: hidden;
	}

	.header-menu-wrapper {
		position: fixed;
		top: 0;
		right: -100%;
		width: 280px;
		height: 100%;
		background-color: var(--tr-white-color);
		-webkit-box-shadow: -4px 0 12px rgba(0, 0, 0, .2);
		-moz-box-shadow: -4px 0 12px rgba(0, 0, 0, .2);
		box-shadow: -4px 0 12px rgba(0, 0, 0, .2);
		-webkit-transition: right .3s ease;
		-moz-transition: right .3s ease;
		-o-transition: right .3s ease;
		transition: right .3s ease;
		z-index: 9999;
		padding: 36px 20px 20px;
		overflow: auto;
	}

	.header-menu-wrapper.open {
		right: 0;
		-webkit-flex-direction: column;
		-ms-flex-direction: column;
		flex-direction: column;
		-webkit-align-items: flex-start;
		-ms-flex-align: start;
		align-items: flex-start;
		-webkit-justify-content: flex-start;
		-ms-flex-pack: start;
		justify-content: flex-start;
		gap: 20px;
	}

	.header-menu-open,
	.header-menu-wrapper .header-close-menu {
		display: block;
	}

	.header-menu-wrapper .header-close-menu {
		margin-left: auto;
	}

	.header-nav {
		width: 100%;
	}

	.header-nav ul:not(.sub-menu) .menu-item {
		display: block;
		margin-left: 0;
		margin-bottom: 20px;
	}

	.header-nav ul:not(.sub-menu) .menu-item a {
		padding: 0;
		width: 100%;
	}
	.header-nav .menu-item-has-children > a::after{
		right: 0px;
	}

	.header-nav .sub-menu {
		position: relative;
		top: unset;
		left: unset;
		display: none;
		padding: 15px 0 0;
		margin-left: 15px;
		box-shadow: unset;
		border-bottom: 0;
	}

	.header-nav .menu-item-has-children > a {
		position: relative;
		padding-right: 25px;
	}

	.header-nav .menu-item-has-children.open .sub-menu {
		display: block;
		visibility: visible;
		opacity: 1;
	}

	.header-col .header-contact {
		-webkit-flex-direction: column;
		-ms-flex-direction: column;
		flex-direction: column;
		-webkit-align-items: flex-start;
		-ms-flex-align: start;
		align-items: flex-start;
		gap: 30px;
		padding: 0;
		margin: 0;
		border: 0;
		width: 100%;
	}
	.header-col .header-contact::before{
		content: unset;
	}
}

/* Tablet - 1024px and below */
@media only screen and (max-width: 1024px) {

	.footer-wrapper .footer-row {
		gap: 30px;
	}

	.footer-menu-title {
		margin-bottom: 20px;
	}

	.footer-nav .footer-menu-list:not(#menu-services-menu) .menu-item + .menu-item {
		margin-top: 15px;
	}

	.flexible-hero-section .hero-row {
		gap: 50px;
		-webkit-flex-direction: column;
		-ms-flex-direction: column;
		flex-direction: column;
	}

	.flexible-hero-section .hero-col-left {
		-webkit-flex: 0 0 100%;
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
		width: 100%;
	}

	.hero-col .hero-sub-headline,
	.hero-col .hero-headline,
	.hero-col .hero-description {
		text-align: center;
		margin: auto;
	}

	.flexible-roofing-section .clip-img::after{
		background: -webkit-linear-gradient(91.27deg, rgba(0, 0, 0, .8) 1.09%, rgba(0, 0, 0, .8) 44.66%, rgba(0, 0, 0, 0) 97.51%);
		background: -moz-linear-gradient(91.27deg, rgba(0, 0, 0, .8) 1.09%, rgba(0, 0, 0, .8) 44.66%, rgba(0, 0, 0, 0) 97.51%);
		background: -o-linear-gradient(91.27deg, rgba(0, 0, 0, .8) 1.09%, rgba(0, 0, 0, .8) 44.66%, rgba(0, 0, 0, 0) 97.51%);
		background: linear-gradient(91.27deg, rgba(0, 0, 0, 0.8) 1.09%, rgba(0, 0, 0, 0.8) 44.66%, rgba(0, 0, 0, 0) 97.51%);
	}

	.tr-list.hero-list ul {
		width: 85%;
		margin: auto;
	}

	.about-topside-trust .about-topside-row {
		margin-bottom: -15%;
	}

	.roofing-solutions-col .roofing-solutions-services {
		grid-template-columns: repeat(2, 1fr);
		gap: 15px 30px;
	}

	.about-topside-col .about-topside-description,
	.about-topside-trust .about-topside-col .about-topside-description,
	.roofing-row .roofing-headline,
	.roofing-col .roofing-list,
	.roofing-row .roofing-description,
	.roofing-solutions-col .roofing-solutions-description,
	.plan-col .plan-description{
		width: 100%;
	}
	.faq-item .faq-item-description {
		width: 90%;
	}
	.search-posts-lists, .tr-posts-lists {
		grid-template-columns: repeat(2, 1fr);
	}
	.protect-row .protect-col:first-child::after {
        right: -18%;
    }

	/* sidebar */
	.tr-content-main .tr-row.has-sidebar{
		flex-direction: column;
		align-items: center;
		gap: 50px;
	}
	.tr-content-main .tr-row.has-sidebar .tr-content-wrap, .flexible-content-wrapper.has-sidebar .flexible-page-content{
		flex: 0 0 100%;
		width: 100%;
	}
	.tr-content-main .tr-row.has-sidebar .tr-sidebar{
		flex: 0 0 420px;
		width: 420px;
	}
}

/* Small tablet - 999px */
@media screen and (max-width: 999px) {
	.footer-main .footer-wrapper {
		padding: clamp(70px, 10vw, 100px) 0 clamp(60px, 8vw, 80px);
	}

	.footer-wrapper .footer-logo img{
		width: 200px;
    	height: auto;
	}

	.footer-nav #menu-services-menu{
		grid-template-columns: repeat(1, 1fr);
	}

	.flexible-protect_home .protect-row {
		padding: 60px 40px 55px 40px;
		-webkit-flex-direction: column;
		-ms-flex-direction: column;
		flex-direction: column;
		text-align: center;
	}

	.protect-row .protect-col:first-child {
		width: 100%;
		-webkit-flex: 0 0 100%;
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
	}

	.protect-row .protect-col:first-child::after {
		content: unset;
	}

	.flexible-image_section {
		margin-bottom: 0;
	}

	.footer-top-wrapper {
		margin: 0;
		background-color: var(--tr-secondary-color);
	}

	.footer-top-wrapper .footer-contact-row {
		-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
	}

	.footer-contact-item {
		width: 48%;
		-webkit-flex: 0 0 48%;
		-ms-flex: 0 0 48%;
		flex: 0 0 48%;
	}

	.footer-spacer{
		height: 0px;
		margin-bottom: 0px;
	}

	.flexible-contact-map{
		margin-bottom: 0px;
	}

	.team-members{
		grid-template-columns: repeat(2, 1fr);
		gap: 20px;
	}

	.tr-headline br{
		display: none;
	}

	.flexible-form-contact-info .form-contact-row .form-contact-col{
		padding: 40px 20px;
	}
	.contact-info-list .contact-info-item .contact-info-item-icon img{
		width: 22px;
   		height: 22px;
	}
}

/* Mobile landscape - 767px */
@media screen and (max-width: 767px) {
	.footer-main .footer-wrapper {
		padding: clamp(60px, 8vw, 80px) 0 clamp(50px, 6vw, 70px);
	}

	p, ul li{
		font-size: 16px;
	}

	.flexible-protect_home .protect-row {
		padding: 50px 30px 45px 30px;
	}

	.footer-top-wrapper .footer-contact-row {
		-webkit-align-items: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-justify-content: center;
		-ms-flex-pack: center;
		justify-content: center;
	}

	.footer-wrapper .footer-row{
		grid-template-columns: repeat(3, auto);
	}
	.footer-wrapper .footer-row .footer-col.footer-logo{
		grid-column: 1 / -1;
    	text-align: center;
	}
	.flexible-contact_detail .contact-detail-list {
		grid-template-columns: repeat(2, 1fr);
	}

	.footer-contact-item .footer-contact-content{
		width: 100%;
	}

	.footer-contact-item {
		width: 100%;
		-webkit-flex: 0 0 100%;
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
	}

	.footer-contact-row .footer-contact-item{
		-webkit-flex-direction: column;
		-ms-flex-direction: column;
		flex-direction: column;
	}

	.footer-contact-row .footer-contact-item,
	.footer-contact-row .footer-contact-item:last-child {
		-webkit-align-items: center;
		-ms-flex-align: center;
		align-items: center;
		text-align: center;
	}

	.footer-copyright-wrapper .footer-copyright-row {
		-webkit-flex-direction: column-reverse;
		-ms-flex-direction: column-reverse;
		flex-direction: column-reverse;
		gap: 20px;
	}

	.footer-copyright-row .footer-copyright-text p {
		text-align: center;
	}

	.tr-btn, body .site-main .gform-theme.gform-theme--framework.gform_wrapper .tr_form input:is([type="submit"]), .comment-form input[type="submit"]{
		padding-left: 20px;
		padding-right: 20px;
	}

	.tr-list.hero-list ul {
		width: max-content;
	}

	.tr_form_wrapper .gform_description {
		width: 100%;
	}

	.hero-form-wrapper {
		padding-left: 30px;
		padding-right: 30px;
		-webkit-clip-path: polygon(0 100%, 0 4%, 50% 0, 100% 4%, 100% 100%);
    	clip-path: polygon(0 100%, 0 4%, 50% 0, 100% 4%, 100% 100%);
	}
	.hero-form-wrapper::after{
		-webkit-clip-path: polygon(0 100%, 0 4.5%, 50% 0.5%, 100% 4.5%, 100% 100%);
    	clip-path: polygon(0 100%, 0 4.5%, 50% 0.5%, 100% 4.5%, 100% 100%);
	}

	.roofing-solutions-col .roofing-solutions-services {
		grid-template-columns: repeat(1, 1fr);
		gap: 20px;
	}

	.faq-item .faq-item-description {
		width: 85%;
	}

	.plan-list{
		margin-top: 80px;
	}
	.plan-list .plan-item {
		-webkit-flex: 0 0 100%;
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
		width: 100%;
	}

	.error-404 .tr-description,
	.thankyou-page .tr-description {
		width: 70%;
	}

	.page-header .tr-description{
		width: 100%;
	}

	.search-posts-lists, .tr-posts-lists, .has-sidebar .tr-posts-lists {
		grid-template-columns: repeat(1, 1fr);
	}

	.flexible-image_with_list .image-with-list-items{
		grid-template-columns: repeat(2, 1fr);
		gap: 20px;
	}

	.flexible-form-contact-info .form-contact-row{
		flex-direction: column;
	}
	.flexible-form-contact-info .form-contact-row .form-contact-col{
		width: 100%;
	}
	.flexible-form-contact-info .form-contact-row .form-contact-col-left{
		gap: 30px;
        border-bottom-left-radius: 0px;
        border-top-right-radius: 10px;
	}
	.flexible-form-contact-info .form-contact-row .contact-info-list{
		gap: 20px;
	}
	.flexible-content_section .content-section-subtitle{
		max-width: 100%;
	}
}

/* Mobile medium - 620px */
@media screen and (max-width: 620px) {
	.footer-wrapper .footer-logo img{
		width: 180px;
	}
	.footer-wrapper .footer-row {
        grid-template-columns: repeat(1, 1fr);
    }
	.footer-wrapper .footer-row {
		text-align: center;
	}
	.footer-nav .footer-menu-list .menu-item {
		width: fit-content;
		margin-left: auto;
		margin-right: auto;
	}
	.hero-col .hero-description{
		width: 100%;
	}
	body .tr-list ul {
		grid-template-columns: repeat(1, 1fr);
	}
	.tr-list ul li{
		padding-left: 35px;
	}
	.tr-list ul li::before{
		width: 25px;
    	height: 25px;
	}

	.flexible-roofing-section .clip-img::before {
		-webkit-clip-path: polygon(0 100%, 0 5%, 50% 0, 100% 5%, 100% 100%);
		clip-path: polygon(0 100%, 0 5%, 50% 0, 100% 5%, 100% 100%);
	}

	.flexible-roofing-section .clip-img::after,
	.flexible-roofing-section .clip-img img {
		-webkit-clip-path: polygon(0 100%, 0 5.5%, 50% 0.5%, 100% 5.5%, 100% 100%);
		clip-path: polygon(0 100%, 0 5.5%, 50% 0.5%, 100% 5.5%, 100% 100%);
	}

	.post-navigation .nav-links{
		flex-direction: column;
	}
	.post-navigation .nav-previous, .post-navigation .nav-next{
		flex: 0 0 100%;
		width: 100%;
	}

	.team-members, .flexible-contact_detail .contact-detail-list{
		grid-template-columns: repeat(1, 1fr);
	}
	.sidebar-wrapper .widget-content{
		padding-left: 15px;
		padding-right: 15px;
	}

	.contact-detail-list .contact-detail-item{
		text-align: center;
	}
	.flexible-contact_detail .contact-detail-list{
		row-gap: 25px;
	}

	.flexible-image_with_list .image-with-list-items{
		grid-template-columns: repeat(1, 1fr);
	}
}

/* Mobile small - 480px */
@media screen and (max-width: 480px) {
	.footer-main .footer-wrapper {
		padding: 50px 0 50px;
	}

	.site-header .header-row {
		min-height: 66.35px;
	}
	.site-header {
		border-bottom-width: 2px;
	}
	.header-row .header-logo .header-logo-link {
		height: 91.35px;
		top: -1px;
	}

	.header-logo .header-logo-link img {
		width: 150px;
		height: auto;
	}

	.flexible-protect_home .protect-row {
		padding: 40px 20px 35px 20px;
	}

	.hero-form-wrapper{
		padding-left: 15px;
		padding-right: 15px;
	}

	.about-topside-trust .about-topside-row {
		margin-bottom: -20%;
	}
	.faq-item .faq-item-description {
		width: 80%;
	}

	.error-404 .tr-description,
	.thankyou-page .tr-description {
		width: 100%;
	}

	.tr-posts-lists .post-info, .tr-posts-lists .tr-post-meta-data{
		padding-left: 20px;
		padding-right: 20px;
	}
	
	.tr-content-main .tr-row.has-sidebar .tr-sidebar{
		flex: 0 0 100%;
		width: 100%;
	}

	.about-topside-reviews .wp-gr .grw-review-inner{
		padding: 15px!important;
	}
	.about-topside-reviews .wp-gr .grw-review-inner>svg{
		top: 10px !important;
		right: 10px !important;
		width: 18px !important;
		height: 18px !important;
	}
	.about-topside-reviews .wp-gr .grw-btns {
		height: 20px !important;
		width: 20px !important;
	}
	.about-topside-reviews .wp-gr.wpac .wp-google-left img{
		width: 47px !important;
		height: 47px!important;
	}
	.about-topside-reviews .wp-gr .grw-review .wp-google-left{
		padding-left: 57px !important;
	}
	
	.tr-gallery{
		flex-direction: column;
	}
	.tr-gallery figure{
		width: 100%!important;
	}
}

@media screen and (max-width: 375px){
	.hero-col .hero-headline {
		font-size: 60px;
		line-height: 75px;
	}
	.tr-common-headline{
		overflow-wrap: break-word;
	}
}