/*
Theme Name: MMG-Theme
Theme URI: https://wordpress.org/themes/twentytwentyone/
Template: twentytwentyone
Author: HCH
Author URI: https://wordpress.org/
Description: Twenty Twenty-One is a blank canvas for your ideas and it makes the block editor your best brush. With new block patterns, which allow you to create a beautiful layout in a matter of seconds, this theme’s soft colors and eye-catching — yet timeless — design will let your work shine. Take it for a spin! See how Twenty Twenty-One elevates your portfolio, business website, or personal blog.
Tags: one-column,accessibility-ready,custom-colors,custom-menu,custom-logo,editor-style,featured-images,footer-widgets,block-patterns,rtl-language-support,sticky-post,threaded-comments,translation-ready
Version: 24
Updated: 2023-09-17 12:16:08

*/
/*HOME PAGE BTNS*/
a {
    text-decoration: none !important;
}
a.green:hover {
    color: #5ba5b0;
}
a.blue:hover {
    color: #80c66d;
}
a.linkBTN {
    color: #5ba5b0;
}
a.linkBTN:hover {
    color: #80c66d;
}
/*NAV POSITION*/
.primary-navigation {
    top: 7em;
    right: 5em;
}
@media only screen and (max-width: 450px) {
	/*NAV FIX?*/
nav#site-navigation {
    top: 0em;
    right: 0rem;
}
}
/*ROW FIX*/
.row.hero {
    --bs-gutter-x: 0rem;
    }
@media only screen and (max-width: 450px){
/*HODE WEB DEV*/
.headB.inLine {
    display:none;
	}
/*SHOW WEB DEV*/	
.page-id-12 .headB.inLine {
    display:inline-block;
	}
/*PAGE HEADER*/
h1.blue.pageHead {
    padding-top: 0.5em;
   }
/*MAINTAIN HEADER*/
	.page-id-136 h1.blue.pageHead {
		font-size: 4rem;
		margin-left: 1rem;
	}
}
/*MOBILE TABLE*/
.row.buildTableMob {
    display: none;
}
/*TABLE DISPALY*/
@media only screen and (max-width: 450px) {
.row.buildTable {
    display: none;
    }
.row.buildTableMob {
    display: block;
    }
}
@media only screen and (min-width: 451px){
/*TABLE MARGINS*/
table.mmgTable {
    width: 70%;
    margin-left: 15%;
	}
}
/*TABLE*/
tbody, td, tfoot, th, thead, tr {
    border: 0px solid white !important;
}
/*TABLE BODY*/
tbody {
    text-align: center;
}
/*SERVICES TD CLASS*/
td.service {
    text-align: left;
}
/*MOBILE TABLE*/
@media only screen and (max-width: 450px){
tr.ptag {
    font-size: 0.8rem;
}
th {
    font-size: 0.9rem;
    }
}

/*FORM */
textarea.wpcf7-form-control, input.wpcf7-form-control  {
    border: 1px solid #80c66d;
}
/*MOBILE FORMS*/
@media only screen and (max-width: 450px){
	/*MOBILE LABEL FOR FORMS*/
label.ptag {
    font-size: 1em;
	}
}
/**/
@media only screen and (min-width: 451px){
	form.wpcf7-form.init {
    padding-left: 10%;
	}
}


/*BOTTOM IMAGE*/
.lowIMG {
    height: 25rem;
    background-repeat: no-repeat;
    background-size:contain;
    background-position:center;
		opacity: 0.6;
		margin-bottom: -5em;
}
@media only screen and (max-width: 450px){
.lowIMG {
    margin-bottom: -10em;
    }
}
/*PAGE BREAK IMAGE*/
.pageIMG {
    height: 25rem;
    background-repeat: no-repeat;
    background-size:contain;
    background-position:center;
    opacity: 0.6;
}
/*===ELEMENTS===*/

		/*BODY*/
		body {
			font-family: sans serif;
		}
		/*H1*/
		h1 {
			font-size: 3.5rem;
			font-weight: bold;
			font-style: italic;
			margin: 0rem;
		}
		/*H2*/
		h2 {
			font-size: 2.4rem;
			font-weight: bold;
			font-style: italic;
			margin: 0rem;
		}
		/*SECTION*/
		section {
			margin-bottom: 5rem;
		}
/*===ELEMENTS END===*/

/*CLASSES*/

		/*SET INLINE-BLOCK*/
		.inLine {
			display: inline-block;
		}
		/*MAIN DIV*/
		.container {
			width: 90%;
			margin-left: 5%;
		}
                /*FOR P TAGS*/
        .ptag {
            font-weight: bold;
            font-size: 1.5rem;
            padding: 0.5rem;
        }
        /*WHO WE ARE HEADER*/
        .whoHead {
            text-align: center;
          width: 100%;
            margin-bottom: 2rem;
        }
        /*SIDE SPLAT*/
        .sideSplat {
            position: absolute;
            left: 0px
        }
		/*BTN CLASS*/
        .btn {
            font-size: 1.4rem !important;
        }
        /*ROW*/
        .row {
            margin-bottom: 5em;
        }
		/*BLUE TEXT*/
		.blue {
			color: #5ba5b0 ;
		}
		/*GREEN TEXT*/
		.green {
			color: #80c66d ;
		}
		/*HEADER A DIV*/
		.headA {
			width: 40%;
		}
		/*HEADER B DIV*/
		.headB {
			width: 35%;
			text-align: right;
			vertical-align: middle !important;
			
		}
		/*HEADER C DIV*/
		.headC {
			width: 20%;
			text-align: right;
			vertical-align: top !important;
		}
		/*BURGER NAV*/
		.bNav {
			height: 2.5rem;
			margin-top: 0.8rem;
		}
		/*HERO A DIV*/
		.heroA {
			width: 50%;
		}
		/*HERO B DIV*/
		.heroB {
			vertical-align: top !important;
			padding-top: 10rem;
		}
		/*HERO IMAGE*/
		.heroIMG {
			width: 90%;
		}
		/*SPACER DIV A 15%*/
		.spacerA {
			width: 15%;
			}
		/*BUTTONS*/
		.btn {
			font-size: 1.5rem;
			font-weight: bold;
			font-style: italic;
			width: 14rem;
			border-radius: 25px;
			margin: 0.5rem;
			padding: 0.5rem;
			background-color: white !important;
		}
		/*BLUE BUTTONS*/
		.blueBTN {
			color:#5ba5b0 !important ;
			border: 1px solid  #5ba5b0 !important;
			box-shadow: 1.5rem 0.5rem 2rem #5ba5b0;
		}
		.blueBTN:hover {
			color: #80c66d !important;
			border: 1px solid #80c66d !important;
			box-shadow: 1.5rem 0.5rem 2rem #80c66d;
		}
		/*GREEN BUTTONS*/
		.greenBTN {
			color:#80c66d !important;
			border: 1px solid #80c66d !important;
			box-shadow: 1.5rem 0.5rem 2rem #80c66d;
		}
		.greenBTN:hover {
			color: #5ba5b0 !important;
			border: 1px solid  #5ba5b0 !important;
			box-shadow: 1.5rem 0.5rem 2rem #5ba5b0;
		}
		/*MAINTAIN BUTTON*/
		.btnA {
			margin-left: 4rem;
		}
		/*REPAIR BUTTON*/
		.btnB {
			margin-left: 8rem;
			}
		/*NAV*/
		.primary-navigation {
				opacity: 1;
				display: none;
				position: fixed;
		}
		/*NAV CONTAINER*/
		.admin-bar .primary-navigation {
			right: 6rem;
			top: 10rem; 
		}
		/*NAV LINKS*/
		.primary-navigation a:link {
			color:  #5ba5b0;
		}
		.primary-navigation a:hover {
			color: #80c66d;
			text-decoration: none;
			text-shadow: 1rem 0.5rem 1rem #80c66d;
		} 
		/*HERO TAG LINE*/
		.tagLine {
            width: 50%;
            margin-left: 15%;
            margin-top: 4rem;
            font-weight: bold;
            font-style: italic;
            font-size: 2rem;	
            display: inline-block;
		}
		/*HEADER A*/
          .headerA {
              margin-left:15%;
          }
          /*HEADER B*/
          .headerB {
              text-align: right;
              margin-right: 10%;
          }
          /*SECTION A*/
          .secA {
              width: 60%;
              margin-left: 5%;
              display: inline-block;
          }
          /*SECTION B*/
          .secB {
                  height: 20rem;
              display: inline-block;
                  vertical-align: top;
                  background-size: contain;
                  background-repeat: no-repeat; 
          }

          /*SECTION D*/
          .secD {
               width: 60%;
              display: inline-block;
          }
          /*PAGE BTN*/
          button.pageBTN {
              margin-top: 0em;
              margin-left: 0rem;
          }

			/*IDS*/
		/*BURGER NAV IMG*/	
		img#bNav {
			position: absolute;
			right: 100px;
					 }
		/*HEADER*/
		header#masthead {
			padding-bottom: 0px;
			margin-bottom: -5rem;
		}
		/*NAV COPY*/
		ul#primary-menu-list {
			font-style: italic;
			font-weight: bold;
		}
		/*MOBILE HERO IMG*/
		.mobHeroIMG {
			display: none;
			margin-left: -1.5rem;
			margin-top: 3rem;
		}
		
        /*BUILD IMG DIV*/
        #buildIMG {
            background-image: url(https://mrmiceguy.co.uk/wp-content/uploads/2024/04/splatHousedraftC.png);
        }
        /*MAINTAIN IMG DIV*/
        #maintainIMG {
            background-image: url(https://mrmiceguy.co.uk/wp-content/uploads/2024/04/splatKeyboard.png);
        }
        /*REPAIR IMG DIV*/
        #repairIMG {
            background-image: url(https://mrmiceguy.co.uk/wp-content/uploads/2024/04/spanner-Splat-1.png);
        }
		/*MOBILE CSS*/
		
		@media only screen and (max-width:1000px) {
		/*H1*/	
		h1 {
			font-size: 2rem;
		}
		/*H2*/
		h2 {
			font-size: 1.2rem
		}
		/*HEADER LEFT DIV*/
		.headA {
				width: 40%;
			}
		/*HEADER CENTRAL DIV*/
		.headB {
				position: absolute;
			top:6rem;
			left: 9rem;
			width: 50%;
				text-align: left;
				
		}
		/*NAV*/
		.primary-navigation {
			display: block !important; 
			position: absolute;
		}
		/*DT NAV*/
		img#bNav {
			display: none;
		}
		/*HERO IMG*/
		.heroIMG {
				display: none;
			}
		/*MOB HERO IMG*/
		.mobHeroIMG {
			display: inline-block;
		}
		/*SPACER DIV A*/
			.spacerA {
				width: 0%;
			}
		/*HERO A*/
		.heroA {
					width: 20%;
				}
		/*BUTTON*/
		.btn {
					font-size: 1rem;
					width: 9rem;
					border-radius: 25px;
					margin: 0.3rem;
					padding: 0.3rem;
			}
		/*BUTTON MAINTAIN*/
		.btnA {
					margin-left: 2rem;
				}
		/*BUTTON REPAIR*/
		.btnB {
					margin-left: 4rem;
					}
		/*BLUE BTN*/
		.blueBTN {
					border: 0.1rem solid  #5ba5b0;
			box-shadow: 0.5rem 0.5rem 1.5rem #5ba5b0;
				}
		.blueBTN:hover {
					border: 0.1rem solid #80c66d;
			box-shadow: 0.5rem 0.5rem 1.5rem #80c66d;
				}
		/*GREEN BTN*/
		.greenBTN {
					border: 0.1rem solid #80c66d;
			box-shadow: 0.5rem 0.5rem 1.5rem #80c66d;
				}
		.greenBTN:hover {
					border: 0.1rem solid  #5ba5b0;
			box-shadow: 0.5rem 0.5rem 1.5rem #5ba5b0;
				}
         /*===NAV===*/
		/*MOBILE NAV*/
		.dropdown-icon.open {
			background-image: url(https://mrmiceguy.co.uk/wp-content/uploads/2024/03/nav.png);
			background-size: 2rem;
			width: 2rem;
			height:2rem;
			color: transparent
			}
		}
		/*FIX NAV COLOR*/
        #primary-menu-list a {
            color: #5ba5b0;
        }
        /*NAV MENU*/
        ul#primary-menu-list {
            max-width: 10em;
            border-radius: 0.25rem;
            background-color: white;
            padding: 2em;
            padding-top:0.5em ;
            color: #5ba5b0 !important;
            border: 1px solid #5ba5b0 !important;
            box-shadow: 1.5rem 0.5rem 2rem #5ba5b0;
        }
        /*NAV MENU HOVER*/
        #primary-menu-list a:hover {
            color: #80c66d !important;
        }
		/*ROTATE CLASS*/
        .rotateB {
            transform: rotate(180deg);
            transition: transform 0.3s ease; /* Smooth transition */
        }

        .rotateB[src="https://mrmiceguy.co.uk/wp-content/uploads/2024/05/X-e1715516308891.png"] {
            content: url("https://mrmiceguy.co.uk/wp-content/uploads/2024/03/nav.png");
        }
        .rotate {
            transform: rotate(90deg);
            transition: transform 0.3s ease; /* Smooth transition */
        }
        .rotate[src="https://mrmiceguy.co.uk/wp-content/uploads/2024/03/nav.png"] {
            content: url("https://mrmiceguy.co.uk/wp-content/uploads/2024/05/X-e1715516308891.png"); /* Change to the second image */
        }
        /*NAV*/
        a:focus {
            background-color: white !important;
            color: ;
        }
        /*NAV A*/
        .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) {
           text-decoration: none; 
        }
        /*NAV ACTIVE PAGE*/
        .primary-navigation .current-menu-item > a:first-child, .primary-navigation .current_page_item > a:first-child{
            text-decoration: none;
        }
        /*NAV ACTIVE PAGE HOVER*/
        .primary-navigation .current-menu-item > a:first-child:hover, .primary-navigation .current_page_item > a:first-child:hover {
            text-decoration: none;
        }
		/*==NAVV END===*/


        /*===ALL PAGE HERO===*/

        /*ALLPAGE HERO IMG*/
        .col-md-6.allHero {
            height: 25em;
            background-size: contain;
            background-repeat: no-repeat;
            background-position: right;
            opacity: 0.6;       
        }
        /*PAGE HEADER*/
        h1.blue.pageHead {
           padding-top: 2em;
            font-size: 4em;
                 text-shadow: 40px 30px 5px #80c66d;
        }
        /*MOBILE HERO HEADER*/
        @media only screen and (max-width: 450px) {
        h1.blue.pageHead {
               margin-top: 0.5em; 
                margin-left: 1em;
            }
        }
        /*===ALL PAGE HERO END===*/
		/*===FOOTER===*/

          /*LOWER FOOTER TEXT*/
          .endOfFoot {
              text-align:center
          }
          /*FOOTER MARGIN TOP*/
          .no-widgets .site-footer{
              margin-top: 2rem;
          }
          /*FOOTER NAV LINKS*/
          .footer-navigation-wrapper li a:link,
          .footer-navigation-wrapper li a:visited,
          .footer-navigation-wrapper li a:active {
              color: #5ba5b0;
              text-decoration: none;
              font-weight: bold;
              font-style: italic;
              font-size: 1.2em;
          }
          /*FOOTER NAV LINKS HOVER*/
          .footer-navigation-wrapper li a:hover {
              color: #80c66d;
              text-shadow: 1rem 0.5rem 1rem #80c66d;
          }
          /*===FOOTER END===*/

			/*===ABOUT===*/
          /*BREAK IMG*/
          .col-md-6.breakIMG {
              height: 20em;
              background-size: contain;
              background-repeat: no-repeat;
              background-position:center;
              opacity: 0.6;
          }
          /*===ABOUT END===*/
                        /*===MOBILE=== */
            @media only screen and (max-width: 1000px) {
                .tagLine {
                    width: 90%;
                    margin-left: 5%;
                    font-size: 1.5rem;	
                }
            /*SIDE SPLAT*/
            img.sideSplat {
                display: none;
            }
            P.ptag {
                width: 90%;
                font-size: 1rem;
                padding: 0.2rem;
                margin-left: 5%;
                text-align: center;
                }
            h2.whoHead {
                width: 100%;
                margin-left: 0%;
                text-align: center;
                font-size: 2rem;
                }
            }

            /*HOME PAGE MOBILE CSS*/
            @media only screen and (max-width: 450px){
            /*MOB BUTTON GRID*/	
            .col-md-4.inLine.heroB {
                padding-top: 0em !important;
                    margin-top: -10em !important;
                width: 60% !important;
                margin-left: 20% !important;
                }
            /*MOB BTN*/
            button.btn {
                font-size: 1.3rem;
                    width: 12rem;
                }
            }
            /*MOBILE END */
/*====FORM====*/
          /*SUBMIT BTN*/
          input.submitBtn {
              color: #5ba5b0 !important;
              border: 1px solid #5ba5b0 !important;
              box-shadow: 1.5rem 0.5rem 2rem #5ba5b0;
              background-color: transparent !important;
              font-size:1.5em ;
              padding-left: 2.5em;
              padding-right: 2.5em;
          }
          /*SUBMIT BTN MOBILE*/
          @media only screen and (max-width: 450px){
          input.wpcf7-form-control.wpcf7-submit.has-spinner.submitBtn {
              font-size: 1em;
              margin-left: 30%;
                  width: 40%;
              }
          }
          /*SUBMIT BTN HOVER*/
          input.submitBtn:hover {
              color: #80c66d !important;
              border: 1px solid #80c66d !important;
              box-shadow: 1.5rem 0.5rem 2rem #80c66d;
          }

          /*FORM*/
          input.wpcf7-form-control.wpcf7-text {
              width: 100%;
          }
/*====FORM END====*/
		/*END*/