/*
Theme Name: OBX Painters
Theme URI: https://vicodemedia.com
Author: Vicode Media
Author URI: https://vicodemedia.com
Description: OBX Painters Wordpress Theme
Version: 2024
*/

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}html{scroll-behavior:smooth}
body{line-height:1;
    font-family: 'Poppins';
}
* { margin:0; padding:0; }
a{text-decoration-skip-ink:auto}a[href^="tel"]{color:inherit;text-decoration:none}button{outline:0}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}q{display:inline;font-style:italic}q:before{content:'"';font-style:normal}q:after{content:'"';font-style:normal}textarea,input[type="text"],input[type="button"],input[type="submit"],input[type="reset"],input[type="search"],input[type="password"]{-webkit-appearance:none;appearance:none;border-radius:0}input[type="search"]{-webkit-appearance:textfield}table{border-collapse:collapse;border-spacing:0}th,td{padding:2px}big{font-size:120%}small,sup,sub{font-size:80%}sup{vertical-align:super}sub{vertical-align:sub}dd{margin-left:20px}kbd,tt{font-family:courier;font-size:12px}ins{text-decoration:underline}del,strike,s{text-decoration:line-through}dt{font-weight:bold}address,cite,var{font-style:italic}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
.sticky{}.bypostauthor{}.wp-caption{}.wp-caption-text{}.gallery-caption{}.alignright{}.alignleft{}.aligncenter{}
.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute!important;width:1px;word-wrap:normal!important;word-break:normal}
.screen-reader-text:focus{background-color:#f7f7f7;border-radius:3px;box-shadow:0 0 2px 2px rgba(0,0,0,.6);clip:auto!important;-webkit-clip-path:none;clip-path:none;color:#007acc;display:block;font-size:14px;font-size:.875rem;font-weight:700;height:auto;right:5px;line-height:normal;padding:15px 23px 14px;text-decoration:none;top:5px;width:auto;z-index:100000}
.skip-link{left:-9999rem;top:2.5rem;z-index:999999999;text-decoration:underline}
.skip-link:focus{display:block;left:6px;top:7px;font-size:14px;font-weight:600;text-decoration:none;line-height:normal;padding:15px 23px 14px;z-index:100000;right:auto}
.visually-hidden:not(:focus):not(:active), .form-allowed-tags:not(:focus):not(:active){position:absolute !important;height:1px;width:1px;overflow:hidden;clip:rect(1px 1px 1px 1px);clip:rect(1px, 1px, 1px, 1px);white-space:nowrap}
p{
    font-size: 16px;
    color: #000;
    line-height: 1.4;
    margin-bottom: 20px;
}
strong{
    font-family: ExtraBoldPoppins;
}
h3{
    color: #c21919;
    font-family: ExtraBoldPoppins;
    font-size: 30px;
    margin-bottom: 20px;
    line-height: 1.2;
}
ol, ul {
    margin: 0 0 1.5em 3em;
}
ul {
    line-height: 1.4;
    list-style: disc;
}
@font-face {
    font-family: Poppins;
    src: url(fonts/Poppins/Poppins-Regular.ttf);
}
@font-face {
    font-family: BoldPoppins;
    src: url(fonts/Poppins/Poppins-Medium.ttf);
}
@font-face {
    font-family: ExtraBoldPoppins;
    src: url(fonts/Poppins/Poppins-ExtraBold.ttf);
}
.content{
    max-width: 1200px;
    margin:0 auto;
}
.main-content{
    max-width: 1200px;
    display:flex;
    margin:0 auto;
    width:100%;
    align-items: center;
}
#site-description{
    margin-top:20px;
}
.site-contact{
    padding: 0 10px 0 0;
    display:flex;
    width:65%;
    justify-content: right;
    align-items: center;
}
#site-logo{
    width:35%;
}
#site-logo img{
    width:100%;
    max-width: 210px;
}

#site-description p{
    font-family: 'BoldPoppins';
    font-size: 18px;
}
#contact-btns{
    margin-left:auto;
}
.phone{
    background-image: linear-gradient(180deg, #ff4b4b 0%, #a90404 100%);
}
.phone:hover{
    background-image: linear-gradient(180deg, #a90404 0%, #a90404 100%);
}
.phone,
.quote{
    font-family: BoldPoppins;
    text-decoration: none;
    color: #fff!important;
    padding: 15px 30px 15px;
    border: 2px solid #fff;
    box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
}
.quote{
    background-image: linear-gradient(180deg, #8a8a8a 0%, #373737 100%);
}
.quote:hover{
    background-image: linear-gradient(180deg, #373737 0%, #373737 100%);
}

#menu{
    background-image: linear-gradient(180deg, #4a4a4a 0%, #000000 100%);
}

#menu ul{
    list-style: none;
    margin: 0 auto;
    width:100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    max-width: 1200px;
}
#menu ul li{
    width: 100%;
    text-align: center;
}
#menu ul li a:hover{
    color: #fc4949;
}
#menu ul li a{
    padding: 15px 0;
    display: block;
    color: #fff;
    text-decoration: none;
}

.page-content{
    max-width: 500px;
    display: table;
    margin: 0 auto;
    width: 100%;
}

.mainLine{
    margin-bottom:30px;
    -webkit-text-stroke: 1px white;
    font-size: 55px;
    font-family: ExtraBoldPoppins;
    
}
.secondLine{
    font-size: 35px;
    font-family: ExtraBoldPoppins;
}

.genericBlock{
    padding: 70px 10px;
}

.effect{
    background:#fff;
    padding: 10px;
    box-shadow: 5px 5px 10px 0px rgba(162.75000000000003, 162.75000000000003, 162.75000000000003, 0.5);
}
.section-overlay .bottom-side{
    width: 100%;
    margin-top: -70px;
    margin-bottom: -5px;
    background:#fff6f6;
    position: relative;
}
.top-section-overlay .top-side{
    margin-top: -200px;
    width: 100%;
    margin-bottom: -60px;
    position: relative;
    z-index: 99;
}

.call-to-action-btns{
    text-align: right;
}
.call-to-action-btns .phone,
.call-to-action-btns .quote{
    display: inline-block;
}

#footer{
    background: #222;
    padding: 50px 10px;
}
#footer h4{
    font-family: ExtraBoldPoppins;
    font-size: 18px;
    margin-bottom: 15px;
}
#footer p,
#footer h4{
    color:#fff!important;
}
#copyright{
    border-top: 1px solid #fff;
    color: #fff;
    text-align: center;
    padding-top: 20px;
    margin-top: 20px;
}
#copyright a{
    color:#fff;
    
}

.service img{
    width: 100%;
    max-width: 250px;
    border-radius: 50%;
    padding: 10px;
    background-color: #fff;
    margin: 0 auto;
    display: block;
    box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
}
.mobile-btns{
    display:none;
}

.contact-content{
    width: 100%;
    max-width: 700px;
    display: table;
    margin: 0 auto;
    color:#fff;
}

.uneditable-input, input[type=color], input[type=date], input[type=datetime-local], input[type=datetime], input[type=email], input[type=month], input[type=number], input[type=password], input[type=search], input[type=tel], input[type=text], input[type=time], input[type=url], input[type=week], select, textarea {
    font-family: inherit;
    -webkit-transition: border linear .2s,box-shadow linear .2s;
    -moz-transition: border linear .2s,box-shadow linear .2s;
    -o-transition: border linear .2s,box-shadow linear .2s;
    transition: border linear .2s,box-shadow linear .2s;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 0;
    vertical-align: middle;
    width: 100%;
    color: #5d6576;
    padding: 9px 15px;
    font-weight: 400;
    background-color: #fff;
    text-transform: inherit;
    border: 1px solid #dedede;
    font-size: 15px;
    outline: 0;
    line-height: inherit;
}


/* RESPONSIVE NAVBAR MENU STARTS */

/* CHECKBOX HACK */

.navbar input[type=checkbox] {
    display: none;
  } 
  
  /* HAMBURGER MENU */
  .hamburger {
    display: none;
    font-size: 24px;
    user-select: none;
  }
  .nav-links{
    line-height: 0;
    list-style: none;
    padding: 0;
    margin: 0;
    width: 100%;
    text-align: right;
  }
  .navbar {
    display: none;
    width: 100%;
    background-image: linear-gradient(180deg, #4a4a4a 0%, #000000 100%);
    color: #fff;
    padding: 15px;
}
.mobile-menu ul{
    margin: 0;
    list-style: none;
    text-align: left;
}
.mobile-menu ul li a{
    text-decoration: none;
    color: #fff;
    padding: 10px 15px;
    width: 100%;
    display: table;
    border-top: 1px solid #fff;
}
  /* APPLYING MEDIA QUERIES */
  @media (max-width: 768px) {
    button, input[type=button], input[type=reset], input[type=submit]{
        width:100%;
    }
    .navbar{
        display: inline-flex;
    }
    #menu{
        display:none;
    }
   .mobile-menu {
    display:none;
      position: absolute;
      background-color:#222222;
      right: 0;
      left: 0;
      text-align: center;
      z-index:99;
      margin-top: 26px;
    }
  
    .mobile-menu li a:hover {
      background-color:#000;
    }
  
    /* .mobile-menu li + li {
      margin-top: 12px;
    } */
  
    .navbar input[type=checkbox]:checked ~ .mobile-menu {
      display: block;
    }
  
    .hamburger {
      display: block;
      font-size: 30px;
    padding-top: 5px;
    }
  }

@media (max-width: 1160px) {
    #site-description{
        display: none;
    }
    .top-section-overlay{
        margin-top: -30px;
    }
    h3{
        font-size: 25px;
    }
    .section-overlay .bottom-side{
        margin-top: -40px;
    }
    .top-section-overlay {
        margin-top: -50px;
    }
    .top-section-overlay .top-side {
        margin-top: 0;
        margin-bottom: -40px;
    }
    
}
@media (max-width: 968px) {
    .call-to-action-btns .phone, .call-to-action-btns .quote {
        padding: 10px;
    }
    .service img{
        max-width:200px;
    }
}

@media (max-width: 781px) {

    .gap-removal{
        gap: 0;
    }
    .mobile-call-to-action h3{
        text-align: center;
    }
    .call-to-action-btns {
        text-align: center;
        margin-top: -30px!important;
    }
    .section-overlay .bottom-side{
        margin-top: -20px!important;
    }
    .top-section-overlay .top-side {
        margin-bottom: -20px!important;
    }
    .mainLine{
        font-size: 35px;
    }
    .secondLine {
        font-size: 20px;
        line-height: 1.3;
    }
    .main-content{
        display: table;
    }
    .phone, .quote{
        font-size: 13px;
        padding: 10px;
    }
    #site-logo {
        width: 100%;
        max-width: 200px;
        display: table;
        margin: 0 auto;
    }
    .site-contact{
        display:none;
    }
    .mobile-btns{
        display:block;
        background: #da2d2d;
        padding: 20px;
        box-sizing: border-box;
        text-align: center;
    }
    .page-content{
        text-align: center;
    }
}

@media (max-width: 450px) {
    .action-call{
        padding: 20px 0 40px;
    }
    .mainLine {
        font-size: 30px;
    }
}


@media (max-width: 414px) {
    .section-overlay .bottom-side {
        margin-top: -9px;
    }
}
@media (max-width: 361px) {
    .phone, .quote{
        font-size: 11px;
    }
}