﻿/* Custom Styles */

/* @import url('https://fonts.googleapis.com/css?family=Nunito&display=swap'); */

body{
	font-family: 'Nunito', sans-serif;
}

.spacer-top{
	padding-top: 15px;
}

.spacer-bottom{
	padding-bottom: 15px;
}

.spacer-right{
	padding-right: 15px;
}

.spacer-left{
	padding-left: 15px;
}

.line-spacer{
	line-height: 2.7;
}

.footer{
	color: gray;
	font-size: 90%;
	padding-bottom: 20px;
}

.text-red{
	color: red;
}
body {
  margin: 0;
  padding: 0;
  height: 100%;
}
#login .container #login-row #login-column #login-box {
    max-width: 350px;
    border-radius: 15px;
    height: 550px;
    width: 100%;
    background-color: #005757;
    padding: 45px;
}


#login .container #login-row #login-column #login-box #login-form {
  padding: 20px;
  background-color:Olive;
}
#login .container #login-row #login-column #login-box #login-form #register-link {
  margin-top: -85px;
}

#BreedHover , #SourceHover ,#SpeciesHover ,#StatusHover
{
    position:relative;
    margin:15px 0 -5px 0;
    background:#e74c3c;
    color:#fceae8;
    font-size:15px;
    padding:5px;
    border-radius:5px;
    text-align:center;
    display:none;
    
}


#BreedHover:before,#SourceHover:before,#SpeciesHover:before,#StatusHover:before
{  
    position:absolute;
    content:'';
    height:15px;
    width:15px;
    background:#e74c3c;
    right:20px;
    top:-7px;
    transform:rotate(45deg);
}
#SemenStationNameHover, #BullNoHover, #EarTagNoHover, #HoverDateOfBirth, #HoverBullsINAPHTagNo, #HoverSireId, #HoverDamId, #HoverSiresSireId, #HoverDamsSireId, #HoverBestLocationYield, #HoverFat, #HoverLactaionNo, #DateOfFirstCollectionDate, #CumulativeProduction, #HoverSelectStatus, #SpeciesHover, #HoverStatus, #BreedHover, #SourceHover, #HoverTotalStraws, #HoverDiscardedStraws, #EMailHover, #MobileHover, #AgencyHover {
    position: relative;
    margin: 15px 0 -5px 0;
    background: #e74c3c;
    color: #fceae8;
    font-size: 15px;
    padding: 5px;
    border-radius: 5px;
    text-align: center;
    display: none;
}

    #SemenStationNameHover:before, #BullNoHover:before, #EarTagNoHover:before, #HoverDateOfBirth:before, #HoverBullsINAPHTagNo:before, #HoverSireId:before, #HoverDamId:before, #HoverSiresSireId:before, #HoverDamsSireId:before, #HoverBestLocationYield:before, #HoverFat:before, #HoverLactaionNo:before, #DateOfFirstCollectionDate:before, #CumulativeProduction:before, #HoverSelectStatus:before, #SpeciesHover:before, #HoverStatus:before, #BreedHover:before, #SourceHover:before, #HoverTotalStraws:before, #HoverDiscardedStraws:before, #EMailHover:before, #MobileHover:before, #AgencyHover:before {
        position: absolute;
        content: '';
        height: 15px;
        width: 15px;
        background: #e74c3c;
        right: 20px;
        top: -7px;
        transform: rotate(45deg);
    }

.Mandatory:after
{
    content:" *";
    color: red;
}

.ToolTip
 {
  position: relative;
  display: block;
 }

.ToolTip .tooltiptext  {
  visibility: hidden;
  width: 220px;
  background-color:#e74c3c;
  color: #fceae8;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;
  position: absolute;
  z-index: 1;
  bottom: 150%;
  left: 50%;
  margin-left: -105px;
}

.ToolTip .tooltiptext::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: orange transparent transparent transparent;
}

.ToolTip:hover .tooltiptext {
  visibility: visible;
}
input[type=text]:focus + .tooltiptext{
  visibility: hidden;
}



.navbar-nav li:hover > ul.dropdown-menu {
    display:block;     
}

#navbarContent  ul li a
{
    color:white;   
}

.navbar-nav a:hover
{
     
    background-color:coral;
    border-radius:0.5rem;
}


.navbar-nav ul
{
    background-color:#008080;
}

.dropdown-submenu {
    position:relative;
}
.dropdown-submenu>.dropdown-menu {
    top:0;
    left:100%;
    margin-top:-6px;     
}


.dsh-con{
         padding:20px;
         margin:10px;
         border-radius: 15px;   
         margin-left:1px; 
        
         } 

.first-dash{
    color:white;
    top: 0px;
    left: 0px;
}
 

.SampleImage
{
    height:50px;
    width:50px;
   
}
.Day-DashBoard
{
    height:590px;
    background-color:#E0FFFF;
    border-radius:15px;
    margin:10px;  
}

.Day-DashBoard-State
{
    height:480px;
    background-color:#E0FFFF;
    border-radius:15px;
    margin:10px;  
}


.AddMember, .UpdateRenewValidty, .RenewValidity, .ChageStatus, .UpdateMembers {
    height: 80px;
}
.MastersCount
{
    height:60px;
}
.Daily-Dash
{
    color:Black;
}

.AddMemberIcon, .MembersUpdate, .UpdateIcon
{
    font-size:3em;
}

#headerDiv {
    height: 30px;
}
#footerDiv {
    height: 30px;
}
#load {
    width: 100%;
    height: 70%;
    position: fixed;
    z-index: 9999;
    background: url("Spinner.gif") no-repeat center rgba(255,255,255,255)
}
#DivContact {
    border-width: 2px;
    border-style: solid;
    border-color: blue;
}




/* =========================================================
   DBIM v3 TYPE SCALE COMPLIANCE (Standards 4.3.1 & 4.3.2)
   Desktop: H1=36px, H2=24px, H3=20px, Body P=16px/14px
   Mobile (<=768px): H1=24px, H2=20px, H3=16px, Body P=14px/12px
   ========================================================= */

:root {
    --dbim-h1-font-size: 1.25rem; /* 36px */
    --dbim-h2-font-size: 1.5rem; /* 24px */
    --dbim-h3-font-size: 1.25rem; /* 20px */
    --dbim-p-font-size: 1rem; /* 16px */
    --dbim-line-height: 1.5;
}

/* Global Heading & Body Overrides for Desktop */
h1, .h1 {
    font-size: var(--dbim-h1-font-size) !important;
    line-height: 1.3 !important;
}

h2, .h2 {
    font-size: var(--dbim-h2-font-size) !important;
    line-height: 1.35 !important;
}

h3, .h3 {
    font-size: var(--dbim-h3-font-size) !important;
    line-height: 1.4 !important;
}

p, body, .p {
    font-size: var(--dbim-p-font-size);
    line-height: var(--dbim-line-height);
}

/* Mobile Type Scale Adjustment (<= 768px) */
@media (max-width: 768px) {
    :root {
        --dbim-h1-font-size: 1.5rem; /* 24px */
        --dbim-h2-font-size: 1.25rem; /* 20px */
        --dbim-h3-font-size: 1rem; /* 16px */
        --dbim-p-font-size: 0.875rem; /* 14px */
    }

    h1, .h1 {
        font-size: var(--dbim-h1-font-size) !important;
    }

    h2, .h2 {
        font-size: var(--dbim-h2-font-size) !important;
    }

    h3, .h3 {
        font-size: var(--dbim-h3-font-size) !important;
    }

    p, body, .p {
        font-size: var(--dbim-p-font-size);
    }
}

/* Micro-screens Adjustment (<= 320px) */
@media (max-width: 320px) {
    :root {
        --dbim-p-font-size: 0.75rem; /* 12px */
    }
}
