@import url('https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i');

::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	background-color: #F5F5F5;
	
}
::-webkit-scrollbar
{
	width: 5px;
	background-color: #F5F5F5;
	
}
::-webkit-scrollbar-thumb
{
	background-color: #34485d;	
	
}

body
{
	font-family: 'Roboto', sans-serif !important;
}

.nav_logo
{
	height: auto;
	width: 2em;
	float: left;
	margin: 0.8em 1em 0 1em;
}

.main_content
{
	height: 100vh;
	overflow-y: scroll;
	overflow-x: hidden;
}

.home_div
{
	background: linear-gradient(272deg, #0096a6, rgba(0,0,0,0.5), #06815c, rgba(0,0,0,0.5));
	background-size: 600% 600%;

	-webkit-animation: AnimationName 40s ease infinite;
	-moz-animation: AnimationName 40s ease infinite;
	-o-animation: AnimationName 40s ease infinite;
	animation: AnimationName 40s ease infinite;



	min-height: 80vh;
}
@-webkit-keyframes AnimationName {
    0%{background-position:0% 53%}
    50%{background-position:100% 48%}
    100%{background-position:0% 53%}
}
@-moz-keyframes AnimationName {
    0%{background-position:0% 53%}
    50%{background-position:100% 48%}
    100%{background-position:0% 53%}
}
@-o-keyframes AnimationName {
    0%{background-position:0% 53%}
    50%{background-position:100% 48%}
    100%{background-position:0% 53%}
}
@keyframes AnimationName { 
    0%{background-position:0% 53%}
    50%{background-position:100% 48%}
    100%{background-position:0% 53%}
}
.navbar-brand
{
	font-weight: 300;
	margin: 0.4em 0 0.2em 0.1em !important;
	color: rgba(0,0,0,0.4) !important;
}


.shadow_eff
{
	box-shadow: 0px 0px 15px #cccccc !important;
}
.nav_link
{
	
	text-decoration: none !important;
	-webkit-transition: all 0.4s ease !important;
	transition: all 0.4s ease !important;
	font-weight: bolder;
	border-style: solid;
	border-width: 0 0 0 1px;
	border-color: rgba(0,0,0,0.2); 
	margin: 1em;

}

.qp_bk
{
	background-image: url(../images/qp_bk.jpg);
	
	width: 100vw;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	background-position:center;
	margin-right: 0;
	text-align: justify;
}
.nav_link i
{
	
	color: #0096a6 ;

}

.qp_blue
{
	color: #0096a6;
}

.nav_link:hover 
{
	
	border-color: #0096a6;
	border-width: 0 0 0 3px;
	transform: scale(1.1);
	text-decoration: none !important;
	-webkit-transition: all 0.4s ease !important;
	transition: all 0.4s ease !important;
}

.home_div_h1
{
	color: #ffffff;
	font-size: 5vmax;
	font-weight: lighter;
	background-color: rgba(255,255,255,0.1);
	padding: 0.3em 1em 0.3em 1em !important;
}

.home_div_h3
{
	color: #ffffff;
	font-size: 2vmax;
	
}

.slb
{
	border-style: solid !important;
	border-width: 2px !important;
	border-color: rgba(255,255,255,0.9) !important;
	border-radius: 0.5em !important;
	
	background-color: rgba(255,255,255,0.3);
	color: #ffffff !important;
	-webkit-transition: all 0.4s ease !important;
	transition: all 0.4s ease !important;

}

.slb:hover
{
	border-style: solid !important;
	border-width: 2px !important;
	border-color: rgba(255,255,255,0.9) !important;
	border-radius: 0.5em !important;
	min-width: 15vw;
	min-height: 5vh;
	background-color: rgba(255,255,255,0.8);
	color: #0096a6 !important;
	transform: scale(1.1);
	font-weight: 800;
	-webkit-transition: all 0.4s ease !important;
	transition: all 0.4s ease !important;

}

.info_h1
{
	color: rgba(0,0,0,0.6);
	font-weight: lighter;
	font-size: 4vmax;
}

.info_ol
{
	color: rgba(0,0,0,0.6);
	
}

.info_ol li
{
	margin: 0.5vmax 0 0.5vmax 0;
}

.info_ico
{
	font-size: 4.5vmax;
	color: rgba(0,0,0,0.3);
}

.team_info
{
	background: linear-gradient(272deg, #0096a6,  #06815c);
	background-size: 600% 600%;

	-webkit-animation: AnimationName 40s ease infinite;
	-moz-animation: AnimationName 40s ease infinite;
	-o-animation: AnimationName 40s ease infinite;
	animation: AnimationName 40s ease infinite;
	min-height: 20vh;
}

.team_h1, .team_h3, .team_h3 small
{
	color: rgba(255,255,255,0.9);
	font-weight: 100;
}

.team_h5 small , .team_h5 small a
{
	color: rgba(255,255,255,0.4);
	font-weight: 100;
}

.user_img
{
	margin-top: 1em;
	width: 8vmax;
	height: auto;
}

.user_name, .user_name small
{
	font-weight: 100;
}

.info_head
{
	font-weight: 300;
	text-align: center;
}

.pdf_img
{
	width: 6vw;
	height: auto;
}

.doc_img
{
	height: auto;
	width: 8vmax;
	opacity: 0.4;
}
/*for phone*/
@media only screen and (max-width: 775px) {
    

    .phone_hide
    {
    	display: none !important;
    }



    .qp_bk, .home_div
	{
		 /* For browsers that do not support gradients */
		min-height: 60vh;
	}

	.navbar-brand
	{
		font-size: 3vmax !important;
		font-weight: 400;
	}

	.menu_btn
	{
		border-style: solid !important;
		border-width: 0 0 0 1px !important;
		border-radius: unset !important;
		margin-top: 1em !important;
		-webkit-transition: all 0.4s ease !important;
		transition: all 0.4s ease !important;
	}

	.menu_btn:focus
	{
		border-style: solid !important;
		border-width: 0 0 0 3px !important;
		border-color: #0096a6 !important;
		border-radius: unset !important;
		margin-top: 1em !important;
		-webkit-transition: all 0.4s ease !important;
		transition: all 0.4s ease !important;
	}

	.slb
	{
		min-width: 50vw;
		min-height: 5vh;
	}

	.info_h1
	{
		text-align: center;
	}

	.info_ol
	{
		font-weight: 100;
		font-size: 2vmax;
		text-align: justify-all;
	}
	
  
}

/* for pc*/
@media only screen and (min-width: 775px) {
  
   
    .phone_view
    {
    	display: none;
    }

    .qp_bk, .home_div
	{
		 /* For browsers that do not support gradients */
		min-height: 80vh;
	}

	.navbar-brand
	{
		font-size: 2vmax !important;

	}

	.slb
	{
		min-width: 15vw;
		min-height: 5vh;
	}

	.info_ol
	{
		font-weight: 100;
		font-size: 1vmax;
	}

}