/*******
*
*
* Author Name : Mostafiz Shamim
* Author URI : https://mostafizshamim.com/
* Descripion : This is a responsive Bootstrap responsive template developed by Mostafiz Shamim
* Template URI : https://mostafizshamim.com/demo/developer/
* Version : 1
*
*
*******/

body{
	margin: 0;
	padding: 0;
	font-family: 'PT Serif', serif;
}
h1, h2, h3, h4, h5, h6{
	font-family: 'Montserrat', sans-serif;
}
h1{
	font-size: 30px;
	color: #fff;
	margin-top: 30px;
	line-height: 1;
	margin-bottom: 18px;
}
.top-bar{
	background: #2c3e50;
	padding-bottom: 50px;
	padding-top: 50px;
}
.top-bar h3{
	font-size: 24px;
	text-transform: uppercase;
	color: #fff;
}
.top-bar ul{
	margin: 0;
	padding: 0;
}
.top-bar ul.recent-posts li{
	list-style: none;
	line-height: 2;
}
.top-bar p{
	font-size: 18px;
	color: #fff;
}
.top-bar ul.recent-posts li a{
	color: #fff;
	font-size: 14px;
	text-transform: uppercase;
	text-decoration: underline;
}
.top-bar ul.recent-posts li a:hover{
	text-decoration: none;
}
.top-bar ul.tags li a{
	font-size: 18px;
	color: #fff;
	padding: 5px 10px;
	border: 1px solid #fff;
	margin-bottom: 10px;
	clear: both;
	display: inline-block;
}
.no-padding{
	padding: 0;
}
.banner{
	background: url(../img/banner.jpg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	height: 500px;
	position: relative;
	z-index: 111;
}
.header{
	background: rgba(0, 0, 0, 0.52);
	position: absolute;
	width: 100%;
	height: 500px;
	left: 0;
	margin-top: -500px;
	z-index: 333;
}
.header h4{
	font-size: 18px;
	color: #FFF;
	margin-top: 0;
	line-height: 1;
	margin-bottom: 18px;
}
.user img{
	width: 140px;
	height: 140px;
	margin-top: 80px;
}
.social-icons a i.fa{
	font-size: 25px;
	color: #fff;
	padding: 10px;
	transition: all .5s ease 0s;
	-webkit-transition: all .5s ease 0s;
	-moz-transition: all .5s ease 0s;
	-o-transition: all .5s ease 0s;
}
.social-icons a i.fa-facebook:hover{
	color: #3A5795;
	transform: scale(1.2);
	-webkit-transform: scale(1.2);
	-moz-transform: scale(1.2);
	-ms-transform: scale(1.2);
	-o-transform: scale(1.2);
}
.social-icons a i.fa-twitter:hover{
	color: #55ACEE;
	transform: scale(1.2);
	-webkit-transform: scale(1.2);
	-moz-transform: scale(1.2);
	-ms-transform: scale(1.2);
	-o-transform: scale(1.2);
}
.social-icons a i.fa-instagram:hover{
	color: #D5C7AA;
	transform: scale(1.2);
	-webkit-transform: scale(1.2);
	-moz-transform: scale(1.2);
	-ms-transform: scale(1.2);
	-o-transform: scale(1.2);
}
.social-icons a i.fa-linkedin:hover{
	color: #007BB6;
	transform: scale(1.2);
	-webkit-transform: scale(1.2);
	-moz-transform: scale(1.2);
	-ms-transform: scale(1.2);
	-o-transform: scale(1.2);
}
.social-icons a i.fa-google-plus:hover{
	color: #DA4835;
	transform: scale(1.2);
	-webkit-transform: scale(1.2);
	-moz-transform: scale(1.2);
	-ms-transform: scale(1.2);
	-o-transform: scale(1.2);
}
.social-icons{
	margin-bottom: 66px;
}
.top-nav{
	position: absolute;
	top: 0;
	right: 0;
	border-top: 80px solid #2c3e50;
	border-left: 80px solid transparent;
	z-index: 333;
}
.top-click{
	position: absolute;
	top: 0;
	right: 0;
	z-index: 444;
}
.top-click a i.fa{
	font-size: 18px;
	padding: 15px;
	color: #fff;
}
.main-nav, .navbar-default{
	vertical-align: bottom;
	text-align: center;
}
.navbar-default{
	background: transparent;
	border: 0;
}
ul.navbar, ul.nav{
	display: inline-block;
}
ul.navbar li a, ul.nav li a, .navbar-default .navbar-nav>li>a{
	font-size: 12px;
	color: #fff;
	text-transform: uppercase;
	font-family: 'Montserrat', sans-serif;
	text-decoration: none;
	margin: 0 5px;
}
ul.navbar li a:hover, ul.navbar li a.active, .navbar-default .navbar-nav>li>a:hover, .navbar-default .navbar-nav>li>a.active{
	border-bottom: 5px solid #fff;
	color: #fff;
}
.navbar-nav{
	float: none;
}


/********content section*******/
.content a{
	color: #23527C
}
.content h2{
	margin-bottom: 0;
	margin-top: 0;
}
.content h2 a{
	font-size: 24px;
	color: #444444;
	text-transform: uppercase;
	margin-top: 65px;
	font-weight: bold;
	margin-bottom: 0;
	line-height: 1;
	display: inline-block;
}
.content span{
	font-size: 14px;
	color: #666666;
	line-height: 2;
	margin-bottom: 15px;
	display: inline-block;
	font-family: 'PT Sans', sans-serif;
	margin-top: 25px;
	margin-bottom: 25px;
	line-height: 1;
}
.post-content a img{
	margin-bottom: 20px;
	transition: all .5s ease 0s;
	-webkit-transition: all .5s ease 0s;
	-moz-transition: all .5s ease 0s;
	-o-transition: all .5s ease 0s;
}
.post-content a img:hover{
	opacity: .7;
}
.post-content p{
	font-size: 18px;
	color: #444444;
}
.content a:hover{
	text-decoration: none;
}
.read-more a{
	font-size: 12px;
	color: #777777;
	text-transform: uppercase;
	padding: 10px 20px;
	border: 1px solid #aaaaaa;
	text-decoration: none;
	font-weight: bold;
	margin-top: 30px;
	display: inline-block;
	transition: all .5s ease 0s;
	-webkit-transition: all .5s ease 0s;
	-moz-transition: all .5s ease 0s;
	-o-transition: all .5s ease 0s;
}
.single-post{
	border-bottom: 1px solid #eee;
	padding-bottom: 40px;
}
.single-post:last-of-type{
	padding-bottom: 65px;
}
.read-more a:hover{
	background: #2C3E50;
	border-color: #2C3E50;
	color: #fff;
}
.post-pagination{
	margin-top: 40px;
	margin-bottom: 80px;
	display: inline-block;
	width: 100%;
}
.post-pagination a{
	font-size: 12px;
	color: #444444;
	text-transform: uppercase;
}
.post-pagination ul li a{
	font-size: 14px;
	color: #444444;
}
.post-pagination ul li.current a{
	font-weight: bold;
	cursor: default;
	text-decoration: none;
}

/*******Footer********/
.footer{
	background: #2c3e50;
	color: #fff;
	padding-top: 53px;
}
.footer h3{
	font-size: 24px;
	text-transform: uppercase;
	margin-bottom: 30px;
}
.footer p{
	font-size: 18px;
}
.footer input{
	width: 100%;
	padding: 10px;
	color: #fff;
	margin-top: 10px;
	border: 1px solid #495e74;
	background: #2c3e50;
}
.footer input[type="submit"] {
	font-size: 14px;
	color: #bbbbbb;
	text-transform: uppercase;
	background: #3a4e62;
	border: 0;
	margin-bottom: 20px;
	transition: all .5s ease 0s;
	-webkit-transition: all .5s ease 0s;
	-moz-transition: all .5s ease 0s;
	-o-transition: all .5s ease 0s;
}
.footer input[type="submit"]:hover{
	background: #253544;
}
.footer a{
	font-size: 18px;
	color: #bbbbbb;
	text-decoration: underline;
	margin-top: 20px;
	margin-bottom: 8px;
	display: inline-block;
	transition: all .5s ease 0s;
	-webkit-transition: all .5s ease 0s;
	-moz-transition: all .5s ease 0s;
	-o-transition: all .5s ease 0s;
}
.footer a:hover{
	color: #fff;
}
.socials a i.fa{
	font-size: 20px;
	color: #fff;
	padding: 10px;
	border: 1px solid #495e74;
	border-radius: 50%;
	width: 40px;
	height: 40px;
	margin: 0 5px;
	transition: all .5s ease 0s;
	-webkit-transition: all .5s ease 0s;
	-moz-transition: all .5s ease 0s;
	-o-transition: all .5s ease 0s;
}
.footer a i.fa-facebook:hover{
	background: #274DA3;
	border-color: #274DA3;
}
.footer a i.fa-twitter:hover{
	background: #00ACED;
	border-color: #00ACED;
}
.footer a i.fa-instagram:hover{
	background: #3E6B94;
	border-color: #3E6B94;
}
.footer a i.fa-linkedin:hover{
	background: #0077B5;
	border-color: #0077B5;
}
.footer a i.fa-google-plus:hover{
	background: #D54831;
	border-color: #D54831;
}
.instagram-photos a{
	margin-bottom: 8px;
	margin-left: 5px;
	margin-top: 0;
}
.footer-bottom{
	border-top: 1px solid #495e74;
}
.footer-bottom p{
	font-size: 14px;
}
.footer-bottom a{
	text-transform: capitalize;
	text-decoration: none;
	font-size: 14px;
}
.fa-arrow-up{
	margin-right: 15px;
	padding: 7px;
	border-radius: 50%;
	transition: all .5s ease 0s;
	-webkit-transition: all .5s ease 0s;
	-moz-transition: all .5s ease 0s;
	-o-transition: all .5s ease 0s;
}
.fa-arrow-up:hover{
	background: #253544;
}


/*****************Works page******************/
.works{
	padding-top: 50px;
	padding-bottom: 50px;
}
.works h2, .about h2, .contact h2{
	font-size: 24px;
	color: #2c3e50;
	text-transform: uppercase;
	font-weight: bold;
}
.works ul li{
	font-size: 14px;
	color: #2c3e50;
	text-transform: uppercase;
	padding: 10px 20px;
	text-decoration: none;
	border: 1px solid #dddddd;
	margin: 23px 6px;
	display: inline-block;
	cursor: pointer;
	transition: all .5s ease 0s;
	-webkit-transition: all .5s ease 0s;
	-moz-transition: all .5s ease 0s;
	-o-transition: all .5s ease 0s;
}
.works ul li:hover{
	background: #2c3e50;
	border-color: #2c3e50;
	color: #fff;
}
.works ul li.active{
	background: #2c3e50;
	border-color: #2c3e50;
	color: #fff;
}
.single-work img{
	width: 100%;
	height: 100%;
}
.single-work{
	position: relative;
    height:200px;
	width:300px;
	margin-bottom:20px;
	overflow: hidden;
    border: 3px groove white;
}
.overlay{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgba(44, 62, 80, 0.76);
	margin-top: -400px;
	transition: all 0.5s ease 0s;
	-webkit-transition: all 0.5s ease 0s;
	-moz-transition: all 0.5s ease 0s;
	-o-transition: all 0.5s ease 0s;
}
.single-work:hover .overlay{
	margin-top: 0;
}
.overlay h3{
	font-size: 18px;
	color: #fff;
	text-transform: uppercase;
	margin-top: 25%;
	margin-bottom: 10px;
}
.overlay a i.fa{
	font-size: 25px;
	color: #fff;
	padding: 10px;
}
.overlay a i.fa:focus{
	outline: none;
}
.modal-dialog {
    width: 100% !important;
    height: 100% !important;
    margin-top: 0 !important;
}
.modal-header{
	border: none;
}
.modal-header h4{
	font-size: 30px;
	color: #444444;
	text-transform: uppercase;
}
.modal-header .close{
	font-size: 70px;
}
.modal-content{
	border-radius: 0;
	border: 0;
}
.modal-body img{
	margin-bottom: 35px;
}
.modal-body p{
	font-size: 18px;
	color: #444444;
	text-align: left;
}
.modal-body ul{
	display: inline-block;
	border: 1px solid #dddddd;
	margin-bottom: 30px;
}
.modal-body ul li{
	border: none;
	margin: 0;
	cursor: inherit;
	border-right: 1px solid #dddddd;
	font-style: italic;
	text-transform: inherit;
	padding: 15px 20px;
	font-size: 16px;
	line-height: 1;
}
.modal-body ul li:last-child{
	border: none;
}
.modal-body ul li:hover{
	background: inherit;
	color: inherit;
	border-color: inherit;
}
.modal-footer{
	text-align: center;
	border: none;
}
.works .mix{
    display: none;
}

/********about page*********/
.about{
	padding-top: 50px;
	padding-bottom: 50px;
}
.about span{
	font-size: 17px;
	font-weight: bold;
	margin-bottom: 20px;
	display: inline-block;
}
.about p{
	font-size: 18px;
	color: #444444;
	margin-top: 20px;
	text-align: left;
}

/******Contact Page*******/
.contact{
	padding-top: 50px;
	padding-bottom: 50px;
}
.contact span{
	font-size: 17px;
	font-weight: bold;
	margin-bottom: 20px;
	display: inline-block;
}
.contact select{
	margin: auto;
}
.contact input, .contact select, .contact textarea{
	margin-top: 15px;
}
.contact input[type="submit"] {
    font-size: 14px;
    color: #fff;
    text-transform: uppercase;
    background: #3a4e62;
    border: 0;
    margin-bottom: 20px;
    transition: all .5s ease 0s;
    -webkit-transition: all .5s ease 0s;
    -moz-transition: all .5s ease 0s;
    -o-transition: all .5s ease 0s;
}
.contact input[type="submit"]:hover{
	background: #253544;
}
.form-control{
	height: 45px;
}
/*********Responsive styles*********/
@media screen (max-width: 940px) {
    .mb-css {
        width: 620px;
    }
}
/* sm */
 @media (min-width: 768px) and (max-width: 991px) {
	.footer{
		text-align: center;
	}
	.footer-menu{
		text-align: center;
	}
	.footer-menu ul{
		display: inline-block;
	}
}
/* xs */
@media (min-width: 480px) and (max-width: 767px) {
	.footer{
		text-align: center;
	}
	.footer-menu{
		text-align: center;
	}
	.footer-menu ul{
		display: inline-block;
	}
	ul.nav{
		display: block;
	}
	.header h4{
		font-size: 12px;
	}
	.navbar-collapse{
		background: #2E4151;
		text-align: left;
		border: 0;
	}
	.navbar-toggle{
		float: none;
		margin-right: 0;
		border: 0;
	}
	.navbar-default .navbar-toggle .icon-bar{
		background: #fff;
	}
	.navbar-default .navbar-toggle:hover{
	    background-color: #2E4151;
	}
	ul.navbar li a:hover, ul.navbar li a.active, .navbar-default .navbar-nav>li>a:hover, .navbar-default .navbar-nav>li>a.active{
		border-bottom: 1px solid #fff;
	}
}
/* XS Portrait */
@media (max-width: 479px) {

	ul.navbar li a {
	    font-size: 10px;
	    color: #fff;
	    margin: 0 5px;
	}
	ul.nav{
		display: block;
	}
	.header h4{
		font-size: 12px;
	}
	.navbar-collapse{
		background: #2E4151;
		text-align: left;
		border: 0;
	}
	.navbar-toggle{
		float: none;
		margin-right: 0;
		border: 0;
	}
	.navbar-default .navbar-toggle .icon-bar{
		background: #fff;
	}
	.navbar-default .navbar-toggle:hover{
	    background-color: #2E4151;
	}
	.footer h3{
		font-size: 18px;
	}
	.socials a i.fa{
		margin: 0;
	}
	.footer{
		text-align: center;
	}
	.footer-menu{
		text-align: center;
	}
	.footer-menu ul{
		display: inline-block;
	}
	ul.navbar li a:hover, ul.navbar li a.active, .navbar-default .navbar-nav>li>a:hover, .navbar-default .navbar-nav>li>a.active{
		border-bottom: 1px solid #fff;
	}
}

.menu_panel {
	z-index: 5;
	position: absolute;
	color: white;
	top: 53px;
	left: 10px;
	width: 280px;
	height: 370px;
	background-color: #2e2e2e;
	border: 3px groove grey;
	z-index: 100;
}

@media screen and (max-width: 600px) {
	.menu_panel {
		font-size: 11px !important;
	}

		.menu_panel select,
		.menu_panel input.menu_panel input {
			max-width: 100%;
		}
		.menu_panel .strategy_radiobutton,
		.menu_panel .prediction_amount_txtbox {
			font-size: 11px !important;
		}

		.menu_panel .strategy_radiobutton {
			line-height: 1.2 !important;
		}
}


.login_panel_class {
	z-index: 6;
	position: absolute;
	color: white;
	top: 53px;
	left: 10px;
	width: 280px;
	height: 370px;
	border: 3px groove grey;
}


.login_label_class {
	z-index: 6;
	width: 220px;
	top: 40px;
	left: 25px;
	font-size: 14px;
	color: white;
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
}

.login_label_class_new {
	z-index: 6;
	top: 40px;
	left: 25px;
	font-size: 14px;
	color: white;
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
}




.login_buttons_class {
	z-index: 6;
	color: white;
	font-weight: bold;
	left: 35px;
	bottom: 20px;
	background: linear-gradient(135deg, hsla(139, 75%, 62%, 1), hsla(239, 75%, 62%, 1));
	border: 2px groove grey;
	width: 200px;
	height: 40px;
	border: 1px groove white;
	font-family: Arial, Helvetica, sans-serif;
}

.login_buttons_class_new{
	z-index: 6;
	color: white;
	font-weight: bold;
	background: linear-gradient(135deg, hsla(139, 75%, 62%, 1), hsla(239, 75%, 62%, 1));
	border: 2px groove grey;
	width: 200px;
	height: 40px;
	border: 1px groove white;
	font-family: Arial, Helvetica, sans-serif;
}


.message_panel {
	z-index: 7;
	position: absolute;
	color: white;
	top: 100px;
	left: 10px;
	width: 280px;
	height: 190px;
	background-color: #2e2e2e;
	border: 3px groove grey;
}


.close_mybtn {
	background-image: url(../images/close_button.png);
	background-size: cover;
	z-index: 1;
	top: 0px;
	right: 0px;
	position: absolute;
	width: 20px;
	height: 20px;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	margin: 0;
}

.label_cds{
	color:limegreen;
}
.txtbox_cds {
	position: absolute;
	font-size: 9px;
	border: none;
	outline: none;
	width: 27px;
	background-color: black;
	text-align: center;
}

.txtbox_account {
	background-color: grey;
	color: white;
	z-index: 1;
	width: 100%;
	height: 24px;
	font-size: 9px;
	padding: 3px;
	box-sizing: border-box;
	pointer-events: none; /*(read only)*/
	outline: none;
}

.label_account {
	z-index: 1;
	font-size: 10px;
	color: limegreen;
	text-align: right;
	white-space: nowrap;
}

#settings_table {
	font-size:10px;
	width:265px;
	top:10px;
}

#roulegenius_database_table {
	font-size: 10px;
	width: 265px;
	top: 55px;
}

#own_database_table {
	font-size: 9px;
	width: 260px;
	top:55px;
}

#vip_database_table {
	font-size: 10px;
	width: 265px;
	top: 55px;
}

#strategy_table{
	bottom:60px;
	left:10px;
}
.dropdown_configuration {
	font-size: 9px;
	background-color: black;
	width: 120px;
	height: 18px;
	color: #70c8ff;
	z-index: 3;
}
.dropdown_choose_algorithm {
	font-size: 10px;
	background-color: black;
	width: 170px;
	height: 20px;
	color: #00faff;
	z-index: 3;
	margin-top:5px;
}

.settings_own_button {
	width: 100%;
	background-color: #540000;
	color: white;
	border: 1px groove black;
	margin-bottom: 5px;
}

th{color:gold;font-size:10px;}
td{color:limegreen;}

.strategy_radiobutton {
	cursor: pointer;
	font-size: 10px;
}
.dtb_radiobutton {
	color: #ff8b00;
	width:100px;
}
.strategy_radiobutton label {
	cursor: pointer;
}
.strategy_radiobutton input[type='radio'] {
	cursor: pointer;
	align-items: center;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	box-sizing: border-box;
	background: white;
	outline: 2px solid #333;
	border: 1px solid black;
	width: 14px;
	height: 14px;
	margin-right: 5px;
}


	.strategy_radiobutton input[type='radio']:checked {
		background-color: gold;
	}


	.strategy_radiobutton input[type='radio']:disabled {
		background-color: gray;
	}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/* Firefox */
input[type=number] {
	-moz-appearance: textfield;
}

.prediction_amount_txtbox {
	background-color: black;
	color: white;
	width: 35px;
	height: 20px;
	margin-left:5px;
	border-radius:5px;
	text-align: center;
	font-size: 12px;
	border: none;
	overflow-y: hidden;
	overflow-x: hidden;
}

	.settings_hide_panel {
		position: absolute;
		background-color: #210000;
		opacity: 0.85;
		height: 95px;
	}

#undo_button {
	z-index:1;
	position: absolute;
	width: 22px;
	height: 22px;
	left: 140px;
	top: 377px;
	border: none;
	background-color: transparent;
	background-image: url(../images/undo.png);
	background-repeat: no-repeat;
	background-size: contain;
}
#undo_button:hover {
	background-image: url(../images/undo_red.png);
}

#clear_button {
	z-index: 1;
	position: absolute;
	width: 22px;
	height: 22px;
	left: 115px;
	top: 377px;
	border: none;
	background-color: transparent;
	background-image: url(../images/clear.png);
	background-repeat: no-repeat;
	background-size: contain;
}
#clear_button:hover {
	background-image: url(../images/clear_red.png);
}

.social_buttons {
	position: absolute;
	width:30px;
	height:30px;
	background-repeat:no-repeat;
	background-size:contain;
}

#autobet_button {
	z-index:2;
	position: absolute;
	left: 16px;
	top: 377px;
	padding: 3px;
	font-size: 12px;
	width: 80px;
	height: 25px;
	font-weight: bold;
	background: linear-gradient(to right, #FF512F 0%, #F09819 51%, #FF512F 100%);
	background-size: 200% auto;
	color: white;
	border: 2px groove white;
}
	#autobet_button:hover {
		background-position: right center; /* change the direction of the change here */
		
	}

.menu_button {
	position: absolute;
	background-color: #78290e;
	border: 1px solid #64210a;
	z-index: 2;
	color: #d3d3d3;
	font-weight: bold;
	text-align: center;
	height: 20px;
	line-height: 18px;
	font-size: 12px; /* base size, poi ridotto da media query */
	white-space: nowrap; /* evita che vada a capo */
	overflow: hidden;
	text-overflow: ellipsis;
}

@media screen and (max-width: 600px) {
	.menu_button {
		font-size: 10px !important;
		padding: 0 !important;
	}
}


.menu_button:hover {
	color: lime;
	border-bottom: 1px solid lime !important;
}


.message_label_class {
	position: absolute;
	width: 200px;
	top: 40px;
	left: 35px;
	font-size: 10px;
	color: white;
	text-align: center;
}
.accept_mybtn {
	position: absolute;
	left: 90px;
	bottom: 20px;
	background-color: rebeccapurple;
	border: 2px groove grey;
}

#show_secrets_textbox {
	background-color: black;
	left: 5px;
	top: 60px;
	width: 260px;
	height: 250px;
	overflow: auto;
	color: white;
	font-size: 9px;
	resize: none;
	cursor: auto;
}

.occurancy_label {
	z-index:2;
	font-size: 8px;
	color: white;
}