@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700&display=swap');

/*
 font-family: 'Lato', sans-serif;
* { background-color: rgba(255,0,0,.2); }
* * { background-color: rgba(0,255,0,.2); }
* * * { background-color: rgba(0,0,255,.2); }
* * * * { background-color: rgba(255,0,255,.2); }
* * * * * { background-color: rgba(0,255,255,.2); }
* * * * * * { background-color: rgba(255,255,0,.2); }
* * * * * * * { background-color: rgba(255,0,0,.2); }
* * * * * * * * { background-color: rgba(0,255,0,.2); }
* * * * * * * * * { background-color: rgba(0,0,255,.2); }
  */

/* Global
================================================================*/
html, body{
	margin: 0;
	padding: 0;
	height: 100%;
    
}
 
body {
    background-color:#F5F5F5!important;
    margin: 0;
    padding: 0;
}
body, p {
    font-family: 'Lato', sans-serif;
    font-size: 16px;
    font-weight: 300!important;
    line-height: 140%;
    color: #2a2a2a;
    letter-spacing: .02em;
}
   
           
/* Spacing
-----------------------------------------*/
.no-gutter [class*='col-'] {
    padding-right:0;
    padding-left:0;
}

.sm-gutter [class*='col-'] {
    padding-right: 4px;
    padding-left: 4px; 
}

/* Fonts
-----------------------------------------*/

.font10 { font-size: 11px; line-height: 110%!important}
.font11 { font-size: 11px; line-height: 110%!important}
.font12 { font-size: 12px; line-height: 130%!important}
.font14 { font-size: 14px; line-height: 130%!important}
.font18 { font-size: 18px; line-height: 130%!important}
.font20 { font-size: 20px; line-height: 130%!important}
.font24 { font-size: 24px; line-height: 140%!important}
.font32 { font-size: 32px; line-height: 100%!important}
 
.lh-1 {line-height: 1}
.lh-2 {line-height: 2}

         @media screen and (max-width: 767px){ 
                h1 { font-size: 30px}
            }

/* Links
-----------------------------------------*/
a,
a:hover,
a:focus,
a:visited {
	color: #3f9dd2!important;
	text-decoration: none;
} 
a:focus {border:none}
a.focus {outline:0!important;} 

.no-color { color: #2a2a2a!important}
.red {color: #EB5463 }

b, strong { font-weight: 900!important}


/* Images
-----------------------------------------*/
.image-crop {
	position: relative;
	width: auto;
	padding-bottom: 60%;
 	margin: 0 0 4px;
    overflow: hidden;
}

.image-crop img {
	height: 100%;
  	object-fit: cover;
  	position: absolute;
  	width: 100%; 
}
 
.img-full {
    width: 100%;
    height: auto;
}
/* Buttons
-----------------------------------------*/
.btn{
	border: none;
    border-radius: 0!important;
    font-weight: 600;
    letter-spacing: .04em;
    padding: 20px 30px!important;
    line-height: 100%;
 }

.btn-main,
.btn-main:visited{
    background-color: #EB5463!important;
    color: #fff!important;
    box-shadow:0;
    font-size: 20px
}
.btn-main:hover {
    background: #fff;
    background: #000;
    cursor: pointer
}
.btn-black {
    background: #fff;
    border: 1px solid #a7323d;
    color: #000!important;
}
.btn-black:hover {
    background: #a7323d;
    border: 1px solid #a7323d;
    color: #fff!important;
} 

.btn-small {
    padding: 5px 15px!important;
}

.copy-link {
    border: none;
    background: #F3D8DB;
    text-align: center;
    padding: 5px;
    font-size: 1rem;
}
 
 
 
 
/* Forms
-----------------------------------------*/
label {
    font-size: 14px; 
    font-weight: 700;
    margin:0;
    line-height: 110%;
}

select { -webkit-border-radius: 0px; }

.bootstrap-select .btn:hover { color: #495057}

.form-control {
	border-radius: 0!important;
	height: 44px!important;
	margin: 0 0 15px; 
    font-size: 14px;
    border:1px solid #eaeaea;
}

.form-control-sm,
.input-group-sm{
    height: 32px!important;
    font-size: 12px;
    border-radius: 0;
}

.input-group-text { border-radius: 0 }
input[type=checkbox],
input[type=radio]{
    margin: 0 auto;
    height: 20px!important;
    width: 20px;
    border-radius: 0;
    margin-left:-15px
}

table input[type=checkbox],
table input[type=radio]{
	margin: 0 auto;
}

textarea.form-control {min-height: 200px!important}

/* Header
================================================================*/
header {
    position: fixed;
    top: 0;
    max-width: 100%;
    z-index: 800;
    right: 0;
    left: 0;
    background: #fff
}

header img { 
    width: 180px; 
    height: auto 
}

header a,
header a:visited,
header a:hover { 
    color: #2d2d2d!important; 
    text-decoration: none;
    font-size: 14px;
    font-weight: 400
} 
 
footer {
    border-bottom:1px dotted #ccc;
}

#ContactForm {
    max-width: 800px;
}


        @media screen and (max-width: 992px){ 
            #ContactForm {
                padding: 20px!important;
                width: 100%
            }
        }

        @media screen and (max-width: 767px){ 
        .herdlogix .col-md-4 {
            text-align: center;
            height: 400px;
            overflow: hidden;
            margin-bottom:20px;
            }
        }

.home-banner {
    position: relative;
    padding: 0 ;
    margin: 0;
}

.home-banner:after {
    content: "";
    position: absolute;
    display: block;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background:rgba(0, 0, 0, 0.7);
    z-index: 1;
}

.home-overlay{
    display: flex;
    align-items: center;
    position: absolute;
    max-width: 100%;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    text-align: center;
    z-index: 2;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.overlay-content {
    padding: 0 10%;
}


        @media screen and (max-width: 1140px){ 
            .overlay-content {
                padding: 0 20%;
            }
        }
        @media screen and (max-width: 992px){ 
            .home-banner:after {display: none}
            .home-overlay {
                position: relative;
                display: block
            }
            .overlay-content {
                background: #2a2a2a;
                padding: 30px;
            }
            .home-content section {
                border-bottom:1px dotted #ccc;
                padding: 40px 0;
            }
        }