Lex Prime - Documentation
Support: Author Profile (Aurora-Themes)
Thank you for purchasing Lex Prime - HTML Web Template.
If you have any problem with this product, be free to check for support on my Author Profile (Aurora-Themes). Also, if you have a problem to customize this template, contact me, and I will do that for you. I worked hard to provide the best and newest features in this template. Lex Prime is template particularly crafted for lawyer & attorney offices.
Installation
Zip File
After download Lex Prime - HTML Web Template, and unpacking zip file you have the following folders:
Install - Server and FTP Upload
To install Via - HTML Web Template you can use two methods:
1. Upload files to the server using cPanel (cPanel provide to you your hosting provider). On the bottom image you can see an example:
To upload files to the server:
- Log in to your account (hosting),
- Upload your choosen template version to the server - ZIP file (all versions can be found in "Versions" folder).
- Unzip files in following folder on server: public_html
- You are ready to go.
2. Upload files to the server using some ftp client (for example - FileZilla). On the bottom image - FileZilla (screen):
Please, download the newest FileZilla version.
Not Allowed - GitHub
It's not allowed to install Lex Prime template on GitHub. Bottom image - GitHub start screen.
Useful Links
Licensing
More about licensing options you can find in Lex Prime - HTML Web Template - Zip File.
Layouts
There are four layouts within the Lex Prime HTML web template:
- Vanilla,
- Light,
- Neon,
- Twilight.
Images
Template images aren't included in this package. It's only there for preview purposes. Instead, there are appropriate image placeholders with sizes in pixels.
To change image you need to take a care about image names. Image name need to be same in the folder (Images), but also and inside code. For example: Graphic.webp (Images folder), src = "Images/Graphic.webp" (code). You only need to replace placeholders with real images, and that's easy like that.
I strongly recommend use of images with "webp" extension.
Useful Link
HTML
In each version you can find HTML folder where are located HTML files (except index.html). These files are very important because there you can make changes, which relates to this web template. Actually, text and images are replaced inside HTML files (except background images). Also, each HTML file has the Table of Contents for your easier orientation.
Layout - Twilight
index.html
Description
Code Line: 11
<meta name = "description" content = "Lex Prime is a legal related web platform, which is all about the newest legal standards.">
Keywords
Code Line: 13
<meta name = "keywords" content = "Attorneys, HTML, Lawyers, Legal, Modern, Responsive, Template, Web">
Browser Bar Image
Code Line: 22
<link rel = "icon" type = "image/png" href = "Images/Title-Bar/Lex-Prime.png">
Browser Title Text
Code Lines: 33-35
<title>
Lex Prime - Your Legal Protection
</title>
Loader
Code Lines: 847-855
<!-- Loader -->
<div class = "loader">
<!-- Content -->
<div class = "loader-content">
<!-- Spinner -->
<span class = "loader-content-spinner">
</span>
</div>
</div>
Header
Code Lines: 861-1323
<!-- Header -->
<header>
<!-- Header, Content -->
<div class = "header-content">
<!-- Top -->
<div class = "header-content-top">
<!-- Logo -->
<div class = "header-content-top-text">
<!-- Logo, Text -->
<h4>
<!-- Text, lexPrime -->
<span class = "header-content-top-text-h4-name">
lexPrime
</span>
<!-- Dot -->
<span class = "header-content-top-text-h4-dot logo-dot">
.
</span>
</h4>
</div>
<!-- Search Container -->
<div class = "header-content-top-search">
<!-- Search Box -->
<div class = "header-content-top-search-box">
<!-- Link -->
<a href = "#">
<!-- Img -->
<img class = "img-fluid" src = "Images/Header/Search.webp" alt = "Search">
</a>
</div>
</div>
</div>
<!-- Social Icons -->
<div class = "header-content-social">
<!-- Icons Container -->
<div class = "header-content-social-icons">
<!-- Fb -->
<div class = "header-content-social-icons-fb" onclick = "window.location = '#';">
<!-- Fb, Dark -->
<img class = "header-content-social-icons-fb-dark img-fluid" src = "Images/Header/Fb.webp" alt = "Fb">
<!-- Fb, Light -->
<img class = "header-content-social-icons-fb-light img-fluid" src = "Images/Header/Fb-White.webp" alt = "Fb Light">
</div>
<!-- Linkedin -->
<div class = "header-content-social-icons-linkedin" onclick = "window.location = '#';">
<!-- Linkedin, Dark -->
<img class = "header-content-social-icons-linkedin-dark img-fluid" src = "Images/Header/Linkedin.webp" alt = "Linkedin Light">
<!-- Linkedin, Light -->
<img class = "header-content-social-icons-linkedin-light img-fluid" src = "Images/Header/Linkedin-White.webp" alt = "Linkedin Light">
</div>
</div>
</div>
<!-- Bottom Track -->
<div class = "header-content-stripe">
</div>
<!-- Chocolate Menu -->
<div class = "header-content-menu">
<!-- Menu Grid -->
<div class = "header-content-menu-grid">
<!-- Quad -->
<div class = "header-content-menu-grid-quad">
<!-- Object inside Quad -->
<div class = "header-content-menu-grid-quad-object">
</div>
</div>
<!-- Quad -->
<div class = "header-content-menu-grid-quad">
<!-- Object inside Quad -->
<div class = "header-content-menu-grid-quad-object">
</div>
</div>
<!-- Quad -->
<div class = "header-content-menu-grid-quad">
<!-- Object inside Quad -->
<div class = "header-content-menu-grid-quad-object">
</div>
</div>
<!-- Quad -->
<div class = "header-content-menu-grid-quad">
<!-- Object inside Quad -->
<div class = "header-content-menu-grid-quad-object quad-middle">
</div>
</div>
<!-- Quad -->
<div class = "header-content-menu-grid-quad">
<!-- Object inside Quad -->
<div class = "header-content-menu-grid-quad-object quad-middle">
</div>
</div>
<!-- Quad -->
<div class = "header-content-menu-grid-quad">
<!-- Object inside Quad -->
<div class = "header-content-menu-grid-quad-object quad-middle">
</div>
</div>
<!-- Quad -->
<div class = "header-content-menu-grid-quad">
<!-- Object inside Quad -->
<div class = "header-content-menu-grid-quad-object">
</div>
</div>
<!-- Quad -->
<div class = "header-content-menu-grid-quad">
<!-- Object inside Quad -->
<div class = "header-content-menu-grid-quad-object">
</div>
</div>
<!-- Quad -->
<div class = "header-content-menu-grid-quad">
<!-- Object inside Quad -->
<div class = "header-content-menu-grid-quad-object">
</div>
</div>
</div>
</div>
<!-- Chocolate Menu -->
<div class = "header-content-menuTwo">
<!-- Menu Grid -->
<div class = "header-content-menuTwo-grid">
<!-- Quad -->
<div class = "header-content-menuTwo-grid-quad">
<!-- Object inside Quad -->
<div class = "header-content-menuTwo-grid-quad-object">
</div>
</div>
<!-- Quad -->
<div class = "header-content-menuTwo-grid-quad">
<!-- Object inside Quad -->
<div class = "header-content-menuTwo-grid-quad-object">
</div>
</div>
<!-- Quad -->
<div class = "header-content-menuTwo-grid-quad">
<!-- Object inside Quad -->
<div class = "header-content-menuTwo-grid-quad-object">
</div>
</div>
<!-- Quad -->
<div class = "header-content-menuTwo-grid-quad">
<!-- Object inside Quad -->
<div class = "header-content-menuTwo-grid-quad-object quad-middle">
</div>
</div>
<!-- Quad -->
<div class = "header-content-menuTwo-grid-quad">
<!-- Object inside Quad -->
<div class = "header-content-menuTwo-grid-quad-object quad-middle">
</div>
</div>
<!-- Quad -->
<div class = "header-content-menuTwo-grid-quad">
<!-- Object inside Quad -->
<div class = "header-content-menuTwo-grid-quad-object quad-middle">
</div>
</div>
<!-- Quad -->
<div class = "header-content-menuTwo-grid-quad">
<!-- Object inside Quad -->
<div class = "header-content-menuTwo-grid-quad-object">
</div>
</div>
<!-- Quad -->
<div class = "header-content-menuTwo-grid-quad">
<!-- Object inside Quad -->
<div class = "header-content-menuTwo-grid-quad-object">
</div>
</div>
<!-- Quad -->
<div class = "header-content-menuTwo-grid-quad">
<!-- Object inside Quad -->
<div class = "header-content-menuTwo-grid-quad-object">
</div>
</div>
</div>
</div>
<!-- Office Img -->
<div class = "header-content-imgArea">
<!-- Office Img, Content -->
<div class = "header-content-imgArea-img">
<!-- Img -->
<img class = "img-fluid" src = "Images/Header/Office.webp" alt = "Office">
<!-- Img, Dark Layer -->
<div class = "header-content-imgArea-img-layer">
</div>
<!-- Number Container -->
<div class = "header-content-imgArea-img-number">
<!-- Number -->
<h2>
01
</h2>
</div>
<!-- Ellipses on Top -->
<div class = "header-content-imgArea-img-ellipsesTop">
<!-- Container -->
<div class = "header-content-imgArea-img-ellipsesTop-content">
<!-- Container for Ellipse -->
<div class = "header-content-imgArea-img-ellipsesTop-content-ellipseContainer">
<!-- Ellipse -->
<div class = "header-content-imgArea-img-ellipsesTop-content-ellipseContainer-ellipse">
</div>
</div>
<!-- Container for Ellipse -->
<div class = "header-content-imgArea-img-ellipsesTop-content-ellipseContainer">
<!-- Ellipse -->
<div class = "header-content-imgArea-img-ellipsesTop-content-ellipseContainer-ellipse">
</div>
</div>
<!-- Container for Ellipse -->
<div class = "header-content-imgArea-img-ellipsesTop-content-ellipseContainer">
<!-- Ellipse -->
<div class = "header-content-imgArea-img-ellipsesTop-content-ellipseContainer-ellipse">
</div>
</div>
<!-- Container for Ellipse -->
<div class = "header-content-imgArea-img-ellipsesTop-content-ellipseContainer">
<!-- Ellipse -->
<div class = "header-content-imgArea-img-ellipsesTop-content-ellipseContainer-ellipse">
</div>
</div>
<!-- Container for Ellipse -->
<div class = "header-content-imgArea-img-ellipsesTop-content-ellipseContainer">
<!-- Ellipse -->
<div class = "header-content-imgArea-img-ellipsesTop-content-ellipseContainer-ellipse">
</div>
</div>
<!-- Container for Ellipse -->
<div class = "header-content-imgArea-img-ellipsesTop-content-ellipseContainer">
<!-- Ellipse -->
<div class = "header-content-imgArea-img-ellipsesTop-content-ellipseContainer-ellipse">
</div>
</div>
<!-- Container for Ellipse -->
<div class = "header-content-imgArea-img-ellipsesTop-content-ellipseContainer">
<!-- Ellipse -->
<div class = "header-content-imgArea-img-ellipsesTop-content-ellipseContainer-ellipse">
</div>
</div>
<!-- Container for Ellipse -->
<div class = "header-content-imgArea-img-ellipsesTop-content-ellipseContainer">
<!-- Ellipse -->
<div class = "header-content-imgArea-img-ellipsesTop-content-ellipseContainer-ellipse">
</div>
</div>
<!-- Container for Ellipse -->
<div class = "header-content-imgArea-img-ellipsesTop-content-ellipseContainer">
<!-- Ellipse -->
<div class = "header-content-imgArea-img-ellipsesTop-content-ellipseContainer-ellipse">
</div>
</div>
</div>
</div>
<!-- Ellipses on Bottom -->
<div class = "header-content-imgArea-img-ellipsesBottom">
<!-- Container -->
<div class = "header-content-imgArea-img-ellipsesBottom-container">
<!-- Container for Ellipse -->
<div class = "header-content-imgArea-img-ellipsesBottom-container-ellipseContainer">
<!-- Ellipse -->
<div class = "header-content-imgArea-img-ellipsesBottom-container-ellipseContainer-ellipse">
</div>
</div>
<!-- Container for Ellipse -->
<div class = "header-content-imgArea-img-ellipsesBottom-container-ellipseContainer">
<!-- Ellipse -->
<div class = "header-content-imgArea-img-ellipsesBottom-container-ellipseContainer-ellipse">
</div>
</div>
<!-- Container for Ellipse -->
<div class = "header-content-imgArea-img-ellipsesBottom-container-ellipseContainer">
<!-- Ellipse -->
<div class = "header-content-imgArea-img-ellipsesBottom-container-ellipseContainer-ellipse">
</div>
</div>
<!-- Container for Ellipse -->
<div class = "header-content-imgArea-img-ellipsesBottom-container-ellipseContainer">
<!-- Ellipse -->
<div class = "header-content-imgArea-img-ellipsesBottom-container-ellipseContainer-ellipse">
</div>
</div>
<!-- Container for Ellipse -->
<div class = "header-content-imgArea-img-ellipsesBottom-container-ellipseContainer">
<!-- Ellipse -->
<div class = "header-content-imgArea-img-ellipsesBottom-container-ellipseContainer-ellipse">
</div>
</div>
<!-- Container for Ellipse -->
<div class = "header-content-imgArea-img-ellipsesBottom-container-ellipseContainer">
<!-- Ellipse -->
<div class = "header-content-imgArea-img-ellipsesBottom-container-ellipseContainer-ellipse">
</div>
</div>
<!-- Container for Ellipse -->
<div class = "header-content-imgArea-img-ellipsesBottom-container-ellipseContainer">
<!-- Ellipse -->
<div class = "header-content-imgArea-img-ellipsesBottom-container-ellipseContainer-ellipse">
</div>
</div>
<!-- Container for Ellipse -->
<div class = "header-content-imgArea-img-ellipsesBottom-container-ellipseContainer">
<!-- Ellipse -->
<div class = "header-content-imgArea-img-ellipsesBottom-container-ellipseContainer-ellipse">
</div>
</div>
<!-- Container for Ellipse -->
<div class = "header-content-imgArea-img-ellipsesBottom-container-ellipseContainer">
<!-- Ellipse -->
<div class = "header-content-imgArea-img-ellipsesBottom-container-ellipseContainer-ellipse">
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Text Area -->
<div class = "header-content-info">
<!-- Text Area, Elements -->
<div class = "header-content-info-elements">
<div class = "header-content-info-elements-text">
<h2>
Consult.
</h2>
<h2>
Defend.
</h2>
<h2>
Win.
</h2>
</div>
<!-- Button for Large Screens -->
<div class = "header-content-info-elements-button">
<!-- Button Container -->
<div class = "header-content-info-elements-button-element">
<!-- Button -->
<button>
Contact Us
<!-- Arrow -->
<img class = "img-fluid" src = "Images/Header/Arrow.webp" alt = "Arrow">
</button>
</div>
</div>
<!-- Services -->
<div class = "header-content-info-elements-services">
<!-- Services, Heading -->
<h5 class = "header-content-info-elements-services-heading">
OUR SERVICES
</h5>
<!-- Services, Constitutional Rights -->
<h5 class = "header-content-info-elements-services-constitutional">
Constitutional Rights
</h5>
<!-- Services, International Law -->
<h5 class = "header-content-info-elements-services-international">
International Law
</h5>
</div>
</div>
</div>
<!-- Button for Smaller Screens -->
<div class = "header-content-buttonTextSmall">
<!-- Container for Button and Text -->
<div class = "header-content-buttonTextSmall-container">
<!-- Text -->
<div class = "header-content-buttonTextSmall-container-text">
<!-- Text Elements -->
<div class = "header-content-buttonTextSmall-container-text-element">
<h2>
Consult.
</h2>
<h2>
Defend.
</h2>
<h2>
Win.
</h2>
</div>
</div>
<!-- Button Area -->
<div class = "header-content-buttonTextSmall-container-button">
<!-- Button Container -->
<div class = "header-content-buttonTextSmall-container-button-element">
<!-- Button -->
<button>
Contact Us
<!-- Arrow -->
<img class = "img-fluid" src = "Images/Header/Arrow.webp" alt = "Arrow">
</button>
</div>
</div>
</div>
</div>
<!-- Menu -->
<div class = "header-content-menuOptions">
<!-- Container -->
<div class = "header-content-menuOptions-container">
<!-- Logo -->
<div class = "header-content-menuOptions-container-logo">
<!-- Logo, Text -->
<h4 onclick = "window.location = '#';">
<!-- Text, lexPrime -->
<span>
lexPrime
</span>
<!-- Dot -->
<span class = "header-content-menuOptions-container-logo-dot logo-dot">
.
</span>
</h4>
</div>
<!-- Menu, Links -->
<div class = "header-content-menuOptions-container-links">
<!-- Unordered List -->
<ul>
<!-- Link - Home -->
<li class = "header-content-menuOptions-container-links-link">
<!-- Place for Click -->
<a href = "#">
Home
</a>
</li>
<!-- Link - About -->
<li class = "header-content-menuOptions-container-links-link">
<!-- Place for Click -->
<a href = "#about">
About
</a>
</li>
<!-- Link - Legal Areas -->
<li class = "header-content-menuOptions-container-links-link">
<!-- Place for Click -->
<a href = "#legal">
Expertise
</a>
</li>
<!-- Link - Services -->
<li class = "header-content-menuOptions-container-links-link">
<!-- Place for Click -->
<a href = "#services">
Services
</a>
</li>
<li class = "header-content-menuOptions-container-links-link">
<!-- Place for Click -->
<a href = "#blog">
Blog
</a>
</li>
<li class = "header-content-menuOptions-container-links-link">
<!-- Place for Click -->
<a href = "#contact">
Contact
</a>
</li>
</ul>
</div>
<!-- Close Button -->
<div class = "header-content-menuOptions-container-close">
<!-- Place for Click, Icon -->
<img class = "header-content-menuOptions-container-close-icon img-fluid" src = "Images/Header/Close.webp" alt = "Close">
</div>
</div>
</div>
</div>
</header>
About
Code Lines: 1326-1482
<!-- Section - About -->
<section class = "about" id = "about">
<!-- Content -->
<div class = "about-content">
<!-- Top -->
<div class = "about-content-top row">
<!-- Image Area -->
<div class = "about-content-top-image col-xl-6 order-2 order-xl-1">
<!-- Image Container -->
<div class = "about-content-top-image-container">
<!-- Image -->
<img class = "img-fluid" src = "Images/About/CEO.webp" alt = "CEO">
<!-- Dark Layer Over Image -->
<div class = "about-content-top-image-container-layer">
</div>
<!-- Play -->
<div class = "about-content-top-image-container-play">
<!-- Play Container -->
<div class = "about-content-top-image-container-play-container">
<!-- Icon -->
<img class = "img-fluid" src = "Images/About/Play.webp" alt = "Play">
</div>
</div>
</div>
</div>
<!-- Text Area -->
<div class = "about-content-top-text col-xl-6 order-1 order-xl-2">
<!-- Text Area Container -->
<div class = "about-content-top-text-container">
<!-- Heading -->
<div class = "about-content-top-text-container-heading">
<!-- Heading, Content -->
<div class = "about-content-top-text-container-heading-content">
<!-- Line -->
<div class = "about-content-top-text-container-heading-content-line">
<!-- Area of the Line -->
<div class = "about-content-top-text-container-heading-content-line-area">
</div>
</div>
<!-- Heading, Text -->
<div class = "about-content-top-text-container-heading-content-text">
<!-- Text -->
<h2>
WORD OF CEO
</h2>
</div>
</div>
</div>
<!-- Text, Info -->
<div class = "about-content-top-text-container-longText">
<h3>
For almost 50 years our company works in fields of constitutional rights and international law. We offer our services if you have problem in fields of human rights, and protection of your constitutional rights. Also, we work with international law, which relates to different types of international companies. Our offices are spread around the world, so you are free to visit us in many countries and make your termin reservation.
</h3>
</div>
<!-- Short Text -->
<div class = "about-content-top-text-container-shortText">
<!-- Container for Short Text -->
<div class = "about-content-top-text-container-shortText-container">
<!-- Text -->
<h2>
In our company work more than 30 lawyers, with strong expertise in constitutional law and international law.
</h2>
</div>
</div>
<!-- Signature -->
<div class = "about-content-top-text-container-signature">
<!-- Signature Container -->
<div class = "about-content-top-text-container-signature-container">
<!-- Text -->
<h2>
David Leone
</h2>
</div>
</div>
</div>
</div>
</div>
<!-- Bottom Part -->
<div class = "about-content-bottom row">
<!-- Column Principles -->
<div class = "about-content-bottom-column col-xl-4">
<!-- Principles Container -->
<div class = "about-content-bottom-column-container">
<!-- Icon Container -->
<div class = "about-content-bottom-column-container-iconContainer">
<!-- Icon -->
<img class = "about-content-bottom-column-container-iconContainer-principles img-fluid" src = "Images/About/Principles.webp" alt = "Principles">
</div>
<!-- Heading Container -->
<div class = "about-content-bottom-column-container-headingContainer">
<!-- Heading -->
<h2>
OUR PRINCIPLES
</h2>
</div>
<!-- Text Container -->
<div class = "about-content-bottom-column-container-textContainer">
<!-- Text -->
<h4>
We care about principles and moral values in our company. Interest of our clients is on the first place.
</h4>
</div>
</div>
</div>
<!-- Column Culture -->
<div class = "about-content-bottom-column about-content-bottom-culture col-xl-4">
<!-- Culture Container -->
<div class = "about-content-bottom-column-container">
<!-- Icon Container -->
<div class = "about-content-bottom-column-container-iconContainer">
<!-- Icon -->
<img class = "about-content-bottom-column-container-iconContainer-culture img-fluid" src = "Images/About/Culture.webp" alt = "Culture">
</div>
<!-- Heading Container -->
<div class = "about-content-bottom-column-container-headingContainer">
<!-- Heading -->
<h2>
WORK CULTURE
</h2>
</div>
<!-- Text Container -->
<div class = "about-content-bottom-column-container-textContainer">
<!-- Text -->
<h4>
Our work culture is supported by high standards in selection process of our lawyers and other company staff.
</h4>
</div>
</div>
</div>
<!-- Column Legal -->
<div class = "about-content-bottom-column about-content-bottom-legal col-xl-4">
<!-- Legal Container -->
<div class = "about-content-bottom-column-container">
<!-- Icon Container -->
<div class = "about-content-bottom-column-container-iconContainer">
<!-- Icon -->
<img class = "about-content-bottom-column-container-iconContainer-legal img-fluid" src = "Images/About/Legal.webp" alt = "Legal">
</div>
<!-- Heading Container -->
<div class = "about-content-bottom-column-container-headingContainer">
<!-- Heading -->
<h2>
LEGAL REPRESENTATION
</h2>
</div>
<!-- Text Container -->
<div class = "about-content-bottom-column-container-textContainer">
<!-- Text -->
<h4>
Our best lawyers represent clients on the court. Also, we improve our skills and research about future cases.
</h4>
</div>
</div>
</div>
</div>
</div>
</section>
Legal Areas
Code Lines: 1485-1805
<!-- Legal Areas -->
<section class = "legal" id = "legal">
<!-- Container -->
<div class = "legal-container">
<!-- Heading -->
<div class = "legal-container-heading section-content-heading">
<!-- Heading Container -->
<div class = "legal-container-heading-container section-content-heading-container">
<!-- Heading, Top -->
<div class = "legal-container-heading-container-top section-content-heading-container-top">
<!-- Text -->
<h3>
OUR EXPERTISE
</h3>
</div>
<!-- Heading, Bottom -->
<div class = "legal-container-heading-container-bottom section-content-heading-container-bottom">
<!-- Text -->
<h2>
Legal Areas
</h2>
</div>
</div>
</div>
<!-- Legal Areas -->
<div class = "legal-container-areas">
<!-- Rows -->
<div class = "legal-container-areas-container row">
<!-- Column -->
<div class = "col-12 col-xl-4 legal-container-areas-container-column legal-container-areas-container-columnTop legal-container-areas-container-columnTopInternational">
<!-- Column Container -->
<div class = "legal-container-areas-container-column-container">
<!-- Container for Icon -->
<div class = "legal-container-areas-container-column-container-icon">
<!-- Icon -->
<img class = "img-fluid" src = "Images/Legal-Areas/Globe.webp" alt = "Globe">
</div>
<!-- Container for Heading -->
<div class = "legal-container-areas-container-column-container-heading">
<!-- Text -->
<h3>
INTERNATIONAL LAW
</h3>
</div>
<!-- Large Text Container -->
<div class = "legal-container-areas-container-column-container-text">
<!-- Text Area -->
<h4>
We offer services in international law, in first place related to international agreements and courts.
</h4>
</div>
<!-- Button Container -->
<div class = "legal-container-areas-container-column-container-button">
<!-- Button -->
<button>
<!-- Plus Icon -->
<img class = "img-fluid" src = "Images/Legal-Areas/Plus.webp" alt = "Plus">
READ MORE
</button>
</div>
</div>
<!-- Layer Shadow -->
<div class = "legal-container-areas-container-column-layerShadow">
</div>
<!-- Blue Shape - Top Right -->
<div class = "legal-container-areas-container-column-shapeTopRight">
</div>
<!-- Blue Shape - Top Left -->
<div class = "legal-container-areas-container-column-shapeTopLeft">
</div>
<!-- Blue Shape - Bottom Left -->
<div class = "legal-container-areas-container-column-shapeBottomLeft">
</div>
<!-- Blue Shape - Bottom Right -->
<div class = "legal-container-areas-container-column-shapeBottomRight">
</div>
</div>
<div class = "col-12 col-xl-4 legal-container-areas-container-column legal-container-areas-container-columnTop">
<!-- Column Container -->
<div class = "legal-container-areas-container-column-container">
<!-- Container for Icon -->
<div class = "legal-container-areas-container-column-container-icon">
<!-- Icon -->
<img class = "img-fluid legal-container-areas-container-column-container-icon-book" src = "Images/Legal-Areas/Book.webp" alt = "Book">
</div>
<!-- Container for Heading -->
<div class = "legal-container-areas-container-column-container-heading">
<!-- Text -->
<h3>
CONSTITUTIONAL RIGHTS
</h3>
</div>
<!-- Large Text Container -->
<div class = "legal-container-areas-container-column-container-text">
<!-- Text Area -->
<h4>
We offer services in constitutional rights, related to legal agreements and constitutional courts.
</h4>
</div>
<!-- Button Container -->
<div class = "legal-container-areas-container-column-container-button">
<!-- Button -->
<button>
<!-- Plus Icon -->
<img class = "img-fluid" src = "Images/Legal-Areas/Plus.webp" alt = "Plus">
READ MORE
</button>
</div>
</div>
<!-- Layer Shadow -->
<div class = "legal-container-areas-container-column-layerShadow">
</div>
<!-- Blue Shape - Top Right -->
<div class = "legal-container-areas-container-column-shapeTopRight">
</div>
<!-- Blue Shape - Top Left -->
<div class = "legal-container-areas-container-column-shapeTopLeft">
</div>
<!-- Blue Shape - Bottom Left -->
<div class = "legal-container-areas-container-column-shapeBottomLeft">
</div>
<!-- Blue Shape - Bottom Right -->
<div class = "legal-container-areas-container-column-shapeBottomRight">
</div>
</div>
<div class = "col-12 col-xl-4 legal-container-areas-container-column legal-container-areas-container-columnTop legal-container-areas-container-columnTopHumanRights">
<!-- Column Container -->
<div class = "legal-container-areas-container-column-container">
<!-- Container for Icon -->
<div class = "legal-container-areas-container-column-container-icon">
<!-- Icon -->
<img class = "img-fluid legal-container-areas-container-column-container-icon-charter" src = "Images/Legal-Areas/Charter.webp" alt = "Charter">
</div>
<!-- Container for Heading -->
<div class = "legal-container-areas-container-column-container-heading">
<!-- Text -->
<h3>
HUMAN RIGHTS
</h3>
</div>
<!-- Large Text Container -->
<div class = "legal-container-areas-container-column-container-text">
<!-- Text Area -->
<h4>
We help our clients, when they have problems in field of human rights. Contact us for more info.
</h4>
</div>
<!-- Button Container -->
<div class = "legal-container-areas-container-column-container-button">
<!-- Button -->
<button>
<!-- Plus Icon -->
<img class = "img-fluid" src = "Images/Legal-Areas/Plus.webp" alt = "Plus">
READ MORE
</button>
</div>
</div>
<!-- Layer Shadow -->
<div class = "legal-container-areas-container-column-layerShadow">
</div>
<!-- Blue Shape - Top Right -->
<div class = "legal-container-areas-container-column-shapeTopRight">
</div>
<!-- Blue Shape - Top Left -->
<div class = "legal-container-areas-container-column-shapeTopLeft">
</div>
<!-- Blue Shape - Bottom Left -->
<div class = "legal-container-areas-container-column-shapeBottomLeft">
</div>
<!-- Blue Shape - Bottom Right -->
<div class = "legal-container-areas-container-column-shapeBottomRight">
</div>
</div>
<div class = "col-12 col-xl-4 legal-container-areas-container-column legal-container-areas-container-columnBottom">
<!-- Column Container -->
<div class = "legal-container-areas-container-column-container">
<!-- Container for Icon -->
<div class = "legal-container-areas-container-column-container-icon">
<!-- Icon -->
<img class = "img-fluid" src = "Images/Legal-Areas/Europe.webp" alt = "Europe">
</div>
<!-- Container for Heading -->
<div class = "legal-container-areas-container-column-container-heading">
<!-- Text -->
<h3>
EUROPEAN LAW
</h3>
</div>
<!-- Large Text Container -->
<div class = "legal-container-areas-container-column-container-text">
<!-- Text Area -->
<h4>
We represent our clients on European Court of Human Rights, but only after you use legal path in your country.
</h4>
</div>
<!-- Button Container -->
<div class = "legal-container-areas-container-column-container-button">
<!-- Button -->
<button>
<!-- Plus Icon -->
<img class = "img-fluid" src = "Images/Legal-Areas/Plus.webp" alt = "Plus">
READ MORE
</button>
</div>
</div>
<!-- Layer Shadow -->
<div class = "legal-container-areas-container-column-layerShadow">
</div>
<!-- Blue Shape - Top Right -->
<div class = "legal-container-areas-container-column-shapeTopRight">
</div>
<!-- Blue Shape - Top Left -->
<div class = "legal-container-areas-container-column-shapeTopLeft">
</div>
<!-- Blue Shape - Bottom Left -->
<div class = "legal-container-areas-container-column-shapeBottomLeft">
</div>
<!-- Blue Shape - Bottom Right -->
<div class = "legal-container-areas-container-column-shapeBottomRight">
</div>
</div>
<div class = "col-12 col-xl-4 legal-container-areas-container-column legal-container-areas-container-columnBottom">
<!-- Column Container -->
<div class = "legal-container-areas-container-column-container">
<!-- Container for Icon -->
<div class = "legal-container-areas-container-column-container-icon">
<!-- Icon -->
<img class = "img-fluid legal-container-areas-container-column-container-icon-people" src = "Images/Legal-Areas/People.webp" alt = "People">
</div>
<!-- Container for Heading -->
<div class = "legal-container-areas-container-column-container-heading">
<!-- Text -->
<h3>
DISCRIMINATION CASES
</h3>
</div>
<!-- Large Text Container -->
<div class = "legal-container-areas-container-column-container-text">
<!-- Text Area -->
<h4>
We have zero tolerance to discrimination. Our lawyers work on these cases, with great success.
</h4>
</div>
<!-- Button Container -->
<div class = "legal-container-areas-container-column-container-button">
<!-- Button -->
<button>
<!-- Plus Icon -->
<img class = "img-fluid" src = "Images/Legal-Areas/Plus.webp" alt = "Plus">
READ MORE
</button>
</div>
</div>
<!-- Layer Shadow -->
<div class = "legal-container-areas-container-column-layerShadow">
</div>
<!-- Blue Shape - Top Right -->
<div class = "legal-container-areas-container-column-shapeTopRight">
</div>
<!-- Blue Shape - Top Left -->
<div class = "legal-container-areas-container-column-shapeTopLeft">
</div>
<!-- Blue Shape - Bottom Left -->
<div class = "legal-container-areas-container-column-shapeBottomLeft">
</div>
<!-- Blue Shape - Bottom Right -->
<div class = "legal-container-areas-container-column-shapeBottomRight">
</div>
</div>
<div class = "col-12 col-xl-4 legal-container-areas-container-column legal-container-areas-container-columnBottom">
<!-- Column Container -->
<div class = "legal-container-areas-container-column-container">
<!-- Container for Icon -->
<div class = "legal-container-areas-container-column-container-icon">
<!-- Icon -->
<img class = "img-fluid legal-container-areas-container-column-container-icon-sea" src = "Images/Legal-Areas/Sea.webp" alt = "Sea">
</div>
<!-- Container for Heading -->
<div class = "legal-container-areas-container-column-container-heading">
<!-- Text -->
<h3>
INTERNATIONAL SEA LAW
</h3>
</div>
<!-- Large Text Container -->
<div class = "legal-container-areas-container-column-container-text">
<!-- Text Area -->
<h4>
We have several experts in this legal field. In these cases our clients are mostly states, which have disputes on sea.
</h4>
</div>
<!-- Button Container -->
<div class = "legal-container-areas-container-column-container-button">
<!-- Button -->
<button>
<!-- Plus Icon -->
<img class = "img-fluid" src = "Images/Legal-Areas/Plus.webp" alt = "Plus">
READ MORE
</button>
</div>
</div>
<!-- Layer Shadow -->
<div class = "legal-container-areas-container-column-layerShadow">
</div>
<!-- Blue Shape - Top Right -->
<div class = "legal-container-areas-container-column-shapeTopRight">
</div>
<!-- Blue Shape - Top Left -->
<div class = "legal-container-areas-container-column-shapeTopLeft">
</div>
<!-- Blue Shape - Bottom Left -->
<div class = "legal-container-areas-container-column-shapeBottomLeft">
</div>
<!-- Blue Shape - Bottom Right -->
<div class = "legal-container-areas-container-column-shapeBottomRight">
</div>
</div>
</div>
</div>
</div>
</section>
Services
Code Lines: 1808-1943
<!-- Services -->
<section class = "services" id = "services">
<!-- Container -->
<div class = "services-container">
<!-- Heading -->
<div class = "services-container-heading section-content-heading">
<!-- Heading Container -->
<div class = "services-container-heading-container section-content-heading-container">
<!-- Heading, Top -->
<div class = "services-container-heading-container-top section-content-heading-container-top">
<!-- Text -->
<h3>
OUR SERVICES
</h3>
</div>
<!-- Heading, Bottom -->
<div class = "services-container-heading-container-bottom section-content-heading-container-bottom">
<!-- Text -->
<h2>
Services
</h2>
</div>
</div>
</div>
<!-- Legal Services -->
<div class = "row services-container-legal">
<!-- Container -->
<div class = "col-xl-6 order-2 order-xl-1 services-container-legal-containerLeft">
<div class = "services-container-legal-containerLeft-content">
<!-- Info Area -->
<div class = "services-container-legal-containerLeft-content-info">
<!-- Container -->
<div class = "services-container-legal-containerLeft-content-info-container">
<!-- Text on Top -->
<div class = "services-container-legal-containerLeft-content-info-container-top">
<!-- Text -->
<h2>
WE PROVIDE EXCELLENT
</h2>
</div>
<!-- Bottom Text -->
<div class = "services-container-legal-containerLeft-content-info-container-bottom">
<!-- Text -->
<h2>
Legal Services.
</h2>
</div>
</div>
</div>
<!-- Buttons -->
<div class = "services-container-legal-containerLeft-content-buttons">
<!-- Buttons - Content -->
<div class = "services-container-legal-containerLeft-content-buttons-content">
<!-- Button - Learn More -->
<button class = "services-container-legal-containerLeft-content-buttons-content-learn">
Learn More
<!-- Arrow -->
<img class = "img-fluid" src = "Images/Header/Arrow.webp" alt = "Arrow">
</button>
<!-- Button - View -->
<button class = "services-container-legal-containerLeft-content-buttons-content-view">
View
<!-- Arrow -->
<img class = "img-fluid" src = "Images/Header/Arrow.webp" alt = "Arrow">
</button>
</div>
</div>
<!-- Text Area -->
<div class = "services-container-legal-containerLeft-content-text">
<!-- Text -->
<h5>
If you choose us, you will get the best legal services in fields of constitutional and international law.
</h5>
</div>
</div>
</div>
<!-- Img Area -->
<div class = "col-xl-6 order-1 order-xl-2 services-container-legal-containerRight">
<!-- Content -->
<div class = "services-container-legal-containerRight-content">
<!-- Img Container -->
<div class = "services-container-legal-containerRight-content-img">
<!-- Img -->
<img class = "img-fluid" src = "Images/Services/Office.webp" alt = "Office">
</div>
<!-- Grid -->
<div class = "services-container-legal-containerRight-content-grid">
<!-- Grid - Content -->
<div class = "services-container-legal-containerRight-content-grid-content">
<!-- Img -->
<img class = "img-fluid" src = "Images/Services/Grid.webp" alt = "Grid">
</div>
</div>
</div>
</div>
</div>
<!-- Human Rights Protection -->
<div class = "services-container-bottom">
<!-- Heading -->
<div class = "services-container-bottom-heading">
<!-- Text -->
<h4>
Human Rights Protection
</h4>
</div>
<!-- Subheading -->
<div class = "services-container-bottom-subheading">
<!-- Text -->
<h2>
We work hard on protection of your rights.
</h2>
</div>
<!-- Text Area -->
<div class = "services-container-bottom-text">
<!-- Text -->
<h5>
We work hard every day, with purpose to improve our services related to the protection of human rights. The best lawyers, who specialized in this field, work in our office, and give the best to help to our clients. In first place, we fight against discrimination, but also and other different violations of human rights.
</h5>
</div>
<!-- Video Area -->
<div class = "services-container-bottom-video">
<!-- Content -->
<div class = "services-container-bottom-video-content">
<!-- Large Circle -->
<div class = "services-container-bottom-video-content-circleLarge">
<!-- Small Circle -->
<div class = "services-container-bottom-video-content-circleLarge-circleSmall">
<!-- Triangle -->
<img class = "img-fluid" src = "Images/Services/Triangle.webp" alt = "Triangle">
</div>
</div>
</div>
</div>
</div>
</div>
</section>
Blog
Code Lines: 1946-2694
<!-- Blog -->
<section class = "blog" id = "blog">
<!-- Content -->
<div class = "blog-content">
<!-- Heading -->
<div class = "blog-content-heading section-content-heading">
<!-- Heading, Content -->
<div class = "blog-content-heading-content section-content-heading-container">
<!-- Heading, Top -->
<div class = "blog-content-heading-content-top section-content-heading-container-top">
<!-- Text -->
<h3>
LEGAL NEWS
</h3>
</div>
<!-- Heading, Bottom -->
<div class = "blog-content-heading-content-bottom section-content-heading-container-bottom">
<!-- Text -->
<h2>
Blog
</h2>
</div>
</div>
</div>
<!-- Area Below Heading -->
<div class = "blog-content-bottom">
<!-- Content -->
<div class = "blog-content-bottom-content row">
<!-- Left Side -->
<div class = "blog-content-bottom-content-left col-xl-4">
<!-- Content -->
<div class = "blog-content-bottom-content-left-content row">
<!-- Author Area -->
<div class = "blog-content-bottom-content-left-content-author col-xxl-12 order-2 order-xl-1">
<!-- Large Circle -->
<div class = "blog-content-bottom-content-left-content-author-img blog-content-bottom-content-left-content-author-imgOne">
<div class = "blog-content-bottom-content-left-content-author-img-largeCircle">
<!-- Small Circle -->
<div class = "blog-content-bottom-content-left-content-author-img-largeCircle-smallCircle">
<!-- Img -->
<img class = "img-fluid" src = "Images/Blog/Author-01.webp" alt = "Author 01">
</div>
</div>
</div>
<div class = "blog-content-bottom-content-left-content-author-img blog-content-bottom-content-left-content-author-imgTwo">
<div class = "blog-content-bottom-content-left-content-author-img-largeCircle">
<!-- Small Circle -->
<div class = "blog-content-bottom-content-left-content-author-img-largeCircle-smallCircle">
<!-- Img -->
<img class = "img-fluid" src = "Images/Blog/Author-02.webp" alt = "Author 02">
</div>
</div>
</div>
<div class = "blog-content-bottom-content-left-content-author-img blog-content-bottom-content-left-content-author-imgThree">
<div class = "blog-content-bottom-content-left-content-author-img-largeCircle">
<!-- Small Circle -->
<div class = "blog-content-bottom-content-left-content-author-img-largeCircle-smallCircle">
<!-- Img -->
<img class = "img-fluid" src = "Images/Blog/Author-03.webp" alt = "Author 03">
</div>
</div>
</div>
<div class = "blog-content-bottom-content-left-content-author-img blog-content-bottom-content-left-content-author-imgFour">
<div class = "blog-content-bottom-content-left-content-author-img-largeCircle">
<!-- Small Circle -->
<div class = "blog-content-bottom-content-left-content-author-img-largeCircle-smallCircle">
<!-- Img -->
<img class = "img-fluid" src = "Images/Blog/Author-04.webp" alt = "Author 04">
</div>
</div>
</div>
<!-- Author Info -->
<div class = "blog-content-bottom-content-left-content-author-authorInfo blog-content-bottom-content-left-content-author-authorInfoOne">
<!-- Content -->
<div class = "blog-content-bottom-content-left-content-author-authorInfo-content">
<!-- Author Name -->
<div class = "blog-content-bottom-content-left-content-author-authorInfo-content-name">
<!-- Text -->
<h4>
Giuliano Rossi
</h4>
</div>
<!-- Author Position, Education -->
<div class = "blog-content-bottom-content-left-content-author-authorInfo-content-position">
<!-- Text -->
<h4>
INTERNATIONAL LAWYER
</h4>
</div>
</div>
</div>
<div class = "blog-content-bottom-content-left-content-author-authorInfo blog-content-bottom-content-left-content-author-authorInfoTwo">
<!-- Content -->
<div class = "blog-content-bottom-content-left-content-author-authorInfo-content">
<!-- Author Name -->
<div class = "blog-content-bottom-content-left-content-author-authorInfo-content-name">
<!-- Text -->
<h4>
Tamara Sioni
</h4>
</div>
<!-- Author Position, Education -->
<div class = "blog-content-bottom-content-left-content-author-authorInfo-content-position">
<!-- Text -->
<h4>
CONSTITUTIONAL LAWYER
</h4>
</div>
</div>
</div>
<div class = "blog-content-bottom-content-left-content-author-authorInfo blog-content-bottom-content-left-content-author-authorInfoThree">
<!-- Content -->
<div class = "blog-content-bottom-content-left-content-author-authorInfo-content">
<!-- Author Name -->
<div class = "blog-content-bottom-content-left-content-author-authorInfo-content-name">
<!-- Text -->
<h4>
David Witterte
</h4>
</div>
<!-- Author Position, Education -->
<div class = "blog-content-bottom-content-left-content-author-authorInfo-content-position">
<!-- Text -->
<h4>
CONSTITUTIONAL LAWYER
</h4>
</div>
</div>
</div>
<div class = "blog-content-bottom-content-left-content-author-authorInfo blog-content-bottom-content-left-content-author-authorInfoFour">
<!-- Content -->
<div class = "blog-content-bottom-content-left-content-author-authorInfo-content">
<!-- Author Name -->
<div class = "blog-content-bottom-content-left-content-author-authorInfo-content-name">
<!-- Text -->
<h4>
Diana Mussi
</h4>
</div>
<!-- Author Position, Education -->
<div class = "blog-content-bottom-content-left-content-author-authorInfo-content-position">
<!-- Text -->
<h4>
INTERNATIONAL LAWYER
</h4>
</div>
</div>
</div>
</div>
<!-- Heading, Exclusive... -->
<div class = "blog-content-bottom-content-left-content-heading blog-content-bottom-content-left-content-headingOne col-xxl-12 order-1 order-xl-2">
<!-- Content -->
<div class = "blog-content-bottom-content-left-content-heading-content">
<!-- Text -->
<h2>
Exclusive Zone and Borders on the Sea
</h2>
</div>
</div>
<div class = "blog-content-bottom-content-left-content-heading blog-content-bottom-content-left-content-headingTwo col-xxl-12 order-1 order-xl-2">
<!-- Content -->
<div class = "blog-content-bottom-content-left-content-heading-content">
<!-- Text -->
<h2>
What We Know About Our Constitutional Rights
</h2>
</div>
</div>
<div class = "blog-content-bottom-content-left-content-heading blog-content-bottom-content-left-content-headingThree col-xxl-12 order-1 order-xl-2">
<!-- Content -->
<div class = "blog-content-bottom-content-left-content-heading-content">
<!-- Text -->
<h2>
Human Rights in the Modern World
</h2>
</div>
</div>
<div class = "blog-content-bottom-content-left-content-heading blog-content-bottom-content-left-content-headingFour col-xxl-12 order-1 order-xl-2">
<!-- Content -->
<div class = "blog-content-bottom-content-left-content-heading-content">
<!-- Text -->
<h2>
Development of International Law
</h2>
</div>
</div>
<!-- Field of Law -->
<div class = "blog-content-bottom-content-left-content-lawField col-xxl-12 order-3">
<!-- Content -->
<div class = "blog-content-bottom-content-left-content-lawField-content">
<!-- Line -->
<div class = "blog-content-bottom-content-left-content-lawField-content-line">
<!-- Line, Content -->
<div class = "blog-content-bottom-content-left-content-lawField-content-line-content">
</div>
</div>
<!-- Law Field, Text -->
<div class = "blog-content-bottom-content-left-content-lawField-content-text blog-content-bottom-content-left-content-lawField-content-textOne">
<!-- Text -->
<h4>
INTERNATIONAL LAW
</h4>
</div>
<div class = "blog-content-bottom-content-left-content-lawField-content-text blog-content-bottom-content-left-content-lawField-content-textTwo">
<!-- Text -->
<h4>
CONSTITUTIONAL LAW
</h4>
</div>
<div class = "blog-content-bottom-content-left-content-lawField-content-text blog-content-bottom-content-left-content-lawField-content-textThree">
<!-- Text -->
<h4>
CONSTITUTIONAL LAW
</h4>
</div>
<div class = "blog-content-bottom-content-left-content-lawField-content-text blog-content-bottom-content-left-content-lawField-content-textFour">
<!-- Text -->
<h4>
INTERNATIONAL LAW
</h4>
</div>
</div>
</div>
<!-- Date, Visible on Small Devices -->
<div class = "blog-content-bottom-content-left-content-dateSmallDevices col-xxl-12 order-4">
<!-- Content -->
<div class = "blog-content-bottom-content-left-content-dateSmallDevices-content">
<!-- Date -->
<div class = "blog-content-bottom-content-left-content-dateSmallDevices-content-date blog-content-bottom-content-left-content-dateSmallDevices-content-dateOne">
<!-- Icon -->
<div class = "blog-content-bottom-content-left-content-dateSmallDevices-content-date-icon">
<!-- Calendar -->
<img class = "img-fluid" src = "Images/Blog/Calendar.webp" alt = "Calendar">
</div>
<!-- Text Area -->
<div class = "blog-content-bottom-content-left-content-dateSmallDevices-content-date-text">
<!-- Text -->
<h4>
December 27, 2023
</h4>
</div>
</div>
<div class = "blog-content-bottom-content-left-content-dateSmallDevices-content-date blog-content-bottom-content-left-content-dateSmallDevices-content-dateTwo">
<!-- Icon -->
<div class = "blog-content-bottom-content-left-content-dateSmallDevices-content-date-icon">
<!-- Calendar -->
<img class = "img-fluid" src = "Images/Blog/Calendar.webp" alt = "Calendar">
</div>
<!-- Text Area -->
<div class = "blog-content-bottom-content-left-content-dateSmallDevices-content-date-text">
<!-- Text -->
<h4>
January 14, 2024
</h4>
</div>
</div>
<div class = "blog-content-bottom-content-left-content-dateSmallDevices-content-date blog-content-bottom-content-left-content-dateSmallDevices-content-dateThree">
<!-- Icon -->
<div class = "blog-content-bottom-content-left-content-dateSmallDevices-content-date-icon">
<!-- Calendar -->
<img class = "img-fluid" src = "Images/Blog/Calendar.webp" alt = "Calendar">
</div>
<!-- Text Area -->
<div class = "blog-content-bottom-content-left-content-dateSmallDevices-content-date-text">
<!-- Text -->
<h4>
January 14, 2024
</h4>
</div>
</div>
<div class = "blog-content-bottom-content-left-content-dateSmallDevices-content-date blog-content-bottom-content-left-content-dateSmallDevices-content-dateFour">
<!-- Icon -->
<div class = "blog-content-bottom-content-left-content-dateSmallDevices-content-date-icon">
<!-- Calendar -->
<img class = "img-fluid" src = "Images/Blog/Calendar.webp" alt = "Calendar">
</div>
<!-- Text Area -->
<div class = "blog-content-bottom-content-left-content-dateSmallDevices-content-date-text">
<!-- Text -->
<h4>
January 14, 2024
</h4>
</div>
</div>
</div>
</div>
<!-- Img Visible on Small Devices -->
<div class = "blog-content-bottom-content-left-content-imgSmallDevices col-xxl-12 order-4">
<!-- Content -->
<div class = "blog-content-bottom-content-left-content-imgSmallDevices-content blog-content-bottom-content-left-content-imgSmallDevices-contentOne">
<!-- Img -->
<img class = "img-fluid" src = "Images/Blog/Sea-Large.webp" alt = "Sea, Large">
</div>
<div class = "blog-content-bottom-content-left-content-imgSmallDevices-content blog-content-bottom-content-left-content-imgSmallDevices-contentTwo">
<!-- Img -->
<img class = "img-fluid" src = "Images/Blog/Constitution-Large.webp" alt = "Constitution-Large">
</div>
<div class = "blog-content-bottom-content-left-content-imgSmallDevices-content blog-content-bottom-content-left-content-imgSmallDevices-contentThree">
<!-- Img -->
<img class = "img-fluid" src = "Images/Blog/humanRights-Large.webp" alt = "Human Rights, Large">
</div>
<div class = "blog-content-bottom-content-left-content-imgSmallDevices-content blog-content-bottom-content-left-content-imgSmallDevices-contentFour">
<!-- Img -->
<img class = "img-fluid" src = "Images/Blog/internationalLaw-Large.webp" alt = "International Law, Large">
</div>
</div>
<!-- Numbers, Small Devices -->
<div class = "blog-content-bottom-content-left-content-numbersSmallDevices col-xxl-12 order-4">
<!-- Content -->
<div class = "blog-content-bottom-content-left-content-numbersSmallDevices-content blog-content-bottom-content-left-content-numbersSmallDevices-contentOne">
<!-- Text -->
<h2>
1/4
</h2>
</div>
<div class = "blog-content-bottom-content-left-content-numbersSmallDevices-content blog-content-bottom-content-left-content-numbersSmallDevices-contentTwo">
<!-- Text -->
<h2>
2/4
</h2>
</div>
<div class = "blog-content-bottom-content-left-content-numbersSmallDevices-content blog-content-bottom-content-left-content-numbersSmallDevices-contentThree">
<!-- Text -->
<h2>
3/4
</h2>
</div>
<div class = "blog-content-bottom-content-left-content-numbersSmallDevices-content blog-content-bottom-content-left-content-numbersSmallDevices-contentFour">
<!-- Text -->
<h2>
4/4
</h2>
</div>
</div>
<!-- Dots, Small Devices-->
<div class = "blog-content-bottom-content-left-content-dotsSmallDevices col-xxl-12 order-5">
<!-- Content -->
<div class = "blog-content-bottom-content-left-content-dotsSmallDevices-content">
<!-- Dot One -->
<div class = "blog-content-bottom-content-left-content-dotsSmallDevices-content-dot blog-content-bottom-content-left-content-dotsSmallDevices-content-dotOne">
</div>
<!-- Dot Two -->
<div class = "blog-content-bottom-content-left-content-dotsSmallDevices-content-dot blog-content-bottom-content-left-content-dotsSmallDevices-content-dotTwo">
</div>
<!-- Dot Three -->
<div class = "blog-content-bottom-content-left-content-dotsSmallDevices-content-dot blog-content-bottom-content-left-content-dotsSmallDevices-content-dotThree">
</div>
<!-- Dot Four -->
<div class = "blog-content-bottom-content-left-content-dotsSmallDevices-content-dot blog-content-bottom-content-left-content-dotsSmallDevices-content-dotFour">
</div>
</div>
</div>
<!-- Large Text -->
<div class = "blog-content-bottom-content-left-content-text col-xxl-12 order-5">
<!-- Content -->
<div class = "blog-content-bottom-content-left-content-text-content blog-content-bottom-content-left-content-text-contentOne">
<!-- Text -->
<h5>
One of the most important principle of the international law are rules about borders on the sea, and exclusive zone. It’s important that coastal states have stable rules about their borders on the sea. That’s because, we need to keep right of the free passage on the sea, but also to know the rules about exclusive right of the states in their exclusive area.
</h5>
</div>
<div class = "blog-content-bottom-content-left-content-text-content blog-content-bottom-content-left-content-text-contentTwo">
<!-- Text -->
<h5>
We live in the modern world, where we discuss almost daily about many aspects of our rights in real life. But, what we know about human rights in general? Human rights are rights that belong to an individual or group of individuals simply for being human, or as a consequence of inherent human vulnerability.
</h5>
</div>
<div class = "blog-content-bottom-content-left-content-text-content blog-content-bottom-content-left-content-text-contentThree">
<!-- Text -->
<h5>
In modern era, human rights are on the top of many agendas, and on the other hand, we are still struggling to provide these for people around the world. Whatever the current attitudes and policies of governments, the reality of popular demands for human rights, including both greater economic justice and greater political freedom, is beyond debate.
</h5>
</div>
<div class = "blog-content-bottom-content-left-content-text-content blog-content-bottom-content-left-content-text-contentFour">
<!-- Text -->
<h5>
International law has long roots in the history, but main development phase was after second world war. The essential structure of international law was mapped out during the European Renaissance, though its origins lay deep in history and can be traced to cooperative agreements between peoples in the ancient Middle East.
</h5>
</div>
</div>
<!-- Date and Button -->
<div class = "blog-content-bottom-content-left-content-dateButton col-12 col-xl-6 col-xxl-12 order-5">
<!-- Content -->
<div class = "blog-content-bottom-content-left-content-dateButton-content">
<!-- Date -->
<div class = "blog-content-bottom-content-left-content-dateButton-content-date blog-content-bottom-content-left-content-dateButton-content-dateOne">
<!-- Icon -->
<div class = "blog-content-bottom-content-left-content-dateButton-content-date-icon">
<!-- Calendar -->
<img class = "img-fluid" src = "Images/Blog/Calendar.webp" alt = "Calendar">
</div>
<!-- Text Area -->
<div class = "blog-content-bottom-content-left-content-dateButton-content-date-text">
<!-- Text -->
<h4>
December 27, 2023
</h4>
</div>
</div>
<div class = "blog-content-bottom-content-left-content-dateButton-content-date blog-content-bottom-content-left-content-dateButton-content-dateTwo">
<!-- Icon -->
<div class = "blog-content-bottom-content-left-content-dateButton-content-date-icon">
<!-- Calendar -->
<img class = "img-fluid" src = "Images/Blog/Calendar.webp" alt = "Calendar">
</div>
<!-- Text Area -->
<div class = "blog-content-bottom-content-left-content-dateButton-content-date-text">
<!-- Text -->
<h4>
January 14, 2024
</h4>
</div>
</div>
<div class = "blog-content-bottom-content-left-content-dateButton-content-date blog-content-bottom-content-left-content-dateButton-content-dateThree">
<!-- Icon -->
<div class = "blog-content-bottom-content-left-content-dateButton-content-date-icon">
<!-- Calendar -->
<img class = "img-fluid" src = "Images/Blog/Calendar.webp" alt = "Calendar">
</div>
<!-- Text Area -->
<div class = "blog-content-bottom-content-left-content-dateButton-content-date-text">
<!-- Text -->
<h4>
January 14, 2024
</h4>
</div>
</div>
<div class = "blog-content-bottom-content-left-content-dateButton-content-date blog-content-bottom-content-left-content-dateButton-content-dateFour">
<!-- Icon -->
<div class = "blog-content-bottom-content-left-content-dateButton-content-date-icon">
<!-- Calendar -->
<img class = "img-fluid" src = "Images/Blog/Calendar.webp" alt = "Calendar">
</div>
<!-- Text Area -->
<div class = "blog-content-bottom-content-left-content-dateButton-content-date-text">
<!-- Text -->
<h4>
January 14, 2024
</h4>
</div>
</div>
<!-- Button -->
<div class = "blog-content-bottom-content-left-content-dateButton-content-button">
<!-- Content -->
<div class = "blog-content-bottom-content-left-content-dateButton-content-button-content">
<!-- Button Area -->
<div class = "blog-content-bottom-content-left-content-dateButton-content-button-content-buttonArea blog-content-bottom-content-left-content-dateButton-content-button-content-buttonAreaOne" onclick = "window.location = 'HTML/exclusive-zone.html';">
<!-- Content -->
<div class = "blog-content-bottom-content-left-content-dateButton-content-button-content-buttonArea-content">
<!-- Img Area -->
<div class = "blog-content-bottom-content-left-content-dateButton-content-button-content-buttonArea-content-img">
<!-- Img -->
<img class = "img-fluid" src = "Images/Blog/Arrow.webp" alt = "Arrow">
</div>
<!-- Text -->
<h4>
Read More
</h4>
</div>
</div>
<div class = "blog-content-bottom-content-left-content-dateButton-content-button-content-buttonArea blog-content-bottom-content-left-content-dateButton-content-button-content-buttonAreaTwo" onclick = "window.location = 'HTML/constitutional-rights.html';">
<!-- Content -->
<div class = "blog-content-bottom-content-left-content-dateButton-content-button-content-buttonArea-content">
<!-- Img Area -->
<div class = "blog-content-bottom-content-left-content-dateButton-content-button-content-buttonArea-content-img">
<!-- Img -->
<img class = "img-fluid" src = "Images/Blog/Arrow.webp" alt = "Arrow">
</div>
<!-- Text -->
<h4>
Read More
</h4>
</div>
</div>
<div class = "blog-content-bottom-content-left-content-dateButton-content-button-content-buttonArea blog-content-bottom-content-left-content-dateButton-content-button-content-buttonAreaThree" onclick = "window.location = 'HTML/human-rights.html';">
<!-- Content -->
<div class = "blog-content-bottom-content-left-content-dateButton-content-button-content-buttonArea-content">
<!-- Img Area -->
<div class = "blog-content-bottom-content-left-content-dateButton-content-button-content-buttonArea-content-img">
<!-- Img -->
<img class = "img-fluid" src = "Images/Blog/Arrow.webp" alt = "Arrow">
</div>
<!-- Text -->
<h4>
Read More
</h4>
</div>
</div>
<div class = "blog-content-bottom-content-left-content-dateButton-content-button-content-buttonArea blog-content-bottom-content-left-content-dateButton-content-button-content-buttonAreaFour" onclick = "window.location = 'HTML/international-law.html';">
<!-- Content -->
<div class = "blog-content-bottom-content-left-content-dateButton-content-button-content-buttonArea-content">
<!-- Img Area -->
<div class = "blog-content-bottom-content-left-content-dateButton-content-button-content-buttonArea-content-img">
<!-- Img -->
<img class = "img-fluid" src = "Images/Blog/Arrow.webp" alt = "Arrow">
</div>
<!-- Text -->
<h4>
Read More
</h4>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Center Area -->
<div class = "blog-content-bottom-content-center col-xl-4">
<!-- Content -->
<div class = "blog-content-bottom-content-center-content">
<!-- Img Area -->
<div class = "blog-content-bottom-content-center-content-img blog-content-bottom-content-center-content-imgOne">
<!-- Img -->
<img class = "img-fluid" src = "Images/Blog/Sea-Large.webp" alt = "Sea-Large">
<!-- Layer on Img -->
<div class = "blog-content-bottom-content-center-content-img-layer">
</div>
</div>
<div class = "blog-content-bottom-content-center-content-img blog-content-bottom-content-center-content-imgTwo">
<!-- Img -->
<img class = "img-fluid" src = "Images/Blog/Constitution-Large.webp" alt = "Constitution-Large">
<!-- Layer on Img -->
<div class = "blog-content-bottom-content-center-content-img-layer">
</div>
</div>
<div class = "blog-content-bottom-content-center-content-img blog-content-bottom-content-center-content-imgThree">
<!-- Img -->
<img class = "img-fluid" src = "Images/Blog/humanRights-Large.webp" alt = "Human Rights Large">
<!-- Layer on Img -->
<div class = "blog-content-bottom-content-center-content-img-layer">
</div>
</div>
<div class = "blog-content-bottom-content-center-content-img blog-content-bottom-content-center-content-imgFour">
<!-- Img -->
<img class = "img-fluid" src = "Images/Blog/internationalLaw-Large.webp" alt = "International Law, Large">
<!-- Layer on Img -->
<div class = "blog-content-bottom-content-center-content-img-layer">
</div>
</div>
<!-- Numbers -->
<div class = "blog-content-bottom-content-center-content-numbers">
<!-- Content -->
<div class = "blog-content-bottom-content-center-content-numbers-content blog-content-bottom-content-center-content-numbers-contentOne">
<!-- Text -->
<h2>
1/4
</h2>
</div>
<div class = "blog-content-bottom-content-center-content-numbers-content blog-content-bottom-content-center-content-numbers-contentTwo">
<!-- Text -->
<h2>
2/4
</h2>
</div>
<div class = "blog-content-bottom-content-center-content-numbers-content blog-content-bottom-content-center-content-numbers-contentThree">
<!-- Text -->
<h2>
3/4
</h2>
</div>
<div class = "blog-content-bottom-content-center-content-numbers-content blog-content-bottom-content-center-content-numbers-contentFour">
<!-- Text -->
<h2>
4/4
</h2>
</div>
</div>
</div>
</div>
<!-- Right Side -->
<div class = "blog-content-bottom-content-right col-xl-4">
<!-- Content -->
<div class = "blog-content-bottom-content-right-content">
<!-- Top Area -->
<div class = "blog-content-bottom-content-right-content-top">
<!-- Blue Line -->
<div class = "blog-content-bottom-content-right-content-top-line">
<!-- Content -->
<div class = "blog-content-bottom-content-right-content-top-line-content">
</div>
</div>
<!-- Text Area -->
<div class = "blog-content-bottom-content-right-content-top-text">
<!-- Text -->
<h3>
ARTICLES
</h3>
</div>
</div>
<!-- Blocks -->
<div class = "blog-content-bottom-content-right-content-blocks">
<!-- Content -->
<div class = "blog-content-bottom-content-right-content-blocks-content">
<!-- Block -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block blog-content-bottom-content-right-content-blocks-content-blockOne">
<!-- Content -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block-content">
<!-- Img Container -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block-content-img">
<!-- Img -->
<img class = "img-fluid" src = "Images/Blog/Sea-Small.webp" alt = "Sea-Small">
</div>
<!-- Text and Button -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block-content-textButton">
<!-- Content -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block-content-textButton-content">
<!-- Text Container -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block-content-textButton-content-text">
<!-- Text -->
<h6>
One of the most important principle of the international law are rules about borders...
</h6>
</div>
<!-- Button Container -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block-content-textButton-content-button">
<!-- Button -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block-content-textButton-content-button-buttonArea blog-content-bottom-content-right-content-blocks-content-block-content-textButton-content-button-buttonOne">
<!-- Img -->
<img class = "img-fluid" src = "Images/Blog/Arrow-Buttons.webp" alt = "Arrow-Buttons">
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Block -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block blog-content-bottom-content-right-content-blocks-content-blockMargin blog-content-bottom-content-right-content-blocks-content-blockTwo">
<!-- Content -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block-content">
<!-- Img Container -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block-content-img">
<!-- Img -->
<img class = "img-fluid" src = "Images/Blog/Constitution-Small.webp" alt = "Constitution-Small">
</div>
<!-- Text and Button -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block-content-textButton">
<!-- Content -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block-content-textButton-content">
<!-- Text Container -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block-content-textButton-content-text">
<!-- Text -->
<h6>
We live in the modern world, where we discuss almost daily about many...
</h6>
</div>
<!-- Button Container -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block-content-textButton-content-button">
<!-- Button -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block-content-textButton-content-button-buttonArea blog-content-bottom-content-right-content-blocks-content-block-content-textButton-content-button-buttonTwo">
<!-- Img -->
<img class = "img-fluid" src = "Images/Blog/Arrow-Buttons.webp" alt = "Arrow-Buttons">
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Block -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block blog-content-bottom-content-right-content-blocks-content-blockMargin blog-content-bottom-content-right-content-blocks-content-blockThree">
<!-- Content -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block-content">
<!-- Img Container -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block-content-img">
<!-- Img -->
<img class = "img-fluid" src = "Images/Blog/humanRights-Small.webp" alt = "Human Rights Small">
</div>
<!-- Text and Button -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block-content-textButton">
<!-- Content -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block-content-textButton-content">
<!-- Text Container -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block-content-textButton-content-text">
<!-- Text -->
<h6>
In modern era, human rights are on the top of many agendas, and on the other hand...
</h6>
</div>
<!-- Button Container -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block-content-textButton-content-button">
<!-- Button -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block-content-textButton-content-button-buttonArea blog-content-bottom-content-right-content-blocks-content-block-content-textButton-content-button-buttonThree">
<!-- Img -->
<img class = "img-fluid" src = "Images/Blog/Arrow-Buttons.webp" alt = "Arrow-Buttons">
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Block -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block blog-content-bottom-content-right-content-blocks-content-blockFour blog-content-bottom-content-right-content-blocks-content-blockMargin">
<!-- Content -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block-content">
<!-- Img Container -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block-content-img">
<!-- Img -->
<img class = "img-fluid" src = "Images/Blog/internationalLaw-Small.webp" alt = "International Law, Small">
</div>
<!-- Text and Button -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block-content-textButton">
<!-- Content -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block-content-textButton-content">
<!-- Text Container -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block-content-textButton-content-text">
<!-- Text -->
<h6>
International law has long roots in the history, but main development phase...
</h6>
</div>
<!-- Button Container -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block-content-textButton-content-button">
<!-- Button -->
<div class = "blog-content-bottom-content-right-content-blocks-content-block-content-textButton-content-button-buttonArea blog-content-bottom-content-right-content-blocks-content-block-content-textButton-content-button-buttonFour">
<!-- Img -->
<img class = "img-fluid" src = "Images/Blog/Arrow-Buttons.webp" alt = "Arrow-Buttons">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Dots -->
<div class = "blog-content-bottom-content-right-content-dots">
<!-- Content -->
<div class = "blog-content-bottom-content-right-content-dots-content">
<!-- Dot -->
<div class = "blog-content-bottom-content-right-content-dots-content-dot blog-content-bottom-content-right-content-dots-content-dotOne">
</div>
<!-- Dot -->
<div class = "blog-content-bottom-content-right-content-dots-content-dot blog-content-bottom-content-right-content-dots-content-dotTwo">
</div>
<!-- Dot -->
<div class = "blog-content-bottom-content-right-content-dots-content-dot blog-content-bottom-content-right-content-dots-content-dotThree">
</div>
<!-- Dot -->
<div class = "blog-content-bottom-content-right-content-dots-content-dot blog-content-bottom-content-right-content-dots-content-dotFour">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
Contact
Code Lines: 2697-2784
<!-- Contact -->
<section class = "contact" id = "contact">
<!-- Content -->
<div class = "contact-content">
<!-- Dark Shape -->
<div class = "contact-content-shape">
<!-- Content -->
<div class = "contact-content-shape-content">
<!-- Info -->
<div class = "contact-content-shape-content-info">
<!-- Top -->
<div class = "contact-content-shape-content-info-top">
<!-- Text -->
<h2>
CONTACT US
</h2>
</div>
<!-- Bottom Text -->
<div class = "contact-content-shape-content-info-bottom">
<!-- Text -->
<h3>
If you have any question about legal matter, be free to reach us!
</h3>
</div>
</div>
<!-- Contact Form -->
<div class = "contact-content-shape-content-form">
<!-- Content -->
<form action = "PHP/contact.php" class = "contact-content-shape-content-form-content" id = "formArea" method = "post">
<!-- Field Area -->
<div class = "contact-content-shape-content-form-content-fieldArea">
<!-- Name -->
<input class = "contact-content-shape-content-form-content-fieldArea-field" id = "name" name = "userName" placeholder = "Your Name" type = "text" required>
</div>
<!-- Field Area-->
<div class = "contact-content-shape-content-form-content-fieldArea">
<!-- Email -->
<input class = "contact-content-shape-content-form-content-fieldArea-field contact-content-shape-content-form-content-fieldArea-space" id = "email" name = "userEmail" placeholder = "Your Email Address" type = "email" required>
</div>
<!-- Field Area -->
<div class = "contact-content-shape-content-form-content-fieldArea">
<!-- Message -->
<textarea class = "contact-content-shape-content-form-content-fieldArea-field contact-content-shape-content-form-content-fieldArea-message contact-content-shape-content-form-content-fieldArea-space" name = "userMessage" placeholder = "Message" required></textarea>
</div>
<!-- Submit Button -->
<div class = "contact-content-shape-content-form-content-submitButton">
<!-- Button -->
<input class = "contact-content-shape-content-form-content-submitButton-button" name = "submit" type = "submit" value = "SEND">
</div>
</form>
</div>
</div>
<!-- Triangles and Social -->
<div class = "contact-content-shape-trianglesSocial">
<!-- Content -->
<div class = "contact-content-shape-trianglesSocial-content">
<!-- Triangle One -->
<div class = "contact-content-shape-trianglesSocial-content-one">
</div>
<!-- Triangle Two -->
<div class = "contact-content-shape-trianglesSocial-content-two">
</div>
<!-- Social Icons -->
<div class = "contact-content-shape-trianglesSocial-content-social">
<!-- Content -->
<div class = "contact-content-shape-trianglesSocial-content-social-content">
<!-- Icon Area -->
<div class = "contact-content-shape-trianglesSocial-content-social-content-icon">
<!-- Icon -->
<img class = "img-fluid" onclick = "window.location = '#';" src = "Images/Contact/Icon-Google+.webp" alt = "Icon-Google+">
</div>
<!-- Icon Area -->
<div class = "contact-content-shape-trianglesSocial-content-social-content-icon contact-content-shape-trianglesSocial-content-social-content-iconFb">
<!-- Icon -->
<img class = "img-fluid" onclick = "window.location = '#';" src = "Images/Contact/Icon-Fb.webp" alt = "Icon-Fb">
</div>
<!-- Icon Area -->
<div class = "contact-content-shape-trianglesSocial-content-social-content-icon contact-content-shape-trianglesSocial-content-social-content-iconLinkedin">
<!-- Icon -->
<img class = "img-fluid" onclick = "window.location = '#';" src = "Images/Contact/Icon-Linkedin.webp" alt = "Icon-Linkedin">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
Footer
Code Lines: 2787-2989
<!-- Footer -->
<footer>
<!-- Top -->
<div class = "top">
<!-- Top Area -->
<div class = "top-area">
<!-- Headings -->
<div class = "headings row">
<!-- Left One -->
<div class = "col-12 col-xxl-3 left-one">
<!-- Via Container -->
<div class = "via-container">
<!-- Via Area -->
<div class = "via-area">
<!-- First -->
<span class = "first">
V
</span>
<!-- Span -->
<span>
IA
</span>
</div>
</div>
</div>
<!-- Block Headings -->
<div class = "block-headings col-xxl-3">
<!-- Heading Container -->
<div class = "heading-container">
<!-- H2 -->
<h2>
Latest Posts
</h2>
</div>
</div>
<!-- Block Headings -->
<div class = "block-headings col-xxl-3">
<!-- Heading Container -->
<div class = "heading-container">
<!-- H2 -->
<h2>
Twitter
</h2>
</div>
</div>
<!-- Block Headings -->
<div class = "block-headings col-xxl-3">
<!-- Heading Container -->
<div class = "heading-container">
<!-- H2 -->
<h2>
Instagram
</h2>
</div>
</div>
</div>
<!-- Info -->
<div class = "info row">
<!-- Left One -->
<div class = "col-12 col-xxl-3 left-one">
<!-- Text Container -->
<div class = "text-container">
<!-- H3 -->
<h3>
Via is travel agency located in New York, US. We are leading travel company in this part of the state. With several offices around the world, we are working hard to give the best for our clients.
</h3>
</div>
</div>
<!-- Block Info -->
<div class = "block-info col-12 col-xxl-3">
<!-- Text Container First -->
<div class = "text-container-first">
<!-- H3 -->
<h3 onclick = "window.location = 'HTML/alps.html';">
Find your Peace in German Alps
</h3>
</div>
<!-- Text Container Other -->
<div class = "text-container-other">
<!-- H3 -->
<h3 onclick = "window.location = 'HTML/stonehenge.html';">
Visit Stone Age Magnificient Monument
</h3>
</div>
<!-- Text Container Other -->
<div class = "text-container-other">
<!-- H3 -->
<h3 onclick = "window.location = 'HTML/taj-mahal.html';">
Eternal Love in India
</h3>
</div>
<!-- Text Container Other -->
<div class = "text-container-other">
<!-- H3 -->
<h3 onclick = "window.location = 'HTML/eiffel-tower.html';">
Giant from Steel
</h3>
</div>
</div>
<!-- Right One -->
<div class = "col-12 col-xxl-3 right-one">
<!-- Text Container First -->
<div class = "text-container-first">
<!-- Name -->
<span class = "name" onclick = "window.location = '#';">
@Robert -
</span>
<!-- Text -->
<span class = "text">
Excellent trip to Italy. I enjoyed.
</span>
</div>
<!-- Text Container Other -->
<div class = "text-container-other">
<!-- Name -->
<span class = "name" onclick = "window.location = '#';">
@Sarah -
</span>
<!-- Text -->
<span class = "text">
Excellent trip to Canada. I enjoyed.
</span>
</div>
<!-- Text Container Other -->
<div class = "text-container-other">
<!-- Name -->
<span class = "name" onclick = "window.location = '#';">
@Michael -
</span>
<!-- Text -->
<span class = "text">
Excellent trip to South Korea. I enjoyed.
</span>
</div>
</div>
<!-- Right Two -->
<div class = "col-xxl-3 right-two">
<!-- Images -->
<div class = "images">
<!-- Images Area -->
<div class = "images-area row">
<!-- Image One -->
<div class = "col-xxl-6 image-one">
<!-- Img -->
<img class = "img-fluid" src = "Images/Footer/Instagram-One.webp" alt = "Instagram-One">
</div>
<!-- Image Two -->
<div class = "col-xxl-6 image-two">
<!-- Img -->
<img class = "img-fluid" src = "Images/Footer/Instagram-Two.webp" alt = "Instagram-Two">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Bottom -->
<div class = "bottom">
<div class = "left-middle">
<!-- Row Container -->
<div class = "row-container">
<!-- Bottom Area -->
<div class = "bottom-area row">
<!-- Left -->
<div class = "col-12 col-xxl-4 left order-second order-xxl-first">
<!-- Text Container -->
<div class = "text-container">
<!-- H2 -->
<h2>
AURORA-THEMES©, 2023
</h2>
</div>
</div>
<!-- Middle -->
<div class = "col-12 col-xxl-4 middle order-first order-xxl-second">
<!-- Social Container -->
<div class = "social-container">
<!-- Fb -->
<div class = "fb">
<!-- Img -->
<img class = "img-fluid" src = "Images/Footer/Fb.webp" alt = "Fb" onclick = "window.location = '#';">
</div>
<!-- Pinterest -->
<div class = "pinterest">
<!-- Img -->
<img class = "img-fluid" src = "Images/Footer/Pinterest.webp" alt = "Pinterest" onclick = "window.location = '#';">
</div>
<!-- Vimeo -->
<div class = "vimeo">
<!-- Img -->
<img class = "img-fluid" src = "Images/Footer/Vimeo.webp" alt = "Vimeo" onclick = "window.location = '#';">
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Right -->
<div class = "right">
<!-- Rectangle Container -->
<div class = "rectangle-container">
<!-- Rectangle -->
<div class = "rectangle">
<!-- Icon Container -->
<div class = "icon-container">
<!-- Img -->
<img class = "img-fluid" src = "Images/Footer/Up.webp" alt = "Up" onclick = "window.location = '#header-anchor';">
</div>
</div>
</div>
</div>
</div>
</footer>
constitutional-rights.html
Constitutional Rights
Code Lines: 323-1323
<!-- Blog - Exclusive Zone -->
<div class = "blogArea">
<!-- Content -->
<div class = "blogArea-content">
<!-- Navbar -->
<div class = "blogArea-content-navbar">
<!-- Content -->
<div class = "blogArea-content-navbar-content">
<!-- Logo -->
<div class = "blogArea-content-navbar-content-logo">
<!-- Content -->
<div class = "blogArea-content-navbar-content-logo-content" onclick = "window.location = '../index.html';">
<!-- Text Area -->
<h4>
<!-- Text, lexPrime -->
<span class = "blogArea-content-navbar-content-logo-content-h4-name">
lexPrime
</span>
<!-- Dot -->
<span class = "blogArea-content-navbar-content-logo-content-h4-dot logo-dot">
.
</span>
</h4>
</div>
</div>
<!-- Links -->
<div class = "blogArea-content-navbar-content-links">
<!-- Content -->
<div class = "blogArea-content-navbar-content-links-content">
<!-- Ul -->
<ul>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html">
Home
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a class = "blogArea-content-navbar-content-links-content-ul-li-about" href = "../index.html#about">
About
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#legal">
Expertise
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#services">
Services
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#blog">
Blog
</a>
</li>
<!-- Li -->
<li class = "blogArea-content-navbar-content-links-content-ul-contact">
<!-- A -->
<a href = "../index.html#contact">
Contact
</a>
</li>
</ul>
</div>
</div>
<!-- Chocolate Menu -->
<div class = "blogArea-content-navbar-content-chocolateMenu">
<!-- Close Button -->
<div class = "blogArea-content-navbar-content-chocolateMenu-close">
<!-- Content -->
<div class = "blogArea-content-navbar-content-chocolateMenu-close-content">
<!-- Icon -->
<img class = "img-fluid" src = "../Images/Header/Close.webp" alt = "Close">
</div>
</div>
<!-- Chocolate Menu, Content -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content">
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
</div>
</div>
<!-- Search Area -->
<div class = "blogArea-content-navbar-content-searchArea">
<!-- Content -->
<div class = "blogArea-content-navbar-content-searchArea-content">
<!-- Search -->
<div class = "blogArea-content-navbar-content-searchArea-content-search">
<!-- Content -->
<form class = "blogArea-content-navbar-content-searchArea-content-search-content">
<!-- Icon -->
<div class = "blogArea-content-navbar-content-searchArea-content-search-content-icon">
<!-- Content -->
<div class = "blogArea-content-navbar-content-searchArea-content-search-content-icon-content">
<!-- Icon, Img -->
<input alt = "searchIcon" class = "blogArea-content-navbar-content-searchArea-content-search-content-icon-content-img" name = "submit" onclick = "return false;" src = "../Images/Header/Search.webp" type = "image">
</div>
</div>
<!-- Field -->
<div class = "blogArea-content-navbar-content-searchArea-content-search-content-field">
<!-- Content -->
<div class = "blogArea-content-navbar-content-searchArea-content-search-content-field-content">
<!-- Input -->
<input class = "blogArea-content-navbar-content-searchArea-content-search-content-field-content-input" id = "searchArea" name = "search" type = "text">
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<!-- Chocolate Menu, Inside -->
<div class = "blogArea-content-chocolateMenuInside">
<!-- Content -->
<div class = "blogArea-content-chocolateMenuInside-content">
<!-- Ul -->
<ul>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html">
Home
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#about">
About
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#legal">
Expertise
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#services">
Services
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#blog">
Blog
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#contact">
Contact
</a>
</li>
</ul>
</div>
</div>
<!-- Heading Area -->
<div class = "blogArea-content-headingArea blogArea-content-headingAreaConstitution">
<!-- Content -->
<div class = "blogArea-content-headingArea-content">
<!-- Tags -->
<div class = "blogArea-content-headingArea-content-block">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-block-content">
<!-- Tag -->
<div class = "blogArea-content-headingArea-content-block-content-tag blogArea-content-headingArea-content-block-content-tagFirst">
<!-- Text -->
<h6>
Constitution
</h6>
</div>
<!-- Tag -->
<div class = "blogArea-content-headingArea-content-block-content-tag">
<!-- Text -->
<h6>
Rights
</h6>
</div>
</div>
</div>
<!-- Heading -->
<div class = "blogArea-content-headingArea-content-heading">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-heading-content">
<!-- Text -->
<h2>
What We Know About Our Constitutional Rights
</h2>
</div>
</div>
<!-- Line Area -->
<div class = "blogArea-content-headingArea-content-line">
<!-- Line -->
<div class = "blogArea-content-headingArea-content-line-content">
</div>
</div>
<!-- Author, Comments, Share -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content">
<!-- Author -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-author">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-author-content">
<!-- Img Area -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-author-content-img">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-author-content-img-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog/Author-02.webp" alt = "Author">
</div>
</div>
<!-- Author, Info -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-author-content-info">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-author-content-info-content">
<!-- Name -->
<h6>
Tamara Sioni
</h6>
<!-- Date -->
<h6>
04/03/2024
</h6>
</div>
</div>
</div>
</div>
<!-- Comments Area -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea">
<!-- Comments -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea-comments">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea-comments-content">
<!-- Icon -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea-comments-content-icon">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea-comments-content-icon-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Comments.webp" alt = "Comments">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea-comments-content-text">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea-comments-content-text-content">
<!-- Text -->
<h6>
02
</h6>
</div>
</div>
</div>
</div>
</div>
<!-- Share -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-share">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-share-content">
<!-- Icon -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Share.webp" alt = "Share" onclick = "window.location = '#';">
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Bottom Area -->
<div class = "blogArea-content-bottom">
<!-- Content -->
<div class = "blogArea-content-bottom-content">
<!-- Left -->
<div class = "blogArea-content-bottom-content-left">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content">
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-left-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-text-content">
<!-- Text -->
<h5 class = "blogArea-content-bottom-content-left-content-text-content-textZone">
We live in the modern world, where we discuss almost daily about many aspects of our rights in real life. But, what we know about human rights in general? Human rights are rights that belong to an individual or group of individuals simply for being human, or as a consequence of inherent human vulnerability, or because they are requisite to the possibility of a just society. Whatever their theoretical justification, human rights refer to a wide continuum of values or capabilities thought to enhance human agency or protect human interests and declared to be universal in character, in some sense equally claimed for all human beings, present and future. It is a common observation that human beings everywhere require the realization of diverse values or capabilities to ensure their individual and collective well-being. It also is a common observation that this requirement is often painfully frustrated by social forces.
</h5>
</div>
</div>
<!-- Line Area -->
<div class = "blogArea-content-bottom-content-left-content-line">
<!-- Line -->
<div class = "blogArea-content-bottom-content-left-content-line-content">
</div>
</div>
<!-- Author -->
<div class = "blogArea-content-bottom-content-left-content-author">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-author-content">
<!-- Img Area -->
<div class = "blogArea-content-bottom-content-left-content-author-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-author-content-img-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog/Author-02.webp" alt = "Author-2">
</div>
</div>
<!-- Name and Info -->
<div class = "blogArea-content-bottom-content-left-content-author-content-nameInfo">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-author-content-nameInfo-content">
<!-- Name -->
<div class = "blogArea-content-bottom-content-left-content-author-content-nameInfo-content-name">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-author-content-nameInfo-content-name-content">
<!-- Text -->
<h5>
Tamara Sioni
</h5>
</div>
</div>
<!-- Info -->
<div class = "blogArea-content-bottom-content-left-content-author-content-nameInfo-content-info">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-author-content-nameInfo-content-info-content">
<!-- Text -->
<h6>
Lawyer, mother and passionate about adventures. Tamara writes for many legal magazines around the country.
</h6>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Comments -->
<div class = "blogArea-content-bottom-content-left-content-comments">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-comments-content">
<!-- Text -->
<h4>
Comments
</h4>
</div>
</div>
<!-- Form Area -->
<div class = "blogArea-content-bottom-content-left-content-formArea">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-formArea-content">
<!-- Form -->
<form action = "../PHP/comments.php" class = "blogArea-content-bottom-content-left-content-formArea-content-form">
<div class = "blogArea-content-bottom-content-left-content-formArea-content-form-opinion">
<!-- Textarea -->
<textarea class = "blogArea-content-bottom-content-left-content-formArea-content-form-opinion-textarea" name = "commentsOpinion" placeholder = "Your Opinion..." required></textarea>
</div>
<!-- Submit Butoton Area -->
<div class = "blogArea-content-bottom-content-left-content-formArea-content-form-submit">
<!-- Button -->
<input class = "blogArea-content-bottom-content-left-content-formArea-content-form-submit-button" name = "submit" type = "submit" value = "SUBMIT">
</div>
</form>
</div>
</div>
<!-- Posts -->
<div class = "blogArea-content-bottom-content-left-content-posts">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content">
<!-- Author Img -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-img-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Diana-Palo.webp" alt = "Comment 1, Author">
</div>
</div>
<!-- Comment Area -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content">
<!-- Author Name and Options -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content">
<!-- Author Name -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-author">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-author-content">
<!-- Text -->
<h5>
DIANA PALO
</h5>
</div>
</div>
<!-- Options -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content">
<!-- Ellipse -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content-ellipse">
</div>
</div>
</div>
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-text-content">
<!-- Text -->
<h6>
Excellent text! However, I expect your new research in field of international law.
</h6>
</div>
</div>
<!-- Reply -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content">
<!-- Button -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content">
<!-- Icon -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-icon">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-icon-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Reply.webp" alt = "Reply">
</div>
</div>
<!-- Text Area, Button -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-text-content">
<!-- Text -->
<h6>
REPLY
</h6>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Author Img -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-img blogArea-content-bottom-content-left-content-posts-content-img-bottom">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-img-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Sean-Cuoco.webp" alt = "Comment 2, Author">
</div>
</div>
<!-- Comment Area -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea blogArea-content-bottom-content-left-content-posts-content-commentArea-bottom">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content">
<!-- Author Name and Options -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content">
<!-- Author Name -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-author">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-author-content">
<!-- Text -->
<h5>
SEAN CUOCO
</h5>
</div>
</div>
<!-- Options -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content">
<!-- Ellipse -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content-ellipse">
</div>
</div>
</div>
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-text-content">
<!-- Text -->
<h6>
I agree. Tamara is among the best legal writers in the country!
</h6>
</div>
</div>
<!-- Reply -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content">
<!-- Button -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content">
<!-- Icon -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-icon">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-icon-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Reply.webp" alt = "Reply">
</div>
</div>
<!-- Text Area, Button -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-text-content">
<!-- Text -->
<h6>
REPLY
</h6>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Right Side -->
<div class = "blogArea-content-bottom-content-right">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content">
<!-- Tags -->
<div class = "blogArea-content-bottom-content-right-content-block">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content">
<!-- Top -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content">
<!-- Heading -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content">
<!-- Icon and Tags -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText">
<!-- Icon -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-icon">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-icon-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Tags.webp" alt = "Tags">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-text-content">
<!-- Text -->
<h4>
TAGS
</h4>
</div>
</div>
</div>
<!-- See All -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-seeAll">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-seeAll-content">
<!-- Text -->
<h4>
See All
</h4>
</div>
</div>
</div>
<!-- Line Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea-content">
<!-- Line -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea-content-line">
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Tags, Bottom -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content">
<!-- Tag -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag">
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content">
<!-- Text -->
<h5>
Constitution
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content">
<!-- Text -->
<h5>
Constitutional
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content">
<!-- Text -->
<h5>
Human
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content">
<!-- Text -->
<h5>
Law
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content">
<!-- Text -->
<h5>
Rights
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content">
<!-- Text -->
<h5>
Social
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content-bottomArea">
<!-- Text -->
<h5>
Society
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content-bottomArea">
<!-- Text -->
<h5>
Universal
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content-bottomArea">
<!-- Text -->
<h5>
Values
</h5>
</div>
</div>
</div>
</div>
</div>
</div>
<div class = "blogArea-content-bottom-content-right-content-block blogArea-content-bottom-content-right-content-blockArticles">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content">
<!-- Top -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content">
<!-- Heading -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content">
<!-- Icon and Tags -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText">
<!-- Icon -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-icon">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-icon-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Articles.webp" alt = "Articles">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-text-content">
<!-- Text -->
<h4>
ARTICLES
</h4>
</div>
</div>
</div>
<!-- See All -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-seeAll">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-seeAll-content">
<!-- Text -->
<h4>
See All
</h4>
</div>
</div>
</div>
<!-- Line Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea-content">
<!-- Line -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea-content-line">
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Articles, Bottom -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content">
<!-- Block Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content">
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Constitution.webp" alt = "Constitution">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
Constitutional Rights
</h4>
</div>
</div>
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Human-Rights.webp" alt = "Human Rights">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
Human Rights
</h4>
</div>
</div>
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog-Inside/International-Law.webp" alt = "International-Law">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
International Law
</h4>
</div>
</div>
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog/Sea-Small.webp" alt = "International Sea Law">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
International Sea Law
</h4>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class = "blogArea-content-bottom-content-right-content-block blogArea-content-bottom-content-right-content-blockAuthors">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content">
<!-- Top -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content">
<!-- Heading -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content">
<!-- Icon and Tags -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText">
<!-- Icon -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-icon">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-icon-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Authors.webp" alt = "Authors">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-text-content">
<!-- Text -->
<h4>
AUTHORS
</h4>
</div>
</div>
</div>
<!-- See All -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-seeAll">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-seeAll-content">
<!-- Text -->
<h4>
See All
</h4>
</div>
</div>
</div>
<!-- Line Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea-content">
<!-- Line -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea-content-line">
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Authors, Bottom -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content">
<!-- Block Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content">
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog/Author-03.webp" alt = "David Witterte">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
David Witterte
</h4>
</div>
</div>
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog/Author-04.webp" alt = "Diana Mussi">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
Diana Mussi
</h4>
</div>
</div>
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog/Author-01.webp" alt = "Giuliano Rossi">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
Giuliano Rossi
</h4>
</div>
</div>
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog/Author-02.webp" alt = "Tamara Sioni">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
Tamara Sioni
</h4>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
exclusive-zone.html
Borders on the Sea
Code Lines: 323-1323
<!-- Blog - Exclusive Zone -->
<div class = "blogArea">
<!-- Content -->
<div class = "blogArea-content">
<!-- Navbar -->
<div class = "blogArea-content-navbar">
<!-- Content -->
<div class = "blogArea-content-navbar-content">
<!-- Logo -->
<div class = "blogArea-content-navbar-content-logo">
<!-- Content -->
<div class = "blogArea-content-navbar-content-logo-content" onclick = "window.location = '../index.html';">
<!-- Text Area -->
<h4>
<!-- Text, lexPrime -->
<span class = "blogArea-content-navbar-content-logo-content-h4-name">
lexPrime
</span>
<!-- Dot -->
<span class = "blogArea-content-navbar-content-logo-content-h4-dot logo-dot">
.
</span>
</h4>
</div>
</div>
<!-- Links -->
<div class = "blogArea-content-navbar-content-links">
<!-- Content -->
<div class = "blogArea-content-navbar-content-links-content">
<!-- Ul -->
<ul>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html">
Home
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a class = "blogArea-content-navbar-content-links-content-ul-li-about" href = "../index.html#about">
About
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#legal">
Expertise
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#services">
Services
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#blog">
Blog
</a>
</li>
<!-- Li -->
<li class = "blogArea-content-navbar-content-links-content-ul-contact">
<!-- A -->
<a href = "../index.html#contact">
Contact
</a>
</li>
</ul>
</div>
</div>
<!-- Chocolate Menu -->
<div class = "blogArea-content-navbar-content-chocolateMenu">
<!-- Close Button -->
<div class = "blogArea-content-navbar-content-chocolateMenu-close">
<!-- Content -->
<div class = "blogArea-content-navbar-content-chocolateMenu-close-content">
<!-- Icon -->
<img class = "img-fluid" src = "../Images/Header/Close.webp" alt = "Close">
</div>
</div>
<!-- Chocolate Menu, Content -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content">
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
</div>
</div>
<!-- Search Area -->
<div class = "blogArea-content-navbar-content-searchArea">
<!-- Content -->
<div class = "blogArea-content-navbar-content-searchArea-content">
<!-- Search -->
<div class = "blogArea-content-navbar-content-searchArea-content-search">
<!-- Content -->
<form class = "blogArea-content-navbar-content-searchArea-content-search-content">
<!-- Icon -->
<div class = "blogArea-content-navbar-content-searchArea-content-search-content-icon">
<!-- Content -->
<div class = "blogArea-content-navbar-content-searchArea-content-search-content-icon-content">
<!-- Icon, Img -->
<input alt = "searchIcon" class = "blogArea-content-navbar-content-searchArea-content-search-content-icon-content-img" name = "submit" onclick = "return false;" src = "../Images/Header/Search.webp" type = "image">
</div>
</div>
<!-- Field -->
<div class = "blogArea-content-navbar-content-searchArea-content-search-content-field">
<!-- Content -->
<div class = "blogArea-content-navbar-content-searchArea-content-search-content-field-content">
<!-- Input -->
<input class = "blogArea-content-navbar-content-searchArea-content-search-content-field-content-input" id = "searchArea" name = "search" type = "text">
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<!-- Chocolate Menu, Inside -->
<div class = "blogArea-content-chocolateMenuInside">
<!-- Content -->
<div class = "blogArea-content-chocolateMenuInside-content">
<!-- Ul -->
<ul>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html">
Home
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#about">
About
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#legal">
Expertise
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#services">
Services
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#blog">
Blog
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#contact">
Contact
</a>
</li>
</ul>
</div>
</div>
<!-- Heading Area -->
<div class = "blogArea-content-headingArea">
<!-- Content -->
<div class = "blogArea-content-headingArea-content">
<!-- Tags -->
<div class = "blogArea-content-headingArea-content-block">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-block-content">
<!-- Tag -->
<div class = "blogArea-content-headingArea-content-block-content-tag blogArea-content-headingArea-content-block-content-tagFirst">
<!-- Text -->
<h6>
International Law
</h6>
</div>
<!-- Tag -->
<div class = "blogArea-content-headingArea-content-block-content-tag">
<!-- Text -->
<h6>
Sea
</h6>
</div>
</div>
</div>
<!-- Heading -->
<div class = "blogArea-content-headingArea-content-heading">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-heading-content">
<!-- Text -->
<h2>
Exclusive Zone and Borders on the Sea
</h2>
</div>
</div>
<!-- Line Area -->
<div class = "blogArea-content-headingArea-content-line">
<!-- Line -->
<div class = "blogArea-content-headingArea-content-line-content">
</div>
</div>
<!-- Author, Comments, Share -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content">
<!-- Author -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-author">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-author-content">
<!-- Img Area -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-author-content-img">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-author-content-img-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Giuliano-Rossi.webp" alt = "Author">
</div>
</div>
<!-- Author, Info -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-author-content-info">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-author-content-info-content">
<!-- Name -->
<h6>
Giuliano Rossi
</h6>
<!-- Date -->
<h6>
04/03/2024
</h6>
</div>
</div>
</div>
</div>
<!-- Comments Area -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea">
<!-- Comments -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea-comments">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea-comments-content">
<!-- Icon -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea-comments-content-icon">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea-comments-content-icon-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Comments.webp" alt = "Comments">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea-comments-content-text">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea-comments-content-text-content">
<!-- Text -->
<h6>
02
</h6>
</div>
</div>
</div>
</div>
</div>
<!-- Share -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-share">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-share-content">
<!-- Icon -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Share.webp" alt = "Share" onclick = "window.location = '#';">
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Bottom Area -->
<div class = "blogArea-content-bottom">
<!-- Content -->
<div class = "blogArea-content-bottom-content">
<!-- Left -->
<div class = "blogArea-content-bottom-content-left">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content">
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-left-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-text-content">
<!-- Text -->
<h5 class = "blogArea-content-bottom-content-left-content-text-content-textZone">
One of the most important principle of the international law are rules about borders on the sea, and exclusive zone. It’s important that coastal states have stable rules about their borders on the sea. That’s because, we need to keep right of the free passage on the sea, but also to know the rules about exclusive right of the states in their exclusive area. Anyway, Law of the Sea is a branch of international law concerned with public order at sea. Much of this law is codified in the United Nations Convention on the Law of the Sea, signed Dec. 10, 1982. The convention, described as a “constitution for the oceans,” represents an attempt to codify international law regarding territorial waters, sea-lanes, and ocean resources. It came into force in 1994 after it had been ratified by the requisite 60 countries. By the early 21st century the convention had been ratified by more than 150 countries.
</h5>
</div>
</div>
<!-- Line Area -->
<div class = "blogArea-content-bottom-content-left-content-line">
<!-- Line -->
<div class = "blogArea-content-bottom-content-left-content-line-content">
</div>
</div>
<!-- Author -->
<div class = "blogArea-content-bottom-content-left-content-author">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-author-content">
<!-- Img Area -->
<div class = "blogArea-content-bottom-content-left-content-author-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-author-content-img-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Giuliano-Rossi.webp" alt = "Author-1">
</div>
</div>
<!-- Name and Info -->
<div class = "blogArea-content-bottom-content-left-content-author-content-nameInfo">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-author-content-nameInfo-content">
<!-- Name -->
<div class = "blogArea-content-bottom-content-left-content-author-content-nameInfo-content-name">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-author-content-nameInfo-content-name-content">
<!-- Text -->
<h5>
Giuliano Rossi
</h5>
</div>
</div>
<!-- Info -->
<div class = "blogArea-content-bottom-content-left-content-author-content-nameInfo-content-info">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-author-content-nameInfo-content-info-content">
<!-- Text -->
<h6>
Lawyer, father and passionate about adventures. Giuliano writes for many legal magazines around the country.
</h6>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Comments -->
<div class = "blogArea-content-bottom-content-left-content-comments">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-comments-content">
<!-- Text -->
<h4>
Comments
</h4>
</div>
</div>
<!-- Form Area -->
<div class = "blogArea-content-bottom-content-left-content-formArea">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-formArea-content">
<!-- Form -->
<form action = "../PHP/comments.php" class = "blogArea-content-bottom-content-left-content-formArea-content-form">
<div class = "blogArea-content-bottom-content-left-content-formArea-content-form-opinion">
<!-- Textarea -->
<textarea class = "blogArea-content-bottom-content-left-content-formArea-content-form-opinion-textarea" name = "commentsOpinion" placeholder = "Your Opinion..." required></textarea>
</div>
<!-- Submit Butoton Area -->
<div class = "blogArea-content-bottom-content-left-content-formArea-content-form-submit">
<!-- Button -->
<input class = "blogArea-content-bottom-content-left-content-formArea-content-form-submit-button" name = "submit" type = "submit" value = "SUBMIT">
</div>
</form>
</div>
</div>
<!-- Posts -->
<div class = "blogArea-content-bottom-content-left-content-posts">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content">
<!-- Author Img -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-img-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Diana-Palo.webp" alt = "Comment 1, Author">
</div>
</div>
<!-- Comment Area -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content">
<!-- Author Name and Options -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content">
<!-- Author Name -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-author">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-author-content">
<!-- Text -->
<h5>
DIANA PALO
</h5>
</div>
</div>
<!-- Options -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content">
<!-- Ellipse -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content-ellipse">
</div>
</div>
</div>
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-text-content">
<!-- Text -->
<h6>
Excellent text! However, I expect your new research in field of international law.
</h6>
</div>
</div>
<!-- Reply -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content">
<!-- Button -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content">
<!-- Icon -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-icon">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-icon-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Reply.webp" alt = "Reply">
</div>
</div>
<!-- Text Area, Button -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-text-content">
<!-- Text -->
<h6>
REPLY
</h6>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Author Img -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-img blogArea-content-bottom-content-left-content-posts-content-img-bottom">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-img-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Sean-Cuoco.webp" alt = "Comment 2, Author">
</div>
</div>
<!-- Comment Area -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea blogArea-content-bottom-content-left-content-posts-content-commentArea-bottom">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content">
<!-- Author Name and Options -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content">
<!-- Author Name -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-author">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-author-content">
<!-- Text -->
<h5>
SEAN CUOCO
</h5>
</div>
</div>
<!-- Options -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content">
<!-- Ellipse -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content-ellipse">
</div>
</div>
</div>
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-text-content">
<!-- Text -->
<h6>
I agree. Giuliano is among the best legal writers in the country!
</h6>
</div>
</div>
<!-- Reply -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content">
<!-- Button -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content">
<!-- Icon -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-icon">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-icon-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Reply.webp" alt = "Reply">
</div>
</div>
<!-- Text Area, Button -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-text-content">
<!-- Text -->
<h6>
REPLY
</h6>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Right Side -->
<div class = "blogArea-content-bottom-content-right">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content">
<!-- Tags -->
<div class = "blogArea-content-bottom-content-right-content-block">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content">
<!-- Top -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content">
<!-- Heading -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content">
<!-- Icon and Tags -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText">
<!-- Icon -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-icon">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-icon-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Tags.webp" alt = "Tags">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-text-content">
<!-- Text -->
<h4>
TAGS
</h4>
</div>
</div>
</div>
<!-- See All -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-seeAll">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-seeAll-content">
<!-- Text -->
<h4>
See All
</h4>
</div>
</div>
</div>
<!-- Line Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea-content">
<!-- Line -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea-content-line">
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Tags, Bottom -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content">
<!-- Tag -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag">
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content">
<!-- Text -->
<h5>
Borders
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content">
<!-- Text -->
<h5>
Constitution
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content">
<!-- Text -->
<h5>
Convention
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content">
<!-- Text -->
<h5>
Exclusive
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content">
<!-- Text -->
<h5>
International
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content">
<!-- Text -->
<h5>
Law
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content-bottomArea">
<!-- Text -->
<h5>
Oceans
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content-bottomArea">
<!-- Text -->
<h5>
Resources
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content-bottomArea">
<!-- Text -->
<h5>
Sea
</h5>
</div>
</div>
</div>
</div>
</div>
</div>
<div class = "blogArea-content-bottom-content-right-content-block blogArea-content-bottom-content-right-content-blockArticles">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content">
<!-- Top -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content">
<!-- Heading -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content">
<!-- Icon and Tags -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText">
<!-- Icon -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-icon">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-icon-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Articles.webp" alt = "Articles">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-text-content">
<!-- Text -->
<h4>
ARTICLES
</h4>
</div>
</div>
</div>
<!-- See All -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-seeAll">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-seeAll-content">
<!-- Text -->
<h4>
See All
</h4>
</div>
</div>
</div>
<!-- Line Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea-content">
<!-- Line -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea-content-line">
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Articles, Bottom -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content">
<!-- Block Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content">
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Constitution.webp" alt = "Constitution">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
Constitutional Rights
</h4>
</div>
</div>
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Human-Rights.webp" alt = "Human Rights">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
Human Rights
</h4>
</div>
</div>
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog-Inside/International-Law.webp" alt = "International-Law">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
International Law
</h4>
</div>
</div>
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog/Sea-Small.webp" alt = "International Sea Law">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
International Sea Law
</h4>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class = "blogArea-content-bottom-content-right-content-block blogArea-content-bottom-content-right-content-blockAuthors">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content">
<!-- Top -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content">
<!-- Heading -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content">
<!-- Icon and Tags -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText">
<!-- Icon -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-icon">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-icon-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Authors.webp" alt = "Authors">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-text-content">
<!-- Text -->
<h4>
AUTHORS
</h4>
</div>
</div>
</div>
<!-- See All -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-seeAll">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-seeAll-content">
<!-- Text -->
<h4>
See All
</h4>
</div>
</div>
</div>
<!-- Line Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea-content">
<!-- Line -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea-content-line">
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Authors, Bottom -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content">
<!-- Block Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content">
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog/Author-03.webp" alt = "David Witterte">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
David Witterte
</h4>
</div>
</div>
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog/Author-04.webp" alt = "Diana Mussi">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
Diana Mussi
</h4>
</div>
</div>
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog/Author-01.webp" alt = "Giuliano Rossi">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
Giuliano Rossi
</h4>
</div>
</div>
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog/Author-02.webp" alt = "Tamara Sioni">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
Tamara Sioni
</h4>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
human-rights.html
Human Rights
Code Lines: 323-1323
<!-- Blog - Exclusive Zone -->
<div class = "blogArea">
<!-- Content -->
<div class = "blogArea-content">
<!-- Navbar -->
<div class = "blogArea-content-navbar">
<!-- Content -->
<div class = "blogArea-content-navbar-content">
<!-- Logo -->
<div class = "blogArea-content-navbar-content-logo">
<!-- Content -->
<div class = "blogArea-content-navbar-content-logo-content" onclick = "window.location = '../index.html';">
<!-- Text Area -->
<h4>
<!-- Text, lexPrime -->
<span class = "blogArea-content-navbar-content-logo-content-h4-name">
lexPrime
</span>
<!-- Dot -->
<span class = "blogArea-content-navbar-content-logo-content-h4-dot logo-dot">
.
</span>
</h4>
</div>
</div>
<!-- Links -->
<div class = "blogArea-content-navbar-content-links">
<!-- Content -->
<div class = "blogArea-content-navbar-content-links-content">
<!-- Ul -->
<ul>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html">
Home
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a class = "blogArea-content-navbar-content-links-content-ul-li-about" href = "../index.html#about">
About
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#legal">
Expertise
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#services">
Services
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#blog">
Blog
</a>
</li>
<!-- Li -->
<li class = "blogArea-content-navbar-content-links-content-ul-contact">
<!-- A -->
<a href = "../index.html#contact">
Contact
</a>
</li>
</ul>
</div>
</div>
<!-- Chocolate Menu -->
<div class = "blogArea-content-navbar-content-chocolateMenu">
<!-- Close Button -->
<div class = "blogArea-content-navbar-content-chocolateMenu-close">
<!-- Content -->
<div class = "blogArea-content-navbar-content-chocolateMenu-close-content">
<!-- Icon -->
<img class = "img-fluid" src = "../Images/Header/Close.webp" alt = "Close">
</div>
</div>
<!-- Chocolate Menu, Content -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content">
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
</div>
</div>
<!-- Search Area -->
<div class = "blogArea-content-navbar-content-searchArea">
<!-- Content -->
<div class = "blogArea-content-navbar-content-searchArea-content">
<!-- Search -->
<div class = "blogArea-content-navbar-content-searchArea-content-search">
<!-- Content -->
<form class = "blogArea-content-navbar-content-searchArea-content-search-content">
<!-- Icon -->
<div class = "blogArea-content-navbar-content-searchArea-content-search-content-icon">
<!-- Content -->
<div class = "blogArea-content-navbar-content-searchArea-content-search-content-icon-content">
<!-- Icon, Img -->
<input alt = "searchIcon" class = "blogArea-content-navbar-content-searchArea-content-search-content-icon-content-img" name = "submit" onclick = "return false;" src = "../Images/Header/Search.webp" type = "image">
</div>
</div>
<!-- Field -->
<div class = "blogArea-content-navbar-content-searchArea-content-search-content-field">
<!-- Content -->
<div class = "blogArea-content-navbar-content-searchArea-content-search-content-field-content">
<!-- Input -->
<input class = "blogArea-content-navbar-content-searchArea-content-search-content-field-content-input" id = "searchArea" name = "search" type = "text">
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<!-- Chocolate Menu, Inside -->
<div class = "blogArea-content-chocolateMenuInside">
<!-- Content -->
<div class = "blogArea-content-chocolateMenuInside-content">
<!-- Ul -->
<ul>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html">
Home
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#about">
About
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#legal">
Expertise
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#services">
Services
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#blog">
Blog
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#contact">
Contact
</a>
</li>
</ul>
</div>
</div>
<!-- Heading Area -->
<div class = "blogArea-content-headingArea blogArea-content-headingAreaHumanRights">
<!-- Content -->
<div class = "blogArea-content-headingArea-content">
<!-- Tags -->
<div class = "blogArea-content-headingArea-content-block">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-block-content">
<!-- Tag -->
<div class = "blogArea-content-headingArea-content-block-content-tag blogArea-content-headingArea-content-block-content-tagFirst">
<!-- Text -->
<h6>
Human
</h6>
</div>
<!-- Tag -->
<div class = "blogArea-content-headingArea-content-block-content-tag">
<!-- Text -->
<h6>
Rights
</h6>
</div>
</div>
</div>
<!-- Heading -->
<div class = "blogArea-content-headingArea-content-heading">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-heading-content">
<!-- Text -->
<h2>
Human Rights in the Modern World
</h2>
</div>
</div>
<!-- Line Area -->
<div class = "blogArea-content-headingArea-content-line">
<!-- Line -->
<div class = "blogArea-content-headingArea-content-line-content">
</div>
</div>
<!-- Author, Comments, Share -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content">
<!-- Author -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-author">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-author-content">
<!-- Img Area -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-author-content-img">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-author-content-img-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog/Author-03.webp" alt = "Author">
</div>
</div>
<!-- Author, Info -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-author-content-info">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-author-content-info-content">
<!-- Name -->
<h6>
David Witterte
</h6>
<!-- Date -->
<h6>
04/03/2024
</h6>
</div>
</div>
</div>
</div>
<!-- Comments Area -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea">
<!-- Comments -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea-comments">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea-comments-content">
<!-- Icon -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea-comments-content-icon">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea-comments-content-icon-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Comments.webp" alt = "Comments">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea-comments-content-text">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea-comments-content-text-content">
<!-- Text -->
<h6>
02
</h6>
</div>
</div>
</div>
</div>
</div>
<!-- Share -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-share">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-share-content">
<!-- Icon -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Share.webp" alt = "Share" onclick = "window.location = '#';">
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Bottom Area -->
<div class = "blogArea-content-bottom">
<!-- Content -->
<div class = "blogArea-content-bottom-content">
<!-- Left -->
<div class = "blogArea-content-bottom-content-left">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content">
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-left-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-text-content">
<!-- Text -->
<h5 class = "blogArea-content-bottom-content-left-content-text-content-textZone">
In modern era, human rights are on the top of many agendas, and on the other hand, we are still struggling to provide these for people around the world. Whatever the current attitudes and policies of governments, the reality of popular demands for human rights, including both greater economic justice and greater political freedom, is beyond debate. A deepening and widening concern for the promotion and protection of human rights on all fronts, hastened by the ideal of self-determination in a postcolonial era, is now unmistakably woven into the fabric of contemporary world affairs. Substantially responsible for this progressive development has been the work of the UN, its allied agencies, and such regional organizations as the Council of Europe, the OAS, and the AU. Also contributing to this development, particularly since the 1970s and ’80s, have been six other salient factors.
</h5>
</div>
</div>
<!-- Line Area -->
<div class = "blogArea-content-bottom-content-left-content-line">
<!-- Line -->
<div class = "blogArea-content-bottom-content-left-content-line-content">
</div>
</div>
<!-- Author -->
<div class = "blogArea-content-bottom-content-left-content-author">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-author-content">
<!-- Img Area -->
<div class = "blogArea-content-bottom-content-left-content-author-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-author-content-img-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog/Author-03.webp" alt = "Author-3">
</div>
</div>
<!-- Name and Info -->
<div class = "blogArea-content-bottom-content-left-content-author-content-nameInfo">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-author-content-nameInfo-content">
<!-- Name -->
<div class = "blogArea-content-bottom-content-left-content-author-content-nameInfo-content-name">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-author-content-nameInfo-content-name-content">
<!-- Text -->
<h5>
David Witterte
</h5>
</div>
</div>
<!-- Info -->
<div class = "blogArea-content-bottom-content-left-content-author-content-nameInfo-content-info">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-author-content-nameInfo-content-info-content">
<!-- Text -->
<h6>
Lawyer, father and passionate about adventures. David writes for many legal magazines around the country.
</h6>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Comments -->
<div class = "blogArea-content-bottom-content-left-content-comments">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-comments-content">
<!-- Text -->
<h4>
Comments
</h4>
</div>
</div>
<!-- Form Area -->
<div class = "blogArea-content-bottom-content-left-content-formArea">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-formArea-content">
<!-- Form -->
<form action = "../PHP/comments.php" class = "blogArea-content-bottom-content-left-content-formArea-content-form">
<div class = "blogArea-content-bottom-content-left-content-formArea-content-form-opinion">
<!-- Textarea -->
<textarea class = "blogArea-content-bottom-content-left-content-formArea-content-form-opinion-textarea" name = "commentsOpinion" placeholder = "Your Opinion..." required></textarea>
</div>
<!-- Submit Butoton Area -->
<div class = "blogArea-content-bottom-content-left-content-formArea-content-form-submit">
<!-- Button -->
<input class = "blogArea-content-bottom-content-left-content-formArea-content-form-submit-button" name = "submit" type = "submit" value = "SUBMIT">
</div>
</form>
</div>
</div>
<!-- Posts -->
<div class = "blogArea-content-bottom-content-left-content-posts">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content">
<!-- Author Img -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-img-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Diana-Palo.webp" alt = "Comment 1, Author">
</div>
</div>
<!-- Comment Area -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content">
<!-- Author Name and Options -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content">
<!-- Author Name -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-author">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-author-content">
<!-- Text -->
<h5>
DIANA PALO
</h5>
</div>
</div>
<!-- Options -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content">
<!-- Ellipse -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content-ellipse">
</div>
</div>
</div>
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-text-content">
<!-- Text -->
<h6>
Excellent text! However, I expect your new research in field of international law.
</h6>
</div>
</div>
<!-- Reply -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content">
<!-- Button -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content">
<!-- Icon -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-icon">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-icon-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Reply.webp" alt = "Reply">
</div>
</div>
<!-- Text Area, Button -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-text-content">
<!-- Text -->
<h6>
REPLY
</h6>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Author Img -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-img blogArea-content-bottom-content-left-content-posts-content-img-bottom">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-img-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Sean-Cuoco.webp" alt = "Comment 2, Author">
</div>
</div>
<!-- Comment Area -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea blogArea-content-bottom-content-left-content-posts-content-commentArea-bottom">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content">
<!-- Author Name and Options -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content">
<!-- Author Name -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-author">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-author-content">
<!-- Text -->
<h5>
SEAN CUOCO
</h5>
</div>
</div>
<!-- Options -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content">
<!-- Ellipse -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content-ellipse">
</div>
</div>
</div>
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-text-content">
<!-- Text -->
<h6>
I agree. David is among the best legal writers in the country!
</h6>
</div>
</div>
<!-- Reply -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content">
<!-- Button -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content">
<!-- Icon -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-icon">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-icon-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Reply.webp" alt = "Reply">
</div>
</div>
<!-- Text Area, Button -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-text-content">
<!-- Text -->
<h6>
REPLY
</h6>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Right Side -->
<div class = "blogArea-content-bottom-content-right">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content">
<!-- Tags -->
<div class = "blogArea-content-bottom-content-right-content-block">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content">
<!-- Top -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content">
<!-- Heading -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content">
<!-- Icon and Tags -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText">
<!-- Icon -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-icon">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-icon-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Tags.webp" alt = "Tags">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-text-content">
<!-- Text -->
<h4>
TAGS
</h4>
</div>
</div>
</div>
<!-- See All -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-seeAll">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-seeAll-content">
<!-- Text -->
<h4>
See All
</h4>
</div>
</div>
</div>
<!-- Line Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea-content">
<!-- Line -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea-content-line">
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Tags, Bottom -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content">
<!-- Tag -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag">
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content">
<!-- Text -->
<h5>
Era
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content">
<!-- Text -->
<h5>
Europe
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content">
<!-- Text -->
<h5>
Freedom
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content">
<!-- Text -->
<h5>
Human
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content">
<!-- Text -->
<h5>
Modern
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content">
<!-- Text -->
<h5>
Protection
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content-bottomArea">
<!-- Text -->
<h5>
Rights
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content-bottomArea">
<!-- Text -->
<h5>
UN
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content-bottomArea">
<!-- Text -->
<h5>
World
</h5>
</div>
</div>
</div>
</div>
</div>
</div>
<div class = "blogArea-content-bottom-content-right-content-block blogArea-content-bottom-content-right-content-blockArticles">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content">
<!-- Top -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content">
<!-- Heading -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content">
<!-- Icon and Tags -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText">
<!-- Icon -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-icon">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-icon-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Articles.webp" alt = "Articles">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-text-content">
<!-- Text -->
<h4>
ARTICLES
</h4>
</div>
</div>
</div>
<!-- See All -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-seeAll">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-seeAll-content">
<!-- Text -->
<h4>
See All
</h4>
</div>
</div>
</div>
<!-- Line Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea-content">
<!-- Line -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea-content-line">
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Articles, Bottom -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content">
<!-- Block Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content">
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Constitution.webp" alt = "Constitution">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
Constitutional Rights
</h4>
</div>
</div>
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Human-Rights.webp" alt = "Human Rights">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
Human Rights
</h4>
</div>
</div>
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog-Inside/International-Law.webp" alt = "International-Law">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
International Law
</h4>
</div>
</div>
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog/Sea-Small.webp" alt = "International Sea Law">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
International Sea Law
</h4>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class = "blogArea-content-bottom-content-right-content-block blogArea-content-bottom-content-right-content-blockAuthors">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content">
<!-- Top -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content">
<!-- Heading -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content">
<!-- Icon and Tags -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText">
<!-- Icon -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-icon">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-icon-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Authors.webp" alt = "Authors">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-text-content">
<!-- Text -->
<h4>
AUTHORS
</h4>
</div>
</div>
</div>
<!-- See All -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-seeAll">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-seeAll-content">
<!-- Text -->
<h4>
See All
</h4>
</div>
</div>
</div>
<!-- Line Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea-content">
<!-- Line -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea-content-line">
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Authors, Bottom -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content">
<!-- Block Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content">
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog/Author-03.webp" alt = "David Witterte">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
David Witterte
</h4>
</div>
</div>
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog/Author-04.webp" alt = "Diana Mussi">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
Diana Mussi
</h4>
</div>
</div>
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog/Author-01.webp" alt = "Giuliano Rossi">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
Giuliano Rossi
</h4>
</div>
</div>
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog/Author-02.webp" alt = "Tamara Sioni">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
Tamara Sioni
</h4>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
international-law.html
International Law
Code Lines: 323-1323
<!-- Blog - Exclusive Zone -->
<div class = "blogArea">
<!-- Content -->
<div class = "blogArea-content">
<!-- Navbar -->
<div class = "blogArea-content-navbar">
<!-- Content -->
<div class = "blogArea-content-navbar-content">
<!-- Logo -->
<div class = "blogArea-content-navbar-content-logo">
<!-- Content -->
<div class = "blogArea-content-navbar-content-logo-content" onclick = "window.location = '../index.html';">
<!-- Text Area -->
<h4>
<!-- Text, lexPrime -->
<span class = "blogArea-content-navbar-content-logo-content-h4-name">
lexPrime
</span>
<!-- Dot -->
<span class = "blogArea-content-navbar-content-logo-content-h4-dot logo-dot">
.
</span>
</h4>
</div>
</div>
<!-- Links -->
<div class = "blogArea-content-navbar-content-links">
<!-- Content -->
<div class = "blogArea-content-navbar-content-links-content">
<!-- Ul -->
<ul>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html">
Home
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a class = "blogArea-content-navbar-content-links-content-ul-li-about" href = "../index.html#about">
About
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#legal">
Expertise
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#services">
Services
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#blog">
Blog
</a>
</li>
<!-- Li -->
<li class = "blogArea-content-navbar-content-links-content-ul-contact">
<!-- A -->
<a href = "../index.html#contact">
Contact
</a>
</li>
</ul>
</div>
</div>
<!-- Chocolate Menu -->
<div class = "blogArea-content-navbar-content-chocolateMenu">
<!-- Close Button -->
<div class = "blogArea-content-navbar-content-chocolateMenu-close">
<!-- Content -->
<div class = "blogArea-content-navbar-content-chocolateMenu-close-content">
<!-- Icon -->
<img class = "img-fluid" src = "../Images/Header/Close.webp" alt = "Close">
</div>
</div>
<!-- Chocolate Menu, Content -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content">
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-navbar-content-chocolateMenu-content-ellipse">
</div>
</div>
</div>
<!-- Search Area -->
<div class = "blogArea-content-navbar-content-searchArea">
<!-- Content -->
<div class = "blogArea-content-navbar-content-searchArea-content">
<!-- Search -->
<div class = "blogArea-content-navbar-content-searchArea-content-search">
<!-- Content -->
<form class = "blogArea-content-navbar-content-searchArea-content-search-content">
<!-- Icon -->
<div class = "blogArea-content-navbar-content-searchArea-content-search-content-icon">
<!-- Content -->
<div class = "blogArea-content-navbar-content-searchArea-content-search-content-icon-content">
<!-- Icon, Img -->
<input alt = "searchIcon" class = "blogArea-content-navbar-content-searchArea-content-search-content-icon-content-img" name = "submit" onclick = "return false;" src = "../Images/Header/Search.webp" type = "image">
</div>
</div>
<!-- Field -->
<div class = "blogArea-content-navbar-content-searchArea-content-search-content-field">
<!-- Content -->
<div class = "blogArea-content-navbar-content-searchArea-content-search-content-field-content">
<!-- Input -->
<input class = "blogArea-content-navbar-content-searchArea-content-search-content-field-content-input" id = "searchArea" name = "search" type = "text">
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<!-- Chocolate Menu, Inside -->
<div class = "blogArea-content-chocolateMenuInside">
<!-- Content -->
<div class = "blogArea-content-chocolateMenuInside-content">
<!-- Ul -->
<ul>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html">
Home
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#about">
About
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#legal">
Expertise
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#services">
Services
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#blog">
Blog
</a>
</li>
<!-- Li -->
<li>
<!-- A -->
<a href = "../index.html#contact">
Contact
</a>
</li>
</ul>
</div>
</div>
<!-- Heading Area -->
<div class = "blogArea-content-headingArea blogArea-content-headingAreaInternationalLaw">
<!-- Content -->
<div class = "blogArea-content-headingArea-content">
<!-- Tags -->
<div class = "blogArea-content-headingArea-content-block">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-block-content">
<!-- Tag -->
<div class = "blogArea-content-headingArea-content-block-content-tag blogArea-content-headingArea-content-block-content-tagFirst">
<!-- Text -->
<h6>
International
</h6>
</div>
<!-- Tag -->
<div class = "blogArea-content-headingArea-content-block-content-tag">
<!-- Text -->
<h6>
Law
</h6>
</div>
</div>
</div>
<!-- Heading -->
<div class = "blogArea-content-headingArea-content-heading">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-heading-content">
<!-- Text -->
<h2>
Development of International Law
</h2>
</div>
</div>
<!-- Line Area -->
<div class = "blogArea-content-headingArea-content-line">
<!-- Line -->
<div class = "blogArea-content-headingArea-content-line-content">
</div>
</div>
<!-- Author, Comments, Share -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content">
<!-- Author -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-author">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-author-content">
<!-- Img Area -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-author-content-img">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-author-content-img-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog/Author-04.webp" alt = "Author">
</div>
</div>
<!-- Author, Info -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-author-content-info">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-author-content-info-content">
<!-- Name -->
<h6>
Diana Mussi
</h6>
<!-- Date -->
<h6>
04/03/2024
</h6>
</div>
</div>
</div>
</div>
<!-- Comments Area -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea">
<!-- Comments -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea-comments">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea-comments-content">
<!-- Icon -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea-comments-content-icon">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea-comments-content-icon-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Comments.webp" alt = "Comments">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea-comments-content-text">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea-comments-content-text-content">
<!-- Text -->
<h6>
02
</h6>
</div>
</div>
</div>
</div>
</div>
<!-- Share -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-share">
<!-- Content -->
<div class = "blogArea-content-headingArea-content-authorCommentsShare-content-share-content">
<!-- Icon -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Share.webp" alt = "Share" onclick = "window.location = '#';">
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Bottom Area -->
<div class = "blogArea-content-bottom">
<!-- Content -->
<div class = "blogArea-content-bottom-content">
<!-- Left -->
<div class = "blogArea-content-bottom-content-left">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content">
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-left-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-text-content">
<!-- Text -->
<h5 class = "blogArea-content-bottom-content-left-content-text-content-textZone">
International law has long roots in the history, but main development phase was after second world war. The essential structure of international law was mapped out during the European Renaissance, though its origins lay deep in history and can be traced to cooperative agreements between peoples in the ancient Middle East. Among the earliest of these agreements were a treaty between the rulers of Lagash and Umma (in the area of Mesopotamia) in approximately 2100 bce and an agreement between the Egyptian pharaoh Ramses II and Hattusilis III, the king of the Hittites, concluded in 1258 bce. A number of pacts were subsequently negotiated by various Middle Eastern empires. The long and rich cultural traditions of ancient Israel, the Indian subcontinent, and China were also vital in the development of international law.
</h5>
</div>
</div>
<!-- Line Area -->
<div class = "blogArea-content-bottom-content-left-content-line">
<!-- Line -->
<div class = "blogArea-content-bottom-content-left-content-line-content">
</div>
</div>
<!-- Author -->
<div class = "blogArea-content-bottom-content-left-content-author">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-author-content">
<!-- Img Area -->
<div class = "blogArea-content-bottom-content-left-content-author-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-author-content-img-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog/Author-04.webp" alt = "Author-4">
</div>
</div>
<!-- Name and Info -->
<div class = "blogArea-content-bottom-content-left-content-author-content-nameInfo">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-author-content-nameInfo-content">
<!-- Name -->
<div class = "blogArea-content-bottom-content-left-content-author-content-nameInfo-content-name">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-author-content-nameInfo-content-name-content">
<!-- Text -->
<h5>
Diana Mussi
</h5>
</div>
</div>
<!-- Info -->
<div class = "blogArea-content-bottom-content-left-content-author-content-nameInfo-content-info">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-author-content-nameInfo-content-info-content">
<!-- Text -->
<h6>
Lawyer, mother and passionate about adventures. Diana writes for many legal magazines around the country.
</h6>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Comments -->
<div class = "blogArea-content-bottom-content-left-content-comments">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-comments-content">
<!-- Text -->
<h4>
Comments
</h4>
</div>
</div>
<!-- Form Area -->
<div class = "blogArea-content-bottom-content-left-content-formArea">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-formArea-content">
<!-- Form -->
<form action = "../PHP/comments.php" class = "blogArea-content-bottom-content-left-content-formArea-content-form">
<div class = "blogArea-content-bottom-content-left-content-formArea-content-form-opinion">
<!-- Textarea -->
<textarea class = "blogArea-content-bottom-content-left-content-formArea-content-form-opinion-textarea" name = "commentsOpinion" placeholder = "Your Opinion..." required></textarea>
</div>
<!-- Submit Butoton Area -->
<div class = "blogArea-content-bottom-content-left-content-formArea-content-form-submit">
<!-- Button -->
<input class = "blogArea-content-bottom-content-left-content-formArea-content-form-submit-button" name = "submit" type = "submit" value = "SUBMIT">
</div>
</form>
</div>
</div>
<!-- Posts -->
<div class = "blogArea-content-bottom-content-left-content-posts">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content">
<!-- Author Img -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-img-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Diana-Palo.webp" alt = "Comment 1, Author">
</div>
</div>
<!-- Comment Area -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content">
<!-- Author Name and Options -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content">
<!-- Author Name -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-author">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-author-content">
<!-- Text -->
<h5>
DIANA PALO
</h5>
</div>
</div>
<!-- Options -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content">
<!-- Ellipse -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content-ellipse">
</div>
</div>
</div>
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-text-content">
<!-- Text -->
<h6>
Excellent text! However, I expect your new research in field of international law.
</h6>
</div>
</div>
<!-- Reply -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content">
<!-- Button -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content">
<!-- Icon -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-icon">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-icon-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Reply.webp" alt = "Reply">
</div>
</div>
<!-- Text Area, Button -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-text-content">
<!-- Text -->
<h6>
REPLY
</h6>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Author Img -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-img blogArea-content-bottom-content-left-content-posts-content-img-bottom">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-img-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Sean-Cuoco.webp" alt = "Comment 2, Author">
</div>
</div>
<!-- Comment Area -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea blogArea-content-bottom-content-left-content-posts-content-commentArea-bottom">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content">
<!-- Author Name and Options -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content">
<!-- Author Name -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-author">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-author-content">
<!-- Text -->
<h5>
SEAN CUOCO
</h5>
</div>
</div>
<!-- Options -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content">
<!-- Ellipse -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content-ellipse">
</div>
<!-- Ellipse -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content-ellipse">
</div>
</div>
</div>
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-text-content">
<!-- Text -->
<h6>
I agree. David is among the best legal writers in the country!
</h6>
</div>
</div>
<!-- Reply -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content">
<!-- Button -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content">
<!-- Icon -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-icon">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-icon-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Reply.webp" alt = "Reply">
</div>
</div>
<!-- Text Area, Button -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-text-content">
<!-- Text -->
<h6>
REPLY
</h6>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Right Side -->
<div class = "blogArea-content-bottom-content-right">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content">
<!-- Tags -->
<div class = "blogArea-content-bottom-content-right-content-block">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content">
<!-- Top -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content">
<!-- Heading -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content">
<!-- Icon and Tags -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText">
<!-- Icon -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-icon">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-icon-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Tags.webp" alt = "Tags">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-text-content">
<!-- Text -->
<h4>
TAGS
</h4>
</div>
</div>
</div>
<!-- See All -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-seeAll">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-seeAll-content">
<!-- Text -->
<h4>
See All
</h4>
</div>
</div>
</div>
<!-- Line Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea-content">
<!-- Line -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea-content-line">
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Tags, Bottom -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content">
<!-- Tag -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag">
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content">
<!-- Text -->
<h5>
Agreements
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content">
<!-- Text -->
<h5>
Egypt
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content">
<!-- Text -->
<h5>
Europe
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content">
<!-- Text -->
<h5>
History
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content">
<!-- Text -->
<h5>
International
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content">
<!-- Text -->
<h5>
Lagash
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content-bottomArea">
<!-- Text -->
<h5>
Law
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content-bottomArea">
<!-- Text -->
<h5>
Mesopotamia
</h5>
</div>
<!-- Tag, Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content-bottomArea">
<!-- Text -->
<h5>
Renaissance
</h5>
</div>
</div>
</div>
</div>
</div>
</div>
<div class = "blogArea-content-bottom-content-right-content-block blogArea-content-bottom-content-right-content-blockArticles">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content">
<!-- Top -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content">
<!-- Heading -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content">
<!-- Icon and Tags -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText">
<!-- Icon -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-icon">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-icon-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Articles.webp" alt = "Articles">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-text-content">
<!-- Text -->
<h4>
ARTICLES
</h4>
</div>
</div>
</div>
<!-- See All -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-seeAll">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-seeAll-content">
<!-- Text -->
<h4>
See All
</h4>
</div>
</div>
</div>
<!-- Line Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea-content">
<!-- Line -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea-content-line">
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Articles, Bottom -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content">
<!-- Block Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content">
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Constitution.webp" alt = "Constitution">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
Constitutional Rights
</h4>
</div>
</div>
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Human-Rights.webp" alt = "Human Rights">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
Human Rights
</h4>
</div>
</div>
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog-Inside/International-Law.webp" alt = "International-Law">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
International Law
</h4>
</div>
</div>
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog/Sea-Small.webp" alt = "International Sea Law">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
International Sea Law
</h4>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class = "blogArea-content-bottom-content-right-content-block blogArea-content-bottom-content-right-content-blockAuthors">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content">
<!-- Top -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content">
<!-- Heading -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content">
<!-- Icon and Tags -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText">
<!-- Icon -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-icon">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-icon-content">
<!-- Img -->
<img class = "img-fluid" src = "../Images/Blog-Inside/Authors.webp" alt = "Authors">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-text-content">
<!-- Text -->
<h4>
AUTHORS
</h4>
</div>
</div>
</div>
<!-- See All -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-seeAll">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-seeAll-content">
<!-- Text -->
<h4>
See All
</h4>
</div>
</div>
</div>
<!-- Line Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea-content">
<!-- Line -->
<div class = "blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea-content-line">
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Authors, Bottom -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content">
<!-- Block Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content">
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog/Author-03.webp" alt = "David Witterte">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
David Witterte
</h4>
</div>
</div>
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog/Author-04.webp" alt = "Diana Mussi">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
Diana Mussi
</h4>
</div>
</div>
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog/Author-01.webp" alt = "Giuliano Rossi">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
Giuliano Rossi
</h4>
</div>
</div>
<!-- Image Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content">
<!-- Image -->
<img class = "img-fluid" src = "../Images/Blog/Author-02.webp" alt = "Tamara Sioni">
</div>
</div>
<!-- Text Area -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text">
<!-- Content -->
<div class = "blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content">
<!-- Text -->
<h4>
Tamara Sioni
</h4>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
SCSS
If you need to change styling of this web template, you use SCSS files. In this documentation you can find more about colors, fonts, mixins, variables, imports and containers, but if you need to make more serious changes, you are free to ask for help and support. Also, there are comments within the SCSS code for easier orientation. Notice: code section is without media queries. For changes within media queries part, be free to ask for support.
Layout - Twilight
about.scss
About
Code Lines: 35-225
// Section - About
.about
{
// Content
.about-content
{
margin:0 105px 0 105px;
padding:0;
// Bottom Part
.about-content-bottom
{
background:$about-bottom-row-background;
margin:105px 0 0 0;
padding:50px 0 50px 0;
position:relative;
right:105px;
width:calc(100% + 210px);
// Column (Principles, Culture, Legal)
.about-content-bottom-column
{
margin:0;
padding:0;
.about-content-bottom-column-container
{
.about-content-bottom-column-container-headingContainer
{
h2
{
color:$about-light-bottom-row-heading;
}
}
.about-content-bottom-column-container-textContainer
{
h4
{
color:$about-bottom-row-text;
}
}
}
}
}
// Top
.about-content-top
{
margin:0;
padding:0;
// Image Area
.about-content-top-image
{
margin:0;
padding:0;
// Image Container
.about-content-top-image-container
{
font-size:0;
margin:0;
padding:0;
position:relative;
// Dark Layer Over Image
.about-content-top-image-container-layer
{
background:$about-image-layer;
height:100%;
left:0;
position:absolute;
top:0;
width:100%;
}
// Play - Video
.about-content-top-image-container-play
{
align-items:center;
display:flex;
height:100%;
justify-content:center;
left:0;
position:absolute;
top:0;
width:100%;
// Play Container
.about-content-top-image-container-play-container
{
// Icon
display:inline-block;
img
{
cursor:pointer;
height:auto;
width:100px;
}
}
}
// Image
img
{
height:auto;
margin:0;
padding:0;
width:960px;
}
}
}
// Text Area
.about-content-top-text
{
align-items:center;
display:flex;
margin:0;
padding:0;
// Text Area Container
.about-content-top-text-container
{
margin:0 0 0 71px;
padding:0;
// Heading
.about-content-top-text-container-heading
{
margin:0;
padding:0;
// Heading, Content
.about-content-top-text-container-heading-content
{
// Line
.about-content-top-text-container-heading-content-line
{
// Area of the Line
.about-content-top-text-container-heading-content-line-area
{
background:$about-line;
height:5px;
width:124px;
}
}
// Heading, Text
.about-content-top-text-container-heading-content-text
{
margin:15px 0 0 0;
h2
{
font-size:35px;
}
}
}
}
// Text, Info
.about-content-top-text-container-longText
{
margin:20px 0 0 0;
width:100%;
}
// Short Text
.about-content-top-text-container-shortText
{
background:$about-shortText-container;
border-left:10px solid $about-shortText-border;
box-shadow:7px 7px 7px $about-shortText-container-shadow;
margin:37px 0 0 0;
padding:25px;
// Container for Short Text
.about-content-top-text-container-shortText-container
{
// Text
h2
{
color:$about-light-shortText;
display:inline-block;
font-family:oleoScript-regular;
font-size:30px;
font-style:italic;
}
}
}
// Signature
.about-content-top-text-container-signature
{
margin:70px 0 0 0;
// Signature Container
.about-content-top-text-container-signature-container
{
// Text
h2
{
font-family:dancingScript-medium;
}
}
}
}
}
}
}
}
blog-content.scss
Blogs (Inside)
Code Lines: 171-1239
// Blog Area
.blogArea
{
// Content
.blogArea-content
{
// Bottom Area
.blogArea-content-bottom
{
margin:60px 75px 60px 75px;
// Content
.blogArea-content-bottom-content
{
display:grid;
grid-template-columns:repeat(2, 60% 40%);
// Left
.blogArea-content-bottom-content-left
{
// Content
.blogArea-content-bottom-content-left-content
{
// Author
.blogArea-content-bottom-content-left-content-author
{
align-items:center;
display:flex;
font-size:0;
margin:43px 0 0 0;
padding:0;
// Content
.blogArea-content-bottom-content-left-content-author-content
{
display:inline-grid;
gap:20px;
grid-template-columns:auto auto;
// Img Area
.blogArea-content-bottom-content-left-content-author-content-img
{
align-items:center;
display:flex;
font-size:0;
margin:0;
padding:0;
// Content
.blogArea-content-bottom-content-left-content-author-content-img-content
{
// Img
img
{
height:auto;
width:75px;
}
}
}
// Name and Info
.blogArea-content-bottom-content-left-content-author-content-nameInfo
{
align-items:center;
display:flex;
// Content
.blogArea-content-bottom-content-left-content-author-content-nameInfo-content
{
// Info
.blogArea-content-bottom-content-left-content-author-content-nameInfo-content-info
{
margin:5px 0 0 0;
// Content
.blogArea-content-bottom-content-left-content-author-content-nameInfo-content-info-content
{
// Text
h6
{
color:$blog-inside-bottom-left-author-info-color;
font-family:anton-regular;
font-size:16px;
width:425px;
}
}
}
}
}
}
}
// Comments
.blogArea-content-bottom-content-left-content-comments
{
margin:110px 0 0 0;
// Content
.blogArea-content-bottom-content-left-content-comments-content
{
// Text
h4
{
color:$blog-inside-bottom-left-comments-text;
cursor:initial;
font-size:25px;
}
}
}
// Form Area
.blogArea-content-bottom-content-left-content-formArea
{
margin:40px 0 0 0;
padding:0;
// Content
.blogArea-content-bottom-content-left-content-formArea-content
{
margin:0;
padding:0;
// Form
.blogArea-content-bottom-content-left-content-formArea-content-form
{
font-size:0;
margin:0;
padding:0;
// Textarea
.blogArea-content-bottom-content-left-content-formArea-content-form-opinion
{
.blogArea-content-bottom-content-left-content-formArea-content-form-opinion-textarea
{
background:$blog-inside-comments-form-background;
border:none;
color:$blog-inside-comments-text-color;
font-family:anton-regular;
font-size:22px;
height:200px;
margin:0;
outline:none;
padding:20px;
width:75%;
}
}
// Submit Button Area
.blogArea-content-bottom-content-left-content-formArea-content-form-submit
{
margin:40px 0 0 0;
// Button
.blogArea-content-bottom-content-left-content-formArea-content-form-submit-button
{
background:$blog-inside-comments-button-background;
border:none;
border-radius:8px;
color:$blog-inside-comments-button-text;
font-family:anton-regular;
font-size:20px;
height:70px;
width:173px;
}
}
// Placeholder, Color
::placeholder
{
color:$blog-inside-comments-text-color;
opacity:1;
}
// Placeholder, Color
textarea[placeholder]
{
color:$blog-inside-comments-text-color;
}
}
}
}
// Line Area
.blogArea-content-bottom-content-left-content-line
{
margin:35px 0 0 0;
width:75%;
// Line
.blogArea-content-bottom-content-left-content-line-content
{
background:$blog-inside-bottom-left-line;
height:1px;
width:100%;
}
}
// Posts
.blogArea-content-bottom-content-left-content-posts
{
font-size:0;
margin:77px 0 0 0px;
padding:0;
// Content
.blogArea-content-bottom-content-left-content-posts-content
{
display:inline-grid;
gap:26px;
grid-template-columns:auto auto;
// Comment Area
.blogArea-content-bottom-content-left-content-posts-content-commentArea
{
background:$blog-inside-posts-commentArea-background;
border-radius:12px;
display:flex;
justify-content:center;
width:100%;
// Content
.blogArea-content-bottom-content-left-content-posts-content-commentArea-content
{
display:inline-block;
padding:17px 0 17px 0;
width:95%;
// Author Name and Options
.blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions
{
// Content
.blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content
{
display:grid;
grid-template-columns:auto auto;
// Author Name
.blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-author
{
// Content
.blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-author-content
{
// Text
h5
{
color:$blog-inside-posts-author-color;
font-family:bebas-neue-regular;
}
}
}
// Options
.blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options
{
align-items:center;
display:flex;
justify-content:flex-end;
// Content
.blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content
{
cursor:pointer;
display:inline-grid;
gap:6px;
grid-template-columns:auto auto auto;
// Ellipses
.blogArea-content-bottom-content-left-content-posts-content-commentArea-content-authorOptions-content-options-content-ellipse
{
background:$blog-inside-posts-ellipses-color;
border-radius:50%;
height:7px;
width:7px;
}
}
}
}
}
// Reply
.blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply
{
margin:13px 0 0 0;
// Content
.blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content
{
font-size:0;
margin:0;
padding:0;
// Button
.blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button
{
align-items:center;
background:$blog-inside-posts-button-background;
border-radius:3px;
cursor:pointer;
display:flex;
font-size:0;
height:35px;
justify-content:center;
margin:0;
padding:0;
width:96px;
// Content
.blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content
{
display:inline-grid;
font-size:0;
grid-template-columns:auto auto;
height:calc(100% - 10px);
margin:0;
padding:0;
width:calc(100% - 25px);
// Icon
.blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-icon
{
align-items:center;
display:flex;
// Content
.blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-icon-content
{
// Img
img
{
height:auto;
width:15px;
}
}
}
// Text Area
.blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-text
{
font-size:0;
height:100%;
margin:0;
padding:0;
// Content
.blogArea-content-bottom-content-left-content-posts-content-commentArea-content-reply-content-button-content-text-content
{
font-size:0;
margin:0;
padding:0;
// Text
h6
{
font-family:anton-regular;
font-size:16px;
margin:0;
padding:0;
text-align:end;
}
}
}
}
}
}
}
// Info Text
.blogArea-content-bottom-content-left-content-posts-content-commentArea-content-text
{
margin:9px 0 0 0;
// Content
.blogArea-content-bottom-content-left-content-posts-content-commentArea-content-text-content
{
// Text
h6
{
color:$blog-inside-posts-text-color;
font-family:anton-regular;
font-size:16px;
}
}
}
}
}
// Comment Area, Bottom
.blogArea-content-bottom-content-left-content-posts-content-commentArea-bottom
{
left:86px;
position:relative;
}
// Author Img
.blogArea-content-bottom-content-left-content-posts-content-img
{
// Content
.blogArea-content-bottom-content-left-content-posts-content-img-content
{
margin:10px 0 0 0;
// Img
img
{
height:auto;
width:60px;
}
}
}
.blogArea-content-bottom-content-left-content-posts-content-img-bottom
{
left:86px;
position:relative;
}
}
}
// Text Area
.blogArea-content-bottom-content-left-content-text
{
// Content
.blogArea-content-bottom-content-left-content-text-content
{
// Text
h5
{
text-align:justify;
width:75%;
}
}
}
}
}
// Right Side
.blogArea-content-bottom-content-right
{
// Content
.blogArea-content-bottom-content-right-content
{
// Tags
.blogArea-content-bottom-content-right-content-block
{
// Content
.blogArea-content-bottom-content-right-content-block-content
{
background:$blog-inside-block-background;
border-radius:12px;
// Tags, Bottom
.blogArea-content-bottom-content-right-content-block-content-bottom
{
// Content
.blogArea-content-bottom-content-right-content-block-content-bottom-content
{
padding:0 55px 0 71px;
// Block Area
.blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea
{
font-size:0;
margin:0;
padding:43px 0 43px 0;
// Content
.blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content
{
display:inline-grid;
gap:26px;
grid-template-columns:auto auto;
// Image Area
.blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img
{
// Content
.blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-img-content
{
// Image
img
{
border-radius:7px;
height:auto;
width:125px;
}
}
}
// Text Area
.blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text
{
align-items:center;
display:flex;
// Content
.blogArea-content-bottom-content-right-content-block-content-bottom-content-blockArea-content-text-content
{
// Text
h4
{
cursor:initial;
font-size:25px;
}
}
}
}
}
// Tag
.blogArea-content-bottom-content-right-content-block-content-bottom-content-tag
{
font-size:0;
margin:0;
padding:30px 0 30px 0;
// Content
.blogArea-content-bottom-content-right-content-block-content-bottom-content-tag-content
{
background:$blog-inside-tagsArea-background;
border-radius:5px;
display:inline-block;
font-size:0;
margin:13px;
padding:0;
position:relative;
right:13px;
// Text
h5
{
color:$blog-inside-tags-textColor;
margin:0;
padding:10px 39px 10px 39px;
}
}
}
}
}
// Top
.blogArea-content-bottom-content-right-content-block-content-top
{
// Content
.blogArea-content-bottom-content-right-content-block-content-top-content
{
// Heading
.blogArea-content-bottom-content-right-content-block-content-top-content-heading
{
// Content
.blogArea-content-bottom-content-right-content-block-content-top-content-heading-content
{
display:grid;
grid-template-columns:auto auto;
padding:36px 71px 36px 71px;
.blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText
{
display:inline-grid;
gap:15px;
grid-template-columns:repeat(2, 50px calc(100% - 50px));
// Icon
.blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-icon
{
// Content
.blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-icon-content
{
font-size:0;
margin:0;
padding:0;
// Img
img
{
height:auto;
width:50px;
}
}
}
// Text Area
.blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-text
{
align-items:center;
display:flex;
font-size:0;
margin:0;
padding:0;
// Content
.blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-iconText-text-content
{
font-size:0;
margin:0;
padding:0;
// Text
h4
{
color:$blog-inside-tags-heading-color;
cursor:initial;
font-size:25px;
margin:0;
padding:0;
}
}
}
}
// See All
.blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-seeAll
{
align-items:center;
display:flex;
font-size:0;
justify-content:flex-end;
margin:0;
padding:0;
width:100%;
// Content
.blogArea-content-bottom-content-right-content-block-content-top-content-heading-content-seeAll-content
{
font-size:0;
margin:0;
padding:0;
// Text
h4
{
cursor:pointer;
font-size:25px;
margin:0;
padding:0;
}
}
}
}
// Line Area
.blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea
{
// Content
.blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea-content
{
// Line
.blogArea-content-bottom-content-right-content-block-content-top-content-heading-lineArea-content-line
{
background:$blog-inside-right-heading-line;
height:1px;
width:100%;
}
}
}
}
}
}
}
}
// Block, Articles
.blogArea-content-bottom-content-right-content-blockArticles
{
margin:83px 0 0 0;
}
// Block, Authors
.blogArea-content-bottom-content-right-content-blockAuthors
{
margin:83px 0 0 0;
}
}
}
}
}
// Chocolate Menu, Inside
.blogArea-content-chocolateMenuInside
{
display:none;
}
// Heading Area
.blogArea-content-headingArea
{
align-items:center;
background:url("../../../Images/Blog-Inside/Sea.webp");
background-position:center;
background-repeat:no-repeat;
background-size:cover;
box-shadow:inset 0 0 0 4000px $blog-inside-headingArea-opacity;
display:flex;
justify-content:center;
padding:100px 0 0 0;
// Content
.blogArea-content-headingArea-content
{
display:inline-block;
padding:78px 0 78px 0;
// Author, Comments, Share
.blogArea-content-headingArea-content-authorCommentsShare
{
display:flex;
font-size:0;
justify-content:center;
margin:35px 0 0 0;
padding:0;
// Content
.blogArea-content-headingArea-content-authorCommentsShare-content
{
display:grid;
font-size:0;
grid-template-columns:auto auto auto;
margin:0;
padding:0;
width:376px;
// Author
.blogArea-content-headingArea-content-authorCommentsShare-content-author
{
font-size:0;
margin:0;
padding:0;
width:200px;
// Content
.blogArea-content-headingArea-content-authorCommentsShare-content-author-content
{
display:grid;
font-size:0;
grid-template-columns:repeat(2, 50px 150px);
margin:0;
padding:0;
// Img Area
.blogArea-content-headingArea-content-authorCommentsShare-content-author-content-img
{
font-size:0;
margin:0;
padding:0;
// Content
.blogArea-content-headingArea-content-authorCommentsShare-content-author-content-img-content
{
font-size:0;
margin:0;
padding:0;
// Img
img
{
font-size:0;
height:auto;
margin:0;
padding:0;
width:50px;
}
}
}
// Author, Info
.blogArea-content-headingArea-content-authorCommentsShare-content-author-content-info
{
align-items:center;
display:flex;
font-size:0;
margin:0 0 0 10px;
padding:0;
// Content
.blogArea-content-headingArea-content-authorCommentsShare-content-author-content-info-content
{
font-size:0;
margin:0;
padding:0;
// Text
h6
{
color:$blog-inside-headingArea-author-color;
font-family:anton-regular;
font-size:16px;
margin:0;
padding:0;
}
}
}
}
}
// Comments Area
.blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea
{
align-items:center;
display:flex;
justify-content:center;
width:88px;
// Comments
.blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea-comments
{
align-items:center;
background:$blog-inside-headingArea-comments-background;
border-radius:12px;
display:flex;
height:34px;
justify-content:center;
width:76px;
// Content
.blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea-comments-content
{
display:grid;
gap:10px;
grid-template-columns:auto auto;
// Icon
.blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea-comments-content-icon
{
align-items:center;
display:flex;
// Content
.blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea-comments-content-icon-content
{
// Img
img
{
height:auto;
width:20px;
}
}
}
// Text Area
.blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea-comments-content-text
{
// Content
.blogArea-content-headingArea-content-authorCommentsShare-content-commentsArea-comments-content-text-content
{
// Text
h6
{
color:$blog-inside-headingArea-comments-color;
font-family:anton-regular;
font-size:16px;
}
}
}
}
}
}
// Share
.blogArea-content-headingArea-content-authorCommentsShare-content-share
{
align-items:center;
display:flex;
justify-content:flex-end;
width:88px;
// Content
.blogArea-content-headingArea-content-authorCommentsShare-content-share-content
{
align-items:center;
background:$blog-inside-headingArea-share-background;
border-radius:50%;
cursor:pointer;
display:flex;
height:34px;
justify-content:center;
width:34px;
// Icon
img
{
height:auto;
width:20px;
}
}
}
}
}
// Heading
.blogArea-content-headingArea-content-heading
{
margin:31px 0 0 0;
// Content
.blogArea-content-headingArea-content-heading-content
{
// Text
h2
{
color:$blog-inside-headingArea-heading;
font-family:anton-regular;
text-align:center;
width:497px;
}
}
}
// Line Area
.blogArea-content-headingArea-content-line
{
display:flex;
justify-content:center;
margin:20px 0 0 0;
// Line
.blogArea-content-headingArea-content-line-content
{
background:$blog-inside-headingArea-line;
height:1px;
width:376px;
}
}
// Tags
.blogArea-content-headingArea-content-block
{
display:flex;
justify-content:center;
margin:0;
padding:0;
width:100%;
// Content
.blogArea-content-headingArea-content-block-content
{
display:inline-block;
font-size:0;
margin:0;
padding:0;
// Tag
.blogArea-content-headingArea-content-block-content-tag
{
background:$blog-inside-headingArea-tag-background;
border-radius:7px;
display:inline-block;
font-size:0;
margin:0;
padding:0;
// Text
h6
{
color:$blog-inside-headingArea-tag-color;
font-family:anton-regular;
font-size:17px;
padding:5px;
}
}
// First Tag
.blogArea-content-headingArea-content-block-content-tagFirst
{
margin:0 13px 0 0;
}
}
}
}
}
.blogArea-content-headingAreaConstitution
{
align-items:center;
background:url("../../../Images/Blog-Inside/Constitution-Heading.webp");
background-position:center;
background-repeat:no-repeat;
background-size:cover;
box-shadow:inset 0 0 0 4000px $blog-inside-headingArea-opacity;
display:flex;
justify-content:center;
padding:100px 0 0 0;
}
.blogArea-content-headingAreaHumanRights
{
align-items:center;
background:url("../../../Images/Blog-Inside/Human-Rights-Top.webp");
background-position:center;
background-repeat:no-repeat;
background-size:cover;
box-shadow:inset 0 0 0 4000px $blog-inside-headingArea-opacity;
display:flex;
justify-content:center;
padding:100px 0 0 0;
}
.blogArea-content-headingAreaInternationalLaw
{
align-items:center;
background:url("../../../Images/Blog-Inside/International-Heading.webp");
background-position:center;
background-repeat:no-repeat;
background-size:cover;
box-shadow:inset 0 0 0 4000px $blog-inside-headingArea-opacity;
display:flex;
justify-content:center;
padding:100px 0 0 0;
}
// Navbar
.blogArea-content-navbar
{
background:$blog-inside-navbar;
display:flex;
height:100px;
justify-content:center;
position:fixed;
width:100%;
z-index:2;
// Content
.blogArea-content-navbar-content
{
display:grid;
grid-template-columns:repeat(3, 1fr);
height:100%;
width:calc(100% - 150px);
// Chocolate Menu
.blogArea-content-navbar-content-chocolateMenu
{
display:none;
}
// Links
.blogArea-content-navbar-content-links
{
margin:0;
padding:0;
// Content
.blogArea-content-navbar-content-links-content
{
align-items:center;
display:flex;
height:100%;
justify-content:center;
margin:0;
padding:0;
// Ul
ul
{
display:flex;
justify-content:center;
list-style-type:none;
margin:0;
padding:0;
.blogArea-content-navbar-content-links-content-ul-contact
{
margin:0;
}
// Li
li
{
display:inline;
margin:0 75px 0 0;
padding:0;
// A
a
{
font-size:20px;
margin:0;
padding:0;
}
}
}
}
}
// Logo
.blogArea-content-navbar-content-logo
{
align-items:center;
display:inline-flex;
height:100%;
}
// Search Area
.blogArea-content-navbar-content-searchArea
{
margin:0;
// Content
.blogArea-content-navbar-content-searchArea-content
{
height:100%;
margin:0;
padding:0;
width:100%;
// Search
.blogArea-content-navbar-content-searchArea-content-search
{
display:flex;
height:100%;
justify-content:flex-end;
margin:0;
padding:0;
// Content
.blogArea-content-navbar-content-searchArea-content-search-content
{
display:grid;
grid-template-columns:repeat(2, 25% 75%);;
height:100%;
margin:0;
padding:0;
width:45%;
// Field
.blogArea-content-navbar-content-searchArea-content-search-content-field
{
display:inline;
// Content
.blogArea-content-navbar-content-searchArea-content-search-content-field-content
{
align-items:center;
display:flex;
height:100%;
// Input
.blogArea-content-navbar-content-searchArea-content-search-content-field-content-input
{
background:$blog-inside-field;
border-color:transparent;
border-radius:7px;
color:$blog-inside-search-text;
font-family:anton-regular;
font-size:16px;
height:31px;
outline:none;
padding:0 0 0 8px;
position:relative;
width:100%;
}
}
}
// Icon
.blogArea-content-navbar-content-searchArea-content-search-content-icon
{
display:inline-block;
font-size:0;
height:100%;
margin:0;
padding:0;
// Content
.blogArea-content-navbar-content-searchArea-content-search-content-icon-content
{
align-items:center;
display:flex;
font-size:0;
height:100%;
margin:0;
padding:0;
// Img
.blogArea-content-navbar-content-searchArea-content-search-content-icon-content-img
{
display:inline-block;
font-size:0;
height:auto;
margin:0;
padding:0;
width:25px;
}
}
}
}
}
}
}
}
}
}
}
contact.scss
Contact
Code Lines: 50-269
// Contact
.contact
{
// Content
.contact-content
{
display:flex;
justify-content:center;
// Dark Shape
.contact-content-shape
{
background:$contact-shape-background;
box-shadow:7px 7px 14px $contact-shape-shadow;
display:flex;
justify-content:center;
padding:180px 0 180px 0;
position:relative;
width:calc(100% - 360px);
// Shape - Content
.contact-content-shape-content
{
display:inline-block;
// Contact Form
.contact-content-shape-content-form
{
display:flex;
justify-content:center;
margin:100px 0 0 0;
// Content
.contact-content-shape-content-form-content
{
display:inline-block;
width:100%;
// Field Area
.contact-content-shape-content-form-content-fieldArea
{
// Field
.contact-content-shape-content-form-content-fieldArea-field
{
background:transparent;
border-bottom:1px solid $contact-form-line;
border-left:none;
border-right:none;
border-top:none;
color:$contact-form-text;
display:flex;
font-family:anton-regular;
font-size:25px;
height:50px;
justify-content:center;
outline:none;
padding:0;
text-align:center;
width:100%;
}
// Message
.contact-content-shape-content-form-content-fieldArea-message
{
height:45px;
}
// Space Between
.contact-content-shape-content-form-content-fieldArea-space
{
margin:75px 0 0 0;
}
// Placeholder
input[placeholder]
{
color:$contact-form-text;
}
// Placeholder, Color
::placeholder
{
color:$contact-form-text;
opacity:1;
}
}
// Submit Button
.contact-content-shape-content-form-content-submitButton
{
display:flex;
justify-content:center;
margin:75px 0 0 0;
// Button
.contact-content-shape-content-form-content-submitButton-button
{
background:$contact-button-background;
border:none;
box-shadow:1px 1px 2px $contact-button-shadow;
color:$contact-button-text;
font-family:anton-regular;
font-size:25px;
height:90px;
width:275px;
}
}
}
}
// Info
.contact-content-shape-content-info
{
// Bottom Text
.contact-content-shape-content-info-bottom
{
margin:14px 0 0 0;
h3
{
color:$contact-text;
}
}
// Top
.contact-content-shape-content-info-top
{
// Text
h2
{
color:$contact-heading;
font-family:anton-regular;
font-size:50px;
text-align:center;
}
}
}
}
// Triangles and Social
.contact-content-shape-trianglesSocial
{
height:90%;
position:absolute;
right:40px;
top:50%;
transform:translate(0, -50%);
width:120px;
// Content
.contact-content-shape-trianglesSocial-content
{
height:100%;
position:relative;
width:100%;
// Triangle One
.contact-content-shape-trianglesSocial-content-one
{
border-bottom:60px solid transparent;
border-left:60px solid transparent;
border-right:60px solid $contact-triangles;
border-top:60px solid $contact-triangles;
}
// Social Icons
.contact-content-shape-trianglesSocial-content-social
{
align-items:center;
display:flex;
height:100%;
justify-content:flex-end;
margin:0;
padding:0;
position:absolute;
top:0;
width:100%;
// Content
.contact-content-shape-trianglesSocial-content-social-content
{
display:inline-block;
font-size:0;
margin:0;
padding:0;
// Icon Area
.contact-content-shape-trianglesSocial-content-social-content-icon
{
display:flex;
justify-content:center;
// Icon
img
{
cursor:pointer;
height:auto;
width:61px;
}
}
// Icon - Fb
.contact-content-shape-trianglesSocial-content-social-content-iconFb
{
margin:35px 0 0 0;
// Icon
img
{
height:auto;
position:relative;
width:20px;
}
}
// Icon - Linkedin
.contact-content-shape-trianglesSocial-content-social-content-iconLinkedin
{
margin:35px 0 0 0;
// Icon
img
{
height:auto;
position:relative;
width:39px;
}
}
}
}
// Triangle Two
.contact-content-shape-trianglesSocial-content-two
{
border-bottom:60px solid $contact-triangles;
border-left:60px solid transparent;
border-right:60px solid $contact-triangles;
border-top:60px solid transparent;
bottom:0;
position:absolute;
}
}
}
}
}
}
footer.scss
Footer
Code Lines: 67-449
// Footer
footer
{
padding:100px 0 0 0;
// Content
.footer-content
{
// Footer, Bottom
.footer-content-bottom
{
display:flex;
justify-content:center;
margin:47px 0 47px 0;
// Content
.footer-content-bottom-content
{
display:grid;
grid-gap:40px;
grid-template-columns:repeat(3, 1fr);
width:calc(100% - 360px);
// Copyright Area
.footer-content-bottom-content-copyright
{
align-items:center;
display:flex;
justify-content:center;
// Content
.footer-content-bottom-content-copyright-content
{
// Text
h4
{
color:$footer-copyright-text;
cursor:initial;
font-size:25px;
text-align:center;
width:100%;
}
}
}
// On Top, Arrow
.footer-content-bottom-content-onTop
{
display:flex;
font-size:0;
justify-content:flex-end;
margin:0;
padding:0;
// Content
.footer-content-bottom-content-onTop-content
{
display:inline-block;
font-size:0;
margin:0;
padding:0;
// Rectangle
.footer-content-bottom-content-onTop-content-rectangle
{
align-items:center;
background:$footer-rectangle;
border-radius:7px;
cursor:pointer;
display:flex;
font-size:0;
height:50px;
justify-content:center;
margin:0;
padding:0;
width:50px;
// Arrow, Img
img
{
font-size:0;
height:auto;
margin:0;
padding:0;
position:relative;
right:0.75px;
width:20px;
}
}
}
}
// Social
.footer-content-bottom-content-social
{
align-items:center;
display:flex;
// Content
.footer-content-bottom-content-social-content
{
font-size:0;
margin:0;
padding:0;
// Icon - Fb
.footer-content-bottom-content-social-content-fb
{
cursor:pointer;
font-size:0;
height:auto;
margin:0 25px 0 0;
padding:0;
width:15px;
}
// Icon - Google Plus
.footer-content-bottom-content-social-content-googlePlus
{
cursor:pointer;
font-size:0;
height:auto;
margin:0 25px 0 0;
padding:0;
width:40px;
}
// Icon - Linkedin
.footer-content-bottom-content-social-content-linkedin
{
cursor:pointer;
font-size:0;
height:auto;
margin:0;
padding:0;
width:25px;
}
}
}
}
}
// Line Area
.footer-content-line
{
margin:47px 0 0 0;
// Content
.footer-content-line-content
{
display:flex;
justify-content:center;
// Line
.footer-content-line-content-drawLine
{
background:$footer-line;
height:2px;
width:calc(100% - 360px);
}
}
}
// Top
.footer-content-top
{
display:flex;
justify-content:center;
// Grid
.footer-content-top-content
{
display:grid;
grid-gap:40px;
grid-template-columns:repeat(3, 1fr);
width:calc(100% - 360px);
// Footer, Center
.footer-content-top-content-center
{
// Content
.footer-content-top-content-center-content
{
// Reach Us Area
.footer-content-top-content-center-content-reach
{
// Content
.footer-content-top-content-center-content-reach-content
{
// Text
h3
{
text-align:center;
}
}
}
// Subscribe Form
.footer-content-top-content-center-content-subscribeForm
{
display:inline-block;
margin:35px 0 0 0;
padding:0;
// Content
.footer-content-top-content-center-content-subscribeForm-content
{
display:inline-block;
margin:0;
padding:0;
// Form
.footer-content-top-content-center-content-subscribeForm-content-form
{
align-items:center;
background:$footer-form-background;
box-shadow:7px 7px 14px $footer-form-shadow;
display:flex;
height:100px;
margin:0;
padding:0;
width:500px;
// Submit
.footer-content-top-content-center-content-subscribeForm-content-form-submit
{
height:auto;
margin:0 29px 0 0;
padding:0;
width:35px;
}
// Text
.footer-content-top-content-center-content-subscribeForm-content-form-text
{
background:$footer-form-background;
border-bottom:none;
border-left:14px solid;
border-left-color:$footer-form-leftBorder;
border-right:none;
border-top:none;
color:$footer-form-text;
font-family:anton-regular;
font-size:25px;
height:100px;
margin:0;
opacity:1;
outline:none;
padding:0 0 0 29px;
width:100%;
}
input[placeholder]
{
color:$footer-form-text;
opacity:1;
}
::placeholder
{
color:$footer-form-text;
opacity:1;
}
}
}
}
// Subscribe Text
.footer-content-top-content-center-content-text
{
margin:9px 0 0 0;
// Content
.footer-content-top-content-center-content-text-content
{
// Text
h4
{
color:$footer-text;
cursor:initial;
font-size:25px;
text-align:center;
}
}
}
}
}
// Left
.footer-content-top-content-left
{
// Info
.footer-content-top-content-left-info
{
display:inline-block;
margin:34px 0 0 0;
// Block
.footer-content-top-content-left-info-block
{
// Text
h4
{
color:$footer-text;
cursor:initial;
font-size:25px;
}
}
// Margin
.footer-content-top-content-left-info-margin
{
margin:12px 0 0 0;
}
}
// Name, Logo
.footer-content-top-content-left-name
{
// Content
.footer-content-top-content-left-name-content
{
align-items:center;
border:2px solid $footer-name-border;
display:flex;
height:100px;
justify-content:center;
width:275px;
h4
{
color:$footer-logo-text;
.footer-content-top-content-left-name-content-dot
{
color:$footer-logo-text-dot;
}
span
{
color:$footer-logo-text;
}
}
}
}
}
// Quick Links
.footer-content-top-content-right
{
font-size:0;
margin:0;
padding:0;
// Content
.footer-content-top-content-right-content
{
font-size:0;
margin:0;
padding:0;
// Heading
.footer-content-top-content-right-content-heading
{
// Content
.footer-content-top-content-right-content-heading-content
{
// Text
h3
{
text-align:end;
}
}
}
// Links
.footer-content-top-content-right-content-links
{
font-size:0;
margin:9px 0 0 0;
padding:0;
// Content
.footer-content-top-content-right-content-links-content
{
display:flex;
font-size:0;
justify-content:flex-end;
margin:0;
padding:0;
// Menu
ul
{
display:inline-block;
font-size:0;
margin:0;
padding:0;
// Link Area
li
{
display:block;
font-size:0;
margin:2px 0 0 0;
padding:0;
// Link and Text
a
{
color:$footer-links;
font-size:25px;
line-height:37px;
margin:0;
padding:0;
}
}
}
}
}
}
}
}
}
}
}
header.scss
Header
Code Lines: 93-781
// Header
header
{
height:100vh;
width:100%;
// Header, Content
.header-content
{
// Button for Smaller Screens
.header-content-buttonTextSmall
{
display:none;
}
// Office Img
.header-content-imgArea
{
bottom:115px;
height:calc(100% - 115px);
position:absolute;
right:105px;
width:54%;
// Img Content
.header-content-imgArea-img
{
height:100%;
position:relative;
width:100%;
// Ellipses - Bottom
.header-content-imgArea-img-ellipsesBottom
{
// Container
.header-content-imgArea-img-ellipsesBottom-container
{
bottom:-50px;
display:grid;
grid-template-columns:auto auto auto;
height:100px;
position:absolute;
right:-50px;
width:100px;
z-index:2;
// Container for Ellipse
.header-content-imgArea-img-ellipsesBottom-container-ellipseContainer
{
// Ellipse
.header-content-imgArea-img-ellipsesBottom-container-ellipseContainer-ellipse
{
background:$header-ellipses-bottom;
border-radius:50%;
height:10px;
width:10px;
}
}
// Ellipse - Top - Center
.header-content-imgArea-img-ellipsesBottom-container-ellipseContainer:nth-child(2)
{
display:flex;
justify-content:center;
}
// Ellipse - Top - Right
.header-content-imgArea-img-ellipsesBottom-container-ellipseContainer:nth-child(3)
{
display:flex;
justify-content:flex-end;
}
// Ellipse - Middle - Left
.header-content-imgArea-img-ellipsesBottom-container-ellipseContainer:nth-child(4)
{
align-items:center;
display:flex;
}
// Ellipse - Middle - Center
.header-content-imgArea-img-ellipsesBottom-container-ellipseContainer:nth-child(5)
{
align-items:center;
display:flex;
justify-content:center;
}
// Ellipse - Middle - Right
.header-content-imgArea-img-ellipsesBottom-container-ellipseContainer:nth-child(6)
{
align-items:center;
display:flex;
justify-content:flex-end;
}
// Ellipse - Bottom - Left
.header-content-imgArea-img-ellipsesBottom-container-ellipseContainer:nth-child(7)
{
align-items:flex-end;
display:flex;
}
// Ellipse - Bottom - Center
.header-content-imgArea-img-ellipsesBottom-container-ellipseContainer:nth-child(8)
{
align-items:flex-end;
display:flex;
justify-content:center;
}
// Ellipse - Bottom - Right
.header-content-imgArea-img-ellipsesBottom-container-ellipseContainer:nth-child(9)
{
align-items:flex-end;
display:flex;
justify-content:flex-end;
}
}
}
// Ellipses - Top
.header-content-imgArea-img-ellipsesTop
{
// Container
.header-content-imgArea-img-ellipsesTop-content
{
display:grid;
grid-template-columns:auto auto auto;
height:100px;
left:-50px;
position:absolute;
top:65px;
width:100px;
z-index:2;
// Container for Ellipse
.header-content-imgArea-img-ellipsesTop-content-ellipseContainer
{
// Ellipse
.header-content-imgArea-img-ellipsesTop-content-ellipseContainer-ellipse
{
background:$header-ellipse;
border-radius:50%;
height:10px;
width:10px;
}
}
// Ellipse - Top - Center
.header-content-imgArea-img-ellipsesTop-content-ellipseContainer:nth-child(2)
{
display:flex;
justify-content:center;
}
// Ellipse - Top - Right
.header-content-imgArea-img-ellipsesTop-content-ellipseContainer:nth-child(3)
{
display:flex;
justify-content:flex-end;
}
// Ellipse - Middle - Left
.header-content-imgArea-img-ellipsesTop-content-ellipseContainer:nth-child(4)
{
align-items:center;
display:flex;
}
// Ellipse - Middle - Center
.header-content-imgArea-img-ellipsesTop-content-ellipseContainer:nth-child(5)
{
align-items:center;
display:flex;
justify-content:center;
}
// Ellipse - Middle - Right
.header-content-imgArea-img-ellipsesTop-content-ellipseContainer:nth-child(6)
{
align-items:center;
display:flex;
justify-content:flex-end;
}
// Ellipse - Bottom - Left
.header-content-imgArea-img-ellipsesTop-content-ellipseContainer:nth-child(7)
{
align-items:flex-end;
display:flex;
}
// Ellipse - Bottom - Center
.header-content-imgArea-img-ellipsesTop-content-ellipseContainer:nth-child(8)
{
align-items:flex-end;
display:flex;
justify-content:center;
}
// Ellipse - Bottom - Right
.header-content-imgArea-img-ellipsesTop-content-ellipseContainer:nth-child(9)
{
align-items:flex-end;
display:flex;
justify-content:flex-end;
}
}
}
// Number Container
.header-content-imgArea-img-number
{
display:inline-block;
position:absolute;
right:93px;
top:47.5px;
z-index:2;
// Number
h2
{
color:$header-number;
font-family:oleoScript-regular;
font-size:90px;
text-shadow:4px 4px 4px $header-number-shadow;
}
}
// Img
img
{
height:100%;
object-fit:cover;
width:100%;
}
}
}
// Text Area
.header-content-info
{
height:calc(100vh - 230px);
left:105px;
position:relative;
width:calc(46% - 210px);
// Text Area, Elements
.header-content-info-elements
{
bottom:-3px;
display:inline-block;
left:50%;
position:absolute;
transform:translate(-50%, 0%);
// Button for Large Screens
.header-content-info-elements-button
{
margin:0 0 200px 0;
.header-content-info-elements-button-element
{
button
{
box-shadow:1px 1px 2px $header-button-shadow;
}
}
}
// Services
.header-content-info-elements-services
{
.header-content-info-elements-services-constitutional
{
margin:0 0 5px 0;
}
// Services, Heading
.header-content-info-elements-services-heading
{
margin:0 0 8px 0;
}
}
.header-content-info-elements-text
{
margin:0 0 52px 0;
}
}
}
// Chocolate Menu
.header-content-menu
{
align-items:center;
background:$menu-background;
bottom:0;
display:flex;
height:100vh;
justify-content:center;
position:absolute;
right:0;
width:105px;
// Menu Grid
.header-content-menu-grid
{
cursor:pointer;
display:grid;
grid-template-columns:auto auto auto;
margin:0;
padding:0;
// Quad
.header-content-menu-grid-quad
{
margin:0;
padding:0;
// Object inside Quad
.header-content-menu-grid-quad-object
{
background:$menu-ellipses;
border:2px solid $menu-background;
height:11px;
margin:0;
padding:0;
width:11px;
}
}
}
}
// Menu
.header-content-menuOptions
{
background:$header-menu-background;
height:100%;
position:fixed;
right:-300px;
top:0;
transition:right 1s;
width:300px;
z-index:3;
// Container
.header-content-menuOptions-container
{
height:100%;
position:relative;
// Close Button
.header-content-menuOptions-container-close
{
bottom:50px;
display:flex;
font-size:0;
justify-content:center;
margin:0;
padding:0;
position:absolute;
width:100%;
z-index:2;
// Icon
.header-content-menuOptions-container-close-icon
{
cursor:pointer;
font-size:0;
height:auto;
margin:0;
padding:0;
width:20px;
}
}
// Menu, Links
.header-content-menuOptions-container-links
{
align-items:center;
display:flex;
height:100%;
justify-content:center;
left:0;
position:absolute;
top:0;
width:100%;
// Unordered List
ul
{
list-style-type:none;
padding:0;
// Links Area
li
{
display:flex;
justify-content:center;
margin:35px;
}
}
}
// Logo
.header-content-menuOptions-container-logo
{
display:flex;
justify-content:center;
padding:50px 0 0 0;
position:relative;
z-index:2;
// Text
h4
{
cursor:pointer;
.header-content-menuOptions-container-logo-dot
{
color:$h4-span;
}
}
}
}
}
// Menu, Slide
.header-content-menuTwo
{
align-items:center;
background:$menu-background;
bottom:50%;
display:flex;
height:80px;
justify-content:center;
position:fixed;
right:-100%;
transform:translate(0, 50%);
transition:right 1s;
width:75px;
z-index:2;
// Menu, Animation
.header-content-menuTwo-grid
{
cursor:pointer;
display:grid;
grid-template-columns:auto auto auto;
margin:0;
padding:0;
// Quad
.header-content-menuTwo-grid-quad
{
margin:0;
padding:0;
// Object inside Quad
.header-content-menuTwo-grid-quad-object
{
background:$menu-ellipses;
border:2px solid $menu-background;
height:11px;
margin:0;
outline:none;
padding:0;
width:11px;
}
}
}
}
// Menu, On Scroll
.header-content-menuTwoScroll
{
right:0;
transition:right 1s;
}
// Social Icons
.header-content-social
{
align-items:center;
background:$social-background;
bottom:0;
display:flex;
height:100vh;
justify-content:center;
position:absolute;
width:105px;
// Icons, Container
.header-content-social-icons
{
// Fb
.header-content-social-icons-fb
{
cursor:pointer;
display:flex;
justify-content:center;
// Fb, Light
.header-content-social-icons-fb-light
{
display:none;
}
// Icon
img
{
height:auto;
width:15px;
}
}
// Linkedin
.header-content-social-icons-linkedin
{
cursor:pointer;
margin:38px 0 0 0;
// Linkedin, Light
.header-content-social-icons-linkedin-light
{
display:none;
}
// Icon
img
{
height:auto;
width:22px;
}
}
}
}
// Bottom Track
.header-content-stripe
{
background:$stripe-background;
bottom:0;
height:56px;
left:0;
position:absolute;
width:100%;
}
// Top
.header-content-top
{
align-items:center;
background:$header-top;
display:flex;
height:115px;
position:relative;
width:100%;
z-index:2;
// Search Container
.header-content-top-search
{
height:100%;
position:absolute;
right:0;
top:0;
// Search Box
.header-content-top-search-box
{
align-items:center;
background:$search;
display:flex;
height:100%;
justify-content:center;
width:105px;
// Link
a
{
align-items:center;
display:flex;
// Img
img
{
height:auto;
width:25px;
}
}
}
}
// Logo
.header-content-top-text
{
font-size:0;
margin:0 0 0 58px;
h4
{
.header-content-top-text-h4-dot
{
color:$header-menu-logo;
}
.header-content-top-text-h4-name
{
color:$h4;
}
}
}
}
}
}
// Menu, Animation
.animate-menu
{
background:$header-menu-click;
border-radius:5px;
cursor:pointer;
display:grid;
grid-template-columns:auto auto auto;
margin:0;
padding:5px;
// Quad
.header-content-menu-grid-quad
{
margin:0;
padding:0;
// Object inside Quad
.header-content-menu-grid-quad-object
{
background:$menu-ellipses;
border:2px solid $header-menu-click;
height:11px;
margin:0;
padding:0;
width:11px;
}
}
}
// Menu on Scroll, Animate
.animate-menuTwo
{
background:$header-menu-click;
border-radius:5px;
cursor:pointer;
display:grid;
grid-template-columns:auto auto auto;
margin:0;
padding:5px;
// Quad
.header-content-menuTwo-grid-quad
{
margin:0;
padding:0;
// Object inside Quad
.header-content-menuTwo-grid-quad-object
{
background:$menu-ellipses;
border:2px solid $menu-background;
height:11px;
margin:0;
padding:0;
width:11px;
}
}
}
// Slide Menu
.slide-menu
{
background:$header-menu-background;
height:100%;
position:fixed;
right:0;
top:0;
transition:right 1s;
width:300px;
z-index:3;
// Menu, Container
.header-content-menuOptions-container
{
height:100%;
// Close Button
.header-content-menuOptions-container-close
{
bottom:50px;
display:flex;
font-size:0;
justify-content:center;
margin:0;
padding:0;
position:absolute;
width:100%;
z-index:2;
// Icon
.header-content-menuOptions-container-close-icon
{
cursor:pointer;
font-size:0;
height:auto;
margin:0;
padding:0;
width:20px;
}
}
// Links
.header-content-menuOptions-container-links
{
align-items:center;
display:flex;
height:100%;
justify-content:center;
left:0;
position:absolute;
top:0;
width:100%;
// Unordered List
ul
{
list-style-type:none;
padding:0;
// Links Area
li
{
display:flex;
justify-content:center;
margin:35px;
}
}
}
// Logo
.header-content-menuOptions-container-logo
{
display:flex;
justify-content:center;
padding:50px 0 0 0;
position:relative;
z-index:2;
// Text
h4
{
cursor:pointer;
}
}
}
}
legal.scss
Legal Areas
Code Lines: 18-97
// Section Legal Areas
.legal
{
// Container for Legal Areas
.legal-container
{
// Areas
.legal-container-areas
{
// Container for Areas
.legal-container-areas-container
{
// Column
.legal-container-areas-container-column
{
// Container, Column
.legal-container-areas-container-column-container
{
// Icon
.legal-container-areas-container-column-container-icon
{
// Book Icon
.legal-container-areas-container-column-container-icon-book
{
height:auto;
width:39.5px;
}
// Charter Icon
.legal-container-areas-container-column-container-icon-charter
{
height:auto;
width:41px;
}
// People Icon
.legal-container-areas-container-column-container-icon-people
{
height:auto;
width:64px;
}
// Sea Icon
.legal-container-areas-container-column-container-icon-sea
{
height:auto;
width:54px;
}
}
}
}
.legal-container-areas-container-columnBottom
{
border-bottom:none;
}
.legal-container-areas-container-columnTop
{
border-top:none;
}
}
}
.legal-container-heading
{
.legal-container-heading-container
{
.legal-container-heading-container-bottom
{
h2
{
color:$legal-heading-bottom;
}
}
.legal-container-heading-container-top
{
h3
{
color:$legal-heading-top;
}
}
}
}
}
}
loader.scss
Loader
Code Lines: 22-87
// Loader
.loader
{
background:$loader-background;
height:100vh;
left:0;
position:fixed;
top:0;
width:100%;
z-index:3;
// Content
.loader-content
{
align-items:center;
display:flex;
height:100%;
justify-content:center;
// Spinner
.loader-content-spinner
{
animation: rotation 1s linear infinite;
border:3px solid $loader-spinner-border;
border-radius:50%;
box-sizing:border-box;
display:inline-block;
height:48px;
position:relative;
width:48px;
}
// Blue Borders
.loader-content-spinner::after
{
border:3px solid;
border-color:$loader-spinner-borderTwo transparent;
border-radius:50%;
box-sizing:border-box;
content:'';
height:56px;
position:absolute;
left:50%;
top:50%;
transform:translate(-50%, -50%);
width:56px;
}
// Animation Keyframes
@keyframes rotation
{
0%
{
transform:rotate(0deg);
}
100%
{
transform:rotate(360deg);
}
}
}
}
// After Page is Loaded
.loaded
{
left:100%;
transition:left 1s;
}
services.scss
Services
Code Lines: 56-295
// Section Services
.services
{
// Services, Container
.services-container
{
// Part - Human Rights Protection
.services-container-bottom
{
margin:100px 0 0 0;
// Heading
.services-container-bottom-heading
{
// Text
h4
{
color:$services-bottom-heading;
cursor:initial;
font-size:25px;
text-align:center;
width:100%;
}
}
// Subheading
.services-container-bottom-subheading
{
margin:10px 0 0 0;
// Text
h2
{
font-family:anton-regular;
font-size:30px;
text-align:center;
}
}
// Bottom, Text
.services-container-bottom-text
{
display:flex;
justify-content:center;
margin:10px 0 0 0;
// Text
h5
{
text-align:center;
width:600px;
}
}
// Video Area
.services-container-bottom-video
{
margin:40px 0 0 0;
// Content
.services-container-bottom-video-content
{
display:flex;
justify-content:center;
// Large Circle
.services-container-bottom-video-content-circleLarge
{
align-items:center;
border:1px solid $services-video-circleLarge;
border-radius:50%;
cursor:pointer;
display:flex;
height:95px;
justify-content:center;
width:95px;
// Small Circle
.services-container-bottom-video-content-circleLarge-circleSmall
{
align-items:center;
background:$services-video-circleSmall;
border-radius:50%;
display:flex;
height:75px;
justify-content:center;
width:75px;
// Triangle
img
{
height:auto;
left:3px;
position:relative;
width:30px;
}
}
}
}
}
}
// Legal Services
.services-container-legal
{
margin:100px 180px 0 180px;
padding:0;
// Legal Services, Content
.services-container-legal-containerLeft
{
align-items:center;
display:flex;
margin:0;
padding:0;
.services-container-legal-containerLeft-content
{
// Buttons
.services-container-legal-containerLeft-content-buttons
{
display:inline-block;
font-size:0;
margin:30px 0 0 0;
padding:0;
// Buttons - Content
.services-container-legal-containerLeft-content-buttons-content
{
margin:0;
padding:0;
// Button
button
{
box-shadow:1px 1px 2px $services-button-shadow;
display:inline;
margin:0;
padding:0;
// Icon - Arrow
img
{
bottom:3px;
position:relative;
}
}
// Button - Learn More
.services-container-legal-containerLeft-content-buttons-content-learn
{
background:$services-button;
}
// Button - View
.services-container-legal-containerLeft-content-buttons-content-view
{
background:transparent;
margin:0 0 0 30px;
}
}
}
// Info Area
.services-container-legal-containerLeft-content-info
{
margin:0;
padding:0;
// Info Area, Content
.services-container-legal-containerLeft-content-info-container
{
// Bottom Text
.services-container-legal-containerLeft-content-info-container-bottom
{
margin:5px 0 0 0;
// Text
h2
{
display:inline-block;
font-family:anton-regular;
font-size:40px;
}
}
// Top Text
.services-container-legal-containerLeft-content-info-container-top
{
// Text
h2
{
color:$services-weProvide;
display:inline-block;
font-family:bebas-neue-regular;
font-size:25px;
}
}
}
}
// Text Area
.services-container-legal-containerLeft-content-text
{
margin:30px 0 0 0;
width:375px;
}
}
}
// Right Side
.services-container-legal-containerRight
{
display:flex;
justify-content:flex-end;
margin:0;
padding:0;
// Right Side, Content
.services-container-legal-containerRight-content
{
margin:0;
padding:0;
position:relative;
// Grid
.services-container-legal-containerRight-content-grid
{
left:-77px;
position:absolute;
top:50%;
transform:translate(0, -50%);
z-index:1;
// Grid, Content
.services-container-legal-containerRight-content-grid-content
{
// Img
img
{
height:auto;
width:370px;
}
}
}
// Large Img
.services-container-legal-containerRight-content-img
{
font-size:0;
margin:0;
padding:0;
position:relative;
z-index:2;
// Img
img
{
border-radius:15px;
font-size:0;
margin:0;
padding:0;
}
}
}
}
}
}
}
style-manager.scss
About (Columns), Blog, Legal Areas (Columns), Headings
Code Lines: 255-310, 622-1285, 5233-5358, 6128-6153
// About-Columns
@mixin about-columns
{
.about-content-bottom-column-container-headingContainer
{
margin:10px 0 0 0;
h2
{
font-family:bebas-neue-regular;
font-size:30px;
text-align:center;
}
}
.about-content-bottom-column-container-iconContainer
{
display:flex;
font-size:0;
justify-content:center;
margin:0;
padding:0;
.about-content-bottom-column-container-iconContainer-culture
{
height:auto;
width:54px;
}
.about-content-bottom-column-container-iconContainer-legal
{
height:auto;
width:51px;
}
.about-content-bottom-column-container-iconContainer-principles
{
height:auto;
width:50px;
}
img
{
font-size:0;
margin:0;
padding:0;
}
}
.about-content-bottom-column-container-textContainer
{
display:flex;
justify-content:center;
margin:5px 0 0 0;
h4
{
cursor:initial;
font-size:18px;
text-align:center;
width:50%;
}
}
}
// Blog-Bottom
@mixin blog-bottom
{
margin:100px 180px 0 180px;
padding:0;
.blog-content-bottom-content
{
margin:0;
padding:0;
.blog-content-bottom-content-center
{
font-size:0;
margin:0;
padding:0;
.blog-content-bottom-content-center-content
{
font-size:0;
margin:0;
padding:0;
.blog-content-bottom-content-center-content-img
{
font-size:0;
height:750px;
margin:0;
padding:0;
position:relative;
width:100%;
.blog-content-bottom-content-center-content-img-layer
{
background:$blog-img-layer;
height:100%;
left:0;
position:absolute;
top:0;
width:100%;
}
img
{
height:100%;
object-fit:cover;
width:100%;
}
}
.blog-content-bottom-content-center-content-imgFour
{
display:none;
}
.blog-content-bottom-content-center-content-imgThree
{
display:none;
}
.blog-content-bottom-content-center-content-imgTwo
{
display:none;
}
.blog-content-bottom-content-center-content-numbers
{
background:$blog-numbers-background;
height:125px;
width:100%;
.blog-content-bottom-content-center-content-numbers-content
{
align-items:center;
display:flex;
height:100%;
justify-content:center;
h2
{
font-family:anton-regular;
font-size:35px;
}
}
.blog-content-bottom-content-center-content-numbers-contentFour
{
display:none;
}
.blog-content-bottom-content-center-content-numbers-contentThree
{
display:none;
}
.blog-content-bottom-content-center-content-numbers-contentTwo
{
display:none;
}
}
}
}
.blog-content-bottom-content-left
{
margin:0;
padding:0;
position:relative;
z-index:2;
.blog-content-bottom-content-left-content
{
margin:0;
padding:0;
.blog-content-bottom-content-left-content-author
{
display:grid;
grid-template-columns:auto auto;
margin:0;
padding:0;
width:310px;
.blog-content-bottom-content-left-content-author-img
{
.blog-content-bottom-content-left-content-author-img-largeCircle
{
align-items:center;
border:1px solid $blog-author-largeCircle;
border-radius:50%;
display:flex;
font-size:0;
height:100px;
justify-content:center;
margin:0;
padding:0;
width:100px;
.blog-content-bottom-content-left-content-author-img-largeCircle-smallCircle
{
align-items:center;
background:$blog-author-smallCircle;
border-radius:50%;
display:flex;
font-size:0;
height:90px;
justify-content:center;
margin:0;
padding:0;
width:90px;
img
{
height:auto;
width:80px;
}
}
}
}
.blog-content-bottom-content-left-content-author-imgFour
{
display:none;
}
.blog-content-bottom-content-left-content-author-imgOne
{
display:block;
}
.blog-content-bottom-content-left-content-author-imgThree
{
display:none;
}
.blog-content-bottom-content-left-content-author-imgTwo
{
display:none;
}
.blog-content-bottom-content-left-content-author-authorInfo
{
align-items:center;
display:flex;
margin:0;
padding:0;
.blog-content-bottom-content-left-content-author-authorInfo-content
{
.blog-content-bottom-content-left-content-author-authorInfo-content-name
{
h4
{
color:$blog-author-text;
cursor:initial;
font-size:24px;
}
}
.blog-content-bottom-content-left-content-author-authorInfo-content-position
{
h4
{
color:$blog-author-text;
cursor:initial;
font-family:bebas-neue-regular;
font-size:24px;
}
}
}
}
.blog-content-bottom-content-left-content-author-authorInfoFour
{
display:none;
}
.blog-content-bottom-content-left-content-author-authorInfoOne
{
display:flex;
margin:0;
padding:0;
}
.blog-content-bottom-content-left-content-author-authorInfoThree
{
display:none;
}
.blog-content-bottom-content-left-content-author-authorInfoTwo
{
display:none;
}
}
.blog-content-bottom-content-left-content-dateButton
{
display:inline-block;
font-size:0;
margin:50px 0 0 0;
padding:0;
.blog-content-bottom-content-left-content-dateButton-content
{
display:grid;
font-size:0;
grid-template-columns:auto auto;
margin:0;
padding:0;
.blog-content-bottom-content-left-content-dateButton-content-button
{
display:inline-block;
font-size:0;
margin:0;
padding:0;
.blog-content-bottom-content-left-content-dateButton-content-button-content
{
display:inline-block;
font-size:0;
margin:0;
padding:0;
.blog-content-bottom-content-left-content-dateButton-content-button-content-buttonArea
{
align-items:center;
background:$blog-left-button;
border-radius:6px;
box-shadow:1px 1px 2px $blog-left-button-shadow;
cursor:pointer;
display:flex;
font-size:0;
height:98px;
justify-content:center;
left:65px;
margin:0;
padding:0;
position:relative;
width:220px;
.blog-content-bottom-content-left-content-dateButton-content-button-content-buttonArea-content
{
display:grid;
font-size:0;
grid-template-columns:auto auto;
margin:0;
padding:0;
.blog-content-bottom-content-left-content-dateButton-content-button-content-buttonArea-content-img
{
align-items:center;
display:flex;
img
{
display:inline;
font-size:0;
height:auto;
margin:0;
padding:0;
width:20px;
}
}
h4
{
color:$blog-left-button-text;
display:inline;
font-family:anton-regular;
font-size:24px;
margin:0 0 0 25px;
padding:0;
}
}
}
.blog-content-bottom-content-left-content-dateButton-content-button-content-buttonAreaFour
{
display:none;
}
.blog-content-bottom-content-left-content-dateButton-content-button-content-buttonAreaThree
{
display:none;
}
.blog-content-bottom-content-left-content-dateButton-content-button-content-buttonAreaTwo
{
display:none;
}
}
}
.blog-content-bottom-content-left-content-dateButton-content-date
{
display:grid;
font-size:0;
grid-template-columns:auto auto;
margin:0;
padding:0;
width:250px;
.blog-content-bottom-content-left-content-dateButton-content-date-icon
{
align-items:center;
display:flex;
font-size:0;
margin:0;
padding:0;
img
{
font-size:0;
height:auto;
margin:0;
padding:0;
width:35px;
}
}
.blog-content-bottom-content-left-content-dateButton-content-date-text
{
align-items:center;
display:flex;
margin:0;
h4
{
color:$blog-date-text;
cursor:initial;
font-size:24px;
}
}
}
.blog-content-bottom-content-left-content-dateButton-content-dateFour
{
display:none;
}
.blog-content-bottom-content-left-content-dateButton-content-dateOne
{
display:grid;
}
.blog-content-bottom-content-left-content-dateButton-content-dateThree
{
display:none;
}
.blog-content-bottom-content-left-content-dateButton-content-dateTwo
{
display:none;
}
}
}
.blog-content-bottom-content-left-content-dateSmallDevices
{
display:none;
}
.blog-content-bottom-content-left-content-dotsSmallDevices
{
align-items:center;
display:none;
height:125px;
justify-content:center;
width:100%;
.blog-content-bottom-content-left-content-dotsSmallDevices-content
{
display:grid;
grid-gap:10px;
grid-template-columns:auto auto auto auto;
.blog-content-bottom-content-left-content-dotsSmallDevices-content-dot
{
background:$blog-dots;
height:15px;
width:15px;
}
.blog-content-bottom-content-left-content-dotsSmallDevices-content-dotOne
{
background:$blog-dot-active;
}
}
}
.blog-content-bottom-content-left-content-heading
{
height:54px;
margin:37px 0 0 0;
padding:0;
.blog-content-bottom-content-left-content-heading-content
{
margin:0;
padding:0;
position:relative;
h2
{
display:inline-block;
font-family:anton-regular;
font-size:36px;
left:0;
margin:0;
padding:0;
position:absolute;
top:0;
width:750px;
}
}
}
.blog-content-bottom-content-left-content-headingFour
{
display:none;
}
.blog-content-bottom-content-left-content-headingOne
{
display:flex;
}
.blog-content-bottom-content-left-content-headingThree
{
display:none;
}
.blog-content-bottom-content-left-content-headingTwo
{
display:none;
}
.blog-content-bottom-content-left-content-imgSmallDevices
{
display:none;
}
.blog-content-bottom-content-left-content-lawField
{
margin:18px 0 0 0;
padding:0;
.blog-content-bottom-content-left-content-lawField-content
{
display:grid;
grid-template-columns:auto auto;
margin:0;
padding:0;
width:300px;
.blog-content-bottom-content-left-content-lawField-content-line
{
align-items:center;
display:flex;
margin:0;
padding:0;
.blog-content-bottom-content-left-content-lawField-content-line-content
{
background:$blog-left-fieldLaw-line;
height:1px;
margin:0;
padding:0;
width:100px;
}
}
.blog-content-bottom-content-left-content-lawField-content-text
{
h4
{
color:$blog-left-fieldLaw-text;
cursor:initial;
font-family:bebas-neue-regular;
font-size:25px;
}
}
.blog-content-bottom-content-left-content-lawField-content-textFour
{
display:none;
}
.blog-content-bottom-content-left-content-lawField-content-textOne
{
display:flex;
}
.blog-content-bottom-content-left-content-lawField-content-textThree
{
display:none;
}
.blog-content-bottom-content-left-content-lawField-content-textTwo
{
display:none;
}
}
}
.blog-content-bottom-content-left-content-numbersSmallDevices
{
display:none;
}
.blog-content-bottom-content-left-content-text
{
height:180px;
margin:20px 0 0 0;
padding:0;
position:relative;
.blog-content-bottom-content-left-content-text-content
{
left:0;
margin:0;
padding:0;
position:absolute;
top:0;
width:500px;
h5
{
margin:0;
padding:0;
}
}
.blog-content-bottom-content-left-content-text-contentFour
{
display:none;
}
.blog-content-bottom-content-left-content-text-contentOne
{
display:flex;
}
.blog-content-bottom-content-left-content-text-contentThree
{
display:none;
}
.blog-content-bottom-content-left-content-text-contentTwo
{
display:none;
}
}
}
}
.blog-content-bottom-content-right
{
background:$blog-background;
box-shadow:7px 7px $blog-right-shadow;
font-size:0;
margin:0;
padding:0;
.blog-content-bottom-content-right-content
{
height:100%;
position:relative;
.blog-content-bottom-content-right-content-blocks
{
margin:100px 0 0 0;
.blog-content-bottom-content-right-content-blocks-content
{
.blog-content-bottom-content-right-content-blocks-content-block
{
align-items:center;
cursor:pointer;
display:flex;
height:100px;
justify-content:center;
width:100%;
.blog-content-bottom-content-right-content-blocks-content-block-content
{
display:grid;
grid-template-columns:auto auto;
margin:0 15px 0 15px;
.blog-content-bottom-content-right-content-blocks-content-block-content-img
{
height:90px;
width:130px;
img
{
height:100%;
object-fit:cover;
width:100%;
}
}
.blog-content-bottom-content-right-content-blocks-content-block-content-textButton
{
align-items:center;
display:flex;
margin:0 0 0 10px;
.blog-content-bottom-content-right-content-blocks-content-block-content-textButton-content
{
display:inline-block;
.blog-content-bottom-content-right-content-blocks-content-block-content-textButton-content-button
{
margin:10px 0 0 0;
.blog-content-bottom-content-right-content-blocks-content-block-content-textButton-content-button-buttonArea
{
border:1px solid $blog-right-buttons-border;
display:flex;
height:25px;
justify-content:center;
width:55px;
img
{
height:auto;
width:22px;
}
}
.blog-content-bottom-content-right-content-blocks-content-block-content-textButton-content-button-buttonOne
{
background:$blog-right-buttons;
}
}
.blog-content-bottom-content-right-content-blocks-content-block-content-textButton-content-text
{
h6
{
color:$blog-block-text;
font-family:anton-regular;
font-size:16px;
}
}
}
}
}
}
.blog-content-bottom-content-right-content-blocks-content-blockMargin
{
margin:15px 0 0 0;
}
.blog-content-bottom-content-right-content-blocks-content-blockOne
{
background:$blog-right-active;
}
}
}
.blog-content-bottom-content-right-content-dots
{
align-items:center;
bottom:0;
display:flex;
height:125px;
justify-content:center;
left:0;
position:absolute;
width:100%;
.blog-content-bottom-content-right-content-dots-content
{
display:grid;
grid-gap:10px;
grid-template-columns:auto auto auto auto;
.blog-content-bottom-content-right-content-dots-content-dot
{
background:$blog-dots;
height:15px;
width:15px;
}
.blog-content-bottom-content-right-content-dots-content-dotOne
{
background:$blog-dot-active;
}
}
}
.blog-content-bottom-content-right-content-top
{
position:relative;
.blog-content-bottom-content-right-content-top-line
{
.blog-content-bottom-content-right-content-top-line-content
{
background:$blog-top-line;
height:100px;
width:15px;
}
}
.blog-content-bottom-content-right-content-top-text
{
align-items:center;
display:flex;
height:100%;
justify-content:center;
left:0;
position:absolute;
top:0;
width:100%;
h3
{
font-size:30px;
}
}
}
}
}
}
}
@mixin legal-areas-columns
{
.legal-container-areas
{
margin:100px 0 0 0;
padding:0;
.legal-container-areas-container
{
margin:0px 150px 0px 150px;
padding:0;
.legal-container-areas-container-column
{
align-items:center;
background:$legal-areas-column-background;
border:30px solid $legal-areas-column-border;
display:flex;
font-size:0;
justify-content:center;
margin:0;
padding:45px 35px 45px 35px;
position:relative;
.legal-container-areas-container-column-container
{
display:inline-block;
font-size:0;
margin:0;
padding:0;
.legal-container-areas-container-column-container-button
{
margin:25px 0 0 0;
position:relative;
z-index:2;
button
{
background:transparent;
border:none;
color:$legal-areas-column-button;
font-size:20px;
height:initial;
margin:0;
padding:0;
position:relative;
width:initial;
z-index:2;
img
{
height:auto;
margin:0 10px 0 0;
padding:0;
width:25px;
}
}
}
.legal-container-areas-container-column-container-heading
{
margin:20px 0 0 0;
h3
{
color:$legal-areas-column-heading;
}
}
.legal-container-areas-container-column-container-icon
{
font-size:0;
margin:0;
padding:0;
img
{
font-size:0;
height:auto;
margin:0;
padding:0;
width:45px;
}
}
.legal-container-areas-container-column-container-text
{
margin:10px 0 0 0;
h4
{
color:$legal-areas-column-text;
font-size:20px;
}
}
}
.legal-container-areas-container-column-layerShadow
{
box-shadow:7px 7px 14px $legal-areas-column-shadow;
height:100%;
left:0;
position:absolute;
top:0;
width:100%;
z-index:1;
}
.legal-container-areas-container-column-shapeBottomLeft
{
display:none;
}
.legal-container-areas-container-column-shapeBottomRight
{
display:none;
}
.legal-container-areas-container-column-shapeTopLeft
{
display:none;
}
.legal-container-areas-container-column-shapeTopRight
{
border-right:1px solid $legal-areas-column-shape;
border-top:1px solid $legal-areas-column-shape;
height:150px;
position:absolute;
right:-10px;
top:-10px;
width:150px;
z-index:2;
}
}
.legal-container-areas-container-columnBottom
{
border-bottom:0;
}
}
}
}
// Section - Heading
@mixin section-heading
{
.section-content-heading-container
{
.section-content-heading-container-bottom
{
margin:10px 0 0 0;
h2
{
color:$section-heading-bottom;
font-family:anton-regular;
font-size:35px;
text-align:center;
}
}
.section-content-heading-container-top
{
h3
{
color:$section-heading-top;
text-align:center;
}
}
}
}
PHP
In this section you can find more about how to set message send system in contact form.
Layout - Twilight
contact.php
Contact Form
Code Lines: 1-27
<?php
/*
Table of Contents
Data
Send Data
Write Message
*/
// Data
$to = '#'; // Receiver Mail
$subject = 'LexPrime - Contact Form';
$from = $_POST['userEmail']; // This is the sender's Email address
$message = $_POST['userMessage'];
$headers .= 'From:' . $from . "\r\n"; // Sender Mail
'X-Mailer: PHP/' . phpversion();
// Send Data
mail($to, $subject, $message, $headers);
// Write Message
echo '<h2 style = "left:50%; position:absolute; text-align:center; top:50%; transform:translate(-50%, -50%);">Thank you very much for your message. We will back to you shortly!</h2>';
?>