
*::selection { background: #FFF; color: #000; }
*::-moz-selection { background: #FFF; color: #000; }
::-webkit-scrollbar {display: none;}
::scrollbar {display: none;}
::-moz-scrollbar {display: none;}
* {  scroll-behavior: smooth; transition: .4s linear all; -moz-transition: .4s linear all; -webkit-transition: .4s linear all; -ms-transition: .4s linear all;}
body::-webkit-scrollbar { width: 0px; background: transparent; /* Disable scrollbar Chrome/Safari/Webkit */ }
@-moz-document url-prefix() { html{scrollbar-width: none;} }

.clearfix:after, .clearfix:before{display: table; content: " "}
.clearfix:after{clear: both}

html { position: absolute; height: 100%; overflow: auto; scrollbar-width: none;	-ms-overflow-style: none; /* IE 11 */ width: 100%; scroll-behavior: smooth;}
body { overflow: auto; line-height: 1.6; height: 100%;	scrollbar-width: none; scroll-behavior: smooth;}
a,
a:focus { color: #C61D40; text-decoration: none; outline: 0; }
a:hover { text-decoration: none; color: #333; }

body, input, select, textarea, button, tspan {font-family: 'Montserrat', sans-serif;}
hr{ width:100%}
input,
input:focus,
select,
select:focus { outline: none; border: 1px solid #333; }

h1 { text-transform: uppercase; }
h1 span { color: #C61D40; }
h2{ color: #C61D40;/*  text-transform: uppercase*/}
h3{    color: #5B7188;    font-size: 20px;    font-weight: 600;}
b, strong { font-weight: 600; }
sup, sub {   vertical-align: baseline;   position: relative;   top: -0.4em; font-size:10px;}
sub { top: 0.4em; }
body {font-family: 'Montserrat', sans-serif;font-style: normal;font-weight: 300;color: #4C4D4F;font-size: 100%;margin: 0;/*background: #ECECEC;*/width: 100%;overflow: auto;}
p {font-size: 18px;margin-bottom: 30px;line-height: 1.5;font-family: 'Montserrat', sans-serif;font-style: normal;font-weight: 400;color: #000000;margin-top:0px;}






header{position: relative;width: 100%;background: transparent;z-index: 25;}

.logo{float: left;;position: absolute;z-index: 999;}
.logo img{display: block;margin: 0 auto;width: 50%;}


nav{width: 65%;float: right;}

.nav-list{ margin: 0; padding: 0; list-style: none;}
.nav-list li{float: left;width: auto;padding: 0 15px;height: 45px;line-height: 45px;font-size: 14px;color: #707070;font-weight: 500;}
.nav-list a {
    color: #000;

    font-weight: 600;
}


.nav-list li.active {
    background: #000;
    color: #fff;
}

body.m1 .nav-list li.m1,
body.m2 .nav-list li.m2,
body.m3 .nav-list li.m3,
body.m4 .nav-list li.m4,
body.m5 .nav-list li.m5,
body.m6 .nav-list li.m6,
body.m7 .nav-list li.m7,
body.m8 .nav-list li.m8 {
background: #000;
color: #fff;
}

body.m1 .nav-list li.m1 a,
body.m2 .nav-list li.m2 a,
body.m3 .nav-list li.m3 a,
body.m4 .nav-list li.m4 a,
body.m5 .nav-list li.m5 a,
body.m6 .nav-list li.m6 a,
body.m7 .nav-list li.m7 a,
body.m8 .nav-list li.m8 a {
color: #fff;
}



.nav-list li.active a {
    color: #fff;
}

.nav-list li:hover {
    background: #FECC00;
    color: #000;
}



article {
    max-width: 70%;
    width: 100%;
    background: transparent;
    margin: 0 auto;
    position: relative;
}

.gallary{background: #FFFFFF;position: relative;width: 100%;/* overflow-y: scroll; */overflow-x: hidden;padding: 0px 0 150px 0;}



.intro-section {
    background: #000;
    position: relative;
    margin-top: 45px;
    box-sizing: border-box;
    padding: 60px;
}
	.intro-section article {
    max-width: 70%;
    width: 100%;
    background: transparent;
    margin: 0 auto;
    position: relative;
}
	.intro-section h1 {
    font-family: 'Bodoni Moda', serif;
    font-size: 70px;
    color: #262424;
    text-align: center;
    font-weight: 400;
    line-height: 1.1;
    margin-top: 0px;
    letter-spacing: -3px;
    margin-bottom: 0;
}
	.intro-section h1 + h5 {
    font-size: 20px;
    color: #FFCF36;
    text-align: center;
    margin: 0;
    margin-bottom: 100px;
    font-weight: 600;
}
	.image-block {
    border: 40px solid #FFCF36;
    box-sizing: border-box;
    background: url(../images/vic.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center bottom;
    min-height: 800px;
    padding: 30px;
}

	.vic-block {
    float: left;
    width: 85%;
    box-sizing: border-box;
    padding-right: 200px;
    padding-top: 260px;
    padding-left: 300px;
}
	.vic-block h3 {
    color: #fff;
    font-family: 'Bodoni Moda', serif;
    font-size: 70px;
    text-align: right;
    letter-spacing: -3px;
    font-weight: 500;
    margin-bottom: 0;
    line-height: 1;
}
	.vic-block p {
    color: #fff;
    text-align: right;
    font-size: 20px;
}
	.vic-block p + p {
    color: #fff;
}




	.classification-block {
    float: left;
    width: 15%;
    box-sizing: border-box;
    padding-left: 0px;
}
	.classification-block ul {
    list-style: none;
}
	.classification-block ul li {
    margin-bottom: 25px;
    position: relative;
}

.classification-block ul li:after {
 width: 70px;
 height: 70px;
 content:'';
 position: absolute;
 top: 0;
 left: -80px;
}

.classification-block ul li:nth-of-type(1):after {
background: url("../images/Wife small pic.jpg");
}
.classification-block ul li:nth-of-type(2):after {
background: url("../images/Daughters small pic.jpg");
}

.classification-block ul li:nth-of-type(3):after {
background: url("../images/Grankids small pic.jpg");
}

.classification-block ul li:nth-of-type(4):after {
background: url("../images/Friend small pic.jpg");
}

.classification-block ul li:nth-of-type(5):after {
background: url("../images/Countries small pic.jpg");
}





	.classification-block ul li big {
    display: block;
    color: #fff;
    font-size: 25px;
    font-weight: 600;
    font-family: 'Bodoni Moda', serif;
    padding-left: 15px;
}
	.classification-block ul li small {
    display: block;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 14px;
}

	p.intro {
    color: #fff;
    text-align: center;
    font-style: italic;
	font-family: 'Bodoni Moda', serif;
		font-size: 20px;
		margin-top: 80px;
}
	p.name{
    font-size: 20px;
    color: #2F71B1;
    text-align: center;
    margin: 0;
    margin-bottom: 100px;
}





p.yellow{position: relative;display: block;border: 0;}
p.yellow:after { position: absolute; content: ''; background:#FFCF36; width: 70px; height: 5px; left: 50%; transform: translateX(-50%); }


.audio{position: absolute;left: -300px;top: 50%;transform: translateY(-50%);z-index: 99;}
.audio.active{left: 7px;}

.audio .trig{position: absolute;right: -54px;height: 54px;width: 54px;top: 0px;background:#FFCF36;border-radius: 50%;cursor: pointer;border: 2px solid #000;}
.audio .trig::after{content: '\e6e4';font-family: 'icomoon';position: absolute;left: 45%;font-weight: 900;top: 30%;height: 10px;width: 10px;transform: translate(-50%) rotate(0deg);transition: .35s linear all;}


.audio.active .trig::after{content: '';position: absolute;left: 52%;top: 44%;height: 10px;width: 10px;transform: translate(-50%) rotate(135deg);border-bottom: 3px solid #000;border-right: 3px solid #000;transition: .35s linear all;}


.video{ position: fixed; top: 10%; height: 80%; width: 60%; background: #fff; left: 50%; transform: translateX(-50%); z-index: 999;}

.video .close{ position: absolute; top: 15px; right: 15px; color: #000; font-size: 30px;}



footer{
    padding: 25px 0;
    background: #000;
}

footer article{}

footer h4{
    text-align: center;
    color: #fff;
    margin-top: 30px;
    position: relative;
    display: block;
    font-weight: 400;
}

footer ul.footer-nav{
    text-align: center;
}

footer ul.footer-nav li{ position: relative; list-style: none; display: inline-block;margin-right: 30px;}

footer ul.footer-nav li:after{position: absolute;content: '';background:#FFCF36;width: 3px;height: 15px;right: -15px;top: 5px;}
footer ul.footer-nav li:last-of-type:after{ display: none;}

footer ul.footer-nav li a {


    color: #fff;
    font-weight: 400;
}








/*PAGE LOADER*/

.loader-container{width: 100%; height: 100vh; position: fixed; background: transparent; top: 0; left: 0; z-index: 999; display: block;}
.loader-container:before{content: ''; background: #000; width: 50%; left: 0; top: 0; transition: 1s all linear; position: absolute; height: 100%; display: block;}
.loader-container:after{content: ''; background: #000; width: 50%; right: 0; top: 0; transition: 1s all linear; position: absolute; height: 100%; display: block;}

.loader-container.closed{width: 100%; height: 100vh; position: fixed; background: transparent; -webkit-animation: hide 2s linear 1;  animation: hide 2s linear 1;-webkit-animation-fill-mode: forwards; animation-delay: 1s;}
.loader-container.closed:before{width: 0%;transition: 1s all linear;}
.loader-container.closed:after{width: 0%;transition: 1s all linear;}

@-webkit-keyframes hide {
  0% { display: block; z-index: 999; }
  100% { display: none; z-index: -100; }
}

@keyframes hide {
   0% { display: block; z-index: 999; }
  100% { display: none; z-index: -100; }
}

.loader {
  position: absolute;  left: 50%;  top: 50%;  z-index: 1;  margin: -75px 0 0 -75px;  border: 16px solid rgba(0, 0, 0, 1);  border-radius: 50%;  border-top: 16px solid #FFCF36;	border-bottom: 16px solid #FFCF36;  width: 120px;  height: 120px;  -webkit-animation: spin 2s linear infinite;  animation: spin 2s linear infinite;}

@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}


.youngster .img-container {
    border-bottom: 10px solid #000;
    position: relative;
    margin: 115px auto 30px auto;
    padding: 0px;
    max-height: 650px;
    overflow: hidden;
    display: block;
    max-width: 600px;
}

.youngster .img-container img{ max-width: 100%; display: block; margin: 0 auto;}


p.day{font-size: 20px;}
p.day span{ position:relative; display: inline-block; margin-right: 30px; font-weight: bold;}

p.day span:after{position: absolute;content: '';background:#FFCF36;width: 3px;height: 25px;right: -19px;top: 6px;}

.youngster h3{font-size: 30px;font-weight: bold;margin-bottom: 15px;color: #000;}
.youngster p.intro{font-size: 20px!important;font-weight: 500;text-align: left;margin: 0 0 60px 0;color: #000;font-style: normal;font-family: 'Montserrat', sans-serif;}



.husband h3{font-size: 30px;font-weight: bold;margin-bottom: 15px;color: #000;}
.husband p.intro{font-size: 20px!important;font-weight: 500;text-align: left;margin: 0 0 60px 0;color: #000;font-style: normal;font-family: 'Montserrat', sans-serif;}
.husband .img-container{border-bottom: 10px solid #000;position: relative;margin: 115px auto 30px auto;padding: 0px;max-height: auto;overflow: hidden;display: block;width: auto;}

.husband .img-container img{ max-width: 100%; display: block; margin: 0 auto;}


.oupa h3{font-size: 30px;font-weight: bold;margin-bottom: 15px;color: #000;}
.oupa p.intro{font-size: 20px!important;font-weight: 500;text-align: left;margin: 0 0 60px 0;color: #000;font-style: normal;font-family: 'Montserrat', sans-serif;}
.oupa .img-container{border-bottom: 10px solid #000;position: relative;margin: 115px auto 30px auto;padding: 0px;max-height: auto;overflow: hidden;display: block;width: auto;}

.oupa .img-container img {
    max-width: 76%;
    display: block;
    margin: 0 auto;
}


.audio .trig span {
    display: block;
    position: absolute;
    width: 400px;
    left: 117%;
    top: 25%;
    color: #fff;
}



.classification-block ul li:last-of-type small {
    margin-bottom: 0;
}





.friend h3{font-size: 30px;font-weight: bold;margin-bottom: 15px;color: #000;}
.friend p.intro{font-size: 20px!important;font-weight: 500;text-align: left;margin: 0 0 60px 0;color: #000;font-style: normal;font-family: 'Montserrat', sans-serif;}
.friend .img-container{border-bottom: 10px solid #000;position: relative;margin: 115px auto 30px auto;padding: 0px;max-height: auto;overflow: hidden;display: block;width: auto;}

.friend .img-container img {
    max-width: 76%;
    display: block;
    margin: 0 auto;
}




.img-cont img{max-height: 190px;margin-right: 10px; margin-bottom: 10px; line-height: 1;}






.adventurer h3{font-size: 30px;font-weight: bold;margin-bottom: 15px;color: #000;}
.adventurer p.intro{font-size: 20px!important;font-weight: 500;text-align: left;margin: 0 0 60px 0;color: #000;font-style: normal;font-family: 'Montserrat', sans-serif;}
.adventurer .img-container{border-bottom: 10px solid #000;position: relative;margin: 115px auto 30px auto;padding: 0px;max-height: auto;overflow: hidden;display: block;width: auto;}

.adventurer .img-container img {
    max-width: 76%;
    display: block;
    margin: 0 auto;
}

.img-cont p{display: inline-block; font-size: 18px;}
.img-cont img:last-of-type{margin-right: 0px;}


.img-gal{ display: inline-block; margin-right: 15px; max-height: 250px; }
h6{ font-size: 45px; text-align: center; font-weight: 400;font-family: 'Bodoni Moda', serif; margin-bottom: 25px;}
.button {
    position: relative;
    background-color: #4CAF50;
    border: none;
    font-size: 20px;
    color: #FFFFFF;
    padding: 20px;
    width: 200px;
    text-align: center;
    transition-duration: 0.4s;
    text-decoration: none;
    overflow: hidden;
    font-family: 'Bodoni Moda', serif;
    cursor: pointer;
}





.button a {
    color: #fff;
}




#videoContainer {position: relative;opacity: 1;display: block;margin: 0 auto;padding: 0px;margin-bottom: 60px;border: 0;background: #fff;top: 0%;box-sizing: border-box;left: 0%;width: 80%;height: 100%;overflow: hidden;-ms-transition: all 0.5s ease;-webkit-transition: all 0.5s ease;transition: all 0.5s ease;z-index: 0;}
.videoBG {
position: relative;
top: 0;
right: 0;
bottom: 0;
left: 0;
overflow: hidden;
width: 100%;
height: 100%;
box-sizing: border-box;
max-width: 1920px;
margin: 0 auto;
}
.videoBG > video { position: relative; top: 0; left:0; width: 100%;  height: 100%;margin:0 auto;padding:0;box-sizing: border-box;  -ms-transition:all .5s ease;-webkit-transition:all .5s ease;transition:all .5s ease;}


@media (min-aspect-ratio: 16/9) {
.videoBG > video { height: 300%; top: -100%; }
}
@media (max-aspect-ratio: 16/9) {
.videoBG > video { width: 300%; left: -100%; }
}
@supports (object-fit: cover) {
.videoBG > video {
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover;
}
}







@media screen and (max-width: 1440px) {

nav {
  width: 80%;
}

}








@media screen and (max-width: 1366px) {
  .vic-block {
    width: 85%;
    padding-right: 120px;
    padding-left: 198px;
}
	nav {
    width: 82%;
}
article {
    max-width: 80%;
}
.vic-block h3 {
    font-size: 42px;
}
.vic-block p {
    font-size: 14px;
}
.classification-block ul li small {

    font-size: 12px;
}

.classification-block ul li big {

    font-size: 21px;

}






}





	@media screen and (max-width: 1280px) {


}


	@media screen and (max-width: 1080px) {


.logo img {
    width: 69%;
}
nav {
    width: 64%;
    margin-top: 26px;
}
	.nav-list li {
    float: left;
    width: auto;
    padding: 0 15px;
    height: 45px;
    line-height: 45px;
    font-size: 17px;
    color: #707070;
    font-weight: 500;
}

}






@media screen and (max-width: 768px) {

	nav {
    width: 70%;
    margin: 0 auto;
    margin-top: 8px;
    float: none;
}
.logo {
    float: none;
    position: relative;
    z-index: 999;
}

.logo img {
    width: 193px;
}


.nav-list li {
    float: left;
    width: auto;
    padding: 0 15px;
    height: 45px;
    line-height: 45px;
    font-size: 12px;
    color: #707070;
    font-weight: 500;
}


}


@media screen and (max-width: 600px) {
	
.loader, .loader-container{display: none;}
	
	 .youngster h3, .father h3, .husband h3, .adventurer h3, .friend h3, .gallary h3  {
    font-size: 20px;
    
}
	
	.intro-section article {
    max-width: 100%;
   
}
	.audio {
    position: fixed;
    left: -300px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 99;
}
	.video{ display: none;}	
	
	
p.day {
    font-size: 15px;
}	
	
p.day span:after {
    
    top: -3px;
}	
	
	
.intro-section h1 {
    font-size: 29px;
    
}	

 .youngster p.intro, .father p.intro, .husband p.intro, .adventurer p.intro, .friend p.intro, .gallary p.intro  {
     font-size: 17px!important;
    
}	
	
	
p {
    font-size: 15px;
    
}	
	
	
	
	
	
	
	
.intro-section h1 + h5 {
    font-size: 12px;
   
}	
	
.image-block {
    border: 10px solid #FFCF36;
	min-height: auto;
    
}	
	
	
	.img-gal {
    margin-right: 15px;
    max-height: initial;
    max-width: 80%;
    margin: 15px auto;
    display: block;
}
	
	
	
	.classification-block {
    float: left;
    width: 100%;
    box-sizing: border-box;
    padding-left: 119px;
}
.vic-block {
    float: left;
    width: 100%;
    box-sizing: border-box;
    padding-right: 0;
    padding-top: 0px;
    padding-left: 0;
}	
	
.vic-block h3 {
    font-size: 30px;
    text-align: center;
}	
	
.vic-block p {
    font-size: 12px;
    text-align: center;
}	
	
.audio .trig span {
   
    display: none;
}	
	
nav {
    width: 100%;
    
}	
.nav-list li {
    width: auto;
    padding: 0 10px;
    font-size: 10px;
}	
	
	
	
	
	
	
	

.logo img {
    width: 116px;
}
.nav-list li {
    float: left;
    width: auto;
    padding: 0 5px;
    height: 45px;
    line-height: 45px;
    font-size: 12px;
    color: #707070;
    font-weight: 500;
}

	nav {
    width: 95%;
    margin: 0 auto;
    margin-top: 8px;
    float: none;
}
.intro-section {
   
    margin-top: 100px;
   
}
.youngster .img-container {
    border-bottom: 10px solid #000;
    position: relative;
    margin: 170px auto 30px auto;
    padding: 0px;
    max-height: 650px;
    overflow: hidden;
    display: block;
    max-width: 600px;
}
}


@media screen and (max-width: 400px) {
.classification-block {
    float: left;
    width: 100%;
    box-sizing: border-box;
    padding-left: 66px;
}

.nav-list li {
    float: left;
    width: auto;
    padding: 0 5px;
    height: 45px;
    line-height: 45px;
    font-size: 9px;
    color: #707070;
    font-weight: 500;
}


}
