@font-face {
font-family: 'Montserrat';
font-style: normal;
font-weight: 400;
src: url(https://fonts.gstatic.com/s/montserrat/v26/JTUHjIg1_i6t8kCHKm4532VJOt5-QNFgpCtr6Hw0aXpsog.woff2) format('woff2');
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
} @font-face {
font-family: 'Montserrat';
font-style: normal;
font-weight: 400;
src: url(https://fonts.gstatic.com/s/montserrat/v26/JTUHjIg1_i6t8kCHKm4532VJOt5-QNFgpCtr6Hw9aXpsog.woff2) format('woff2');
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
} @font-face {
font-family: 'Montserrat';
font-style: normal;
font-weight: 400;
src: url(https://fonts.gstatic.com/s/montserrat/v26/JTUHjIg1_i6t8kCHKm4532VJOt5-QNFgpCtr6Hw2aXpsog.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
} @font-face {
font-family: 'Montserrat';
font-style: normal;
font-weight: 400;
src: url(https://fonts.gstatic.com/s/montserrat/v26/JTUHjIg1_i6t8kCHKm4532VJOt5-QNFgpCtr6Hw3aXpsog.woff2) format('woff2');
unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
} @font-face {
font-family: 'Montserrat';
font-style: normal;
font-weight: 400;
src: url(https://fonts.gstatic.com/s/montserrat/v26/JTUHjIg1_i6t8kCHKm4532VJOt5-QNFgpCtr6Hw5aXo.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
body,
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: "Montserrat", sans-serif
}
.w3-row-padding img {
margin-bottom: 12px
} .w3-sidebar {
width: 120px;
background: #222;
} #main {
margin-left: 120px;
}
.about-me {
display: flex;
}
.about-content-section {
padding-right: 100px;
}
.myself-video {
width: 250px;
border-radius: 10px;
}
.whatsapp-btn {
background-color: rgb(0, 146, 37);
border: none;
color: white;
padding: 10px 30px 10px 30px;
border-radius: 30px;
margin-top: 25px;
margin-bottom: 25px;
font-size: 24px;
}
.whatsapp-btn:hover{
color: white;
text-decoration: none;
}
.call-btn {
background-color: rgb(0, 93, 146);
color: white;
padding: 10px 30px 10px 30px;
border-radius: 30px;
margin-top: 25px;
margin-bottom: 25px;
margin-left: 20px;
font-size: 24px;
}
.call-btn:hover{
color: white;
text-decoration: none;
}
.fa-phone {
margin-left: 10px;
}
.copyright {
text-align: center;
} @media only screen and (max-width: 600px) {
#main {
margin-left: 0
}
.whatsapp-btn {
border: none;
color: white;
padding: 10px 15px 10px 15px;
border-radius: 30px;
margin-top: 25px;
margin-bottom: 25px;
font-size: 18px;
}
.call-btn {
background-color: rgb(0, 93, 146);
border: none;
color: white;
padding: 10px 15px 10px 15px;
border-radius: 30px;
margin-top: 10px;
margin-bottom: 25px;
font-size: 18px;
}
.quick-buttons{
display: flexbox;
}
.about-me {
display: block;
}
.about-content-section {
padding-right: 0;
}
.myself-video {
width: 100%;
}
} .img-popup {
position: fixed;
z-index: 1;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: rgba(0, 0, 0, 0.5);
display: flex;
justify-content: center;
align-items: center;
display: none;
}
.img-popup img {
height: 100%;
opacity: 0;
transform: translateY(-100px);
-webkit-transform: translateY(-100px);
-moz-transform: translateY(-100px);
-ms-transform: translateY(-100px);
-o-transform: translateY(-100px);
}
.close-btn {
width: 35px;
height: 30px;
display: flex;
justify-content: center;
flex-direction: column;
position: absolute;
top: 20px;
right: 20px;
cursor: pointer;
}
.close-btn .bar {
height: 4px;
background: #333;
}
.close-btn .bar:nth-child(1) {
transform: rotate(45deg);
}
.close-btn .bar:nth-child(2) {
transform: translateY(-4px) rotate(-45deg);
}
.opened {
display: flex;
}
.opened img {
animation: animatepopup 1s ease-in-out .8s;
-webkit-animation: animatepopup .3s ease-in-out forwards;
}
@keyframes animatepopup {
to {
opacity: 1;
transform: translateY(0);
-webkit-transform: translateY(0);
-moz-transform: translateY(0);
-ms-transform: translateY(0);
-o-transform: translateY(0);
}
}