html { /*background: url(../CSS/images/photo_bg2.jpg) no-repeat center center fixed; */ -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }
/* Typography */
h1#title { font-family: 'Roboto Slab', serif; font-weight: 300; font-size: 3.2em; color: white; text-shadow: 0 0 10px rgba(0,0,0,0.8); margin: 0 auto; padding-top: 180px; max-width: 300px; text-align: center; position: relative; top: 0px; }

    h1#title span span { font-weight: 400; }

h2 { text-transform: uppercase; color: white; font-weight: 400; letter-spacing: 1px; font-size: 1.4em; line-height: 2.8em; }

a { text-decoration: none; color: #666; } 

    a:hover { color: #aeaeae; }
     
p.small { font-size: 0.8em; margin: 20px 0 0; }
.form-group .icon_cng { line-height: initial !important; }

/* Layout */
.container { margin: 0; }

.top { margin: 0; padding: 0; width: 100%; background: -moz-linear-gradient(top, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(0,0,0,0.6) 0%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(0,0,0,0.6) 0%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#99000000', endColorstr='#00000000',GradientType=0 ); /* IE6-9 */ }

.login-box { background-color: white; max-width: 340px; margin: 0 auto; position: relative; top: 50px; padding-bottom: 30px; border-radius: 5px; box-shadow: 0 5px 50px rgba(0,0,0,0.4); text-align: center; }

    .login-box .box-header { background-color: #665851; margin-top: 0; border-radius: 5px 5px 0 0; }

    .login-box label { font-weight: 700; font-size: .8em; color: #888; letter-spacing: 1px; text-transform: uppercase; line-height: 2em; }

    .login-box input { margin-bottom: 20px; padding: 8px; border: 1px solid #ccc; border-radius: 2px; font-size: .9em; color: #888; }

        .login-box input:focus { outline: none; border-color: #665851; transition: 0.5s; color: #665851; }

    .login-box button { margin-top: 0px; border: 0; border-radius: 2px; color: white; padding: 10px; text-transform: uppercase; font-weight: 400; font-size: 0.7em; letter-spacing: 1px; background-color: #665851; cursor: pointer; outline: none; }

        .login-box button:hover { opacity: 0.7; transition: 0.5s; }

        .login-box button:hover { opacity: 0.7; transition: 0.5s; }

.selected { color: #665851 !important; transition: 0.5s; }

/* Animation Delay */
#logo { background: url("../CSS/images/TTlogo.png") no-repeat center center fixed; -webkit-animation-duration: 1s; -webkit-animation-delay: 2s; }

.login-box { -webkit-animation-duration: 1s; -webkit-animation-delay: 1s; }

.TileDiv { width: 150px; height: 200px; background: #333; float: left; margin: 10px; border: 1px solid #ccc; border-radius: 2px; }



.Tilecontainer { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; width: 150px; height: 100px; margin: 18px; border: none; font: normal 16px/1 "Times New Roman", Times, serif; color: rgba(255,255,255,1); text-align: center; -o-text-overflow: ellipsis; text-overflow: ellipsis; background: url("http://enjoycss.com/bg-img/default/7_3.png"), rgb(150,150,150); background-position: 50% 50%; -webkit-background-origin: padding-box; background-origin: padding-box; -webkit-background-clip: border-box; background-clip: border-box; -webkit-background-size: auto auto; background-size: auto auto; -webkit-box-shadow: 0 3px 18px -8px rgba(34,0,255,0.91); box-shadow: 0 3px 18px -8px rgba(34,0,255,0.91); -webkit-transition: font-size 200ms cubic-bezier(0.42, 0, 0.58, 1) 10ms; -moz-transition: font-size 200ms cubic-bezier(0.42, 0, 0.58, 1) 10ms; -o-transition: font-size 200ms cubic-bezier(0.42, 0, 0.58, 1) 10ms; transition: font-size 200ms cubic-bezier(0.42, 0, 0.58, 1) 10ms; }


.TileDiv2 { width: 100px; height: 60px; background: #333; float: left; margin: 2px; }
.TileDiv3 { width: 250px; float: left; margin: 2px; }

.IconTile { background: url("../CSS/images/TileIcon.PNG") no-repeat; margin: 0; color: #666; }
/*=======css======*/
@media screen and (max-width:640px) {
    .login_box { width: 100% !important; padding: 20px; margin: 4% auto !important; }
    
}

@media screen and (min-width:641px) and (max-width:1250px) {
    .login_box { width: 50% !important; padding: 20px; margin: 4% auto !important; }
}

@font-face { font-family: 'Aardvark Cafe'; src: url('/fonts/AardvarkCafe.eot'); src: url('/fonts/AardvarkCafe.eot?#iefix') format('embedded-opentype'), url('/fonts/AardvarkCafe.woff') format('woff'), url('/fonts/AardvarkCafe.ttf') format('truetype'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'Amerigo Md BT'; src: url('/fonts/AmerigoBT-MediumA.eot'); src: url('/fonts/AmerigoBT-MediumA.eot?#iefix') format('embedded-opentype'), url('/fonts/AmerigoBT-MediumA.woff') format('woff'), url('/fonts/AmerigoBT-MediumA.ttf') format('truetype'); font-weight: 500; font-style: normal; }

.bg_all { background: #f4f4f4 url(../images/bg_login.jpg) no-repeat; }
.login_box { width: 30%; margin: 12% auto; }
.logo_login { text-align: center; }
    .logo_login img { max-height: 100%; max-width: 100%; }
.main_form { padding-top: 40px; }
    .main_form h3 { padding-bottom: 20px; font-family: 'Aardvark Cafe'; text-align: center; font-size: 36px; color: #726f70; }
.form_login .form-group { position: relative;  }
.dflex{display:flex;}
.ssbtn .btn {background: #dcdcdc;
    transition: all .5s ease-in-out;
    cursor: pointer;
    height: 51px;
  
  
    border: 1px solid #dcdcdc;
    padding: 0px 26px;
    border-bottom: 5px solid #afafaf;
    font-size: 14px;
    box-shadow: inherit;}
.form_login .input_box { border: 1px solid #ddd; color: #757575; width: 100%; /*font-family: 'Amerigo Md BT';*/ padding-left: 48px; height: 48px; background: #fff; border-radius: 0; font-size: 13px; }
.form_login .form-group .input_box::placeholder { color: #757575; }
.form_login .form-group .icon_cng { position: absolute; top: 19px; line-height: normal; left: 15px; font-size: 17px; color: #a0a2a5; border-right: 1px solid #a0a2a5; padding-right: 10px; }
.form_login .box_cnt { text-align: center; margin-top: 8px; margin-bottom: 10px; }
.form_login .mb0 { margin-bottom: 0; }
.box_cnt .checkbox label::before { top: 2px; }
.box_cnt label { color: #252525; font-size: 14px; /*font-family: 'Amerigo Md BT';*/ padding-left: 2px; }
.box_cnt .checkbox { padding-left: 0; }
.box_cnt .checkbox-success input[type="checkbox"]:checked + label::after, .checkbox-success input[type="radio"]:checked + label::after { color: #fff; top: 2px; left: -1px; }
.btn_box { text-align: center; }
.btn_box1 { background: #b5121b; transition: all .5s ease-in-out; cursor: pointer; height: 51px; font-size: 20px; color: white; border: 1px solid #b5121b; padding: 0px 60px; border-bottom: 5px solid #a30811; }
    .btn_box1:hover { border: 1px solid #b5121b; background: #a90710; border-bottom: 5px solid #a30811; }
.card-block h4 { margin-bottom: 5px; }
.btn_box_n { border-radius: 50px; box-shadow: 5px 5px 0px #575757; padding: 12px 36px; margin-bottom: 10px; }
/*.btn_box_n:hover{background:#c40e18 !important; border-radius:0; box-shadow:5px 5px 0px #000;}
.btn_box_n:focus{background:#c40e18 !important; border-radius:0; box-shadow:5px 5px 0px #000;}
.form_login .input_box:focus{border-bottom:1px solid #ddd !important; box-shadow:none !important;}*/
.navbar-brand { padding: 0 !important; }
.box-cnt { font-family: 'Poppins', sans-serif; width: 791px; margin: 2% auto; }
.text-check h1 { color: #424242; font-size: 23px; font-weight: 600; margin: 40px 0px 20px 0px; line-height: 33px; }
.text-check p { color: #424242; font-size: 14px; margin-bottom: 7px; }
.dropcheck { margin: 40px 0px; }
.brder-box { border: 2px solid #a10e1f; box-shadow: 0px 10px 20px 0px rgba(199, 199, 199, 0.75); padding: 20px; }
.dropcheck .radio label { font-weight: 600; }
.boxarc { width: 76%; margin-bottom: 30px; padding-left: 13px; }
    .boxarc .panel-group { padding-left: 40px; }
    .boxarc .radio label::before { top: 2px; }
    .boxarc .radio label::after { top: 5px; }
.btn-ins, .btn-sb { margin: 10px 0px; background: #a10e1f; border: 1px solid #a10e1f; padding: 8px 17px; display: inline-block; color: #fff; text-transform: uppercase; font-size: 14px; transition: all .5s ease-in-out; }
.btn-ins, .btn-gray { margin: 10px 0px; background: #888; border: 1px solid ; padding: 8px 17px; display: inline-block; color: #fff; text-transform: uppercase; font-size: 14px; transition: all .5s ease-in-out; }
    .btn-ins:hover, .btn-sb:hover { text-decoration: none; background: white; border: 1px solid #a10e1f; color: #a10e1f; }
.boxarc .panel-body p { font-size: 15px; color: #545454; }
.boxarc .radio label::before { border: 2px solid #cccccc; }
.mobile-input{width:100%;}
.mobile-input input { border: 1px solid #e08c8c; padding: 7px 10px; }
.mobile-input span { font-size: 13px; }
.box-code { margin-top: 15px; }
.qrbox { width: 75px; display: inline-block; float: left; margin-right: 15px; }
.text-qr { width: calc(100% - 75px); }
.text-qr h3{word-wrap: break-word; font-size:18px;}
.snt-qr { display: block; font-size: 14px; color: #665851; margin: 16px 0px; }
    .snt-qr a { color: #ca2d2d; }
.later-box .btn-ins { font-size: 12px; padding: 5px 15px; border-radius: 50px; text-decoration:none;}

.box-cnt .logo_login { text-align: left; box-shadow: 0px 10px 20px 0px rgba(218, 208, 208, 0.75); padding: 20px; }




 .colum-hover a { display: block; border: 1px solid #000; padding: 20px; text-align: center; transition: all .5s ease-in-out; }
       .img-box-colum{height: 100px; overflow:hidden; margin:20px 0px;}    
        .colum-hover a img { max-height: 100%; max-width: 100%;  display: block; margin: auto;  }
            .colum-hover a span, .colum-hover a p { text-transform: uppercase; }
            .colum-hover a span { font-weight: bold; font-size: 16px; color: #000; }
            .colum-hover a p { font-size: 12px; color: #7b7b7b; line-height: 16px; }            
            .colum-hover a:hover {border:1px solid #c00000; background: #c00000; text-decoration: none; }
                .colum-hover a:hover span, .colum-hover a:hover p { color: #ffffff; text-decoration: none;transition: all .5s ease-in-out; }
    .colum-hover a .cluimg1, .colum-hover a .cluimg2 { transition: all .5s ease-in-out; }
      .colum-hover a .cluimg2 { opacity: 0;  }
      .colum-hover a:hover .cluimg1 { opacity: 0; height:0;}
       .colum-hover a:hover .cluimg2 { opacity: 1 !important;  }













@media screen and (max-width:640px) {
    .text-check h1 { font-size: 19px; line-height: 26px; }
    .text-check p { font-size: 13px; }
    .dropcheck .radio label { font-size: 15px; }
    .boxarc .panel-body p { font-size: 13px; }
    .btn_box1{    padding: 0px 28px;}
    .fildw input{width:55%;}
}

@media screen and (max-width:992px) {
    .login_box { width: 100% !important; padding: 20px; margin: 4% auto !important; }
    .box-cnt { width: 92%; }
    .boxarc { width: 100%; }
    .text-qr { width: 100%; }
}
.btn-default {
    background: #2BBBAD;
    color: white;
}
.btn-default:hover {
    background-color: #30cfc0 !important;
    color: white !important;
}