/*
Theme Name: 1RM DC Theme
Author: A Daji
Description: Digital Candy's Theme
Version: 1
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/
/* Variables */
/* CSS Reset */
* {
  box-sizing: border-box;
  margin: 0;
}

body {
  background: #fff;
  line-height: 1.3;
  font-size: 16px;
  font-family: "Roboto", sans-serif;
}

button {
  cursor: pointer;
  outline: 0;
  border: 0px;
}

span.dropdownarrow {
  border: none;
  background: transparent;
  display: inline;
  line-height: 2.5;
  padding: 0;
  cursor: pointer;
}

span.dropdownarrow::after {
  content: "";
  vertical-align: top;
  display: inline-block;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  padding: 4px;
  transform: rotate(45deg);
  margin-top: 13px;
}

/* Links */
a, a:visited, span a {
  text-decoration: none !important;
  color: #000;
}

/* Links hover */
a:hover {
  color: #4591ca;
}

span a:hover {
  color: #4591ca;
}

.logo a {
  color: #000;
}

/* Topbar */
.topbar {
  width: 100%;
  text-align: right;
  padding: 10px 11%;
  background: #021689;
  color: #fff;
}

/* Scale images */
.wp-block-image img {
  height: auto;
}

/* Image align right */
img.alignright {
  float: right;
  padding-left: 0.7em;
  padding-bottom: 0.7em;
  padding-top: 0.7em;
}

/* Image align left */
img.alignleft {
  float: left;
  padding-right: 0.7em;
  padding-bottom: 0.7em;
  padding-top: 0.7em;
}

/* Headings */
h1, h2, h3, h4, h5, h6 {
  line-height: 1.7;
  font-family: "Roboto", sans-serif;
  margin-bottom: 1em;
  color: #000;
}

/* Heading 1 */
h1 {
  font-size: 2rem;
}

/* Heading 1 banner font */
h1#banner {
  text-shadow: 2px 1px 6px #000000;
  padding-top: 15%;
  color: #fff;
  display: inline-block;
  margin-bottom: 10px;
  position: relative;
  z-index: 4;
  font-size: 2.7rem;
}

/* Heading 2 */
h2 {
  font-size: 1.7rem;
}

.homepage-sec-titles {
  text-align: center;
}

/* Heading 3 */
h3 {
  font-size: 1.4rem;
  color: #363636;
  font-weight: 400;
}

/* Bold font */
.bold {
  font-weight: 700;
}

/* Paragraph font */
p {
  font-size: 1.1rem;
  line-height: 1.7;
  font-family: "Roboto", sans-serif;
  color: #545454;
}

p#service {
  font-size: 1.2rem;
  font-weight: 500;
  display: block;
  margin-bottom: 10px;
}

p#description {
  font-size: 0.9rem;
}

main p {
  margin-bottom: 1em;
}

/* Nav outer and container to hold logo and nav */
.navouter {
  width: 100%;
  display: block;
  background: #fff;
  padding: 0 11%;
  position: relative;
}

.navcontainer, .navcontainer-postop {
  width: 100%;
  background: #fff;
}

.navcontainer-postop {
  display: flex;
  flex-direction: column;
}

/* Logo */
.logo {
  width: auto;
  float: left;
  display: inline;
  padding-top: 0.35em;
  font-family: "Roboto", sans-serif;
  color: #000;
  font-size: 1.6em;
  font-weight: 600;
  margin-bottom: 0;
  /* For centre logo above nav 
  * width: 100%;
  * float: none;
  * text-align: center;
  * display: block;
  */
}

.logo img {
  max-width: 150px;
}

.logo p {
  color: #000;
  font-size: 1.6rem;
}

/* Navigation */
nav.nav, nav {
  overflow: hidden;
  font-family: "Roboto", sans-serif;
  min-height: 42px;
}

nav.centernav li a {
  text-align: left;
}

nav .centerdesktopnav ul {
  width: 100%;
  text-align: center;
}

/* Navigation link */
nav.nav a, nav a {
  display: block;
  color: #000;
  text-align: center;
  margin: 0.5em 1em 0.5em 1em;
  padding: 0;
  text-decoration: none;
  font-size: 1.1rem;
  font-weight: 600;
}

nav a.icon {
  margin: 0;
}

nav ul.menu li:last-child a {
  padding-right: 0;
}

/* Navigation link hover */
nav.nav a:hover, nav a:hover, nav.nav a:visited:hover, nav a:visited:hover {
  color: #343434;
}

/* Navigation list style */
nav.nav ul {
  list-style-type: none;
  /* Change margin auto for positioning links under logo 
  margin: auto; */
  margin: 0;
  padding: 0;
  /* Change float to none for positioning links under logo 
  float: none; */
  float: right;
  /* Add text-align center and display block for positioning links under logo
  text-align: center;
  display: block;
  */
}

nav ul {
  list-style-type: none;
  padding: 0;
}

nav ul.sub-menu, nav.nav ul.sub-menu {
  display: none;
  float: left;
  background: #021689;
  width: 100%;
  z-index: 1000;
  margin-top: 0;
  margin-bottom: 20px;
}

nav ul.sub-menu li {
  float: none;
  display: block;
  width: 100%;
}

nav ul li ul.submenu {
  display: none;
  position: absolute;
  width: auto;
  margin: 0;
}

nav ul li:hover ul.sub-menu {
  display: block;
}

nav ul li:hover ul.sub-menu a {
  text-align: left;
}

nav li.menu-item-has-children a {
  margin-bottom: 0;
}

#mobnav li.menu-item-has-children a, #mobilenav li.menu-item-has-children a {
  display: inline;
  float: none;
}

/* Current page item */
nav li.current_page_item a {
  color: #000;
}

/* Mobile submenu */
.menu-icon {
  position: relative;
  width: 100%;
}

.mobmenucont {
  width: 120px;
  margin: auto;
  font-size: 1.1rem;
  font-weight: 500;
  height: 45px;
}

.mobmenucontcontainer {
  display: flex;
  justify-content: space-around;
}

#mm {
  margin-top: 10px;
}

#linepad {
  background-color: #fff;
}

.line1, .line2, .line3 {
  width: 30px;
  height: 3px;
  background-color: #fff;
  margin: 6px 0;
  transition: 0.3s;
  position: absolute;
}

.line1 {
  top: 4px;
}

.line2 {
  top: 14px;
}

.line3 {
  top: 24px;
}

nav #mobnav ul.sub-menu, nav #mobilenav ul.sub-menu {
  margin-left: 50px;
}

nav #mobnav ul.sub-menu a, nav #mobilenav ul.sub-menu a {
  display: block;
  padding: 0.5em;
  margin-bottom: 0;
}

#mobnav a, #mobilenav a {
  margin-bottom: 0;
}

nav.nav li, nav li {
  /* Remove float and add display inline-block for positioning links under logo
  float: none;
  display: inline-block
  */
  float: left;
}

/* Mobile nav */
#mobilenav, #mobnav {
  display: none;
}

#mobilenav a {
  display: block;
  width: 100%;
  padding: 1em 4em 0.5em 4em;
  text-align: left;
}

#navlinks, #desktopnav {
  width: 100%;
  float: right;
}

/* Hide the mobile nav toggle icon */
nav.nav a.icon {
  display: none;
}

/* Style the hamburger menu */
.nav a.icon {
  background: #021689;
  border: 0;
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  color: #fff;
  width: 100%;
}

/* Slide In Nav Styling */
nav a.icon {
  background: #021689;
  display: block;
  position: absolute;
  left: 0;
  color: #fff;
  width: 100%;
  height: 45px;
}

.nav a.icon:hover, nav a.icon:hover {
  border-bottom: 0;
}

.nav a.icon img, nav a.icon img {
  vertical-align: middle;
  padding-left: 5px;
  width: 32px;
}

/* Slide In Navigation Option */
/* Mobile nav */
.mobilenavoverlay {
  width: 0;
  position: fixed;
  height: 100%;
  z-index: 6000;
  background: #021689;
  top: 0;
  transition: 0.6s;
  -moz-transition: 0.6s;
  -webkit-transition: 0.6s;
  color: #fff;
  right: 0;
  overflow: hidden;
}

#mobnav {
  position: relative;
  top: 0;
  width: 100%;
  text-align: left;
  padding-left: 20px;
}

#mobnav a {
  display: block;
  width: 100%;
  padding: 1em 0.5em 1em 0.5em;
  text-align: left;
  color: #fff;
  font-weight: 500;
  transition: 0.3s;
}

#desktopnav {
  width: 100%;
  float: right;
  margin-top: 25px;
}

/* Close button for mobile nav */
#mobnav a.closebtn {
  position: absolute;
  top: 0;
  left: 85%;
  font-size: 2.8rem;
  padding: 0;
  margin: 0 5px;
}

/* Overlay click to close */
#overlayclicktoclose {
  display: none;
  background: rgba(0, 0, 0, 0.4);
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 5;
}

#slidenav {
  overflow-y: scroll;
}

/* Hide the mobile nav toggle icon */
nav a.icon {
  display: none;
  font-size: 1.2rem;
}

nav a:visited {
  color: #000;
}

/* Header */
header.header {
  background: #000;
  color: #000;
  text-align: center;
  height: 80vh;
  background-image: url("./images/hero.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  position: relative;
}

header.header::after {
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.2);
  position: absolute;
  content: "";
  z-index: 3;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.herobtn {
  font-family: "Roboto", sans-serif;
  width: 200px;
  height: auto;
  font-size: 1rem;
  font-weight: 600;
  padding: 15px 20px;
  background: #021689;
  color: #fff;
  text-align: center;
  display: block;
  margin: 5px auto 0;
  position: relative;
  z-index: 4;
}

header.slideshow {
  width: 100%;
  max-height: 450px;
  position: relative;
  overflow: hidden;
}

.slideshow-content {
  font-size: 2rem;
  color: #fff;
  text-align: center;
  font-family: "Roboto", sans-serif;
}

/* Banner */
.banner {
  width: 100%;
  height: auto;
  margin: 10px 0 30px;
}

/* Banner image */
.banner img {
  width: 100%;
}

/* Breadcrumb */
.breadcrumb {
  /* remove height/bg if no image
  * height: 90px;
  * background-image: url(""); 
  * background-size: cover;
  * background-position: center center;
  * background-repeat: no-repeat; */
  background: #e3e5f2;
  height: auto;
  padding: 1em 11%;
  font-size: 1.2rem;
  font-weight: 600;
  font-family: "Roboto", sans-serif;
}

/* Featured Image */
.featured-image {
  background: #fff;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  padding: 1em 11%;
  font-weight: 600;
  font-family: "Roboto", sans-serif;
  height: 220px;
  font-size: 2rem;
  text-align: center;
  color: #fff;
}

.featured-image > div {
  display: flex;
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
}

/* Main content */
main {
  padding: 2% 11% 5% 11%;
  min-height: 60vh;
  overflow: hidden;
}

main ul, main ol {
  margin-bottom: 1em;
  padding-left: 18px;
}

main ul li, main ol li {
  font-size: 1.1rem;
  line-height: 1.7;
  font-family: "Roboto", sans-serif;
  color: #545454;
}

/* Custom bullet point image */
/* main ul { */
/* position: relative; */
/* list-style: none; */
/* } */
/* main ul li::before { */
/* width: 9.5px; */
/* height: 9.5px; */
/* content: ""; */
/* background-image: url("./images/bullet.png"); */
/* background-repeat: no-repeat; */
/* background-size: 9.5px; */
/* margin-right: 5px; */
/* background-position: left; */
/* display: inline-block; */
/*Prevent text wrapping under bullet*/
/* position: absolute; */
/* left: -14px; */
/* top: 7px; */
/* } */
main a {
  text-decoration: underline;
}

/* Column container */
.row {
  display: flex;
  flex-wrap: wrap;
}

/* Left column */
.leftcolumn {
  flex: 60%;
  background-color: #fff;
  padding: 10px 10px 10px 0;
}

/* Right column */
.rightcolumn {
  flex: 40%;
  background-color: #fff;
  padding: 10px 0px 10px 0;
}

/* Services Columns */
.service-container {
  display: flex;
  justify-content: space-between;
}

.service-item {
  width: 33.3%;
  font-size: 0.9rem;
  margin-right: 5%;
  margin-bottom: 40px;
  text-align: center;
  display: flex;
  flex-direction: column;
}

.service-item:last-child {
  margin-right: 0;
}

.service-item img {
  max-width: 100%;
  width: 100%;
  max-height: 250px;
  -o-object-fit: cover;
     object-fit: cover;
}

.service-title {
  font-size: 1.1rem;
  font-weight: 500;
  margin-bottom: 5px;
  margin-top: 10px;
}

.service-desc {
  font-size: 0.9rem;
  line-height: 1.7;
  margin-top: 10px;
  margin-bottom: 20px;
  color: #545454;
}

.service-button {
  font-family: "Roboto", sans-serif;
  width: 40%;
  font-size: 0.9rem;
  font-weight: 600;
  padding: 4% 10px;
  background: #ccc;
  text-align: center;
  display: inline-block;
  margin-top: auto;
  margin-left: auto;
  margin-right: auto;
}

/* Front section text and image wrap */
.frontsection-textimage {
  width: 100%;
  display: flex;
}

.frontsection-textimage img {
  float: right;
  max-width: 100%;
  width: 35%;
  margin-left: 20px;
}

/* Footer */
.footer {
  background: #021689;
  padding: 2% 11% 1%;
  margin-top: 20px;
}

#footerlogotext {
  font-size: 1.3rem;
  font-weight: 600;
}

.copyrightfooter {
  background: #021689;
  padding: 15px 11%;
  border-top: 1px solid #dbdbdb;
}

/* Footer logo */
.footer img {
  max-width: 150px;
}

/* Footer links */
footer a, footer a:hover, footer a:visited, footer a:active {
  color: #dbdbdb;
}

footer ul {
  list-style: none;
  padding: 0;
}

footer ul li a {
  color: #dbdbdb;
  font-size: 0.95rem;
}

/* Footer icon */
img#instaicon {
  margin-right: 10px;
}

/* Footer columns */
.footcol1 p, .footcol2 p, .footcol3 p, .footcol1 ul li, .footcol2 ul li, .footcol3 ul li {
  line-height: 1.7;
}

.footcol1 {
  flex: 20%;
  padding: 10px 10px 40px 0;
  color: #fff;
  font-family: "Roboto", sans-serif;
  font-size: 0.95rem;
}

.footcol1 p {
  text-align: left;
}

.socialicons {
  margin-top: 20px;
}

.footcol2 {
  display: flex;
  flex: 20%;
  flex-direction: column;
  padding: 10px 10px 40px 10px;
  color: #fff;
  font-family: "Roboto", sans-serif;
  font-size: 0.95rem;
}

.footmenu {
  display: flex;
  flex: 30%;
  flex-direction: column;
  align-self: center;
  align-items: flex-start;
}

.footcol3 {
  display: flex;
  flex: 20%;
  flex-direction: column;
  padding: 10px 10px 40px 10px;
  color: #fff;
  font-family: "Roboto", sans-serif;
  font-size: 0.95rem;
}

/* Footer paragraph font */
footer p {
  font-size: 0.95rem;
  color: #dbdbdb;
}

.copyright {
  text-align: center;
  font-size: 0.8rem;
}

.sitecredit a:hover {
  color: #dbdbdb;
}

/* Footer Headings */
.footerheading {
  font-size: 1.1rem;
  font-weight: 600;
  color: #fff;
  padding-bottom: 15px;
}

/* Flex 100% */
.flex100 {
  flex-basis: 100%;
}

/* Bullet Points */
ul li {
  font-size: 1.1rem;
  line-height: 1.7;
  color: #545454;
}

/* Sidebar */
.sidebar {
  width: 20%;
  float: right;
}

.sidebar#sidebar-primary {
  width: auto;
}

/* Blog content */
.content {
  width: 70%;
  float: left;
}

.blog-image-thumb img {
  max-width: 100%;
  height: auto;
}

.comments-area ol {
  list-style-type: none;
}

.comment-meta.commentmetadata a {
  font-size: 0.7rem;
}

/* Contact form */
.wpcf7 {
  width: 100%;
}

.wpcf7-text, .wpcf7-textarea {
  width: 80%;
  padding: 0.5em;
  width: 100%;
  border: 1px solid #ccc;
  font-family: "Roboto", sans-serif;
  font-size: 1.1rem;
}

.wpcf7-textarea {
  height: 120px;
}

.wpcf7 input:focus-visible, textarea:focus-visible, select:focus-visible {
  outline: none;
}

.wpcf7-submit {
  font-size: 1rem;
  background: #000;
  color: #fff;
  padding: 0.7em 1.5em;
  border: none;
  font-family: "Roboto", sans-serif;
  cursor: pointer;
  margin-top: 10px;
}

.wpcf7-response-output {
  color: #000;
  font-family: "Roboto", sans-serif;
}

/* Gallery Padding */
.wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image) {
  padding-right: 15px;
  padding-bottom: 15px;
}

.wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image):nth-child(3n) {
  padding-right: 0;
}

/* Captions */
figcaption.wp-element-caption {
  position: relative !important;
  background: transparent !important;
  color: #545454 !important;
}

.wp-block-gallery.has-nested-images figcaption {
  flex-basis: auto;
  flex-grow: 0;
}

.wp-block-gallery.has-nested-images figure.wp-block-image {
  flex-grow: 0;
}

/* Styling block button with custom icon next to text */
.callusbtn {
  font-family: "Roboto", sans-serif;
  font-size: 1.2rem;
  margin: 10px 0;
}

.callusbtn a.wp-block-button {
  padding: 15px;
}

.callusbtn .wp-block-button a::before {
  content: "";
  display: inline-block;
  position: relative;
  background-image: url("./images/phoneicon.png");
  background-size: 20px;
  background-position: center center;
  background-repeat: no-repeat;
  padding: 10px 10px;
  margin-right: 4px;
  vertical-align: middle;
}

.wp-block-buttons.callusbtn .wp-block-button.wp-block-button__width-100 {
  width: 80% !important;
  flex-basis: 80% !important;
}

/* Align buttons to bottom */
.wp-block-columns.align-btns-bottom .wp-block-column {
  display: flex;
  flex-direction: column;
}

.wp-block-columns.align-btns-bottom .wp-block-column > .wp-block-buttons {
  margin-top: auto;
}

/* Media Queries */
@media (max-width: 750px) {
  .row {
    flex-direction: column;
  }
  nav.nav a {
    padding: 0.5em 1em 0.5em 1em;
  }
  nav.nav {
    background: #021689;
    position: relative;
    padding-top: 6px;
    padding-bottom: 6px;
  }
  nav.nav ul {
    text-align: left !important;
  }
  .logo {
    width: 100%;
    float: none;
    display: block;
    text-align: center;
    padding-bottom: 5px;
  }
  .logo p {
    text-align: center;
  }
  h1#banner {
    font-size: 1.7rem;
    padding: 10% 3%;
  }
  nav.nav #navlinks {
    display: none;
  }
  nav #desktopnav {
    display: none;
  }
  #mobnav a {
    display: block;
  }
  nav li {
    width: 100%;
  }
  nav.nav li, nav.nav ul {
    float: none;
  }
  nav.nav li {
    display: block;
    float: none;
  }
  nav.nav a {
    float: right;
  }
  nav.nav a.icon:hover {
    color: #000;
  }
  .navouter {
    padding: 0.5em 0 0;
  }
  nav.nav a.icon {
    display: block;
  }
  nav a.icon {
    display: block;
  }
  #mobilenav a {
    padding: 0.5em 1em 0.5em 1em;
  }
  /* So sub-menu nav items don't overlap */
  nav ul li:hover ul.sub-menu {
    position: relative;
  }
  main {
    padding: 2% 11% 5% 11%;
  }
  .service-container {
    flex-wrap: nowrap;
    flex-direction: column;
  }
  .service-item {
    width: 100%;
    margin-bottom: 40px;
    margin-right: 0;
  }
  .frontsection-textimage img {
    width: 100%;
    margin-left: 0;
    margin-bottom: 10px;
  }
  .content, .sidebar {
    width: 100%;
    float: none;
  }
  img.alignright, img.alignleft {
    float: none;
    display: block;
    margin: auto auto 1em;
  }
  .footmenu {
    align-items: flex-start;
    align-content: flex-start;
    align-self: flex-start;
  }
  .footcol3contact {
    align-self: flex-start;
  }
  .footcol1, .footcol2, .footcol3 {
    padding: 10px 0px 40px 0px;
  }
  .topbar {
    padding: 10px 9%;
  }
  .navouter {
    padding: 0 9%;
  }
  main {
    padding: 2% 9% 5% 9%;
  }
  .breadcrumb {
    padding: 1em 9%;
  }
  .footer {
    padding: 30px 9% 30px;
  }
  .copyrightfooter {
    padding: 15px 9%;
  }
}
@media (max-width: 600px) {
  /* Gallery Padding */
  .wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image) {
    padding-right: 0;
    padding-bottom: 15px;
    width: 100%;
  }
  .wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image):nth-child(3n) {
    padding-right: 0;
  }
}
@media (min-width: 750px) {
  .navouter {
    overflow: auto;
  }
}
@media (min-width: 751px) {
  /* border on nav hover  */
  nav.nav a, nav a {
    border-bottom: 3px solid transparent;
    display: inline-block;
  }
  nav.nav a:hover, nav a:hover, nav.nav a:visited:hover, nav a:visited:hover {
    border-bottom: 3px solid #343434;
  }
  nav ul.sub-menu li a {
    border-bottom: 3px solid transparent;
  }
  nav ul li:hover ul.sub-menu a {
    border-bottom: 3px solid transparent;
  }
  /* Remove border on hover for parent with child menu items */
  nav li.menu-item-has-children a:hover {
    border-bottom: 3px solid transparent;
  }
  span.dropdownarrow {
    /*display: none;*/
  }
  .navouter::after {
    clear: both;
    content: "";
  }
  nav.nav ul.sub-menu {
    width: auto !important;
  }
  nav ul.sub-menu {
    width: auto;
  }
  #mobilenav, #slidenav {
    display: none !important;
  }
  /* Add arrow to menu items with sub menu */
  span.dropdownarrow::after {
    margin-left: -8px;
    margin-right: 0.7em;
  }
  ul.sub-menu {
    position: absolute;
    width: auto;
  }
}
@media (min-width: 751px) and (max-width: 1000px) {
  .logo {
    width: 100%;
    float: none;
    display: block;
    text-align: center;
  }
  #desktopnav {
    margin-top: 10px;
  }
  #navlinks {
    float: none;
    display: block;
  }
  nav.nav ul, nav ul {
    float: none;
    text-align: center;
  }
  nav.nav li, nav li {
    float: none !important;
    display: inline-block;
  }
  .footcol3 {
    padding-left: 0 !important;
  }
  .footcol3contact {
    align-self: flex-start;
  }
}
@media (min-width: 1000px) {
  nav ul {
    float: right;
    margin-top: 10px;
  }
  .logo {
    padding-top: 0.8em;
  }
}
@media (min-width: 1200px) {
  .rightcolumn {
    text-align: right;
  }
}
@media (max-width: 1000px) {
  .service-button {
    width: 80%;
  }
}/*# sourceMappingURL=style.css.map */