/* privacyPolicy.html's css file -> privacyPolicy.css : CSS for the entire webpage */
/* Icon Source: [The Icons](https://fontawesome.com/v4/icons/) */
body { /* Basic styles for the entire body */
font-family:Arial, sans-serif; /* Set font-family to Arial or fallback to sans-serif */
margin:0; /* Remove default margin */
padding:0; /* Remove default padding */
}
/* -------------------------------------------- Styles for the header section --------------------------------------------*/
header{ /* Styles for the header section */
/*position:fixed;*/ /* Fix the header position */
top:0; /* Position it at the top of the viewport */
/*width: 100%;*/ /* Take the full width of the viewport */
background-color:rgba(234,67,53,1.0); /* Transparent red header background */
color:#fff; /* Set text color to white */
padding:12px; /* Add padding around the header */
text-align:center; /* Center-align text */
left:0; /* Align the left edge to the left side of the viewport */
right:0; /* Align the right edge to the right side of the viewport */
z-index:1000; /* Ensure it stays on top of other content */
}
.spacer{ /* To create red box at background of header */
height:70px; /* Adjust the height according to your header's height */
background-color:rgba(234,67,53,1.0); /* Background color to red */
}
.header-content{ /* Styles for the header content */
display:flex; /* Use flexbox for layout */
justify-content:space-between; /* Distribute content evenly */
align-items:center; /* Center-align vertically */
}
.logo img{ /* Styles for the logo */
max-width:100px; /* Set maximum width for the logo */
height:auto; /* Maintain aspect ratio */
}
.navigation ul{ /* Styles for the navigation links */
list-style:none; /* Remove default list styles */
padding:0; /* Remove default padding */
margin:0; /* Remove default margin */
}
.navigation li{
display:inline; /* Display list items inline */
margin-right:15px; /* Adjust spacing between links */
}
.navigation a{
color:#fff; /* Set link text color to white */
text-decoration:none; /* Remove default underline */
transition:color 0.3s; /* Smooth transition for color change */
font-weight:500; /* Adjust font weight to make text slightly thicker */
}
.navigation a:hover{ /* Change color on hover */
color:yellow; /* Change text color to yellow on hover */
}
/* ------- Drop down style ------- */
.navigation-dropdown{ /* Set the positioning for the navigation dropdown */
position:relative; /* Set the position to relative */
display:inline-block; /* Display as an inline block element */
}
.navigation-dropdown-content{ /* Styles for the dropdown content */
display:none; /* Initially hide the dropdown content */
position:absolute; /* Position the dropdown content */
top:100%; /* Position the dropdown below the list item */
background-color:rgba(234,67,53,1.0); /* Background color for the dropdown */
/*min-width:160px;*/ /* Minimum width of the dropdown */
box-shadow:0px 8px 16px 0px rgba(0,0,0,0.2); /* Apply shadow effect */
z-index:1; /* Set the stacking order */
left:0; /* Align the dropdown with the left edge of the list item */
width:auto; /* Adjust the width to fit the content */
}
.navigation-dropdown:hover .navigation-dropdown-content{ /* Show dropdown content on hover */
display:block; /* Display the dropdown content on hover */
}
.navigation-dropdown-content a{ /* Styles for the links inside the dropdown */
display:inline-block; /* Display dropdown links as block elements in one single line*/
color:white; /* Set text color */
padding:10px 17px; /* top-bottom and left-right -> Add padding */
text-decoration:none; /* Remove default underline */
text-align:center; /* Align text to the left */
width:auto; /* Make links take up full width within the dropdown */
box-sizing:border-box; /* Include padding in the width */
white-space:nowrap; /* Prevent line breaks */
vertical-align:middle; /* Adjusts vertical alignment */
font-family:Arial, sans-serif; /* Set the font family */
}
.navigation-dropdown-content a:hover{ /* Styles for the hover state of dropdown links */
background-color:rgba(234,67,53,1.0); /* Change background color on hover */
}
/* -------------------------------------------------- Policy Conatiner ---------------------------------------------------*/
.policyBox{ /* Policy Box */
margin:15px; /* top/bottom/left/right space outside the box */ /* Set Margin for box */
padding:25px 50px 25px 25px; /* padding: [top] [right] [bottom] [left]; padding inside the box */ /* Add 10px padding inside the container */
justify-content:space-between; /* Distribute content evenly */
align-items:center; /* Center-align vertically */
width:auto; /* Set the width to auto */
/*max-width:600px;*/ /* Set the maximum width of the container to 600px */
border-radius:15px; /* Adjust the border-radius to make the corners more or less round */
background-color:rgba(0,0,0,0.9); /* Set the background color of the container to white */
font-family:Arial, sans-serif; /* Set font-family to Arial or fallback to sans-serif */
/* box-shadow: [horizontal-offset] [vertical-offset] [shadow-radius] [color] */
box-shadow:2px 2px 10px rgba(0,0,0,0.5); /* Optional: Adds a shadow effect to the container */
text-align:justify; /* Make text justifiy */
color:#fff; /* Set text white color */
}
.policyBox h1{ /* Set heading line style */
text-align:center; /* Make text center */
padding:2px auto 0px;/*top left-right bottom */ /* Padding for the heading */
margin-bottom:3px;/* Set horizontal line below headding */ /* Set bottom margin */
font-size:25px; /* Sets the font size for the heading */
font-weight:500;/*bold;*/ /* Makes the text a bit lighter */
/* text-shadow: [horizontal-offset] [vertical-offset] [blur-radius] [color] */
text-shadow:1px 1px 2px rgba(255,255,255,0.5); /* Add text shadow to red*/
}
.policyBox hr{ /* Set horizontal line style */
margin:0px auto 0px; /*top left-right bottom */ /* Margin for horizontal centering */
padding:0px auto 5px; /* Set padding for headding */
width:40%; /* Width of horizontal line */
height:2px; /* Line height (thickness in this case) */
background:rgba(234,67,53,1.0); /* Updated color to red */
border-radius:5px; /* Rounded corners */
/* box-shadow: [horizontal offset] [vertical offset] [blur radius] [spread radius] [color]; */
box-shadow:1px 1px 2px 1px rgba(255,255,255,0.3); /* Shadow effect */
border:none; /* Remove default border */
}
.policyBox p{
text-align:justifiy; /* Make text justifiy */
}
.policyBox .fa-shield{ /* Set Style for shield icon */
padding:2px 10px; /* top/bottom left/right padding */ /* Set Padding of icons */
color:rgba(234,67,53,1.0); /* Set text (icon) red color */
}
.policyBox .fa-lock{ /* Set Style for lock icon */
padding:2px 7px; /* top/bottom left/right padding */ /* Set Padding of icons */
color:rgba(234,67,53,1.0); /* Set text (icon) red color */
}
.policyBox .policyBox-lower-letter-list{ /* List with a, b, c, ... */
list-style-type:lower-alpha; /* Use lowercase alphabetical markers */
}
/* -------------------------------------------- Styles for the footer section -------------------------------------------- */
footer{
background-color:#000; /* Set background color to dark gray */
color:#fff; /* Set text color to white */
padding:2px; /* Add padding around the footer */
text-align:center; /* Center-align text */
position:bottom;/*fixed;*/ /* Fix the footer to the bottom of the viewport */
bottom:0; /* Align the footer to the bottom */
height:fit-content; /* Set height to fit the content */
line-height:1; /* Adjust line height to remove extra space */
/*width:100%;*/ /* Set the width of the footer to 100% of the viewport */
left:0; /* Align the left edge to the left side of the viewport */
right:0; /* Align the right edge to the right side of the viewport */
}
.small-text{
font-size:10px; /* Adjust font size as needed */
}
.small-text strong{
font-weight:bold; /* CSS for making the specified text bold */
}