/*!
 * Start Bootstrap - Grayscale v5.0.8 (https://startbootstrap.com/template-overviews/grayscale)
 * Copyright 2013-2019 Start Bootstrap
 * Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap-grayscale/blob/master/LICENSE)
 */
.head_p {padding: 0 1rem}
.content {padding: 0 2rem}
.test{border-bottom: 1px solid rgba(255,255,255,.3); border-top: 0px solid rgba(255,255,255,.3)}

#team_list .va {padding: 0 1rem 1rem; justify-content: flex-start}
#team_list .va a{font-size: .8rem;font-weight:800; margin: 0; padding-left: 1rem}
#team_list .btn-primary{background-color:transparent;border: solid 1px rgba(255,255,255,.3); font-size: 2px}
#team_list .btn-primary:hover{background-color:white!important}
#team_list .btn-primary:focus{background-color:whitesmoke!important}
#team_list .btn-primary:active{background-color:transparent!important}
#team_list a:hover{color: black!important}

.nav-item a{font-weight: 600; font-size: .9rem}
.company_b a{font-size: 2rem;line-height: 2.8rem; font-weight:800; margin: 0; color: white}
.company_b a:hover{color: rgba(255,255,255,.5)!important}
.navbar {border-bottom: 1px solid rgba(255,255,255,.3)}

.company_b,.team_list {display: none}

.custom-x {width:100px;height:auto}
#breaker2 .sponsor_logos {width:auto;height:15px}

#breaker1 .carousel-project {display: none}
#breaker1 .carousel-project-mobile {display: block}
.breaker1-section{padding:.5rem 0;background-color:#f5f5f5}
#breaker1 .sponsor_logos{padding: 0 2rem;}
#breaker1 .img-fluid {height: 50px; padding: .3rem}

.breaker1-section{position:relative;width:100%;height:auto;
background:url(../img/Background.jpg);
background-position:center;
background-repeat:no-repeat;
background-attachment:fixed;
background-size:cover;
}

.modal .nav-item a{font-weight: 800; font-size: 2rem}
.modal .navbar-nav {padding: 1rem 0 0 0}


/* TEST */
.fa-1x {
font-size: 1.5rem;
}
/* .navbar-toggler.toggler-example {cursor: pointer;} */
.modal-dialog {width: 100% !important; height: 100% !important; margin: 0 !important; padding: 0 !important;max-width:none !important;}
.modal-content {height: auto !important;min-height: 100% !important;border-radius: 0 !important;border-color: rgba(0,0,0,.95);background-color:rgba(0,0,0,.95)!important;}

/* MODAL */
.modal .navbar-nav {padding: 1rem 0 0 0}

.modal .h4 {font-size: 2rem; font-weight: 700; margin-bottom: 1.3rem; max-width: 35rem}
.modal .navbar-nav .nav-link {align-items: center!important;color: rgba(255,255,255,1);border-bottom: 2px solid; width: auto; border-bottom-color: transparent}
.modal .navbar-nav .nav-link:focus, .modal .navbar-nav .nav-link:hover {color: #ad2018;background-color: none !important;border-bottom: 2px solid;border-bottom-color: #ad2018; width: auto}

.container .page-header > h7 {font-size: 12px;}

#mainNav{padding-top:0;padding-bottom:0;border-bottom:none;background-color:black;-webkit-transition:background-color .3s ease-in-out;transition:background-color .3s ease-in-out;font-size: 1rem;text-transform: none}
#mainNav .navbar-brand{padding:.5rem 0;color:rgba(255,255,255,.5)}
#mainNav .nav-link{-webkit-transition:none;transition:none;padding:1.2rem 1.5rem;color:white}
#mainNav .navbar-nav .nav-link:hover{color:black;outline:0}

#mainNav .navbar-nav .nav-link.active{color:white;outline:0;border-bottom:.17rem solid white}
#mainNav .navbar-nav .nav-link:focus{outline:0;background-color:transparent;color:white}
#mainNav.navbar-shrink{background-color:rgba(0,0,0,.4);font-size: 1rem;text-transform: none}

/*	#mainNav{min-height:56px;background-color:#252423;margin-top: 0} */

#mainNav .navbar-toggler{font-size:90%;padding:.75rem;color:white;border:0px solid #171618}
#mainNav .navbar-toggler{color: white; outline:0}
#mainNav .navbar-toggler:hover{color: #ad2018; outline:0}


.masthead{position:relative;width:100%;height:auto;
background: url(../img/lol2.jpg);
background-position:center;
background-repeat:no-repeat;
background-attachment:fixed;
background-size:cover;
}

.breaker2-section{background-color: #030406
}

.masthead{height:100vh;padding:0rem;margin-top: 0}
.masthead h3{font-size:0.8rem;line-height:2.5rem;letter-spacing:0.1rem;font-weight:500;margin: 0; padding: 0 1rem}
.masthead h1{font-size:1.8rem;line-height:4rem;letter-spacing:0rem; margin: 0; font-weight: 800}
.masthead h2{max-width:20em;font-size:.9rem;line-height:1.5rem;font-weight:400; margin-right: 0}
.masthead a{color:#171618;font-size: 0.8rem;font-weight:800;margin-right: 10%}
.masthead a:hover{color:black!important}

.btn{-webkit-box-shadow:0 .1875rem .1875rem 0 rgba(0,0,0,.1)!important;box-shadow:0 .1875rem .1875rem 0 rgba(0,0,0,.1)!important;padding:1rem 1.5rem;font-size:50%;letter-spacing:.05rem;border:0;border-radius: 0}

.btn-primary{background-color:transparent;border: solid 1px white; font-size: 2px}
.btn-primary:hover{background-color:white!important}
.btn-primary:focus{background-color:whitesmoke!important}
.btn-primary:active{background-color: white!important}

.title {padding: 15rem 0 0;}
#breaker2 a{font-size: .8rem;font-weight:800; margin: 0}

footer hr { display: block; height: 1px; border: 0; border-top: 0.5px solid rgba(255,255,255,.1); margin: 0; padding: 0; }

/* HISTORY */
.breaker2-section {padding: 2rem 0 5rem}
#breaker2  h1{font-size:1.5rem;line-height:2.5rem;letter-spacing:.1rem;font-weight:800; margin: 0}
#breaker2 .img-fluid {width: 100%}
#breaker2 .col-md-2 {margin-bottom: 2rem}

.part1{padding:5rem 1rem}
.part1 h2{font-weight: 800;margin-bottom: 0; line-height: 4.5rem; letter-spacing: 0; padding: 0; font-size: 1.3rem; text-align: left}
.part1 .des p{max-width:40rem;font-size:.9rem;line-height:2rem;font-weight:400; letter-spacing: 0; padding-left: 0rem; margin-bottom: 1rem}
.part1 .pro {padding-top: 5rem; margin-top: 5rem}

#breaker2 h2{font-weight: 800;margin-bottom: 0.5rem; line-height: 1.5rem; letter-spacing: 0; padding-left: 1rem; font-size: 2rem}
#breaker2 h6{font-weight: 400;margin-bottom: 1.5rem; line-height: 1.5rem; letter-spacing: 0; padding-left: 1rem; font-size: 1rem}
#breaker2 .des p{max-width:40rem;font-size:.8rem;line-height:2rem;font-weight:400; letter-spacing: 0; padding-left: 1rem}

#breaker2 a {text-decoration: none; color: white!important; font-size: 1rem}
#breaker2 a:hover{text-decoration: none;color:rgba(157,158,159,.5)}
#breaker2 .social {width:auto;height:85px;font-size:4rem; padding: 2rem 2rem}
#breaker2 .follow {margin: auto}

/* [1] The container */
.img-hover-zoom {
  height: auto; /* [1.1] Set it as per your need */
  overflow: hidden; /* [1.2] Hide the overflowing of child elements */
}

/* [2] Transition property for smooth transformation of images */
.img-hover-zoom img {
  transition: transform 3s ease;
}

/* [3] Finally, transforming the image when container gets hovered */
.img-hover-zoom:hover img {
  transform: scale(1.05);
}

.card-img-overlay{
transition: .5s ease; 
opacity: 1; 
background: linear-gradient(to bottom, rgba(23, 24, 25, 0) 0%, rgba(23, 24, 25, 0.7) 75%, #171819 100%) 
}

.img-hover-text:hover .card-img-overlay{opacity: 1;}

.img-hover-text:hover .card-img {opacity: 1}
.card-img {opacity: 1;
display: block;
width: 100%;
height: auto;
transition: .5s ease;
backface-visibility: hidden;}

/* SPONSOR */
#sponsor h2{font-weight: 800;margin-bottom: 1rem; letter-spacing: 0; padding-left: 1rem; font-size: 1.7rem}
#sponsor .des p{max-width:20rem;font-size:0.9rem;line-height:2rem;font-weight:400; letter-spacing: 0; padding-left: 1rem; text-align: center}
.sponsor-section{padding: .5rem 0}

#sponsor .col-md-3{margin: 1rem}
#sponsor .img-fluid {height: 50px; padding: .3rem}

#sponsor .sponsor_logos{padding: 0 2rem;}

/* INFO */
.info-section{padding:5rem 0 0rem 0}
/*
.info-section{position:relative;width:100%;height:800px;
background:url(../img/info.jpg);
background-position:center;
background-repeat:no-repeat;
background-attachment:scroll;
background-size:cover;
} */

#info h2{font-weight: 800;margin-bottom: 1rem; letter-spacing: 0; padding-left: 0rem; font-size: 1rem}
#info h6{font-weight: 500;margin-bottom: 0.5rem; letter-spacing: .3rem; padding-left: 0rem;font-size: .9rem}
#info a {text-decoration: none; color: white}
#info a:hover{text-decoration: none;color:rgba(0,0,0,.5)}
#info .des p{max-width:20rem;font-size:0.9rem;line-height:2rem;font-weight:400; letter-spacing: 0; padding-left: 1rem}

#info .img-fluid {height: 140px}
#info .first {margin-bottom: 3rem}

#info .social {width:auto;height:25px;font-size:2rem; padding: 2rem 2rem 0 0}
#info .follow {margin-right: 1.5rem}

.info-section .social a{color:white}
.info-section .social a:hover{text-decoration:none;color:rgba(23,23,25,.5)}
.info-section .social a:active{color:#fff}body{letter-spacing:.0625em}a{color:#64a19d}a:focus,a:hover{color:rgba(255,255,255,.5)}.bg-black{background-color:#161616!important}

@media (min-width:768px){
	.modal .nav-item a{font-weight: 800; font-size: 2.5rem}
	.company_b,.team_list {display: block}
	#breaker1 .carousel-project {display: block}
	#breaker1 .carousel-project-mobile {display: none}
	.test{border-bottom: 0px solid rgba(255,255,255,.3); border-top: 0px solid rgba(255,255,255,.3)}
	
	.masthead h1{font-size: 3rem}
	.masthead h2{max-width: 35rem}
	
	.masthead{position:relative;width:100%;height:500px;
	background: url(../img/lol2.jpg);
	background-position:center;
	background-repeat:no-repeat;
	background-attachment:scroll;
	background-size:cover;
	}
	
	.breaker2-section{background-color: #030406;
	}
	
	/* INFO */
	.info-section{padding:5rem 0 0rem 0}
	/*
	.info-section{position:relative;width:100%;height:450px;
	background:url(../img/info.jpg);
	background-position:center;
	background-repeat:no-repeat;
	background-attachment:scroll;
	background-size:cover;
	} */
	
	#breaker2 h2{font-weight: 800;margin-bottom: 0.5rem; line-height: 1.5rem; letter-spacing: 0; padding-left: 1rem; font-size: .5rem}
	#breaker2 h6{display: none}
	#breaker2 .des p{display: none}
	#breaker2 a {text-decoration: none; color: white!important; font-size: .7rem}
	#breaker2 a:hover{text-decoration: none;color:rgba(157,158,159,.5)}
	#breaker2 .social {width:auto;height:45px}
}

@media (min-width:992px){
	.test{border-bottom: 1px solid rgba(255,255,255,.3); border-top: 0px solid rgba(255,255,255,.3)}
	.navbar {border-bottom: 0px solid rgba(255,255,255,.3)}
	.head_p {padding: 0 4rem}
	.content {padding: 0 10rem}
	.company_b,.team_list {display: block}
	
	#breaker1 .carousel-project {display: block}
	#breaker1 .carousel-project-mobile {display: none}
	.custom-x {width:25%;height:auto}
	
	.masthead{height:100vh;padding:0;margin: 0}
	
	.breaker1-section{position:relative;width:100%;height:auto;
	background:url(../img/Background.jpg);
	background-position:center;
	background-repeat:no-repeat;
	background-attachment:scroll;
	background-size:cover;
	}
	
	#breaker1 .img-fluid {height: 80px; padding: 1rem}
	#breaker1 .sponsor_logos{padding: 0 5rem;}
	
	#team_list .btn{-webkit-box-shadow:0;box-shadow:0;padding:1rem 1.5rem;font-size:50%;letter-spacing:.05rem;border:0;border-radius: 0;}
	#team_list .btn-primary{background-color:transparent!important;border: solid 1px rgba(255,255,255,.3); font-size: 2px; text-decoration: none}
	#team_list .btn-primary:focus{background-color:transparent!important}
	
	#team_list .va .btn-primary:hover{background-color:white!important}
	#team_list .va .btn-primary:active{background-color:white!important}
	
	/* NEW */
	
	.masthead h3{font-size:1rem;line-height:2.5rem;letter-spacing:0.1rem;font-weight:800;margin: 0; padding: 0 1rem}
	.masthead h1{font-size:4rem;line-height:5rem;letter-spacing:.1rem; margin: 0}
	.masthead h2{max-width:35rem;font-size:1rem;line-height:2rem;font-weight:400; margin-right: 0}
	.masthead a{color:#171618;font-size: 0.9rem;font-weight:800; margin-right: 0}
	.masthead a:hover{color:black!important}
	.masthead .title {padding-top: 35%}
	
	/* MODAL */
	.modal .navbar-nav {padding: 3rem 0 0 0}
	
	.modal .h4 {font-size: 2.3rem; font-weight: 800; margin-bottom: 1.3rem; max-width: 35rem}
	.modal .navbar-nav .nav-link {align-items: center!important;color: rgba(255,255,255,1);border-bottom: 2px solid; width: 60%; border-bottom-color: transparent}
	.modal .navbar-nav .nav-link:focus, .modal .navbar-nav .nav-link:hover {color: #ad2018;background-color: none !important;border-bottom: 2px solid;border-bottom-color: #ad2018; width: 60%}
	
	
	.masthead{position:relative;width:100%;height:800px;
	background: url(../img/lol2.jpg);
	background-position:center;
	background-repeat:no-repeat;
	background-attachment:fixed;
	background-size:cover;
	}
	
	.breaker2-section{background-color: #030406
	}
	
	.btn{-webkit-box-shadow:0 .1875rem .1875rem 0 rgba(0,0,0,.1)!important;box-shadow:0 .1875rem .1875rem 0 rgba(0,0,0,.1)!important;padding:1rem 1.5rem;font-size:50%;letter-spacing:.05rem;border:0;border-radius: 0;}
	
	.btn-primary{background-color:transparent;border: solid 1px white; font-size: 2px; text-decoration: none; margin: 0}
	.btn-primary:hover{background-color: white!important}
	.btn-primary:focus{background-color:whitesmoke}
	.btn-primary:active{background-color:white!important}
	
	
	
	/* IMAGES */
	.card-img-overlay{
	transition: .5s ease; 
	opacity: 0; 
	background: linear-gradient(to bottom, rgba(23, 24, 25, 0) 0%, rgba(23, 24, 25, 0.7) 75%, #171819 100%) 
	}

	.img-hover-text:hover .card-img-overlay{opacity: 1;}

	.img-hover-text:hover .card-img {opacity: 1}
	.card-img {opacity: 1;
	display: block;
	width: 100%;
	height: auto;
	transition: .5s ease;
	backface-visibility: hidden;}
	
	
	.projects-section{padding:5rem 4rem 4rem}
	#breaker2 h2{font-weight: 800;margin-bottom: 0.5rem; line-height: 1.5rem; letter-spacing: 0; padding-left: 1rem; font-size: 1.5rem}
	#breaker2 h6{font-weight: 400;margin-bottom: 0.5rem; line-height: 1.5rem; letter-spacing: 0; padding-left: 1rem; font-size: 1rem; display: block}
	#breaker2 .des p{max-width:40rem;font-size:.7rem;line-height:2rem;font-weight:400; letter-spacing: 0; padding-left: 1rem}
	
	#breaker2  h1{font-size:2.5rem;line-height:2.5rem;letter-spacing:.1rem;font-weight:800; margin: 0}
	.breaker2-section {padding: 5rem 0 8rem}
	#breaker2 .carousel-project {display: block; margin-bottom: 8rem}
	#breaker2 .carousel-project-mobile {display: none; margin-bottom: 8rem}
	/* #breaker2 .carousel-project {padding: 2rem; background-color: black} */
	
	.part1{padding:5rem 4rem}
	.part1 h2{font-weight: 800;margin-bottom: 0; line-height: 4.5rem; letter-spacing: 0; padding: 5rem 0 1rem; font-size: 2rem}
	.part1 .des p{max-width:40rem;font-size:1rem;line-height:2rem;font-weight:400; letter-spacing: 0.01rem; padding-left: 0rem; margin-bottom: 1rem}
	.part1 .pro {padding-top: 5rem; margin-top: 5rem}
	
	#breaker2 .social {width:auto;height:25px;font-size:2rem; padding: 0}
	#breaker2 .follow {margin: auto}
	
	#breaker2 a{color:#171618;font-size: 0.9rem;font-weight:800; margin: 0}
	#breaker2 a:hover{color:rgba(157,158,159,.5)!important}
	
	/* SPONSOR */
	#sponsor .col-md-3{margin: 1rem}
	#sponsor .img-fluid {height: 120px; padding: 1rem}
	
	#sponsor .sponsor_logos{padding: 0 5rem;}
	
	/* INFO 
	.info-section{position:relative;width:100%;height:450px;
	background:url(../img/info.jpg);
	background-position:center;
	background-repeat:no-repeat;
	background-attachment:scroll;
	background-size:cover;
	} */

	#info h2{font-weight: 800;margin-bottom: 1rem; letter-spacing: 0; padding-left: 0rem; font-size: 1.1rem}
	#info h6{font-weight: 500;margin-bottom: 0.9rem; letter-spacing: .3rem; padding-left: 0rem;font-size: .9rem}
	#info .des p{max-width:20rem;font-size:0.9rem;line-height:2rem;font-weight:400; letter-spacing: 0; padding-left: 1rem}

	#info .img-fluid {height: 200px}
	#info .first {margin-bottom: 0rem}

	#info .social {width:auto;height:25px;font-size:2rem; padding: 2rem 2rem 0 0}
	#info .follow {margin-right: 2.5rem}
	}


body{

    font-family: 'Roboto', sans-serif;

    /*font-family: 'Open Sans', sans-serif;*/

letter-spacing:.0625em} body a{color:#171618}body a:focus,body a:hover{text-decoration:none;color:#3c6360}
.bg-black{background-color:#161616!important}.bg-primary{background-color:#64a19d!important}.text-primary{color:#171618!important}

footer{padding:4rem 0 2rem;} footer a{color:rgba(255,255,255,.5)}footer a:focus, footer a:hover{color:white;text-decoration:none}
.fa-angle-up:hover {color: red;}/*a{color:#fff}a:focus,a:hover{text-decoration:none;color:#3c6360}*/

::selection {
  background: #ad2018; /* WebKit/Blink Browsers */
  color: white;
}
::-moz-selection {
  background: #ad2018; /* Gecko Browsers */
	color: white;
}