@font-face {
	font-family: 'myriadpro';
	src: url('../fonts/myriadpro.eot');
	src: local('fonts'), url('../fonts/myriadpro.woff') format('woff'), url('../fonts/myriadpro.ttf') format('truetype');
}

.fontsforweb {
	font-family: 'myriadpro' !important; font-size: 30px; color: #606060;
}
body { padding: 0; margin:0; width:100%; height:100%; background:#fff;}
article { width: 100%;}
section { width: 100%; text-align: center; padding: 0;}


.box-3-col { width:auto; height:auto;}
.col { width: 33.333333%; height: auto; float: left;}
.box { width:96%; margin: 2%; height: auto; background:linear-gradient(135deg,#fff,#909090,#ffffff);}

@media screen and (max-width: 767px) {
    .col { width: 100%; height: auto; float: left;}
    .box { width:96%; margin: 2%; height: auto; background:linear-gradient(135deg,#fff,#909090,#ffffff);}
}
@media screen and (min-width: 767px) and (max-width: 900px){
    .col { width: 50%; height: auto; float: left;}
    .box { width:96%; margin: 2%; height: auto; background:linear-gradient(135deg,#fff,#909090,#ffffff);}
}

/*
************************************************************************************************************************
|common CSS
|29 Jun 2017
|Engr. Ram Krishna Paul
************************************************************************************************************************
*/

/*==Clearing*/
.clr { clear: both !important;}

/*==Width*/
.width-100-prcnt { width: 100% !important; margin: auto;}
.width-95-prcnt { width: 95% !important; margin: auto;}
.width-90-prcnt { width: 90% !important; margin: auto;}
.width-85-prcnt { width: 85% !important; margin: auto;}
.width-80-prcnt { width: 80% !important; margin: auto;}
.width-75-prcnt { width: 75% !important; margin: auto;}

/*==anchor*/
.lnk-1 { text-decoration:none; background:transparent; font-size:3rem; position:relative; overflow:hidden; transition:ease-in-out 0.7s; }
.lnk-1:focus,.lnk-1:active {color: #fff; text-decoration: none; border: none;}
.lnk-1:hover { text-decoration: none; color: white; background: transparent; font-size: 3rem;}
.lnk-1:hover .atext { text-decoration: none; color: white; background: transparent; font-size: 3rem; -ms-transition: ease-in-out 0.8s; transition: ease-in-out 0.8s; -ms-transform: translateY(-40%); transform: translateY(-40%);}


/*==Hover Overlay Style*/
div.overlap { position: absolute; bottom: 0; left: 0; right: 0; background-color: #008CBA; overflow: hidden; width: 0; height: 100%; transition: .5s ease;}
div.overlap div.text { white-space: nowrap; width: 90%;	color: white; font-size: 20px; position: absolute; overflow: hidden; top: 50%; left: 50%; transform: translate(-50%, -50%);	-ms-transform: translate(-50%, -50%);}
.ovr:hover div.overlap { display: block; height: 100%; width: 100%; text-align: center; bottom: 0;background: rgba(0,0,0,0.6); font-size: 3rem;}

div.overlap-1 { position: absolute; bottom: 0; left: 0; right: 0; background-color: #008CBA; overflow: hidden; width: 100%; height: 0; transition: .5s ease;}
div.overlap-1 div.text { /*white-space: nowrap;*/ background: transparent; width: 90%; color: white; font-size: 20px; position: absolute; overflow: hidden; top: 50%; left: 50%; transform: translate(-50%, -50%);	-ms-transform: translate(-50%, -50%);}
.ovr:hover div.overlap-1 { display: block; height: 50%; width: 100%; text-align: center; bottom: 0;background: rgba(0,0,0,0.6); font-size: 3rem;}

/*==Display*/
.block {display: block;}

/*==Positions*/
.absolute { position: absolute !important;}
.relative { position: relative !important;}
.fixed { position: relative !important;}
.static { position: static !important;}
.inherit { position: inherit !important;}

.position-50-50-prcnt { left: 30%; top: 10%; transform: rotate(16deg)}


/*==Rotation*/
.rotate-15 { transform: rotate(15deg);}

/*==Background*/
.bg-green { background: green;}
.bg-yellow { background: yellow;}
.bg-yellowgreen { background: yellowgreen;}
.bg-greenyellow { background: greenyellow;}
.bg-yellow-1 { background: #dddd00;}
.bg-gray { background: gray;}
.bg-red { background: red;}
.bg-blue { background: blue;}
.bg-skyblue { background: skyblue;}
.bg-white { background: white;}

.bg-yellow-grad { background: linear-gradient(145deg, yellow 50%, #fcfc00 50%);}
.bg-green-grad { background: linear-gradient(145deg, #458945 50%, #568956 50%);}
.bg-white-grad { background: linear-gradient(-145deg, white 50%, #f6f6f6 50%);}
.bg-white-grad-1 { background: linear-gradient(145deg, white 50%, #f6f6f6 50%);}
.bg-yellow-grad-opacity { background: linear-gradient(145deg, rgba(255,255,0,0.9) 50%, rgba(244,244,0,0.9) 50%);}
.bg-yellow-grad-opacity-1 { background: linear-gradient(145deg, rgba(255,255,0,0.8) 50%, rgba(244,244,0,0.9) 50%);}
.bg-white-grad-opacity { background: linear-gradient(-145deg, rgba(255,255,255,0.9) 50%, rgba(244,244,244,0.9) 50%);}
.bg-white-grad-opacity-1 { background: linear-gradient(-145deg, rgba(255,255,255,0.8) 50%, rgba(244,244,244,0.8) 50%);}
.bg-green-grad-opacity { background: linear-gradient(-145deg, rgba(255,255,255,0.9) 50%, rgba(244,244,244,0.9) 50%);}
.bg-green-grad-opacity-1 { background: linear-gradient(-145deg, rgba(200,255,200,0.8) 50%, rgba(180,244,180,0.8) 50%);}

.bg-multi-yellow {
	background:
		linear-gradient(-125deg, rgba(255,255,0,0.5) 65%, rgba(244,244,0,0.5) 35%),
		linear-gradient(145deg, rgba(255,255,0,0.5) 50%, rgba(244,244,0,0.5) 50%),
		linear-gradient(135deg, rgba(244,200,0,0.9) 50%, rgba(255,255,0,0.9) 50%);
		/*linear-gradient(-135deg, rgba(100,200,0,0.5) 70%, rgba(255,255,0,0.5) 30%);*/
}

/*==Notification*/
small { color:darkred}

/*==Font Color*/
.white {color: #fff;}
.black {color: #000;}
.purple {color: #906;}
.green { color: green;}
.green-dark { color: darkgreen;}
.red-dark { color: darkred;}

/*==Padding px*/
.padding-15-px {padding: 15px;}

/*==Padding vh*/
.padding-2vh {padding: 2vh !important;}

/*==Margin vh*/
.margin-2vh {margin: 2vh !important;}
.margin-2vh-0 {margin: 2vh 0 !important;}
.margin-top-2vh {margin-top: 2vh !important;}
.margin-top-3vh {margin-top: 3vh !important;}
.margin-top-4vh {margin-top: 4vh !important;}
.margin-top-5vh {margin-top: 5vh !important;}
.margin-top-6vh {margin-top: 6vh !important;}
.margin-top-7vh {margin-top: 7vh !important;}

.margin-bottom-3vh {margin-bottom: 3vh !important;}
.margin-bottom-4vh {margin-bottom: 4vh !important;}
.margin-bottom-5vh {margin-bottom: 5vh !important;}
.margin-bottom-6vh {margin-bottom: 6vh !important;}

.margin-top-10-prcnt {margin-top: 10%;}
.margin-top-15-prcnt {margin-top: 15%;}
.margin-top-20-prcnt {margin-top: 20%;}
.margin-top-30-prcnt {margin-top: 30%;}
.margin-top-40-prcnt {margin-top: 40%;}

/*==Circle*/
.circle {border-radius: 60%!important;}

/*==Height vh*/
.height-100vh { height: 100vh !important;}
.height-50vh { height: 50vh !important;}
.height-40vh { height: 40vh !important;}
.height-36vh { height: 36vh !important;}
.height-30vh { height: 30vh !important;}
.height-10vh { height: 10vh !important;}

/*Height %*/
.height-100-prcnt { height: 100% !important;}


/*==z-indexing*/
.z-index-11 {z-index: 11;}
.z-index-12 {z-index: 12;}
.z-index-13 {z-index: 13;}
.z-index-14 {z-index: 14;}
.z-index-15 {z-index: 15;}
.z-index-16 {z-index: 16;}
.z-index-17 {z-index: 17;}
.z-index-18 {z-index: 18;}
.z-index-19 {z-index: 19;}
.z-index-20 {z-index: 20;}
.z-index-21 {z-index: 21;}
.z-index-22 {z-index: 22;}
.z-index-23 {z-index: 23;}
.z-index-24 {z-index: 24;}
.z-index-25 {z-index: 25;}

/*==Box Shadow*/
.box-shadow-1 { box-shadow: 0px 5px 10px #101010;}

/*==Text Shadow*/
.text-shadow-1 {text-shadow: #050505 1px 1px 3px}
.text-shadow-2 {text-shadow: #fff 1px 1px 3px}

/*==Border*/
.border-1 { border: 1px solid  darkred;}
.border-6 { border: 6px solid  #505050;}
.border-bottom-1 { border-bottom: 1px solid #dddd00;}
.border-bottom-2 { border-bottom: 1px solid #452323;}
.border-bottom-3 { border-bottom: 1px solid #67bb67;}

/*==None*/
.no-border-radius{border-radius: 0 !important;}
.no-border { border: 0 !important;}

/*==Font Size*/
.size-5-rem { font-size: 5rem;}
.size-4-rem { font-size: 4rem;}
.size-3-rem { font-size: 3rem;}
.size-2-rem { font-size: 2rem;}
.size-1-5-rem { font-size: 1.5rem;}
.size-1-7-rem { font-size: 1.7rem;}
.size-1-8-rem { font-size: 1.8rem;}

/*==Font Weight*/
.bold { font-weight: bold;}


/*=== Google Fonts*/
.goo-anton {font-family: 'Anton', sans-serif;}
.goo-pragati_narrow {font-family: 'Pragati Narrow', sans-serif;}
.goo-fira_sans_condensed {font-family: 'Fira Sans Condensed', sans-serif;}
.goo-palanquin {font-family: 'Palanquin', sans-serif;}
.goo-metrophobic, h1, p {font-family: 'Metrophobic', sans-serif;}
.goo-pt_sans {font-family: 'PT Sans', sans-serif;}
.goo-pattaya {font-family: 'Pattaya', sans-serif;}
.goo-nosifer {font-family: 'Nosifer', cursive;}
.goo-dynalight {font-family: 'Dynalight', cursive;}